@m3e/web 2.1.3 → 2.2.1
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/README.md +5 -2
- package/dist/all.js +2916 -391
- package/dist/all.js.map +1 -1
- package/dist/all.min.js +77 -41
- package/dist/all.min.js.map +1 -1
- package/dist/app-bar.js +14 -7
- package/dist/app-bar.js.map +1 -1
- package/dist/app-bar.min.js +1 -1
- package/dist/app-bar.min.js.map +1 -1
- package/dist/autocomplete.js +59 -23
- package/dist/autocomplete.js.map +1 -1
- package/dist/autocomplete.min.js +1 -1
- package/dist/autocomplete.min.js.map +1 -1
- package/dist/bottom-sheet.js +8 -27
- package/dist/bottom-sheet.js.map +1 -1
- package/dist/bottom-sheet.min.js +1 -1
- package/dist/bottom-sheet.min.js.map +1 -1
- package/dist/calendar.js +1082 -0
- package/dist/calendar.js.map +1 -0
- package/dist/calendar.min.js +43 -0
- package/dist/calendar.min.js.map +1 -0
- package/dist/chips.js +2 -6
- package/dist/chips.js.map +1 -1
- package/dist/chips.min.js +1 -1
- package/dist/chips.min.js.map +1 -1
- package/dist/core-a11y.js +23 -9
- package/dist/core-a11y.js.map +1 -1
- package/dist/core-a11y.min.js +4 -4
- package/dist/core-a11y.min.js.map +1 -1
- package/dist/core-anchoring.js +135 -15
- package/dist/core-anchoring.js.map +1 -1
- package/dist/core-anchoring.min.js +1 -1
- package/dist/core-anchoring.min.js.map +1 -1
- package/dist/core.js +101 -1
- package/dist/core.js.map +1 -1
- package/dist/core.min.js +1 -1
- package/dist/core.min.js.map +1 -1
- package/dist/css-custom-data.json +1146 -646
- package/dist/custom-elements.json +31433 -26898
- package/dist/datepicker.js +573 -0
- package/dist/datepicker.js.map +1 -0
- package/dist/datepicker.min.js +7 -0
- package/dist/datepicker.min.js.map +1 -0
- package/dist/drawer-container.js +10 -4
- package/dist/drawer-container.js.map +1 -1
- package/dist/drawer-container.min.js +1 -1
- package/dist/drawer-container.min.js.map +1 -1
- package/dist/fab-menu.js +1 -1
- package/dist/fab-menu.js.map +1 -1
- package/dist/fab-menu.min.js +1 -1
- package/dist/fab-menu.min.js.map +1 -1
- package/dist/form-field.js +2 -6
- package/dist/form-field.js.map +1 -1
- package/dist/form-field.min.js +3 -3
- package/dist/form-field.min.js.map +1 -1
- package/dist/html-custom-data.json +553 -187
- package/dist/menu.js +3 -7
- package/dist/menu.js.map +1 -1
- package/dist/menu.min.js +1 -1
- package/dist/menu.min.js.map +1 -1
- package/dist/nav-bar.js +17 -7
- package/dist/nav-bar.js.map +1 -1
- package/dist/nav-bar.min.js +1 -1
- package/dist/nav-bar.min.js.map +1 -1
- package/dist/nav-menu.js +3 -11
- package/dist/nav-menu.js.map +1 -1
- package/dist/nav-menu.min.js +1 -1
- package/dist/nav-menu.min.js.map +1 -1
- package/dist/nav-rail.js +2 -6
- package/dist/nav-rail.js.map +1 -1
- package/dist/nav-rail.min.js +1 -1
- package/dist/nav-rail.min.js.map +1 -1
- package/dist/option.js +4 -8
- package/dist/option.js.map +1 -1
- package/dist/option.min.js +1 -1
- package/dist/option.min.js.map +1 -1
- package/dist/paginator.js.map +1 -1
- package/dist/paginator.min.js.map +1 -1
- package/dist/search.js +821 -0
- package/dist/search.js.map +1 -0
- package/dist/search.min.js +7 -0
- package/dist/search.min.js.map +1 -0
- package/dist/segmented-button.js +2 -2
- package/dist/segmented-button.js.map +1 -1
- package/dist/segmented-button.min.js.map +1 -1
- package/dist/select.js +4 -15
- package/dist/select.js.map +1 -1
- package/dist/select.min.js +1 -1
- package/dist/select.min.js.map +1 -1
- package/dist/snackbar.js +2 -6
- package/dist/snackbar.js.map +1 -1
- package/dist/snackbar.min.js +1 -1
- package/dist/snackbar.min.js.map +1 -1
- package/dist/split-button.js +1 -1
- package/dist/split-button.js.map +1 -1
- package/dist/split-button.min.js.map +1 -1
- package/dist/src/all.d.ts +3 -0
- package/dist/src/all.d.ts.map +1 -1
- package/dist/src/app-bar/AppBarElement.d.ts +6 -4
- package/dist/src/app-bar/AppBarElement.d.ts.map +1 -1
- package/dist/src/autocomplete/AutocompleteElement.d.ts +7 -2
- package/dist/src/autocomplete/AutocompleteElement.d.ts.map +1 -1
- package/dist/src/autocomplete/AutocompleteQueryEventDetail.d.ts +12 -0
- package/dist/src/autocomplete/AutocompleteQueryEventDetail.d.ts.map +1 -0
- package/dist/src/autocomplete/QueryEventDetail.d.ts +3 -8
- package/dist/src/autocomplete/QueryEventDetail.d.ts.map +1 -1
- package/dist/src/autocomplete/index.d.ts +1 -0
- package/dist/src/autocomplete/index.d.ts.map +1 -1
- package/dist/src/bottom-sheet/BottomSheetElement.d.ts.map +1 -1
- package/dist/src/calendar/CalendarElement.d.ts +213 -0
- package/dist/src/calendar/CalendarElement.d.ts.map +1 -0
- package/dist/src/calendar/CalendarView.d.ts +3 -0
- package/dist/src/calendar/CalendarView.d.ts.map +1 -0
- package/dist/src/calendar/CalendarViewElementBase.d.ts +28 -0
- package/dist/src/calendar/CalendarViewElementBase.d.ts.map +1 -0
- package/dist/src/calendar/MonthViewElement.d.ts +36 -0
- package/dist/src/calendar/MonthViewElement.d.ts.map +1 -0
- package/dist/src/calendar/MultiYearViewElement.d.ts +27 -0
- package/dist/src/calendar/MultiYearViewElement.d.ts.map +1 -0
- package/dist/src/calendar/YearViewElement.d.ts +27 -0
- package/dist/src/calendar/YearViewElement.d.ts.map +1 -0
- package/dist/src/calendar/index.d.ts +7 -0
- package/dist/src/calendar/index.d.ts.map +1 -0
- package/dist/src/calendar/utils.d.ts +24 -0
- package/dist/src/calendar/utils.d.ts.map +1 -0
- package/dist/src/chips/InputChipSetElement.d.ts.map +1 -1
- package/dist/src/core/a11y/FocusTrapElement.d.ts.map +1 -1
- package/dist/src/core/a11y/InteractivityChecker.d.ts.map +1 -1
- package/dist/src/core/anchoring/AnchorOptions.d.ts +1 -1
- package/dist/src/core/anchoring/AnchorOptions.d.ts.map +1 -1
- package/dist/src/core/anchoring/FloatingPanelElement.d.ts +18 -3
- package/dist/src/core/anchoring/FloatingPanelElement.d.ts.map +1 -1
- package/dist/src/core/anchoring/positionAnchor.d.ts.map +1 -1
- package/dist/src/core/shared/controllers/InertController.d.ts +19 -0
- package/dist/src/core/shared/controllers/InertController.d.ts.map +1 -0
- package/dist/src/core/shared/controllers/index.d.ts +1 -0
- package/dist/src/core/shared/controllers/index.d.ts.map +1 -1
- package/dist/src/core/shared/converters/dateConverter.d.ts +4 -0
- package/dist/src/core/shared/converters/dateConverter.d.ts.map +1 -0
- package/dist/src/core/shared/converters/index.d.ts +1 -0
- package/dist/src/core/shared/converters/index.d.ts.map +1 -1
- package/dist/src/core/shared/utils/index.d.ts +1 -0
- package/dist/src/core/shared/utils/index.d.ts.map +1 -1
- package/dist/src/core/shared/utils/registerStyleSheet.d.ts +7 -0
- package/dist/src/core/shared/utils/registerStyleSheet.d.ts.map +1 -0
- package/dist/src/datepicker/DatepickerElement.d.ts +239 -0
- package/dist/src/datepicker/DatepickerElement.d.ts.map +1 -0
- package/dist/src/datepicker/DatepickerToggleElement.d.ts +21 -0
- package/dist/src/datepicker/DatepickerToggleElement.d.ts.map +1 -0
- package/dist/src/datepicker/DatepickerVariant.d.ts +3 -0
- package/dist/src/datepicker/DatepickerVariant.d.ts.map +1 -0
- package/dist/src/datepicker/index.d.ts +4 -0
- package/dist/src/datepicker/index.d.ts.map +1 -0
- package/dist/src/drawer-container/DrawerContainerElement.d.ts +2 -2
- package/dist/src/drawer-container/DrawerContainerElement.d.ts.map +1 -1
- package/dist/src/form-field/FormFieldElement.d.ts.map +1 -1
- package/dist/src/menu/MenuElement.d.ts.map +1 -1
- package/dist/src/nav-bar/NavBarElement.d.ts +3 -1
- package/dist/src/nav-bar/NavBarElement.d.ts.map +1 -1
- package/dist/src/nav-menu/NavMenuElement.d.ts.map +1 -1
- package/dist/src/nav-menu/NavMenuItemElement.d.ts.map +1 -1
- package/dist/src/nav-rail/NavRailElement.d.ts.map +1 -1
- package/dist/src/option/OptionPanelElement.d.ts.map +1 -1
- package/dist/src/paginator/PageEventDetail.d.ts +6 -11
- package/dist/src/paginator/PageEventDetail.d.ts.map +1 -1
- package/dist/src/paginator/PaginatorElement.d.ts +2 -2
- package/dist/src/paginator/PaginatorElement.d.ts.map +1 -1
- package/dist/src/paginator/PaginatorPageEventDetail.d.ts +12 -0
- package/dist/src/paginator/PaginatorPageEventDetail.d.ts.map +1 -0
- package/dist/src/paginator/index.d.ts +1 -0
- package/dist/src/paginator/index.d.ts.map +1 -1
- package/dist/src/search/SearchBarElement.d.ts +92 -0
- package/dist/src/search/SearchBarElement.d.ts.map +1 -0
- package/dist/src/search/SearchViewElement.d.ts +150 -0
- package/dist/src/search/SearchViewElement.d.ts.map +1 -0
- package/dist/src/search/SearchViewMode.d.ts +3 -0
- package/dist/src/search/SearchViewMode.d.ts.map +1 -0
- package/dist/src/search/SearchViewQueryEventDetail.d.ts +12 -0
- package/dist/src/search/SearchViewQueryEventDetail.d.ts.map +1 -0
- package/dist/src/search/index.d.ts +5 -0
- package/dist/src/search/index.d.ts.map +1 -0
- package/dist/src/search/styles/SearchBarStyle.d.ts +12 -0
- package/dist/src/search/styles/SearchBarStyle.d.ts.map +1 -0
- package/dist/src/search/styles/SearchBarToken.d.ts +27 -0
- package/dist/src/search/styles/SearchBarToken.d.ts.map +1 -0
- package/dist/src/search/styles/SearchViewStyle.d.ts +12 -0
- package/dist/src/search/styles/SearchViewStyle.d.ts.map +1 -0
- package/dist/src/search/styles/SearchViewToken.d.ts +26 -0
- package/dist/src/search/styles/SearchViewToken.d.ts.map +1 -0
- package/dist/src/search/styles/index.d.ts +3 -0
- package/dist/src/search/styles/index.d.ts.map +1 -0
- package/dist/src/segmented-button/ButtonSegmentElement.d.ts +2 -2
- package/dist/src/select/SelectElement.d.ts.map +1 -1
- package/dist/src/snackbar/SnackbarElement.d.ts.map +1 -1
- package/dist/src/split-button/SplitButtonElement.d.ts +1 -1
- package/dist/src/stepper/StepperElement.d.ts +3 -1
- package/dist/src/stepper/StepperElement.d.ts.map +1 -1
- package/dist/src/switch/SwitchElement.d.ts +2 -2
- package/dist/stepper.js +18 -12
- package/dist/stepper.js.map +1 -1
- package/dist/stepper.min.js +1 -1
- package/dist/stepper.min.js.map +1 -1
- package/dist/switch.js +2 -2
- package/dist/switch.js.map +1 -1
- package/dist/switch.min.js.map +1 -1
- package/dist/tooltip.js +1 -1
- package/dist/tooltip.js.map +1 -1
- package/dist/tooltip.min.js +1 -1
- package/dist/tooltip.min.js.map +1 -1
- package/package.json +16 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search.js","sources":["../../src/search/styles/SearchBarToken.ts","../../src/search/styles/SearchBarStyle.ts","../../src/search/styles/SearchViewToken.ts","../../src/search/styles/SearchViewStyle.ts","../../src/search/SearchBarElement.ts","../../src/search/SearchViewElement.ts"],"sourcesContent":["import { unsafeCSS } from \"lit\";\r\n\r\nimport { DesignToken } from \"@m3e/web/core\";\r\n\r\n/** @internal */\r\nexport const SearchBarToken = {\r\n containerColor: unsafeCSS(`var(--m3e-search-bar-container-color, ${DesignToken.color.surfaceContainerHigh})`),\r\n leadingIconColor: unsafeCSS(`var(--m3e-search-bar-leading-icon-color, ${DesignToken.color.onSurface})`),\r\n trailingIconColor: unsafeCSS(`var(--m3e-search-bar-trailing-icon-color, ${DesignToken.color.onSurfaceVariant})`),\r\n containerHeight: unsafeCSS(\"var(--m3e-search-bar-container-height, 3.5rem)\"),\r\n containerShape: unsafeCSS(`var(--m3e-search-bar-container-shape, ${DesignToken.shape.corner.full})`),\r\n iconSize: unsafeCSS(\"var(--m3e-search-bar-icon-size, 1.5rem)\"),\r\n supportingTextColor: unsafeCSS(`var(--m3e-search-bar-supporting-text-color, ${DesignToken.color.onSurfaceVariant})`),\r\n supportingTextFontSize: unsafeCSS(\r\n `var(--m3e-search-bar-supporting-text-font-size, ${DesignToken.typescale.standard.body.large.fontSize})`,\r\n ),\r\n supportingTextFontWeight: unsafeCSS(\r\n `var(--m3e-search-bar-supporting-text-font-weight, ${DesignToken.typescale.standard.body.large.fontWeight})`,\r\n ),\r\n supportingTextLineHeight: unsafeCSS(\r\n `var(--m3e-search-bar-supporting-text-line-height, ${DesignToken.typescale.standard.body.large.lineHeight})`,\r\n ),\r\n supportingTextTracking: unsafeCSS(\r\n `var(--m3e-search-bar-supporting-text-tracking, ${DesignToken.typescale.standard.body.large.tracking})`,\r\n ),\r\n inputColor: unsafeCSS(`var(--m3e-search-bar-input-color, ${DesignToken.color.onSurface})`),\r\n inputTextFontSize: unsafeCSS(\r\n `var(--m3e-search-bar-input-text-font-size, ${DesignToken.typescale.standard.body.large.fontSize})`,\r\n ),\r\n inputTextFontWeight: unsafeCSS(\r\n `var(--m3e-search-bar-input-text-font-weight, ${DesignToken.typescale.standard.body.large.fontWeight})`,\r\n ),\r\n inputTextLineHeight: unsafeCSS(\r\n `var(--m3e-search-bar-input-text-line-height, ${DesignToken.typescale.standard.body.large.lineHeight})`,\r\n ),\r\n inputTextTracking: unsafeCSS(\r\n `var(--m3e-search-bar-input-text-tracking, ${DesignToken.typescale.standard.body.large.tracking})`,\r\n ),\r\n leadingSpace: unsafeCSS(\"var(--m3e-search-bar-leading-space, 0.25rem)\"),\r\n trailingSpace: unsafeCSS(\"var(--m3e-search-bar-trailing-space, 0.25rem)\"),\r\n noActionsLeadingSpace: unsafeCSS(\"var(--m3e-search-bar-no-actions-leading-space, 1rem)\"),\r\n noActionsTrailingSpace: unsafeCSS(\"var(--m3e-search-bar-no-actions-trailing-space, 1rem)\"),\r\n leadingActionsTrailingSpace: unsafeCSS(\"var(--m3e-search-bar-leading-actions-trailing-space, 0.25rem)\"),\r\n trailingActionsLeadingSpace: unsafeCSS(\"var(--m3e-search-bar-trailing-actions-leading-space, 0.25rem)\"),\r\n actionsGap: unsafeCSS(\"var(--m3e-search-bar-actions-gap, 0px)\"),\r\n} as const;\r\n","import { css, CSSResultGroup } from \"lit\";\r\n\r\nimport { SearchBarToken } from \"./SearchBarToken\";\r\n\r\n/**\r\n * Light DOM styles for `M3eSearchBarElement`.\r\n * @internal\r\n */\r\nexport const SearchBarLightDomStyle = css`\r\n m3e-search-bar input[slot=\"input\"]::placeholder {\r\n user-select: none;\r\n color: ${SearchBarToken.supportingTextColor};\r\n font-size: ${SearchBarToken.supportingTextFontSize};\r\n font-weight: ${SearchBarToken.supportingTextFontWeight};\r\n line-height: ${SearchBarToken.supportingTextLineHeight};\r\n letter-spacing: ${SearchBarToken.supportingTextTracking};\r\n }\r\n`;\r\n\r\n/**\r\n * Styles for `M3eSearchBarElement`.\r\n * @internal\r\n */\r\nexport const SearchBarStyle: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n height: ${SearchBarToken.containerHeight};\r\n }\r\n .base {\r\n cursor: text;\r\n display: flex;\r\n align-items: center;\r\n box-sizing: border-box;\r\n width: 100%;\r\n height: 100%;\r\n border-radius: ${SearchBarToken.containerShape};\r\n background-color: ${SearchBarToken.containerColor};\r\n }\r\n .clear {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-sizing: border-box;\r\n min-width: 3rem;\r\n }\r\n :host(:not(:state(-clearable))) .clear {\r\n display: none;\r\n }\r\n :host(:state(-with-leading)) slot[name=\"leading\"],\r\n :host(:state(-with-trailing)) slot[name=\"trailing\"] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-sizing: border-box;\r\n min-width: 3rem;\r\n padding-inline: 0.25rem;\r\n column-gap: calc(0.5rem + ${SearchBarToken.actionsGap});\r\n }\r\n ::slotted([slot=\"input\"]) {\r\n flex: 1 1 auto;\r\n outline: unset;\r\n border: unset;\r\n background-color: transparent;\r\n box-shadow: none;\r\n min-width: 0;\r\n padding: unset;\r\n color: ${SearchBarToken.inputColor};\r\n font-size: ${SearchBarToken.inputTextFontSize};\r\n font-weight: ${SearchBarToken.inputTextFontWeight};\r\n line-height: ${SearchBarToken.inputTextLineHeight};\r\n letter-spacing: ${SearchBarToken.inputTextTracking};\r\n }\r\n :host(:state(-with-leading)) .base {\r\n padding-inline-start: ${SearchBarToken.leadingSpace};\r\n }\r\n :host(:not(:state(-with-leading))) .base {\r\n padding-inline-start: ${SearchBarToken.noActionsLeadingSpace};\r\n }\r\n :host(:is(:state(-with-trailing), :state(-clearable))) .base {\r\n padding-inline-end: ${SearchBarToken.trailingSpace};\r\n }\r\n :host(:not(:is(:state(-with-trailing), :state(-clearable)))) .base {\r\n padding-inline-end: ${SearchBarToken.noActionsTrailingSpace};\r\n }\r\n :host(:state(-with-leading)) ::slotted([slot=\"input\"]) {\r\n margin-inline-start: ${SearchBarToken.leadingActionsTrailingSpace};\r\n }\r\n :host(:is(:state(-with-trailing), :state(-clearable))) ::slotted([slot=\"input\"]) {\r\n margin-inline-end: ${SearchBarToken.trailingActionsLeadingSpace};\r\n }\r\n slot[name=\"leading\"] {\r\n color: ${SearchBarToken.leadingIconColor};\r\n --m3e-icon-color: ${SearchBarToken.leadingIconColor};\r\n --m3e-icon-button-icon-color: ${SearchBarToken.leadingIconColor};\r\n --m3e-icon-size: ${SearchBarToken.iconSize};\r\n }\r\n slot[name=\"trailing\"],\r\n .clear {\r\n color: ${SearchBarToken.trailingIconColor};\r\n --m3e-icon-color: ${SearchBarToken.trailingIconColor};\r\n --m3e-icon-button-icon-color: ${SearchBarToken.trailingIconColor};\r\n --m3e-icon-size: ${SearchBarToken.iconSize};\r\n }\r\n ::slotted(svg[slot=\"leading\"]),\r\n ::slotted(svg[slot=\"trailing\"]) {\r\n width: 1em;\r\n font-size: ${SearchBarToken.iconSize};\r\n }\r\n ::slotted([slot=\"clear-icon\"]),\r\n .clear-icon {\r\n width: 1em;\r\n font-size: ${SearchBarToken.iconSize} !important;\r\n }\r\n slot[name=\"clear-icon\"] {\r\n --m3e-icon-size: ${SearchBarToken.iconSize};\r\n }\r\n @media (forced-colors: active) {\r\n .base {\r\n border: 1px var(--_search-bar-forced-color-outline-style, solid) CanvasText;\r\n }\r\n }\r\n`;\r\n","import { unsafeCSS } from \"lit\";\r\n\r\nimport { DesignToken } from \"@m3e/web/core\";\r\n\r\n/** @internal */\r\nexport const SearchViewToken = {\r\n containerColor: unsafeCSS(`var(--m3e-search-view-container-color, ${DesignToken.color.surfaceContainerHigh})`),\r\n containedContainerColor: unsafeCSS(\r\n `var(--m3e-search-view-contained-container-color, ${DesignToken.color.surfaceContainerLow})`,\r\n ),\r\n dividerColor: unsafeCSS(`var(--m3e-search-view-divider-color, ${DesignToken.color.outline})`),\r\n dividerThickness: unsafeCSS(`var(--m3e-search-view-divider-thickness, 1px)`),\r\n fullScreenContainerShape: unsafeCSS(\r\n `var(--m3e-search-view-full-screen-container-shape, ${DesignToken.shape.corner.none})`,\r\n ),\r\n fullScreenHeaderContainerHeight: unsafeCSS(\"var(--m3e-search-view-full-screen-header-container-height, 4.5rem)\"),\r\n dockedContainerShape: unsafeCSS(\r\n `var(--m3e-search-view-docked-container-shape, ${DesignToken.shape.corner.extraLarge})`,\r\n ),\r\n dockedHeaderContainerHeight: unsafeCSS(\"var(--m3e-search-view-docked-header-container-height, 3.5rem)\"),\r\n containedLeadingMargin: unsafeCSS(\"var(--m3e-search-view-contained-leading-margin, 1.5rem)\"),\r\n containedTrailingMargin: unsafeCSS(\"var(--m3e-search-view-contained-trailing-margin, 1.55rem)\"),\r\n containedFocusedLeadingMargin: unsafeCSS(\"var(--m3e-search-view-contained-focused-leading-margin, 0.75rem)\"),\r\n containedFocusedTrailingMargin: unsafeCSS(\"var(--m3e-search-view-contained-focused-trailing-margin, 0.75rem)\"),\r\n containedDockedBarResultsGap: unsafeCSS(\"var(--m3e-search-view-contained-docked-bar-results-gap, 2px)\"),\r\n containedDockedResultsShape: unsafeCSS(\r\n `var(--m3e-search-view-contained-docked-results-shape, ${DesignToken.shape.corner.medium})`,\r\n ),\r\n containedDockedBarShape: unsafeCSS(\r\n `var(--m3e-search-view-contained-docked-bar-shape, ${DesignToken.shape.corner.full})`,\r\n ),\r\n containedFullScreenBarContainerHeight: unsafeCSS(\r\n \"var(--m3e-search-view-contained-full-screen-bar-container-height, 3.5rem)\",\r\n ),\r\n dockedContainerMinHeight: unsafeCSS(\"var(--m3e-search-view-docked-container-min-height, 240px)\"),\r\n dockedContainerMaxHeight: unsafeCSS(\"var(--m3e-search-view-docked-container-max-height, calc(100vh * 0.6667))\"),\r\n containedDockedResultsSpace: unsafeCSS(\"var(--m3e-search-view-contained-docked-results-space, 0.25rem)\"),\r\n dockedResultsBottomSpace: unsafeCSS(\"var(--m3e-search-view-docked-results-bottom-space, 1rem)\"),\r\n dockedScrimColor: unsafeCSS(`var(--m3e-search-view-docked-scrim-color, ${DesignToken.color.scrim})`),\r\n dockedScrimOpacity: unsafeCSS(\"var(--m3e-search-view-docked-scrim-opacity, 32%)\"),\r\n} as const;\r\n","import { css, CSSResultGroup, unsafeCSS } from \"lit\";\r\n\r\nimport { DesignToken } from \"@m3e/web/core\";\r\n\r\nimport { SearchViewToken } from \"./SearchViewToken\";\r\nimport { SearchBarToken } from \"./SearchBarToken\";\r\n\r\n/**\r\n * Light DOM styles for `M3eSearchViewElement`.\r\n * @internal\r\n */\r\nexport const SearchViewLightDomStyle = css`\r\n m3e-search-view input[slot=\"input\"]::placeholder {\r\n user-select: none;\r\n color: ${SearchBarToken.supportingTextColor};\r\n font-size: ${SearchBarToken.supportingTextFontSize};\r\n font-weight: ${SearchBarToken.supportingTextFontWeight};\r\n line-height: ${SearchBarToken.supportingTextLineHeight};\r\n letter-spacing: ${SearchBarToken.supportingTextTracking};\r\n }\r\n`;\r\n\r\n/**\r\n * Styles for `M3eSearchViewElement`.\r\n * @internal\r\n */\r\nexport const SearchViewStyle: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n }\r\n .base {\r\n position: relative;\r\n width: 100%;\r\n }\r\n .anchor {\r\n position: absolute;\r\n width: 100%;\r\n visibility: hidden;\r\n }\r\n .view {\r\n display: flex;\r\n flex-direction: column;\r\n box-sizing: border-box;\r\n width: 100%;\r\n outline: none;\r\n padding: unset;\r\n margin: unset;\r\n border: unset;\r\n }\r\n .header {\r\n flex: none;\r\n display: flex;\r\n align-items: center;\r\n }\r\n .bar {\r\n flex: 1 1 auto;\r\n }\r\n :host(:state(-fullscreen)) .bar {\r\n transition: ${unsafeCSS(`margin ${DesignToken.motion.duration.short2} ${DesignToken.motion.easing.standard}`)};\r\n }\r\n :host(:state(-fullscreen)[contained]:not([open])) .bar {\r\n margin-inline-start: ${SearchViewToken.containedLeadingMargin};\r\n margin-inline-end: ${SearchViewToken.containedTrailingMargin};\r\n }\r\n :host(:state(-fullscreen)[contained][open]) .bar,\r\n :host(:state(-fullscreen)[contained][open]) .results {\r\n margin-inline-start: ${SearchViewToken.containedFocusedLeadingMargin};\r\n margin-inline-end: ${SearchViewToken.containedFocusedTrailingMargin};\r\n }\r\n .icon {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-sizing: border-box;\r\n min-width: 3rem;\r\n }\r\n ::slotted([slot=\"search-icon\"]),\r\n .search-icon,\r\n ::slotted([slot=\"close-icon\"]),\r\n .close-icon {\r\n width: 1em;\r\n font-size: ${SearchBarToken.iconSize} !important;\r\n }\r\n .results {\r\n overflow: hidden;\r\n flex: 1 1 auto;\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n .scroll-container {\r\n flex: 1 1 auto;\r\n overflow-y: auto;\r\n overflow-x: hidden;\r\n scrollbar-color: ${DesignToken.scrollbar.color};\r\n }\r\n .view:not(:popover-open) .results,\r\n .view.closing .results {\r\n display: none;\r\n }\r\n :host(:not(:is(:state(-clearable), [open]))) .clear {\r\n display: none;\r\n }\r\n ::slotted([slot=\"clear-icon\"]),\r\n .clear-icon {\r\n width: 1em;\r\n font-size: ${SearchBarToken.iconSize} !important;\r\n }\r\n slot[name=\"clear-icon\"] {\r\n --m3e-icon-size: ${SearchBarToken.iconSize};\r\n }\r\n :host(:state(-fullscreen)) .header {\r\n transition: height 150ms cubic-bezier(0.2, 0, 0, 1);\r\n }\r\n :host(:state(-fullscreen)) .view:popover-open:not(.closing) .header {\r\n height: ${SearchViewToken.fullScreenHeaderContainerHeight};\r\n }\r\n :host(:state(-fullscreen):not([open])) .header,\r\n :host(:state(-fullscreen)[open]) .view.closing .header {\r\n height: ${SearchViewToken.containedFullScreenBarContainerHeight};\r\n }\r\n :host(:state(-fullscreen)[open]) .bar {\r\n --m3e-search-bar-container-height: ${SearchViewToken.containedFullScreenBarContainerHeight};\r\n }\r\n :host(:state(-fullscreen)) .anchor {\r\n height: ${SearchViewToken.containedFullScreenBarContainerHeight};\r\n }\r\n :host(:state(-fullscreen)) .view:popover-open {\r\n border-radius: ${SearchViewToken.fullScreenContainerShape};\r\n }\r\n :host(:state(-fullscreen)[contained]) .view:popover-open {\r\n background-color: ${SearchViewToken.containedContainerColor};\r\n }\r\n :host(:state(-fullscreen):not([contained])) .view:popover-open {\r\n background-color: ${SearchViewToken.containerColor};\r\n }\r\n :host(:state(-docked)[open]) .header,\r\n :host(:state(-docked)) .anchor {\r\n height: ${SearchViewToken.dockedHeaderContainerHeight};\r\n }\r\n :host(:not([contained])[open]) .results {\r\n border-top-width: ${SearchViewToken.dividerThickness};\r\n border-top-style: solid;\r\n border-top-color: ${SearchViewToken.dividerColor};\r\n }\r\n :host(:state(-docked)[contained]) .results {\r\n margin-top: ${SearchViewToken.containedDockedBarResultsGap};\r\n }\r\n :host(:state(-docked):not([contained])[open]) .view {\r\n background-color: ${SearchViewToken.containerColor};\r\n --m3e-search-bar-container-color: ${SearchViewToken.containerColor};\r\n }\r\n :host(:state(-docked)[contained]) .results {\r\n background-color: ${SearchViewToken.containerColor};\r\n }\r\n :host(:state(-docked):not([contained])[open]) .view,\r\n :host(:state(-docked)[contained]) .results {\r\n border-radius: ${SearchViewToken.dockedContainerShape};\r\n }\r\n :host(:state(-docked)) .results {\r\n min-height: calc(${SearchViewToken.dockedContainerMinHeight} - ${SearchViewToken.dockedHeaderContainerHeight});\r\n max-height: calc(${SearchViewToken.dockedContainerMaxHeight} - ${SearchViewToken.dockedHeaderContainerHeight});\r\n }\r\n :host(:state(-docked)) .scroll-container {\r\n scrollbar-width: ${DesignToken.scrollbar.thinWidth};\r\n }\r\n :host(:state(-docked):not([contained])) .scroll-container {\r\n padding-bottom: ${SearchViewToken.dockedResultsBottomSpace};\r\n }\r\n :host(:state(-docked)[contained]) .scroll-container {\r\n padding: ${SearchViewToken.containedDockedResultsSpace};\r\n }\r\n :host(:state(-docked)) .results {\r\n transform-origin: top;\r\n transition: ${unsafeCSS(\r\n `transform ${DesignToken.motion.duration.short2} ${DesignToken.motion.easing.standard},\r\n overlay ${DesignToken.motion.duration.short2} ${DesignToken.motion.easing.standard} allow-discrete,\r\n display ${DesignToken.motion.duration.short2} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host(:state(-docked):not([open])) .results {\r\n transform: scaleY(0.8);\r\n }\r\n :host(:state(-docked)[open]) .results {\r\n transform: scaleY(1);\r\n }\r\n @starting-style {\r\n :host(:state(-docked)[open]) .results {\r\n transform: scaleY(0.8);\r\n }\r\n }\r\n :host(:state(-docked)[contained]) .view {\r\n background-color: transparent;\r\n }\r\n :host(:state(-docked):not([open])) .view {\r\n transition: ${unsafeCSS(\r\n `border-radius ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard},\r\n background-color ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard}`,\r\n )};\r\n }\r\n :host(:state(-docked):not([open])) .view::backdrop {\r\n transition: ${unsafeCSS(\r\n `background-color ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host(:state(-docked)) .view::backdrop {\r\n background-color: color-mix(in srgb, ${SearchViewToken.dockedScrimColor} 0%, transparent);\r\n margin-inline-end: -20px;\r\n }\r\n :host(:state(-docked)[open]) .view::backdrop {\r\n background-color: color-mix(\r\n in srgb,\r\n ${SearchViewToken.dockedScrimColor} ${SearchViewToken.dockedScrimOpacity},\r\n transparent\r\n );\r\n transition: ${unsafeCSS(\r\n `background-color ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n @starting-style {\r\n :host(:state(-docked)[open]) .view::backdrop {\r\n background-color: color-mix(in srgb, ${SearchViewToken.dockedScrimColor} 0%, transparent);\r\n }\r\n }\r\n :host(:state(-fullscreen)) .view:popover-open {\r\n width: 100vw;\r\n width: 100dvw;\r\n height: 100vh;\r\n height: 100dvh;\r\n overflow: hidden;\r\n }\r\n @media (prefers-reduced-motion) {\r\n :host(:state(-fullscreen)) .bar,\r\n :host(:state(-fullscreen)) .header,\r\n :host(:state(-docked)) .results,\r\n :host(:state(-docked):not([open])) .view,\r\n :host(:state(-docked):not([open])) .view::backdrop,\r\n :host(:state(-docked)[open]) .view::backdrop {\r\n transition: none;\r\n }\r\n }\r\n @media (forced-colors: active) {\r\n :host(:not([contained])[open]) .bar {\r\n --_search-bar-forced-color-outline-style: none;\r\n }\r\n :host(:state(-docked):not([contained])[open]) .view,\r\n :host(:state(-docked)[contained]) .results {\r\n border: 1px solid CanvasText;\r\n }\r\n :host(:not([contained])[open]) .results {\r\n border-top-color: CanvasText;\r\n }\r\n }\r\n`;\r\n","/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\nimport { html, LitElement, nothing } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport {\r\n AttachInternals,\r\n customElement,\r\n EventAttribute,\r\n hasAssignedNodes,\r\n registerStyleSheet,\r\n setCustomState,\r\n} from \"@m3e/web/core\";\r\n\r\nimport \"@m3e/web/icon-button\";\r\n\r\nimport { SearchBarLightDomStyle, SearchBarStyle } from \"./styles\";\r\n\r\n/**\r\n * A bar that provides a prominent entry point for search.\r\n *\r\n * @description\r\n * The `m3e-search-bar` component provides a prominent entry point for search,\r\n * capturing user input and emitting `query` and `clear` events as the text\r\n * changes. It reflects focus and interaction states through customizable CSS\r\n * properties for container, icons, and text styling.\r\n *\r\n * @example\r\n * The following example illustrates typical usage with a leading icon and the\r\n * ability to clear the current search text.\r\n * ```html\r\n * <m3e-search-bar clearable>\r\n * <m3e-icon name=\"search\" slot=\"leading\"></m3e-icon>\r\n * <input slot=\"input\" placeholder=\"Search...\" />\r\n * </m3e-search-bar>\r\n * ```\r\n *\r\n * @tag m3e-search-bar\r\n *\r\n * @attr clearable - Whether the bar presents a button used to clear the search term.\r\n * @attr clear-label - The accessible label given to the button used to clear the search term.\r\n *\r\n * @slot leading - Renders content before the input of the bar.\r\n * @slot input - Renders the input of the bar.\r\n * @slot trailing - Renders content after the input of the bar.\r\n *\r\n * @fires clear - Dispatched when the search term is cleared.\r\n *\r\n * @cssprop --m3e-search-bar-container-color - Background color of the search bar container.\r\n * @cssprop --m3e-search-bar-leading-icon-color - Color of the leading icon.\r\n * @cssprop --m3e-search-bar-trailing-icon-color - Color of the trailing icon.\r\n * @cssprop --m3e-search-bar-container-height - Height of the search bar container.\r\n * @cssprop --m3e-search-bar-container-shape - Shape (border radius) of the search bar container.\r\n * @cssprop --m3e-search-bar-icon-size - Size of icons inside the search bar.\r\n * @cssprop --m3e-search-bar-supporting-text-color - Color of the supporting text.\r\n * @cssprop --m3e-search-bar-supporting-text-font-size - Font size of the supporting text.\r\n * @cssprop --m3e-search-bar-supporting-text-font-weight - Font weight of the supporting text.\r\n * @cssprop --m3e-search-bar-supporting-text-line-height - Line height of the supporting text.\r\n * @cssprop --m3e-search-bar-supporting-text-tracking - Letter spacing of the supporting text.\r\n * @cssprop --m3e-search-bar-input-color - Color of the input text.\r\n * @cssprop --m3e-search-bar-input-text-font-size - Font size of the input text.\r\n * @cssprop --m3e-search-bar-input-text-font-weight - Font weight of the input text.\r\n * @cssprop --m3e-search-bar-input-text-line-height - Line height of the input text.\r\n * @cssprop --m3e-search-bar-input-text-tracking - Letter spacing of the input text.\r\n * @cssprop --m3e-search-bar-leading-space - Space before the leading icon.\r\n * @cssprop --m3e-search-bar-trailing-space - Space after the trailing icon.\r\n * @cssprop --m3e-search-bar-no-actions-leading-space - Leading padding when no actions are present.\r\n * @cssprop --m3e-search-bar-no-actions-trailing-space - Trailing padding when no actions are present.\r\n * @cssprop --m3e-search-bar-leading-actions-trailing-space - Space between leading actions and the input.\r\n * @cssprop --m3e-search-bar-trailing-actions-leading-space - Space between the input and trailing actions.\r\n * @cssprop --m3e-search-bar-actions-gap - Gap between action icons.\r\n */\r\n@customElement(\"m3e-search-bar\")\r\nexport class M3eSearchBarElement extends EventAttribute(AttachInternals(LitElement), \"clear\") {\r\n static {\r\n registerStyleSheet(SearchBarLightDomStyle);\r\n }\r\n\r\n /** The styles of the element. */\r\n static override styles = SearchBarStyle;\r\n\r\n /** @private */ #input?: HTMLInputElement;\r\n /** @private */ readonly #inputInputHandler = () => this.#handleInputInput();\r\n\r\n /**\r\n * Whether the bar presents a button used to clear the search term.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) clearable = false;\r\n\r\n /**\r\n * The accessible label given to the button used to clear the search term.\r\n * @default \"Clear\"\r\n */\r\n @property({ attribute: \"clear-label\" }) clearLabel = \"Clear\";\r\n\r\n /** Clears the search term. */\r\n clear(): void {\r\n if (!this.#input) return;\r\n this.#input.value = \"\";\r\n this.#handleInputInput();\r\n\r\n this.dispatchEvent(new Event(\"clear\", { bubbles: true, composed: true }));\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`\r\n <div class=\"base\" @click=\"${this.#handleContainerClick}\">\r\n <slot name=\"leading\" @slotchange=\"${this.#handleLeadingSlotChange}\"></slot>\r\n <slot name=\"input\" @slotchange=\"${this.#handleInputSlotChange}\"></slot>\r\n ${this.#renderClearButton()}\r\n <slot name=\"trailing\" @slotchange=\"${this.#handleTrailingSlotChange}\"></slot>\r\n </div>\r\n `;\r\n }\r\n\r\n /** @private */\r\n #renderClearButton(): unknown {\r\n return this.clearable\r\n ? html`<div class=\"clear\">\r\n <m3e-icon-button aria-label=\"${this.clearLabel}\" @click=\"${this.#handleClearClick}\">\r\n <slot name=\"clear-icon\">\r\n <svg class=\"clear-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\"\r\n />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>\r\n </div>`\r\n : nothing;\r\n }\r\n\r\n /** @private */\r\n #handleContainerClick(): void {\r\n if (!this.matches(\":focus-within\")) {\r\n this.#input?.focus();\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleLeadingSlotChange(e: Event): void {\r\n setCustomState(this, \"-with-leading\", hasAssignedNodes(e.target as HTMLSlotElement));\r\n }\r\n\r\n /** @private */\r\n #handleTrailingSlotChange(e: Event): void {\r\n setCustomState(this, \"-with-trailing\", hasAssignedNodes(e.target as HTMLSlotElement));\r\n }\r\n\r\n /** @private */\r\n #handleInputSlotChange(e: Event): void {\r\n const input = (e.target as HTMLSlotElement)\r\n .assignedElements({ flatten: true })\r\n .find((x) => x instanceof HTMLInputElement);\r\n\r\n if (input != this.#input) {\r\n this.#input?.removeEventListener(\"input\", this.#inputInputHandler);\r\n this.#input = input;\r\n this.#input?.addEventListener(\"input\", this.#inputInputHandler);\r\n\r\n if (this.#input) {\r\n this.#input.role = this.#input.role || \"searchbox\";\r\n this.#input.inputMode = this.#input.inputMode || \"search\";\r\n this.#input.type = \"text\";\r\n }\r\n\r\n this.#handleInputInput();\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleInputInput(): void {\r\n setCustomState(this, \"-clearable\", this.clearable && (this.#input?.value ?? \"\").length > 0);\r\n }\r\n\r\n /** @private */\r\n #handleClearClick(): void {\r\n this.clear();\r\n this.#input?.focus();\r\n }\r\n}\r\n\r\ninterface M3eSearchBarElementEventMap extends HTMLElementEventMap {\r\n clear: Event;\r\n}\r\n\r\nexport interface M3eSearchBarElement {\r\n addEventListener<K extends keyof M3eSearchBarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSearchBarElement, ev: M3eSearchBarElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSearchBarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSearchBarElement, ev: M3eSearchBarElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-search-bar\": M3eSearchBarElement;\r\n }\r\n}\r\n","/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\nimport { html, LitElement, nothing, PropertyValues, svg } from \"lit\";\r\nimport { property, query, state } from \"lit/decorators.js\";\r\nimport { ifDefined } from \"lit/directives/if-defined.js\";\r\n\r\nimport {\r\n AttachInternals,\r\n customElement,\r\n debounce,\r\n EventAttribute,\r\n FocusController,\r\n InertController,\r\n prefersReducedMotion,\r\n ReconnectedCallback,\r\n registerStyleSheet,\r\n ScrollLockController,\r\n setCustomState,\r\n} from \"@m3e/web/core\";\r\n\r\nimport { positionAnchor } from \"@m3e/web/core/anchoring\";\r\nimport { M3eDirectionality } from \"@m3e/web/core/bidi\";\r\nimport { Breakpoint, M3eBreakpointObserver } from \"@m3e/web/core/layout\";\r\n\r\nimport \"@m3e/web/core/a11y\";\r\n\r\nimport { SearchViewLightDomStyle, SearchViewStyle } from \"./styles\";\r\nimport { SearchViewMode } from \"./SearchViewMode\";\r\nimport { SearchViewQueryEventDetail } from \"./SearchViewQueryEventDetail\";\r\n\r\nimport \"./SearchBarElement\";\r\n\r\n/**\r\n * A surface that presents suggestions and results for a search.\r\n *\r\n * @description\r\n * The `m3e-search-view` component presents the surface for suggestions,\r\n * history, and results, managing the open and close lifecycle around an\r\n * embedded search bar. It emits `query`, `clear`, and `toggle`, events to\r\n * support application driven search logic, and exposes CSS properties for\r\n * container, shape, spacing, and layout across contained, docked, and full\r\n * screen configurations.\r\n *\r\n * @example\r\n * The following example shows a contained view in docked mode with a simple set of search results.\r\n * ```html\r\n * <m3e-search-view mode=\"docked\" contained>\r\n * <input slot=\"input\" placeholder=\"Search...\" />\r\n * <m3e-list>\r\n * <m3e-list-item>Result One</m3e-list-item>\r\n * <m3e-list-item>Result Two</m3e-list-item>\r\n * <m3e-list-item>Result Three</m3e-list-item>\r\n * </m3e-list>\r\n * </m3e-search-view>\r\n * ```\r\n *\r\n * @tag m3e-search-view\r\n *\r\n * @attr contained - Whether the view features a persistent, filled search container.\r\n * @attr mode - The behavior mode of the view.\r\n * @attr open - Whether the view is expanded to show results.\r\n * @attr clear-label - The accessible label given to the button used to clear the search term.\r\n * @attr close-label - The accessible label given to the button used to collapse the view.\r\n * @attr hide-search-icon - Whether to hide the search icon.\r\n *\r\n * @slot - When open, renders the results content of the view.\r\n * @slot input - Renders the input of the view.\r\n * @slot open-leading - When open, renders content before the input of the view.\r\n * @slot open-trailing - When open, renders content after the input of the view.\r\n * @slot closed-leading - When closed, renders content before the input of the view.\r\n * @slot closed-trailing - When closed, renders content after the input of the view.\r\n *\r\n * @fires clear - Dispatched when the search term is cleared.\r\n * @fires query - Dispatched when the view is opened or when the user modifies the search term.\r\n * @fires beforetoggle - Dispatched before the toggle state changes.\r\n * @fires toggle - Dispatched after the toggle state has changed.\r\n *\r\n * @cssprop --m3e-search-view-container-color - Background color of the view container.\r\n * @cssprop --m3e-search-view-contained-container-color - Background color of the contained view container.\r\n * @cssprop --m3e-search-view-divider-color - Color of the divider separating header and results.\r\n * @cssprop --m3e-search-view-divider-thickness - Thickness of the divider separating header and results.\r\n * @cssprop --m3e-search-view-full-screen-container-shape - Shape of the fullscreen view container.\r\n * @cssprop --m3e-search-view-full-screen-header-container-height - Height of the header container in fullscreen mode.\r\n * @cssprop --m3e-search-view-docked-container-shape - Shape of the docked view container.\r\n * @cssprop --m3e-search-view-docked-header-container-height - Height of the header container in docked mode.\r\n * @cssprop --m3e-search-view-contained-leading-margin - Leading margin for the contained view.\r\n * @cssprop --m3e-search-view-contained-trailing-margin - Trailing margin for the contained view.\r\n * @cssprop --m3e-search-view-contained-focused-leading-margin - Leading margin when the contained view is focused.\r\n * @cssprop --m3e-search-view-contained-focused-trailing-margin - Trailing margin when the contained view is focused.\r\n * @cssprop --m3e-search-view-contained-docked-bar-results-gap - Gap between the contained docked bar and results.\r\n * @cssprop --m3e-search-view-contained-docked-results-shape - Shape of the results container in contained docked mode.\r\n * @cssprop --m3e-search-view-contained-docked-bar-shape - Shape of the bar in contained docked mode.\r\n * @cssprop --m3e-search-view-contained-full-screen-bar-container-height - Height of the bar container in contained fullscreen mode.\r\n * @cssprop --m3e-search-view-docked-container-min-height - Minimum height of the docked view container.\r\n * @cssprop --m3e-search-view-docked-container-max-height - Maximum height of the docked view container.\r\n * @cssprop --m3e-search-view-contained-docked-results-space - Space above the results in contained docked mode.\r\n * @cssprop --m3e-search-view-docked-results-bottom-space - Space below the results in docked mode.\r\n * @cssprop --m3e-search-view-docked-scrim-color - Color of the scrim behind the docked view.\r\n * @cssprop --m3e-search-view-docked-scrim-opacity - Opacity of the scrim behind the docked view.\r\n */\r\n@customElement(\"m3e-search-view\")\r\nexport class M3eSearchViewElement extends EventAttribute(\r\n ReconnectedCallback(AttachInternals(LitElement)),\r\n \"clear\",\r\n \"query\",\r\n) {\r\n static {\r\n registerStyleSheet(SearchViewLightDomStyle);\r\n }\r\n\r\n /** The styles of the element. */\r\n static override styles = SearchViewStyle;\r\n\r\n /** @private */ #input?: HTMLInputElement;\r\n /** @private */ #closeOnInputFocus = false;\r\n /** @private */ readonly #inputInputHandler = () => this.#handleInputInput();\r\n /** @private */ readonly #inputFocusHandler = () => this.#handleInputFocus();\r\n /** @private */ readonly #inputKeyDownHandler = (e: KeyboardEvent) => this.#handleInputKeyDown(e);\r\n /** @private */ readonly #inputPointerHandler = () => this.#handleInputPointerDown();\r\n\r\n /** @private */ readonly #scrollLockController = new ScrollLockController(this);\r\n /** @private */ readonly #inertController = new InertController(this);\r\n\r\n /** @private */ @state() private _clearable = false;\r\n /** @private */ @state() private _mode?: Exclude<SearchViewMode, \"auto\">;\r\n /** @private */ #openMode?: Exclude<SearchViewMode, \"auto\">;\r\n\r\n /** @private */ #anchorCleanup?: () => void;\r\n /** @private */ #breakpointUnobserve?: () => void;\r\n /** @private */ @query(\".anchor\") private readonly _anchor!: HTMLElement;\r\n /** @private */ @query(\".view\") private readonly _view!: HTMLElement;\r\n\r\n constructor() {\r\n super();\r\n\r\n new FocusController(this, {\r\n callback: (focused) => this._handleFocusChange(focused),\r\n });\r\n }\r\n\r\n /**\r\n * Whether the view features a persistent, filled search container.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) contained = false;\r\n\r\n /**\r\n * The behavior mode of the view.\r\n * @default \"docked\"\r\n */\r\n @property({ reflect: true }) mode: SearchViewMode = \"docked\";\r\n\r\n /**\r\n * Whether the view is expanded to show results.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) open = false;\r\n\r\n /**\r\n * The accessible label given to the button used to clear the search term.\r\n * @default \"Clear\"\r\n */\r\n @property({ attribute: \"clear-label\" }) clearLabel = \"Clear\";\r\n\r\n /**\r\n * The accessible label given to the button used to collapse the view.\r\n * @default \"Close\"\r\n */\r\n @property({ attribute: \"close-label\" }) closeLabel = \"Close\";\r\n\r\n /**\r\n * Whether to hide the search icon.\r\n * @default false;\r\n */\r\n @property({ attribute: \"hide-search-icon\", type: Boolean }) hideSearchIcon = false;\r\n\r\n /** The current mode applied to the view. */\r\n get currentMode(): Exclude<SearchViewMode, \"auto\"> {\r\n return this._mode ?? (this.mode !== \"fullscreen\" ? \"docked\" : \"fullscreen\");\r\n }\r\n set currentMode(value: Exclude<SearchViewMode, \"auto\">) {\r\n this._mode = value;\r\n }\r\n\r\n /** Clears the search term. */\r\n clear(): void {\r\n if (!this.#input) return;\r\n this.#input.value = \"\";\r\n this.#updateClearableState();\r\n\r\n this.dispatchEvent(\r\n new CustomEvent<SearchViewQueryEventDetail>(\"query\", {\r\n detail: { term: \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n\r\n this.dispatchEvent(new Event(\"clear\", { bubbles: true, composed: true }));\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n\r\n this._mode = undefined;\r\n this.#breakpointUnobserve?.();\r\n }\r\n\r\n /** @inheritdoc */\r\n override reconnectedCallback(): void {\r\n super.reconnectedCallback();\r\n\r\n if (this.mode === \"auto\") {\r\n this.#initBreakpointMonitoring();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override willUpdate(changedProperties: PropertyValues): void {\r\n super.willUpdate(changedProperties);\r\n\r\n if (changedProperties.has(\"mode\")) {\r\n this.#breakpointUnobserve?.();\r\n\r\n const previousMode = changedProperties.get(\"mode\");\r\n if (previousMode && previousMode !== this.mode && this.open) {\r\n this.open = false;\r\n }\r\n\r\n if (this.mode === \"auto\") {\r\n this.#initBreakpointMonitoring();\r\n } else {\r\n this._mode = undefined;\r\n this.#updateMode();\r\n }\r\n }\r\n if (changedProperties.has(\"_mode\")) {\r\n this.#updateMode();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues<this>): void {\r\n super.updated(_changedProperties);\r\n if (_changedProperties.has(\"open\")) {\r\n if (!this.open) {\r\n if ((this.#openMode ?? this.currentMode) === \"fullscreen\") {\r\n this.#closeFullscreen();\r\n } else {\r\n this.#closeDocked();\r\n }\r\n } else {\r\n if (this.currentMode === \"fullscreen\") {\r\n this.#openFullscreen();\r\n } else {\r\n this.#openDocked();\r\n }\r\n }\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html` <div class=\"base\">\r\n <div class=\"anchor\"></div>\r\n <div\r\n role=\"${ifDefined(this.open ? \"dialog\" : undefined)}\"\r\n aria-modal=\"${ifDefined(this.open ? \"true\" : undefined)}\"\r\n aria-labelledby=\"${ifDefined(this.open ? \"header\" : undefined)}\"\r\n class=\"view\"\r\n tabindex=\"-1\"\r\n @keydown=\"${this.#handleKeyDown}\"\r\n >\r\n <m3e-focus-trap ?disabled=\"${!this.open}\">\r\n <div class=\"header\" id=\"header\">\r\n <m3e-search-bar class=\"bar\">\r\n ${this.#renderIconOrBackButton()}\r\n ${this.open\r\n ? html`<slot name=\"open-leading\" slot=\"leading\"></slot>`\r\n : html`<slot name=\"closed-leading\" slot=\"leading\"></slot>`}\r\n <slot name=\"input\" slot=\"input\" @slotchange=\"${this.#handleInputSlotChange}\"></slot>\r\n ${this.#renderClearButton()}\r\n ${this.open\r\n ? html`<slot name=\"open-trailing\" slot=\"trailing\"></slot>`\r\n : html`<slot name=\"closed-trailing\" slot=\"trailing\"></slot>`}\r\n </m3e-search-bar>\r\n </div>\r\n <div class=\"results\">\r\n <div class=\"scroll-container\">\r\n <slot></slot>\r\n </div>\r\n </div>\r\n </m3e-focus-trap>\r\n </div>\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #renderIconOrBackButton(): unknown {\r\n if (!this.open && this.hideSearchIcon) return nothing;\r\n return html`<div class=\"icon\" slot=\"leading\">${this.open ? this.#renderBackButton() : this.#renderIcon()}</div>`;\r\n }\r\n\r\n /** @private */\r\n #renderIcon(): unknown {\r\n return html`<slot name=\"search-icon\">\r\n <svg class=\"search-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z\"\r\n />\r\n </svg>\r\n </slot>`;\r\n }\r\n\r\n /** @private */\r\n #renderBackButton(): unknown {\r\n return html`<m3e-icon-button\r\n class=\"close\"\r\n slot=\"leading\"\r\n aria-label=\"${this.closeLabel}\"\r\n @click=\"${this.#handleCloseClick}\"\r\n >\r\n <slot name=\"close-icon\">\r\n <svg class=\"close-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n ${this.currentMode === \"docked\"\r\n ? svg`<path d=\"m313-440 224 224-57 56-320-320 320-320 57 56-224 224h487v80H313Z\"/>`\r\n : svg`<path d=\"M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z\"/>`}\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #renderClearButton(): unknown {\r\n return html`<m3e-icon-button\r\n class=\"clear\"\r\n slot=\"trailing\"\r\n aria-label=\"${this.open && !this._clearable ? this.closeLabel : this.clearLabel}\"\r\n @click=\"${this.#handleClearClick}\"\r\n >\r\n <slot name=\"clear-icon\">\r\n <svg class=\"clear-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\" />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #initBreakpointMonitoring(): void {\r\n this.#breakpointUnobserve = M3eBreakpointObserver.observe([Breakpoint.XSmall], (matches) => {\r\n const currentMode = this.currentMode;\r\n this._mode = matches.get(Breakpoint.XSmall) ? \"fullscreen\" : \"docked\";\r\n if (currentMode !== this._mode && this.open) {\r\n this.open = false;\r\n }\r\n this.#updateMode();\r\n });\r\n }\r\n\r\n /** @private */\r\n #handleInputSlotChange(e: Event): void {\r\n const input = (e.target as HTMLSlotElement)\r\n .assignedElements({ flatten: true })\r\n .find((x) => x instanceof HTMLInputElement);\r\n\r\n if (input != this.#input) {\r\n this.#input?.removeEventListener(\"input\", this.#inputInputHandler);\r\n this.#input?.removeEventListener(\"focus\", this.#inputFocusHandler);\r\n this.#input?.removeEventListener(\"keydown\", this.#inputKeyDownHandler);\r\n this.#input?.removeEventListener(\"pointerdown\", this.#inputPointerHandler);\r\n\r\n this.#input = input;\r\n\r\n this.#input?.addEventListener(\"input\", this.#inputInputHandler);\r\n this.#input?.addEventListener(\"focus\", this.#inputFocusHandler);\r\n this.#input?.addEventListener(\"keydown\", this.#inputKeyDownHandler);\r\n this.#input?.addEventListener(\"pointerdown\", this.#inputPointerHandler);\r\n\r\n if (this.#input) {\r\n this.#input.role = this.#input.role || \"searchbox\";\r\n this.#input.inputMode = this.#input.inputMode || \"search\";\r\n this.#input.type = \"text\";\r\n this.#input.ariaHasPopup = \"dialog\";\r\n }\r\n\r\n this.#updateClearableState();\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleInputInput(): void {\r\n this.#updateClearableState();\r\n if (this.open) {\r\n this.dispatchEvent(\r\n new CustomEvent<SearchViewQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input?.value ?? \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n } else {\r\n this.open = true;\r\n }\r\n }\r\n\r\n /** @private */\r\n #updateMode(): void {\r\n setCustomState(this, \"-fullscreen\", this.currentMode === \"fullscreen\");\r\n setCustomState(this, \"-docked\", this.currentMode === \"docked\");\r\n }\r\n\r\n /** @private */\r\n #updateClearableState(): void {\r\n this._clearable = (this.#input?.value ?? \"\").length > 0;\r\n setCustomState(this, \"-clearable\", this._clearable);\r\n }\r\n\r\n /** @private */\r\n #handleInputFocus(): void {\r\n this.open = !this.#closeOnInputFocus;\r\n this.#closeOnInputFocus = false;\r\n }\r\n\r\n /** @private */\r\n #handleCloseClick(): void {\r\n if (!this.#input) return;\r\n if (this.#input.value) {\r\n this.clear();\r\n }\r\n this.#closeOnInputFocus = true;\r\n this.#input?.focus();\r\n }\r\n\r\n /** @private */\r\n #handleClearClick(): void {\r\n if (!this.#input) return;\r\n if (this.#input.value) {\r\n this.clear();\r\n } else {\r\n this.#closeOnInputFocus = true;\r\n }\r\n this.#input?.focus();\r\n }\r\n\r\n /** @private */\r\n #handleInputPointerDown(): void {\r\n if (!this.open && this.#input?.matches(\":focus\")) {\r\n this.open = true;\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleInputKeyDown(e: KeyboardEvent): void {\r\n if (this.open && e.key === \"Escape\" && !e.shiftKey && !e.ctrlKey) {\r\n e.preventDefault();\r\n\r\n const input = e.target as HTMLInputElement;\r\n if (input.value) {\r\n this.clear();\r\n }\r\n\r\n this.open = false;\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleKeyDown(e: KeyboardEvent): void {\r\n if (this.open && e.key === \"Escape\" && !e.shiftKey && !e.ctrlKey) {\r\n e.preventDefault();\r\n this.#handleCloseClick();\r\n }\r\n }\r\n\r\n /** @private */\r\n @debounce(40)\r\n private _handleFocusChange(focused: boolean) {\r\n if (!focused && this.currentMode === \"docked\") {\r\n this.clear();\r\n this.open = false;\r\n }\r\n }\r\n\r\n /** @private */\r\n async #openDocked(): Promise<void> {\r\n if (\r\n !this.dispatchEvent(\r\n new ToggleEvent(\"beforetoggle\", {\r\n oldState: \"closed\",\r\n newState: \"open\",\r\n bubbles: true,\r\n composed: true,\r\n cancelable: true,\r\n }),\r\n )\r\n ) {\r\n this.open = false;\r\n return;\r\n }\r\n\r\n this.#openMode = this.currentMode;\r\n const view = this._view;\r\n\r\n this.#anchorCleanup?.();\r\n this.#anchorCleanup = await positionAnchor(\r\n view,\r\n this._anchor,\r\n {\r\n position: \"bottom\",\r\n },\r\n (x, y) => {\r\n const view = this._view;\r\n view.style.top = `${y - this._anchor.clientHeight}px`;\r\n view.style.width = `${this._anchor.clientWidth}px`;\r\n\r\n if (M3eDirectionality.current === \"rtl\") {\r\n view.style.right = `${window.innerWidth - x - this.clientWidth}px`;\r\n view.style.left = \"\";\r\n } else {\r\n view.style.left = `${x}px`;\r\n view.style.right = \"\";\r\n }\r\n },\r\n );\r\n\r\n this._anchor.style.position = \"relative\";\r\n view.popover = \"manual\";\r\n view.style.position = \"absolute\";\r\n view.showPopover();\r\n this.#scrollLockController.lock();\r\n this.#inertController.lock();\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: \"closed\",\r\n newState: \"open\",\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n\r\n this.dispatchEvent(\r\n new CustomEvent<SearchViewQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input?.value ?? \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n\r\n /** @private */\r\n #closeDocked(): void {\r\n const view = this._view;\r\n if (view.popover !== \"manual\") return;\r\n if (\r\n !this.dispatchEvent(\r\n new ToggleEvent(\"beforetoggle\", {\r\n oldState: \"open\",\r\n newState: \"closed\",\r\n bubbles: true,\r\n composed: true,\r\n cancelable: true,\r\n }),\r\n )\r\n ) {\r\n this.open = true;\r\n return;\r\n }\r\n\r\n this.#openMode = undefined;\r\n this.#scrollLockController.unlock();\r\n this.#inertController.unlock();\r\n\r\n if (prefersReducedMotion()) {\r\n this.#hideDocked();\r\n } else {\r\n view.classList.add(\"closing\");\r\n view.addEventListener(\"transitionend\", () => this.#hideDocked(), { once: true });\r\n }\r\n }\r\n\r\n /** @private */\r\n #hideDocked(): void {\r\n this.#anchorCleanup?.();\r\n this.#anchorCleanup = undefined;\r\n\r\n const view = this._view;\r\n view.classList.remove(\"closing\");\r\n view.style.position = \"\";\r\n view.style.width = \"\";\r\n view.style.top = \"\";\r\n view.style.left = \"\";\r\n view.style.right = \"\";\r\n view.hidePopover();\r\n view.popover = null;\r\n this._anchor.style.position = \"\";\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: \"open\",\r\n newState: \"closed\",\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n\r\n /** @private */\r\n async #openFullscreen(): Promise<void> {\r\n if (\r\n !this.dispatchEvent(\r\n new ToggleEvent(\"beforetoggle\", {\r\n oldState: \"closed\",\r\n newState: \"open\",\r\n bubbles: true,\r\n composed: true,\r\n cancelable: true,\r\n }),\r\n )\r\n ) {\r\n this.open = false;\r\n return;\r\n }\r\n\r\n this.#openMode = this.currentMode;\r\n this.#scrollLockController.lock();\r\n this.#inertController.lock();\r\n\r\n const view = this._view;\r\n this.#anchorCleanup?.();\r\n\r\n if (!prefersReducedMotion()) {\r\n const rect = view.getBoundingClientRect();\r\n const startInline = M3eDirectionality.current === \"rtl\" ? window.innerWidth - rect.right : rect.left;\r\n\r\n view.style.position = \"fixed\";\r\n view.popover = \"manual\";\r\n view.showPopover();\r\n this._anchor.style.position = \"relative\";\r\n\r\n view.animate(\r\n [\r\n {\r\n transform: `translateX(${startInline}px)`,\r\n width: `${rect.width}px`,\r\n top: `${rect.top}px`,\r\n height: `${rect.height}px`,\r\n },\r\n { transform: \"translateX(0px)\", width: \"100vw\", top: \"0px\", height: \"100vh\" },\r\n ],\r\n {\r\n duration: 150,\r\n easing: \"cubic-bezier(0.2, 0.0, 0, 1.0)\",\r\n },\r\n );\r\n } else {\r\n view.style.position = \"fixed\";\r\n view.popover = \"manual\";\r\n view.showPopover();\r\n this._anchor.style.position = \"relative\";\r\n }\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: \"closed\",\r\n newState: \"open\",\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n\r\n this.dispatchEvent(\r\n new CustomEvent<SearchViewQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input?.value ?? \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n\r\n /** @private */\r\n async #closeFullscreen(): Promise<void> {\r\n const view = this._view;\r\n if (view.popover !== \"manual\") return;\r\n\r\n if (\r\n !this.dispatchEvent(\r\n new ToggleEvent(\"beforetoggle\", {\r\n oldState: \"open\",\r\n newState: \"closed\",\r\n bubbles: true,\r\n composed: true,\r\n cancelable: true,\r\n }),\r\n )\r\n ) {\r\n this.open = true;\r\n return;\r\n }\r\n\r\n this.#openMode = undefined;\r\n this.#scrollLockController.unlock();\r\n this.#inertController.unlock();\r\n\r\n const anchor = this._anchor;\r\n\r\n if (!prefersReducedMotion()) {\r\n const start = view.getBoundingClientRect();\r\n const end = anchor.getBoundingClientRect();\r\n\r\n const startInline = M3eDirectionality.current === \"rtl\" ? window.innerWidth - start.right : start.left;\r\n const endInline = M3eDirectionality.current === \"rtl\" ? window.innerWidth - end.right : end.left;\r\n const dx = M3eDirectionality.current === \"rtl\" ? startInline - endInline : endInline - startInline;\r\n\r\n view.classList.add(\"closing\");\r\n await view.animate(\r\n [\r\n {\r\n transform: `translateX(0px)`,\r\n width: `${start.width}px`,\r\n top: `${start.top}px`,\r\n height: `${start.height}px`,\r\n },\r\n {\r\n transform: `translateX(${dx}px)`,\r\n width: `${end.width}px`,\r\n top: `${end.top}px`,\r\n height: `${end.height}px`,\r\n },\r\n ],\r\n {\r\n duration: 150,\r\n easing: \"cubic-bezier(0.2, 0.0, 0, 1.0)\",\r\n },\r\n ).finished;\r\n }\r\n\r\n view.hidePopover();\r\n view.style.position = \"\";\r\n view.popover = null;\r\n view.classList.remove(\"closing\");\r\n anchor.style.position = \"\";\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: \"open\",\r\n newState: \"closed\",\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n}\r\n\r\ninterface M3eSearchViewElementEventMap extends HTMLElementEventMap {\r\n clear: Event;\r\n query: CustomEvent<SearchViewQueryEventDetail>;\r\n beforetoggle: ToggleEvent;\r\n toggle: ToggleEvent;\r\n}\r\n\r\nexport interface M3eSearchViewElement {\r\n addEventListener<K extends keyof M3eSearchViewElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSearchViewElement, ev: M3eSearchViewElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSearchViewElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSearchViewElement, ev: M3eSearchViewElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-search-view\": M3eSearchViewElement;\r\n }\r\n}\r\n"],"names":["SearchBarToken","containerColor","unsafeCSS","DesignToken","color","surfaceContainerHigh","leadingIconColor","onSurface","trailingIconColor","onSurfaceVariant","containerHeight","containerShape","shape","corner","full","iconSize","supportingTextColor","supportingTextFontSize","typescale","standard","body","large","fontSize","supportingTextFontWeight","fontWeight","supportingTextLineHeight","lineHeight","supportingTextTracking","tracking","inputColor","inputTextFontSize","inputTextFontWeight","inputTextLineHeight","inputTextTracking","leadingSpace","trailingSpace","noActionsLeadingSpace","noActionsTrailingSpace","leadingActionsTrailingSpace","trailingActionsLeadingSpace","actionsGap","SearchBarLightDomStyle","css","SearchBarStyle","SearchViewToken","containedContainerColor","surfaceContainerLow","dividerColor","outline","dividerThickness","fullScreenContainerShape","none","fullScreenHeaderContainerHeight","dockedContainerShape","extraLarge","dockedHeaderContainerHeight","containedLeadingMargin","containedTrailingMargin","containedFocusedLeadingMargin","containedFocusedTrailingMargin","containedDockedBarResultsGap","containedDockedResultsShape","medium","containedDockedBarShape","containedFullScreenBarContainerHeight","dockedContainerMinHeight","dockedContainerMaxHeight","containedDockedResultsSpace","dockedResultsBottomSpace","dockedScrimColor","scrim","dockedScrimOpacity","SearchViewLightDomStyle","SearchViewStyle","motion","duration","short2","easing","scrollbar","thinWidth","long2","short3","M3eSearchBarElement","EventAttribute","AttachInternals","LitElement","constructor","_M3eSearchBarElement_input","set","_M3eSearchBarElement_inputInputHandler","__classPrivateFieldGet","_M3eSearchBarElement_instances","_M3eSearchBarElement_handleInputInput","call","clearable","clearLabel","clear","value","dispatchEvent","Event","bubbles","composed","render","html","_M3eSearchBarElement_handleContainerClick","_M3eSearchBarElement_handleLeadingSlotChange","_M3eSearchBarElement_handleInputSlotChange","_M3eSearchBarElement_renderClearButton","_M3eSearchBarElement_handleTrailingSlotChange","_M3eSearchBarElement_handleClearClick","nothing","matches","focus","e","setCustomState","hasAssignedNodes","target","input","assignedElements","flatten","find","x","HTMLInputElement","removeEventListener","__classPrivateFieldSet","addEventListener","role","inputMode","type","length","registerStyleSheet","styles","__decorate","property","Boolean","reflect","prototype","attribute","customElement","M3eSearchViewElement","ReconnectedCallback","_M3eSearchViewElement_input","_M3eSearchViewElement_closeOnInputFocus","_M3eSearchViewElement_inputInputHandler","_M3eSearchViewElement_instances","_M3eSearchViewElement_handleInputInput","_M3eSearchViewElement_inputFocusHandler","_M3eSearchViewElement_handleInputFocus","_M3eSearchViewElement_inputKeyDownHandler","_M3eSearchViewElement_inputPointerHandler","_M3eSearchViewElement_handleInputPointerDown","_M3eSearchViewElement_scrollLockController","ScrollLockController","_M3eSearchViewElement_inertController","InertController","_clearable","_M3eSearchViewElement_openMode","_M3eSearchViewElement_anchorCleanup","_M3eSearchViewElement_breakpointUnobserve","contained","mode","open","closeLabel","hideSearchIcon","FocusController","callback","focused","_handleFocusChange","currentMode","_mode","_M3eSearchViewElement_updateClearableState","CustomEvent","detail","term","disconnectedCallback","undefined","reconnectedCallback","_M3eSearchViewElement_initBreakpointMonitoring","willUpdate","changedProperties","has","previousMode","get","_M3eSearchViewElement_updateMode","updated","_changedProperties","_M3eSearchViewElement_closeFullscreen","_M3eSearchViewElement_closeDocked","_M3eSearchViewElement_openFullscreen","_M3eSearchViewElement_openDocked","ifDefined","_M3eSearchViewElement_handleKeyDown","_M3eSearchViewElement_renderIconOrBackButton","_M3eSearchViewElement_handleInputSlotChange","_M3eSearchViewElement_renderClearButton","_M3eSearchViewElement_renderBackButton","_M3eSearchViewElement_renderIcon","_M3eSearchViewElement_handleCloseClick","svg","_M3eSearchViewElement_handleClearClick","M3eBreakpointObserver","observe","Breakpoint","XSmall","ariaHasPopup","key","shiftKey","ctrlKey","preventDefault","ToggleEvent","oldState","newState","cancelable","view","_view","positionAnchor","_anchor","position","y","style","top","clientHeight","width","clientWidth","M3eDirectionality","current","right","window","innerWidth","left","popover","showPopover","lock","unlock","prefersReducedMotion","_M3eSearchViewElement_hideDocked","classList","add","once","remove","hidePopover","rect","getBoundingClientRect","startInline","animate","transform","height","anchor","start","end","endInline","dx","finished","state","query","debounce"],"mappings":"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"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license MIT
|
|
3
|
+
* Copyright (c) 2025 matraic
|
|
4
|
+
* See LICENSE file in the project root for full license text.
|
|
5
|
+
*/
|
|
6
|
+
import{__classPrivateFieldGet as e,__classPrivateFieldSet as t,__decorate as o}from"tslib";import{unsafeCSS as i,css as s,LitElement as n,html as a,nothing as r,svg as l}from"lit";import{property as c,state as h,query as d}from"lit/decorators.js";import{DesignToken as p,EventAttribute as m,AttachInternals as u,setCustomState as v,hasAssignedNodes as g,registerStyleSheet as f,customElement as b,ReconnectedCallback as w,ScrollLockController as $,InertController as k,FocusController as y,prefersReducedMotion as x,debounce as E}from"@m3e/web/core";import"@m3e/web/icon-button";import{ifDefined as _}from"lit/directives/if-defined.js";import{positionAnchor as M}from"@m3e/web/core/anchoring";import{M3eDirectionality as L}from"@m3e/web/core/bidi";import{M3eBreakpointObserver as S,Breakpoint as C}from"@m3e/web/core/layout";import"@m3e/web/core/a11y";const z=i(`var(--m3e-search-bar-container-color, ${p.color.surfaceContainerHigh})`),W=i(`var(--m3e-search-bar-leading-icon-color, ${p.color.onSurface})`),T=i(`var(--m3e-search-bar-trailing-icon-color, ${p.color.onSurfaceVariant})`),q=i("var(--m3e-search-bar-container-height, 3.5rem)"),B=i(`var(--m3e-search-bar-container-shape, ${p.shape.corner.full})`),H=i("var(--m3e-search-bar-icon-size, 1.5rem)"),P=i(`var(--m3e-search-bar-supporting-text-color, ${p.color.onSurfaceVariant})`),X=i(`var(--m3e-search-bar-supporting-text-font-size, ${p.typescale.standard.body.large.fontSize})`),Z=i(`var(--m3e-search-bar-supporting-text-font-weight, ${p.typescale.standard.body.large.fontWeight})`),j=i(`var(--m3e-search-bar-supporting-text-line-height, ${p.typescale.standard.body.large.lineHeight})`),I=i(`var(--m3e-search-bar-supporting-text-tracking, ${p.typescale.standard.body.large.tracking})`),K=i(`var(--m3e-search-bar-input-color, ${p.color.onSurface})`),F=i(`var(--m3e-search-bar-input-text-font-size, ${p.typescale.standard.body.large.fontSize})`),R=i(`var(--m3e-search-bar-input-text-font-weight, ${p.typescale.standard.body.large.fontWeight})`),Y=i(`var(--m3e-search-bar-input-text-line-height, ${p.typescale.standard.body.large.lineHeight})`),D=i(`var(--m3e-search-bar-input-text-tracking, ${p.typescale.standard.body.large.tracking})`),U=i("var(--m3e-search-bar-leading-space, 0.25rem)"),V=i("var(--m3e-search-bar-trailing-space, 0.25rem)"),A=i("var(--m3e-search-bar-no-actions-leading-space, 1rem)"),G=i("var(--m3e-search-bar-no-actions-trailing-space, 1rem)"),J=i("var(--m3e-search-bar-leading-actions-trailing-space, 0.25rem)"),N=i("var(--m3e-search-bar-trailing-actions-leading-space, 0.25rem)"),O=i("var(--m3e-search-bar-actions-gap, 0px)"),Q=s`m3e-search-bar input[slot="input"]::placeholder { user-select: none; color: ${P}; font-size: ${X}; font-weight: ${Z}; line-height: ${j}; letter-spacing: ${I}; }`,ee=s`:host { display: block; height: ${q}; } .base { cursor: text; display: flex; align-items: center; box-sizing: border-box; width: 100%; height: 100%; border-radius: ${B}; background-color: ${z}; } .clear { display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 3rem; } :host(:not(:state(-clearable))) .clear { display: none; } :host(:state(-with-leading)) slot[name="leading"], :host(:state(-with-trailing)) slot[name="trailing"] { display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 3rem; padding-inline: 0.25rem; column-gap: calc(0.5rem + ${O}); } ::slotted([slot="input"]) { flex: 1 1 auto; outline: unset; border: unset; background-color: transparent; box-shadow: none; min-width: 0; padding: unset; color: ${K}; font-size: ${F}; font-weight: ${R}; line-height: ${Y}; letter-spacing: ${D}; } :host(:state(-with-leading)) .base { padding-inline-start: ${U}; } :host(:not(:state(-with-leading))) .base { padding-inline-start: ${A}; } :host(:is(:state(-with-trailing), :state(-clearable))) .base { padding-inline-end: ${V}; } :host(:not(:is(:state(-with-trailing), :state(-clearable)))) .base { padding-inline-end: ${G}; } :host(:state(-with-leading)) ::slotted([slot="input"]) { margin-inline-start: ${J}; } :host(:is(:state(-with-trailing), :state(-clearable))) ::slotted([slot="input"]) { margin-inline-end: ${N}; } slot[name="leading"] { color: ${W}; --m3e-icon-color: ${W}; --m3e-icon-button-icon-color: ${W}; --m3e-icon-size: ${H}; } slot[name="trailing"], .clear { color: ${T}; --m3e-icon-color: ${T}; --m3e-icon-button-icon-color: ${T}; --m3e-icon-size: ${H}; } ::slotted(svg[slot="leading"]), ::slotted(svg[slot="trailing"]) { width: 1em; font-size: ${H}; } ::slotted([slot="clear-icon"]), .clear-icon { width: 1em; font-size: ${H} !important; } slot[name="clear-icon"] { --m3e-icon-size: ${H}; } @media (forced-colors: active) { .base { border: 1px var(--_search-bar-forced-color-outline-style, solid) CanvasText; } }`,te=i(`var(--m3e-search-view-container-color, ${p.color.surfaceContainerHigh})`),oe=i(`var(--m3e-search-view-contained-container-color, ${p.color.surfaceContainerLow})`),ie=i(`var(--m3e-search-view-divider-color, ${p.color.outline})`),se=i("var(--m3e-search-view-divider-thickness, 1px)"),ne=i(`var(--m3e-search-view-full-screen-container-shape, ${p.shape.corner.none})`),ae=i("var(--m3e-search-view-full-screen-header-container-height, 4.5rem)"),re=i(`var(--m3e-search-view-docked-container-shape, ${p.shape.corner.extraLarge})`),le=i("var(--m3e-search-view-docked-header-container-height, 3.5rem)"),ce=i("var(--m3e-search-view-contained-leading-margin, 1.5rem)"),he=i("var(--m3e-search-view-contained-trailing-margin, 1.55rem)"),de=i("var(--m3e-search-view-contained-focused-leading-margin, 0.75rem)"),pe=i("var(--m3e-search-view-contained-focused-trailing-margin, 0.75rem)"),me=i("var(--m3e-search-view-contained-docked-bar-results-gap, 2px)"),ue=(i(`var(--m3e-search-view-contained-docked-results-shape, ${p.shape.corner.medium})`),i(`var(--m3e-search-view-contained-docked-bar-shape, ${p.shape.corner.full})`),i("var(--m3e-search-view-contained-full-screen-bar-container-height, 3.5rem)")),ve=i("var(--m3e-search-view-docked-container-min-height, 240px)"),ge=i("var(--m3e-search-view-docked-container-max-height, calc(100vh * 0.6667))"),fe=i("var(--m3e-search-view-contained-docked-results-space, 0.25rem)"),be=i("var(--m3e-search-view-docked-results-bottom-space, 1rem)"),we=i(`var(--m3e-search-view-docked-scrim-color, ${p.color.scrim})`),$e=i("var(--m3e-search-view-docked-scrim-opacity, 32%)"),ke=s`m3e-search-view input[slot="input"]::placeholder { user-select: none; color: ${P}; font-size: ${X}; font-weight: ${Z}; line-height: ${j}; letter-spacing: ${I}; }`,ye=s`:host { display: block; } .base { position: relative; width: 100%; } .anchor { position: absolute; width: 100%; visibility: hidden; } .view { display: flex; flex-direction: column; box-sizing: border-box; width: 100%; outline: none; padding: unset; margin: unset; border: unset; } .header { flex: none; display: flex; align-items: center; } .bar { flex: 1 1 auto; } :host(:state(-fullscreen)) .bar { transition: ${i(`margin ${p.motion.duration.short2} ${p.motion.easing.standard}`)}; } :host(:state(-fullscreen)[contained]:not([open])) .bar { margin-inline-start: ${ce}; margin-inline-end: ${he}; } :host(:state(-fullscreen)[contained][open]) .bar, :host(:state(-fullscreen)[contained][open]) .results { margin-inline-start: ${de}; margin-inline-end: ${pe}; } .icon { display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 3rem; } ::slotted([slot="search-icon"]), .search-icon, ::slotted([slot="close-icon"]), .close-icon { width: 1em; font-size: ${H} !important; } .results { overflow: hidden; flex: 1 1 auto; display: flex; flex-direction: column; } .scroll-container { flex: 1 1 auto; overflow-y: auto; overflow-x: hidden; scrollbar-color: ${p.scrollbar.color}; } .view:not(:popover-open) .results, .view.closing .results { display: none; } :host(:not(:is(:state(-clearable), [open]))) .clear { display: none; } ::slotted([slot="clear-icon"]), .clear-icon { width: 1em; font-size: ${H} !important; } slot[name="clear-icon"] { --m3e-icon-size: ${H}; } :host(:state(-fullscreen)) .header { transition: height 150ms cubic-bezier(0.2, 0, 0, 1); } :host(:state(-fullscreen)) .view:popover-open:not(.closing) .header { height: ${ae}; } :host(:state(-fullscreen):not([open])) .header, :host(:state(-fullscreen)[open]) .view.closing .header { height: ${ue}; } :host(:state(-fullscreen)[open]) .bar { --m3e-search-bar-container-height: ${ue}; } :host(:state(-fullscreen)) .anchor { height: ${ue}; } :host(:state(-fullscreen)) .view:popover-open { border-radius: ${ne}; } :host(:state(-fullscreen)[contained]) .view:popover-open { background-color: ${oe}; } :host(:state(-fullscreen):not([contained])) .view:popover-open { background-color: ${te}; } :host(:state(-docked)[open]) .header, :host(:state(-docked)) .anchor { height: ${le}; } :host(:not([contained])[open]) .results { border-top-width: ${se}; border-top-style: solid; border-top-color: ${ie}; } :host(:state(-docked)[contained]) .results { margin-top: ${me}; } :host(:state(-docked):not([contained])[open]) .view { background-color: ${te}; --m3e-search-bar-container-color: ${te}; } :host(:state(-docked)[contained]) .results { background-color: ${te}; } :host(:state(-docked):not([contained])[open]) .view, :host(:state(-docked)[contained]) .results { border-radius: ${re}; } :host(:state(-docked)) .results { min-height: calc(${ve} - ${le}); max-height: calc(${ge} - ${le}); } :host(:state(-docked)) .scroll-container { scrollbar-width: ${p.scrollbar.thinWidth}; } :host(:state(-docked):not([contained])) .scroll-container { padding-bottom: ${be}; } :host(:state(-docked)[contained]) .scroll-container { padding: ${fe}; } :host(:state(-docked)) .results { transform-origin: top; transition: ${i(`transform ${p.motion.duration.short2} ${p.motion.easing.standard},\n overlay ${p.motion.duration.short2} ${p.motion.easing.standard} allow-discrete,\n display ${p.motion.duration.short2} ${p.motion.easing.standard} allow-discrete`)}; } :host(:state(-docked):not([open])) .results { transform: scaleY(0.8); } :host(:state(-docked)[open]) .results { transform: scaleY(1); } @starting-style { :host(:state(-docked)[open]) .results { transform: scaleY(0.8); } } :host(:state(-docked)[contained]) .view { background-color: transparent; } :host(:state(-docked):not([open])) .view { transition: ${i(`border-radius ${p.motion.duration.long2} ${p.motion.easing.standard},\n background-color ${p.motion.duration.long2} ${p.motion.easing.standard}`)}; } :host(:state(-docked):not([open])) .view::backdrop { transition: ${i(`background-color ${p.motion.duration.short3} ${p.motion.easing.standard}, \n overlay ${p.motion.duration.short3} ${p.motion.easing.standard} allow-discrete,\n visibility ${p.motion.duration.short3} ${p.motion.easing.standard} allow-discrete`)}; } :host(:state(-docked)) .view::backdrop { background-color: color-mix(in srgb, ${we} 0%, transparent); margin-inline-end: -20px; } :host(:state(-docked)[open]) .view::backdrop { background-color: color-mix( in srgb, ${we} ${$e}, transparent ); transition: ${i(`background-color ${p.motion.duration.long2} ${p.motion.easing.standard}, \n overlay ${p.motion.duration.long2} ${p.motion.easing.standard} allow-discrete,\n visibility ${p.motion.duration.long2} ${p.motion.easing.standard} allow-discrete`)}; } @starting-style { :host(:state(-docked)[open]) .view::backdrop { background-color: color-mix(in srgb, ${we} 0%, transparent); } } :host(:state(-fullscreen)) .view:popover-open { width: 100vw; width: 100dvw; height: 100vh; height: 100dvh; overflow: hidden; } @media (prefers-reduced-motion) { :host(:state(-fullscreen)) .bar, :host(:state(-fullscreen)) .header, :host(:state(-docked)) .results, :host(:state(-docked):not([open])) .view, :host(:state(-docked):not([open])) .view::backdrop, :host(:state(-docked)[open]) .view::backdrop { transition: none; } } @media (forced-colors: active) { :host(:not([contained])[open]) .bar { --_search-bar-forced-color-outline-style: none; } :host(:state(-docked):not([contained])[open]) .view, :host(:state(-docked)[contained]) .results { border: 1px solid CanvasText; } :host(:not([contained])[open]) .results { border-top-color: CanvasText; } }`;var xe,Ee,_e,Me,Le,Se,Ce,ze,We,Te;let qe=class extends(m(u(n),"clear")){constructor(){super(...arguments),xe.add(this),Ee.set(this,void 0),_e.set(this,()=>e(this,xe,"m",We).call(this)),this.clearable=!1,this.clearLabel="Clear"}clear(){e(this,Ee,"f")&&(e(this,Ee,"f").value="",e(this,xe,"m",We).call(this),this.dispatchEvent(new Event("clear",{bubbles:!0,composed:!0})))}render(){return a`<div class="base" @click="${e(this,xe,"m",Le)}"><slot name="leading" @slotchange="${e(this,xe,"m",Se)}"></slot><slot name="input" @slotchange="${e(this,xe,"m",ze)}"></slot>${e(this,xe,"m",Me).call(this)}<slot name="trailing" @slotchange="${e(this,xe,"m",Ce)}"></slot></div>`}};var Be,He,Pe,Xe,Ze,je,Ie,Ke,Fe,Re,Ye,De,Ue,Ve,Ae,Ge,Je,Ne,Oe,Qe,et,tt,ot,it,st,nt,at,rt,lt,ct,ht,dt;Ee=new WeakMap,_e=new WeakMap,xe=new WeakSet,Me=function(){return this.clearable?a`<div class="clear"><m3e-icon-button aria-label="${this.clearLabel}" @click="${e(this,xe,"m",Te)}"><slot name="clear-icon"><svg class="clear-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg></slot></m3e-icon-button></div>`:r},Le=function(){this.matches(":focus-within")||e(this,Ee,"f")?.focus()},Se=function(e){v(this,"-with-leading",g(e.target))},Ce=function(e){v(this,"-with-trailing",g(e.target))},ze=function(o){const i=o.target.assignedElements({flatten:!0}).find(e=>e instanceof HTMLInputElement);i!=e(this,Ee,"f")&&(e(this,Ee,"f")?.removeEventListener("input",e(this,_e,"f")),t(this,Ee,i,"f"),e(this,Ee,"f")?.addEventListener("input",e(this,_e,"f")),e(this,Ee,"f")&&(e(this,Ee,"f").role=e(this,Ee,"f").role||"searchbox",e(this,Ee,"f").inputMode=e(this,Ee,"f").inputMode||"search",e(this,Ee,"f").type="text"),e(this,xe,"m",We).call(this))},We=function(){v(this,"-clearable",this.clearable&&(e(this,Ee,"f")?.value??"").length>0)},Te=function(){this.clear(),e(this,Ee,"f")?.focus()},f(Q),qe.styles=ee,o([c({type:Boolean,reflect:!0})],qe.prototype,"clearable",void 0),o([c({attribute:"clear-label"})],qe.prototype,"clearLabel",void 0),qe=o([b("m3e-search-bar")],qe);let pt=class extends(m(w(u(n)),"clear","query")){constructor(){super(),Be.add(this),He.set(this,void 0),Pe.set(this,!1),Xe.set(this,()=>e(this,Be,"m",Oe).call(this)),Ze.set(this,()=>e(this,Be,"m",tt).call(this)),je.set(this,t=>e(this,Be,"m",nt).call(this,t)),Ie.set(this,()=>e(this,Be,"m",st).call(this)),Ke.set(this,new $(this)),Fe.set(this,new k(this)),this._clearable=!1,Re.set(this,void 0),Ye.set(this,void 0),De.set(this,void 0),this.contained=!1,this.mode="docked",this.open=!1,this.clearLabel="Clear",this.closeLabel="Close",this.hideSearchIcon=!1,new y(this,{callback:e=>this._handleFocusChange(e)})}get currentMode(){return this._mode??("fullscreen"!==this.mode?"docked":"fullscreen")}set currentMode(e){this._mode=e}clear(){e(this,He,"f")&&(e(this,He,"f").value="",e(this,Be,"m",et).call(this),this.dispatchEvent(new CustomEvent("query",{detail:{term:""},bubbles:!0,composed:!0})),this.dispatchEvent(new Event("clear",{bubbles:!0,composed:!0})))}disconnectedCallback(){super.disconnectedCallback(),this._mode=void 0,e(this,De,"f")?.call(this)}reconnectedCallback(){super.reconnectedCallback(),"auto"===this.mode&&e(this,Be,"m",Je).call(this)}willUpdate(t){if(super.willUpdate(t),t.has("mode")){e(this,De,"f")?.call(this);const o=t.get("mode");o&&o!==this.mode&&this.open&&(this.open=!1),"auto"===this.mode?e(this,Be,"m",Je).call(this):(this._mode=void 0,e(this,Be,"m",Qe).call(this))}t.has("_mode")&&e(this,Be,"m",Qe).call(this)}updated(t){super.updated(t),t.has("open")&&(this.open?"fullscreen"===this.currentMode?e(this,Be,"m",ht).call(this):e(this,Be,"m",rt).call(this):"fullscreen"===(e(this,Re,"f")??this.currentMode)?e(this,Be,"m",dt).call(this):e(this,Be,"m",lt).call(this))}render(){return a`<div class="base"><div class="anchor"></div><div role="${_(this.open?"dialog":void 0)}" aria-modal="${_(this.open?"true":void 0)}" aria-labelledby="${_(this.open?"header":void 0)}" class="view" tabindex="-1" @keydown="${e(this,Be,"m",at)}"><m3e-focus-trap ?disabled="${!this.open}"><div class="header" id="header"><m3e-search-bar class="bar">${e(this,Be,"m",Ue).call(this)} ${this.open?a`<slot name="open-leading" slot="leading"></slot>`:a`<slot name="closed-leading" slot="leading"></slot>`}<slot name="input" slot="input" @slotchange="${e(this,Be,"m",Ne)}"></slot>${e(this,Be,"m",Ge).call(this)} ${this.open?a`<slot name="open-trailing" slot="trailing"></slot>`:a`<slot name="closed-trailing" slot="trailing"></slot>`}</m3e-search-bar></div><div class="results"><div class="scroll-container"><slot></slot></div></div></m3e-focus-trap></div></div>`}_handleFocusChange(e){e||"docked"!==this.currentMode||(this.clear(),this.open=!1)}};He=new WeakMap,Pe=new WeakMap,Xe=new WeakMap,Ze=new WeakMap,je=new WeakMap,Ie=new WeakMap,Ke=new WeakMap,Fe=new WeakMap,Re=new WeakMap,Ye=new WeakMap,De=new WeakMap,Be=new WeakSet,Ue=function(){return!this.open&&this.hideSearchIcon?r:a`<div class="icon" slot="leading">${this.open?e(this,Be,"m",Ae).call(this):e(this,Be,"m",Ve).call(this)}</div>`},Ve=function(){return a`<slot name="search-icon"><svg class="search-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z"/></svg></slot>`},Ae=function(){return a`<m3e-icon-button class="close" slot="leading" aria-label="${this.closeLabel}" @click="${e(this,Be,"m",ot)}"><slot name="close-icon"><svg class="close-icon" viewBox="0 -960 960 960" fill="currentColor">${"docked"===this.currentMode?l`<path d="m313-440 224 224-57 56-320-320 320-320 57 56-224 224h487v80H313Z"/>`:l`<path d="M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z"/>`}</svg></slot></m3e-icon-button>`},Ge=function(){return a`<m3e-icon-button class="clear" slot="trailing" aria-label="${this.open&&!this._clearable?this.closeLabel:this.clearLabel}" @click="${e(this,Be,"m",it)}"><slot name="clear-icon"><svg class="clear-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg></slot></m3e-icon-button>`},Je=function(){t(this,De,S.observe([C.XSmall],t=>{const o=this.currentMode;this._mode=t.get(C.XSmall)?"fullscreen":"docked",o!==this._mode&&this.open&&(this.open=!1),e(this,Be,"m",Qe).call(this)}),"f")},Ne=function(o){const i=o.target.assignedElements({flatten:!0}).find(e=>e instanceof HTMLInputElement);i!=e(this,He,"f")&&(e(this,He,"f")?.removeEventListener("input",e(this,Xe,"f")),e(this,He,"f")?.removeEventListener("focus",e(this,Ze,"f")),e(this,He,"f")?.removeEventListener("keydown",e(this,je,"f")),e(this,He,"f")?.removeEventListener("pointerdown",e(this,Ie,"f")),t(this,He,i,"f"),e(this,He,"f")?.addEventListener("input",e(this,Xe,"f")),e(this,He,"f")?.addEventListener("focus",e(this,Ze,"f")),e(this,He,"f")?.addEventListener("keydown",e(this,je,"f")),e(this,He,"f")?.addEventListener("pointerdown",e(this,Ie,"f")),e(this,He,"f")&&(e(this,He,"f").role=e(this,He,"f").role||"searchbox",e(this,He,"f").inputMode=e(this,He,"f").inputMode||"search",e(this,He,"f").type="text",e(this,He,"f").ariaHasPopup="dialog"),e(this,Be,"m",et).call(this))},Oe=function(){e(this,Be,"m",et).call(this),this.open?this.dispatchEvent(new CustomEvent("query",{detail:{term:e(this,He,"f")?.value??""},bubbles:!0,composed:!0})):this.open=!0},Qe=function(){v(this,"-fullscreen","fullscreen"===this.currentMode),v(this,"-docked","docked"===this.currentMode)},et=function(){this._clearable=(e(this,He,"f")?.value??"").length>0,v(this,"-clearable",this._clearable)},tt=function(){this.open=!e(this,Pe,"f"),t(this,Pe,!1,"f")},ot=function(){e(this,He,"f")&&(e(this,He,"f").value&&this.clear(),t(this,Pe,!0,"f"),e(this,He,"f")?.focus())},it=function(){e(this,He,"f")&&(e(this,He,"f").value?this.clear():t(this,Pe,!0,"f"),e(this,He,"f")?.focus())},st=function(){!this.open&&e(this,He,"f")?.matches(":focus")&&(this.open=!0)},nt=function(e){if(this.open&&"Escape"===e.key&&!e.shiftKey&&!e.ctrlKey){e.preventDefault();e.target.value&&this.clear(),this.open=!1}},at=function(t){!this.open||"Escape"!==t.key||t.shiftKey||t.ctrlKey||(t.preventDefault(),e(this,Be,"m",ot).call(this))},rt=async function(){if(!this.dispatchEvent(new ToggleEvent("beforetoggle",{oldState:"closed",newState:"open",bubbles:!0,composed:!0,cancelable:!0})))return void(this.open=!1);t(this,Re,this.currentMode,"f");const o=this._view;e(this,Ye,"f")?.call(this),t(this,Ye,await M(o,this._anchor,{position:"bottom"},(e,t)=>{const o=this._view;o.style.top=t-this._anchor.clientHeight+"px",o.style.width=`${this._anchor.clientWidth}px`,"rtl"===L.current?(o.style.right=window.innerWidth-e-this.clientWidth+"px",o.style.left=""):(o.style.left=`${e}px`,o.style.right="")}),"f"),this._anchor.style.position="relative",o.popover="manual",o.style.position="absolute",o.showPopover(),e(this,Ke,"f").lock(),e(this,Fe,"f").lock(),this.dispatchEvent(new ToggleEvent("toggle",{oldState:"closed",newState:"open",bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("query",{detail:{term:e(this,He,"f")?.value??""},bubbles:!0,composed:!0}))},lt=function(){const o=this._view;"manual"===o.popover&&(this.dispatchEvent(new ToggleEvent("beforetoggle",{oldState:"open",newState:"closed",bubbles:!0,composed:!0,cancelable:!0}))?(t(this,Re,void 0,"f"),e(this,Ke,"f").unlock(),e(this,Fe,"f").unlock(),x()?e(this,Be,"m",ct).call(this):(o.classList.add("closing"),o.addEventListener("transitionend",()=>e(this,Be,"m",ct).call(this),{once:!0}))):this.open=!0)},ct=function(){e(this,Ye,"f")?.call(this),t(this,Ye,void 0,"f");const o=this._view;o.classList.remove("closing"),o.style.position="",o.style.width="",o.style.top="",o.style.left="",o.style.right="",o.hidePopover(),o.popover=null,this._anchor.style.position="",this.dispatchEvent(new ToggleEvent("toggle",{oldState:"open",newState:"closed",bubbles:!0,composed:!0}))},ht=async function(){if(!this.dispatchEvent(new ToggleEvent("beforetoggle",{oldState:"closed",newState:"open",bubbles:!0,composed:!0,cancelable:!0})))return void(this.open=!1);t(this,Re,this.currentMode,"f"),e(this,Ke,"f").lock(),e(this,Fe,"f").lock();const o=this._view;if(e(this,Ye,"f")?.call(this),x())o.style.position="fixed",o.popover="manual",o.showPopover(),this._anchor.style.position="relative";else{const e=o.getBoundingClientRect(),t="rtl"===L.current?window.innerWidth-e.right:e.left;o.style.position="fixed",o.popover="manual",o.showPopover(),this._anchor.style.position="relative",o.animate([{transform:`translateX(${t}px)`,width:`${e.width}px`,top:`${e.top}px`,height:`${e.height}px`},{transform:"translateX(0px)",width:"100vw",top:"0px",height:"100vh"}],{duration:150,easing:"cubic-bezier(0.2, 0.0, 0, 1.0)"})}this.dispatchEvent(new ToggleEvent("toggle",{oldState:"closed",newState:"open",bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("query",{detail:{term:e(this,He,"f")?.value??""},bubbles:!0,composed:!0}))},dt=async function(){const o=this._view;if("manual"!==o.popover)return;if(!this.dispatchEvent(new ToggleEvent("beforetoggle",{oldState:"open",newState:"closed",bubbles:!0,composed:!0,cancelable:!0})))return void(this.open=!0);t(this,Re,void 0,"f"),e(this,Ke,"f").unlock(),e(this,Fe,"f").unlock();const i=this._anchor;if(!x()){const e=o.getBoundingClientRect(),t=i.getBoundingClientRect(),s="rtl"===L.current?window.innerWidth-e.right:e.left,n="rtl"===L.current?window.innerWidth-t.right:t.left,a="rtl"===L.current?s-n:n-s;o.classList.add("closing"),await o.animate([{transform:"translateX(0px)",width:`${e.width}px`,top:`${e.top}px`,height:`${e.height}px`},{transform:`translateX(${a}px)`,width:`${t.width}px`,top:`${t.top}px`,height:`${t.height}px`}],{duration:150,easing:"cubic-bezier(0.2, 0.0, 0, 1.0)"}).finished}o.hidePopover(),o.style.position="",o.popover=null,o.classList.remove("closing"),i.style.position="",this.dispatchEvent(new ToggleEvent("toggle",{oldState:"open",newState:"closed",bubbles:!0,composed:!0}))},f(ke),pt.styles=ye,o([h()],pt.prototype,"_clearable",void 0),o([h()],pt.prototype,"_mode",void 0),o([d(".anchor")],pt.prototype,"_anchor",void 0),o([d(".view")],pt.prototype,"_view",void 0),o([c({type:Boolean,reflect:!0})],pt.prototype,"contained",void 0),o([c({reflect:!0})],pt.prototype,"mode",void 0),o([c({type:Boolean,reflect:!0})],pt.prototype,"open",void 0),o([c({attribute:"clear-label"})],pt.prototype,"clearLabel",void 0),o([c({attribute:"close-label"})],pt.prototype,"closeLabel",void 0),o([c({attribute:"hide-search-icon",type:Boolean})],pt.prototype,"hideSearchIcon",void 0),o([E(40)],pt.prototype,"_handleFocusChange",null),pt=o([b("m3e-search-view")],pt);export{qe as M3eSearchBarElement,pt as M3eSearchViewElement};
|
|
7
|
+
//# sourceMappingURL=search.min.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search.min.js","sources":["../../src/search/styles/SearchBarToken.ts","../../src/search/styles/SearchBarStyle.ts","../../src/search/styles/SearchViewToken.ts","../../src/search/styles/SearchViewStyle.ts","../../src/search/SearchBarElement.ts","../../src/search/SearchViewElement.ts"],"sourcesContent":["import { unsafeCSS } from \"lit\";\r\n\r\nimport { DesignToken } from \"@m3e/web/core\";\r\n\r\n/** @internal */\r\nexport const SearchBarToken = {\r\n containerColor: unsafeCSS(`var(--m3e-search-bar-container-color, ${DesignToken.color.surfaceContainerHigh})`),\r\n leadingIconColor: unsafeCSS(`var(--m3e-search-bar-leading-icon-color, ${DesignToken.color.onSurface})`),\r\n trailingIconColor: unsafeCSS(`var(--m3e-search-bar-trailing-icon-color, ${DesignToken.color.onSurfaceVariant})`),\r\n containerHeight: unsafeCSS(\"var(--m3e-search-bar-container-height, 3.5rem)\"),\r\n containerShape: unsafeCSS(`var(--m3e-search-bar-container-shape, ${DesignToken.shape.corner.full})`),\r\n iconSize: unsafeCSS(\"var(--m3e-search-bar-icon-size, 1.5rem)\"),\r\n supportingTextColor: unsafeCSS(`var(--m3e-search-bar-supporting-text-color, ${DesignToken.color.onSurfaceVariant})`),\r\n supportingTextFontSize: unsafeCSS(\r\n `var(--m3e-search-bar-supporting-text-font-size, ${DesignToken.typescale.standard.body.large.fontSize})`,\r\n ),\r\n supportingTextFontWeight: unsafeCSS(\r\n `var(--m3e-search-bar-supporting-text-font-weight, ${DesignToken.typescale.standard.body.large.fontWeight})`,\r\n ),\r\n supportingTextLineHeight: unsafeCSS(\r\n `var(--m3e-search-bar-supporting-text-line-height, ${DesignToken.typescale.standard.body.large.lineHeight})`,\r\n ),\r\n supportingTextTracking: unsafeCSS(\r\n `var(--m3e-search-bar-supporting-text-tracking, ${DesignToken.typescale.standard.body.large.tracking})`,\r\n ),\r\n inputColor: unsafeCSS(`var(--m3e-search-bar-input-color, ${DesignToken.color.onSurface})`),\r\n inputTextFontSize: unsafeCSS(\r\n `var(--m3e-search-bar-input-text-font-size, ${DesignToken.typescale.standard.body.large.fontSize})`,\r\n ),\r\n inputTextFontWeight: unsafeCSS(\r\n `var(--m3e-search-bar-input-text-font-weight, ${DesignToken.typescale.standard.body.large.fontWeight})`,\r\n ),\r\n inputTextLineHeight: unsafeCSS(\r\n `var(--m3e-search-bar-input-text-line-height, ${DesignToken.typescale.standard.body.large.lineHeight})`,\r\n ),\r\n inputTextTracking: unsafeCSS(\r\n `var(--m3e-search-bar-input-text-tracking, ${DesignToken.typescale.standard.body.large.tracking})`,\r\n ),\r\n leadingSpace: unsafeCSS(\"var(--m3e-search-bar-leading-space, 0.25rem)\"),\r\n trailingSpace: unsafeCSS(\"var(--m3e-search-bar-trailing-space, 0.25rem)\"),\r\n noActionsLeadingSpace: unsafeCSS(\"var(--m3e-search-bar-no-actions-leading-space, 1rem)\"),\r\n noActionsTrailingSpace: unsafeCSS(\"var(--m3e-search-bar-no-actions-trailing-space, 1rem)\"),\r\n leadingActionsTrailingSpace: unsafeCSS(\"var(--m3e-search-bar-leading-actions-trailing-space, 0.25rem)\"),\r\n trailingActionsLeadingSpace: unsafeCSS(\"var(--m3e-search-bar-trailing-actions-leading-space, 0.25rem)\"),\r\n actionsGap: unsafeCSS(\"var(--m3e-search-bar-actions-gap, 0px)\"),\r\n} as const;\r\n","import { css, CSSResultGroup } from \"lit\";\r\n\r\nimport { SearchBarToken } from \"./SearchBarToken\";\r\n\r\n/**\r\n * Light DOM styles for `M3eSearchBarElement`.\r\n * @internal\r\n */\r\nexport const SearchBarLightDomStyle = css`\r\n m3e-search-bar input[slot=\"input\"]::placeholder {\r\n user-select: none;\r\n color: ${SearchBarToken.supportingTextColor};\r\n font-size: ${SearchBarToken.supportingTextFontSize};\r\n font-weight: ${SearchBarToken.supportingTextFontWeight};\r\n line-height: ${SearchBarToken.supportingTextLineHeight};\r\n letter-spacing: ${SearchBarToken.supportingTextTracking};\r\n }\r\n`;\r\n\r\n/**\r\n * Styles for `M3eSearchBarElement`.\r\n * @internal\r\n */\r\nexport const SearchBarStyle: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n height: ${SearchBarToken.containerHeight};\r\n }\r\n .base {\r\n cursor: text;\r\n display: flex;\r\n align-items: center;\r\n box-sizing: border-box;\r\n width: 100%;\r\n height: 100%;\r\n border-radius: ${SearchBarToken.containerShape};\r\n background-color: ${SearchBarToken.containerColor};\r\n }\r\n .clear {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-sizing: border-box;\r\n min-width: 3rem;\r\n }\r\n :host(:not(:state(-clearable))) .clear {\r\n display: none;\r\n }\r\n :host(:state(-with-leading)) slot[name=\"leading\"],\r\n :host(:state(-with-trailing)) slot[name=\"trailing\"] {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-sizing: border-box;\r\n min-width: 3rem;\r\n padding-inline: 0.25rem;\r\n column-gap: calc(0.5rem + ${SearchBarToken.actionsGap});\r\n }\r\n ::slotted([slot=\"input\"]) {\r\n flex: 1 1 auto;\r\n outline: unset;\r\n border: unset;\r\n background-color: transparent;\r\n box-shadow: none;\r\n min-width: 0;\r\n padding: unset;\r\n color: ${SearchBarToken.inputColor};\r\n font-size: ${SearchBarToken.inputTextFontSize};\r\n font-weight: ${SearchBarToken.inputTextFontWeight};\r\n line-height: ${SearchBarToken.inputTextLineHeight};\r\n letter-spacing: ${SearchBarToken.inputTextTracking};\r\n }\r\n :host(:state(-with-leading)) .base {\r\n padding-inline-start: ${SearchBarToken.leadingSpace};\r\n }\r\n :host(:not(:state(-with-leading))) .base {\r\n padding-inline-start: ${SearchBarToken.noActionsLeadingSpace};\r\n }\r\n :host(:is(:state(-with-trailing), :state(-clearable))) .base {\r\n padding-inline-end: ${SearchBarToken.trailingSpace};\r\n }\r\n :host(:not(:is(:state(-with-trailing), :state(-clearable)))) .base {\r\n padding-inline-end: ${SearchBarToken.noActionsTrailingSpace};\r\n }\r\n :host(:state(-with-leading)) ::slotted([slot=\"input\"]) {\r\n margin-inline-start: ${SearchBarToken.leadingActionsTrailingSpace};\r\n }\r\n :host(:is(:state(-with-trailing), :state(-clearable))) ::slotted([slot=\"input\"]) {\r\n margin-inline-end: ${SearchBarToken.trailingActionsLeadingSpace};\r\n }\r\n slot[name=\"leading\"] {\r\n color: ${SearchBarToken.leadingIconColor};\r\n --m3e-icon-color: ${SearchBarToken.leadingIconColor};\r\n --m3e-icon-button-icon-color: ${SearchBarToken.leadingIconColor};\r\n --m3e-icon-size: ${SearchBarToken.iconSize};\r\n }\r\n slot[name=\"trailing\"],\r\n .clear {\r\n color: ${SearchBarToken.trailingIconColor};\r\n --m3e-icon-color: ${SearchBarToken.trailingIconColor};\r\n --m3e-icon-button-icon-color: ${SearchBarToken.trailingIconColor};\r\n --m3e-icon-size: ${SearchBarToken.iconSize};\r\n }\r\n ::slotted(svg[slot=\"leading\"]),\r\n ::slotted(svg[slot=\"trailing\"]) {\r\n width: 1em;\r\n font-size: ${SearchBarToken.iconSize};\r\n }\r\n ::slotted([slot=\"clear-icon\"]),\r\n .clear-icon {\r\n width: 1em;\r\n font-size: ${SearchBarToken.iconSize} !important;\r\n }\r\n slot[name=\"clear-icon\"] {\r\n --m3e-icon-size: ${SearchBarToken.iconSize};\r\n }\r\n @media (forced-colors: active) {\r\n .base {\r\n border: 1px var(--_search-bar-forced-color-outline-style, solid) CanvasText;\r\n }\r\n }\r\n`;\r\n","import { unsafeCSS } from \"lit\";\r\n\r\nimport { DesignToken } from \"@m3e/web/core\";\r\n\r\n/** @internal */\r\nexport const SearchViewToken = {\r\n containerColor: unsafeCSS(`var(--m3e-search-view-container-color, ${DesignToken.color.surfaceContainerHigh})`),\r\n containedContainerColor: unsafeCSS(\r\n `var(--m3e-search-view-contained-container-color, ${DesignToken.color.surfaceContainerLow})`,\r\n ),\r\n dividerColor: unsafeCSS(`var(--m3e-search-view-divider-color, ${DesignToken.color.outline})`),\r\n dividerThickness: unsafeCSS(`var(--m3e-search-view-divider-thickness, 1px)`),\r\n fullScreenContainerShape: unsafeCSS(\r\n `var(--m3e-search-view-full-screen-container-shape, ${DesignToken.shape.corner.none})`,\r\n ),\r\n fullScreenHeaderContainerHeight: unsafeCSS(\"var(--m3e-search-view-full-screen-header-container-height, 4.5rem)\"),\r\n dockedContainerShape: unsafeCSS(\r\n `var(--m3e-search-view-docked-container-shape, ${DesignToken.shape.corner.extraLarge})`,\r\n ),\r\n dockedHeaderContainerHeight: unsafeCSS(\"var(--m3e-search-view-docked-header-container-height, 3.5rem)\"),\r\n containedLeadingMargin: unsafeCSS(\"var(--m3e-search-view-contained-leading-margin, 1.5rem)\"),\r\n containedTrailingMargin: unsafeCSS(\"var(--m3e-search-view-contained-trailing-margin, 1.55rem)\"),\r\n containedFocusedLeadingMargin: unsafeCSS(\"var(--m3e-search-view-contained-focused-leading-margin, 0.75rem)\"),\r\n containedFocusedTrailingMargin: unsafeCSS(\"var(--m3e-search-view-contained-focused-trailing-margin, 0.75rem)\"),\r\n containedDockedBarResultsGap: unsafeCSS(\"var(--m3e-search-view-contained-docked-bar-results-gap, 2px)\"),\r\n containedDockedResultsShape: unsafeCSS(\r\n `var(--m3e-search-view-contained-docked-results-shape, ${DesignToken.shape.corner.medium})`,\r\n ),\r\n containedDockedBarShape: unsafeCSS(\r\n `var(--m3e-search-view-contained-docked-bar-shape, ${DesignToken.shape.corner.full})`,\r\n ),\r\n containedFullScreenBarContainerHeight: unsafeCSS(\r\n \"var(--m3e-search-view-contained-full-screen-bar-container-height, 3.5rem)\",\r\n ),\r\n dockedContainerMinHeight: unsafeCSS(\"var(--m3e-search-view-docked-container-min-height, 240px)\"),\r\n dockedContainerMaxHeight: unsafeCSS(\"var(--m3e-search-view-docked-container-max-height, calc(100vh * 0.6667))\"),\r\n containedDockedResultsSpace: unsafeCSS(\"var(--m3e-search-view-contained-docked-results-space, 0.25rem)\"),\r\n dockedResultsBottomSpace: unsafeCSS(\"var(--m3e-search-view-docked-results-bottom-space, 1rem)\"),\r\n dockedScrimColor: unsafeCSS(`var(--m3e-search-view-docked-scrim-color, ${DesignToken.color.scrim})`),\r\n dockedScrimOpacity: unsafeCSS(\"var(--m3e-search-view-docked-scrim-opacity, 32%)\"),\r\n} as const;\r\n","import { css, CSSResultGroup, unsafeCSS } from \"lit\";\r\n\r\nimport { DesignToken } from \"@m3e/web/core\";\r\n\r\nimport { SearchViewToken } from \"./SearchViewToken\";\r\nimport { SearchBarToken } from \"./SearchBarToken\";\r\n\r\n/**\r\n * Light DOM styles for `M3eSearchViewElement`.\r\n * @internal\r\n */\r\nexport const SearchViewLightDomStyle = css`\r\n m3e-search-view input[slot=\"input\"]::placeholder {\r\n user-select: none;\r\n color: ${SearchBarToken.supportingTextColor};\r\n font-size: ${SearchBarToken.supportingTextFontSize};\r\n font-weight: ${SearchBarToken.supportingTextFontWeight};\r\n line-height: ${SearchBarToken.supportingTextLineHeight};\r\n letter-spacing: ${SearchBarToken.supportingTextTracking};\r\n }\r\n`;\r\n\r\n/**\r\n * Styles for `M3eSearchViewElement`.\r\n * @internal\r\n */\r\nexport const SearchViewStyle: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n }\r\n .base {\r\n position: relative;\r\n width: 100%;\r\n }\r\n .anchor {\r\n position: absolute;\r\n width: 100%;\r\n visibility: hidden;\r\n }\r\n .view {\r\n display: flex;\r\n flex-direction: column;\r\n box-sizing: border-box;\r\n width: 100%;\r\n outline: none;\r\n padding: unset;\r\n margin: unset;\r\n border: unset;\r\n }\r\n .header {\r\n flex: none;\r\n display: flex;\r\n align-items: center;\r\n }\r\n .bar {\r\n flex: 1 1 auto;\r\n }\r\n :host(:state(-fullscreen)) .bar {\r\n transition: ${unsafeCSS(`margin ${DesignToken.motion.duration.short2} ${DesignToken.motion.easing.standard}`)};\r\n }\r\n :host(:state(-fullscreen)[contained]:not([open])) .bar {\r\n margin-inline-start: ${SearchViewToken.containedLeadingMargin};\r\n margin-inline-end: ${SearchViewToken.containedTrailingMargin};\r\n }\r\n :host(:state(-fullscreen)[contained][open]) .bar,\r\n :host(:state(-fullscreen)[contained][open]) .results {\r\n margin-inline-start: ${SearchViewToken.containedFocusedLeadingMargin};\r\n margin-inline-end: ${SearchViewToken.containedFocusedTrailingMargin};\r\n }\r\n .icon {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-sizing: border-box;\r\n min-width: 3rem;\r\n }\r\n ::slotted([slot=\"search-icon\"]),\r\n .search-icon,\r\n ::slotted([slot=\"close-icon\"]),\r\n .close-icon {\r\n width: 1em;\r\n font-size: ${SearchBarToken.iconSize} !important;\r\n }\r\n .results {\r\n overflow: hidden;\r\n flex: 1 1 auto;\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n .scroll-container {\r\n flex: 1 1 auto;\r\n overflow-y: auto;\r\n overflow-x: hidden;\r\n scrollbar-color: ${DesignToken.scrollbar.color};\r\n }\r\n .view:not(:popover-open) .results,\r\n .view.closing .results {\r\n display: none;\r\n }\r\n :host(:not(:is(:state(-clearable), [open]))) .clear {\r\n display: none;\r\n }\r\n ::slotted([slot=\"clear-icon\"]),\r\n .clear-icon {\r\n width: 1em;\r\n font-size: ${SearchBarToken.iconSize} !important;\r\n }\r\n slot[name=\"clear-icon\"] {\r\n --m3e-icon-size: ${SearchBarToken.iconSize};\r\n }\r\n :host(:state(-fullscreen)) .header {\r\n transition: height 150ms cubic-bezier(0.2, 0, 0, 1);\r\n }\r\n :host(:state(-fullscreen)) .view:popover-open:not(.closing) .header {\r\n height: ${SearchViewToken.fullScreenHeaderContainerHeight};\r\n }\r\n :host(:state(-fullscreen):not([open])) .header,\r\n :host(:state(-fullscreen)[open]) .view.closing .header {\r\n height: ${SearchViewToken.containedFullScreenBarContainerHeight};\r\n }\r\n :host(:state(-fullscreen)[open]) .bar {\r\n --m3e-search-bar-container-height: ${SearchViewToken.containedFullScreenBarContainerHeight};\r\n }\r\n :host(:state(-fullscreen)) .anchor {\r\n height: ${SearchViewToken.containedFullScreenBarContainerHeight};\r\n }\r\n :host(:state(-fullscreen)) .view:popover-open {\r\n border-radius: ${SearchViewToken.fullScreenContainerShape};\r\n }\r\n :host(:state(-fullscreen)[contained]) .view:popover-open {\r\n background-color: ${SearchViewToken.containedContainerColor};\r\n }\r\n :host(:state(-fullscreen):not([contained])) .view:popover-open {\r\n background-color: ${SearchViewToken.containerColor};\r\n }\r\n :host(:state(-docked)[open]) .header,\r\n :host(:state(-docked)) .anchor {\r\n height: ${SearchViewToken.dockedHeaderContainerHeight};\r\n }\r\n :host(:not([contained])[open]) .results {\r\n border-top-width: ${SearchViewToken.dividerThickness};\r\n border-top-style: solid;\r\n border-top-color: ${SearchViewToken.dividerColor};\r\n }\r\n :host(:state(-docked)[contained]) .results {\r\n margin-top: ${SearchViewToken.containedDockedBarResultsGap};\r\n }\r\n :host(:state(-docked):not([contained])[open]) .view {\r\n background-color: ${SearchViewToken.containerColor};\r\n --m3e-search-bar-container-color: ${SearchViewToken.containerColor};\r\n }\r\n :host(:state(-docked)[contained]) .results {\r\n background-color: ${SearchViewToken.containerColor};\r\n }\r\n :host(:state(-docked):not([contained])[open]) .view,\r\n :host(:state(-docked)[contained]) .results {\r\n border-radius: ${SearchViewToken.dockedContainerShape};\r\n }\r\n :host(:state(-docked)) .results {\r\n min-height: calc(${SearchViewToken.dockedContainerMinHeight} - ${SearchViewToken.dockedHeaderContainerHeight});\r\n max-height: calc(${SearchViewToken.dockedContainerMaxHeight} - ${SearchViewToken.dockedHeaderContainerHeight});\r\n }\r\n :host(:state(-docked)) .scroll-container {\r\n scrollbar-width: ${DesignToken.scrollbar.thinWidth};\r\n }\r\n :host(:state(-docked):not([contained])) .scroll-container {\r\n padding-bottom: ${SearchViewToken.dockedResultsBottomSpace};\r\n }\r\n :host(:state(-docked)[contained]) .scroll-container {\r\n padding: ${SearchViewToken.containedDockedResultsSpace};\r\n }\r\n :host(:state(-docked)) .results {\r\n transform-origin: top;\r\n transition: ${unsafeCSS(\r\n `transform ${DesignToken.motion.duration.short2} ${DesignToken.motion.easing.standard},\r\n overlay ${DesignToken.motion.duration.short2} ${DesignToken.motion.easing.standard} allow-discrete,\r\n display ${DesignToken.motion.duration.short2} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host(:state(-docked):not([open])) .results {\r\n transform: scaleY(0.8);\r\n }\r\n :host(:state(-docked)[open]) .results {\r\n transform: scaleY(1);\r\n }\r\n @starting-style {\r\n :host(:state(-docked)[open]) .results {\r\n transform: scaleY(0.8);\r\n }\r\n }\r\n :host(:state(-docked)[contained]) .view {\r\n background-color: transparent;\r\n }\r\n :host(:state(-docked):not([open])) .view {\r\n transition: ${unsafeCSS(\r\n `border-radius ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard},\r\n background-color ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard}`,\r\n )};\r\n }\r\n :host(:state(-docked):not([open])) .view::backdrop {\r\n transition: ${unsafeCSS(\r\n `background-color ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host(:state(-docked)) .view::backdrop {\r\n background-color: color-mix(in srgb, ${SearchViewToken.dockedScrimColor} 0%, transparent);\r\n margin-inline-end: -20px;\r\n }\r\n :host(:state(-docked)[open]) .view::backdrop {\r\n background-color: color-mix(\r\n in srgb,\r\n ${SearchViewToken.dockedScrimColor} ${SearchViewToken.dockedScrimOpacity},\r\n transparent\r\n );\r\n transition: ${unsafeCSS(\r\n `background-color ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.long2} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n @starting-style {\r\n :host(:state(-docked)[open]) .view::backdrop {\r\n background-color: color-mix(in srgb, ${SearchViewToken.dockedScrimColor} 0%, transparent);\r\n }\r\n }\r\n :host(:state(-fullscreen)) .view:popover-open {\r\n width: 100vw;\r\n width: 100dvw;\r\n height: 100vh;\r\n height: 100dvh;\r\n overflow: hidden;\r\n }\r\n @media (prefers-reduced-motion) {\r\n :host(:state(-fullscreen)) .bar,\r\n :host(:state(-fullscreen)) .header,\r\n :host(:state(-docked)) .results,\r\n :host(:state(-docked):not([open])) .view,\r\n :host(:state(-docked):not([open])) .view::backdrop,\r\n :host(:state(-docked)[open]) .view::backdrop {\r\n transition: none;\r\n }\r\n }\r\n @media (forced-colors: active) {\r\n :host(:not([contained])[open]) .bar {\r\n --_search-bar-forced-color-outline-style: none;\r\n }\r\n :host(:state(-docked):not([contained])[open]) .view,\r\n :host(:state(-docked)[contained]) .results {\r\n border: 1px solid CanvasText;\r\n }\r\n :host(:not([contained])[open]) .results {\r\n border-top-color: CanvasText;\r\n }\r\n }\r\n`;\r\n","/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\nimport { html, LitElement, nothing } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport {\r\n AttachInternals,\r\n customElement,\r\n EventAttribute,\r\n hasAssignedNodes,\r\n registerStyleSheet,\r\n setCustomState,\r\n} from \"@m3e/web/core\";\r\n\r\nimport \"@m3e/web/icon-button\";\r\n\r\nimport { SearchBarLightDomStyle, SearchBarStyle } from \"./styles\";\r\n\r\n/**\r\n * A bar that provides a prominent entry point for search.\r\n *\r\n * @description\r\n * The `m3e-search-bar` component provides a prominent entry point for search,\r\n * capturing user input and emitting `query` and `clear` events as the text\r\n * changes. It reflects focus and interaction states through customizable CSS\r\n * properties for container, icons, and text styling.\r\n *\r\n * @example\r\n * The following example illustrates typical usage with a leading icon and the\r\n * ability to clear the current search text.\r\n * ```html\r\n * <m3e-search-bar clearable>\r\n * <m3e-icon name=\"search\" slot=\"leading\"></m3e-icon>\r\n * <input slot=\"input\" placeholder=\"Search...\" />\r\n * </m3e-search-bar>\r\n * ```\r\n *\r\n * @tag m3e-search-bar\r\n *\r\n * @attr clearable - Whether the bar presents a button used to clear the search term.\r\n * @attr clear-label - The accessible label given to the button used to clear the search term.\r\n *\r\n * @slot leading - Renders content before the input of the bar.\r\n * @slot input - Renders the input of the bar.\r\n * @slot trailing - Renders content after the input of the bar.\r\n *\r\n * @fires clear - Dispatched when the search term is cleared.\r\n *\r\n * @cssprop --m3e-search-bar-container-color - Background color of the search bar container.\r\n * @cssprop --m3e-search-bar-leading-icon-color - Color of the leading icon.\r\n * @cssprop --m3e-search-bar-trailing-icon-color - Color of the trailing icon.\r\n * @cssprop --m3e-search-bar-container-height - Height of the search bar container.\r\n * @cssprop --m3e-search-bar-container-shape - Shape (border radius) of the search bar container.\r\n * @cssprop --m3e-search-bar-icon-size - Size of icons inside the search bar.\r\n * @cssprop --m3e-search-bar-supporting-text-color - Color of the supporting text.\r\n * @cssprop --m3e-search-bar-supporting-text-font-size - Font size of the supporting text.\r\n * @cssprop --m3e-search-bar-supporting-text-font-weight - Font weight of the supporting text.\r\n * @cssprop --m3e-search-bar-supporting-text-line-height - Line height of the supporting text.\r\n * @cssprop --m3e-search-bar-supporting-text-tracking - Letter spacing of the supporting text.\r\n * @cssprop --m3e-search-bar-input-color - Color of the input text.\r\n * @cssprop --m3e-search-bar-input-text-font-size - Font size of the input text.\r\n * @cssprop --m3e-search-bar-input-text-font-weight - Font weight of the input text.\r\n * @cssprop --m3e-search-bar-input-text-line-height - Line height of the input text.\r\n * @cssprop --m3e-search-bar-input-text-tracking - Letter spacing of the input text.\r\n * @cssprop --m3e-search-bar-leading-space - Space before the leading icon.\r\n * @cssprop --m3e-search-bar-trailing-space - Space after the trailing icon.\r\n * @cssprop --m3e-search-bar-no-actions-leading-space - Leading padding when no actions are present.\r\n * @cssprop --m3e-search-bar-no-actions-trailing-space - Trailing padding when no actions are present.\r\n * @cssprop --m3e-search-bar-leading-actions-trailing-space - Space between leading actions and the input.\r\n * @cssprop --m3e-search-bar-trailing-actions-leading-space - Space between the input and trailing actions.\r\n * @cssprop --m3e-search-bar-actions-gap - Gap between action icons.\r\n */\r\n@customElement(\"m3e-search-bar\")\r\nexport class M3eSearchBarElement extends EventAttribute(AttachInternals(LitElement), \"clear\") {\r\n static {\r\n registerStyleSheet(SearchBarLightDomStyle);\r\n }\r\n\r\n /** The styles of the element. */\r\n static override styles = SearchBarStyle;\r\n\r\n /** @private */ #input?: HTMLInputElement;\r\n /** @private */ readonly #inputInputHandler = () => this.#handleInputInput();\r\n\r\n /**\r\n * Whether the bar presents a button used to clear the search term.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) clearable = false;\r\n\r\n /**\r\n * The accessible label given to the button used to clear the search term.\r\n * @default \"Clear\"\r\n */\r\n @property({ attribute: \"clear-label\" }) clearLabel = \"Clear\";\r\n\r\n /** Clears the search term. */\r\n clear(): void {\r\n if (!this.#input) return;\r\n this.#input.value = \"\";\r\n this.#handleInputInput();\r\n\r\n this.dispatchEvent(new Event(\"clear\", { bubbles: true, composed: true }));\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`\r\n <div class=\"base\" @click=\"${this.#handleContainerClick}\">\r\n <slot name=\"leading\" @slotchange=\"${this.#handleLeadingSlotChange}\"></slot>\r\n <slot name=\"input\" @slotchange=\"${this.#handleInputSlotChange}\"></slot>\r\n ${this.#renderClearButton()}\r\n <slot name=\"trailing\" @slotchange=\"${this.#handleTrailingSlotChange}\"></slot>\r\n </div>\r\n `;\r\n }\r\n\r\n /** @private */\r\n #renderClearButton(): unknown {\r\n return this.clearable\r\n ? html`<div class=\"clear\">\r\n <m3e-icon-button aria-label=\"${this.clearLabel}\" @click=\"${this.#handleClearClick}\">\r\n <slot name=\"clear-icon\">\r\n <svg class=\"clear-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\"\r\n />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>\r\n </div>`\r\n : nothing;\r\n }\r\n\r\n /** @private */\r\n #handleContainerClick(): void {\r\n if (!this.matches(\":focus-within\")) {\r\n this.#input?.focus();\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleLeadingSlotChange(e: Event): void {\r\n setCustomState(this, \"-with-leading\", hasAssignedNodes(e.target as HTMLSlotElement));\r\n }\r\n\r\n /** @private */\r\n #handleTrailingSlotChange(e: Event): void {\r\n setCustomState(this, \"-with-trailing\", hasAssignedNodes(e.target as HTMLSlotElement));\r\n }\r\n\r\n /** @private */\r\n #handleInputSlotChange(e: Event): void {\r\n const input = (e.target as HTMLSlotElement)\r\n .assignedElements({ flatten: true })\r\n .find((x) => x instanceof HTMLInputElement);\r\n\r\n if (input != this.#input) {\r\n this.#input?.removeEventListener(\"input\", this.#inputInputHandler);\r\n this.#input = input;\r\n this.#input?.addEventListener(\"input\", this.#inputInputHandler);\r\n\r\n if (this.#input) {\r\n this.#input.role = this.#input.role || \"searchbox\";\r\n this.#input.inputMode = this.#input.inputMode || \"search\";\r\n this.#input.type = \"text\";\r\n }\r\n\r\n this.#handleInputInput();\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleInputInput(): void {\r\n setCustomState(this, \"-clearable\", this.clearable && (this.#input?.value ?? \"\").length > 0);\r\n }\r\n\r\n /** @private */\r\n #handleClearClick(): void {\r\n this.clear();\r\n this.#input?.focus();\r\n }\r\n}\r\n\r\ninterface M3eSearchBarElementEventMap extends HTMLElementEventMap {\r\n clear: Event;\r\n}\r\n\r\nexport interface M3eSearchBarElement {\r\n addEventListener<K extends keyof M3eSearchBarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSearchBarElement, ev: M3eSearchBarElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSearchBarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSearchBarElement, ev: M3eSearchBarElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-search-bar\": M3eSearchBarElement;\r\n }\r\n}\r\n","/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\nimport { html, LitElement, nothing, PropertyValues, svg } from \"lit\";\r\nimport { property, query, state } from \"lit/decorators.js\";\r\nimport { ifDefined } from \"lit/directives/if-defined.js\";\r\n\r\nimport {\r\n AttachInternals,\r\n customElement,\r\n debounce,\r\n EventAttribute,\r\n FocusController,\r\n InertController,\r\n prefersReducedMotion,\r\n ReconnectedCallback,\r\n registerStyleSheet,\r\n ScrollLockController,\r\n setCustomState,\r\n} from \"@m3e/web/core\";\r\n\r\nimport { positionAnchor } from \"@m3e/web/core/anchoring\";\r\nimport { M3eDirectionality } from \"@m3e/web/core/bidi\";\r\nimport { Breakpoint, M3eBreakpointObserver } from \"@m3e/web/core/layout\";\r\n\r\nimport \"@m3e/web/core/a11y\";\r\n\r\nimport { SearchViewLightDomStyle, SearchViewStyle } from \"./styles\";\r\nimport { SearchViewMode } from \"./SearchViewMode\";\r\nimport { SearchViewQueryEventDetail } from \"./SearchViewQueryEventDetail\";\r\n\r\nimport \"./SearchBarElement\";\r\n\r\n/**\r\n * A surface that presents suggestions and results for a search.\r\n *\r\n * @description\r\n * The `m3e-search-view` component presents the surface for suggestions,\r\n * history, and results, managing the open and close lifecycle around an\r\n * embedded search bar. It emits `query`, `clear`, and `toggle`, events to\r\n * support application driven search logic, and exposes CSS properties for\r\n * container, shape, spacing, and layout across contained, docked, and full\r\n * screen configurations.\r\n *\r\n * @example\r\n * The following example shows a contained view in docked mode with a simple set of search results.\r\n * ```html\r\n * <m3e-search-view mode=\"docked\" contained>\r\n * <input slot=\"input\" placeholder=\"Search...\" />\r\n * <m3e-list>\r\n * <m3e-list-item>Result One</m3e-list-item>\r\n * <m3e-list-item>Result Two</m3e-list-item>\r\n * <m3e-list-item>Result Three</m3e-list-item>\r\n * </m3e-list>\r\n * </m3e-search-view>\r\n * ```\r\n *\r\n * @tag m3e-search-view\r\n *\r\n * @attr contained - Whether the view features a persistent, filled search container.\r\n * @attr mode - The behavior mode of the view.\r\n * @attr open - Whether the view is expanded to show results.\r\n * @attr clear-label - The accessible label given to the button used to clear the search term.\r\n * @attr close-label - The accessible label given to the button used to collapse the view.\r\n * @attr hide-search-icon - Whether to hide the search icon.\r\n *\r\n * @slot - When open, renders the results content of the view.\r\n * @slot input - Renders the input of the view.\r\n * @slot open-leading - When open, renders content before the input of the view.\r\n * @slot open-trailing - When open, renders content after the input of the view.\r\n * @slot closed-leading - When closed, renders content before the input of the view.\r\n * @slot closed-trailing - When closed, renders content after the input of the view.\r\n *\r\n * @fires clear - Dispatched when the search term is cleared.\r\n * @fires query - Dispatched when the view is opened or when the user modifies the search term.\r\n * @fires beforetoggle - Dispatched before the toggle state changes.\r\n * @fires toggle - Dispatched after the toggle state has changed.\r\n *\r\n * @cssprop --m3e-search-view-container-color - Background color of the view container.\r\n * @cssprop --m3e-search-view-contained-container-color - Background color of the contained view container.\r\n * @cssprop --m3e-search-view-divider-color - Color of the divider separating header and results.\r\n * @cssprop --m3e-search-view-divider-thickness - Thickness of the divider separating header and results.\r\n * @cssprop --m3e-search-view-full-screen-container-shape - Shape of the fullscreen view container.\r\n * @cssprop --m3e-search-view-full-screen-header-container-height - Height of the header container in fullscreen mode.\r\n * @cssprop --m3e-search-view-docked-container-shape - Shape of the docked view container.\r\n * @cssprop --m3e-search-view-docked-header-container-height - Height of the header container in docked mode.\r\n * @cssprop --m3e-search-view-contained-leading-margin - Leading margin for the contained view.\r\n * @cssprop --m3e-search-view-contained-trailing-margin - Trailing margin for the contained view.\r\n * @cssprop --m3e-search-view-contained-focused-leading-margin - Leading margin when the contained view is focused.\r\n * @cssprop --m3e-search-view-contained-focused-trailing-margin - Trailing margin when the contained view is focused.\r\n * @cssprop --m3e-search-view-contained-docked-bar-results-gap - Gap between the contained docked bar and results.\r\n * @cssprop --m3e-search-view-contained-docked-results-shape - Shape of the results container in contained docked mode.\r\n * @cssprop --m3e-search-view-contained-docked-bar-shape - Shape of the bar in contained docked mode.\r\n * @cssprop --m3e-search-view-contained-full-screen-bar-container-height - Height of the bar container in contained fullscreen mode.\r\n * @cssprop --m3e-search-view-docked-container-min-height - Minimum height of the docked view container.\r\n * @cssprop --m3e-search-view-docked-container-max-height - Maximum height of the docked view container.\r\n * @cssprop --m3e-search-view-contained-docked-results-space - Space above the results in contained docked mode.\r\n * @cssprop --m3e-search-view-docked-results-bottom-space - Space below the results in docked mode.\r\n * @cssprop --m3e-search-view-docked-scrim-color - Color of the scrim behind the docked view.\r\n * @cssprop --m3e-search-view-docked-scrim-opacity - Opacity of the scrim behind the docked view.\r\n */\r\n@customElement(\"m3e-search-view\")\r\nexport class M3eSearchViewElement extends EventAttribute(\r\n ReconnectedCallback(AttachInternals(LitElement)),\r\n \"clear\",\r\n \"query\",\r\n) {\r\n static {\r\n registerStyleSheet(SearchViewLightDomStyle);\r\n }\r\n\r\n /** The styles of the element. */\r\n static override styles = SearchViewStyle;\r\n\r\n /** @private */ #input?: HTMLInputElement;\r\n /** @private */ #closeOnInputFocus = false;\r\n /** @private */ readonly #inputInputHandler = () => this.#handleInputInput();\r\n /** @private */ readonly #inputFocusHandler = () => this.#handleInputFocus();\r\n /** @private */ readonly #inputKeyDownHandler = (e: KeyboardEvent) => this.#handleInputKeyDown(e);\r\n /** @private */ readonly #inputPointerHandler = () => this.#handleInputPointerDown();\r\n\r\n /** @private */ readonly #scrollLockController = new ScrollLockController(this);\r\n /** @private */ readonly #inertController = new InertController(this);\r\n\r\n /** @private */ @state() private _clearable = false;\r\n /** @private */ @state() private _mode?: Exclude<SearchViewMode, \"auto\">;\r\n /** @private */ #openMode?: Exclude<SearchViewMode, \"auto\">;\r\n\r\n /** @private */ #anchorCleanup?: () => void;\r\n /** @private */ #breakpointUnobserve?: () => void;\r\n /** @private */ @query(\".anchor\") private readonly _anchor!: HTMLElement;\r\n /** @private */ @query(\".view\") private readonly _view!: HTMLElement;\r\n\r\n constructor() {\r\n super();\r\n\r\n new FocusController(this, {\r\n callback: (focused) => this._handleFocusChange(focused),\r\n });\r\n }\r\n\r\n /**\r\n * Whether the view features a persistent, filled search container.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) contained = false;\r\n\r\n /**\r\n * The behavior mode of the view.\r\n * @default \"docked\"\r\n */\r\n @property({ reflect: true }) mode: SearchViewMode = \"docked\";\r\n\r\n /**\r\n * Whether the view is expanded to show results.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) open = false;\r\n\r\n /**\r\n * The accessible label given to the button used to clear the search term.\r\n * @default \"Clear\"\r\n */\r\n @property({ attribute: \"clear-label\" }) clearLabel = \"Clear\";\r\n\r\n /**\r\n * The accessible label given to the button used to collapse the view.\r\n * @default \"Close\"\r\n */\r\n @property({ attribute: \"close-label\" }) closeLabel = \"Close\";\r\n\r\n /**\r\n * Whether to hide the search icon.\r\n * @default false;\r\n */\r\n @property({ attribute: \"hide-search-icon\", type: Boolean }) hideSearchIcon = false;\r\n\r\n /** The current mode applied to the view. */\r\n get currentMode(): Exclude<SearchViewMode, \"auto\"> {\r\n return this._mode ?? (this.mode !== \"fullscreen\" ? \"docked\" : \"fullscreen\");\r\n }\r\n set currentMode(value: Exclude<SearchViewMode, \"auto\">) {\r\n this._mode = value;\r\n }\r\n\r\n /** Clears the search term. */\r\n clear(): void {\r\n if (!this.#input) return;\r\n this.#input.value = \"\";\r\n this.#updateClearableState();\r\n\r\n this.dispatchEvent(\r\n new CustomEvent<SearchViewQueryEventDetail>(\"query\", {\r\n detail: { term: \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n\r\n this.dispatchEvent(new Event(\"clear\", { bubbles: true, composed: true }));\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n\r\n this._mode = undefined;\r\n this.#breakpointUnobserve?.();\r\n }\r\n\r\n /** @inheritdoc */\r\n override reconnectedCallback(): void {\r\n super.reconnectedCallback();\r\n\r\n if (this.mode === \"auto\") {\r\n this.#initBreakpointMonitoring();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override willUpdate(changedProperties: PropertyValues): void {\r\n super.willUpdate(changedProperties);\r\n\r\n if (changedProperties.has(\"mode\")) {\r\n this.#breakpointUnobserve?.();\r\n\r\n const previousMode = changedProperties.get(\"mode\");\r\n if (previousMode && previousMode !== this.mode && this.open) {\r\n this.open = false;\r\n }\r\n\r\n if (this.mode === \"auto\") {\r\n this.#initBreakpointMonitoring();\r\n } else {\r\n this._mode = undefined;\r\n this.#updateMode();\r\n }\r\n }\r\n if (changedProperties.has(\"_mode\")) {\r\n this.#updateMode();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues<this>): void {\r\n super.updated(_changedProperties);\r\n if (_changedProperties.has(\"open\")) {\r\n if (!this.open) {\r\n if ((this.#openMode ?? this.currentMode) === \"fullscreen\") {\r\n this.#closeFullscreen();\r\n } else {\r\n this.#closeDocked();\r\n }\r\n } else {\r\n if (this.currentMode === \"fullscreen\") {\r\n this.#openFullscreen();\r\n } else {\r\n this.#openDocked();\r\n }\r\n }\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html` <div class=\"base\">\r\n <div class=\"anchor\"></div>\r\n <div\r\n role=\"${ifDefined(this.open ? \"dialog\" : undefined)}\"\r\n aria-modal=\"${ifDefined(this.open ? \"true\" : undefined)}\"\r\n aria-labelledby=\"${ifDefined(this.open ? \"header\" : undefined)}\"\r\n class=\"view\"\r\n tabindex=\"-1\"\r\n @keydown=\"${this.#handleKeyDown}\"\r\n >\r\n <m3e-focus-trap ?disabled=\"${!this.open}\">\r\n <div class=\"header\" id=\"header\">\r\n <m3e-search-bar class=\"bar\">\r\n ${this.#renderIconOrBackButton()}\r\n ${this.open\r\n ? html`<slot name=\"open-leading\" slot=\"leading\"></slot>`\r\n : html`<slot name=\"closed-leading\" slot=\"leading\"></slot>`}\r\n <slot name=\"input\" slot=\"input\" @slotchange=\"${this.#handleInputSlotChange}\"></slot>\r\n ${this.#renderClearButton()}\r\n ${this.open\r\n ? html`<slot name=\"open-trailing\" slot=\"trailing\"></slot>`\r\n : html`<slot name=\"closed-trailing\" slot=\"trailing\"></slot>`}\r\n </m3e-search-bar>\r\n </div>\r\n <div class=\"results\">\r\n <div class=\"scroll-container\">\r\n <slot></slot>\r\n </div>\r\n </div>\r\n </m3e-focus-trap>\r\n </div>\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #renderIconOrBackButton(): unknown {\r\n if (!this.open && this.hideSearchIcon) return nothing;\r\n return html`<div class=\"icon\" slot=\"leading\">${this.open ? this.#renderBackButton() : this.#renderIcon()}</div>`;\r\n }\r\n\r\n /** @private */\r\n #renderIcon(): unknown {\r\n return html`<slot name=\"search-icon\">\r\n <svg class=\"search-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z\"\r\n />\r\n </svg>\r\n </slot>`;\r\n }\r\n\r\n /** @private */\r\n #renderBackButton(): unknown {\r\n return html`<m3e-icon-button\r\n class=\"close\"\r\n slot=\"leading\"\r\n aria-label=\"${this.closeLabel}\"\r\n @click=\"${this.#handleCloseClick}\"\r\n >\r\n <slot name=\"close-icon\">\r\n <svg class=\"close-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n ${this.currentMode === \"docked\"\r\n ? svg`<path d=\"m313-440 224 224-57 56-320-320 320-320 57 56-224 224h487v80H313Z\"/>`\r\n : svg`<path d=\"M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z\"/>`}\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #renderClearButton(): unknown {\r\n return html`<m3e-icon-button\r\n class=\"clear\"\r\n slot=\"trailing\"\r\n aria-label=\"${this.open && !this._clearable ? this.closeLabel : this.clearLabel}\"\r\n @click=\"${this.#handleClearClick}\"\r\n >\r\n <slot name=\"clear-icon\">\r\n <svg class=\"clear-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\" />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #initBreakpointMonitoring(): void {\r\n this.#breakpointUnobserve = M3eBreakpointObserver.observe([Breakpoint.XSmall], (matches) => {\r\n const currentMode = this.currentMode;\r\n this._mode = matches.get(Breakpoint.XSmall) ? \"fullscreen\" : \"docked\";\r\n if (currentMode !== this._mode && this.open) {\r\n this.open = false;\r\n }\r\n this.#updateMode();\r\n });\r\n }\r\n\r\n /** @private */\r\n #handleInputSlotChange(e: Event): void {\r\n const input = (e.target as HTMLSlotElement)\r\n .assignedElements({ flatten: true })\r\n .find((x) => x instanceof HTMLInputElement);\r\n\r\n if (input != this.#input) {\r\n this.#input?.removeEventListener(\"input\", this.#inputInputHandler);\r\n this.#input?.removeEventListener(\"focus\", this.#inputFocusHandler);\r\n this.#input?.removeEventListener(\"keydown\", this.#inputKeyDownHandler);\r\n this.#input?.removeEventListener(\"pointerdown\", this.#inputPointerHandler);\r\n\r\n this.#input = input;\r\n\r\n this.#input?.addEventListener(\"input\", this.#inputInputHandler);\r\n this.#input?.addEventListener(\"focus\", this.#inputFocusHandler);\r\n this.#input?.addEventListener(\"keydown\", this.#inputKeyDownHandler);\r\n this.#input?.addEventListener(\"pointerdown\", this.#inputPointerHandler);\r\n\r\n if (this.#input) {\r\n this.#input.role = this.#input.role || \"searchbox\";\r\n this.#input.inputMode = this.#input.inputMode || \"search\";\r\n this.#input.type = \"text\";\r\n this.#input.ariaHasPopup = \"dialog\";\r\n }\r\n\r\n this.#updateClearableState();\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleInputInput(): void {\r\n this.#updateClearableState();\r\n if (this.open) {\r\n this.dispatchEvent(\r\n new CustomEvent<SearchViewQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input?.value ?? \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n } else {\r\n this.open = true;\r\n }\r\n }\r\n\r\n /** @private */\r\n #updateMode(): void {\r\n setCustomState(this, \"-fullscreen\", this.currentMode === \"fullscreen\");\r\n setCustomState(this, \"-docked\", this.currentMode === \"docked\");\r\n }\r\n\r\n /** @private */\r\n #updateClearableState(): void {\r\n this._clearable = (this.#input?.value ?? \"\").length > 0;\r\n setCustomState(this, \"-clearable\", this._clearable);\r\n }\r\n\r\n /** @private */\r\n #handleInputFocus(): void {\r\n this.open = !this.#closeOnInputFocus;\r\n this.#closeOnInputFocus = false;\r\n }\r\n\r\n /** @private */\r\n #handleCloseClick(): void {\r\n if (!this.#input) return;\r\n if (this.#input.value) {\r\n this.clear();\r\n }\r\n this.#closeOnInputFocus = true;\r\n this.#input?.focus();\r\n }\r\n\r\n /** @private */\r\n #handleClearClick(): void {\r\n if (!this.#input) return;\r\n if (this.#input.value) {\r\n this.clear();\r\n } else {\r\n this.#closeOnInputFocus = true;\r\n }\r\n this.#input?.focus();\r\n }\r\n\r\n /** @private */\r\n #handleInputPointerDown(): void {\r\n if (!this.open && this.#input?.matches(\":focus\")) {\r\n this.open = true;\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleInputKeyDown(e: KeyboardEvent): void {\r\n if (this.open && e.key === \"Escape\" && !e.shiftKey && !e.ctrlKey) {\r\n e.preventDefault();\r\n\r\n const input = e.target as HTMLInputElement;\r\n if (input.value) {\r\n this.clear();\r\n }\r\n\r\n this.open = false;\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleKeyDown(e: KeyboardEvent): void {\r\n if (this.open && e.key === \"Escape\" && !e.shiftKey && !e.ctrlKey) {\r\n e.preventDefault();\r\n this.#handleCloseClick();\r\n }\r\n }\r\n\r\n /** @private */\r\n @debounce(40)\r\n private _handleFocusChange(focused: boolean) {\r\n if (!focused && this.currentMode === \"docked\") {\r\n this.clear();\r\n this.open = false;\r\n }\r\n }\r\n\r\n /** @private */\r\n async #openDocked(): Promise<void> {\r\n if (\r\n !this.dispatchEvent(\r\n new ToggleEvent(\"beforetoggle\", {\r\n oldState: \"closed\",\r\n newState: \"open\",\r\n bubbles: true,\r\n composed: true,\r\n cancelable: true,\r\n }),\r\n )\r\n ) {\r\n this.open = false;\r\n return;\r\n }\r\n\r\n this.#openMode = this.currentMode;\r\n const view = this._view;\r\n\r\n this.#anchorCleanup?.();\r\n this.#anchorCleanup = await positionAnchor(\r\n view,\r\n this._anchor,\r\n {\r\n position: \"bottom\",\r\n },\r\n (x, y) => {\r\n const view = this._view;\r\n view.style.top = `${y - this._anchor.clientHeight}px`;\r\n view.style.width = `${this._anchor.clientWidth}px`;\r\n\r\n if (M3eDirectionality.current === \"rtl\") {\r\n view.style.right = `${window.innerWidth - x - this.clientWidth}px`;\r\n view.style.left = \"\";\r\n } else {\r\n view.style.left = `${x}px`;\r\n view.style.right = \"\";\r\n }\r\n },\r\n );\r\n\r\n this._anchor.style.position = \"relative\";\r\n view.popover = \"manual\";\r\n view.style.position = \"absolute\";\r\n view.showPopover();\r\n this.#scrollLockController.lock();\r\n this.#inertController.lock();\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: \"closed\",\r\n newState: \"open\",\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n\r\n this.dispatchEvent(\r\n new CustomEvent<SearchViewQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input?.value ?? \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n\r\n /** @private */\r\n #closeDocked(): void {\r\n const view = this._view;\r\n if (view.popover !== \"manual\") return;\r\n if (\r\n !this.dispatchEvent(\r\n new ToggleEvent(\"beforetoggle\", {\r\n oldState: \"open\",\r\n newState: \"closed\",\r\n bubbles: true,\r\n composed: true,\r\n cancelable: true,\r\n }),\r\n )\r\n ) {\r\n this.open = true;\r\n return;\r\n }\r\n\r\n this.#openMode = undefined;\r\n this.#scrollLockController.unlock();\r\n this.#inertController.unlock();\r\n\r\n if (prefersReducedMotion()) {\r\n this.#hideDocked();\r\n } else {\r\n view.classList.add(\"closing\");\r\n view.addEventListener(\"transitionend\", () => this.#hideDocked(), { once: true });\r\n }\r\n }\r\n\r\n /** @private */\r\n #hideDocked(): void {\r\n this.#anchorCleanup?.();\r\n this.#anchorCleanup = undefined;\r\n\r\n const view = this._view;\r\n view.classList.remove(\"closing\");\r\n view.style.position = \"\";\r\n view.style.width = \"\";\r\n view.style.top = \"\";\r\n view.style.left = \"\";\r\n view.style.right = \"\";\r\n view.hidePopover();\r\n view.popover = null;\r\n this._anchor.style.position = \"\";\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: \"open\",\r\n newState: \"closed\",\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n\r\n /** @private */\r\n async #openFullscreen(): Promise<void> {\r\n if (\r\n !this.dispatchEvent(\r\n new ToggleEvent(\"beforetoggle\", {\r\n oldState: \"closed\",\r\n newState: \"open\",\r\n bubbles: true,\r\n composed: true,\r\n cancelable: true,\r\n }),\r\n )\r\n ) {\r\n this.open = false;\r\n return;\r\n }\r\n\r\n this.#openMode = this.currentMode;\r\n this.#scrollLockController.lock();\r\n this.#inertController.lock();\r\n\r\n const view = this._view;\r\n this.#anchorCleanup?.();\r\n\r\n if (!prefersReducedMotion()) {\r\n const rect = view.getBoundingClientRect();\r\n const startInline = M3eDirectionality.current === \"rtl\" ? window.innerWidth - rect.right : rect.left;\r\n\r\n view.style.position = \"fixed\";\r\n view.popover = \"manual\";\r\n view.showPopover();\r\n this._anchor.style.position = \"relative\";\r\n\r\n view.animate(\r\n [\r\n {\r\n transform: `translateX(${startInline}px)`,\r\n width: `${rect.width}px`,\r\n top: `${rect.top}px`,\r\n height: `${rect.height}px`,\r\n },\r\n { transform: \"translateX(0px)\", width: \"100vw\", top: \"0px\", height: \"100vh\" },\r\n ],\r\n {\r\n duration: 150,\r\n easing: \"cubic-bezier(0.2, 0.0, 0, 1.0)\",\r\n },\r\n );\r\n } else {\r\n view.style.position = \"fixed\";\r\n view.popover = \"manual\";\r\n view.showPopover();\r\n this._anchor.style.position = \"relative\";\r\n }\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: \"closed\",\r\n newState: \"open\",\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n\r\n this.dispatchEvent(\r\n new CustomEvent<SearchViewQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input?.value ?? \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n\r\n /** @private */\r\n async #closeFullscreen(): Promise<void> {\r\n const view = this._view;\r\n if (view.popover !== \"manual\") return;\r\n\r\n if (\r\n !this.dispatchEvent(\r\n new ToggleEvent(\"beforetoggle\", {\r\n oldState: \"open\",\r\n newState: \"closed\",\r\n bubbles: true,\r\n composed: true,\r\n cancelable: true,\r\n }),\r\n )\r\n ) {\r\n this.open = true;\r\n return;\r\n }\r\n\r\n this.#openMode = undefined;\r\n this.#scrollLockController.unlock();\r\n this.#inertController.unlock();\r\n\r\n const anchor = this._anchor;\r\n\r\n if (!prefersReducedMotion()) {\r\n const start = view.getBoundingClientRect();\r\n const end = anchor.getBoundingClientRect();\r\n\r\n const startInline = M3eDirectionality.current === \"rtl\" ? window.innerWidth - start.right : start.left;\r\n const endInline = M3eDirectionality.current === \"rtl\" ? window.innerWidth - end.right : end.left;\r\n const dx = M3eDirectionality.current === \"rtl\" ? startInline - endInline : endInline - startInline;\r\n\r\n view.classList.add(\"closing\");\r\n await view.animate(\r\n [\r\n {\r\n transform: `translateX(0px)`,\r\n width: `${start.width}px`,\r\n top: `${start.top}px`,\r\n height: `${start.height}px`,\r\n },\r\n {\r\n transform: `translateX(${dx}px)`,\r\n width: `${end.width}px`,\r\n top: `${end.top}px`,\r\n height: `${end.height}px`,\r\n },\r\n ],\r\n {\r\n duration: 150,\r\n easing: \"cubic-bezier(0.2, 0.0, 0, 1.0)\",\r\n },\r\n ).finished;\r\n }\r\n\r\n view.hidePopover();\r\n view.style.position = \"\";\r\n view.popover = null;\r\n view.classList.remove(\"closing\");\r\n anchor.style.position = \"\";\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: \"open\",\r\n newState: \"closed\",\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n}\r\n\r\ninterface M3eSearchViewElementEventMap extends HTMLElementEventMap {\r\n clear: Event;\r\n query: CustomEvent<SearchViewQueryEventDetail>;\r\n beforetoggle: ToggleEvent;\r\n toggle: ToggleEvent;\r\n}\r\n\r\nexport interface M3eSearchViewElement {\r\n addEventListener<K extends keyof M3eSearchViewElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSearchViewElement, ev: M3eSearchViewElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSearchViewElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSearchViewElement, ev: M3eSearchViewElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-search-view\": M3eSearchViewElement;\r\n }\r\n}\r\n"],"names":["SearchBarToken","unsafeCSS","DesignToken","color","surfaceContainerHigh","onSurface","onSurfaceVariant","shape","corner","full","typescale","standard","body","large","fontSize","fontWeight","lineHeight","tracking","SearchBarLightDomStyle","css","SearchBarStyle","SearchViewToken","surfaceContainerLow","outline","none","extraLarge","medium","scrim","SearchViewLightDomStyle","SearchViewStyle","motion","duration","short2","easing","scrollbar","thinWidth","long2","short3","M3eSearchBarElement","EventAttribute","AttachInternals","LitElement","constructor","_M3eSearchBarElement_input","set","this","_M3eSearchBarElement_inputInputHandler","__classPrivateFieldGet","_M3eSearchBarElement_instances","_M3eSearchBarElement_handleInputInput","call","clearable","clearLabel","clear","value","dispatchEvent","Event","bubbles","composed","render","html","_M3eSearchBarElement_handleContainerClick","_M3eSearchBarElement_handleLeadingSlotChange","_M3eSearchBarElement_handleInputSlotChange","_M3eSearchBarElement_renderClearButton","_M3eSearchBarElement_handleTrailingSlotChange","_M3eSearchBarElement_handleClearClick","nothing","matches","focus","e","setCustomState","hasAssignedNodes","target","input","assignedElements","flatten","find","x","HTMLInputElement","removeEventListener","__classPrivateFieldSet","addEventListener","role","inputMode","type","length","registerStyleSheet","styles","__decorate","property","Boolean","reflect","prototype","attribute","customElement","M3eSearchViewElement","ReconnectedCallback","super","_M3eSearchViewElement_input","_M3eSearchViewElement_closeOnInputFocus","_M3eSearchViewElement_inputInputHandler","_M3eSearchViewElement_instances","_M3eSearchViewElement_handleInputInput","_M3eSearchViewElement_inputFocusHandler","_M3eSearchViewElement_handleInputFocus","_M3eSearchViewElement_inputKeyDownHandler","_M3eSearchViewElement_inputPointerHandler","_M3eSearchViewElement_handleInputPointerDown","_M3eSearchViewElement_scrollLockController","ScrollLockController","_M3eSearchViewElement_inertController","InertController","_clearable","_M3eSearchViewElement_openMode","_M3eSearchViewElement_anchorCleanup","_M3eSearchViewElement_breakpointUnobserve","contained","mode","open","closeLabel","hideSearchIcon","FocusController","callback","focused","_handleFocusChange","currentMode","_mode","_M3eSearchViewElement_updateClearableState","CustomEvent","detail","term","disconnectedCallback","undefined","reconnectedCallback","_M3eSearchViewElement_initBreakpointMonitoring","willUpdate","changedProperties","has","previousMode","get","_M3eSearchViewElement_updateMode","updated","_changedProperties","_M3eSearchViewElement_openFullscreen","_M3eSearchViewElement_openDocked","_M3eSearchViewElement_closeFullscreen","_M3eSearchViewElement_closeDocked","ifDefined","_M3eSearchViewElement_handleKeyDown","_M3eSearchViewElement_renderIconOrBackButton","_M3eSearchViewElement_handleInputSlotChange","_M3eSearchViewElement_renderClearButton","_M3eSearchViewElement_renderBackButton","_M3eSearchViewElement_renderIcon","_M3eSearchViewElement_handleCloseClick","svg","_M3eSearchViewElement_handleClearClick","M3eBreakpointObserver","observe","Breakpoint","XSmall","ariaHasPopup","key","shiftKey","ctrlKey","preventDefault","async","ToggleEvent","oldState","newState","cancelable","view","_view","positionAnchor","_anchor","position","y","style","top","clientHeight","width","clientWidth","M3eDirectionality","current","right","window","innerWidth","left","popover","showPopover","lock","unlock","prefersReducedMotion","_M3eSearchViewElement_hideDocked","classList","add","once","remove","hidePopover","rect","getBoundingClientRect","startInline","animate","transform","height","anchor","start","end","endInline","dx","finished","state","query","debounce"],"mappings":";;;;;o1BAKO,MAAMA,EACKC,EAAU,yCAAyCC,EAAYC,MAAMC,yBAD1EJ,EAEOC,EAAU,4CAA4CC,EAAYC,MAAME,cAF/EL,EAGQC,EAAU,6CAA6CC,EAAYC,MAAMG,qBAHjFN,EAIMC,EAAU,kDAJhBD,EAKKC,EAAU,yCAAyCC,EAAYK,MAAMC,OAAOC,SALjFT,EAMDC,EAAU,2CANTD,EAOUC,EAAU,+CAA+CC,EAAYC,MAAMG,qBAPrFN,EAQaC,EACtB,mDAAmDC,EAAYQ,UAAUC,SAASC,KAAKC,MAAMC,aATpFd,EAWeC,EACxB,qDAAqDC,EAAYQ,UAAUC,SAASC,KAAKC,MAAME,eAZtFf,EAceC,EACxB,qDAAqDC,EAAYQ,UAAUC,SAASC,KAAKC,MAAMG,eAftFhB,EAiBaC,EACtB,kDAAkDC,EAAYQ,UAAUC,SAASC,KAAKC,MAAMI,aAlBnFjB,EAoBCC,EAAU,qCAAqCC,EAAYC,MAAME,cApBlEL,EAqBQC,EACjB,8CAA8CC,EAAYQ,UAAUC,SAASC,KAAKC,MAAMC,aAtB/Ed,EAwBUC,EACnB,gDAAgDC,EAAYQ,UAAUC,SAASC,KAAKC,MAAME,eAzBjFf,EA2BUC,EACnB,gDAAgDC,EAAYQ,UAAUC,SAASC,KAAKC,MAAMG,eA5BjFhB,EA8BQC,EACjB,6CAA6CC,EAAYQ,UAAUC,SAASC,KAAKC,MAAMI,aA/B9EjB,EAiCGC,EAAU,gDAjCbD,EAkCIC,EAAU,iDAlCdD,EAmCYC,EAAU,wDAnCtBD,EAoCaC,EAAU,yDApCvBD,EAqCkBC,EAAU,iEArC5BD,EAsCkBC,EAAU,iEAtC5BD,EAuCCC,EAAU,0CCpCXiB,EAAyBC,CAAG,+EAG5BnB,iBACIA,mBACEA,mBACAA,sBACGA,OAQToB,GAAiCD,CAAG,mCAGnCnB,oIASOA,wBACGA,qbAoBQA,0KAUnBA,iBACIA,mBACEA,mBACAA,sBACGA,mEAGMA,yEAGAA,2FAGFA,iGAGAA,sFAGCA,8GAGFA,sCAGZA,wBACWA,oCACYA,uBACbA,+CAIVA,wBACWA,oCACYA,uBACbA,iGAKNA,6EAKAA,8DAGMA,iIC7GVqB,GACKpB,EAAU,0CAA0CC,EAAYC,MAAMC,yBAD3EiB,GAEcpB,EACvB,oDAAoDC,EAAYC,MAAMmB,wBAH7DD,GAKGpB,EAAU,wCAAwCC,EAAYC,MAAMoB,YALvEF,GAMOpB,EAAU,iDANjBoB,GAOepB,EACxB,sDAAsDC,EAAYK,MAAMC,OAAOgB,SARtEH,GAUsBpB,EAAU,sEAVhCoB,GAWWpB,EACpB,iDAAiDC,EAAYK,MAAMC,OAAOiB,eAZjEJ,GAckBpB,EAAU,iEAd5BoB,GAeapB,EAAU,2DAfvBoB,GAgBcpB,EAAU,6DAhBxBoB,GAiBoBpB,EAAU,oEAjB9BoB,GAkBqBpB,EAAU,qEAlB/BoB,GAmBmBpB,EAAU,gEAnB7BoB,IAoBkBpB,EAC3B,yDAAyDC,EAAYK,MAAMC,OAAOkB,WAE3DzB,EACvB,qDAAqDC,EAAYK,MAAMC,OAAOC,SAEzCR,EACrC,8EA3BSoB,GA6BepB,EAAU,6DA7BzBoB,GA8BepB,EAAU,4EA9BzBoB,GA+BkBpB,EAAU,kEA/B5BoB,GAgCepB,EAAU,4DAhCzBoB,GAiCOpB,EAAU,6CAA6CC,EAAYC,MAAMwB,UAjChFN,GAkCSpB,EAAU,oDC5BnB2B,GAA0BT,CAAG,gFAG7BnB,iBACIA,mBACEA,mBACAA,sBACGA,OAQT6B,GAAkCV,CAAG,+ZAgChClB,EAAU,UAAUC,EAAY4B,OAAOC,SAASC,UAAU9B,EAAY4B,OAAOG,OAAOtB,gGAG3EU,0BACFA,uIAIEA,0BACFA,6OAcRrB,oMAYME,EAAYgC,UAAU/B,qOAY5BH,8DAGMA,kLAMTqB,0HAIAA,oFAG2BA,sDAG3BA,wEAGOA,sFAGGA,4FAGAA,wFAIVA,qEAGUA,kDAEAA,kEAGNA,iFAGMA,yCACgBA,wEAGhBA,0HAIHA,4DAGEA,QAA8CA,yBAC9CA,QAA8CA,sEAG9CnB,EAAYgC,UAAUC,4FAGvBd,wEAGPA,8EAIGpB,EACZ,aAAaC,EAAY4B,OAAOC,SAASC,UAAU9B,EAAY4B,OAAOG,OAAOtB,4BACnET,EAAY4B,OAAOC,SAASC,UAAU9B,EAAY4B,OAAOG,OAAOtB,2CAChET,EAAY4B,OAAOC,SAASC,UAAU9B,EAAY4B,OAAOG,OAAOtB,iYAkB9DV,EACZ,iBAAiBC,EAAY4B,OAAOC,SAASK,SAASlC,EAAY4B,OAAOG,OAAOtB,qCAC7DT,EAAY4B,OAAOC,SAASK,SAASlC,EAAY4B,OAAOG,OAAOtB,mFAItEV,EACZ,oBAAoBC,EAAY4B,OAAOC,SAASM,UAAUnC,EAAY4B,OAAOG,OAAOtB,+BACxET,EAAY4B,OAAOC,SAASM,UAAUnC,EAAY4B,OAAOG,OAAOtB,gDAC7DT,EAAY4B,OAAOC,SAASM,UAAUnC,EAAY4B,OAAOG,OAAOtB,+GAI1CU,yIAMnCA,MAAoCA,kCAG1BpB,EACZ,oBAAoBC,EAAY4B,OAAOC,SAASK,SAASlC,EAAY4B,OAAOG,OAAOtB,+BACvET,EAAY4B,OAAOC,SAASK,SAASlC,EAAY4B,OAAOG,OAAOtB,gDAC5DT,EAAY4B,OAAOC,SAASK,SAASlC,EAAY4B,OAAOG,OAAOtB,uIAKvCU,+yBCxJtC,IAAMiB,GAAN,cAAkCC,EAAeC,EAAgBC,GAAa,UAA9EC,WAAAA,oCAQWC,GAAAC,IAAAC,aACSC,GAAAF,IAAAC,KAAqB,IAAME,EAAAF,KAAIG,GAAA,IAAAC,IAAkBC,KAAtBL,OAMRA,KAAAM,WAAY,EAMhBN,KAAAO,WAAa,OAwFvD,CArFEC,KAAAA,GACON,EAAAF,KAAIF,GAAA,OACTI,EAAAF,KAAIF,GAAA,KAAQW,MAAQ,GACpBP,EAAAF,KAAIG,GAAA,IAAAC,IAAkBC,KAAtBL,MAEAA,KAAKU,cAAc,IAAIC,MAAM,QAAS,CAAEC,SAAS,EAAMC,UAAU,KACnE,CAGmBC,MAAAA,GACjB,OAAOC,CAAI,6BACmBb,EAAAF,KAAIG,GAAA,IAAAa,0CACMd,EAAAF,KAAIG,GAAA,IAAAc,+CACNf,EAAAF,KAAIG,GAAA,IAAAe,eACpChB,EAAAF,KAAIG,GAAA,IAAAgB,IAAmBd,KAAvBL,2CACmCE,EAAAF,KAAIG,GAAA,IAAAiB,oBAG/C,kKAIE,OAAOpB,KAAKM,UACRS,CAAI,mDAC6Bf,KAAKO,uBAAuBL,EAAAF,KAAIG,GAAA,IAAAkB,uPAUjEC,CACN,gBAIOtB,KAAKuB,QAAQ,kBAChBrB,EAAAF,KAAIF,GAAA,MAAS0B,OAEjB,cAGyBC,GACvBC,EAAe1B,KAAM,gBAAiB2B,EAAiBF,EAAEG,QAC3D,cAG0BH,GACxBC,EAAe1B,KAAM,iBAAkB2B,EAAiBF,EAAEG,QAC5D,cAGuBH,GACrB,MAAMI,EAASJ,EAAEG,OACdE,iBAAiB,CAAEC,SAAS,IAC5BC,KAAMC,GAAMA,aAAaC,kBAExBL,GAAS3B,EAAAF,KAAIF,GAAA,OACfI,EAAAF,KAAIF,GAAA,MAASqC,oBAAoB,QAASjC,EAAAF,KAAIC,GAAA,MAC9CmC,EAAApC,KAAIF,GAAU+B,EAAK,KACnB3B,EAAAF,KAAIF,GAAA,MAASuC,iBAAiB,QAASnC,EAAAF,KAAIC,GAAA,MAEvCC,EAAAF,KAAIF,GAAA,OACNI,EAAAF,KAAIF,GAAA,KAAQwC,KAAOpC,EAAAF,KAAIF,GAAA,KAAQwC,MAAQ,YACvCpC,EAAAF,KAAIF,GAAA,KAAQyC,UAAYrC,EAAAF,KAAIF,GAAA,KAAQyC,WAAa,SACjDrC,EAAAF,KAAIF,GAAA,KAAQ0C,KAAO,QAGrBtC,EAAAF,KAAIG,GAAA,IAAAC,IAAkBC,KAAtBL,MAEJ,gBAIE0B,EAAe1B,KAAM,aAAcA,KAAKM,YAAcJ,EAAAF,KAAIF,GAAA,MAASW,OAAS,IAAIgC,OAAS,EAC3F,gBAIEzC,KAAKQ,QACLN,EAAAF,KAAIF,GAAA,MAAS0B,OACf,EA1GEkB,EAAmBrE,GAILoB,GAAAkD,OAASpE,GASmBqE,EAAA,CAA3CC,EAAS,CAAEL,KAAMM,QAASC,SAAS,KAA0BtD,GAAAuD,UAAA,iBAAA,GAMtBJ,EAAA,CAAvCC,EAAS,CAAEI,UAAW,iBAAsCxD,GAAAuD,UAAA,kBAAA,GArBlDvD,GAAmBmD,EAAA,CAD/BM,EAAc,mBACFzD,IC4BN,IAAM0D,GAAN,cAAmCzD,EACxC0D,EAAoBzD,EAAgBC,IACpC,QACA,UA4BAC,WAAAA,GACEwD,qBApBcC,GAAAvD,IAAAC,aACAuD,GAAAxD,IAAAC,MAAqB,GACZwD,GAAAzD,IAAAC,KAAqB,IAAME,EAAAF,KAAIyD,GAAA,IAAAC,IAAkBrD,KAAtBL,OAC3B2D,GAAA5D,IAAAC,KAAqB,IAAME,EAAAF,KAAIyD,GAAA,IAAAG,IAAkBvD,KAAtBL,OAC3B6D,GAAA9D,IAAAC,KAAwByB,GAAqBvB,EAAAF,gBAAwBK,KAAxBL,KAAyByB,IACtEqC,GAAA/D,IAAAC,KAAuB,IAAME,EAAAF,KAAIyD,GAAA,IAAAM,IAAwB1D,KAA5BL,OAE7BgE,GAAAjE,IAAAC,KAAwB,IAAIiE,EAAqBjE,OACjDkE,GAAAnE,IAAAC,KAAmB,IAAImE,EAAgBnE,OAE/BA,KAAAoE,YAAa,EAE9BC,GAAAtE,IAAAC,aAEAsE,GAAAvE,IAAAC,aACAuE,GAAAxE,IAAAC,aAgB4BA,KAAAwE,WAAY,EAM3BxE,KAAAyE,KAAuB,SAMRzE,KAAA0E,MAAO,EAMX1E,KAAAO,WAAa,QAMbP,KAAA2E,WAAa,QAMO3E,KAAA4E,gBAAiB,EAvC3E,IAAIC,EAAgB7E,KAAM,CACxB8E,SAAWC,GAAY/E,KAAKgF,mBAAmBD,IAEnD,CAuCA,eAAIE,GACF,OAAOjF,KAAKkF,QAAwB,eAAdlF,KAAKyE,KAAwB,SAAW,aAChE,CACA,eAAIQ,CAAYxE,GACdT,KAAKkF,MAAQzE,CACf,CAGAD,KAAAA,GACON,EAAAF,KAAIsD,GAAA,OACTpD,EAAAF,KAAIsD,GAAA,KAAQ7C,MAAQ,GACpBP,EAAAF,KAAIyD,GAAA,IAAA0B,IAAsB9E,KAA1BL,MAEAA,KAAKU,cACH,IAAI0E,YAAwC,QAAS,CACnDC,OAAQ,CAAEC,KAAM,IAChB1E,SAAS,EACTC,UAAU,KAIdb,KAAKU,cAAc,IAAIC,MAAM,QAAS,CAAEC,SAAS,EAAMC,UAAU,KACnE,CAGS0E,oBAAAA,GACPlC,MAAMkC,uBAENvF,KAAKkF,WAAQM,EACbtF,EAAAF,KAAIuE,GAAA,MAAuBlE,KAA3BL,KACF,CAGSyF,mBAAAA,GACPpC,MAAMoC,sBAEY,SAAdzF,KAAKyE,MACPvE,EAAAF,KAAIyD,GAAA,IAAAiC,IAA0BrF,KAA9BL,KAEJ,CAGmB2F,UAAAA,CAAWC,GAG5B,GAFAvC,MAAMsC,WAAWC,GAEbA,EAAkBC,IAAI,QAAS,CACjC3F,EAAAF,KAAIuE,GAAA,MAAuBlE,KAA3BL,MAEA,MAAM8F,EAAeF,EAAkBG,IAAI,QACvCD,GAAgBA,IAAiB9F,KAAKyE,MAAQzE,KAAK0E,OACrD1E,KAAK0E,MAAO,GAGI,SAAd1E,KAAKyE,KACPvE,EAAAF,KAAIyD,GAAA,IAAAiC,IAA0BrF,KAA9BL,OAEAA,KAAKkF,WAAQM,EACbtF,EAAAF,KAAIyD,GAAA,IAAAuC,IAAY3F,KAAhBL,MAEJ,CACI4F,EAAkBC,IAAI,UACxB3F,EAAAF,KAAIyD,GAAA,IAAAuC,IAAY3F,KAAhBL,KAEJ,CAGmBiG,OAAAA,CAAQC,GACzB7C,MAAM4C,QAAQC,GACVA,EAAmBL,IAAI,UACpB7F,KAAK0E,KAOiB,eAArB1E,KAAKiF,YACP/E,EAAAF,KAAIyD,GAAA,IAAA0C,IAAgB9F,KAApBL,MAEAE,EAAAF,KAAIyD,GAAA,IAAA2C,IAAY/F,KAAhBL,MAT2C,gBAAxCE,EAAAF,KAAIqE,GAAA,MAAcrE,KAAKiF,aAC1B/E,EAAAF,KAAIyD,GAAA,IAAA4C,IAAiBhG,KAArBL,MAEAE,EAAAF,KAAIyD,GAAA,IAAA6C,IAAajG,KAAjBL,MAUR,CAGmBc,MAAAA,GACjB,OAAOC,CAAI,0DAGCwF,EAAUvG,KAAK0E,KAAO,cAAWc,mBAC3Be,EAAUvG,KAAK0E,KAAO,YAASc,wBAC1Be,EAAUvG,KAAK0E,KAAO,cAAWc,4CAGxCtF,EAAAF,KAAIyD,GAAA,IAAA+C,oCAEcxG,KAAK0E,qEAG3BxE,EAAAF,KAAIyD,GAAA,IAAAgD,IAAwBpG,KAA5BL,SACAA,KAAK0E,KACH3D,CAAI,mDACJA,CAAI,oGACuCb,EAAAF,KAAIyD,GAAA,IAAAiD,eACjDxG,EAAAF,KAAIyD,GAAA,IAAAkD,IAAmBtG,KAAvBL,SACAA,KAAK0E,KACH3D,CAAI,qDACJA,CAAI,wLAWpB,CAqLQiE,kBAAAA,CAAmBD,GACpBA,GAAgC,WAArB/E,KAAKiF,cACnBjF,KAAKQ,QACLR,KAAK0E,MAAO,EAEhB,qMAtLE,OAAK1E,KAAK0E,MAAQ1E,KAAK4E,eAAuBtD,EACvCP,CAAI,oCAAoCf,KAAK0E,KAAOxE,EAAAF,KAAIyD,GAAA,IAAAmD,SAAJ5G,MAA2BE,EAAAF,KAAIyD,GAAA,IAAAoD,IAAYxG,KAAhBL,aACxF,gBAIE,OAAOe,CAAI,qXAOb,gBAIE,OAAOA,CAAI,6DAGKf,KAAK2E,uBACTzE,EAAAF,KAAIyD,GAAA,IAAAqD,qGAIa,WAArB9G,KAAKiF,YACH8B,CAAG,+EACHA,CAAG,oGAIf,gBAIE,OAAOhG,CAAI,8DAGKf,KAAK0E,OAAS1E,KAAKoE,WAAapE,KAAK2E,WAAa3E,KAAKO,uBAC3DL,EAAAF,KAAIyD,GAAA,IAAAuD,gPAQlB,gBAIE5E,EAAApC,KAAIuE,GAAwB0C,EAAsBC,QAAQ,CAACC,EAAWC,QAAU7F,IAC9E,MAAM0D,EAAcjF,KAAKiF,YACzBjF,KAAKkF,MAAQ3D,EAAQwE,IAAIoB,EAAWC,QAAU,aAAe,SACzDnC,IAAgBjF,KAAKkF,OAASlF,KAAK0E,OACrC1E,KAAK0E,MAAO,GAEdxE,EAAAF,KAAIyD,GAAA,IAAAuC,IAAY3F,KAAhBL,YAEJ,cAGuByB,GACrB,MAAMI,EAASJ,EAAEG,OACdE,iBAAiB,CAAEC,SAAS,IAC5BC,KAAMC,GAAMA,aAAaC,kBAExBL,GAAS3B,EAAAF,KAAIsD,GAAA,OACfpD,EAAAF,KAAIsD,GAAA,MAASnB,oBAAoB,QAASjC,EAAAF,KAAIwD,GAAA,MAC9CtD,EAAAF,KAAIsD,GAAA,MAASnB,oBAAoB,QAASjC,EAAAF,KAAI2D,GAAA,MAC9CzD,EAAAF,KAAIsD,GAAA,MAASnB,oBAAoB,UAAWjC,EAAAF,KAAI6D,GAAA,MAChD3D,EAAAF,KAAIsD,GAAA,MAASnB,oBAAoB,cAAejC,EAAAF,KAAI8D,GAAA,MAEpD1B,EAAApC,KAAIsD,GAAUzB,EAAK,KAEnB3B,EAAAF,KAAIsD,GAAA,MAASjB,iBAAiB,QAASnC,EAAAF,KAAIwD,GAAA,MAC3CtD,EAAAF,KAAIsD,GAAA,MAASjB,iBAAiB,QAASnC,EAAAF,KAAI2D,GAAA,MAC3CzD,EAAAF,KAAIsD,GAAA,MAASjB,iBAAiB,UAAWnC,EAAAF,KAAI6D,GAAA,MAC7C3D,EAAAF,KAAIsD,GAAA,MAASjB,iBAAiB,cAAenC,EAAAF,KAAI8D,GAAA,MAE7C5D,EAAAF,KAAIsD,GAAA,OACNpD,EAAAF,KAAIsD,GAAA,KAAQhB,KAAOpC,EAAAF,KAAIsD,GAAA,KAAQhB,MAAQ,YACvCpC,EAAAF,KAAIsD,GAAA,KAAQf,UAAYrC,EAAAF,KAAIsD,GAAA,KAAQf,WAAa,SACjDrC,EAAAF,KAAIsD,GAAA,KAAQd,KAAO,OACnBtC,EAAAF,KAAIsD,GAAA,KAAQ+D,aAAe,UAG7BnH,EAAAF,KAAIyD,GAAA,IAAA0B,IAAsB9E,KAA1BL,MAEJ,gBAIEE,EAAAF,KAAIyD,GAAA,IAAA0B,IAAsB9E,KAA1BL,MACIA,KAAK0E,KACP1E,KAAKU,cACH,IAAI0E,YAAwC,QAAS,CACnDC,OAAQ,CAAEC,KAAMpF,EAAAF,KAAIsD,GAAA,MAAS7C,OAAS,IACtCG,SAAS,EACTC,UAAU,KAIdb,KAAK0E,MAAO,CAEhB,gBAIEhD,EAAe1B,KAAM,cAAoC,eAArBA,KAAKiF,aACzCvD,EAAe1B,KAAM,UAAgC,WAArBA,KAAKiF,YACvC,gBAIEjF,KAAKoE,YAAclE,EAAAF,KAAIsD,GAAA,MAAS7C,OAAS,IAAIgC,OAAS,EACtDf,EAAe1B,KAAM,aAAcA,KAAKoE,WAC1C,gBAIEpE,KAAK0E,MAAQxE,EAAAF,aACboC,EAAApC,KAAIuD,IAAsB,EAAK,IACjC,gBAIOrD,EAAAF,KAAIsD,GAAA,OACLpD,EAAAF,KAAIsD,GAAA,KAAQ7C,OACdT,KAAKQ,QAEP4B,EAAApC,KAAIuD,IAAsB,EAAI,KAC9BrD,EAAAF,KAAIsD,GAAA,MAAS9B,QACf,gBAIOtB,EAAAF,KAAIsD,GAAA,OACLpD,EAAAF,KAAIsD,GAAA,KAAQ7C,MACdT,KAAKQ,QAEL4B,EAAApC,KAAIuD,IAAsB,EAAI,KAEhCrD,EAAAF,KAAIsD,GAAA,MAAS9B,QACf,iBAIOxB,KAAK0E,MAAQxE,EAAAF,KAAIsD,GAAA,MAAS/B,QAAQ,YACrCvB,KAAK0E,MAAO,EAEhB,cAGoBjD,GAClB,GAAIzB,KAAK0E,MAAkB,WAAVjD,EAAE6F,MAAqB7F,EAAE8F,WAAa9F,EAAE+F,QAAS,CAChE/F,EAAEgG,iBAEYhG,EAAEG,OACNnB,OACRT,KAAKQ,QAGPR,KAAK0E,MAAO,CACd,CACF,cAGejD,IACTzB,KAAK0E,MAAkB,WAAVjD,EAAE6F,KAAqB7F,EAAE8F,UAAa9F,EAAE+F,UACvD/F,EAAEgG,iBACFvH,EAAAF,KAAIyD,GAAA,IAAAqD,IAAkBzG,KAAtBL,MAEJ,KAYA0H,iBACE,IACG1H,KAAKU,cACJ,IAAIiH,YAAY,eAAgB,CAC9BC,SAAU,SACVC,SAAU,OACVjH,SAAS,EACTC,UAAU,EACViH,YAAY,KAKhB,YADA9H,KAAK0E,MAAO,GAIdtC,EAAApC,KAAIqE,GAAarE,KAAKiF,iBACtB,MAAM8C,EAAO/H,KAAKgI,MAElB9H,EAAAF,KAAIsE,GAAA,MAAiBjE,KAArBL,MACAoC,EAAApC,KAAIsE,SAAwB2D,EAC1BF,EACA/H,KAAKkI,QACL,CACEC,SAAU,UAEZ,CAAClG,EAAGmG,KACF,MAAML,EAAO/H,KAAKgI,MAClBD,EAAKM,MAAMC,IAASF,EAAIpI,KAAKkI,QAAQK,aAApB,KACjBR,EAAKM,MAAMG,MAAQ,GAAGxI,KAAKkI,QAAQO,gBAED,QAA9BC,EAAkBC,SACpBZ,EAAKM,MAAMO,MAAWC,OAAOC,WAAa7G,EAAIjC,KAAKyI,YAAhC,KACnBV,EAAKM,MAAMU,KAAO,KAElBhB,EAAKM,MAAMU,KAAO,GAAG9G,MACrB8F,EAAKM,MAAMO,MAAQ,WAKzB5I,KAAKkI,QAAQG,MAAMF,SAAW,WAC9BJ,EAAKiB,QAAU,SACfjB,EAAKM,MAAMF,SAAW,WACtBJ,EAAKkB,cACL/I,EAAAF,KAAIgE,GAAA,KAAuBkF,OAC3BhJ,EAAAF,KAAIkE,GAAA,KAAkBgF,OAEtBlJ,KAAKU,cACH,IAAIiH,YAAY,SAAU,CACxBC,SAAU,SACVC,SAAU,OACVjH,SAAS,EACTC,UAAU,KAIdb,KAAKU,cACH,IAAI0E,YAAwC,QAAS,CACnDC,OAAQ,CAAEC,KAAMpF,EAAAF,KAAIsD,GAAA,MAAS7C,OAAS,IACtCG,SAAS,EACTC,UAAU,IAGhB,gBAIE,MAAMkH,EAAO/H,KAAKgI,MACG,WAAjBD,EAAKiB,UAENhJ,KAAKU,cACJ,IAAIiH,YAAY,eAAgB,CAC9BC,SAAU,OACVC,SAAU,SACVjH,SAAS,EACTC,UAAU,EACViH,YAAY,MAQlB1F,EAAApC,KAAIqE,QAAamB,EAAS,KAC1BtF,EAAAF,KAAIgE,GAAA,KAAuBmF,SAC3BjJ,EAAAF,KAAIkE,GAAA,KAAkBiF,SAElBC,IACFlJ,EAAAF,KAAIyD,GAAA,IAAA4F,IAAYhJ,KAAhBL,OAEA+H,EAAKuB,UAAUC,IAAI,WACnBxB,EAAK1F,iBAAiB,gBAAiB,IAAMnC,EAAAF,gBAAgBK,KAAhBL,MAAoB,CAAEwJ,MAAM,MAZzExJ,KAAK0E,MAAO,EAchB,gBAIExE,EAAAF,KAAIsE,GAAA,MAAiBjE,KAArBL,MACAoC,EAAApC,KAAIsE,QAAkBkB,EAAS,KAE/B,MAAMuC,EAAO/H,KAAKgI,MAClBD,EAAKuB,UAAUG,OAAO,WACtB1B,EAAKM,MAAMF,SAAW,GACtBJ,EAAKM,MAAMG,MAAQ,GACnBT,EAAKM,MAAMC,IAAM,GACjBP,EAAKM,MAAMU,KAAO,GAClBhB,EAAKM,MAAMO,MAAQ,GACnBb,EAAK2B,cACL3B,EAAKiB,QAAU,KACfhJ,KAAKkI,QAAQG,MAAMF,SAAW,GAE9BnI,KAAKU,cACH,IAAIiH,YAAY,SAAU,CACxBC,SAAU,OACVC,SAAU,SACVjH,SAAS,EACTC,UAAU,IAGhB,KAGA6G,iBACE,IACG1H,KAAKU,cACJ,IAAIiH,YAAY,eAAgB,CAC9BC,SAAU,SACVC,SAAU,OACVjH,SAAS,EACTC,UAAU,EACViH,YAAY,KAKhB,YADA9H,KAAK0E,MAAO,GAIdtC,EAAApC,KAAIqE,GAAarE,KAAKiF,iBACtB/E,EAAAF,KAAIgE,GAAA,KAAuBkF,OAC3BhJ,EAAAF,KAAIkE,GAAA,KAAkBgF,OAEtB,MAAMnB,EAAO/H,KAAKgI,MAGlB,GAFA9H,EAAAF,KAAIsE,GAAA,MAAiBjE,KAArBL,MAEKoJ,IAyBHrB,EAAKM,MAAMF,SAAW,QACtBJ,EAAKiB,QAAU,SACfjB,EAAKkB,cACLjJ,KAAKkI,QAAQG,MAAMF,SAAW,eA5BH,CAC3B,MAAMwB,EAAO5B,EAAK6B,wBACZC,EAA4C,QAA9BnB,EAAkBC,QAAoBE,OAAOC,WAAaa,EAAKf,MAAQe,EAAKZ,KAEhGhB,EAAKM,MAAMF,SAAW,QACtBJ,EAAKiB,QAAU,SACfjB,EAAKkB,cACLjJ,KAAKkI,QAAQG,MAAMF,SAAW,WAE9BJ,EAAK+B,QACH,CACE,CACEC,UAAW,cAAcF,OACzBrB,MAAO,GAAGmB,EAAKnB,UACfF,IAAK,GAAGqB,EAAKrB,QACb0B,OAAQ,GAAGL,EAAKK,YAElB,CAAED,UAAW,kBAAmBvB,MAAO,QAASF,IAAK,MAAO0B,OAAQ,UAEtE,CACE9K,SAAU,IACVE,OAAQ,kCAGd,CAOAY,KAAKU,cACH,IAAIiH,YAAY,SAAU,CACxBC,SAAU,SACVC,SAAU,OACVjH,SAAS,EACTC,UAAU,KAIdb,KAAKU,cACH,IAAI0E,YAAwC,QAAS,CACnDC,OAAQ,CAAEC,KAAMpF,EAAAF,KAAIsD,GAAA,MAAS7C,OAAS,IACtCG,SAAS,EACTC,UAAU,IAGhB,KAGA6G,iBACE,MAAMK,EAAO/H,KAAKgI,MAClB,GAAqB,WAAjBD,EAAKiB,QAAsB,OAE/B,IACGhJ,KAAKU,cACJ,IAAIiH,YAAY,eAAgB,CAC9BC,SAAU,OACVC,SAAU,SACVjH,SAAS,EACTC,UAAU,EACViH,YAAY,KAKhB,YADA9H,KAAK0E,MAAO,GAIdtC,EAAApC,KAAIqE,QAAamB,EAAS,KAC1BtF,EAAAF,KAAIgE,GAAA,KAAuBmF,SAC3BjJ,EAAAF,KAAIkE,GAAA,KAAkBiF,SAEtB,MAAMc,EAASjK,KAAKkI,QAEpB,IAAKkB,IAAwB,CAC3B,MAAMc,EAAQnC,EAAK6B,wBACbO,EAAMF,EAAOL,wBAEbC,EAA4C,QAA9BnB,EAAkBC,QAAoBE,OAAOC,WAAaoB,EAAMtB,MAAQsB,EAAMnB,KAC5FqB,EAA0C,QAA9B1B,EAAkBC,QAAoBE,OAAOC,WAAaqB,EAAIvB,MAAQuB,EAAIpB,KACtFsB,EAAmC,QAA9B3B,EAAkBC,QAAoBkB,EAAcO,EAAYA,EAAYP,EAEvF9B,EAAKuB,UAAUC,IAAI,iBACbxB,EAAK+B,QACT,CACE,CACEC,UAAW,kBACXvB,MAAO,GAAG0B,EAAM1B,UAChBF,IAAK,GAAG4B,EAAM5B,QACd0B,OAAQ,GAAGE,EAAMF,YAEnB,CACED,UAAW,cAAcM,OACzB7B,MAAO,GAAG2B,EAAI3B,UACdF,IAAK,GAAG6B,EAAI7B,QACZ0B,OAAQ,GAAGG,EAAIH,aAGnB,CACE9K,SAAU,IACVE,OAAQ,mCAEVkL,QACJ,CAEAvC,EAAK2B,cACL3B,EAAKM,MAAMF,SAAW,GACtBJ,EAAKiB,QAAU,KACfjB,EAAKuB,UAAUG,OAAO,WACtBQ,EAAO5B,MAAMF,SAAW,GAExBnI,KAAKU,cACH,IAAIiH,YAAY,SAAU,CACxBC,SAAU,OACVC,SAAU,SACVjH,SAAS,EACTC,UAAU,IAGhB,EAroBE6B,EAAmB3D,IAILoE,GAAAR,OAAS3D,GAYQ4D,EAAA,CAAhB2H,KAAmCpH,GAAAH,UAAA,qBACnBJ,EAAA,CAAhB2H,KAAwDpH,GAAAH,UAAA,gBAKtBJ,EAAA,CAAlC4H,EAAM,YAAkDrH,GAAAH,UAAA,kBACxBJ,EAAA,CAAhC4H,EAAM,UAA8CrH,GAAAH,UAAA,gBAczBJ,EAAA,CAA3CC,EAAS,CAAEL,KAAMM,QAASC,SAAS,KAA0BI,GAAAH,UAAA,iBAAA,GAMjCJ,EAAA,CAA5BC,EAAS,CAAEE,SAAS,KAAwCI,GAAAH,UAAA,YAAA,GAMjBJ,EAAA,CAA3CC,EAAS,CAAEL,KAAMM,QAASC,SAAS,KAAqBI,GAAAH,UAAA,YAAA,GAMjBJ,EAAA,CAAvCC,EAAS,CAAEI,UAAW,iBAAsCE,GAAAH,UAAA,kBAAA,GAMrBJ,EAAA,CAAvCC,EAAS,CAAEI,UAAW,iBAAsCE,GAAAH,UAAA,kBAAA,GAMDJ,EAAA,CAA3DC,EAAS,CAAEI,UAAW,mBAAoBT,KAAMM,WAAkCK,GAAAH,UAAA,sBAAA,GA+S3EJ,EAAA,CADP6H,EAAS,KAMTtH,GAAAH,UAAA,qBAAA,MA7XUG,GAAoBP,EAAA,CADhCM,EAAc,oBACFC"}
|
package/dist/segmented-button.js
CHANGED
|
@@ -56,8 +56,8 @@ var M3eButtonSegmentElement_1;
|
|
|
56
56
|
* @fires click - Emitted when the element is clicked.
|
|
57
57
|
*
|
|
58
58
|
* @cssprop --m3e-segmented-button-height - Total height of the segmented button.
|
|
59
|
-
* @cssprop --m3e-segmented-button-outline-thickness - Thickness of the button
|
|
60
|
-
* @cssprop --m3e-segmented-button-outline-color - Color of the button
|
|
59
|
+
* @cssprop --m3e-segmented-button-outline-thickness - Thickness of the button's border.
|
|
60
|
+
* @cssprop --m3e-segmented-button-outline-color - Color of the button's border.
|
|
61
61
|
* @cssprop --m3e-segmented-button-padding-start - Padding on the leading edge of the button content.
|
|
62
62
|
* @cssprop --m3e-segmented-button-padding-end - Padding on the trailing edge of the button content.
|
|
63
63
|
* @cssprop --m3e-segmented-button-spacing - Horizontal gap between icon and label.
|