@skdx/web-components 0.26.0

package/dist/context-menu/ContextMenuSub.cjs

@@ -0,0 +1 @@
+"use strict";var x=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var i=Object.prototype.hasOwnProperty;var f=(s,e)=>{for(var c in e)x(s,c,{get:e[c],enumerable:!0})},k=(s,e,c,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of p(e))!i.call(s,t)&&t!==c&&x(s,t,{get:()=>e[t],enumerable:!(n=g(e,t))||n.enumerable});return s};var E=s=>k(x({},"__esModule",{value:!0}),s),a=(s,e,c,n)=>{for(var t=n>1?void 0:n?g(e,c):e,d=s.length-1,b;d>=0;d--)(b=s[d])&&(t=(n?b(e,c,t):b(t))||t);return n&&t&&x(e,c,t),t};var H={};f(H,{SkdxContextMenuSub:()=>o,SkdxContextMenuSubContent:()=>u,SkdxContextMenuSubTrigger:()=>r});module.exports=E(H);var l=require("../internal/define.cjs"),m=require("../internal/menu-sub.cjs");var o=class extends m.SkdxMenuSub{};o=a([(0,l.customElement)("skdx-context-menu-sub")],o);var r=class extends m.SkdxMenuSubTrigger{};r=a([(0,l.customElement)("skdx-context-menu-sub-trigger","context-menu","sub-trigger")],r);var u=class extends m.SkdxMenuSubContent{};u=a([(0,l.customElement)("skdx-context-menu-sub-content","context-menu","sub-content")],u);0&&(module.exports={SkdxContextMenuSub,SkdxContextMenuSubContent,SkdxContextMenuSubTrigger});

package/dist/context-menu/ContextMenuSub.d.cts

@@ -0,0 +1,55 @@
+import { SkdxMenuSub, SkdxMenuSubContent, SkdxMenuSubTrigger } from '../internal/menu-sub.cjs';
+/**
+ * `<skdx-context-menu-sub>` — root of a nested submenu inside
+ * `<skdx-context-menu-content>`: owns the submenu's own `open` state (and its
+ * hover grace timer), which its `<skdx-context-menu-sub-trigger>` and
+ * `<skdx-context-menu-sub-content>` read. Renders only a `<slot>`
+ * (`display: contents`).
+ *
+ * @fires open-change - The submenu opened or closed (detail: the new open state).
+ *
+ * @example
+ * ```html
+ * <skdx-context-menu-content>
+ *   <skdx-context-menu-item>Copy</skdx-context-menu-item>
+ *   <skdx-context-menu-sub>
+ *     <skdx-context-menu-sub-trigger>Share</skdx-context-menu-sub-trigger>
+ *     <skdx-context-menu-sub-content>
+ *       <skdx-context-menu-item>Email</skdx-context-menu-item>
+ *       <skdx-context-menu-item>Copy link</skdx-context-menu-item>
+ *     </skdx-context-menu-sub-content>
+ *   </skdx-context-menu-sub>
+ * </skdx-context-menu-content>
+ * ```
+ */
+export declare class SkdxContextMenuSub extends SkdxMenuSub {
+}
+/**
+ * `<skdx-context-menu-sub-trigger>` — the parent-menu item that opens a
+ * submenu: `role="menuitem"` with `aria-haspopup="menu"`, `aria-expanded`,
+ * `aria-controls` and `data-state`, so it takes part in
+ * `<skdx-context-menu-content>`'s roving focus and typeahead like any other
+ * item. Opens on click, Enter, Space or ArrowRight — moving focus to the
+ * submenu's first item — and on hover, which leaves focus on the trigger.
+ * Never closes the parent menu.
+ */
+export declare class SkdxContextMenuSubTrigger extends SkdxMenuSubTrigger {
+}
+/**
+ * `<skdx-context-menu-sub-content>` — the submenu's floating panel:
+ * `role="menu"`, positioned against `<skdx-context-menu-sub-trigger>`
+ * (`side="end"`, `align="start"` by default) by the same `positionFloating`
+ * layer as `<skdx-context-menu-content>`, and rendered inline rather than in a
+ * portal so the parent menu's outside-pointer-down dismissal treats clicks
+ * inside it as "inside". Owns its own vertical roving focus and typeahead;
+ * ArrowLeft and Escape close only the submenu and refocus the trigger.
+ */
+export declare class SkdxContextMenuSubContent extends SkdxMenuSubContent {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-context-menu-sub': SkdxContextMenuSub;
+        'skdx-context-menu-sub-trigger': SkdxContextMenuSubTrigger;
+        'skdx-context-menu-sub-content': SkdxContextMenuSubContent;
+    }
+}

package/dist/context-menu/ContextMenuSub.d.ts

@@ -0,0 +1,55 @@
+import { SkdxMenuSub, SkdxMenuSubContent, SkdxMenuSubTrigger } from '../internal/menu-sub.js';
+/**
+ * `<skdx-context-menu-sub>` — root of a nested submenu inside
+ * `<skdx-context-menu-content>`: owns the submenu's own `open` state (and its
+ * hover grace timer), which its `<skdx-context-menu-sub-trigger>` and
+ * `<skdx-context-menu-sub-content>` read. Renders only a `<slot>`
+ * (`display: contents`).
+ *
+ * @fires open-change - The submenu opened or closed (detail: the new open state).
+ *
+ * @example
+ * ```html
+ * <skdx-context-menu-content>
+ *   <skdx-context-menu-item>Copy</skdx-context-menu-item>
+ *   <skdx-context-menu-sub>
+ *     <skdx-context-menu-sub-trigger>Share</skdx-context-menu-sub-trigger>
+ *     <skdx-context-menu-sub-content>
+ *       <skdx-context-menu-item>Email</skdx-context-menu-item>
+ *       <skdx-context-menu-item>Copy link</skdx-context-menu-item>
+ *     </skdx-context-menu-sub-content>
+ *   </skdx-context-menu-sub>
+ * </skdx-context-menu-content>
+ * ```
+ */
+export declare class SkdxContextMenuSub extends SkdxMenuSub {
+}
+/**
+ * `<skdx-context-menu-sub-trigger>` — the parent-menu item that opens a
+ * submenu: `role="menuitem"` with `aria-haspopup="menu"`, `aria-expanded`,
+ * `aria-controls` and `data-state`, so it takes part in
+ * `<skdx-context-menu-content>`'s roving focus and typeahead like any other
+ * item. Opens on click, Enter, Space or ArrowRight — moving focus to the
+ * submenu's first item — and on hover, which leaves focus on the trigger.
+ * Never closes the parent menu.
+ */
+export declare class SkdxContextMenuSubTrigger extends SkdxMenuSubTrigger {
+}
+/**
+ * `<skdx-context-menu-sub-content>` — the submenu's floating panel:
+ * `role="menu"`, positioned against `<skdx-context-menu-sub-trigger>`
+ * (`side="end"`, `align="start"` by default) by the same `positionFloating`
+ * layer as `<skdx-context-menu-content>`, and rendered inline rather than in a
+ * portal so the parent menu's outside-pointer-down dismissal treats clicks
+ * inside it as "inside". Owns its own vertical roving focus and typeahead;
+ * ArrowLeft and Escape close only the submenu and refocus the trigger.
+ */
+export declare class SkdxContextMenuSubContent extends SkdxMenuSubContent {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-context-menu-sub': SkdxContextMenuSub;
+        'skdx-context-menu-sub-trigger': SkdxContextMenuSubTrigger;
+        'skdx-context-menu-sub-content': SkdxContextMenuSubContent;
+    }
+}

package/dist/context-menu/ContextMenuSub.js

@@ -0,0 +1 @@
+var d=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var n=(s,t,u,c)=>{for(var e=c>1?void 0:c?b(t,u):t,x=s.length-1,a;x>=0;x--)(a=s[x])&&(e=(c?a(t,u,e):a(e))||e);return c&&e&&d(t,u,e),e};import{customElement as l}from"../internal/define.js";import{SkdxMenuSub as g,SkdxMenuSubContent as p,SkdxMenuSubTrigger as i}from"../internal/menu-sub.js";var m=class extends g{};m=n([l("skdx-context-menu-sub")],m);var o=class extends i{};o=n([l("skdx-context-menu-sub-trigger","context-menu","sub-trigger")],o);var r=class extends p{};r=n([l("skdx-context-menu-sub-content","context-menu","sub-content")],r);export{m as SkdxContextMenuSub,r as SkdxContextMenuSubContent,o as SkdxContextMenuSubTrigger};

package/dist/context-menu/ContextMenuTrigger.cjs

@@ -0,0 +1,5 @@
+"use strict";var a=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var v=(o,e)=>{for(var t in e)a(o,t,{get:e[t],enumerable:!0})},f=(o,e,t,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of m(e))!y.call(o,i)&&i!==t&&a(o,i,{get:()=>e[i],enumerable:!(s=c(e,i))||s.enumerable});return o};var x=o=>f(a({},"__esModule",{value:!0}),o),h=(o,e,t,s)=>{for(var i=s>1?void 0:s?c(e,t):e,d=o.length-1,l;d>=0;d--)(l=o[d])&&(i=(s?l(e,t,i):l(i))||i);return s&&i&&a(e,t,i),i};var k={};v(k,{SkdxContextMenuTrigger:()=>r});module.exports=x(k);var n=require("lit"),u=require("lit/decorators.js"),p=require("../internal/define.cjs"),b=require("../internal/styles.cjs");var r=class extends n.LitElement{constructor(){super(...arguments);this.disabled=!1;this.root=null;this.onRootUpdate=()=>this.syncState();this.handleContextMenu=t=>{this.disabled||(t.preventDefault(),this.root?.setPoint({x:t.clientX,y:t.clientY}),this.root?.setOpen(!0))};this.handleKeyDown=t=>{if(this.disabled||t.key!=="ContextMenu"&&!(t.key==="F10"&&t.shiftKey))return;t.preventDefault();let s=this.getBoundingClientRect();this.root?.setPoint({x:s.left,y:s.bottom}),this.root?.setOpen(!0)}}connectedCallback(){super.connectedCallback(),this.tabIndex=0,this.setAttribute("role","group"),this.setAttribute("aria-haspopup","menu"),this.root=this.closest("skdx-context-menu"),this.root&&(this.root.triggerEl=this,this.setAttribute("aria-controls",this.root.contentId)),this.root?.addEventListener("skdx-context-menu-internal-update",this.onRootUpdate),this.addEventListener("contextmenu",this.handleContextMenu),this.addEventListener("keydown",this.handleKeyDown),this.syncState()}disconnectedCallback(){this.root?.removeEventListener("skdx-context-menu-internal-update",this.onRootUpdate),this.root?.triggerEl===this&&(this.root.triggerEl=null),super.disconnectedCallback()}updated(t){t.has("disabled")&&this.syncDisabled()}syncState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("aria-expanded",String(t)),this.syncDisabled()}syncDisabled(){this.disabled?(this.setAttribute("data-disabled",""),this.setAttribute("aria-disabled","true")):(this.removeAttribute("data-disabled"),this.removeAttribute("aria-disabled"))}render(){return n.html`<slot></slot>`}};r.styles=[b.hiddenHostStyles,n.css`
+      :host {
+        display: inline-block;
+      }
+    `],h([(0,u.property)({type:Boolean,reflect:!0})],r.prototype,"disabled",2),r=h([(0,p.customElement)("skdx-context-menu-trigger","context-menu","trigger")],r);0&&(module.exports={SkdxContextMenuTrigger});

package/dist/context-menu/ContextMenuTrigger.d.cts

@@ -0,0 +1,38 @@
+import { LitElement } from 'lit';
+/**
+ * `<skdx-context-menu-trigger>` — region that opens the closest ancestor
+ * `<skdx-context-menu>` at the pointer's coordinates when right-clicked
+ * (suppresses the native browser context menu via `event.preventDefault()`,
+ * unless `disabled`).
+ *
+ * Keyboard-reachable: the host carries `tabindex="0"` and opens on Shift+F10
+ * or the dedicated Menu (`ContextMenu`) key, anchored at its own box since
+ * there is no pointer to sit at — the browser only fires `contextmenu` for
+ * those keys on the *focused* element, so the region has to be focusable.
+ *
+ * `tabindex`, `role="group"`, `aria-haspopup="menu"`, `aria-expanded`, `aria-controls`,
+ * `data-state` (`open`/`closed`), `data-disabled` and `aria-disabled` are all
+ * set directly on the host element: the trigger wraps arbitrary slotted content rather than
+ * rendering a control of its own, so there is no shadow-DOM wrapper to put
+ * them on.
+ */
+export declare class SkdxContextMenuTrigger extends LitElement {
+    static styles: import("lit").CSSResult[];
+    /** Disables the context menu for this region, letting the native browser context menu through. */
+    disabled: boolean;
+    private root;
+    private readonly onRootUpdate;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(changed: Map<string, unknown>): void;
+    private syncState;
+    private syncDisabled;
+    private readonly handleContextMenu;
+    private readonly handleKeyDown;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-context-menu-trigger': SkdxContextMenuTrigger;
+    }
+}

package/dist/context-menu/ContextMenuTrigger.d.ts

@@ -0,0 +1,38 @@
+import { LitElement } from 'lit';
+/**
+ * `<skdx-context-menu-trigger>` — region that opens the closest ancestor
+ * `<skdx-context-menu>` at the pointer's coordinates when right-clicked
+ * (suppresses the native browser context menu via `event.preventDefault()`,
+ * unless `disabled`).
+ *
+ * Keyboard-reachable: the host carries `tabindex="0"` and opens on Shift+F10
+ * or the dedicated Menu (`ContextMenu`) key, anchored at its own box since
+ * there is no pointer to sit at — the browser only fires `contextmenu` for
+ * those keys on the *focused* element, so the region has to be focusable.
+ *
+ * `tabindex`, `role="group"`, `aria-haspopup="menu"`, `aria-expanded`, `aria-controls`,
+ * `data-state` (`open`/`closed`), `data-disabled` and `aria-disabled` are all
+ * set directly on the host element: the trigger wraps arbitrary slotted content rather than
+ * rendering a control of its own, so there is no shadow-DOM wrapper to put
+ * them on.
+ */
+export declare class SkdxContextMenuTrigger extends LitElement {
+    static styles: import("lit").CSSResult[];
+    /** Disables the context menu for this region, letting the native browser context menu through. */
+    disabled: boolean;
+    private root;
+    private readonly onRootUpdate;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(changed: Map<string, unknown>): void;
+    private syncState;
+    private syncDisabled;
+    private readonly handleContextMenu;
+    private readonly handleKeyDown;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-context-menu-trigger': SkdxContextMenuTrigger;
+    }
+}

package/dist/context-menu/ContextMenuTrigger.js

@@ -0,0 +1,5 @@
+var l=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var d=(r,s,t,e)=>{for(var i=e>1?void 0:e?h(s,t):s,n=r.length-1,a;n>=0;n--)(a=r[n])&&(i=(e?a(s,t,i):a(i))||i);return e&&i&&l(s,t,i),i};import{css as c,html as u,LitElement as p}from"lit";import{property as b}from"lit/decorators.js";import{customElement as m}from"../internal/define.js";import{hiddenHostStyles as y}from"../internal/styles.js";var o=class extends p{constructor(){super(...arguments);this.disabled=!1;this.root=null;this.onRootUpdate=()=>this.syncState();this.handleContextMenu=t=>{this.disabled||(t.preventDefault(),this.root?.setPoint({x:t.clientX,y:t.clientY}),this.root?.setOpen(!0))};this.handleKeyDown=t=>{if(this.disabled||t.key!=="ContextMenu"&&!(t.key==="F10"&&t.shiftKey))return;t.preventDefault();let e=this.getBoundingClientRect();this.root?.setPoint({x:e.left,y:e.bottom}),this.root?.setOpen(!0)}}connectedCallback(){super.connectedCallback(),this.tabIndex=0,this.setAttribute("role","group"),this.setAttribute("aria-haspopup","menu"),this.root=this.closest("skdx-context-menu"),this.root&&(this.root.triggerEl=this,this.setAttribute("aria-controls",this.root.contentId)),this.root?.addEventListener("skdx-context-menu-internal-update",this.onRootUpdate),this.addEventListener("contextmenu",this.handleContextMenu),this.addEventListener("keydown",this.handleKeyDown),this.syncState()}disconnectedCallback(){this.root?.removeEventListener("skdx-context-menu-internal-update",this.onRootUpdate),this.root?.triggerEl===this&&(this.root.triggerEl=null),super.disconnectedCallback()}updated(t){t.has("disabled")&&this.syncDisabled()}syncState(){let t=this.root?.open??!1;this.setAttribute("data-state",t?"open":"closed"),this.setAttribute("aria-expanded",String(t)),this.syncDisabled()}syncDisabled(){this.disabled?(this.setAttribute("data-disabled",""),this.setAttribute("aria-disabled","true")):(this.removeAttribute("data-disabled"),this.removeAttribute("aria-disabled"))}render(){return u`<slot></slot>`}};o.styles=[y,c`
+      :host {
+        display: inline-block;
+      }
+    `],d([b({type:Boolean,reflect:!0})],o.prototype,"disabled",2),o=d([m("skdx-context-menu-trigger","context-menu","trigger")],o);export{o as SkdxContextMenuTrigger};

package/dist/context-menu/index.cjs

@@ -0,0 +1 @@
+"use strict";var n=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var l=Object.prototype.hasOwnProperty;var G=(t,e)=>{for(var r in e)n(t,r,{get:e[r],enumerable:!0})},R=(t,e,r,u)=>{if(e&&typeof e=="object"||typeof e=="function")for(let x of c(e))!l.call(t,x)&&x!==r&&n(t,x,{get:()=>e[x],enumerable:!(u=g(e,x))||u.enumerable});return t};var T=t=>R(n({},"__esModule",{value:!0}),t);var h={};G(h,{SkdxContextMenu:()=>S.SkdxContextMenu,SkdxContextMenuCheckboxItem:()=>p.SkdxContextMenuCheckboxItem,SkdxContextMenuContent:()=>m.SkdxContextMenuContent,SkdxContextMenuGroup:()=>b.SkdxContextMenuGroup,SkdxContextMenuItem:()=>k.SkdxContextMenuItem,SkdxContextMenuItemIndicator:()=>a.SkdxContextMenuItemIndicator,SkdxContextMenuLabel:()=>i.SkdxContextMenuLabel,SkdxContextMenuPortal:()=>C.SkdxContextMenuPortal,SkdxContextMenuRadioGroup:()=>M.SkdxContextMenuRadioGroup,SkdxContextMenuRadioItem:()=>f.SkdxContextMenuRadioItem,SkdxContextMenuSeparator:()=>I.SkdxContextMenuSeparator,SkdxContextMenuSub:()=>o.SkdxContextMenuSub,SkdxContextMenuSubContent:()=>o.SkdxContextMenuSubContent,SkdxContextMenuSubTrigger:()=>o.SkdxContextMenuSubTrigger,SkdxContextMenuTrigger:()=>d.SkdxContextMenuTrigger});module.exports=T(h);var S=require("./ContextMenu.cjs"),d=require("./ContextMenuTrigger.cjs"),C=require("./ContextMenuPortal.cjs"),m=require("./ContextMenuContent.cjs"),k=require("./ContextMenuItem.cjs"),p=require("./ContextMenuCheckboxItem.cjs"),M=require("./ContextMenuRadioGroup.cjs"),f=require("./ContextMenuRadioItem.cjs"),a=require("./ContextMenuItemIndicator.cjs"),b=require("./ContextMenuGroup.cjs"),i=require("./ContextMenuLabel.cjs"),I=require("./ContextMenuSeparator.cjs"),o=require("./ContextMenuSub.cjs");0&&(module.exports={SkdxContextMenu,SkdxContextMenuCheckboxItem,SkdxContextMenuContent,SkdxContextMenuGroup,SkdxContextMenuItem,SkdxContextMenuItemIndicator,SkdxContextMenuLabel,SkdxContextMenuPortal,SkdxContextMenuRadioGroup,SkdxContextMenuRadioItem,SkdxContextMenuSeparator,SkdxContextMenuSub,SkdxContextMenuSubContent,SkdxContextMenuSubTrigger,SkdxContextMenuTrigger});

package/dist/context-menu/index.d.cts

@@ -0,0 +1,13 @@
+export { SkdxContextMenu } from './ContextMenu.cjs';
+export { SkdxContextMenuTrigger } from './ContextMenuTrigger.cjs';
+export { SkdxContextMenuPortal } from './ContextMenuPortal.cjs';
+export { SkdxContextMenuContent } from './ContextMenuContent.cjs';
+export { SkdxContextMenuItem } from './ContextMenuItem.cjs';
+export { SkdxContextMenuCheckboxItem } from './ContextMenuCheckboxItem.cjs';
+export { SkdxContextMenuRadioGroup } from './ContextMenuRadioGroup.cjs';
+export { SkdxContextMenuRadioItem } from './ContextMenuRadioItem.cjs';
+export { SkdxContextMenuItemIndicator } from './ContextMenuItemIndicator.cjs';
+export { SkdxContextMenuGroup } from './ContextMenuGroup.cjs';
+export { SkdxContextMenuLabel } from './ContextMenuLabel.cjs';
+export { SkdxContextMenuSeparator } from './ContextMenuSeparator.cjs';
+export { SkdxContextMenuSub, SkdxContextMenuSubTrigger, SkdxContextMenuSubContent } from './ContextMenuSub.cjs';

package/dist/context-menu/index.d.ts

@@ -0,0 +1,13 @@
+export { SkdxContextMenu } from './ContextMenu.js';
+export { SkdxContextMenuTrigger } from './ContextMenuTrigger.js';
+export { SkdxContextMenuPortal } from './ContextMenuPortal.js';
+export { SkdxContextMenuContent } from './ContextMenuContent.js';
+export { SkdxContextMenuItem } from './ContextMenuItem.js';
+export { SkdxContextMenuCheckboxItem } from './ContextMenuCheckboxItem.js';
+export { SkdxContextMenuRadioGroup } from './ContextMenuRadioGroup.js';
+export { SkdxContextMenuRadioItem } from './ContextMenuRadioItem.js';
+export { SkdxContextMenuItemIndicator } from './ContextMenuItemIndicator.js';
+export { SkdxContextMenuGroup } from './ContextMenuGroup.js';
+export { SkdxContextMenuLabel } from './ContextMenuLabel.js';
+export { SkdxContextMenuSeparator } from './ContextMenuSeparator.js';
+export { SkdxContextMenuSub, SkdxContextMenuSubTrigger, SkdxContextMenuSubContent } from './ContextMenuSub.js';

package/dist/context-menu/index.js

@@ -0,0 +1 @@
+import{SkdxContextMenu as o}from"./ContextMenu.js";import{SkdxContextMenuTrigger as r}from"./ContextMenuTrigger.js";import{SkdxContextMenuPortal as u}from"./ContextMenuPortal.js";import{SkdxContextMenuContent as d}from"./ContextMenuContent.js";import{SkdxContextMenuItem as m}from"./ContextMenuItem.js";import{SkdxContextMenuCheckboxItem as p}from"./ContextMenuCheckboxItem.js";import{SkdxContextMenuRadioGroup as f}from"./ContextMenuRadioGroup.js";import{SkdxContextMenuRadioItem as b}from"./ContextMenuRadioItem.js";import{SkdxContextMenuItemIndicator as I}from"./ContextMenuItemIndicator.js";import{SkdxContextMenuGroup as c}from"./ContextMenuGroup.js";import{SkdxContextMenuLabel as G}from"./ContextMenuLabel.js";import{SkdxContextMenuSeparator as T}from"./ContextMenuSeparator.js";import{SkdxContextMenuSub as L,SkdxContextMenuSubTrigger as P,SkdxContextMenuSubContent as j}from"./ContextMenuSub.js";export{o as SkdxContextMenu,p as SkdxContextMenuCheckboxItem,d as SkdxContextMenuContent,c as SkdxContextMenuGroup,m as SkdxContextMenuItem,I as SkdxContextMenuItemIndicator,G as SkdxContextMenuLabel,u as SkdxContextMenuPortal,f as SkdxContextMenuRadioGroup,b as SkdxContextMenuRadioItem,T as SkdxContextMenuSeparator,L as SkdxContextMenuSub,j as SkdxContextMenuSubContent,P as SkdxContextMenuSubTrigger,r as SkdxContextMenuTrigger};

package/dist/data-list/DataList.cjs

@@ -0,0 +1,12 @@
+"use strict";var d=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var y=(r,e)=>{for(var t in e)d(r,t,{get:e[t],enumerable:!0})},u=(r,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of b(e))!f.call(r,a)&&a!==t&&d(r,a,{get:()=>e[a],enumerable:!(i=h(e,a))||i.enumerable});return r};var P=r=>u(d({},"__esModule",{value:!0}),r),p=(r,e,t,i)=>{for(var a=i>1?void 0:i?h(e,t):e,n=r.length-1,c;n>=0;n--)(c=r[n])&&(a=(i?c(e,t,a):c(a))||a);return i&&a&&d(e,t,a),a};var M={};y(M,{SkdxDataList:()=>o});module.exports=P(M);var l=require("lit"),v=require("lit/decorators.js"),m=require("../internal/define.cjs"),s=require("../internal/part.cjs");var o=class extends l.LitElement{constructor(){super(...arguments);this.orientation="horizontal";this.observer=new MutationObserver(()=>this.applyChildParts())}connectedCallback(){super.connectedCallback(),this.observer.observe(this,{childList:!0,subtree:!0}),this.applyChildParts()}disconnectedCallback(){this.observer.disconnect(),super.disconnectedCallback()}applyChildParts(){for(let t of this.children)if(t.localName==="div"){(0,s.applyHostPart)(t,"data-list","item");for(let i of t.children)this.applyPairPart(i)}else this.applyPairPart(t)}applyPairPart(t){t.localName==="dt"?(0,s.applyHostPart)(t,"data-list","label"):t.localName==="dd"&&(0,s.applyHostPart)(t,"data-list","value")}updated(){(0,s.reflectHostState)(this,{"data-orientation":this.orientation})}render(){return l.html`<dl part="data-list" data-orientation=${this.orientation}>
+      <slot></slot>
+    </dl>`}};o.styles=l.css`
+    :host {
+      display: contents;
+    }
+    /* Makes the host the single grid container, so .skdx-data-list__item's
+       subgrid resolves. See the JSDoc above; do not remove. */
+    dl {
+      display: contents;
+    }
+  `,p([(0,v.property)({type:String,reflect:!0})],o.prototype,"orientation",2),o=p([(0,m.customElement)("skdx-data-list","data-list","root")],o);0&&(module.exports={SkdxDataList});

package/dist/data-list/DataList.d.cts

@@ -0,0 +1,155 @@
+import { LitElement } from 'lit';
+/** Orientation of the label/value pairs, emitted as `data-orientation` for the brand layer to lay out. */
+export type DataListOrientation = 'horizontal' | 'vertical';
+/**
+ * `<skdx-data-list>` — the Web Components implementation of the shared DataList
+ * contract (see `@skdx/shared`'s `dataListContract`). A description list of
+ * label/value pairs, and nothing else: no state, no events, no keyboard
+ * interaction. Its entire value is the markup it guarantees.
+ *
+ * Renders a *real* `<dl>` inside shadow DOM with `:host { display: contents }`,
+ * the same technique `<skdx-table>` uses for its native `<table>`. **The pairs
+ * are your own `<dt>`/`<dd>`**, slotted straight into that `<dl>` and
+ * optionally grouped by a plain `<div>` — the one wrapper HTML permits inside a
+ * description list.
+ *
+ * There is deliberately no `<skdx-data-list-item>` / `-label` / `-value`. There
+ * cannot be: a custom element wrapping a `<dt>` is an extra node between the
+ * `<dl>` and its pairs in the *composed* tree, and the description-list
+ * association — in the HTML content model, in axe's `definition-list` /
+ * `dlitem` rules, and in the accessibility tree — is defined on **immediate**
+ * children. `display: contents` takes that node out of layout but not out of
+ * the tree walk. Angular's DataList family is a set of directives on the
+ * consumer's own `<dl>`/`<div>`/`<dt>`/`<dd>` for exactly this reason; this is
+ * the same shape, with the `<dl>` supplied.
+ *
+ * Because there are no elements of ours to carry them, the `item`/`label`/
+ * `value` skin parts are written onto **your** `<div>`/`<dt>`/`<dd>` — see
+ * {@link SkdxDataList.applyChildParts}. Everywhere else in this package a part
+ * lands on a host this package owns; this family is the one place where the
+ * only nodes that exist belong to the consumer, and they are in the light DOM,
+ * so `@skdx/skins` reaches them exactly as it reaches React's.
+ *
+ * Slotted natives stay in *your* document, so style them with ordinary
+ * selectors (`.my-list dt { … }`) — no `::part()` indirection. Only the `<dl>`
+ * lives in the shadow root, exposed as `::part(data-list)`.
+ *
+ * There is no root state for descendants to read: `orientation` is the root's
+ * own styling hook and is not inherited by anything.
+ *
+ * @example
+ * ```html
+ * <skdx-data-list aria-label="Server details">
+ *   <div>
+ *     <dt>Region</dt>
+ *     <dd>eu-west-1</dd>
+ *   </div>
+ * </skdx-data-list>
+ * ```
+ *
+ * @slot - The list's body: `<dt>`/`<dd>` pairs, each optionally wrapped in a
+ * role-less `<div>`. Nothing else belongs here — any other element makes the
+ * `<dl>` invalid and breaks the pairing.
+ *
+ * @csspart data-list - The native `<dl>` element inside the shadow root. It is
+ * `display: contents`, so it is **not a box**: `::part(data-list)` is the hook
+ * for inherited properties and for changing the display type, not for a
+ * background, border, padding or size, all of which are silently dropped on a
+ * contents box. This is deliberate — see the note on the `dl` rule in
+ * {@link SkdxDataList.styles}. React's `<dl>` *is* the grid container; here the
+ * host is, because that is where the `.skdx-data-list` skin class lands, and
+ * only one of the two can be the box if `.skdx-data-list__item`'s `subgrid` is
+ * to resolve. To style the list as a box, style the host
+ * (`skdx-data-list { … }`) — an ordinary selector in your own document, no
+ * `::part()` needed. To give the `<dl>` a box back, set its display first:
+ * `skdx-data-list::part(data-list) { display: block; … }` — which reinstates
+ * the extra grid level and puts the one-column degradation back.
+ */
+export declare class SkdxDataList extends LitElement {
+    /**
+     * Both rules take an element out of layout without taking it out of the
+     * content model or the accessibility tree, which leaves exactly one box for
+     * the whole family — and that box is React's `<dl>`.
+     *
+     * `:host` is the usual "the custom element is not part of the anatomy".
+     *
+     * `dl` is the one that needs justifying. `@skdx/skins` puts
+     * `.skdx-data-list` (`display: grid; grid-template-columns: auto 1fr`) on the
+     * **host**, because that is where {@link applyHostPart} lands every part in
+     * this package, and an outer-tree normal declaration outranks the `:host`
+     * rule here. So the host is the grid container. If the `<dl>` kept a box it
+     * would be that grid's only item, the slotted `.skdx-data-list__item`
+     * wrappers would sit inside a plain block, and their
+     * `grid-template-columns: subgrid` would have no parent grid to inherit
+     * tracks from — computing to `none`, collapsing every pair to one column.
+     * `@skdx/skins` cannot reach into this shadow root to fix that; only this
+     * stylesheet can. It also drops the UA's `1em 0` margin on the `<dl>`, which
+     * the skin's `margin: 0` was likewise unable to reach.
+     *
+     * Cost: `::part(data-list)` is no longer a box — see the class docstring.
+     *
+     * NB no backticks below: a literal backtick inside a `css` tagged template
+     * fails the oxc transform and presents as a mass test failure. Prose that
+     * wants them lives up here, in ordinary JSDoc, not in the CSS.
+     */
+    static styles: import("lit").CSSResult;
+    /**
+     * How each label/value pair reads: `'horizontal'` puts the value beside its
+     * label, `'vertical'` stacks the value under it. Emitted as
+     * `data-orientation` on the inner `<dl>` (and reflected on the host, so
+     * `skdx-data-list[orientation='vertical']::part(data-list)` is selectable)
+     * and nothing else — this library ships no layout CSS, so the value only
+     * changes what your stylesheet can select on, never how the list renders on
+     * its own.
+     * @default 'horizontal' — `data-orientation="horizontal"`; the label/value pair reads as one row.
+     * @example
+     * ```html
+     * <skdx-data-list orientation="vertical">
+     *   <dt>Region</dt>
+     *   <dd>eu-west-1</dd>
+     * </skdx-data-list>
+     * ```
+     */
+    orientation: DataListOrientation;
+    /**
+     * `childList` + `subtree`, and deliberately **not** `attributes`.
+     *
+     * A `slotchange` listener alone would be blind to the shape React produces
+     * (`<div>` wrapper → `<dt>`/`<dd>`): appending a `<dd>` inside a `<div>` that
+     * is already assigned changes nothing about the slot's assignment, so no
+     * `slotchange` fires and that `<dd>` would never get its class. One observer
+     * covers both the flat and the wrapped form.
+     *
+     * Omitting `attributes` is what keeps this from looping: `classList.add()`
+     * writes the `class` attribute even when the token is already present, which
+     * would queue an attribute record and re-enter this callback forever.
+     */
+    private readonly observer;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /**
+     * Writes the `item`/`label`/`value` skin classes onto the consumer's own
+     * light-DOM children.
+     *
+     * Reuses {@link applyHostPart} rather than open-coding two lines: the name
+     * says "host" because that is where every *other* part lands, but the body is
+     * generic and its two guarantees are exactly the ones needed here —
+     * `classList.add` (never `className =`, which would delete the consumer's own
+     * classes on nodes this component does not own) and idempotence, since this
+     * runs again on every mutation and on every re-insertion.
+     *
+     * Both permitted `<dl>` shapes are handled: pairs sitting flat, and pairs
+     * grouped by the one wrapper HTML allows inside a description list. Anything
+     * else is left alone — an unrecognised child means the markup is already
+     * invalid, and silently branding it would only hide that.
+     */
+    private applyChildParts;
+    private applyPairPart;
+    protected updated(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-data-list': SkdxDataList;
+    }
+}

package/dist/data-list/DataList.d.ts

@@ -0,0 +1,155 @@
+import { LitElement } from 'lit';
+/** Orientation of the label/value pairs, emitted as `data-orientation` for the brand layer to lay out. */
+export type DataListOrientation = 'horizontal' | 'vertical';
+/**
+ * `<skdx-data-list>` — the Web Components implementation of the shared DataList
+ * contract (see `@skdx/shared`'s `dataListContract`). A description list of
+ * label/value pairs, and nothing else: no state, no events, no keyboard
+ * interaction. Its entire value is the markup it guarantees.
+ *
+ * Renders a *real* `<dl>` inside shadow DOM with `:host { display: contents }`,
+ * the same technique `<skdx-table>` uses for its native `<table>`. **The pairs
+ * are your own `<dt>`/`<dd>`**, slotted straight into that `<dl>` and
+ * optionally grouped by a plain `<div>` — the one wrapper HTML permits inside a
+ * description list.
+ *
+ * There is deliberately no `<skdx-data-list-item>` / `-label` / `-value`. There
+ * cannot be: a custom element wrapping a `<dt>` is an extra node between the
+ * `<dl>` and its pairs in the *composed* tree, and the description-list
+ * association — in the HTML content model, in axe's `definition-list` /
+ * `dlitem` rules, and in the accessibility tree — is defined on **immediate**
+ * children. `display: contents` takes that node out of layout but not out of
+ * the tree walk. Angular's DataList family is a set of directives on the
+ * consumer's own `<dl>`/`<div>`/`<dt>`/`<dd>` for exactly this reason; this is
+ * the same shape, with the `<dl>` supplied.
+ *
+ * Because there are no elements of ours to carry them, the `item`/`label`/
+ * `value` skin parts are written onto **your** `<div>`/`<dt>`/`<dd>` — see
+ * {@link SkdxDataList.applyChildParts}. Everywhere else in this package a part
+ * lands on a host this package owns; this family is the one place where the
+ * only nodes that exist belong to the consumer, and they are in the light DOM,
+ * so `@skdx/skins` reaches them exactly as it reaches React's.
+ *
+ * Slotted natives stay in *your* document, so style them with ordinary
+ * selectors (`.my-list dt { … }`) — no `::part()` indirection. Only the `<dl>`
+ * lives in the shadow root, exposed as `::part(data-list)`.
+ *
+ * There is no root state for descendants to read: `orientation` is the root's
+ * own styling hook and is not inherited by anything.
+ *
+ * @example
+ * ```html
+ * <skdx-data-list aria-label="Server details">
+ *   <div>
+ *     <dt>Region</dt>
+ *     <dd>eu-west-1</dd>
+ *   </div>
+ * </skdx-data-list>
+ * ```
+ *
+ * @slot - The list's body: `<dt>`/`<dd>` pairs, each optionally wrapped in a
+ * role-less `<div>`. Nothing else belongs here — any other element makes the
+ * `<dl>` invalid and breaks the pairing.
+ *
+ * @csspart data-list - The native `<dl>` element inside the shadow root. It is
+ * `display: contents`, so it is **not a box**: `::part(data-list)` is the hook
+ * for inherited properties and for changing the display type, not for a
+ * background, border, padding or size, all of which are silently dropped on a
+ * contents box. This is deliberate — see the note on the `dl` rule in
+ * {@link SkdxDataList.styles}. React's `<dl>` *is* the grid container; here the
+ * host is, because that is where the `.skdx-data-list` skin class lands, and
+ * only one of the two can be the box if `.skdx-data-list__item`'s `subgrid` is
+ * to resolve. To style the list as a box, style the host
+ * (`skdx-data-list { … }`) — an ordinary selector in your own document, no
+ * `::part()` needed. To give the `<dl>` a box back, set its display first:
+ * `skdx-data-list::part(data-list) { display: block; … }` — which reinstates
+ * the extra grid level and puts the one-column degradation back.
+ */
+export declare class SkdxDataList extends LitElement {
+    /**
+     * Both rules take an element out of layout without taking it out of the
+     * content model or the accessibility tree, which leaves exactly one box for
+     * the whole family — and that box is React's `<dl>`.
+     *
+     * `:host` is the usual "the custom element is not part of the anatomy".
+     *
+     * `dl` is the one that needs justifying. `@skdx/skins` puts
+     * `.skdx-data-list` (`display: grid; grid-template-columns: auto 1fr`) on the
+     * **host**, because that is where {@link applyHostPart} lands every part in
+     * this package, and an outer-tree normal declaration outranks the `:host`
+     * rule here. So the host is the grid container. If the `<dl>` kept a box it
+     * would be that grid's only item, the slotted `.skdx-data-list__item`
+     * wrappers would sit inside a plain block, and their
+     * `grid-template-columns: subgrid` would have no parent grid to inherit
+     * tracks from — computing to `none`, collapsing every pair to one column.
+     * `@skdx/skins` cannot reach into this shadow root to fix that; only this
+     * stylesheet can. It also drops the UA's `1em 0` margin on the `<dl>`, which
+     * the skin's `margin: 0` was likewise unable to reach.
+     *
+     * Cost: `::part(data-list)` is no longer a box — see the class docstring.
+     *
+     * NB no backticks below: a literal backtick inside a `css` tagged template
+     * fails the oxc transform and presents as a mass test failure. Prose that
+     * wants them lives up here, in ordinary JSDoc, not in the CSS.
+     */
+    static styles: import("lit").CSSResult;
+    /**
+     * How each label/value pair reads: `'horizontal'` puts the value beside its
+     * label, `'vertical'` stacks the value under it. Emitted as
+     * `data-orientation` on the inner `<dl>` (and reflected on the host, so
+     * `skdx-data-list[orientation='vertical']::part(data-list)` is selectable)
+     * and nothing else — this library ships no layout CSS, so the value only
+     * changes what your stylesheet can select on, never how the list renders on
+     * its own.
+     * @default 'horizontal' — `data-orientation="horizontal"`; the label/value pair reads as one row.
+     * @example
+     * ```html
+     * <skdx-data-list orientation="vertical">
+     *   <dt>Region</dt>
+     *   <dd>eu-west-1</dd>
+     * </skdx-data-list>
+     * ```
+     */
+    orientation: DataListOrientation;
+    /**
+     * `childList` + `subtree`, and deliberately **not** `attributes`.
+     *
+     * A `slotchange` listener alone would be blind to the shape React produces
+     * (`<div>` wrapper → `<dt>`/`<dd>`): appending a `<dd>` inside a `<div>` that
+     * is already assigned changes nothing about the slot's assignment, so no
+     * `slotchange` fires and that `<dd>` would never get its class. One observer
+     * covers both the flat and the wrapped form.
+     *
+     * Omitting `attributes` is what keeps this from looping: `classList.add()`
+     * writes the `class` attribute even when the token is already present, which
+     * would queue an attribute record and re-enter this callback forever.
+     */
+    private readonly observer;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /**
+     * Writes the `item`/`label`/`value` skin classes onto the consumer's own
+     * light-DOM children.
+     *
+     * Reuses {@link applyHostPart} rather than open-coding two lines: the name
+     * says "host" because that is where every *other* part lands, but the body is
+     * generic and its two guarantees are exactly the ones needed here —
+     * `classList.add` (never `className =`, which would delete the consumer's own
+     * classes on nodes this component does not own) and idempotence, since this
+     * runs again on every mutation and on every re-insertion.
+     *
+     * Both permitted `<dl>` shapes are handled: pairs sitting flat, and pairs
+     * grouped by the one wrapper HTML allows inside a description list. Anything
+     * else is left alone — an unrecognised child means the markup is already
+     * invalid, and silently branding it would only hide that.
+     */
+    private applyChildParts;
+    private applyPairPart;
+    protected updated(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-data-list': SkdxDataList;
+    }
+}

package/dist/data-list/DataList.js

@@ -0,0 +1,12 @@
+var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var d=(o,i,t,a)=>{for(var e=a>1?void 0:a?p(i,t):i,s=o.length-1,l;s>=0;s--)(l=o[s])&&(e=(a?l(i,t,e):l(e))||e);return a&&e&&c(i,t,e),e};import{css as h,html as v,LitElement as m}from"lit";import{property as b}from"lit/decorators.js";import{customElement as f}from"../internal/define.js";import{applyHostPart as n,reflectHostState as y}from"../internal/part.js";var r=class extends m{constructor(){super(...arguments);this.orientation="horizontal";this.observer=new MutationObserver(()=>this.applyChildParts())}connectedCallback(){super.connectedCallback(),this.observer.observe(this,{childList:!0,subtree:!0}),this.applyChildParts()}disconnectedCallback(){this.observer.disconnect(),super.disconnectedCallback()}applyChildParts(){for(let t of this.children)if(t.localName==="div"){n(t,"data-list","item");for(let a of t.children)this.applyPairPart(a)}else this.applyPairPart(t)}applyPairPart(t){t.localName==="dt"?n(t,"data-list","label"):t.localName==="dd"&&n(t,"data-list","value")}updated(){y(this,{"data-orientation":this.orientation})}render(){return v`<dl part="data-list" data-orientation=${this.orientation}>
+      <slot></slot>
+    </dl>`}};r.styles=h`
+    :host {
+      display: contents;
+    }
+    /* Makes the host the single grid container, so .skdx-data-list__item's
+       subgrid resolves. See the JSDoc above; do not remove. */
+    dl {
+      display: contents;
+    }
+  `,d([b({type:String,reflect:!0})],r.prototype,"orientation",2),r=d([f("skdx-data-list","data-list","root")],r);export{r as SkdxDataList};

package/dist/data-list/index.cjs

@@ -0,0 +1 @@
+"use strict";var r=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var D=Object.prototype.hasOwnProperty;var L=(a,t)=>{for(var o in t)r(a,o,{get:t[o],enumerable:!0})},f=(a,t,o,e)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of x(t))!D.call(a,i)&&i!==o&&r(a,i,{get:()=>t[i],enumerable:!(e=s(t,i))||e.enumerable});return a};var m=a=>f(r({},"__esModule",{value:!0}),a);var n={};L(n,{SkdxDataList:()=>p.SkdxDataList});module.exports=m(n);var p=require("./DataList.cjs");0&&(module.exports={SkdxDataList});

package/dist/data-list/index.d.cts

@@ -0,0 +1,2 @@
+export { SkdxDataList } from './DataList.cjs';
+export type { DataListOrientation } from './DataList.cjs';

package/dist/data-list/index.d.ts

@@ -0,0 +1,2 @@
+export { SkdxDataList } from './DataList.js';
+export type { DataListOrientation } from './DataList.js';

package/dist/data-list/index.js

@@ -0,0 +1 @@
+import{SkdxDataList as i}from"./DataList.js";export{i as SkdxDataList};

package/dist/date-field/DateField.cjs

@@ -0,0 +1 @@
+"use strict";var o=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var T=Object.prototype.hasOwnProperty;var V=(n,s)=>{for(var e in s)o(n,e,{get:s[e],enumerable:!0})},C=(n,s,e,l)=>{if(s&&typeof s=="object"||typeof s=="function")for(let t of b(s))!T.call(n,t)&&t!==e&&o(n,t,{get:()=>s[t],enumerable:!(l=m(s,t))||l.enumerable});return n};var L=n=>C(o({},"__esModule",{value:!0}),n),a=(n,s,e,l)=>{for(var t=l>1?void 0:l?m(s,e):s,h=n.length-1,c;h>=0;h--)(c=n[h])&&(t=(l?c(s,e,t):c(t))||t);return l&&t&&o(s,e,t),t};var S={};V(S,{SkdxDateField:()=>r});module.exports=L(S);var y=require("lit"),i=require("lit/decorators.js"),p=require("../field/field-core.cjs"),u=require("../internal/date-segments.cjs"),d=require("../internal/define.cjs"),g=require("../internal/form-associated.cjs"),v=require("../internal/segmented-field.cjs"),f=require("../internal/styles.cjs");var r=class extends(0,g.FormAssociated)(y.LitElement){constructor(){super(...arguments);this.value=null;this.granularity="day";this.disabled=!1;this.readOnly=!1;this.invalid=!1;this.required=!1;this.ariaLabel=null;this.values={};this.buffer={current:0};this.defaultValue=null;this.handleValuesChange=e=>{this.values=e;let l=this.dateOf(e),t=this.value?this.value.getTime():null;(l?l.getTime():null)!==t&&this.setValue(l)}}get cycle(){return(0,u.resolveHourCycle)(this.locale,this.hourCycle)}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),(0,f.installLightDomStyles)(),this.setAttribute(p.FIELD_CONTROL_ATTRIBUTE,"")}firstUpdated(){this.defaultValue=this.value,this.syncFormState()}willUpdate(e){(e.has("value")||e.has("hourCycle")||e.has("locale"))&&this.syncSegments()}updated(e){(e.has("value")||e.has("required")||e.has("granularity"))&&this.syncFormState()}dateOf(e){return(0,u.isComplete)((0,u.buildSegments)({kind:"date",granularity:this.granularity,locale:this.locale,hourCycle:this.cycle,values:e}))?(0,u.valuesToDate)(e,this.cycle):null}syncSegments(){let e=this.cycle,l=this.value?this.value.getTime():null,t=this.dateOf(this.values);if(l===null){t!==null&&(this.values={});return}t!==null&&t.getTime()===l||(this.values=(0,u.dateToValues)(new Date(l),e))}syncFormState(){this.setFormValue(this.value?(0,u.dateToFormValue)(this.value,this.granularity):""),this.setValueMissing(this.required&&this.value===null,"Please enter a date.",this.querySelector("[data-segment]"))}formResetCallback(){this.value=this.defaultValue}setValue(e){this.value=e,this.dispatchEvent(new CustomEvent("value-change",{detail:e,bubbles:!0,composed:!0}))}render(){return(0,v.renderSegmentedField)({host:this,kind:"date",part:"date-field",granularity:this.granularity,locale:this.locale,hourCycle:this.cycle,values:this.values,label:this.ariaLabel,getSegmentLabel:this.getSegmentLabel,emptySegmentText:this.emptySegmentText,disabled:this.disabled,readOnly:this.readOnly,invalid:this.invalid,required:this.required,buffer:this.buffer,onValuesChange:this.handleValuesChange})}};a([(0,i.property)({attribute:!1})],r.prototype,"value",2),a([(0,i.property)({type:String,reflect:!0})],r.prototype,"granularity",2),a([(0,i.property)({type:Number,attribute:"hour-cycle"})],r.prototype,"hourCycle",2),a([(0,i.property)({type:String})],r.prototype,"locale",2),a([(0,i.property)({type:Boolean,reflect:!0})],r.prototype,"disabled",2),a([(0,i.property)({type:Boolean,reflect:!0,attribute:"read-only"})],r.prototype,"readOnly",2),a([(0,i.property)({type:Boolean,reflect:!0})],r.prototype,"invalid",2),a([(0,i.property)({type:Boolean,reflect:!0})],r.prototype,"required",2),a([(0,i.property)({type:String,reflect:!0})],r.prototype,"name",2),a([(0,i.property)({attribute:"required-message"})],r.prototype,"requiredMessage",2),a([(0,i.property)({type:String,attribute:"aria-label"})],r.prototype,"ariaLabel",2),a([(0,i.property)({attribute:!1})],r.prototype,"getSegmentLabel",2),a([(0,i.property)({type:String,attribute:"empty-segment-text"})],r.prototype,"emptySegmentText",2),a([(0,i.state)()],r.prototype,"values",2),r=a([(0,d.customElement)("skdx-date-field","date-field","root")],r);0&&(module.exports={SkdxDateField});