@sebgroup/green-core 3.11.0 → 3.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/alert/alert.component.js +5 -0
- package/components/breadcrumbs/breadcrumbs.component.js +4 -0
- package/components/button/button.component.js +11 -3
- package/components/calendar/calendar.component.js +5 -0
- package/components/checkbox/checkbox-group/checkbox-group.component.d.ts +2 -0
- package/components/checkbox/checkbox-group/checkbox-group.component.js +6 -0
- package/components/checkbox/checkbox.component.js +6 -0
- package/components/context-menu/context-menu.component.js +6 -0
- package/components/datepicker/datepicker.component.js +6 -0
- package/components/details/details.component.js +6 -1
- package/components/dialog/dialog.component.js +5 -0
- package/components/dropdown/dropdown.component.js +6 -0
- package/components/filter-chips/filter-chips.component.js +6 -1
- package/components/input/input.component.d.ts +2 -0
- package/components/input/input.component.js +6 -0
- package/components/link/link.component.js +6 -1
- package/components/menu-button/menu-button.component.js +7 -1
- package/components/menu-button/menu-button.styles.js +0 -1
- package/components/pagination/pagination.component.js +19 -12
- package/components/popover/popover.component.js +5 -0
- package/components/radio/radio-group/radio-group.component.d.ts +2 -0
- package/components/radio/radio-group/radio-group.component.js +6 -0
- package/components/radio/radio.component.js +6 -1
- package/components/segmented-control/segmented-control.component.js +5 -0
- package/components/select/select.component.d.ts +3 -2
- package/components/select/select.component.js +6 -0
- package/components/switch/switch.component.js +10 -2
- package/components/table/table.component.js +21 -8
- package/components/table/table.styles.js +19 -0
- package/components/textarea/textarea.component.d.ts +3 -0
- package/components/textarea/textarea.component.js +6 -0
- package/custom-elements.json +137900 -137390
- package/gds-element.js +1 -1
- package/generated/mcp/checkbox-group/angular.md +8 -0
- package/generated/mcp/checkbox-group/api.md +7 -0
- package/generated/mcp/checkbox-group/react.md +8 -0
- package/generated/mcp/components.json +1 -1
- package/generated/mcp/icons.json +1 -1
- package/generated/mcp/index.json +1 -1
- package/generated/mcp/input/angular.md +1 -0
- package/generated/mcp/input/api.md +1 -0
- package/generated/mcp/input/react.md +1 -0
- package/generated/mcp/radio-group/angular.md +1 -0
- package/generated/mcp/radio-group/api.md +1 -0
- package/generated/mcp/radio-group/react.md +1 -0
- package/generated/mcp/select/angular.md +1 -0
- package/generated/mcp/select/api.md +3 -2
- package/generated/mcp/select/react.md +1 -0
- package/generated/mcp/textarea/angular.md +1 -0
- package/generated/mcp/textarea/api.md +1 -0
- package/generated/mcp/textarea/react.md +1 -0
- package/generated/mcp/tokens.json +1 -1
- package/generated/react/alert/index.d.ts +8 -0
- package/generated/react/avatar/index.d.ts +8 -0
- package/generated/react/avatar-group/index.d.ts +8 -0
- package/generated/react/backdrop/index.d.ts +8 -0
- package/generated/react/badge/index.d.ts +8 -0
- package/generated/react/blur/index.d.ts +8 -0
- package/generated/react/breadcrumb/index.d.ts +8 -0
- package/generated/react/breadcrumbs/index.d.ts +8 -0
- package/generated/react/button/index.d.ts +8 -0
- package/generated/react/calendar/index.d.ts +8 -0
- package/generated/react/card/index.d.ts +8 -0
- package/generated/react/card-linked/index.d.ts +8 -0
- package/generated/react/card-pattern-01/index.d.ts +8 -0
- package/generated/react/checkbox/index.d.ts +8 -0
- package/generated/react/checkbox-group/index.d.ts +10 -0
- package/generated/react/coachmark/index.d.ts +8 -0
- package/generated/react/context-menu/index.d.ts +8 -0
- package/generated/react/datepicker/index.d.ts +8 -0
- package/generated/react/details/index.d.ts +8 -0
- package/generated/react/dialog/index.d.ts +8 -0
- package/generated/react/div/index.d.ts +8 -0
- package/generated/react/divider/index.d.ts +8 -0
- package/generated/react/dropdown/index.d.ts +8 -0
- package/generated/react/fab/index.d.ts +8 -0
- package/generated/react/filter-chip/index.d.ts +8 -0
- package/generated/react/filter-chips/index.d.ts +8 -0
- package/generated/react/flex/index.d.ts +8 -0
- package/generated/react/form-summary/index.d.ts +8 -0
- package/generated/react/formatted-account/index.d.ts +8 -0
- package/generated/react/formatted-date/index.d.ts +8 -0
- package/generated/react/formatted-number/index.d.ts +8 -0
- package/generated/react/grid/index.d.ts +8 -0
- package/generated/react/grouped-list/index.d.ts +8 -0
- package/generated/react/icons/icon-ai/index.d.ts +8 -0
- package/generated/react/icons/icon-airplane-up/index.d.ts +8 -0
- package/generated/react/icons/icon-archive/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-bottom-top/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-box-left/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-box-left-alt/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-box-right/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-down/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-inbox/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-left/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-left-right/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-out-of-box/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-right/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-right-circle/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-right-down-circle/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-right-up-circle/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-rotate-clockwise/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-rotate-counter-clockwise/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-rotate-left-right/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-rotate-right-left/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-share-left/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-share-right/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-split/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-up/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-wall-down/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-wall-left/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-wall-right/index.d.ts +8 -0
- package/generated/react/icons/icon-arrow-wall-up/index.d.ts +8 -0
- package/generated/react/icons/icon-arrows-repeat-right/index.d.ts +8 -0
- package/generated/react/icons/icon-asterisk/index.d.ts +8 -0
- package/generated/react/icons/icon-at/index.d.ts +8 -0
- package/generated/react/icons/icon-back/index.d.ts +8 -0
- package/generated/react/icons/icon-backward/index.d.ts +8 -0
- package/generated/react/icons/icon-bag/index.d.ts +8 -0
- package/generated/react/icons/icon-bank/index.d.ts +8 -0
- package/generated/react/icons/icon-banknote/index.d.ts +8 -0
- package/generated/react/icons/icon-banknote-2/index.d.ts +8 -0
- package/generated/react/icons/icon-barcode/index.d.ts +8 -0
- package/generated/react/icons/icon-bars-three/index.d.ts +8 -0
- package/generated/react/icons/icon-bars-two/index.d.ts +8 -0
- package/generated/react/icons/icon-basket/index.d.ts +8 -0
- package/generated/react/icons/icon-battery-loading/index.d.ts +8 -0
- package/generated/react/icons/icon-bell/index.d.ts +8 -0
- package/generated/react/icons/icon-block/index.d.ts +8 -0
- package/generated/react/icons/icon-book/index.d.ts +8 -0
- package/generated/react/icons/icon-bookmark/index.d.ts +8 -0
- package/generated/react/icons/icon-bookmark-check/index.d.ts +8 -0
- package/generated/react/icons/icon-bookmark-delete/index.d.ts +8 -0
- package/generated/react/icons/icon-bookmark-plus/index.d.ts +8 -0
- package/generated/react/icons/icon-bookmark-remove/index.d.ts +8 -0
- package/generated/react/icons/icon-books/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-app-store/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-apple-music/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-bankid/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-chrome/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-facebook/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-figma/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-firefox/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-github/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-green/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-instagram/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-linkedin/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-play-store/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-rss-feed/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-seb/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-spotify/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-storybook/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-swish-word/index.d.ts +8 -0
- package/generated/react/icons/icon-brand-x/index.d.ts +8 -0
- package/generated/react/icons/icon-brush/index.d.ts +8 -0
- package/generated/react/icons/icon-bubble-annotation/index.d.ts +8 -0
- package/generated/react/icons/icon-bubbles/index.d.ts +8 -0
- package/generated/react/icons/icon-buildings/index.d.ts +8 -0
- package/generated/react/icons/icon-bullet-list/index.d.ts +8 -0
- package/generated/react/icons/icon-calculator/index.d.ts +8 -0
- package/generated/react/icons/icon-calendar/index.d.ts +8 -0
- package/generated/react/icons/icon-calendar-check/index.d.ts +8 -0
- package/generated/react/icons/icon-calendar-repeat/index.d.ts +8 -0
- package/generated/react/icons/icon-calender-add/index.d.ts +8 -0
- package/generated/react/icons/icon-call/index.d.ts +8 -0
- package/generated/react/icons/icon-car/index.d.ts +8 -0
- package/generated/react/icons/icon-carussel/index.d.ts +8 -0
- package/generated/react/icons/icon-chain-link/index.d.ts +8 -0
- package/generated/react/icons/icon-chain-link-broken/index.d.ts +8 -0
- package/generated/react/icons/icon-chart-two/index.d.ts +8 -0
- package/generated/react/icons/icon-checklist/index.d.ts +8 -0
- package/generated/react/icons/icon-checkmark/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-bottom/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-double-down/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-double-left/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-double-right/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-double-up/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-down-small/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-grabber-vertical/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-grabber-vertical-reversed/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-left/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-left-small/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-right/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-right-small/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-top/index.d.ts +8 -0
- package/generated/react/icons/icon-chevron-top-small/index.d.ts +8 -0
- package/generated/react/icons/icon-circle-ban/index.d.ts +8 -0
- package/generated/react/icons/icon-circle-check/index.d.ts +8 -0
- package/generated/react/icons/icon-circle-dots/index.d.ts +8 -0
- package/generated/react/icons/icon-circle-info/index.d.ts +8 -0
- package/generated/react/icons/icon-circle-minus/index.d.ts +8 -0
- package/generated/react/icons/icon-circle-placeholder-on/index.d.ts +8 -0
- package/generated/react/icons/icon-circle-plus/index.d.ts +8 -0
- package/generated/react/icons/icon-circle-questionmark/index.d.ts +8 -0
- package/generated/react/icons/icon-circle-x/index.d.ts +8 -0
- package/generated/react/icons/icon-circles-three/index.d.ts +8 -0
- package/generated/react/icons/icon-clock/index.d.ts +8 -0
- package/generated/react/icons/icon-cloud-download/index.d.ts +8 -0
- package/generated/react/icons/icon-cloud-upload/index.d.ts +8 -0
- package/generated/react/icons/icon-cloudy-sun/index.d.ts +8 -0
- package/generated/react/icons/icon-code/index.d.ts +8 -0
- package/generated/react/icons/icon-code-brackets/index.d.ts +8 -0
- package/generated/react/icons/icon-compass-round/index.d.ts +8 -0
- package/generated/react/icons/icon-cookies/index.d.ts +8 -0
- package/generated/react/icons/icon-copy/index.d.ts +8 -0
- package/generated/react/icons/icon-credit-card/index.d.ts +8 -0
- package/generated/react/icons/icon-credit-card-add/index.d.ts +8 -0
- package/generated/react/icons/icon-cross-large/index.d.ts +8 -0
- package/generated/react/icons/icon-cross-small/index.d.ts +8 -0
- package/generated/react/icons/icon-cup-hot/index.d.ts +8 -0
- package/generated/react/icons/icon-cursor/index.d.ts +8 -0
- package/generated/react/icons/icon-details/index.d.ts +8 -0
- package/generated/react/icons/icon-devices/index.d.ts +8 -0
- package/generated/react/icons/icon-direction/index.d.ts +8 -0
- package/generated/react/icons/icon-dollar/index.d.ts +8 -0
- package/generated/react/icons/icon-dot-grid-one-horizontal/index.d.ts +8 -0
- package/generated/react/icons/icon-dot-grid-one-vertical/index.d.ts +8 -0
- package/generated/react/icons/icon-dot-grid-three/index.d.ts +8 -0
- package/generated/react/icons/icon-dot-grid-two/index.d.ts +8 -0
- package/generated/react/icons/icon-email/index.d.ts +8 -0
- package/generated/react/icons/icon-emoji-angry/index.d.ts +8 -0
- package/generated/react/icons/icon-emoji-neutral/index.d.ts +8 -0
- package/generated/react/icons/icon-emoji-sad/index.d.ts +8 -0
- package/generated/react/icons/icon-emoji-smile/index.d.ts +8 -0
- package/generated/react/icons/icon-emoji-smiley/index.d.ts +8 -0
- package/generated/react/icons/icon-euro/index.d.ts +8 -0
- package/generated/react/icons/icon-expand/index.d.ts +8 -0
- package/generated/react/icons/icon-eye-open/index.d.ts +8 -0
- package/generated/react/icons/icon-eye-slash/index.d.ts +8 -0
- package/generated/react/icons/icon-fashion/index.d.ts +8 -0
- package/generated/react/icons/icon-fast-forward/index.d.ts +8 -0
- package/generated/react/icons/icon-file-bend/index.d.ts +8 -0
- package/generated/react/icons/icon-file-chart/index.d.ts +8 -0
- package/generated/react/icons/icon-file-text/index.d.ts +8 -0
- package/generated/react/icons/icon-files/index.d.ts +8 -0
- package/generated/react/icons/icon-filter/index.d.ts +8 -0
- package/generated/react/icons/icon-flag/index.d.ts +8 -0
- package/generated/react/icons/icon-floppy-disk/index.d.ts +8 -0
- package/generated/react/icons/icon-focus/index.d.ts +8 -0
- package/generated/react/icons/icon-folder/index.d.ts +8 -0
- package/generated/react/icons/icon-folder-add-right/index.d.ts +8 -0
- package/generated/react/icons/icon-fullscreen/index.d.ts +8 -0
- package/generated/react/icons/icon-gift/index.d.ts +8 -0
- package/generated/react/icons/icon-globus/index.d.ts +8 -0
- package/generated/react/icons/icon-graduate-cap/index.d.ts +8 -0
- package/generated/react/icons/icon-green-power/index.d.ts +8 -0
- package/generated/react/icons/icon-group/index.d.ts +8 -0
- package/generated/react/icons/icon-growth/index.d.ts +8 -0
- package/generated/react/icons/icon-headphones/index.d.ts +8 -0
- package/generated/react/icons/icon-heart/index.d.ts +8 -0
- package/generated/react/icons/icon-heart-beat/index.d.ts +8 -0
- package/generated/react/icons/icon-history/index.d.ts +8 -0
- package/generated/react/icons/icon-home-energy-one/index.d.ts +8 -0
- package/generated/react/icons/icon-home-energy-two/index.d.ts +8 -0
- package/generated/react/icons/icon-home-open/index.d.ts +8 -0
- package/generated/react/icons/icon-home-roof/index.d.ts +8 -0
- package/generated/react/icons/icon-horizontal-alignment-bottom/index.d.ts +8 -0
- package/generated/react/icons/icon-hourglass/index.d.ts +8 -0
- package/generated/react/icons/icon-images/index.d.ts +8 -0
- package/generated/react/icons/icon-inbox-empty/index.d.ts +8 -0
- package/generated/react/icons/icon-industry/index.d.ts +8 -0
- package/generated/react/icons/icon-jpg/index.d.ts +8 -0
- package/generated/react/icons/icon-key/index.d.ts +8 -0
- package/generated/react/icons/icon-knife-spoon/index.d.ts +8 -0
- package/generated/react/icons/icon-lab/index.d.ts +8 -0
- package/generated/react/icons/icon-law/index.d.ts +8 -0
- package/generated/react/icons/icon-leisure/index.d.ts +8 -0
- package/generated/react/icons/icon-light-bulb-simple/index.d.ts +8 -0
- package/generated/react/icons/icon-lightning/index.d.ts +8 -0
- package/generated/react/icons/icon-line-chart-four/index.d.ts +8 -0
- package/generated/react/icons/icon-line-chart-one/index.d.ts +8 -0
- package/generated/react/icons/icon-line-chart-three/index.d.ts +8 -0
- package/generated/react/icons/icon-line-chart-two/index.d.ts +8 -0
- package/generated/react/icons/icon-lock/index.d.ts +8 -0
- package/generated/react/icons/icon-macbook-air/index.d.ts +8 -0
- package/generated/react/icons/icon-magnifying-glass/index.d.ts +8 -0
- package/generated/react/icons/icon-map-pin/index.d.ts +8 -0
- package/generated/react/icons/icon-megaphone/index.d.ts +8 -0
- package/generated/react/icons/icon-menu-sidebar/index.d.ts +8 -0
- package/generated/react/icons/icon-mic-off/index.d.ts +8 -0
- package/generated/react/icons/icon-mic-on/index.d.ts +8 -0
- package/generated/react/icons/icon-minimize/index.d.ts +8 -0
- package/generated/react/icons/icon-minus-large/index.d.ts +8 -0
- package/generated/react/icons/icon-minus-small/index.d.ts +8 -0
- package/generated/react/icons/icon-money-hand/index.d.ts +8 -0
- package/generated/react/icons/icon-moneybag/index.d.ts +8 -0
- package/generated/react/icons/icon-moon/index.d.ts +8 -0
- package/generated/react/icons/icon-mute/index.d.ts +8 -0
- package/generated/react/icons/icon-newspaper/index.d.ts +8 -0
- package/generated/react/icons/icon-office/index.d.ts +8 -0
- package/generated/react/icons/icon-page-add/index.d.ts +8 -0
- package/generated/react/icons/icon-paper-plane-top-right/index.d.ts +8 -0
- package/generated/react/icons/icon-paperclip/index.d.ts +8 -0
- package/generated/react/icons/icon-pause/index.d.ts +8 -0
- package/generated/react/icons/icon-pdf/index.d.ts +8 -0
- package/generated/react/icons/icon-pencil-sign/index.d.ts +8 -0
- package/generated/react/icons/icon-pencil-sparkle/index.d.ts +8 -0
- package/generated/react/icons/icon-pencil-wave/index.d.ts +8 -0
- package/generated/react/icons/icon-pension/index.d.ts +8 -0
- package/generated/react/icons/icon-people/index.d.ts +8 -0
- package/generated/react/icons/icon-people-a11y/index.d.ts +8 -0
- package/generated/react/icons/icon-people-add/index.d.ts +8 -0
- package/generated/react/icons/icon-people-added/index.d.ts +8 -0
- package/generated/react/icons/icon-people-circle/index.d.ts +8 -0
- package/generated/react/icons/icon-people-copy/index.d.ts +8 -0
- package/generated/react/icons/icon-people-profile/index.d.ts +8 -0
- package/generated/react/icons/icon-people-remove/index.d.ts +8 -0
- package/generated/react/icons/icon-percent/index.d.ts +8 -0
- package/generated/react/icons/icon-phone/index.d.ts +8 -0
- package/generated/react/icons/icon-pie-chart/index.d.ts +8 -0
- package/generated/react/icons/icon-piggy-bank/index.d.ts +8 -0
- package/generated/react/icons/icon-pin/index.d.ts +8 -0
- package/generated/react/icons/icon-pinch/index.d.ts +8 -0
- package/generated/react/icons/icon-play/index.d.ts +8 -0
- package/generated/react/icons/icon-play-circle/index.d.ts +8 -0
- package/generated/react/icons/icon-plus-large/index.d.ts +8 -0
- package/generated/react/icons/icon-plus-small/index.d.ts +8 -0
- package/generated/react/icons/icon-png/index.d.ts +8 -0
- package/generated/react/icons/icon-poop/index.d.ts +8 -0
- package/generated/react/icons/icon-postcard/index.d.ts +8 -0
- package/generated/react/icons/icon-pound/index.d.ts +8 -0
- package/generated/react/icons/icon-power/index.d.ts +8 -0
- package/generated/react/icons/icon-power-plant/index.d.ts +8 -0
- package/generated/react/icons/icon-printer/index.d.ts +8 -0
- package/generated/react/icons/icon-push/index.d.ts +8 -0
- package/generated/react/icons/icon-qr-code/index.d.ts +8 -0
- package/generated/react/icons/icon-rainy/index.d.ts +8 -0
- package/generated/react/icons/icon-raising-hand/index.d.ts +8 -0
- package/generated/react/icons/icon-reading-list/index.d.ts +8 -0
- package/generated/react/icons/icon-receipt-bill/index.d.ts +8 -0
- package/generated/react/icons/icon-receiption-bell/index.d.ts +8 -0
- package/generated/react/icons/icon-record/index.d.ts +8 -0
- package/generated/react/icons/icon-refund/index.d.ts +8 -0
- package/generated/react/icons/icon-robot/index.d.ts +8 -0
- package/generated/react/icons/icon-rocket/index.d.ts +8 -0
- package/generated/react/icons/icon-run-shortcut/index.d.ts +8 -0
- package/generated/react/icons/icon-safari/index.d.ts +8 -0
- package/generated/react/icons/icon-school/index.d.ts +8 -0
- package/generated/react/icons/icon-scissors/index.d.ts +8 -0
- package/generated/react/icons/icon-search-menu/index.d.ts +8 -0
- package/generated/react/icons/icon-settings-gear/index.d.ts +8 -0
- package/generated/react/icons/icon-settings-slider-hor/index.d.ts +8 -0
- package/generated/react/icons/icon-settings-slider-ver/index.d.ts +8 -0
- package/generated/react/icons/icon-shapes/index.d.ts +8 -0
- package/generated/react/icons/icon-share/index.d.ts +8 -0
- package/generated/react/icons/icon-shield/index.d.ts +8 -0
- package/generated/react/icons/icon-shield-checked/index.d.ts +8 -0
- package/generated/react/icons/icon-shield-crossed/index.d.ts +8 -0
- package/generated/react/icons/icon-shopping-bag/index.d.ts +8 -0
- package/generated/react/icons/icon-signature/index.d.ts +8 -0
- package/generated/react/icons/icon-smartwatch/index.d.ts +8 -0
- package/generated/react/icons/icon-solar/index.d.ts +8 -0
- package/generated/react/icons/icon-sort/index.d.ts +8 -0
- package/generated/react/icons/icon-sort-ascending/index.d.ts +8 -0
- package/generated/react/icons/icon-sort-descending/index.d.ts +8 -0
- package/generated/react/icons/icon-sort-down/index.d.ts +8 -0
- package/generated/react/icons/icon-sort-up/index.d.ts +8 -0
- package/generated/react/icons/icon-square-arrow-top-right/index.d.ts +8 -0
- package/generated/react/icons/icon-square-behind-square/index.d.ts +8 -0
- package/generated/react/icons/icon-square-grid-circle/index.d.ts +8 -0
- package/generated/react/icons/icon-square-placeholder/index.d.ts +8 -0
- package/generated/react/icons/icon-star/index.d.ts +8 -0
- package/generated/react/icons/icon-store/index.d.ts +8 -0
- package/generated/react/icons/icon-sun/index.d.ts +8 -0
- package/generated/react/icons/icon-sunset-arrow-down/index.d.ts +8 -0
- package/generated/react/icons/icon-tag/index.d.ts +8 -0
- package/generated/react/icons/icon-target-arrow/index.d.ts +8 -0
- package/generated/react/icons/icon-television/index.d.ts +8 -0
- package/generated/react/icons/icon-tennis/index.d.ts +8 -0
- package/generated/react/icons/icon-text-edit/index.d.ts +8 -0
- package/generated/react/icons/icon-thermostat/index.d.ts +8 -0
- package/generated/react/icons/icon-thumbs-down/index.d.ts +8 -0
- package/generated/react/icons/icon-thumbs-up/index.d.ts +8 -0
- package/generated/react/icons/icon-ticket/index.d.ts +8 -0
- package/generated/react/icons/icon-trading-view-candles/index.d.ts +8 -0
- package/generated/react/icons/icon-trash-can/index.d.ts +8 -0
- package/generated/react/icons/icon-tree/index.d.ts +8 -0
- package/generated/react/icons/icon-trending-five/index.d.ts +8 -0
- package/generated/react/icons/icon-trending-four/index.d.ts +8 -0
- package/generated/react/icons/icon-trending-one/index.d.ts +8 -0
- package/generated/react/icons/icon-trending-three/index.d.ts +8 -0
- package/generated/react/icons/icon-trending-two/index.d.ts +8 -0
- package/generated/react/icons/icon-triangle-exclamation/index.d.ts +8 -0
- package/generated/react/icons/icon-truck/index.d.ts +8 -0
- package/generated/react/icons/icon-umbrella-security/index.d.ts +8 -0
- package/generated/react/icons/icon-unlocked/index.d.ts +8 -0
- package/generated/react/icons/icon-volume-full/index.d.ts +8 -0
- package/generated/react/icons/icon-volume-half/index.d.ts +8 -0
- package/generated/react/icons/icon-volume-off/index.d.ts +8 -0
- package/generated/react/icons/icon-wallet/index.d.ts +8 -0
- package/generated/react/icons/icon-warning-sign/index.d.ts +8 -0
- package/generated/react/icons/icon-wifi-full/index.d.ts +8 -0
- package/generated/react/icons/icon-youtube/index.d.ts +8 -0
- package/generated/react/icons/icon-zap/index.d.ts +8 -0
- package/generated/react/icons/icon-zoom-in/index.d.ts +8 -0
- package/generated/react/icons/icon-zoom-out/index.d.ts +8 -0
- package/generated/react/img/index.d.ts +8 -0
- package/generated/react/index.d.ts +8 -8
- package/generated/react/index.js +8 -8
- package/generated/react/input/index.d.ts +10 -0
- package/generated/react/link/index.d.ts +8 -0
- package/generated/react/list-item/index.d.ts +8 -0
- package/generated/react/mask/index.d.ts +8 -0
- package/generated/react/menu-button/index.d.ts +8 -0
- package/generated/react/menu-heading/index.d.ts +8 -0
- package/generated/react/menu-item/index.d.ts +8 -0
- package/generated/react/option/index.d.ts +8 -0
- package/generated/react/pagination/index.d.ts +8 -0
- package/generated/react/popover/index.d.ts +8 -0
- package/generated/react/radio/index.d.ts +8 -0
- package/generated/react/radio-group/index.d.ts +10 -0
- package/generated/react/rich-text/index.d.ts +8 -0
- package/generated/react/segment/index.d.ts +8 -0
- package/generated/react/segmented-control/index.d.ts +8 -0
- package/generated/react/select/index.d.ts +10 -0
- package/generated/react/sensitive-account/index.d.ts +8 -0
- package/generated/react/sensitive-date/index.d.ts +8 -0
- package/generated/react/sensitive-number/index.d.ts +8 -0
- package/generated/react/signal/index.d.ts +8 -0
- package/generated/react/spinner/index.d.ts +8 -0
- package/generated/react/switch/index.d.ts +8 -0
- package/generated/react/table/index.d.ts +8 -0
- package/generated/react/text/index.d.ts +8 -0
- package/generated/react/textarea/index.d.ts +10 -0
- package/generated/react/theme/index.d.ts +8 -0
- package/generated/react/video/index.d.ts +8 -0
- package/package.json +1 -1
- package/utils/decorators/aria-forwarding.d.ts +38 -0
- package/utils/decorators/aria-forwarding.js +130 -0
- package/utils/decorators/aria-forwarding.types.d.ts +59 -0
- package/utils/decorators/aria-forwarding.types.js +14 -0
- package/utils/decorators/observe-attributes.d.ts +31 -0
- package/utils/decorators/observe-attributes.js +54 -0
- package/utils/helpers/custom-element-scoping.js +1 -1
|
@@ -211,6 +211,14 @@ export declare const GdsSensitiveAccount: {
|
|
|
211
211
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
212
212
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
213
213
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
214
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
215
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
216
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
217
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
218
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
219
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
220
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
221
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
214
222
|
readonly baseURI?: string | undefined;
|
|
215
223
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
216
224
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -213,6 +213,14 @@ export declare const GdsSensitiveDate: {
|
|
|
213
213
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
214
214
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
215
215
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
216
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
217
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
218
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
219
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
220
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
221
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
222
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
223
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
216
224
|
readonly baseURI?: string | undefined;
|
|
217
225
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
218
226
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -214,6 +214,14 @@ export declare const GdsSensitiveNumber: {
|
|
|
214
214
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
215
215
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
216
216
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
217
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
218
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
219
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
220
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
221
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
222
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
223
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
224
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
217
225
|
readonly baseURI?: string | undefined;
|
|
218
226
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
219
227
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -144,6 +144,14 @@ export declare const GdsSignal: {
|
|
|
144
144
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
145
145
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
146
146
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
147
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
148
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
149
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
150
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
151
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
152
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
153
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
154
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
147
155
|
readonly baseURI?: string | undefined;
|
|
148
156
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
149
157
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -166,6 +166,14 @@ export declare const GdsSpinner: {
|
|
|
166
166
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
167
167
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
168
168
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
169
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
170
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
171
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
172
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
173
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
174
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
175
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
176
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
169
177
|
readonly baseURI?: string | undefined;
|
|
170
178
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
171
179
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -189,6 +189,14 @@ export declare const GdsSwitch: {
|
|
|
189
189
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
190
190
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
191
191
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
192
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
193
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
194
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
195
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
196
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
197
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
198
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
199
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
192
200
|
readonly baseURI?: string | undefined;
|
|
193
201
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
194
202
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -193,6 +193,14 @@ export declare const GdsTable: {
|
|
|
193
193
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
194
194
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
195
195
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
196
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
197
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
198
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
199
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
200
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
201
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
202
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
203
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
196
204
|
readonly baseURI?: string | undefined;
|
|
197
205
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
198
206
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -208,6 +208,14 @@ export declare const GdsText: {
|
|
|
208
208
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
209
209
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
210
210
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
211
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
212
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
213
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
214
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
215
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
216
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
217
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
218
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
211
219
|
readonly baseURI?: string | undefined;
|
|
212
220
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
213
221
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -11,6 +11,8 @@ type GdsTextareaProps = Omit<React.ComponentProps<ReturnType<typeof getReactComp
|
|
|
11
11
|
}) => void;
|
|
12
12
|
/** Fired when the clear button is clicked. */
|
|
13
13
|
onGdsInputCleared?: (event: CustomEvent<any>) => void;
|
|
14
|
+
/** Fired when the extended supporting text is opened or closed by the user. Can be cancelled to prevent it from opening or closing. */
|
|
15
|
+
onGdsUiState?: (event: CustomEvent<any>) => void;
|
|
14
16
|
};
|
|
15
17
|
export declare const GdsTextarea: {
|
|
16
18
|
(props: GdsTextareaProps & {
|
|
@@ -212,6 +214,14 @@ export declare const GdsTextarea: {
|
|
|
212
214
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
213
215
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
214
216
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
217
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
218
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
219
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
220
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
221
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
222
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
223
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
224
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
215
225
|
readonly baseURI?: string | undefined;
|
|
216
226
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
217
227
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -151,6 +151,14 @@ export declare const GdsTheme: {
|
|
|
151
151
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
152
152
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
153
153
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
154
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
155
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
156
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
157
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
158
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
159
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
160
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
161
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
154
162
|
readonly baseURI?: string | undefined;
|
|
155
163
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
156
164
|
readonly firstChild?: ChildNode | null | undefined;
|
|
@@ -186,6 +186,14 @@ export declare const GdsVideo: {
|
|
|
186
186
|
setPointerCapture?: ((pointerId: number) => void) | undefined;
|
|
187
187
|
toggleAttribute?: ((qualifiedName: string, force?: boolean) => boolean) | undefined;
|
|
188
188
|
webkitMatchesSelector?: ((selectors: string) => boolean) | undefined;
|
|
189
|
+
ariaActiveDescendantElement?: Element | null | undefined;
|
|
190
|
+
ariaControlsElements?: Element[] | null | undefined;
|
|
191
|
+
ariaDescribedByElements?: Element[] | null | undefined;
|
|
192
|
+
ariaDetailsElements?: Element[] | null | undefined;
|
|
193
|
+
ariaErrorMessageElements?: Element[] | null | undefined;
|
|
194
|
+
ariaFlowToElements?: Element[] | null | undefined;
|
|
195
|
+
ariaLabelledByElements?: Element[] | null | undefined;
|
|
196
|
+
ariaOwnsElements?: Element[] | null | undefined;
|
|
189
197
|
readonly baseURI?: string | undefined;
|
|
190
198
|
readonly childNodes?: NodeListOf<ChildNode> | undefined;
|
|
191
199
|
readonly firstChild?: ChildNode | null | undefined;
|
package/package.json
CHANGED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import type { LitElement } from 'lit';
|
|
2
|
+
import { type AriaForwardingConfig, type AriaRefKey, type AriaRefMeta } from './aria-forwarding.types';
|
|
3
|
+
/**
|
|
4
|
+
* Derives the full ARIA metadata from a config key using naming conventions.
|
|
5
|
+
*
|
|
6
|
+
* Convention:
|
|
7
|
+
* - `labelledBy` → attr: `aria-labelledby`, prop: `ariaLabelledByElements`
|
|
8
|
+
* - `activeDescendant` → attr: `aria-activedescendant`, prop: `ariaActiveDescendantElement` (singular)
|
|
9
|
+
*/
|
|
10
|
+
export declare function getAriaRefMeta(key: AriaRefKey): AriaRefMeta;
|
|
11
|
+
type Constructor<T = LitElement> = new (...args: any[]) => T;
|
|
12
|
+
/**
|
|
13
|
+
* Class decorator that configures reactive ARIA element-reference forwarding
|
|
14
|
+
* from the host web component to inner shadow DOM elements.
|
|
15
|
+
*
|
|
16
|
+
* Both `aria-*` and `gds-aria-*` attributes are observed. When either changes,
|
|
17
|
+
* the space-separated IDs are resolved to elements via `getElementById` and
|
|
18
|
+
* forwarded to the configured target element using the ARIAMixin element-reference
|
|
19
|
+
* property (e.g., `ariaLabelledByElements`).
|
|
20
|
+
*
|
|
21
|
+
* The `aria*Elements` properties are also intercepted on the host, so programmatic
|
|
22
|
+
* setting (e.g., `el.ariaLabelledByElements = [label]`) is forwarded as well.
|
|
23
|
+
*
|
|
24
|
+
* Config values are CSS selector strings resolved against the component's shadowRoot.
|
|
25
|
+
*
|
|
26
|
+
* @example
|
|
27
|
+
* ```ts
|
|
28
|
+
* @ariaForwarding({
|
|
29
|
+
* labelledBy: 'input',
|
|
30
|
+
* describedBy: 'input',
|
|
31
|
+
* activeDescendant: '[role="listbox"]',
|
|
32
|
+
* })
|
|
33
|
+
* @gdsCustomElement('gds-input')
|
|
34
|
+
* class GdsInput extends GdsFormControlElement { ... }
|
|
35
|
+
* ```
|
|
36
|
+
*/
|
|
37
|
+
export declare function ariaForwarding(config: AriaForwardingConfig): <T extends Constructor>(constructor: T) => T;
|
|
38
|
+
export {};
|
|
@@ -0,0 +1,130 @@
|
|
|
1
|
+
import "../../chunks/chunk.CAV4X6PU.js";
|
|
2
|
+
import { observeAttributes } from "./observe-attributes.js";
|
|
3
|
+
function getAriaRefMeta(key) {
|
|
4
|
+
const isSingle = key === "activeDescendant";
|
|
5
|
+
const attrSuffix = key.toLowerCase();
|
|
6
|
+
const propSuffix = isSingle ? "Element" : "Elements";
|
|
7
|
+
const property = `aria${key.charAt(0).toUpperCase()}${key.slice(1)}${propSuffix}`;
|
|
8
|
+
return {
|
|
9
|
+
ariaAttr: `aria-${attrSuffix}`,
|
|
10
|
+
gdsAriaAttr: `gds-aria-${attrSuffix}`,
|
|
11
|
+
property,
|
|
12
|
+
type: isSingle ? "single" : "list"
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
const ARIA_STORE = Symbol("ariaForwardingStore");
|
|
16
|
+
const ARIA_INIT = Symbol("ariaForwardingInit");
|
|
17
|
+
function setElementProperty(el, prop, value) {
|
|
18
|
+
const current = el[prop];
|
|
19
|
+
const record = el;
|
|
20
|
+
if (value === null) {
|
|
21
|
+
record[prop] = null;
|
|
22
|
+
return;
|
|
23
|
+
}
|
|
24
|
+
const currentArray = current === null ? [] : Array.isArray(current) ? current : [current];
|
|
25
|
+
const newArray = Array.isArray(value) ? value : [value];
|
|
26
|
+
const combined = Array.from(/* @__PURE__ */ new Set([...currentArray, ...newArray]));
|
|
27
|
+
record[prop] = combined.length > 0 ? combined : null;
|
|
28
|
+
}
|
|
29
|
+
function ariaForwarding(config) {
|
|
30
|
+
const configuredEntries = [];
|
|
31
|
+
for (const [key, selector] of Object.entries(config)) {
|
|
32
|
+
if (!selector)
|
|
33
|
+
continue;
|
|
34
|
+
configuredEntries.push({ key, selector });
|
|
35
|
+
}
|
|
36
|
+
return function(constructor) {
|
|
37
|
+
const origConnected = constructor.prototype.connectedCallback;
|
|
38
|
+
class AriaForwardingElement extends constructor {
|
|
39
|
+
connectedCallback() {
|
|
40
|
+
origConnected?.call(this);
|
|
41
|
+
initAriaForwarding(this);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
const attrHandlers = {};
|
|
45
|
+
for (const { key } of configuredEntries) {
|
|
46
|
+
const meta = getAriaRefMeta(key);
|
|
47
|
+
const handler = (host, _oldValue, newValue) => {
|
|
48
|
+
forwardAriaRefFromAttribute(host, key, newValue);
|
|
49
|
+
};
|
|
50
|
+
attrHandlers[meta.ariaAttr] = handler;
|
|
51
|
+
attrHandlers[meta.gdsAriaAttr] = handler;
|
|
52
|
+
}
|
|
53
|
+
observeAttributes(AriaForwardingElement, attrHandlers);
|
|
54
|
+
function initAriaForwarding(host) {
|
|
55
|
+
if (host[ARIA_INIT])
|
|
56
|
+
return;
|
|
57
|
+
host[ARIA_INIT] = true;
|
|
58
|
+
host[ARIA_STORE] = {};
|
|
59
|
+
for (const { key } of configuredEntries) {
|
|
60
|
+
const meta = getAriaRefMeta(key);
|
|
61
|
+
const propName = meta.property;
|
|
62
|
+
if (!Object.getOwnPropertyDescriptor(
|
|
63
|
+
AriaForwardingElement.prototype,
|
|
64
|
+
propName
|
|
65
|
+
)) {
|
|
66
|
+
Object.defineProperty(AriaForwardingElement.prototype, propName, {
|
|
67
|
+
get() {
|
|
68
|
+
return this[ARIA_STORE]?.[propName] ?? null;
|
|
69
|
+
},
|
|
70
|
+
set(value) {
|
|
71
|
+
if (!this[ARIA_STORE])
|
|
72
|
+
this[ARIA_STORE] = {};
|
|
73
|
+
this[ARIA_STORE][propName] = value;
|
|
74
|
+
forwardAriaRefProperty(this, key, value);
|
|
75
|
+
},
|
|
76
|
+
configurable: true,
|
|
77
|
+
enumerable: true
|
|
78
|
+
});
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
host.updateComplete.then(() => {
|
|
82
|
+
for (const { key } of configuredEntries) {
|
|
83
|
+
const meta = getAriaRefMeta(key);
|
|
84
|
+
const gdsValue = host.getAttribute(meta.gdsAriaAttr);
|
|
85
|
+
const ariaValue = host.getAttribute(meta.ariaAttr);
|
|
86
|
+
const value = gdsValue ?? ariaValue;
|
|
87
|
+
if (value) {
|
|
88
|
+
forwardAriaRefFromAttribute(host, key, value);
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
function forwardAriaRefFromAttribute(host, refKey, value) {
|
|
94
|
+
const meta = getAriaRefMeta(refKey);
|
|
95
|
+
const selector = config[refKey];
|
|
96
|
+
if (!selector)
|
|
97
|
+
return;
|
|
98
|
+
host.updateComplete.then(() => {
|
|
99
|
+
const targets = host.shadowRoot?.querySelectorAll(selector);
|
|
100
|
+
if (!targets || targets.length === 0)
|
|
101
|
+
return;
|
|
102
|
+
if (!value) {
|
|
103
|
+
targets.forEach((t) => setElementProperty(t, meta.property, null));
|
|
104
|
+
return;
|
|
105
|
+
}
|
|
106
|
+
const ids = value.trim().split(/\s+/);
|
|
107
|
+
const elements = ids.map((id) => host.ownerDocument.getElementById(id)).filter((el) => el !== null);
|
|
108
|
+
const resolved = meta.type === "single" ? elements[0] ?? null : elements.length > 0 ? elements : null;
|
|
109
|
+
targets.forEach((t) => setElementProperty(t, meta.property, resolved));
|
|
110
|
+
});
|
|
111
|
+
}
|
|
112
|
+
function forwardAriaRefProperty(host, refKey, value) {
|
|
113
|
+
const selector = config[refKey];
|
|
114
|
+
if (!selector)
|
|
115
|
+
return;
|
|
116
|
+
const meta = getAriaRefMeta(refKey);
|
|
117
|
+
host.updateComplete.then(() => {
|
|
118
|
+
const targets = host.shadowRoot?.querySelectorAll(selector);
|
|
119
|
+
if (!targets || targets.length === 0)
|
|
120
|
+
return;
|
|
121
|
+
targets.forEach((t) => setElementProperty(t, meta.property, value));
|
|
122
|
+
});
|
|
123
|
+
}
|
|
124
|
+
return AriaForwardingElement;
|
|
125
|
+
};
|
|
126
|
+
}
|
|
127
|
+
export {
|
|
128
|
+
ariaForwarding,
|
|
129
|
+
getAriaRefMeta
|
|
130
|
+
};
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* TypeScript type augmentations for ARIAMixin element-reference properties.
|
|
3
|
+
*
|
|
4
|
+
* These properties are defined in the ARIA 1.3 spec (Section 10.1 - ARIAMixin)
|
|
5
|
+
* but are not yet included in TypeScript's DOM lib (as of TS 5.5.4).
|
|
6
|
+
*/
|
|
7
|
+
declare global {
|
|
8
|
+
interface Element {
|
|
9
|
+
ariaActiveDescendantElement: Element | null;
|
|
10
|
+
ariaControlsElements: Element[] | null;
|
|
11
|
+
ariaDescribedByElements: Element[] | null;
|
|
12
|
+
ariaDetailsElements: Element[] | null;
|
|
13
|
+
ariaErrorMessageElements: Element[] | null;
|
|
14
|
+
ariaFlowToElements: Element[] | null;
|
|
15
|
+
ariaLabelledByElements: Element[] | null;
|
|
16
|
+
ariaOwnsElements: Element[] | null;
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Metadata for a single ARIA element-reference relationship.
|
|
21
|
+
* Derived automatically from the config key via convention.
|
|
22
|
+
*/
|
|
23
|
+
export interface AriaRefMeta {
|
|
24
|
+
/** The standard `aria-*` attribute name (e.g., `aria-labelledby`) */
|
|
25
|
+
ariaAttr: string;
|
|
26
|
+
/** The `gds-aria-*` prefixed attribute name (e.g., `gds-aria-labelledby`) */
|
|
27
|
+
gdsAriaAttr: string;
|
|
28
|
+
/** The ARIAMixin element-reference property name (e.g., `ariaLabelledByElements`) */
|
|
29
|
+
property: string;
|
|
30
|
+
/** Whether this is a single element reference or a list */
|
|
31
|
+
type: 'single' | 'list';
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* All known ARIA element-reference keys.
|
|
35
|
+
* The config key (e.g., `labelledBy`) maps by convention to:
|
|
36
|
+
* - Attribute: `aria-labelledby` / `gds-aria-labelledby`
|
|
37
|
+
* - Property: `ariaLabelledByElements`
|
|
38
|
+
* - Type: `single` for activeDescendant, `list` for all others
|
|
39
|
+
*/
|
|
40
|
+
export declare const ARIA_REF_KEYS: readonly ["activeDescendant", "controls", "describedBy", "details", "errorMessage", "flowTo", "labelledBy", "owns"];
|
|
41
|
+
export type AriaRefKey = (typeof ARIA_REF_KEYS)[number];
|
|
42
|
+
/**
|
|
43
|
+
* Configuration for the `@ariaForwarding` decorator.
|
|
44
|
+
*
|
|
45
|
+
* Each key is an ARIA relationship name. The value is a CSS selector string
|
|
46
|
+
* pointing to the target element inside the component's shadow DOM.
|
|
47
|
+
*
|
|
48
|
+
* @example
|
|
49
|
+
* ```ts
|
|
50
|
+
* @ariaForwarding({
|
|
51
|
+
* labelledBy: 'input',
|
|
52
|
+
* describedBy: 'input',
|
|
53
|
+
* activeDescendant: '[role="listbox"]',
|
|
54
|
+
* })
|
|
55
|
+
* ```
|
|
56
|
+
*/
|
|
57
|
+
export type AriaForwardingConfig = {
|
|
58
|
+
[K in AriaRefKey]?: string;
|
|
59
|
+
};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A low-level utility for observing DOM attributes on custom elements
|
|
3
|
+
* without coupling to Lit's reactive property/rendering lifecycle.
|
|
4
|
+
*
|
|
5
|
+
* Handles:
|
|
6
|
+
* - Accumulating `observedAttributes` across multiple decorator calls
|
|
7
|
+
* - Routing `attributeChangedCallback` to per-attribute handler functions
|
|
8
|
+
* - Chaining with Lit's own `attributeChangedCallback` for its reactive properties
|
|
9
|
+
* - Inheritance-safe handler maps (own map per constructor)
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* ```ts
|
|
13
|
+
* // Inside a decorator:
|
|
14
|
+
* observeAttributes(MyElement, {
|
|
15
|
+
* 'aria-labelledby': (host, oldVal, newVal) => { ... },
|
|
16
|
+
* 'gds-aria-labelledby': (host, oldVal, newVal) => { ... },
|
|
17
|
+
* })
|
|
18
|
+
* ```
|
|
19
|
+
*/
|
|
20
|
+
type AttrHandler = (host: any, oldValue: string | null, newValue: string | null) => void;
|
|
21
|
+
/**
|
|
22
|
+
* Register one or more non-reactive attribute observers on a custom element class.
|
|
23
|
+
*
|
|
24
|
+
* Safe to call multiple times on the same constructor — handlers accumulate
|
|
25
|
+
* and the prototype patching is idempotent.
|
|
26
|
+
*
|
|
27
|
+
* @param ctor The custom element constructor (class) to patch.
|
|
28
|
+
* @param handlers A record mapping attribute names to handler functions.
|
|
29
|
+
*/
|
|
30
|
+
export declare function observeAttributes(ctor: any, handlers: Record<string, AttrHandler>): void;
|
|
31
|
+
export {};
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import "../../chunks/chunk.CAV4X6PU.js";
|
|
2
|
+
const ATTR_HANDLERS = Symbol("observeAttrHandlers");
|
|
3
|
+
const PATCHED = Symbol("observeAttrPatched");
|
|
4
|
+
function observeAttributes(ctor, handlers) {
|
|
5
|
+
if (!Object.prototype.hasOwnProperty.call(ctor, ATTR_HANDLERS)) {
|
|
6
|
+
const parentMap = Object.getPrototypeOf(ctor)?.[ATTR_HANDLERS];
|
|
7
|
+
ctor[ATTR_HANDLERS] = new Map(parentMap);
|
|
8
|
+
}
|
|
9
|
+
for (const [attr, handler] of Object.entries(handlers)) {
|
|
10
|
+
ctor[ATTR_HANDLERS].set(attr, handler);
|
|
11
|
+
}
|
|
12
|
+
if (ctor[PATCHED])
|
|
13
|
+
return;
|
|
14
|
+
ctor[PATCHED] = true;
|
|
15
|
+
const parentChainStart = Object.getPrototypeOf(ctor);
|
|
16
|
+
Object.defineProperty(ctor, "observedAttributes", {
|
|
17
|
+
get() {
|
|
18
|
+
let parent = [];
|
|
19
|
+
let proto = parentChainStart;
|
|
20
|
+
while (proto) {
|
|
21
|
+
const desc = Object.getOwnPropertyDescriptor(
|
|
22
|
+
proto,
|
|
23
|
+
"observedAttributes"
|
|
24
|
+
);
|
|
25
|
+
if (desc?.get) {
|
|
26
|
+
parent = desc.get.call(this);
|
|
27
|
+
break;
|
|
28
|
+
}
|
|
29
|
+
proto = Object.getPrototypeOf(proto);
|
|
30
|
+
}
|
|
31
|
+
const handlers2 = this[ATTR_HANDLERS];
|
|
32
|
+
const custom = Array.from(handlers2?.keys() ?? []);
|
|
33
|
+
return [...parent, ...custom];
|
|
34
|
+
},
|
|
35
|
+
configurable: true,
|
|
36
|
+
enumerable: true
|
|
37
|
+
});
|
|
38
|
+
const parentProto = Object.getPrototypeOf(ctor.prototype);
|
|
39
|
+
Object.defineProperty(ctor.prototype, "attributeChangedCallback", {
|
|
40
|
+
value: function(name, oldValue, newValue) {
|
|
41
|
+
const handler = this.constructor[ATTR_HANDLERS]?.get(name);
|
|
42
|
+
if (handler) {
|
|
43
|
+
handler(this, oldValue, newValue);
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
parentProto.attributeChangedCallback?.call(this, name, oldValue, newValue);
|
|
47
|
+
},
|
|
48
|
+
configurable: true,
|
|
49
|
+
writable: true
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
export {
|
|
53
|
+
observeAttributes
|
|
54
|
+
};
|