tabshift/pocketbase
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

minor screen reader improvements

Browse Source
This commit is contained in:
Gani Georgiev
2026-04-18 22:11:42 +03:00
parent 624c3357be
commit 075e20efae
88 changed files with 298 additions and 256 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ui/src/collections/addCollectionFieldButton.js
View File

@@ -58,7 +58,7 @@ window.app.components.addCollectionFieldButton = function(collection) {
className: "btn block outline",
"html-popovertarget": uniqueId + "_dropdown",
},
t.i({ className: "ri-add-line" }),
t.i({ className: "ri-add-line", ariaHidden: true }),
t.span({ className: "txt" }, "New field"),
),
t.div(
@@ -91,7 +91,7 @@ window.app.components.addCollectionFieldButton = function(collection) {
addNewField(type);
},
},
t.i({ className: def.icon || app.utils.fallbackFieldIcon }),
t.i({ className: def.icon || app.utils.fallbackFieldIcon, ariaHidden: true }),
t.span({ className: "txt" }, def.label || type),
),
);

6
ui/src/collections/collectionChangesConfirmationModal.js
View File

@@ -198,7 +198,7 @@ window.app.modals.openCollectionChangesConfirmation = async function(
{ className: "list-item" },
"Renamed collection ",
t.strong({ className: "label warning" }, oldCollection?.name),
t.i({ className: "ri-arrow-right-line txt-sm" }),
t.i({ className: "ri-arrow-right-line txt-sm", ariaHidden: true }),
t.strong({ className: "label success" }, newCollection?.name || "N/A"),
),
);
@@ -218,7 +218,7 @@ window.app.modals.openCollectionChangesConfirmation = async function(
{ className: "list-item" },
"Renamed field ",
t.strong({ className: "label warning" }, oldField?.name),
t.i({ className: "ri-arrow-right-line txt-sm" }),
t.i({ className: "ri-arrow-right-line txt-sm", ariaHidden: true }),
t.strong({ className: "label success" }, newField.name || "N/A"),
);
});
@@ -316,7 +316,7 @@ window.app.modals.openCollectionChangesConfirmation = async function(
oidc.name,
" host ",
t.strong({ className: "label warning" }, oidc.oldHost),
t.i({ className: "ri-arrow-right-line txt-sm" }),
t.i({ className: "ri-arrow-right-line txt-sm", ariaHidden: true }),
t.strong({ className: "label success" }, oidc.newHost),
t.br(),
t.span(

2
ui/src/collections/collectionFieldsTab.js
View File

@@ -73,7 +73,7 @@ export function collectionFieldsTab(upsertData) {
className: "label handle",
onclick: () => app.modals.openIndexUpsert(upsertData.collection),
},
t.i({ className: "ri-add-line" }),
t.i({ className: "ri-add-line", ariaHidden: true }),
t.span({ className: "txt" }, "New index"),
);
},

1
ui/src/collections/collectionRulesTab.js
View File

@@ -201,6 +201,7 @@ export function collectionRulesTab(upsertData) {
},
t.span({ className: "txt" }, "Additional auth collection rules"),
t.i({
ariaHidden: true,
className: () => (local.showAuthRules ? "ri-arrow-drop-up-line" : "ri-arrow-drop-down-line"),
}),
),

16
ui/src/collections/collectionUpsertModal.js
View File

@@ -381,9 +381,10 @@ function collectionUpsertModal(rawCollection, modalSettings) {
{
type: "button",
className: "btn sm circle transparent",
title: "More options",
"html-popovertarget": uniqueId + "modal-header-dropdown",
},
t.i({ className: "ri-more-line" }),
t.i({ className: "ri-more-line", ariaHidden: true }),
),
t.div(
{
@@ -403,7 +404,7 @@ function collectionUpsertModal(rawCollection, modalSettings) {
app.toasts.success("Collection copied to clipboard!");
},
},
t.i({ className: "ri-braces-line" }),
t.i({ className: "ri-braces-line", ariaHidden: true }),
t.span({ className: "txt" }, "Copy JSON"),
),
t.button(
@@ -425,7 +426,7 @@ function collectionUpsertModal(rawCollection, modalSettings) {
}
},
},
t.i({ className: "ri-file-copy-line" }),
t.i({ className: "ri-file-copy-line", ariaHidden: true }),
t.span({ className: "txt" }, "Duplicate"),
),
t.hr(),
@@ -497,6 +498,7 @@ function collectionUpsertModal(rawCollection, modalSettings) {
),
t.i({
hidden: () => !data.isNew,
ariaHidden: true,
className: "ri-arrow-drop-down-line m-l-auto",
}),
),
@@ -524,6 +526,7 @@ function collectionUpsertModal(rawCollection, modalSettings) {
},
},
t.i({
ariaHidden: true,
className: app.collectionTypes[opt.value]?.icon
|| app.utils.fallbackCollectionIcon,
}),
@@ -606,11 +609,12 @@ function collectionUpsertModal(rawCollection, modalSettings) {
t.button(
{
type: "button",
title: "Save options",
className: () => `btn p-5`,
disabled: () => !data.canSave,
"html-popovertarget": uniqueId + "save_options",
},
t.i({ className: "ri-arrow-up-s-line" }),
t.i({ className: "ri-arrow-up-s-line", ariaHidden: true }),
),
t.div(
{ id: uniqueId + "save_options", className: "dropdown nowrap", popover: "auto" },
@@ -801,7 +805,7 @@ function truncateDropdownItem(data, modalSettings) {
);
},
},
t.i({ className: "ri-eraser-line" }),
t.i({ className: "ri-eraser-line", ariaHidden: true }),
t.span({ className: "txt" }, "Truncate"),
);
}
@@ -907,7 +911,7 @@ function deleteDropdownItem(data, modalSettings) {
);
},
},
t.i({ className: "ri-delete-bin-7-line" }),
t.i({ className: "ri-delete-bin-7-line", ariaHidden: true }),
t.span({ className: "txt" }, "Delete"),
);
}

4
ui/src/collections/collectionViewQueryTab.js
View File

@@ -144,7 +144,7 @@ export function collectionViewQueryTab(upsertData) {
className: "query-state",
ariaDescription: app.attrs.tooltip("Invalid query", "left"),
},
t.i({ className: "ri-error-warning-fill txt-danger" }),
t.i({ className: "ri-error-warning-fill txt-danger", ariaHidden: true }),
),
t.span(
{
@@ -152,7 +152,7 @@ export function collectionViewQueryTab(upsertData) {
className: "query-state",
ariaDescription: app.attrs.tooltip("Valid query", "left"),
},
t.i({ className: "ri-checkbox-circle-fill txt-success" }),
t.i({ className: "ri-checkbox-circle-fill txt-success", ariaHidden: true }),
),
),
app.components.codeEditor({

4
ui/src/collections/collectionsOverviewModal.js
View File

@@ -79,9 +79,10 @@ function collectionsOverviewModal(settings = {}) {
{
type: "button",
className: "btn sm secondary transparent circle modal-close-btn",
title: "Close",
onclick: () => app.modals.close(modal),
},
t.i({ className: "ri-close-line" }),
t.i({ className: "ri-close-line", ariaHidden: true }),
),
),
),
@@ -228,6 +229,7 @@ function rules(data) {
t.div(
{ className: "inline-flex gap-10" },
t.i({
ariaHidden: true,
className: () =>
app.collectionTypes[collection.type]?.icon
|| app.utils.fallbackCollectionIcon,

7
ui/src/collections/collectionsSidebar.js
View File

@@ -191,7 +191,7 @@ export function collectionsSidebar() {
});
},
},
t.i({ className: "ri-add-line" }),
t.i({ className: "ri-add-line", ariaHidden: true }),
t.span({ textContent: "New collection" }),
),
),
@@ -210,7 +210,10 @@ function collectionItem(collection, data) {
title: () => collection.name,
onclick: () => app.store.activeCollection = collection.name,
},
t.i({ className: () => app.collectionTypes[collection.type]?.icon || app.utils.fallbackCollectionIcon }),
t.i({
className: () => app.collectionTypes[collection.type]?.icon || app.utils.fallbackCollectionIcon,
ariaHidden: true,
}),
t.span({ className: "txt" }, () => collection.name),
() => {
if (

3
ui/src/collections/emailTemplateAccordion.js
View File

@@ -50,7 +50,7 @@ export function emailTemplateAccordion(collection, key, propsArg = {}) {
},
t.summary(
null,
t.i({ className: "ri-draft-line" }),
t.i({ className: "ri-draft-line", ariaHidden: true }),
t.span({ className: "txt", textContent: () => props.title }),
() => {
if (!app.utils.getByPath(app.store.errors, key)) {
@@ -58,6 +58,7 @@ export function emailTemplateAccordion(collection, key, propsArg = {}) {
}
return t.i({
ariaHidden: true,
className: "ri-error-warning-fill txt-danger m-l-auto",
ariaDescription: app.attrs.tooltip("Has errors", "left"),
});

4
ui/src/collections/indexUpsertModal.js
View File

@@ -247,7 +247,7 @@ function indexUpsertModal(collection, index = "", settings = {}) {
hidden: () => data.isNew,
type: "button",
className: () => "btn sm circle transparent secondary",
ariaDescription: app.attrs.tooltip("Delete index", "left"),
ariaLabel: app.attrs.tooltip("Delete index", "left"),
onclick: () => {
app.modals.confirm(
"Do you really want to remove the selected index from the collection?",
@@ -255,7 +255,7 @@ function indexUpsertModal(collection, index = "", settings = {}) {
);
},
},
t.i({ className: "ri-delete-bin-7-line" }),
t.i({ className: "ri-delete-bin-7-line", ariaHidden: true }),
),
t.button(
{

2
ui/src/collections/mfaAccordion.js
View File

@@ -23,7 +23,7 @@ export function mfaAccordion(collection) {
},
t.summary(
null,
t.i({ className: "ri-shield-check-line" }),
t.i({ className: "ri-shield-check-line", ariaHidden: true }),
t.span({ className: "txt", textContent: "Multi-factor authentication (MFA)" }),
t.span({
className: () => `label m-l-auto ${data.config.enabled ? "success" : ""}`,

4
ui/src/collections/oauth2/appleOptions.js
View File

@@ -19,7 +19,7 @@ window.app.oauth2.apple = function(providerInfo, namePrefix, data) {
});
},
},
t.i({ className: "ri-key-line" }),
t.i({ className: "ri-key-line", ariaHidden: true }),
t.span({ className: "txt" }, "Generate secret"),
),
);
@@ -226,7 +226,7 @@ function appleSecretGeneratorModal(modalSettings = {}) {
type: "submit",
className: "btn expanded",
},
t.i({ className: "ri-key-line" }),
t.i({ className: "ri-key-line", ariaHidden: true }),
t.span({ className: "txt" }, "Generate secret"),
),
),

3
ui/src/collections/oauth2/oidcOptions.js
View File

@@ -149,7 +149,6 @@ window.app.oauth2.oidc = function(providerInfo, namePrefix, data) {
{ htmlFor: uniqueId + ".extra.jwksURL" },
t.span({ className: "txt" }, "JWKS verification URL"),
t.i({
ariaHidden: true,
className: "ri-information-line link-hint",
ariaDescription: app.attrs.tooltip(
"URL to the public token verification keys.",
@@ -176,7 +175,6 @@ window.app.oauth2.oidc = function(providerInfo, namePrefix, data) {
{ htmlFor: uniqueId + ".extra.issuers" },
t.span({ className: "txt" }, "Issuers"),
t.i({
ariaHidden: true,
className: "ri-information-line link-hint",
ariaDescription: app.attrs.tooltip(
"Comma separated list of accepted values for the iss token claim validation.",
@@ -221,7 +219,6 @@ window.app.oauth2.oidc = function(providerInfo, namePrefix, data) {
t.span({ className: "txt", textContent: "Support PKCE" }),
t.i({
className: "ri-information-line link-hint",
ariaHidden: true,
ariaDescription: app.attrs.tooltip(
"Usually it should be safe to be always enabled as most providers will just ignore the extra query parameters if they don't support PKCE.",
),

14
ui/src/collections/oauth2Accordion.js
View File

@@ -52,7 +52,7 @@ export function oauth2Accordion(collection) {
},
t.summary(
null,
t.i({ className: "ri-profile-line" }),
t.i({ className: "ri-profile-line", ariaHidden: true }),
t.span({ className: "txt", textContent: "OAuth2" }),
t.span({
className: () => `label m-l-auto ${data.config.enabled ? "success" : ""}`,
@@ -118,7 +118,7 @@ export function oauth2Accordion(collection) {
});
}
return t.i({ className: app.utils.fallbackProviderIcon });
return t.i({ className: app.utils.fallbackProviderIcon, ariaHidden: true });
},
),
t.div(
@@ -133,11 +133,12 @@ export function oauth2Accordion(collection) {
{ className: "actions" },
t.button(
{
"type": "button",
"className": "btn secondary transparent sm circle",
type: "button",
title: "Options",
className: "btn secondary transparent sm circle",
"html-popovertarget": providerId + "dropdown",
},
t.i({ className: "ri-more-2-line" }),
t.i({ className: "ri-more-2-line", ariaHidden: true }),
),
t.div(
{
@@ -217,7 +218,7 @@ export function oauth2Accordion(collection) {
});
},
},
t.i({ className: "ri-add-line" }),
t.i({ className: "ri-add-line", ariaHidden: true }),
t.span({ className: "txt " }, "Add provider"),
),
),
@@ -232,6 +233,7 @@ export function oauth2Accordion(collection) {
t.span({ className: "txt" }, "Optional users create fields mapping"),
t.i({
className: () => (data.showMapping ? "ri-arrow-drop-up-line" : "ri-arrow-drop-down-line"),
ariaHidden: true,
}),
),
app.components.slide(

2
ui/src/collections/otpAccordion.js
View File

@@ -23,7 +23,7 @@ export function otpAccordion(collection) {
},
t.summary(
null,
t.i({ className: "ri-time-line" }),
t.i({ className: "ri-time-line", ariaHidden: true }),
t.span({ className: "txt", textContent: "One-time password (OTP)" }),
t.span({
className: () => `label m-l-auto ${data.config.enabled ? "success" : ""}`,

8
ui/src/collections/pageCollections.js
View File

@@ -216,7 +216,7 @@ export function pageCollections(route) {
{
type: "button",
className: "btn circle transparent secondary tooltip-bottom btn-collection-settings",
ariaDescription: app.attrs.tooltip("Collection settings"),
ariaLabel: app.attrs.tooltip("Collection settings"),
onclick: () => {
app.modals.openCollectionUpsert(app.store.activeCollection, {
ontruncate: () => refreshRecordsList(),
@@ -231,7 +231,7 @@ export function pageCollections(route) {
});
},
},
t.i({ className: "ri-settings-3-line" }),
t.i({ className: "ri-settings-3-line", ariaHidden: true }),
),
app.components.refreshButton({
onclick: () => refreshRecordsList(),
@@ -249,7 +249,7 @@ export function pageCollections(route) {
className: "btn outline api-preview-btn",
onclick: () => app.modals.openApiPreview(app.store.activeCollection),
},
t.i({ className: "ri-code-s-slash-line" }),
t.i({ className: "ri-code-s-slash-line", ariaHidden: true }),
t.span({ className: "txt", textContent: "API preview" }),
),
() => {
@@ -263,7 +263,7 @@ export function pageCollections(route) {
className: "btn new-record-btn",
onclick: () => app.modals.openRecordUpsert(app.store.activeCollection),
},
t.i({ className: "ri-add-line" }),
t.i({ className: "ri-add-line", ariaHidden: true }),
t.span({ className: "txt", textContent: "New Record" }),
);
},

2
ui/src/collections/passwordAuthAccordion.js
View File

@@ -45,7 +45,7 @@ export function passwordAuthAccordion(collection) {
},
t.summary(
null,
t.i({ className: "ri-lock-password-line" }),
t.i({ className: "ri-lock-password-line", ariaHidden: true }),
t.span({ className: "txt", textContent: "Identity/Password" }),
t.span({
className: () => `label m-l-auto ${data.config.enabled ? "success" : ""}`,

2
ui/src/collections/providerPickerModal.js
View File

@@ -144,7 +144,7 @@ function providerPickerModal(settings = {}) {
});
}
return t.i({ className: app.utils.fallbackProviderIcon });
return t.i({ className: app.utils.fallbackProviderIcon, ariaHidden: true });
},
),
t.div(

2
ui/src/collections/providerSettingsModal.js
View File

@@ -94,7 +94,7 @@ function providerSettingsModal(providerConfig, settings) {
});
}
return t.i({ className: app.utils.fallbackProviderIcon });
return t.i({ className: app.utils.fallbackProviderIcon, ariaHidden: true });
},
),
t.h6(

2
ui/src/collections/tokenOptionsAccordion.js
View File

@@ -29,7 +29,7 @@ export function tokenOptionsAccordion(collection) {
},
t.summary(
null,
t.i({ className: "ri-key-2-line" }),
t.i({ className: "ri-key-2-line", ariaHidden: true }),
t.span({ className: "txt", textContent: "Token options (invalidate, duration)" }),
),
t.div({ className: "grid sm" }, () => {