@api-client/ui 0.3.1 → 0.3.3
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/build/src/elements/environment/EnvironmentEditor.d.ts.map +1 -1
- package/build/src/elements/environment/EnvironmentEditor.js +8 -6
- package/build/src/elements/environment/EnvironmentEditor.js.map +1 -1
- package/build/src/elements/har/HarViewer.d.ts.map +1 -1
- package/build/src/elements/har/HarViewer.js +13 -15
- package/build/src/elements/har/HarViewer.js.map +1 -1
- package/build/src/elements/http/RequestEditor.d.ts +2 -1
- package/build/src/elements/http/RequestEditor.d.ts.map +1 -1
- package/build/src/elements/http/RequestEditor.js +17 -12
- package/build/src/elements/http/RequestEditor.js.map +1 -1
- package/build/src/elements/http/RequestLog.d.ts.map +1 -1
- package/build/src/elements/http/RequestLog.js +34 -8
- package/build/src/elements/http/RequestLog.js.map +1 -1
- package/build/src/md/button/internals/button.styles.js +4 -4
- package/build/src/md/button/internals/button.styles.js.map +1 -1
- package/build/src/md/motion/animation.d.ts +5 -3
- package/build/src/md/motion/animation.d.ts.map +1 -1
- package/build/src/md/motion/animation.js +4 -2
- package/build/src/md/motion/animation.js.map +1 -1
- package/build/src/md/ripple/internals/ripple.styles.d.ts.map +1 -1
- package/build/src/md/ripple/internals/ripple.styles.js +20 -8
- package/build/src/md/ripple/internals/ripple.styles.js.map +1 -1
- package/build/src/md/tabs/internals/Tab.d.ts +25 -9
- package/build/src/md/tabs/internals/Tab.d.ts.map +1 -1
- package/build/src/md/tabs/internals/Tab.js +122 -53
- package/build/src/md/tabs/internals/Tab.js.map +1 -1
- package/build/src/md/tabs/internals/Tab.styles.d.ts.map +1 -1
- package/build/src/md/tabs/internals/Tab.styles.js +69 -64
- package/build/src/md/tabs/internals/Tab.styles.js.map +1 -1
- package/build/src/md/tabs/internals/Tabs.d.ts +52 -54
- package/build/src/md/tabs/internals/Tabs.d.ts.map +1 -1
- package/build/src/md/tabs/internals/Tabs.js +270 -330
- package/build/src/md/tabs/internals/Tabs.js.map +1 -1
- package/build/src/md/tabs/internals/Tabs.styles.d.ts.map +1 -1
- package/build/src/md/tabs/internals/Tabs.styles.js +13 -17
- package/build/src/md/tabs/internals/Tabs.styles.js.map +1 -1
- package/build/src/md/text-field/internals/common.styles.d.ts.map +1 -1
- package/build/src/md/text-field/internals/common.styles.js +0 -3
- package/build/src/md/text-field/internals/common.styles.js.map +1 -1
- package/build/src/styles/m3/native.css +270 -0
- package/build/src/styles/m3/theme.css +155 -0
- package/build/src/styles/m3/tokens.css +512 -0
- package/demo/md/tabs/tabs.html +19 -0
- package/demo/md/tabs/tabs.ts +133 -83
- package/package.json +20 -4
- package/scripts/copy-assets.js +21 -0
- package/src/elements/environment/EnvironmentEditor.ts +8 -6
- package/src/elements/har/HarViewer.ts +13 -15
- package/src/elements/http/RequestEditor.ts +18 -13
- package/src/elements/http/RequestLog.ts +34 -8
- package/src/md/button/internals/button.styles.ts +4 -4
- package/src/md/motion/animation.ts +4 -2
- package/src/md/ripple/internals/ripple.styles.ts +20 -8
- package/src/md/tabs/internals/Tab.styles.ts +69 -64
- package/src/md/tabs/internals/Tab.ts +126 -43
- package/src/md/tabs/internals/Tabs.styles.ts +13 -17
- package/src/md/tabs/internals/Tabs.ts +259 -305
- package/src/md/text-field/internals/common.styles.ts +0 -3
- package/test/elements/har/HarViewerElement.test.ts +1 -55
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, queryAssignedElements, state } from 'lit/decorators.js'\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js'\nimport { Easing } from '../../motion/animation.js'\nimport UiTab from './Tab.js'\nimport '../../icon-button/ui-icon-button.js'\nimport '../../divider/ui-divider.js'\nimport '../../icons/ui-icon.js'\n\nexport type TabsPriority = 'primary' | 'secondary'\n\nexport interface TabSelectionDetail {\n item: UiTab\n index: number\n select: string | null\n}\n\n/**\n * Calculates value in percentages\n * @param w Element width\n * @param w0 Parent width\n * @return The percentage of element's width relative to parent.\n */\nexport function calcPercent(w: number, w0: number): number {\n return (100 * w) / w0\n}\n\n/**\n * A container for tabs.\n *\n * @fires select - A non bubbling event when selection change through user interaction.\n * The `event.detail` object contains the `item` and `index` properties.\n * It also has the `select` property with the value of the `selectedAttribute` on the tab.\n */\nexport default class UiTabs extends LitElement {\n items: UiTab[] = []\n\n activeItem: UiTab | null = null\n\n previousItem: UiTab | null = null\n\n @queryAssignedElements({ flatten: true })\n protected accessor assignedElements!: HTMLElement[]\n\n @query('.pointer') protected accessor pointer!: HTMLElement\n\n @query('.content') protected accessor content!: HTMLElement\n\n /**\n * The priority of the tabs.\n *\n * @default primary\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor priority: TabsPriority = 'primary'\n\n /**\n * If true, tabs are scrollable and the tab width is based on the label width.\n * @attribute\n */\n @property({ type: Boolean }) accessor scrollable: boolean | undefined\n\n /**\n * The value of the selected tab.\n * This is matched with the `aria-controls` of the tab.\n * @attribute\n */\n @property({ type: String }) accessor selected: string | undefined\n\n /**\n * The attribute on the `ui-tab` that indicates which value for `selected`\n * corresponds to which tab.\n *\n * @default aria-controls\n * @attribute\n */\n @property({ type: String }) accessor selectedAttribute = `aria-controls`\n\n @state() protected accessor pointerStyles: StyleInfo | undefined\n\n protected contentScroll?: number\n\n @state() protected accessor indicated = false\n\n protected observer: IntersectionObserver\n\n /**\n * This is set by the intersection observer. Once the tabs are in the view it turns to `true`.\n * This we can properly visualize selection.\n */\n @state() accessor isVisible: boolean | undefined\n\n constructor() {\n super()\n\n this.observer = new IntersectionObserver(this.intersectionCallback.bind(this), {\n threshold: 1.0,\n rootMargin: '0px',\n })\n }\n\n protected override willUpdate(cp: PropertyValues<this>): void {\n if (cp.has('isVisible')) {\n this.handleVisibility()\n }\n super.willUpdate(cp)\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'tablist')\n }\n this.observer.observe(this)\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback()\n this.observer.unobserve(this)\n }\n\n protected intersectionCallback(entries: IntersectionObserverEntry[]): void {\n const [entry] = entries\n this.isVisible = entry.isIntersecting\n }\n\n protected async updateItems(): Promise<void> {\n const elements = this.assignedElements || []\n const items = elements.filter(this.isTabItem, this)\n this.items = items\n if (this.activeItem && !items.includes(this.activeItem)) {\n this.activeItem = null\n }\n await this.updateComplete\n this.ensureSelection()\n }\n\n /**\n * @return Whether the given element is a list item element.\n */\n protected isTabItem(element: Element): element is UiTab {\n if (element.nodeType !== Node.ELEMENT_NODE) {\n return false\n }\n return element.localName === 'ui-tab'\n }\n\n protected isSelectable(element: UiTab): boolean {\n if (element.disabled) {\n return false\n }\n if (element.hidden && element.hasAttribute('hidden')) {\n return false\n }\n return true\n }\n\n protected ensureSelection(): void {\n const { selected, selectedAttribute, activeItem, items } = this\n if (!selectedAttribute) {\n return\n }\n const item = items.find((i) => i.getAttribute(selectedAttribute) === selected)\n if (item && item === activeItem) {\n return\n }\n this.makeSelection(item)\n }\n\n protected makeSelection(tab?: UiTab, focus = false): void {\n const { activeItem } = this\n if (activeItem === tab) {\n tab.highlight()\n return\n }\n this.previousItem = activeItem\n if (activeItem) {\n this.deselectItem(activeItem)\n }\n if (tab) {\n this.selectItem(tab, focus)\n this.positionPointer(tab, activeItem)\n if (this.activeItem) {\n // we set this here so we won't notify selection when initializing.\n this.notifySelect(tab)\n }\n }\n }\n\n notifySelect(item: UiTab): void {\n const index = this.items.indexOf(item)\n if (index === -1) {\n return\n }\n const attrValue = item.getAttribute(this.selectedAttribute)\n this.dispatchEvent(\n new CustomEvent<TabSelectionDetail>('select', {\n detail: {\n item,\n index,\n select: attrValue,\n },\n })\n )\n }\n\n protected selectItem(tab: UiTab, focus = false): void {\n this.activeItem = tab\n if (this.hasAttribute('tabindex')) {\n this.removeAttribute('tabindex')\n }\n tab.setAttribute('aria-selected', 'true')\n tab.setAttribute('tabindex', '0')\n tab.selected = true\n tab.priority = this.priority\n tab.scrollIntoView({ inline: 'nearest', behavior: 'auto', block: 'nearest' })\n if (focus) {\n tab.focus()\n }\n }\n\n protected deselectItem(tab: UiTab): void {\n tab.setAttribute('aria-selected', 'false')\n tab.setAttribute('tabindex', '-1')\n tab.selected = false\n tab.indicated = false\n }\n\n protected handleVisibility(): void {\n const { previousItem, activeItem } = this\n if (!activeItem) {\n return\n }\n this.positionPointer(activeItem, previousItem)\n }\n\n protected async positionPointer(tab: UiTab, old?: UiTab | null): Promise<void> {\n const { items, pointer, isVisible } = this\n if (!isVisible) {\n return\n }\n const index = items.indexOf(tab)\n if (index < 0 || !pointer) {\n this.pointerStyles = undefined\n return\n }\n\n if (!old) {\n // no start animation, just show indicator.\n tab.indicated = true\n return\n }\n const isPrimary = this.priority === 'primary'\n const final = isPrimary ? this.getPrimaryLeft(tab) : this.getSecondaryLeft(tab)\n if (this.pointerStyles && this.pointerStyles.left === `${final}px`) {\n return\n }\n\n // first position this indicator in the place of the old one.\n // update the view and then run the animation.\n this.indicated = true\n const left = isPrimary ? this.getPrimaryLeft(old) : this.getSecondaryLeft(old)\n this.pointerStyles = { left }\n await this.updateComplete\n const frames = isPrimary ? this.getPrimaryKeyframes(left, final) : this.getSecondaryKeyframes(left, final)\n\n if (this.moveAnimation) {\n this.moveAnimation.cancel()\n }\n const moveAnimation = pointer.animate(frames, {\n duration: 360,\n iterations: 1,\n easing: Easing.DECELERATION,\n })\n const finalStyles: StyleInfo = {\n left: `${final}px`,\n }\n moveAnimation.addEventListener('finish', () => {\n this.pointerStyles = finalStyles\n this.moveAnimation = undefined\n tab.indicated = true\n this.indicated = false\n })\n moveAnimation.addEventListener('cancel', () => {\n this.pointerStyles = finalStyles\n })\n this.moveAnimation = moveAnimation\n }\n\n protected moveAnimation?: Animation\n\n protected getPrimaryLeft(tab: UiTab): string {\n const contentBox = this.content.getBoundingClientRect()\n const tabRect = tab.getBoundingClientRect()\n const leftFromParent = tabRect.x - contentBox.x\n const offset = this.scrollable ? 48 : 0 // left button\n const left = leftFromParent + tabRect.width / 2 - 20 + offset\n return `${left}px`\n }\n\n protected getSecondaryLeft(tab: UiTab): string {\n const contentBox = this.content.getBoundingClientRect()\n const tabRect = tab.getBoundingClientRect()\n const offset = this.scrollable ? 48 : 0 // left button\n const leftFromParent = tabRect.x - contentBox.x + offset\n return `${leftFromParent}px`\n }\n\n protected getPrimaryKeyframes(start: string, final: string): Keyframe[] {\n return [\n {\n left: start,\n width: `40px`,\n },\n {\n width: `80px`,\n },\n {\n left: final,\n width: `40px`,\n },\n ]\n }\n\n protected getSecondaryKeyframes(start: string, final: string): Keyframe[] {\n return [\n {\n left: start,\n },\n {\n left: final,\n },\n ]\n }\n\n protected contentClickHandler(e: PointerEvent): void {\n this.activateFromEvent(e)\n }\n\n protected contentKeyDownHandler(e: KeyboardEvent): void {\n if (['Enter', 'Space'].includes(e.code)) {\n this.activateFromEvent(e)\n }\n }\n\n protected activateFromEvent(e: Event): void {\n const { items } = this\n const path = e.composedPath()\n let item: UiTab | undefined\n while (!item) {\n const next = path.shift() as UiTab\n if (!next) {\n break\n }\n if (items.includes(next)) {\n item = next\n }\n }\n if (!item) {\n return\n }\n this.makeSelection(item, true)\n }\n\n protected handleScrollLeft(): void {\n const { contentScroll = 0, content } = this\n if (contentScroll === 0) {\n return\n }\n let left = contentScroll - 80\n if (left < 0) {\n left = 0\n }\n this.contentScroll = left\n content.scrollTo({\n behavior: 'smooth',\n left,\n })\n }\n\n protected handleScrollRight(): void {\n const { contentScroll = 0, content } = this\n let left = contentScroll + 80\n if (left + content.clientWidth > content.scrollWidth) {\n left = content.scrollWidth - content.clientWidth\n }\n this.contentScroll = left\n content.scrollTo({\n behavior: 'smooth',\n left,\n })\n }\n\n protected handleScroll(e: Event): void {\n const div = e.target as HTMLElement\n this.contentScroll = div.scrollLeft\n }\n\n protected handleKeyDown(e: KeyboardEvent): void {\n if (e.code === 'ArrowRight') {\n e.preventDefault()\n const tab = this.activeItem ? this.getNextItem(this.activeItem) : this.items[0]\n this.makeSelection(tab, true)\n } else if (e.code === 'ArrowLeft') {\n e.preventDefault()\n const tab = this.activeItem ? this.getPreviousItem(this.activeItem) : this.items[0]\n this.makeSelection(tab, true)\n }\n }\n\n getPreviousItem(item: UiTab): UiTab {\n const { items } = this\n const curIndex = items.indexOf(item)\n if (curIndex < 0) {\n return item\n }\n let i = curIndex\n let result: HTMLElement | undefined\n do {\n i--\n if (i === curIndex) {\n // looped back from the end, no active element to find.\n return item\n }\n const tmp = items[i]\n if (!tmp) {\n i = items.length\n continue\n }\n if (this.isSelectable(tmp)) {\n result = tmp\n }\n } while (!result)\n return (result as UiTab) || item\n }\n\n getNextItem(item: UiTab): UiTab {\n const { items } = this\n const curIndex = items.indexOf(item)\n if (curIndex < 0) {\n return item\n }\n let i = curIndex\n let next: HTMLElement | undefined\n do {\n i++\n if (i === curIndex) {\n // looped back from the start, no active element to find.\n return item\n }\n const tmp = items[i]\n if (!tmp) {\n i = -1\n continue\n }\n if (this.isSelectable(tmp)) {\n next = tmp\n }\n } while (!next)\n return (next as UiTab) || item\n }\n\n override render(): TemplateResult {\n const classes: ClassInfo = {\n surface: true,\n scrollable: !!this.scrollable,\n }\n return html`\n <div class=\"${classMap(classes)}\">\n ${this.renderLeftScrollControl()}\n <div class=\"content\" @scroll=\"${this.handleScroll}\" @keydown=\"${this.handleKeyDown}\">${this.renderSlot()}</div>\n ${this.rightScrollControl()} ${this.renderIndicator()}\n <div class=\"divider\"></div>\n </div>\n `\n }\n\n protected renderSlot(): TemplateResult {\n return html`<slot\n @slotchange=\"${this.updateItems}\"\n @click=\"${this.contentClickHandler}\"\n @keydown=\"${this.contentKeyDownHandler}\"\n ></slot>`\n }\n\n protected renderIndicator(): TemplateResult {\n const classes: ClassInfo = {\n indicator: true,\n indicated: this.indicated,\n primary: this.priority === 'primary',\n secondary: this.priority === 'secondary',\n }\n return html`\n <div class=\"${classMap(classes)}\">\n <span role=\"presentation\" class=\"pointer\" style=\"${styleMap(this.pointerStyles || {})}\"></span>\n </div>\n `\n }\n\n protected renderLeftScrollControl(): TemplateResult | typeof nothing {\n if (!this.scrollable) {\n return nothing\n }\n return html` <div class=\"scroll-control left\">\n <ui-icon-button aria-label=\"Scroll tabs left\" title=\"Scroll tabs left\" @click=\"${this.handleScrollLeft}\">\n <ui-icon icon=\"chevronLeft\"></ui-icon>\n </ui-icon-button>\n </div>`\n }\n\n protected rightScrollControl(): TemplateResult | typeof nothing {\n if (!this.scrollable) {\n return nothing\n }\n return html`<div class=\"scroll-control right\">\n <ui-icon-button aria-label=\"Scroll tabs right\" title=\"Scroll tabs right\" @click=\"${this.handleScrollRight}\">\n <ui-icon icon=\"chevronRight\"></ui-icon>\n </ui-icon-button>\n </div>`\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, queryAssignedElements, state } from 'lit/decorators.js'\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js'\nimport { Easing } from '../../motion/animation.js'\nimport UiTab from './Tab.js'\nimport '../../icon-button/ui-icon-button.js'\nimport '../../divider/ui-divider.js'\nimport '../../icons/ui-icon.js'\n\nexport type TabsPriority = 'primary' | 'secondary'\n\nexport interface TabSelectionDetail {\n /**\n * The selected tab.\n */\n item: UiTab\n /**\n * The index of the selected tab.\n */\n index: number\n}\n\nexport interface SizingInfo {\n left: number\n width: number\n}\n\n/**\n * Calculates value in percentages\n * @param w Element width\n * @param w0 Parent width\n * @return The percentage of element's width relative to parent.\n */\nexport function calcPercent(w: number, w0: number): number {\n return (100 * w) / w0\n}\n\n/**\n * A container for tabs.\n *\n * @fires change - A non bubbling event when selection change through user interaction.\n */\nexport default class UiTabs extends LitElement {\n activeItem: UiTab | null = null\n\n previousItem: UiTab | null = null\n\n /**\n * The currently selected tab, `null` only when there are no tab children.\n */\n get activeTab(): UiTab | null {\n return this.tabs.find((tab) => tab.selected) ?? null\n }\n\n set activeTab(tab: UiTab | null) {\n // Ignore setting activeTab to null. As long as there are children, one tab\n // must be selected.\n if (tab) {\n this.activateTab(tab)\n }\n }\n\n /**\n * The index of the currently selected tab.\n */\n get activeTabIndex() {\n return this.tabs.findIndex((tab) => tab.selected)\n }\n\n /**\n * Sets the active tab by index.\n */\n set activeTabIndex(index) {\n const activateTabAtIndex = () => {\n const tab = this.tabs[index]\n // Ignore out-of-bound indices.\n if (tab) {\n this.activateTab(tab)\n }\n }\n if (!this.slotElement) {\n // This is needed to support setting the activeTabIndex via a lit property\n // binding.\n //\n // ```ts\n // html`\n // <md-tabs .activeTabIndex=${1}>\n // <md-tab>First</md-tab>\n // <md-tab>Second</md-tab>\n // </md-tabs>\n // `;\n // ```\n //\n // It's needed since lit's rendering lifecycle is asynchronous, and the\n // `<slot>` element hasn't rendered, so `tabs` is empty.\n this.updateComplete.then(activateTabAtIndex)\n return\n }\n activateTabAtIndex()\n }\n\n get focusedTab() {\n return this.tabs.find((tab) => tab.matches(':focus-within'))\n }\n\n @queryAssignedElements({ flatten: true, selector: 'ui-tab' }) private accessor tabs!: UiTab[]\n\n @query('.tabs') private accessor tabsScrollerElement!: HTMLElement\n @query('slot') private accessor slotElement!: HTMLSlotElement\n\n @query('.pointer') private accessor pointer!: HTMLElement\n\n /**\n * The priority of the tabs.\n *\n * @default primary\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor priority: TabsPriority = 'primary'\n\n @state() private accessor pointerStyles: StyleInfo | undefined\n\n @state() private accessor indicated = false\n\n private observer: IntersectionObserver\n\n /**\n * This is set by the intersection observer. Once the tabs are in the view it turns to `true`.\n * This we can properly visualize selection.\n */\n @state() accessor isVisible: boolean | undefined\n\n /**\n * Whether or not to automatically select a tab when it is focused.\n */\n @property({ type: Boolean }) accessor autoActivate = false\n\n private readonly internals = (this as HTMLElement).attachInternals()\n\n constructor() {\n super()\n this.internals.role = 'tablist'\n this.observer = new IntersectionObserver(this.intersectionCallback.bind(this), {\n threshold: 1.0,\n rootMargin: '0px',\n })\n this.addEventListener('keydown', this.handleKeydown.bind(this))\n this.addEventListener('keyup', this.handleKeyup.bind(this))\n this.addEventListener('focusout', this.handleFocusout.bind(this))\n }\n\n protected override willUpdate(cp: PropertyValues<this>): void {\n if (cp.has('isVisible')) {\n this.handleVisibility()\n }\n super.willUpdate(cp)\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n this.observer.observe(this)\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'tablist')\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback()\n this.observer.unobserve(this)\n }\n\n protected intersectionCallback(entries: IntersectionObserverEntry[]): void {\n const [entry] = entries\n this.isVisible = entry.isIntersecting\n }\n\n /**\n * Scrolls the toolbar, if overflowing, to the active tab, or the provided\n * tab.\n *\n * @param tabToScrollTo The tab that should be scrolled to. Defaults to the\n * active tab.\n * @return A Promise that resolves after the tab has been scrolled to.\n */\n async scrollToTab(tabToScrollTo?: UiTab | null) {\n await this.updateComplete\n const { tabs } = this\n tabToScrollTo ??= this.activeTab\n if (!tabToScrollTo || !tabs.includes(tabToScrollTo) || !this.tabsScrollerElement) {\n return\n }\n\n // wait for tabs to render.\n await Promise.all(tabs.map((tab) => tab.updateComplete))\n tabToScrollTo.scrollIntoView({\n block: 'nearest',\n inline: 'nearest',\n behavior: !this.focusedTab ? 'instant' : 'auto',\n })\n }\n\n protected handleVisibility(): void {\n const { previousItem, activeItem } = this\n if (!activeItem) {\n return\n }\n this.positionPointer(activeItem, previousItem)\n }\n\n protected async positionPointer(tab: UiTab, old?: UiTab | null): Promise<void> {\n const { pointer, isVisible } = this\n if (!isVisible) {\n tab.indicated = true\n return\n }\n const index = this.tabs.indexOf(tab)\n if (index < 0 || !pointer) {\n this.pointerStyles = undefined\n return\n }\n\n if (!old) {\n // no start animation, just show indicator.\n tab.indicated = true\n return\n }\n const isPrimary = this.priority === 'primary'\n const final = this.getTabSizing(tab)\n if (this.pointerStyles && this.pointerStyles.left === `${final.left}px`) {\n tab.indicated = true\n return\n }\n\n // first position this indicator in the place of the old one.\n // update the view and then run the animation.\n this.indicated = true\n const starting = this.getTabSizing(old)\n this.pointerStyles = { left: `${starting.left}px`, width: `${starting.width}px` }\n await this.updateComplete\n const frames = isPrimary ? this.getPrimaryKeyframes(starting, final) : this.getSecondaryKeyframes(starting, final)\n\n if (this.moveAnimation) {\n this.moveAnimation.cancel()\n }\n const moveAnimation = pointer.animate(frames, {\n duration: 200,\n iterations: 1,\n easing: Easing.EMPHASIZED_DECELERATE,\n })\n const finalStyles: StyleInfo = {\n left: `${final.left}px`,\n width: `${final.width}px`,\n }\n moveAnimation.addEventListener('finish', () => {\n this.pointerStyles = finalStyles\n this.moveAnimation = undefined\n tab.indicated = true\n this.indicated = false\n })\n moveAnimation.addEventListener('cancel', () => {\n this.pointerStyles = finalStyles\n })\n this.moveAnimation = moveAnimation\n }\n\n protected moveAnimation?: Animation\n\n protected getTabSizing(tab: UiTab): SizingInfo {\n const contentBox = this.tabsScrollerElement.getBoundingClientRect()\n const sizing = tab.getIndicatorSizing()\n sizing.left = sizing.left - contentBox.x\n return sizing\n }\n\n protected getPrimaryKeyframes(start: SizingInfo, final: SizingInfo): Keyframe[] {\n return [\n {\n left: `${start.left}px`,\n width: `${start.width}px`,\n },\n {\n left: `${final.left}px`,\n width: `${final.width}px`,\n },\n ]\n }\n\n protected getSecondaryKeyframes(start: SizingInfo, final: SizingInfo): Keyframe[] {\n return [\n {\n left: `${start.left}px`,\n width: `${start.width}px`,\n },\n {\n left: `${final.left}px`,\n width: `${final.width}px`,\n },\n ]\n }\n\n protected async handleTabClick(e: PointerEvent): Promise<void> {\n const tab = e.composedPath().find((el) => isTab(el)) as UiTab | undefined\n // Allow event to bubble\n await new Promise((resolve) => setTimeout(resolve, 0))\n if (e.defaultPrevented || !tab || tab.selected) {\n return\n }\n this.activateTab(tab)\n }\n\n private activateTab(activeTab: UiTab): void {\n const { tabs } = this\n const previousTab = this.activeTab\n if (!tabs.includes(activeTab) || previousTab === activeTab) {\n // Ignore setting activeTab to a tab element that is not a child.\n return\n }\n for (const tab of tabs) {\n tab.selected = tab === activeTab\n }\n if (previousTab) {\n // Don't dispatch a change event if activating a tab when no previous tabs\n // were selected, such as when md-tabs auto-selects the first tab.\n const detail: TabSelectionDetail = {\n item: activeTab,\n index: this.tabs.indexOf(activeTab),\n }\n const defaultPrevented = !this.dispatchEvent(\n new CustomEvent('change', { detail, bubbles: false, cancelable: true })\n )\n if (defaultPrevented) {\n for (const tab of tabs) {\n tab.selected = tab === previousTab\n }\n return\n }\n previousTab.indicated = false\n }\n activeTab.indicated = false\n this.positionPointer(activeTab, previousTab)\n this.updateFocusableTab(activeTab)\n this.scrollToTab(activeTab)\n }\n\n private updateFocusableTab(focusableTab: UiTab) {\n for (const tab of this.tabs) {\n tab.tabIndex = tab === focusableTab ? 0 : -1\n }\n }\n\n private async handleKeydown(event: KeyboardEvent) {\n // Allow event to bubble.\n await new Promise((resolve) => setTimeout(resolve, 0))\n const isLeft = event.key === 'ArrowLeft'\n const isRight = event.key === 'ArrowRight'\n const isHome = event.key === 'Home'\n const isEnd = event.key === 'End'\n // Ignore non-navigation keys\n if (event.defaultPrevented || (!isLeft && !isRight && !isHome && !isEnd)) {\n return\n }\n\n const { tabs } = this\n // Don't try to select another tab if there aren't any.\n if (tabs.length < 2) {\n return\n }\n\n // Prevent default interactions, such as scrolling.\n event.preventDefault()\n\n let indexToFocus: number\n if (isHome || isEnd) {\n indexToFocus = isHome ? 0 : tabs.length - 1\n } else {\n // Check if moving forwards or backwards\n const isRtl = getComputedStyle(this).direction === 'rtl'\n const forwards = isRtl ? isLeft : isRight\n const { focusedTab } = this\n if (!focusedTab) {\n // If there is not already a tab focused, select the first or last tab\n // based on the direction we're traveling.\n indexToFocus = forwards ? 0 : tabs.length - 1\n } else {\n const focusedIndex = this.tabs.indexOf(focusedTab)\n indexToFocus = forwards ? focusedIndex + 1 : focusedIndex - 1\n if (indexToFocus >= tabs.length) {\n // Return to start if moving past the last item.\n indexToFocus = 0\n } else if (indexToFocus < 0) {\n // Go to end if moving before the first item.\n indexToFocus = tabs.length - 1\n }\n }\n }\n\n const tabToFocus = tabs[indexToFocus]\n tabToFocus.focus()\n if (this.autoActivate) {\n this.activateTab(tabToFocus)\n } else {\n this.updateFocusableTab(tabToFocus)\n }\n }\n\n // scroll to item on keyup.\n private handleKeyup() {\n this.scrollToTab(this.focusedTab ?? this.activeTab)\n }\n\n private handleFocusout() {\n // restore focus to selected item when blurring the tab bar.\n if (this.matches(':focus-within')) {\n return\n }\n\n const { activeTab } = this\n if (activeTab) {\n this.updateFocusableTab(activeTab)\n }\n }\n\n private handleSlotChange() {\n for (const tab of this.tabs) {\n tab.priority = this.priority\n if (tab.selected) {\n tab.indicated = true\n }\n }\n const firstTab = this.tabs[0]\n if (!this.activeTab && firstTab) {\n // If the active tab was removed, auto-select the first one. There should\n // always be a selected tab while the bar has children.\n this.activateTab(firstTab)\n }\n\n // When children shift, ensure the active tab is visible. For example, if\n // many children are added before the active tab, it'd be pushed off screen.\n // This ensures it stays visible.\n this.scrollToTab(this.activeTab)\n if (this.activeTab) {\n this.updateFocusableTab(this.activeTab)\n }\n }\n\n override render(): TemplateResult {\n return html`\n <div class=\"tabs\">${this.renderSlot()}</div>\n ${this.renderIndicator()}\n <ui-divider class=\"divider\"></ui-divider>\n `\n }\n\n protected renderSlot(): TemplateResult {\n return html`<slot @slotchange=\"${this.handleSlotChange}\" @click=\"${this.handleTabClick}\"></slot>`\n }\n\n protected renderIndicator(): TemplateResult {\n const classes: ClassInfo = {\n indicator: true,\n indicated: this.indicated,\n primary: this.priority === 'primary',\n secondary: this.priority === 'secondary',\n }\n return html`\n <div class=\"${classMap(classes)}\">\n <span role=\"presentation\" class=\"pointer\" style=\"${styleMap(this.pointerStyles || {})}\"></span>\n </div>\n `\n }\n}\n\nfunction isTab(element: unknown): element is UiTab {\n return element instanceof UiTab\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.styles.ts"],"names":[],"mappings":";AAEA,
|
|
1
|
+
{"version":3,"file":"Tabs.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.styles.ts"],"names":[],"mappings":";AAEA,wBA+DC"}
|
|
@@ -2,30 +2,31 @@ import { css } from 'lit';
|
|
|
2
2
|
export default css `
|
|
3
3
|
:host {
|
|
4
4
|
display: block;
|
|
5
|
+
overflow: hidden;
|
|
6
|
+
box-sizing: border-box;
|
|
7
|
+
display: flex;
|
|
8
|
+
flex-direction: column;
|
|
9
|
+
position: relative;
|
|
5
10
|
}
|
|
6
11
|
|
|
7
|
-
.
|
|
12
|
+
.tabs {
|
|
8
13
|
display: flex;
|
|
9
14
|
align-items: center;
|
|
10
|
-
overflow:
|
|
15
|
+
overflow: auto;
|
|
16
|
+
scroll-behavior: smooth;
|
|
17
|
+
scrollbar-width: none;
|
|
11
18
|
flex: 1 1 0%;
|
|
19
|
+
align-self: stretch;
|
|
12
20
|
}
|
|
13
21
|
|
|
14
|
-
.
|
|
22
|
+
.tabs ::slotted(*) {
|
|
15
23
|
flex: 1;
|
|
16
24
|
white-space: nowrap;
|
|
17
25
|
}
|
|
18
26
|
|
|
19
|
-
.surface {
|
|
20
|
-
position: relative;
|
|
21
|
-
display: flex;
|
|
22
|
-
align-items: center;
|
|
23
|
-
/* background-color: var(--md-sys-color-surface); */
|
|
24
|
-
}
|
|
25
|
-
|
|
26
27
|
.indicator {
|
|
27
28
|
position: absolute;
|
|
28
|
-
bottom:
|
|
29
|
+
bottom: 1px;
|
|
29
30
|
left: 0px;
|
|
30
31
|
right: 0px;
|
|
31
32
|
overflow: hidden;
|
|
@@ -58,13 +59,8 @@ export default css `
|
|
|
58
59
|
}
|
|
59
60
|
|
|
60
61
|
.divider {
|
|
61
|
-
|
|
62
|
-
bottom: 0px;
|
|
63
|
-
left: 0px;
|
|
64
|
-
right: 0px;
|
|
62
|
+
align-self: stretch;
|
|
65
63
|
margin: 0;
|
|
66
|
-
height: 1px;
|
|
67
|
-
background-color: var(--md-sys-color-surface-variant);
|
|
68
64
|
}
|
|
69
65
|
`;
|
|
70
66
|
//# sourceMappingURL=Tabs.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.styles.js","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"Tabs.styles.js","sourceRoot":"","sources":["../../../../../src/md/tabs/internals/Tabs.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+DjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n :host {\n display: block;\n overflow: hidden;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n position: relative;\n }\n\n .tabs {\n display: flex;\n align-items: center;\n overflow: auto;\n scroll-behavior: smooth;\n scrollbar-width: none;\n flex: 1 1 0%;\n align-self: stretch;\n }\n\n .tabs ::slotted(*) {\n flex: 1;\n white-space: nowrap;\n }\n\n .indicator {\n position: absolute;\n bottom: 1px;\n left: 0px;\n right: 0px;\n overflow: hidden;\n display: none;\n }\n\n .indicator.indicated {\n display: block;\n }\n\n .indicator.primary {\n height: 3px;\n }\n\n .indicator.secondary {\n height: 2px;\n }\n\n .pointer {\n height: inherit;\n display: inline-block;\n left: 0;\n width: 40px;\n background-color: var(--md-sys-color-primary);\n position: absolute;\n }\n\n .indicator.primary .pointer {\n border-radius: 3px 3px 0 0;\n }\n\n .divider {\n align-self: stretch;\n margin: 0;\n }\n`\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"common.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/text-field/internals/common.styles.ts"],"names":[],"mappings":";AAEA,
|
|
1
|
+
{"version":3,"file":"common.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/text-field/internals/common.styles.ts"],"names":[],"mappings":";AAEA,wBA2LC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"common.styles.js","sourceRoot":"","sources":["../../../../../src/md/text-field/internals/common.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"common.styles.js","sourceRoot":"","sources":["../../../../../src/md/text-field/internals/common.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2LjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n :host {\n display: inline-flex;\n flex-direction: column;\n vertical-align: top;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n cursor: text;\n\n min-width: 200px;\n }\n\n .surface {\n height: 56px;\n position: relative;\n display: flex;\n align-items: center;\n cursor: inherit;\n }\n\n .container {\n position: absolute;\n inset: 0;\n z-index: 1;\n border-radius: inherit;\n }\n\n .content {\n height: inherit;\n display: flex;\n align-items: center;\n justify-content: start;\n box-sizing: border-box;\n position: relative;\n z-index: 2;\n flex: 1;\n cursor: inherit;\n }\n\n .body {\n flex: 1;\n box-sizing: border-box;\n position: relative;\n cursor: inherit;\n }\n\n .label {\n color: var(--md-sys-color-on-surface-variant);\n\n max-width: 100%;\n pointer-events: none;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n z-index: 3;\n\n font-family: var(--md-sys-typescale-body-large-font);\n font-weight: var(--md-sys-typescale-body-large-weight);\n font-size: var(--md-sys-typescale-body-large-size);\n letter-spacing: var(--md-sys-typescale-body-large-tracking);\n line-height: var(--md-sys-typescale-body-large-height);\n\n transform-origin: left center;\n transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .input {\n caret-color: var(--md-sys-color-primary);\n color: var(--md-sys-color-on-surface);\n height: 24px; /* ??? */\n flex: 1; /* ??? */\n white-space: nowrap;\n overflow: hidden;\n background: transparent;\n border: none;\n outline: none;\n padding: 0;\n margin: 0;\n width: 1px;\n cursor: inherit;\n\n font-family: var(--md-sys-typescale-body-large-font);\n font-weight: var(--md-sys-typescale-body-large-weight);\n font-size: var(--md-sys-typescale-body-large-size);\n letter-spacing: var(--md-sys-typescale-body-large-tracking);\n line-height: var(--md-sys-typescale-body-large-height);\n }\n\n .input:-webkit-autofill,\n .input:autofill {\n background-color: transparent !important;\n }\n\n .start,\n .body,\n .end {\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: start;\n }\n\n .start {\n width: 16px;\n min-width: 16px;\n }\n\n .start.prefixed {\n width: 24px;\n min-width: 24px;\n margin-left: 12px;\n margin-right: 16px;\n }\n\n .end {\n width: 16px;\n min-width: 16px;\n }\n\n .end.suffixed {\n width: 24px;\n min-width: 24px;\n margin-right: 12px;\n padding-right: 12px;\n margin-left: 16px;\n }\n\n .end ::slotted(*),\n .start ::slotted(*) {\n cursor: default;\n }\n\n .supporting-text {\n padding-top: 4px;\n color: var(--md-sys-color-on-surface-variant);\n font-family: var(--md-sys-typescale-body-small-font);\n font-weight: var(--md-sys-typescale-body-small-weight);\n font-size: var(--md-sys-typescale-body-small-size);\n letter-spacing: var(--md-sys-typescale-body-small-tracking);\n line-height: var(--md-sys-typescale-body-small-height);\n display: flex;\n justify-content: space-between;\n padding: 0 16px;\n }\n\n .supporting-text-start {\n flex: 1;\n margin-right: 16px;\n }\n\n .supporting-text-end {\n margin-left: auto;\n flex-shrink: 0;\n }\n\n :host([disabled]) {\n pointer-events: none;\n }\n\n :host([disabled]) .container {\n background-color: var(--md-sys-color-on-surface);\n opacity: 0.04;\n }\n\n :host([disabled]) .label,\n :host([disabled]) .input,\n :host([disabled]) .end ::slotted(*),\n :host([disabled]) .start ::slotted(*) {\n color: var(--md-sys-color-on-surface);\n opacity: 0.38;\n }\n\n :host([invalid]) .label,\n :host([invalid]:focus-within) .label,\n :host([invalid]) .supporting-text,\n :host([invalid]) .end ::slotted(*) {\n color: var(--md-sys-color-error);\n }\n\n :host([invalid]:hover) .label,\n :host([invalid]:hover) .end ::slotted(*) {\n color: var(--md-sys-color-on-error-container);\n }\n\n .labelHidden .label {\n display: none;\n }\n`\n"]}
|
|
@@ -0,0 +1,270 @@
|
|
|
1
|
+
/* Styling for the native UI controls to look like MD elements */
|
|
2
|
+
|
|
3
|
+
/*
|
|
4
|
+
Material Select
|
|
5
|
+
|
|
6
|
+
Behaves mostly like an outlined input with a label.
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
@keyframes focus-outline-inward {
|
|
10
|
+
0% {
|
|
11
|
+
outline-width: 0;
|
|
12
|
+
outline-offset: 0;
|
|
13
|
+
}
|
|
14
|
+
50% {
|
|
15
|
+
outline-width: var(--md-focus-ring-active-width, 8px);
|
|
16
|
+
outline-offset: calc(-1 * var(--md-focus-ring-active-width, 8px));
|
|
17
|
+
}
|
|
18
|
+
100% {
|
|
19
|
+
outline-width: var(--md-focus-ring-width, 3px);
|
|
20
|
+
outline-offset: calc(-1 * var(--md-focus-ring-width, 3px));
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.md-select {
|
|
25
|
+
display: inline-block;
|
|
26
|
+
vertical-align: top;
|
|
27
|
+
|
|
28
|
+
--_outline-color: var(--md-focus-ring-color, var(--md-sys-color-secondary));
|
|
29
|
+
|
|
30
|
+
select,
|
|
31
|
+
::picker(select) {
|
|
32
|
+
appearance: base-select;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
select {
|
|
36
|
+
height: 56px;
|
|
37
|
+
display: inline-flex;
|
|
38
|
+
align-items: center;
|
|
39
|
+
justify-content: start;
|
|
40
|
+
box-sizing: border-box;
|
|
41
|
+
gap: 0;
|
|
42
|
+
padding: 0 16px 0 16px;
|
|
43
|
+
|
|
44
|
+
.prefix, .suffix {
|
|
45
|
+
min-width: 16px;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.prefix {
|
|
49
|
+
margin-left: 12px;
|
|
50
|
+
margin-right: 16px;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.suffix {
|
|
54
|
+
margin-left: 12px;
|
|
55
|
+
margin-right: 12px;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.prefix, selectedcontent, .suffix {
|
|
59
|
+
display: flex;
|
|
60
|
+
align-items: center;
|
|
61
|
+
justify-content: start;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
selectedcontent {
|
|
65
|
+
padding-right: 16px;
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
select:has(.suffix) selectedcontent {
|
|
70
|
+
padding-right: 0;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
select:has(.prefix) {
|
|
74
|
+
padding-left: 0;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
option {
|
|
78
|
+
display: flex;
|
|
79
|
+
align-items: center;
|
|
80
|
+
overflow: hidden;
|
|
81
|
+
padding: 8px 16px;
|
|
82
|
+
box-sizing: border-box;
|
|
83
|
+
height: 56px;
|
|
84
|
+
cursor: default;
|
|
85
|
+
position: relative;
|
|
86
|
+
|
|
87
|
+
outline: 0 solid var(--_outline-color);
|
|
88
|
+
outline-offset: -3px;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
option:hover {
|
|
92
|
+
background-color: transparent;
|
|
93
|
+
&::before {
|
|
94
|
+
opacity: var(--md-sys-state-hover-state-layer-opacity);
|
|
95
|
+
background-color: var(--md-sys-color-primary);
|
|
96
|
+
content: '';
|
|
97
|
+
position: absolute;
|
|
98
|
+
inset: 0;
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
option:focus-visible {
|
|
103
|
+
background-color: transparent;
|
|
104
|
+
animation: focus-outline-inward var(--md-focus-ring-duration, 600ms) cubic-bezier(0.2, 0, 0, 1) forwards;
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
@media(prefers-reduced-motion) {
|
|
108
|
+
option:focus-visible {
|
|
109
|
+
animation: none;
|
|
110
|
+
outline-width: var(--md-focus-ring-width, 3px);
|
|
111
|
+
outline-offset: calc(-1 * var(--md-focus-ring-width, 3px));
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
::picker(select) {
|
|
116
|
+
border: none;
|
|
117
|
+
padding: 10px 0;
|
|
118
|
+
background-color: var(--md-sys-color-surface);
|
|
119
|
+
transform: scaleY(0);
|
|
120
|
+
transition: all 250ms cubic-bezier(0.2, 0, 0, 1) 0s allow-discrete;
|
|
121
|
+
transform-origin: top center;
|
|
122
|
+
width: fit-content;
|
|
123
|
+
box-shadow: var(--md-sys-elevation-1);
|
|
124
|
+
border-radius: var(--md-sys-shape-corner-medium);
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
::picker(select):popover-open {
|
|
128
|
+
transform: scaleY(1);
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
@starting-style {
|
|
132
|
+
::picker(select):popover-open {
|
|
133
|
+
transform: scaleY(0);
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
label {
|
|
138
|
+
font-family: var(--md-sys-typescale-label-medium-font);
|
|
139
|
+
font-size: var(--md-sys-typescale-label-medium-size);
|
|
140
|
+
letter-spacing: var(--md-sys-typescale-label-medium-tracking);
|
|
141
|
+
line-height: var(--md-sys-typescale-label-medium-height);
|
|
142
|
+
font-weight: var(--md-ref-typeface-weight-regular);
|
|
143
|
+
position: absolute;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
label:has( + select:focus-within ) {
|
|
147
|
+
color: var(--md-sys-color-primary);
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
select::picker-icon {
|
|
151
|
+
font-family: var(--md-icon-font, Material Symbols Outlined);
|
|
152
|
+
font-weight: 400;
|
|
153
|
+
font-variation-settings:
|
|
154
|
+
'FILL' 0,
|
|
155
|
+
'wght' 700,
|
|
156
|
+
'GRAD' 200,
|
|
157
|
+
'opsz' 24;
|
|
158
|
+
content: "\e5c5";
|
|
159
|
+
letter-spacing: 0;
|
|
160
|
+
color: currentColor;
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
option::checkmark {
|
|
164
|
+
font-family: var(--md-icon-font, Material Symbols Outlined);
|
|
165
|
+
font-weight: 400;
|
|
166
|
+
font-variation-settings:
|
|
167
|
+
'FILL' 0,
|
|
168
|
+
'wght' 700,
|
|
169
|
+
'GRAD' 200,
|
|
170
|
+
'opsz' 24;
|
|
171
|
+
content: "\e5ca";
|
|
172
|
+
letter-spacing: 0;
|
|
173
|
+
color: var(--md-sys-color-primary);
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
&.outlined {
|
|
177
|
+
position: relative;
|
|
178
|
+
|
|
179
|
+
select {
|
|
180
|
+
border: 1px var(--md-sys-color-outline) solid;
|
|
181
|
+
outline: 0 solid var(--md-sys-color-primary);
|
|
182
|
+
outline-offset: 0;
|
|
183
|
+
transition: border-color var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard-accelerate);
|
|
184
|
+
border-radius: var(--md-sys-shape-corner-extra-small);
|
|
185
|
+
background-color: transparent;
|
|
186
|
+
|
|
187
|
+
&:hover:not(:focus-visible) {
|
|
188
|
+
border-color: var(--md-sys-color-on-surface);
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
&:focus-within {
|
|
192
|
+
outline-width: var(--md-focus-ring-width, 3px);
|
|
193
|
+
outline-offset: calc(-1 * var(--md-focus-ring-width, 3px));
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
&:focus-visible {
|
|
197
|
+
animation: focus-outline-inward var(--md-focus-ring-duration, 600ms) cubic-bezier(0.2, 0, 0, 1) forwards;
|
|
198
|
+
}
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
@media(prefers-reduced-motion) {
|
|
202
|
+
select:focus-visible {
|
|
203
|
+
animation: none;
|
|
204
|
+
outline-width: var(--md-focus-ring-width, 3px);
|
|
205
|
+
outline-offset: calc(-1 * var(--md-focus-ring-width, 3px));
|
|
206
|
+
}
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
label {
|
|
210
|
+
background-color: var(--md-sys-color-surface);
|
|
211
|
+
padding: 0 4px;
|
|
212
|
+
color: var(--md-sys-color-on-surface-variant);
|
|
213
|
+
left: 12px;
|
|
214
|
+
top: -7px;
|
|
215
|
+
}
|
|
216
|
+
}
|
|
217
|
+
|
|
218
|
+
&.filled {
|
|
219
|
+
position: relative;
|
|
220
|
+
|
|
221
|
+
select {
|
|
222
|
+
background-color: var(--md-sys-color-surface-variant);
|
|
223
|
+
border: none;
|
|
224
|
+
/* border-bottom: 1px solid var(--md-sys-color-on-surface-variant); */
|
|
225
|
+
border-radius: var(--md-sys-shape-corner-extra-small-top);
|
|
226
|
+
outline: none;
|
|
227
|
+
|
|
228
|
+
selectedcontent {
|
|
229
|
+
padding-top: 1em;
|
|
230
|
+
}
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
select::before {
|
|
234
|
+
content: '';
|
|
235
|
+
border-bottom: 1px solid var(--md-sys-color-on-surface-variant);
|
|
236
|
+
inset: auto 0 0;
|
|
237
|
+
position: absolute;
|
|
238
|
+
}
|
|
239
|
+
|
|
240
|
+
select::after {
|
|
241
|
+
content: '';
|
|
242
|
+
border-bottom-color: var(--md-sys-color-primary);
|
|
243
|
+
border-bottom-width: 2px;
|
|
244
|
+
border-bottom-style: solid;
|
|
245
|
+
opacity: 0;
|
|
246
|
+
transform: scaleX(0);
|
|
247
|
+
transform-origin: center center;
|
|
248
|
+
|
|
249
|
+
transition:
|
|
250
|
+
opacity 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s,
|
|
251
|
+
transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 150ms;
|
|
252
|
+
|
|
253
|
+
position: absolute;
|
|
254
|
+
inset: auto 0 0;
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
select:focus-within::after {
|
|
258
|
+
opacity: 1;
|
|
259
|
+
transform: scaleX(1);
|
|
260
|
+
|
|
261
|
+
}
|
|
262
|
+
|
|
263
|
+
label {
|
|
264
|
+
color: var(--md-sys-color-on-surface-variant);
|
|
265
|
+
transform: translateY(-1.35rem);
|
|
266
|
+
top: 50%;
|
|
267
|
+
left: 16px;
|
|
268
|
+
}
|
|
269
|
+
}
|
|
270
|
+
}
|