@esri/solutions-components 0.8.2 → 0.8.3

package/dist/solutions-components/calcite-navigation.entry.js

@@ -0,0 +1,166 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { r as registerInstance, e as createEvent, h, a as Host, F as Fragment, g as getElement } from './index-bdfaac50.js';
+import { u as slotChangeHasAssignedElement } from './dom-b91aa537.js';
+import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-aea90723.js';
+import './guid-b75a5f7b.js';
+import './resources-0f8db821.js';
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.4.0
+ */
+const CSS = {
+    container: "container",
+    containerContent: "container-content",
+    hasProgress: "progress-bar",
+    hide: "hide",
+    primary: "primary",
+    secondary: "secondary",
+    tertiary: "tertiary",
+};
+const SLOTS = {
+    logo: "logo",
+    user: "user",
+    progress: "progress",
+    navigationAction: "navigation-action",
+    contentStart: "content-start",
+    contentEnd: "content-end",
+    contentCenter: "content-center",
+    navSecondary: "navigation-secondary",
+    navTertiary: "navigation-tertiary",
+};
+const ICONS = {
+    hamburger: "hamburger",
+};
+
+const navigationCss = ":host([hidden]){display:none}[hidden]{display:none}.container{display:flex;inline-size:100%;flex-direction:column;margin-block:0;margin-inline:auto;background-color:var(--calcite-navigation-background, var(--calcite-color-foreground-1))}.container.primary,.container.secondary,.container.tertiary{border-block-end:1px solid;border-block-end-color:var(--calcite-navigation-border-color, var(--calcite-color-border-3))}.user,.logo{display:flex}.hide{display:none}.primary{block-size:4rem}.secondary{block-size:3rem}.tertiary{block-size:3rem}.container-content{margin-inline:auto;display:flex;block-size:100%;inline-size:100%;margin-block:0;inline-size:var(--calcite-navigation-width, 100%);max-inline-size:100%}.container-content.progress-bar{margin-block-start:0.125rem}slot[name]{display:flex;flex-direction:row}slot[name=navigation-secondary]::slotted(calcite-navigation),slot[name=navigation-tertiary]::slotted(calcite-navigation){inline-size:100%}slot[name=content-start]::slotted(*),slot[name=content-center]::slotted(*),slot[name=content-end]::slotted(*){display:flex;flex-direction:row;align-items:center}slot[name=progress],slot[name=progress] calcite-progress{inset-block-start:0;inset-inline:0}slot[name=content-end]{margin-inline-start:auto}slot[name=content-start]{margin-inline-end:auto}slot[name=content-end],slot[name=logo]~slot[name=user],slot[name=user]:only-child{margin-inline-start:auto}slot[name=content-center]{margin-inline-start:auto;margin-inline-end:auto}slot[name=content-start]~slot[name=content-center]{margin-inline-start:0px}slot[name=content-start]~slot[name=content-end],slot[name=content-center]~slot[name=content-end],slot[name=content-center]~slot[name=user],slot[name=content-end]~slot[name=user]{margin:0px}";
+
+const CalciteNavigation = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.calciteNavigationActionSelect = createEvent(this, "calciteNavigationActionSelect", 6);
+        //--------------------------------------------------------------------------
+        //
+        //  Private Methods
+        //
+        //--------------------------------------------------------------------------
+        this.actionClickHandler = () => {
+            this.calciteNavigationActionSelect.emit();
+        };
+        this.handleUserSlotChange = (event) => {
+            if (this.isPrimaryLevel()) {
+                this.userSlotHasElements = slotChangeHasAssignedElement(event);
+            }
+        };
+        this.handleLogoSlotChange = (event) => {
+            if (this.isPrimaryLevel()) {
+                this.logoSlotHasElements = slotChangeHasAssignedElement(event);
+            }
+        };
+        this.handleContentStartSlotChange = (event) => {
+            if (this.isPrimaryLevel()) {
+                this.primaryContentStartSlotHasElements = slotChangeHasAssignedElement(event);
+            }
+        };
+        this.handleContentEndSlotChange = (event) => {
+            if (this.isPrimaryLevel()) {
+                this.primaryContentEndSlotHasElements = slotChangeHasAssignedElement(event);
+            }
+        };
+        this.handleContentCenterSlotChange = (event) => {
+            if (this.isPrimaryLevel()) {
+                this.primaryContentCenterSlotHasElements = slotChangeHasAssignedElement(event);
+            }
+        };
+        this.handleSecondarySlotChange = (event) => {
+            this.secondarySlotHasElements = slotChangeHasAssignedElement(event);
+        };
+        this.handleTertiarySlotChange = (event) => {
+            this.tertiarySlotHasElements = slotChangeHasAssignedElement(event);
+        };
+        this.handleMenuActionSlotChange = (event) => {
+            if (this.isPrimaryLevel()) {
+                this.navigationActionSlotHasElements = slotChangeHasAssignedElement(event);
+                if (this.navigationActionSlotHasElements) {
+                    this.navigationAction = false;
+                }
+            }
+        };
+        this.handleProgressSlotChange = (event) => {
+            if (this.isPrimaryLevel()) {
+                this.progressSlotHasElement = slotChangeHasAssignedElement(event);
+            }
+        };
+        this.label = undefined;
+        this.navigationAction = false;
+        this.logoSlotHasElements = undefined;
+        this.navigationActionSlotHasElements = undefined;
+        this.primaryContentCenterSlotHasElements = undefined;
+        this.primaryContentEndSlotHasElements = undefined;
+        this.primaryContentStartSlotHasElements = undefined;
+        this.progressSlotHasElement = undefined;
+        this.secondarySlotHasElements = undefined;
+        this.tertiarySlotHasElements = undefined;
+        this.userSlotHasElements = undefined;
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Public Methods
+    //
+    //--------------------------------------------------------------------------
+    /** When `navigationAction` is `true`, sets focus on the component's action element. */
+    async setFocus() {
+        var _a;
+        await componentFocusable(this);
+        return (_a = this.navigationActionEl) === null || _a === void 0 ? void 0 : _a.setFocus();
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Lifecycle
+    //
+    //--------------------------------------------------------------------------
+    componentWillLoad() {
+        setUpLoadableComponent(this);
+    }
+    componentDidLoad() {
+        setComponentLoaded(this);
+    }
+    isPrimaryLevel() {
+        return this.el.slot !== SLOTS.navSecondary && this.el.slot !== SLOTS.navTertiary;
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Render Methods
+    //
+    //--------------------------------------------------------------------------
+    renderMenuAction() {
+        return (h("slot", { name: SLOTS.navigationAction, onSlotchange: this.handleMenuActionSlotChange }, this.navigationAction && (h("calcite-action", { icon: ICONS.hamburger, onClick: this.actionClickHandler, text: this.label,
+            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
+            ref: (el) => (this.navigationActionEl = el) }))));
+    }
+    render() {
+        const primaryLevelHasElements = this.logoSlotHasElements ||
+            this.userSlotHasElements ||
+            this.navigationActionSlotHasElements ||
+            this.primaryContentCenterSlotHasElements ||
+            this.primaryContentEndSlotHasElements ||
+            this.primaryContentStartSlotHasElements ||
+            this.navigationAction;
+        const slotName = this.el.slot;
+        return (h(Host, null, h("div", { class: {
+                [CSS.container]: true,
+                [CSS.secondary]: slotName === SLOTS.navSecondary,
+                [CSS.tertiary]: slotName === SLOTS.navTertiary,
+                [CSS.primary]: primaryLevelHasElements,
+            } }, h("div", { class: { [CSS.hide]: !this.progressSlotHasElement, [SLOTS.progress]: true } }, h("slot", { name: SLOTS.progress, onSlotchange: this.handleProgressSlotChange })), h("div", { class: { [CSS.containerContent]: true, [CSS.hasProgress]: this.progressSlotHasElement } }, this.renderMenuAction(), h("div", { class: { [CSS.hide]: !this.logoSlotHasElements, [SLOTS.logo]: true } }, h("slot", { name: SLOTS.logo, onSlotchange: this.handleLogoSlotChange })), h("slot", { name: SLOTS.contentStart, onSlotchange: this.handleContentStartSlotChange }), h("slot", { name: SLOTS.contentCenter, onSlotchange: this.handleContentCenterSlotChange }), h("slot", { name: SLOTS.contentEnd, onSlotchange: this.handleContentEndSlotChange }), h("div", { class: { [CSS.hide]: !this.userSlotHasElements, [SLOTS.user]: true } }, h("slot", { name: SLOTS.user, onSlotchange: this.handleUserSlotChange })))), h(Fragment, null, h("slot", { name: SLOTS.navSecondary, onSlotchange: this.handleSecondarySlotChange }), h("slot", { name: SLOTS.navTertiary, onSlotchange: this.handleTertiarySlotChange }))));
+    }
+    get el() { return getElement(this); }
+};
+CalciteNavigation.style = navigationCss;
+
+export { CalciteNavigation as calcite_navigation };

package/dist/solutions-components/calcite-notice.entry.js

@@ -0,0 +1,163 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { r as registerInstance, e as createEvent, h, g as getElement } from './index-bdfaac50.js';
+import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-a395417e.js';
+import { x as setRequestedIcon, g as getSlotted } from './dom-b91aa537.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-aea90723.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-857f39cf.js';
+import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n-b39c5433.js';
+import { K as KindIcons } from './resources-88a48c5c.js';
+import { o as onToggleOpenCloseComponent } from './openCloseComponent-b4b3788b.js';
+import { g as getIconScale } from './component-edd2c3cd.js';
+import './observers-5ba39eee.js';
+import './guid-b75a5f7b.js';
+import './resources-0f8db821.js';
+import './key-9a10d862.js';
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.4.0
+ */
+const SLOTS = {
+    title: "title",
+    message: "message",
+    link: "link",
+    actionsEnd: "actions-end",
+};
+const CSS = {
+    actionsEnd: "actions-end",
+    close: "notice-close",
+    container: "container",
+    content: "notice-content",
+    icon: "notice-icon",
+};
+
+const noticeCss = ":host([scale=s]){--calcite-notice-spacing-token-small:0.5rem;--calcite-notice-spacing-token-large:0.75rem}:host([scale=s]) .container slot[name=title]::slotted(*),:host([scale=s]) .container *::slotted([slot=title]){margin-block:0.125rem;font-size:var(--calcite-font-size--1);line-height:1.375}:host([scale=s]) .container slot[name=message]::slotted(*),:host([scale=s]) .container *::slotted([slot=message]){margin-block:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375}:host([scale=s]) ::slotted(calcite-link){margin-block:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375}:host([scale=s]) .notice-close{padding:0.5rem}:host([scale=m]){--calcite-notice-spacing-token-small:0.75rem;--calcite-notice-spacing-token-large:1rem}:host([scale=m]) .container slot[name=title]::slotted(*),:host([scale=m]) .container *::slotted([slot=title]){margin-block:0.125rem;font-size:var(--calcite-font-size-0);line-height:1.375}:host([scale=m]) .container slot[name=message]::slotted(*),:host([scale=m]) .container *::slotted([slot=message]){margin-block:0.125rem;font-size:var(--calcite-font-size--1);line-height:1.375}:host([scale=m]) ::slotted(calcite-link){margin-block:0.125rem;font-size:var(--calcite-font-size--1);line-height:1.375}:host([scale=l]){--calcite-notice-spacing-token-small:1rem;--calcite-notice-spacing-token-large:1.25rem}:host([scale=l]) .container slot[name=title]::slotted(*),:host([scale=l]) .container *::slotted([slot=title]){margin-block:0.125rem;font-size:var(--calcite-font-size-1);line-height:1.375}:host([scale=l]) .container slot[name=message]::slotted(*),:host([scale=l]) .container *::slotted([slot=message]){margin-block:0.125rem;font-size:var(--calcite-font-size-0);line-height:1.375}:host([scale=l]) ::slotted(calcite-link){margin-block:0.125rem;font-size:var(--calcite-font-size-0);line-height:1.375}:host([width=auto]){--calcite-notice-width:auto}:host([width=half]){--calcite-notice-width:50%}:host([width=full]){--calcite-notice-width:100%}:host{margin-inline:auto;display:none;max-inline-size:100%;align-items:center;inline-size:var(--calcite-notice-width)}.container{pointer-events:none;margin-block:0px;box-sizing:border-box;display:none;inline-size:100%;background-color:var(--calcite-color-foreground-1);opacity:0;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;max-block-size:0;text-align:start;border-inline-start:0px solid;box-shadow:0 0 0 0 transparent}.notice-close{outline-color:transparent}.notice-close:focus{outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}:host{display:flex}:host([open]) .container{pointer-events:auto;display:flex;max-block-size:100%;align-items:center;border-width:2px;opacity:1;--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.container slot[name=title]::slotted(*),.container *::slotted([slot=title]){margin:0px;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}.container slot[name=message]::slotted(*),.container *::slotted([slot=message]){margin:0px;display:inline;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2);margin-inline-end:var(--calcite-notice-spacing-token-small)}.notice-content{box-sizing:border-box;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;padding-inline:var(--calcite-notice-spacing-token-large);flex:0 0 auto;display:flex;min-inline-size:0px;flex-direction:column;overflow-wrap:break-word;flex:1 1 0;padding-block:var(--calcite-notice-spacing-token-small);padding-inline:0 var(--calcite-notice-spacing-token-small)}.notice-content:first-of-type:not(:only-child){padding-inline-start:var(--calcite-notice-spacing-token-large)}.notice-content:only-of-type{padding-block:var(--calcite-notice-spacing-token-small);padding-inline:var(--calcite-notice-spacing-token-large)}.notice-icon{display:flex;align-items:center;box-sizing:border-box;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;padding-block:var(--calcite-notice-spacing-token-small);padding-inline:var(--calcite-notice-spacing-token-large);flex:0 0 auto}.notice-close{display:flex;cursor:pointer;align-items:center;align-self:stretch;border-style:none;background-color:transparent;color:var(--calcite-color-text-3);outline:2px solid transparent;outline-offset:2px;box-sizing:border-box;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;padding-block:var(--calcite-notice-spacing-token-small);padding-inline:var(--calcite-notice-spacing-token-large);flex:0 0 auto;-webkit-appearance:none}.notice-close:hover,.notice-close:focus{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-1)}.notice-close:active{background-color:var(--calcite-color-foreground-3)}.actions-end{display:flex;align-self:stretch}:host([kind=brand]) .container{border-color:var(--calcite-color-brand)}:host([kind=brand]) .container .notice-icon{color:var(--calcite-color-brand)}:host([kind=info]) .container{border-color:var(--calcite-color-status-info)}:host([kind=info]) .container .notice-icon{color:var(--calcite-color-status-info)}:host([kind=danger]) .container{border-color:var(--calcite-color-status-danger)}:host([kind=danger]) .container .notice-icon{color:var(--calcite-color-status-danger)}:host([kind=success]) .container{border-color:var(--calcite-color-status-success)}:host([kind=success]) .container .notice-icon{color:var(--calcite-color-status-success)}:host([kind=warning]) .container{border-color:var(--calcite-color-status-warning)}:host([kind=warning]) .container .notice-icon{color:var(--calcite-color-status-warning)}:host([hidden]){display:none}[hidden]{display:none}";
+
+const Notice = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.calciteNoticeBeforeClose = createEvent(this, "calciteNoticeBeforeClose", 6);
+        this.calciteNoticeBeforeOpen = createEvent(this, "calciteNoticeBeforeOpen", 6);
+        this.calciteNoticeClose = createEvent(this, "calciteNoticeClose", 6);
+        this.calciteNoticeOpen = createEvent(this, "calciteNoticeOpen", 6);
+        this.setTransitionEl = (el) => {
+            this.transitionEl = el;
+        };
+        //--------------------------------------------------------------------------
+        //
+        //  Private Methods
+        //
+        //--------------------------------------------------------------------------
+        this.close = () => {
+            this.open = false;
+        };
+        this.openTransitionProp = "opacity";
+        this.open = false;
+        this.kind = "brand";
+        this.closable = false;
+        this.icon = undefined;
+        this.iconFlipRtl = false;
+        this.scale = "m";
+        this.width = "auto";
+        this.messages = undefined;
+        this.messageOverrides = undefined;
+        this.effectiveLocale = undefined;
+        this.defaultMessages = undefined;
+    }
+    openHandler() {
+        onToggleOpenCloseComponent(this);
+    }
+    onMessagesChange() {
+        /* wired up by t9n util */
+    }
+    updateRequestedIcon() {
+        this.requestedIcon = setRequestedIcon(KindIcons, this.icon, this.kind);
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Lifecycle
+    //
+    //--------------------------------------------------------------------------
+    connectedCallback() {
+        connectConditionalSlotComponent(this);
+        connectLocalized(this);
+        connectMessages(this);
+    }
+    disconnectedCallback() {
+        disconnectConditionalSlotComponent(this);
+        disconnectLocalized(this);
+        disconnectMessages(this);
+    }
+    async componentWillLoad() {
+        setUpLoadableComponent(this);
+        this.requestedIcon = setRequestedIcon(KindIcons, this.icon, this.kind);
+        await setUpMessages(this);
+        if (this.open) {
+            onToggleOpenCloseComponent(this);
+        }
+    }
+    componentDidLoad() {
+        setComponentLoaded(this);
+    }
+    render() {
+        const { el } = this;
+        const closeButton = (h("button", { "aria-label": this.messages.close, class: CSS.close, onClick: this.close,
+            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
+            ref: (el) => (this.closeButton = el) }, h("calcite-icon", { icon: "x", scale: getIconScale(this.scale) })));
+        const hasActionEnd = getSlotted(el, SLOTS.actionsEnd);
+        return (h("div", { class: CSS.container,
+            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
+            ref: this.setTransitionEl }, this.requestedIcon ? (h("div", { class: CSS.icon }, h("calcite-icon", { flipRtl: this.iconFlipRtl, icon: this.requestedIcon, scale: getIconScale(this.scale) }))) : null, h("div", { class: CSS.content }, h("slot", { name: SLOTS.title }), h("slot", { name: SLOTS.message }), h("slot", { name: SLOTS.link })), hasActionEnd ? (h("div", { class: CSS.actionsEnd }, h("slot", { name: SLOTS.actionsEnd }))) : null, this.closable ? closeButton : null));
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Public Methods
+    //
+    //--------------------------------------------------------------------------
+    /** Sets focus on the component's first focusable element. */
+    async setFocus() {
+        await componentFocusable(this);
+        const noticeLinkEl = this.el.querySelector("calcite-link");
+        if (!this.closeButton && !noticeLinkEl) {
+            return;
+        }
+        if (noticeLinkEl) {
+            return noticeLinkEl.setFocus();
+        }
+        else if (this.closeButton) {
+            this.closeButton.focus();
+        }
+    }
+    onBeforeClose() {
+        this.calciteNoticeBeforeClose.emit();
+    }
+    onBeforeOpen() {
+        this.calciteNoticeBeforeOpen.emit();
+    }
+    onClose() {
+        this.calciteNoticeClose.emit();
+    }
+    onOpen() {
+        this.calciteNoticeOpen.emit();
+    }
+    effectiveLocaleChange() {
+        updateMessages(this, this.effectiveLocale);
+    }
+    static get assetsDirs() { return ["assets"]; }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "open": ["openHandler"],
+        "messageOverrides": ["onMessagesChange"],
+        "icon": ["updateRequestedIcon"],
+        "kind": ["updateRequestedIcon"],
+        "effectiveLocale": ["effectiveLocaleChange"]
+    }; }
+};
+Notice.style = noticeCss;
+
+export { Notice as calcite_notice };

package/dist/solutions-components/calcite-option-group.entry.js

@@ -0,0 +1,35 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { r as registerInstance, e as createEvent, h, F as Fragment } from './index-bdfaac50.js';
+
+const optionGroupCss = ":host{display:block}:host([hidden]){display:none}[hidden]{display:none}";
+
+const OptionGroup = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.calciteInternalOptionGroupChange = createEvent(this, "calciteInternalOptionGroupChange", 6);
+        this.disabled = false;
+        this.label = undefined;
+    }
+    handlePropChange() {
+        this.calciteInternalOptionGroupChange.emit();
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Render Methods
+    //
+    //--------------------------------------------------------------------------
+    render() {
+        return (h(Fragment, null, h("div", null, this.label), h("slot", null)));
+    }
+    static get watchers() { return {
+        "disabled": ["handlePropChange"],
+        "label": ["handlePropChange"]
+    }; }
+};
+OptionGroup.style = optionGroupCss;
+
+export { OptionGroup as calcite_option_group };

package/dist/solutions-components/calcite-option.entry.js

@@ -0,0 +1,84 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { r as registerInstance, e as createEvent, h, g as getElement } from './index-bdfaac50.js';
+import { c as createObserver } from './observers-5ba39eee.js';
+
+const optionCss = ":host{display:block}:host([hidden]){display:none}[hidden]{display:none}";
+
+const Option = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.calciteInternalOptionChange = createEvent(this, "calciteInternalOptionChange", 6);
+        this.mutationObserver = createObserver("mutation", () => {
+            this.ensureTextContentDependentProps();
+            this.calciteInternalOptionChange.emit();
+        });
+        this.disabled = false;
+        this.label = undefined;
+        this.selected = undefined;
+        this.value = undefined;
+    }
+    handlePropChange(_newValue, _oldValue, propName) {
+        if (propName === "label" || propName === "value") {
+            this.ensureTextContentDependentProps();
+        }
+        this.calciteInternalOptionChange.emit();
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Private Methods
+    //
+    //--------------------------------------------------------------------------
+    ensureTextContentDependentProps() {
+        const { el: { textContent }, internallySetLabel, internallySetValue, label, value, } = this;
+        if (!label || label === internallySetLabel) {
+            this.label = textContent;
+            this.internallySetLabel = textContent;
+        }
+        if (value == null /* intentional loose equals to handle both undefined & null */ ||
+            value === internallySetValue) {
+            this.value = textContent;
+            this.internallySetValue = textContent;
+        }
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Lifecycle
+    //
+    //--------------------------------------------------------------------------
+    connectedCallback() {
+        var _a;
+        this.ensureTextContentDependentProps();
+        (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, {
+            attributeFilter: ["label", "value"],
+            characterData: true,
+            childList: true,
+            subtree: true,
+        });
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Render Methods
+    //
+    //--------------------------------------------------------------------------
+    render() {
+        return h("slot", null, this.label);
+    }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "disabled": ["handlePropChange"],
+        "label": ["handlePropChange"],
+        "selected": ["handlePropChange"],
+        "value": ["handlePropChange"]
+    }; }
+};
+Option.style = optionCss;
+
+export { Option as calcite_option };