From 658ef38e0c365dd846acddd86b45d10aa3fe7f95 Mon Sep 17 00:00:00 2001 From: Luke LaValva Date: Tue, 23 Jan 2024 14:01:14 -0800 Subject: [PATCH] refactor(ts): use AttrString for text instead of string (#2049) --- .../components/ebay-dialog-base/component.ts | 8 +++--- .../components/ebay-notice-base/component.ts | 9 ++++--- .../ebay-tooltip-overlay/component-browser.ts | 4 +-- src/components/ebay-3d-viewer/component.ts | 10 ++++---- src/components/ebay-alert-dialog/index.marko | 3 ++- src/components/ebay-avatar/index.marko | 3 ++- src/components/ebay-breadcrumbs/component.ts | 6 ++--- src/components/ebay-button/index.marko | 5 ++-- src/components/ebay-calendar/component.ts | 13 +++++----- src/components/ebay-calendar/index.marko | 12 ++++----- src/components/ebay-carousel/component.ts | 10 ++++---- .../ebay-character-count/component.ts | 3 ++- .../ebay-confirm-dialog/index.marko | 5 ++-- src/components/ebay-date-textbox/component.ts | 11 ++++---- .../ebay-drawer-dialog/component.ts | 5 ++-- .../ebay-fake-menu-button/component.ts | 5 ++-- .../ebay-filter-menu-button/component.ts | 11 ++++---- src/components/ebay-filter-menu/component.ts | 7 +++--- src/components/ebay-filter/component.ts | 3 ++- .../ebay-icon-button/component-browser.ts | 3 ++- src/components/ebay-icon/component-browser.ts | 5 ++-- src/components/ebay-infotip/component.ts | 4 +-- .../ebay-lightbox-dialog/index.marko | 5 ++-- .../ebay-listbox-button/component.ts | 5 ++-- src/components/ebay-listbox/component.ts | 6 ++--- src/components/ebay-menu-button/component.ts | 25 +++++++++---------- src/components/ebay-pagination/component.ts | 7 +++--- .../ebay-progress-spinner/index.marko | 3 ++- .../ebay-progress-stepper/index.marko | 3 ++- src/components/ebay-section-title/index.marko | 3 ++- src/components/ebay-select/component.ts | 3 ++- src/components/ebay-skeleton/index.marko | 3 ++- .../ebay-star-rating-select/component.ts | 3 ++- src/components/ebay-star-rating/index.marko | 3 ++- .../ebay-textbox/component-browser.ts | 5 ++-- .../ebay-toggle-button/component.ts | 6 ++--- src/components/ebay-video/component.ts | 9 ++++--- 37 files changed, 129 insertions(+), 105 deletions(-) diff --git a/src/components/components/ebay-dialog-base/component.ts b/src/components/components/ebay-dialog-base/component.ts index 5e26516ea..9b6abc83a 100644 --- a/src/components/components/ebay-dialog-base/component.ts +++ b/src/components/components/ebay-dialog-base/component.ts @@ -1,6 +1,6 @@ import * as keyboardTrap from "makeup-keyboard-trap"; import * as screenReaderTrap from "makeup-screenreader-trap"; -import type { AttrClass } from "marko/tags-html"; +import type { AttrClass, AttrString } from "marko/tags-html"; import * as bodyScroll from "../../../common/body-scroll"; import * as eventUtils from "../../../common/event-utils"; import transition from "../../../common/transition"; @@ -17,9 +17,9 @@ interface DialogBaseInput extends Omit, `on${string}`> { } >; "class-prefix"?: string; - "close-button-text"?: string; + "close-button-text"?: AttrString; "close-button-class"?: AttrClass; - "a11y-close-text"?: string; + "a11y-close-text"?: AttrString; "close-button"?: Marko.Renderable; "is-modal"?: boolean; "ignore-escape"?: boolean; @@ -42,7 +42,7 @@ interface DialogBaseInput extends Omit, `on${string}`> { focus?: string; prevButton?: WithNormalizedProps< Omit, `on${string}`> & { - "a11y-text"?: string; + "a11y-text"?: AttrString; } >; "on-open"?: (event: Event) => void; diff --git a/src/components/components/ebay-notice-base/component.ts b/src/components/components/ebay-notice-base/component.ts index c5b2dc70b..7d09c1209 100644 --- a/src/components/components/ebay-notice-base/component.ts +++ b/src/components/components/ebay-notice-base/component.ts @@ -1,3 +1,4 @@ +import type { AttrString } from "marko/tags-html"; import type { WithNormalizedProps } from "../../../global"; interface NoticeBaseInput @@ -12,15 +13,15 @@ interface NoticeBaseInput "prefix-class"?: string; root?: Marko.Renderable; "no-a11y-label"?: boolean; - "a11y-role-description"?: string; + "a11y-role-description"?: AttrString; icon?: "none"; "icon-class"?: string; "header-root"?: Marko.Renderable; - "a11y-text"?: string; - "a11y-icon-text"?: string; + "a11y-text"?: AttrString; + "a11y-icon-text"?: AttrString; "main-root"?: Marko.Renderable; footer?: Marko.Renderable; - "a11y-dismiss-text"?: string; + "a11y-dismiss-text"?: AttrString; title?: Marko.Input<"title"> & { as?: Marko.Renderable; }; diff --git a/src/components/components/ebay-tooltip-overlay/component-browser.ts b/src/components/components/ebay-tooltip-overlay/component-browser.ts index f16059bde..41c7c5661 100644 --- a/src/components/components/ebay-tooltip-overlay/component-browser.ts +++ b/src/components/components/ebay-tooltip-overlay/component-browser.ts @@ -1,4 +1,4 @@ -import type { AttrClass } from "marko/tags-html"; +import type { AttrClass, AttrString } from "marko/tags-html"; import { typeRoles } from "./constants"; import type { WithNormalizedProps } from "../../../global"; @@ -15,7 +15,7 @@ interface TooltipOverlayInput { id?: string; type: keyof typeof typeRoles; content?: Marko.AttrTag>; - "a11y-close-text"?: string; + "a11y-close-text"?: AttrString; footer?: Marko.AttrTag< Marko.Renderable & { class?: AttrClass; diff --git a/src/components/ebay-3d-viewer/component.ts b/src/components/ebay-3d-viewer/component.ts index a8179a17d..7f0dabbae 100644 --- a/src/components/ebay-3d-viewer/component.ts +++ b/src/components/ebay-3d-viewer/component.ts @@ -1,4 +1,4 @@ -import type { AttrClass } from "marko/tags-html"; +import type { AttrClass, AttrString } from "marko/tags-html"; import { CDNLoader } from "../../common/cdn"; import type { WithNormalizedProps } from "../../global"; @@ -6,11 +6,11 @@ interface ViewerInput { "cdn-url"?: string; version?: string; class?: AttrClass; - "a11y-text"?: string; + "a11y-text"?: AttrString; src?: string; - "error-text"?: string; - "a11y-start-text"?: string; - "a11y-load-text"?: string; + "error-text"?: AttrString; + "a11y-start-text"?: AttrString; + "a11y-load-text"?: AttrString; // TODO: import types from @google/model-viewer instead of // listing manually from https://modelviewer.dev/docs poster?: string; diff --git a/src/components/ebay-alert-dialog/index.marko b/src/components/ebay-alert-dialog/index.marko index 23893c29f..1af922b86 100644 --- a/src/components/ebay-alert-dialog/index.marko +++ b/src/components/ebay-alert-dialog/index.marko @@ -1,8 +1,9 @@ import type { Input as BaseInput } from ""; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; static interface AlertDialogInput extends Omit { - "confirm-text"?: string; + "confirm-text"?: AttrString; "on-open"?: () => void; "on-close"?: () => void; "on-confirm"?: () => void; diff --git a/src/components/ebay-avatar/index.marko b/src/components/ebay-avatar/index.marko index c1bdbfa53..00c747be4 100644 --- a/src/components/ebay-avatar/index.marko +++ b/src/components/ebay-avatar/index.marko @@ -1,13 +1,14 @@ import { processHtmlAttributes } from "../../common/html-attributes"; import { getColorForText } from "./util"; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; static type Size = 32 | 40 | 48 | 56 | 64 | 96 | 128; static interface AvatarInput extends Omit, `on${string}`> { username?: string; color?: string; - "a11y-text"?: string; + "a11y-text"?: AttrString; size?: Size | `${Size}`; img?: Marko.AttrTag, `on${string}`>>; } diff --git a/src/components/ebay-breadcrumbs/component.ts b/src/components/ebay-breadcrumbs/component.ts index 5ff2b7b04..8d6259e14 100644 --- a/src/components/ebay-breadcrumbs/component.ts +++ b/src/components/ebay-breadcrumbs/component.ts @@ -1,13 +1,13 @@ import * as eventUtils from "../../common/event-utils"; import { getMaxWidth } from "../../common/dom"; -import type { AttrClass } from "marko/tags-html"; +import type { AttrClass, AttrString } from "marko/tags-html"; import type { MenuEvent } from "../ebay-menu/component"; import type { WithNormalizedProps } from "../../global"; interface BreadcrumbsInput extends Omit, `on${string}`> { "a11y-heading-tag"?: keyof Marko.NativeTags; - "a11y-heading-text"?: string; - "a11y-menu-button-text"?: string; + "a11y-heading-text"?: AttrString; + "a11y-menu-button-text"?: AttrString; class?: AttrClass; items: Marko.RepeatableAttrTag< Marko.Input<"a"> | (Marko.Input<"button"> & { href: never }) diff --git a/src/components/ebay-button/index.marko b/src/components/ebay-button/index.marko index b27f7a086..35d7e568f 100644 --- a/src/components/ebay-button/index.marko +++ b/src/components/ebay-button/index.marko @@ -1,3 +1,4 @@ +import type { AttrString } from "marko/tags-html"; import { processHtmlAttributes } from "../../common/html-attributes" import type { WithNormalizedProps } from "../../global"; @@ -24,8 +25,8 @@ export interface ButtonInput extends Omit, `on${string}`> "fixed-height"?: boolean; truncate?: boolean; split?: string; - "a11y-text"?: string; - "aria-label"?: string; + "a11y-text"?: AttrString; + "aria-label"?: AttrString; "on-click"?: (event: ButtonEvent) => void; "on-escape"?: (event: ButtonEvent) => void; "on-focus"?: (event: ButtonEvent) => void; diff --git a/src/components/ebay-calendar/component.ts b/src/components/ebay-calendar/component.ts index 7f1eec555..d924b4444 100644 --- a/src/components/ebay-calendar/component.ts +++ b/src/components/ebay-calendar/component.ts @@ -1,3 +1,4 @@ +import type { AttrString } from "marko/tags-html"; import type { WithNormalizedProps } from "../../global"; import { dateArgToISO, @@ -29,12 +30,12 @@ interface CalendarInput { "disable-list"?: (Date | number | string)[]; "link-builder"?: (iso: string) => string | false | null | undefined; "get-a11y-show-month-text"?: (monthName: string) => string; - "a11y-selected-text"?: string; - "a11y-range-start-text"?: string; - "a11y-in-range-text"?: string; - "a11y-range-end-text"?: string; - "a11y-today-text"?: string; - "a11y-disabled-text"?: string; + "a11y-selected-text"?: AttrString; + "a11y-range-start-text"?: AttrString; + "a11y-in-range-text"?: AttrString; + "a11y-range-end-text"?: AttrString; + "a11y-today-text"?: AttrString; + "a11y-disabled-text"?: AttrString; "a11y-separator"?: string; "on-select"?: (event: { iso: DayISO }) => void; "on-focus"?: (event: { iso: DayISO }) => void; diff --git a/src/components/ebay-calendar/index.marko b/src/components/ebay-calendar/index.marko index d7d58873e..2f7e4f965 100644 --- a/src/components/ebay-calendar/index.marko +++ b/src/components/ebay-calendar/index.marko @@ -83,10 +83,10 @@ $ var monthDates = [...Array(numMonths)].map((_, i) => component.getMonthDate(st $ var isRangeEnd = dayISO === state.rangeEnd; $ var isDisabled = component.isDisabled(dayISO); $ var a11yTexts = [""]; - $ if (isSelected) a11yTexts.push(a11ySelectedText); - $ if (isRangeStart) a11yTexts.push(a11yRangeStartText); - $ if (!isRangeStart && !isRangeEnd && isInRange) a11yTexts.push(a11yInRangeText); - $ if (isRangeEnd) a11yTexts.push(a11yRangeEndText); + $ if (a11ySelectedText && isSelected) a11yTexts.push(a11ySelectedText); + $ if (a11yRangeStartText && isRangeStart) a11yTexts.push(a11yRangeStartText); + $ if (a11yInRangeText && !isRangeStart && !isRangeEnd && isInRange) a11yTexts.push(a11yInRangeText); + $ if (a11yRangeEndText && isRangeEnd) a11yTexts.push(a11yRangeEndText); component.getMonthDate(st - $ if (isToday) a11yTexts.push(a11yTodayText); - $ if (isDisabled) a11yTexts.push(a11yDisabledText); + $ if (a11yTodayText && isToday) a11yTexts.push(a11yTodayText); + $ if (a11yDisabledText && isDisabled) a11yTexts.push(a11yDisabledText); $ var link = !isDisabled && linkBuilder && linkBuilder(dayISO); <${link ? "a" : "span"} class={ diff --git a/src/components/ebay-carousel/component.ts b/src/components/ebay-carousel/component.ts index f921e6920..7b13acf13 100644 --- a/src/components/ebay-carousel/component.ts +++ b/src/components/ebay-carousel/component.ts @@ -1,5 +1,5 @@ import focusables from "makeup-focusables"; -import type { AttrClass, AttrStyle } from "marko/tags-html"; +import type { AttrClass, AttrString, AttrStyle } from "marko/tags-html"; // TODO check carousel import { resizeUtil } from "../../common/event-utils"; import { processHtmlAttributes } from "../../common/html-attributes"; @@ -34,10 +34,10 @@ interface CarouselInput { "no-peek"?: boolean; class?: AttrClass; style?: AttrStyle; - "a11y-previous-text"?: string; - "a11y-next-text"?: string; - "a11y-pause-text"?: string; - "a11y-play-text"?: string; + "a11y-previous-text"?: AttrString; + "a11y-next-text"?: AttrString; + "a11y-pause-text"?: AttrString; + "a11y-play-text"?: AttrString; "aria-roledescription"?: string; "on-move"?: (event: { visibleIndexes: number[] }) => void; "on-scroll"?: (event: { index: number }) => void; diff --git a/src/components/ebay-character-count/component.ts b/src/components/ebay-character-count/component.ts index 86d04738a..f114f97ad 100644 --- a/src/components/ebay-character-count/component.ts +++ b/src/components/ebay-character-count/component.ts @@ -1,3 +1,4 @@ +import type { AttrString } from "marko/tags-html"; import type { WithNormalizedProps } from "../../global"; export interface CharacterCountEvent { @@ -9,7 +10,7 @@ interface CharacterCountInput extends Omit, `on${string}`> { renderBody?: Marko.Body; value?: string | number; max: number; - "clipped-text"?: string; + "clipped-text"?: AttrString; "on-change"?: (event?: CharacterCountEvent) => void; } diff --git a/src/components/ebay-confirm-dialog/index.marko b/src/components/ebay-confirm-dialog/index.marko index d70113898..0b24b3655 100644 --- a/src/components/ebay-confirm-dialog/index.marko +++ b/src/components/ebay-confirm-dialog/index.marko @@ -1,9 +1,10 @@ import type { Input as BaseInput } from ""; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; static interface ConfirmDialogInput extends Omit { - "reject-text"?: string; - "confirm-text"?: string; + "reject-text"?: AttrString; + "confirm-text"?: AttrString; "on-open"?: () => void; "on-reject"?: () => void; "on-confirm"?: () => void; diff --git a/src/components/ebay-date-textbox/component.ts b/src/components/ebay-date-textbox/component.ts index e7e9fc4aa..b5f0199f6 100644 --- a/src/components/ebay-date-textbox/component.ts +++ b/src/components/ebay-date-textbox/component.ts @@ -1,6 +1,7 @@ import Expander from "makeup-expander"; import { toISO, type DayISO, dateArgToISO } from "../ebay-calendar/date-utils"; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; const MIN_WIDTH_FOR_DOUBLE_PANE = 600; @@ -16,11 +17,11 @@ interface DateTextboxInput { "input-placeholder-text"?: string | [string, string]; "collapse-on-select"?: boolean; "get-a11y-show-month-text"?: (monthName: string) => string; - "a11y-open-popover-text"?: string; - "a11y-selected-text"?: string; - "a11y-range-start-text"?: string; - "a11y-in-range-text"?: string; - "a11y-range-end-text"?: string; + "a11y-open-popover-text"?: AttrString; + "a11y-selected-text"?: AttrString; + "a11y-range-start-text"?: AttrString; + "a11y-in-range-text"?: AttrString; + "a11y-range-end-text"?: AttrString; "a11y-separator"?: string; "on-change"?: ( event: diff --git a/src/components/ebay-drawer-dialog/component.ts b/src/components/ebay-drawer-dialog/component.ts index b26aaffc9..f124cbe48 100644 --- a/src/components/ebay-drawer-dialog/component.ts +++ b/src/components/ebay-drawer-dialog/component.ts @@ -1,11 +1,12 @@ +import type { AttrString } from "marko/tags-html"; import type { WithNormalizedProps } from "../../global"; import DialogBase, { type Input as BaseInput, } from "../components/ebay-dialog-base/component"; interface DrawerDialogInput extends BaseInput { - "a11y-maximize-text"?: string; - "a11y-minimize-text"?: string; + "a11y-maximize-text"?: AttrString; + "a11y-minimize-text"?: AttrString; "no-handle"?: boolean; expanded?: boolean; "on-expanded"?: () => void; diff --git a/src/components/ebay-fake-menu-button/component.ts b/src/components/ebay-fake-menu-button/component.ts index 24bbb07f1..af64b437e 100644 --- a/src/components/ebay-fake-menu-button/component.ts +++ b/src/components/ebay-fake-menu-button/component.ts @@ -6,9 +6,10 @@ import type { Item as FakeMenuItem, } from "../ebay-fake-menu/component"; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; interface FakeMenuButtonInput extends Omit, `on${string}`> { - text?: string; + text?: AttrString; size?: "none" | "large"; "prefix-id"?: string; variant?: "overflow" | "form" | "button" | "icon"; @@ -16,7 +17,7 @@ interface FakeMenuButtonInput extends Omit, `on${string}`> { borderless?: boolean; transparent?: boolean; icon?: Marko.Renderable; - "a11y-text"?: string; + "a11y-text"?: AttrString; disabled?: boolean; "no-toggle-icon"?: boolean; label?: { renderBody?: Marko.Body }; diff --git a/src/components/ebay-filter-menu-button/component.ts b/src/components/ebay-filter-menu-button/component.ts index 7a21794f1..cabc4713e 100644 --- a/src/components/ebay-filter-menu-button/component.ts +++ b/src/components/ebay-filter-menu-button/component.ts @@ -7,6 +7,7 @@ import setupMenu, { } from "../../common/menu-utils"; import type { FilterMenuEvent } from "../ebay-filter-menu/component"; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; export interface FilterMenuButtonEvent { el?: Element; @@ -19,12 +20,12 @@ export interface FilterMenuButtonEvent { interface FilterMenuButtonInput extends BaseMenuInput, Omit, `on${string}`> { - text?: string; - "footer-text"?: string; - "a11y-footer-text"?: string; + text?: AttrString; + "footer-text"?: AttrString; + "a11y-footer-text"?: AttrString; footer?: WithNormalizedProps< Omit, `on${string}`> & { - "a11y-footer-text"?: string; + "a11y-footer-text"?: AttrString; } >; variant?: "form"; @@ -32,7 +33,7 @@ interface FilterMenuButtonInput "form-action"?: string; "form-method"?: string; disabled?: boolean; - "a11y-text"?: string; + "a11y-text"?: AttrString; "on-expand"?: () => void; "on-change"?: (event: FilterMenuButtonEvent) => void; "on-collapse"?: (event: FilterMenuButtonEvent) => void; diff --git a/src/components/ebay-filter-menu/component.ts b/src/components/ebay-filter-menu/component.ts index 23301e938..303264d51 100644 --- a/src/components/ebay-filter-menu/component.ts +++ b/src/components/ebay-filter-menu/component.ts @@ -8,6 +8,7 @@ import setupMenu, { } from "../../common/menu-utils"; import type { RadioEvent } from "../ebay-radio/component-browser"; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; export interface FilterMenuEvent { el?: Element; @@ -26,11 +27,11 @@ interface FilterMenuInput "form-name"?: string; "form-action"?: string; "form-method"?: string; - "footer-text"?: string; - "a11y-footer-text"?: string; + "footer-text"?: AttrString; + "a11y-footer-text"?: AttrString; footer?: WithNormalizedProps< Omit, `on${string}`> & { - "a11y-footer-text"?: string; + "a11y-footer-text"?: AttrString; } >; "render-body"?: Marko.Body; diff --git a/src/components/ebay-filter/component.ts b/src/components/ebay-filter/component.ts index dc196d064..655e4c4d0 100644 --- a/src/components/ebay-filter/component.ts +++ b/src/components/ebay-filter/component.ts @@ -1,3 +1,4 @@ +import type { AttrString } from "marko/tags-html"; import type { WithNormalizedProps } from "../../global"; export interface FilterInput @@ -5,7 +6,7 @@ export interface FilterInput selected?: boolean; href?: string; "use-aria-pressed"?: boolean; - "a11y-selected-text"?: string; + "a11y-selected-text"?: AttrString; "on-click"?: (event: { selected: boolean; originalEvent: MouseEvent; diff --git a/src/components/ebay-icon-button/component-browser.ts b/src/components/ebay-icon-button/component-browser.ts index f5108c43a..3117560cb 100644 --- a/src/components/ebay-icon-button/component-browser.ts +++ b/src/components/ebay-icon-button/component-browser.ts @@ -1,3 +1,4 @@ +import type { AttrString } from "marko/tags-html"; import * as eventUtils from "../../common/event-utils"; import type { WithNormalizedProps } from "../../global"; @@ -8,7 +9,7 @@ interface IconButtonInput extends Omit, `on${string}`> { transparent?: boolean; size?: "small" | "large"; "partially-disabled"?: boolean; - "badge-aria-label"?: string; + "badge-aria-label"?: AttrString; "on-click"?: (event: { originalEvent: MouseEvent }) => void; "on-escape"?: (event: { originalEvent: KeyboardEvent }) => void; "on-focus"?: (event: { originalEvent: FocusEvent }) => void; diff --git a/src/components/ebay-icon/component-browser.ts b/src/components/ebay-icon/component-browser.ts index f38c4a34b..f688e450c 100644 --- a/src/components/ebay-icon/component-browser.ts +++ b/src/components/ebay-icon/component-browser.ts @@ -1,4 +1,4 @@ -import type { AttrClass } from "marko/tags-html"; +import type { AttrString } from "marko/tags-html"; import type { WithNormalizedProps } from "../../global"; let rootSvg: SVGSVGElement; @@ -10,8 +10,7 @@ interface IconInput extends Omit, `on${string}`> { _name: string; _def?: () => unknown; "a11y-variant"?: "label"; - "a11y-text"?: string; - class?: AttrClass; + "a11y-text"?: AttrString; "no-skin-classes"?: boolean; } diff --git a/src/components/ebay-infotip/component.ts b/src/components/ebay-infotip/component.ts index 8e3fca8e0..0da898854 100644 --- a/src/components/ebay-infotip/component.ts +++ b/src/components/ebay-infotip/component.ts @@ -1,3 +1,4 @@ +import type { AttrString } from "marko/tags-html"; import type { WithNormalizedProps } from "../../global"; import EbayTooltipBase from "../components/ebay-tooltip-base/component-browser"; import type { Input as TooltipBaseInput } from "../components/ebay-tooltip-base/component-browser"; @@ -9,14 +10,13 @@ interface InfotipInput extends Omit, `on${string}`> { pointer?: TooltipBaseInput["pointer"]; placement?: TooltipBaseInput["placement"]; disabled?: boolean; - "aria-label"?: string; icon?: Marko.AttrTag<{ renderBody: Marko.Renderable }>; heading: Marko.Input<"span"> & { as: Marko.NativeTags; renderBody: Marko.Renderable; }; content: Marko.AttrTag>; - "a11y-close-button-text"?: string; + "a11y-close-button-text"?: AttrString; "on-expand"?: () => void; "on-collapse"?: () => void; } diff --git a/src/components/ebay-lightbox-dialog/index.marko b/src/components/ebay-lightbox-dialog/index.marko index 0a354ef2b..f8fa344d9 100644 --- a/src/components/ebay-lightbox-dialog/index.marko +++ b/src/components/ebay-lightbox-dialog/index.marko @@ -1,12 +1,13 @@ static const validSizes = ["wide", "narrow"] as const; +import type { AttrString } from "marko/tags-html"; import type { WithNormalizedProps } from "../../global"; import type { Input as DialogBaseInput } from "../components/ebay-dialog-base/component"; export interface LightboxDialogInput extends Omit { variant?: "_mini"; expanded?: boolean; - "a11y-maximize-text"?: string; - "a11y-minimize-text"?: string; + "a11y-maximize-text"?: AttrString; + "a11y-minimize-text"?: AttrString; "banner-img-src"?: string; size?: (typeof validSizes)[number]; "banner-img-position"?: Marko.CSS.Properties["backgroundPosition"]; diff --git a/src/components/ebay-listbox-button/component.ts b/src/components/ebay-listbox-button/component.ts index 752a56b3d..c912b4b15 100644 --- a/src/components/ebay-listbox-button/component.ts +++ b/src/components/ebay-listbox-button/component.ts @@ -4,13 +4,14 @@ import type { Input as ListboxInput } from "../ebay-listbox/component"; import type Listbox from "../ebay-listbox/component"; import type { Option, ChangeEvent } from "../ebay-listbox/component"; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; interface ListboxButtonInput extends Omit, `on${string}`> { options?: ListboxInput["options"]; name?: ListboxInput["name"]; "list-selection"?: ListboxInput["listSelection"]; "prefix-id"?: string; - "unselected-text"?: string; + "unselected-text"?: AttrString; variant?: "standard" | "form"; truncate?: boolean; fluid?: boolean; @@ -20,7 +21,7 @@ interface ListboxButtonInput extends Omit, `on${string}`> { "button-name"?: string; invalid?: boolean; hasError?: boolean; - "prefix-label"?: string; + "prefix-label"?: AttrString; "collapse-on-select"?: boolean; "on-expand"?: () => void; "on-collapse"?: () => void; diff --git a/src/components/ebay-listbox/component.ts b/src/components/ebay-listbox/component.ts index bde986760..5574b6ba0 100644 --- a/src/components/ebay-listbox/component.ts +++ b/src/components/ebay-listbox/component.ts @@ -1,5 +1,5 @@ import { createLinear } from "makeup-active-descendant"; -import type { AttrStringOrNumber } from "marko/tags-html"; +import type { AttrString, AttrStringOrNumber } from "marko/tags-html"; import { scroll } from "../../common/element-scroll"; import * as eventUtils from "../../common/event-utils"; import type { WithNormalizedProps } from "../../global"; @@ -13,8 +13,8 @@ export interface ChangeEvent { export interface Option extends Omit, `on${string}`> { disabled?: boolean; - text?: string; - description?: string; + text?: AttrString; + description?: AttrString; } interface ListboxInput extends Omit, `on${string}`> { diff --git a/src/components/ebay-menu-button/component.ts b/src/components/ebay-menu-button/component.ts index 9f47bae3d..4d16dbbd6 100644 --- a/src/components/ebay-menu-button/component.ts +++ b/src/components/ebay-menu-button/component.ts @@ -7,6 +7,8 @@ import setupMenu, { } from "../../common/menu-utils"; import type { MenuEvent } from "../ebay-menu/component"; import type { Input as EbayButtonInput } from "../ebay-button/index.marko"; +import { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; export interface MenuButtonEvent { el?: Element; @@ -18,40 +20,37 @@ export interface MenuButtonEvent { index?: number; } -export interface Input +interface MenuButtonInput extends BaseMenuInput, Omit, `on${string}`> { - collapseOnSelect?: boolean; - prefixId?: string; + "collapse-on-select"?: boolean; + "prefix-id"?: string; variant?: "overflow" | "form" | "button" | "icon"; borderless?: boolean; priority?: "primary" | "secondary" | "tertiary" | "delete" | "none"; size?: EbayButtonInput["size"]; transparent?: boolean; - a11yText?: string; + "a11y-text"?: AttrString; disabled?: boolean; split?: string; - noToggleIcon?: boolean; + "no-toggle-icon"?: boolean; label?: { renderBody?: Marko.Body; }; - prefixLabel?: string; + "prefix-label"?: AttrString; icon?: Marko.AttrTag<{ renderBody?: Marko.Body }>; - text?: string; + text?: AttrString; reverse?: boolean; - fixWidth?: boolean; + "fix-width"?: boolean; "on-expand"?: (event: MenuButtonEvent) => void; - onExpand?: this["on-expand"]; "on-collapse"?: (event: MenuButtonEvent) => void; - onCollapse?: this["on-collapse"]; "on-change"?: (event: MenuButtonEvent) => void; - onChange?: this["on-change"]; "on-select"?: (event: MenuButtonEvent) => void; - onSelect?: this["on-select"]; "on-mousedown"?: (event: MenuButtonEvent) => void; - onMousedown?: this["on-mousedown"]; } +export interface Input extends WithNormalizedProps {} + export default class extends MenuUtils { declare expander: any; diff --git a/src/components/ebay-pagination/component.ts b/src/components/ebay-pagination/component.ts index c0bf87f56..dc44c26ae 100644 --- a/src/components/ebay-pagination/component.ts +++ b/src/components/ebay-pagination/component.ts @@ -1,6 +1,7 @@ import * as eventUtils from "../../common/event-utils"; import { getMaxWidth } from "../../common/dom"; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; const MAX_PAGES = 9; const MIN_PAGES = 5; @@ -28,9 +29,9 @@ export interface Item interface PaginationInput extends Omit, `on${string}`> { items?: Marko.AttrTag[]; variant?: "show-range" | "show-last" | "overflow"; - "a11y-current-text"?: string; - "a11y-previous-text"?: string; - "a11y-next-text"?: string; + "a11y-current-text"?: AttrString; + "a11y-previous-text"?: AttrString; + "a11y-next-text"?: AttrString; "on-select"?: (event: SelectEvent) => void; "on-next"?: (event: NavigationEvent) => void; "on-previous"?: (event: NavigationEvent) => void; diff --git a/src/components/ebay-progress-spinner/index.marko b/src/components/ebay-progress-spinner/index.marko index 88e4c6c96..cd2cc76df 100644 --- a/src/components/ebay-progress-spinner/index.marko +++ b/src/components/ebay-progress-spinner/index.marko @@ -1,9 +1,10 @@ import { processHtmlAttributes } from "../../common/html-attributes" import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; static interface ProgressSpinnerInput extends Omit, `on${string}`> { size?: "large" | "small"; - "a11y-text"?: string; + "a11y-text"?: AttrString; } export interface Input extends WithNormalizedProps {} diff --git a/src/components/ebay-progress-stepper/index.marko b/src/components/ebay-progress-stepper/index.marko index 333947dbe..e10fc1d0a 100644 --- a/src/components/ebay-progress-stepper/index.marko +++ b/src/components/ebay-progress-stepper/index.marko @@ -1,5 +1,6 @@ import { processHtmlAttributes } from '../../common/html-attributes'; import type { WithNormalizedProps } from '../../global'; +import type { AttrString } from 'marko/tags-html'; export interface Step extends Omit, `on${string}` | "title"> { current?: boolean; @@ -14,7 +15,7 @@ static interface ProgressStepperInput extends Omit, `on${stri step?: Marko.AttrTag[]; "default-state"?: "complete" | "upcoming" | "attention" | "current"; "a11y-heading-tag"?: Marko.NativeTags; - "a11y-heading-text"?: string; + "a11y-heading-text"?: AttrString; "auto-paragraph"?: boolean; } diff --git a/src/components/ebay-section-title/index.marko b/src/components/ebay-section-title/index.marko index 12c542fb3..65b099c3e 100644 --- a/src/components/ebay-section-title/index.marko +++ b/src/components/ebay-section-title/index.marko @@ -1,8 +1,9 @@ import { processHtmlAttributes } from '../../common/html-attributes'; import type { WithNormalizedProps } from '../../global'; +import type { AttrString } from 'marko/tags-html'; static interface SectionTitleInput extends Omit, `on${string}` | "title"> { - "cta-text"?: string; + "cta-text"?: AttrString; title?: Omit, `on${string}`>; href?: string; subtitle?: Omit, `on${string}`>; diff --git a/src/components/ebay-select/component.ts b/src/components/ebay-select/component.ts index 797241de1..874c7acb6 100644 --- a/src/components/ebay-select/component.ts +++ b/src/components/ebay-select/component.ts @@ -1,5 +1,6 @@ import FloatingLabel from "makeup-floating-label"; import type { WithNormalizedProps } from "../../global"; +import type { AttrString } from "marko/tags-html"; export interface Option extends Omit, `on${string}`> { optgroup?: string; @@ -8,7 +9,7 @@ export interface Option extends Omit, `on${string}`> { interface SelectInput extends Omit, `on${string}`> { options: Marko.RepeatableAttrTag