@skdx/web-components 0.27.0 → 0.29.0

package/dist/steps/Steps.js

@@ -1,27 +0,0 @@
-var h=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var r=(o,a,e,t)=>{for(var n=t>1?void 0:t?p(a,e):a,l=o.length-1,d;l>=0;l--)(d=o[l])&&(n=(t?d(a,e,n):d(n))||n);return t&&n&&h(a,e,n),n};import{css as u,html as c,LitElement as m}from"lit";import{property as s,state as f}from"lit/decorators.js";import{customElement as g}from"../internal/define.js";import{reflectHostState as b}from"../internal/part.js";import{canActivateStep as v}from"./steps-core.js";var i=class extends m{constructor(){super(...arguments);this.orientation="horizontal";this.navigationMode="linear";this.completedLabel="Completed";this.currentLabel="Current step";this.incompleteLabel="Not completed";this.disabledLabel="Disabled";this._items=[];this._triggers=new Set}connectedCallback(){super.connectedCallback(),this._uncontrolledValue===void 0&&(this._uncontrolledValue=this.defaultValue)}getCurrentValue(){return this.value!==void 0?this.value:this._uncontrolledValue}statusLabel(e){return e==="completed"?this.completedLabel:e==="current"?this.currentLabel:e==="disabled"?this.disabledLabel:this.incompleteLabel}getItemState(e){return this._resolveItems().find(t=>t.value===e)}canActivate(e){return v(this._resolveItems(),e,this.getCurrentValue(),this.navigationMode)}activate(e){this.canActivate(e)&&this.getCurrentValue()!==e&&(this.value===void 0&&(this._uncontrolledValue=e),this.dispatchEvent(new CustomEvent("value-change",{detail:e,bubbles:!0,composed:!0})),this._refreshDescendants())}registerItem(e){this._items.push(e)}unregisterItem(e){let t=this._items.indexOf(e);t!==-1&&this._items.splice(t,1)}registerTrigger(e){this._triggers.add(e)}unregisterTrigger(e){this._triggers.delete(e)}refreshDescendants(e){this._refreshDescendants(e)}_resolveItems(){return this._items.map(e=>({value:e.value,completed:e.completed,disabled:e.disabled}))}_refreshDescendants(e){for(let t of this._items)t!==e&&t.refresh();for(let t of this._triggers)t!==e&&t.refresh()}updated(e){(e.has("value")||e.has("navigationMode")||e.has("orientation"))&&this._refreshDescendants(),b(this,{"data-orientation":this.orientation})}render(){return c`<ol part="steps" data-orientation=${this.orientation}>
-      <slot></slot>
-    </ol>`}};i.styles=u`
-    :host {
-      display: contents;
-    }
-
-    /*
-     * steps.css lays the strip out on .skdx-steps — the host here — but the
-     * slotted items are children of *this* list in the flattened tree, not of
-     * the host. So the skin's flex container held exactly one item (this
-     * <ol>), and the UA's block-level list stacked every step on its own
-     * line, indented by the UA's 40px list padding. Inheriting the container
-     * properties keeps the skin authoritative: the layout is still declared
-     * once, in the stylesheet, and this list only mirrors it — including the
-     * column direction the skin switches to for data-orientation=vertical.
-     */
-    ol {
-      display: inherit;
-      flex-direction: inherit;
-      align-items: inherit;
-      gap: inherit;
-      margin: 0;
-      padding: 0;
-      list-style: none;
-    }
-  `,r([s({type:String})],i.prototype,"value",2),r([s({type:String,attribute:"default-value"})],i.prototype,"defaultValue",2),r([s({type:String,reflect:!0})],i.prototype,"orientation",2),r([s({type:String,attribute:"navigation-mode"})],i.prototype,"navigationMode",2),r([s({type:String,attribute:"completed-label"})],i.prototype,"completedLabel",2),r([s({type:String,attribute:"current-label"})],i.prototype,"currentLabel",2),r([s({type:String,attribute:"incomplete-label"})],i.prototype,"incompleteLabel",2),r([s({type:String,attribute:"disabled-label"})],i.prototype,"disabledLabel",2),r([f()],i.prototype,"_uncontrolledValue",2),i=r([g("skdx-steps","steps","root")],i);export{i as SkdxSteps};

package/dist/steps/StepsItem.cjs

@@ -1,8 +0,0 @@
-"use strict";var d=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var y=(i,e)=>{for(var t in e)d(i,t,{get:e[t],enumerable:!0})},k=(i,e,t,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of v(e))!f.call(i,s)&&s!==t&&d(i,s,{get:()=>e[s],enumerable:!(a=h(e,s))||a.enumerable});return i};var A=i=>k(d({},"__esModule",{value:!0}),i),l=(i,e,t,a)=>{for(var s=a>1?void 0:a?h(e,t):e,c=i.length-1,u;c>=0;c--)(u=i[c])&&(s=(a?u(e,t,s):u(s))||s);return a&&s&&d(e,t,s),s};var g={};y(g,{SkdxStepsItem:()=>r});module.exports=A(g);var o=require("lit"),n=require("lit/decorators.js"),p=require("../internal/define.cjs"),m=require("../internal/styles.cjs"),C=require("../utils/visually-hidden.cjs"),b=require("./steps-core.cjs");var r=class extends o.LitElement{constructor(){super(...arguments);this.value="";this.completed=!1;this.disabled=!1}connectedCallback(){super.connectedCallback(),this.setAttribute("role","listitem"),this.closest("skdx-steps")?.registerItem(this),this._sync()}disconnectedCallback(){super.disconnectedCallback(),this.closest("skdx-steps")?.unregisterItem(this)}refresh(){this._sync(),this.requestUpdate()}get status(){let t=this.closest("skdx-steps");return(0,b.stepStatus)({completed:this.completed,disabled:this.disabled},t?.getCurrentValue()===this.value)}_sync(){let t=this.status;this.setAttribute("data-status",t),this.setAttribute("data-value",this.value),this.setAttribute("data-orientation",this.closest("skdx-steps")?.orientation??"horizontal"),this.disabled?this.setAttribute("data-disabled",""):this.removeAttribute("data-disabled"),t==="current"?this.setAttribute("aria-current","step"):this.removeAttribute("aria-current")}updated(t){this._sync(),(t.has("completed")||t.has("disabled"))&&this.closest("skdx-steps")?.refreshDescendants(this)}render(){let t=this.status;return o.html`<slot></slot>
-      <skdx-visually-hidden data-status-text=${t}
-        >${this.closest("skdx-steps")?.statusLabel(t)??""}</skdx-visually-hidden
-      >`}};r.styles=[m.hiddenHostStyles,o.css`
-      :host {
-        display: block;
-      }
-    `],l([(0,n.property)({type:String,reflect:!0})],r.prototype,"value",2),l([(0,n.property)({type:Boolean,reflect:!0})],r.prototype,"completed",2),l([(0,n.property)({type:Boolean,reflect:!0})],r.prototype,"disabled",2),r=l([(0,p.customElement)("skdx-steps-item","steps","item")],r);0&&(module.exports={SkdxStepsItem});

package/dist/steps/StepsItem.d.cts

@@ -1,51 +0,0 @@
-import { LitElement } from 'lit';
-import '../utils/visually-hidden.cjs';
-import { type StepStatus } from './steps-core.cjs';
-/**
- * `<skdx-steps-item>` — a single step. Sets `role="listitem"` on the host (it
- * isn't a real `<li>`, since the ancestor `<skdx-steps>`' real `<ol>` lives
- * inside that element's own shadow root and this element is merely slotted
- * into it), together with `data-status`, `aria-current="step"` while it is
- * the current step, and `data-disabled`.
- *
- * Its visually-hidden status element lives in this element's shadow root, so
- * the status reaches assistive tech as text rather than only as colour or
- * position.
- *
- * @example
- * ```html
- * <skdx-steps-item value="shipping" completed>Shipping</skdx-steps-item>
- * ```
- */
-export declare class SkdxStepsItem extends LitElement {
-    static styles: import("lit").CSSResult[];
-    /** Unique identifier matched against the root's `value` and a `<skdx-steps-trigger>`'s `value`. */
-    value: string;
-    /**
-     * Whether this step has been completed. Drives `data-status` and, in linear
-     * mode, which steps a trigger may activate.
-     * @default false
-     */
-    completed: boolean;
-    /**
-     * Whether this step can be activated at all. A disabled step's trigger
-     * leaves the tab order and refuses activation, but the step does not move
-     * the linear frontier.
-     * @default false
-     */
-    disabled: boolean;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    /** @internal Called by the parent `<skdx-steps>` whenever the current step changes. */
-    refresh(): void;
-    /** @internal The step's resolved status, also used for its visually-hidden label. */
-    get status(): StepStatus;
-    private _sync;
-    protected updated(changed: Map<string, unknown>): void;
-    render(): import("lit").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'skdx-steps-item': SkdxStepsItem;
-    }
-}

package/dist/steps/StepsItem.d.ts

@@ -1,51 +0,0 @@
-import { LitElement } from 'lit';
-import '../utils/visually-hidden.js';
-import { type StepStatus } from './steps-core.js';
-/**
- * `<skdx-steps-item>` — a single step. Sets `role="listitem"` on the host (it
- * isn't a real `<li>`, since the ancestor `<skdx-steps>`' real `<ol>` lives
- * inside that element's own shadow root and this element is merely slotted
- * into it), together with `data-status`, `aria-current="step"` while it is
- * the current step, and `data-disabled`.
- *
- * Its visually-hidden status element lives in this element's shadow root, so
- * the status reaches assistive tech as text rather than only as colour or
- * position.
- *
- * @example
- * ```html
- * <skdx-steps-item value="shipping" completed>Shipping</skdx-steps-item>
- * ```
- */
-export declare class SkdxStepsItem extends LitElement {
-    static styles: import("lit").CSSResult[];
-    /** Unique identifier matched against the root's `value` and a `<skdx-steps-trigger>`'s `value`. */
-    value: string;
-    /**
-     * Whether this step has been completed. Drives `data-status` and, in linear
-     * mode, which steps a trigger may activate.
-     * @default false
-     */
-    completed: boolean;
-    /**
-     * Whether this step can be activated at all. A disabled step's trigger
-     * leaves the tab order and refuses activation, but the step does not move
-     * the linear frontier.
-     * @default false
-     */
-    disabled: boolean;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    /** @internal Called by the parent `<skdx-steps>` whenever the current step changes. */
-    refresh(): void;
-    /** @internal The step's resolved status, also used for its visually-hidden label. */
-    get status(): StepStatus;
-    private _sync;
-    protected updated(changed: Map<string, unknown>): void;
-    render(): import("lit").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'skdx-steps-item': SkdxStepsItem;
-    }
-}

package/dist/steps/StepsItem.js

@@ -1,8 +0,0 @@
-var c=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var r=(o,i,t,a)=>{for(var s=a>1?void 0:a?u(i,t):i,l=o.length-1,d;l>=0;l--)(d=o[l])&&(s=(a?d(i,t,s):d(s))||s);return a&&s&&c(i,t,s),s};import{css as h,html as p,LitElement as m}from"lit";import{property as n}from"lit/decorators.js";import{customElement as b}from"../internal/define.js";import{hiddenHostStyles as v}from"../internal/styles.js";import"../utils/visually-hidden.js";import{stepStatus as f}from"./steps-core.js";var e=class extends m{constructor(){super(...arguments);this.value="";this.completed=!1;this.disabled=!1}connectedCallback(){super.connectedCallback(),this.setAttribute("role","listitem"),this.closest("skdx-steps")?.registerItem(this),this._sync()}disconnectedCallback(){super.disconnectedCallback(),this.closest("skdx-steps")?.unregisterItem(this)}refresh(){this._sync(),this.requestUpdate()}get status(){let t=this.closest("skdx-steps");return f({completed:this.completed,disabled:this.disabled},t?.getCurrentValue()===this.value)}_sync(){let t=this.status;this.setAttribute("data-status",t),this.setAttribute("data-value",this.value),this.setAttribute("data-orientation",this.closest("skdx-steps")?.orientation??"horizontal"),this.disabled?this.setAttribute("data-disabled",""):this.removeAttribute("data-disabled"),t==="current"?this.setAttribute("aria-current","step"):this.removeAttribute("aria-current")}updated(t){this._sync(),(t.has("completed")||t.has("disabled"))&&this.closest("skdx-steps")?.refreshDescendants(this)}render(){let t=this.status;return p`<slot></slot>
-      <skdx-visually-hidden data-status-text=${t}
-        >${this.closest("skdx-steps")?.statusLabel(t)??""}</skdx-visually-hidden
-      >`}};e.styles=[v,h`
-      :host {
-        display: block;
-      }
-    `],r([n({type:String,reflect:!0})],e.prototype,"value",2),r([n({type:Boolean,reflect:!0})],e.prototype,"completed",2),r([n({type:Boolean,reflect:!0})],e.prototype,"disabled",2),e=r([b("skdx-steps-item","steps","item")],e);export{e as SkdxStepsItem};

package/dist/steps/StepsTrigger.cjs

@@ -1,9 +0,0 @@
-"use strict";var o=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var k=(i,e)=>{for(var t in e)o(i,t,{get:e[t],enumerable:!0})},y=(i,e,t,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of p(e))!m.call(i,s)&&s!==t&&o(i,s,{get:()=>e[s],enumerable:!(a=h(e,s))||a.enumerable});return i};var f=i=>y(o({},"__esModule",{value:!0}),i),c=(i,e,t,a)=>{for(var s=a>1?void 0:a?h(e,t):e,r=i.length-1,n;r>=0;r--)(n=i[r])&&(s=(a?n(e,t,s):n(s))||s);return a&&s&&o(e,t,s),s};var _={};k(_,{SkdxStepsTrigger:()=>d});module.exports=f(_);var l=require("lit"),u=require("lit/decorators.js"),v=require("../internal/define.cjs"),b=require("./steps-core.cjs");var d=class extends l.LitElement{constructor(){super(...arguments);this.value="";this._handleClick=()=>{this.closest("skdx-steps")?.activate(this.value)};this._handleKeydown=t=>{t.key!==" "&&t.key!=="Enter"||(t.preventDefault(),this.closest("skdx-steps")?.activate(this.value))}}connectedCallback(){super.connectedCallback(),this.closest("skdx-steps")?.registerTrigger(this),this.addEventListener("click",this._handleClick),this.addEventListener("keydown",this._handleKeydown),this._sync()}disconnectedCallback(){super.disconnectedCallback(),this.closest("skdx-steps")?.unregisterTrigger(this),this.removeEventListener("click",this._handleClick),this.removeEventListener("keydown",this._handleKeydown)}refresh(){this._sync()}get _disabled(){return this.closest("skdx-steps")?.getItemState(this.value)?.disabled??!1}get _blocked(){let t=this.closest("skdx-steps");return!this._disabled&&!(t?.canActivate(this.value)??!1)}_sync(){let t=this.closest("skdx-steps"),a=t?.getItemState(this.value),s=(0,b.stepStatus)({completed:a?.completed??!1,disabled:a?.disabled??!1},t?.getCurrentValue()===this.value);this.setAttribute("role","button"),this.setAttribute("data-status",s),this.setAttribute("data-value",this.value),this.setAttribute("data-orientation",t?.orientation??"horizontal");let r=this._disabled;r?this.setAttribute("data-disabled",""):this.removeAttribute("data-disabled"),r||this._blocked?this.setAttribute("aria-disabled","true"):this.removeAttribute("aria-disabled"),this.setAttribute("tabindex",r?"-1":"0")}updated(){this._sync()}render(){return l.html`<slot></slot>`}};d.styles=l.css`
-    :host {
-      display: inline-block;
-      cursor: pointer;
-    }
-    :host([data-disabled]) {
-      cursor: default;
-    }
-  `,c([(0,u.property)({type:String,reflect:!0})],d.prototype,"value",2),d=c([(0,v.customElement)("skdx-steps-trigger","steps","trigger")],d);0&&(module.exports={SkdxStepsTrigger});

package/dist/steps/StepsTrigger.d.cts

@@ -1,41 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * `<skdx-steps-trigger>` — the optional interactive control that makes a step
- * navigable. Sets `role="button"`, `tabindex` and the state attributes on
- * **itself** (the host) rather than on a shadow-internal `<button>`, the same
- * way `<skdx-tabs-trigger>` does, so the control the user focuses is the
- * element the consumer styles and queries.
- *
- * A step the navigation mode blocks stays focusable and readable but reports
- * `aria-disabled="true"` and refuses activation; a step whose
- * `<skdx-steps-item>` is `disabled` reports `aria-disabled="true"` *and* leaves
- * the tab order.
- *
- * @example
- * ```html
- * <skdx-steps-item value="payment">
- *   <skdx-steps-trigger value="payment">Payment</skdx-steps-trigger>
- * </skdx-steps-item>
- * ```
- */
-export declare class SkdxStepsTrigger extends LitElement {
-    static styles: import("lit").CSSResult;
-    /** The owning `<skdx-steps-item>`'s `value` — the step this trigger activates. */
-    value: string;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    /** @internal Called by the parent `<skdx-steps>` whenever the current step or the registry changes. */
-    refresh(): void;
-    private get _disabled();
-    private get _blocked();
-    private _sync;
-    private readonly _handleClick;
-    private readonly _handleKeydown;
-    protected updated(): void;
-    render(): import("lit").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'skdx-steps-trigger': SkdxStepsTrigger;
-    }
-}

package/dist/steps/StepsTrigger.d.ts

@@ -1,41 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * `<skdx-steps-trigger>` — the optional interactive control that makes a step
- * navigable. Sets `role="button"`, `tabindex` and the state attributes on
- * **itself** (the host) rather than on a shadow-internal `<button>`, the same
- * way `<skdx-tabs-trigger>` does, so the control the user focuses is the
- * element the consumer styles and queries.
- *
- * A step the navigation mode blocks stays focusable and readable but reports
- * `aria-disabled="true"` and refuses activation; a step whose
- * `<skdx-steps-item>` is `disabled` reports `aria-disabled="true"` *and* leaves
- * the tab order.
- *
- * @example
- * ```html
- * <skdx-steps-item value="payment">
- *   <skdx-steps-trigger value="payment">Payment</skdx-steps-trigger>
- * </skdx-steps-item>
- * ```
- */
-export declare class SkdxStepsTrigger extends LitElement {
-    static styles: import("lit").CSSResult;
-    /** The owning `<skdx-steps-item>`'s `value` — the step this trigger activates. */
-    value: string;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    /** @internal Called by the parent `<skdx-steps>` whenever the current step or the registry changes. */
-    refresh(): void;
-    private get _disabled();
-    private get _blocked();
-    private _sync;
-    private readonly _handleClick;
-    private readonly _handleKeydown;
-    protected updated(): void;
-    render(): import("lit").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'skdx-steps-trigger': SkdxStepsTrigger;
-    }
-}

package/dist/steps/StepsTrigger.js

@@ -1,9 +0,0 @@
-var n=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var o=(d,r,t,s)=>{for(var e=s>1?void 0:s?c(r,t):r,i=d.length-1,l;i>=0;i--)(l=d[i])&&(e=(s?l(r,t,e):l(e))||e);return s&&e&&n(r,t,e),e};import{css as h,html as u,LitElement as v}from"lit";import{property as b}from"lit/decorators.js";import{customElement as p}from"../internal/define.js";import{stepStatus as m}from"./steps-core.js";var a=class extends v{constructor(){super(...arguments);this.value="";this._handleClick=()=>{this.closest("skdx-steps")?.activate(this.value)};this._handleKeydown=t=>{t.key!==" "&&t.key!=="Enter"||(t.preventDefault(),this.closest("skdx-steps")?.activate(this.value))}}connectedCallback(){super.connectedCallback(),this.closest("skdx-steps")?.registerTrigger(this),this.addEventListener("click",this._handleClick),this.addEventListener("keydown",this._handleKeydown),this._sync()}disconnectedCallback(){super.disconnectedCallback(),this.closest("skdx-steps")?.unregisterTrigger(this),this.removeEventListener("click",this._handleClick),this.removeEventListener("keydown",this._handleKeydown)}refresh(){this._sync()}get _disabled(){return this.closest("skdx-steps")?.getItemState(this.value)?.disabled??!1}get _blocked(){let t=this.closest("skdx-steps");return!this._disabled&&!(t?.canActivate(this.value)??!1)}_sync(){let t=this.closest("skdx-steps"),s=t?.getItemState(this.value),e=m({completed:s?.completed??!1,disabled:s?.disabled??!1},t?.getCurrentValue()===this.value);this.setAttribute("role","button"),this.setAttribute("data-status",e),this.setAttribute("data-value",this.value),this.setAttribute("data-orientation",t?.orientation??"horizontal");let i=this._disabled;i?this.setAttribute("data-disabled",""):this.removeAttribute("data-disabled"),i||this._blocked?this.setAttribute("aria-disabled","true"):this.removeAttribute("aria-disabled"),this.setAttribute("tabindex",i?"-1":"0")}updated(){this._sync()}render(){return u`<slot></slot>`}};a.styles=h`
-    :host {
-      display: inline-block;
-      cursor: pointer;
-    }
-    :host([data-disabled]) {
-      cursor: default;
-    }
-  `,o([b({type:String,reflect:!0})],a.prototype,"value",2),a=o([p("skdx-steps-trigger","steps","trigger")],a);export{a as SkdxStepsTrigger};

package/dist/steps/index.cjs

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

package/dist/steps/index.d.cts

@@ -1,4 +0,0 @@
-export { SkdxSteps } from './Steps.cjs';
-export { SkdxStepsItem } from './StepsItem.cjs';
-export { SkdxStepsTrigger } from './StepsTrigger.cjs';
-export type { StepStatus, StepsOrientation, StepsNavigationMode, StepsItemState } from './steps-core.cjs';

package/dist/steps/index.d.ts

@@ -1,4 +0,0 @@
-export { SkdxSteps } from './Steps.js';
-export { SkdxStepsItem } from './StepsItem.js';
-export { SkdxStepsTrigger } from './StepsTrigger.js';
-export type { StepStatus, StepsOrientation, StepsNavigationMode, StepsItemState } from './steps-core.js';

package/dist/steps/index.js

@@ -1 +0,0 @@
-import{SkdxSteps as p}from"./Steps.js";import{SkdxStepsItem as r}from"./StepsItem.js";import{SkdxStepsTrigger as s}from"./StepsTrigger.js";export{p as SkdxSteps,r as SkdxStepsItem,s as SkdxStepsTrigger};

package/dist/steps/steps-core.cjs

@@ -1 +0,0 @@
-"use strict";var i=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var u=(t,e)=>{for(var r in e)i(t,r,{get:e[r],enumerable:!0})},s=(t,e,r,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of p(e))!d.call(t,n)&&n!==r&&i(t,n,{get:()=>e[n],enumerable:!(o=l(e,n))||o.enumerable});return t};var c=t=>s(i({},"__esModule",{value:!0}),t);var m={};u(m,{canActivateStep:()=>f,stepStatus:()=>S});module.exports=c(m);function S(t,e){return e?"current":t.completed?"completed":t.disabled?"disabled":"incomplete"}function f(t,e,r,o){let n=t.find(a=>a.value===e);return!n||n.disabled?!1:o==="non-linear"||n.completed||n.value===r?!0:t.find(a=>!a.completed)?.value===e}0&&(module.exports={canActivateStep,stepStatus});

package/dist/steps/steps-core.d.cts

@@ -1,30 +0,0 @@
-/** The four mutually exclusive statuses a single step can be in. */
-export type StepStatus = 'completed' | 'current' | 'incomplete' | 'disabled';
-/** Layout axis of a Steps list: side-by-side (`'horizontal'`) or stacked (`'vertical'`). */
-export type StepsOrientation = 'horizontal' | 'vertical';
-/**
- * How far a `<skdx-steps-trigger>` may jump. `'linear'` allows completed steps,
- * the current step, and the first not-yet-completed step (the frontier);
- * `'non-linear'` allows any step that is not itself disabled.
- */
-export type StepsNavigationMode = 'linear' | 'non-linear';
-/** A step's completion/disabled state at one moment in time. */
-export interface StepsItemState {
-    value: string;
-    completed: boolean;
-    disabled: boolean;
-}
-/**
- * @internal The one place a step's four-way status is derived, so every part
- * agrees. Precedence is `current` → `completed` → `disabled` → `incomplete`:
- * a completed-but-disabled step still announces "Completed", because being
- * unreachable is already conveyed by the trigger's disabled state.
- */
-export declare function stepStatus(item: Omit<StepsItemState, 'value'>, current: boolean): StepStatus;
-/**
- * @internal The whole of linear-mode enforcement. A step is reachable when it
- * is already completed, is the current step, or is the *frontier* — the first
- * step that is not yet completed. A disabled step never activates, but it is
- * not a wall either: it does not shift the frontier past itself.
- */
-export declare function canActivateStep(items: readonly StepsItemState[], value: string, currentValue: string | undefined, navigationMode: StepsNavigationMode): boolean;

package/dist/steps/steps-core.d.ts

@@ -1,30 +0,0 @@
-/** The four mutually exclusive statuses a single step can be in. */
-export type StepStatus = 'completed' | 'current' | 'incomplete' | 'disabled';
-/** Layout axis of a Steps list: side-by-side (`'horizontal'`) or stacked (`'vertical'`). */
-export type StepsOrientation = 'horizontal' | 'vertical';
-/**
- * How far a `<skdx-steps-trigger>` may jump. `'linear'` allows completed steps,
- * the current step, and the first not-yet-completed step (the frontier);
- * `'non-linear'` allows any step that is not itself disabled.
- */
-export type StepsNavigationMode = 'linear' | 'non-linear';
-/** A step's completion/disabled state at one moment in time. */
-export interface StepsItemState {
-    value: string;
-    completed: boolean;
-    disabled: boolean;
-}
-/**
- * @internal The one place a step's four-way status is derived, so every part
- * agrees. Precedence is `current` → `completed` → `disabled` → `incomplete`:
- * a completed-but-disabled step still announces "Completed", because being
- * unreachable is already conveyed by the trigger's disabled state.
- */
-export declare function stepStatus(item: Omit<StepsItemState, 'value'>, current: boolean): StepStatus;
-/**
- * @internal The whole of linear-mode enforcement. A step is reachable when it
- * is already completed, is the current step, or is the *frontier* — the first
- * step that is not yet completed. A disabled step never activates, but it is
- * not a wall either: it does not shift the frontier past itself.
- */
-export declare function canActivateStep(items: readonly StepsItemState[], value: string, currentValue: string | undefined, navigationMode: StepsNavigationMode): boolean;

package/dist/steps/steps-core.js

@@ -1 +0,0 @@
-function i(e,t){return t?"current":e.completed?"completed":e.disabled?"disabled":"incomplete"}function l(e,t,o,a){let n=e.find(r=>r.value===t);return!n||n.disabled?!1:a==="non-linear"||n.completed||n.value===o?!0:e.find(r=>!r.completed)?.value===t}export{l as canActivateStep,i as stepStatus};

package/dist/tag/Tag.cjs

@@ -1,5 +0,0 @@
-"use strict";var l=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var g=(i,e)=>{for(var s in e)l(i,s,{get:e[s],enumerable:!0})},E=(i,e,s,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of m(e))!y.call(i,t)&&t!==s&&l(i,t,{get:()=>e[t],enumerable:!(o=b(e,t))||o.enumerable});return i};var A=i=>E(l({},"__esModule",{value:!0}),i),a=(i,e,s,o)=>{for(var t=o>1?void 0:o?b(e,s):e,p=i.length-1,h;p>=0;p--)(h=i[p])&&(t=(o?h(e,s,t):h(t))||t);return o&&t&&l(e,s,t),t};var f={};g(f,{SkdxTag:()=>r,TAG_UPDATE_EVENT:()=>v});module.exports=A(f);var d=require("lit"),u=require("lit/decorators.js"),c=require("../internal/define.cjs"),n=require("../tag-group/TagGroup.cjs");var v="skdx-tag-internal-update",r=class extends d.LitElement{constructor(){super(...arguments);this.index=0;this.value="";this.disabled=!1;this.group=null;this.handleGroupUpdate=()=>{this.syncHostAttributes(),this.requestUpdate()};this.handleKeydown=s=>{s.key!=="Delete"&&s.key!=="Backspace"||(s.preventDefault(),this.requestDelete())}}connectedCallback(){if(super.connectedCallback(),this.group=this.closest("skdx-tag-group"),!this.group)throw new Error("<skdx-tag> must be used inside <skdx-tag-group>.");this.setAttribute("role","listitem"),this.setAttribute("data-skdx-tag",""),this.hasAttribute("tabindex")||this.setAttribute("tabindex","-1"),this.group.addEventListener(n.TAG_GROUP_UPDATE_EVENT,this.handleGroupUpdate),this.addEventListener("keydown",this.handleKeydown),this.syncHostAttributes(),this.group.syncTabStops()}disconnectedCallback(){this.group?.removeEventListener(n.TAG_GROUP_UPDATE_EVENT,this.handleGroupUpdate),this.removeEventListener("keydown",this.handleKeydown),super.disconnectedCallback(),this.group?.syncTabStops()}updated(){this.syncHostAttributes(),this.dispatchEvent(new CustomEvent(v))}syncHostAttributes(){this.isDisabled?this.setAttribute("data-disabled",""):this.removeAttribute("data-disabled")}get isDisabled(){return this.disabled||!!this.group?.disabled}requestDelete(){this.isDisabled||(this.group?.setActiveIndex((0,n.focusTagNeighbor)(this,this.index)),this.dispatchEvent(new CustomEvent("delete",{bubbles:!0,composed:!0})))}render(){return d.html`<slot></slot>`}};r.styles=d.css`
-    :host {
-      display: inline-block;
-    }
-  `,a([(0,u.property)({type:Number})],r.prototype,"index",2),a([(0,u.property)({type:String})],r.prototype,"value",2),a([(0,u.property)({type:Boolean,reflect:!0})],r.prototype,"disabled",2),r=a([(0,c.customElement)("skdx-tag","tag","root")],r);0&&(module.exports={SkdxTag,TAG_UPDATE_EVENT});

package/dist/tag/Tag.d.cts

@@ -1,66 +0,0 @@
-import { LitElement } from 'lit';
-/** @internal Event a tag dispatches whenever its own state changes, so its delete part can re-render (same convention as `<skdx-tags-input>`). */
-export declare const TAG_UPDATE_EVENT = "skdx-tag-internal-update";
-/**
- * `<skdx-tag>` — the Web Components implementation of the shared Tag contract
- * (see `@skdx/shared`'s `tagContract`). One removable entry inside a
- * `<skdx-tag-group>`: sets `role="listitem"` on this host element, takes part
- * in the group's roving tabindex, and fires `delete` on `Delete` or
- * `Backspace` after moving focus to a neighbouring tag — so the removal never
- * drops focus to `<body>`.
- *
- * Give it a `<skdx-tag-delete>` child for a pointer affordance; the button
- * borrows `value` for its accessible name, so it announces "Remove react"
- * rather than joining a row of identical "Remove" buttons.
- *
- * Must be used inside `<skdx-tag-group>`, which is found via
- * `closest('skdx-tag-group')` and re-read on the
- * `skdx-tag-group-internal-update` event the group dispatches (the same
- * convention `<skdx-tags-input-item>` uses). For a purely decorative label with
- * no keyboard behaviour, use `<skdx-badge>`.
- *
- * Unlike React and Svelte, where a missing `onDelete`/`ondelete` marks a tag
- * static, this fires `delete` unconditionally: a custom element cannot ask
- * whether anyone is listening.
- *
- * @fires delete - The tag asked to be removed. Fires after focus has already moved to a neighbouring tag.
- *
- * @example
- * ```html
- * <skdx-tag index="0" value="react">
- *   react
- *   <skdx-tag-delete>×</skdx-tag-delete>
- * </skdx-tag>
- * ```
- */
-export declare class SkdxTag extends LitElement {
-    static styles: import("lit").CSSResult;
-    /** This tag's position in the list, zero-based. Used to work out which tag focus lands on when this one is removed. @default 0 */
-    index: number;
-    /** This tag's text, used to name `<skdx-tag-delete>` (`Remove react`). @default '' */
-    value: string;
-    /** Disables this tag alone: it can't be removed and arrow-key navigation skips it. @default false */
-    disabled: boolean;
-    private group;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    protected updated(): void;
-    private readonly handleGroupUpdate;
-    private syncHostAttributes;
-    /** @internal This tag's own flag, or the whole group's. */
-    get isDisabled(): boolean;
-    /**
-     * @internal Moves focus to a neighbouring tag and then fires `delete`. A
-     * no-op while disabled. Named `requestDelete` rather than `remove` because
-     * `Element.prototype.remove()` already exists and takes the node out of the
-     * DOM — shadowing it would break every caller that expects that.
-     */
-    requestDelete(): void;
-    private readonly handleKeydown;
-    render(): import("lit").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'skdx-tag': SkdxTag;
-    }
-}

package/dist/tag/Tag.d.ts

@@ -1,66 +0,0 @@
-import { LitElement } from 'lit';
-/** @internal Event a tag dispatches whenever its own state changes, so its delete part can re-render (same convention as `<skdx-tags-input>`). */
-export declare const TAG_UPDATE_EVENT = "skdx-tag-internal-update";
-/**
- * `<skdx-tag>` — the Web Components implementation of the shared Tag contract
- * (see `@skdx/shared`'s `tagContract`). One removable entry inside a
- * `<skdx-tag-group>`: sets `role="listitem"` on this host element, takes part
- * in the group's roving tabindex, and fires `delete` on `Delete` or
- * `Backspace` after moving focus to a neighbouring tag — so the removal never
- * drops focus to `<body>`.
- *
- * Give it a `<skdx-tag-delete>` child for a pointer affordance; the button
- * borrows `value` for its accessible name, so it announces "Remove react"
- * rather than joining a row of identical "Remove" buttons.
- *
- * Must be used inside `<skdx-tag-group>`, which is found via
- * `closest('skdx-tag-group')` and re-read on the
- * `skdx-tag-group-internal-update` event the group dispatches (the same
- * convention `<skdx-tags-input-item>` uses). For a purely decorative label with
- * no keyboard behaviour, use `<skdx-badge>`.
- *
- * Unlike React and Svelte, where a missing `onDelete`/`ondelete` marks a tag
- * static, this fires `delete` unconditionally: a custom element cannot ask
- * whether anyone is listening.
- *
- * @fires delete - The tag asked to be removed. Fires after focus has already moved to a neighbouring tag.
- *
- * @example
- * ```html
- * <skdx-tag index="0" value="react">
- *   react
- *   <skdx-tag-delete>×</skdx-tag-delete>
- * </skdx-tag>
- * ```
- */
-export declare class SkdxTag extends LitElement {
-    static styles: import("lit").CSSResult;
-    /** This tag's position in the list, zero-based. Used to work out which tag focus lands on when this one is removed. @default 0 */
-    index: number;
-    /** This tag's text, used to name `<skdx-tag-delete>` (`Remove react`). @default '' */
-    value: string;
-    /** Disables this tag alone: it can't be removed and arrow-key navigation skips it. @default false */
-    disabled: boolean;
-    private group;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    protected updated(): void;
-    private readonly handleGroupUpdate;
-    private syncHostAttributes;
-    /** @internal This tag's own flag, or the whole group's. */
-    get isDisabled(): boolean;
-    /**
-     * @internal Moves focus to a neighbouring tag and then fires `delete`. A
-     * no-op while disabled. Named `requestDelete` rather than `remove` because
-     * `Element.prototype.remove()` already exists and takes the node out of the
-     * DOM — shadowing it would break every caller that expects that.
-     */
-    requestDelete(): void;
-    private readonly handleKeydown;
-    render(): import("lit").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'skdx-tag': SkdxTag;
-    }
-}

package/dist/tag/Tag.js

@@ -1,5 +0,0 @@
-var p=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var r=(d,i,t,o)=>{for(var s=o>1?void 0:o?h(i,t):i,a=d.length-1,n;a>=0;a--)(n=d[a])&&(s=(o?n(i,t,s):n(s))||s);return o&&s&&p(i,t,s),s};import{css as b,html as c,LitElement as v}from"lit";import{property as l}from"lit/decorators.js";import{customElement as m}from"../internal/define.js";import{focusTagNeighbor as y,TAG_GROUP_UPDATE_EVENT as u}from"../tag-group/TagGroup.js";var g="skdx-tag-internal-update",e=class extends v{constructor(){super(...arguments);this.index=0;this.value="";this.disabled=!1;this.group=null;this.handleGroupUpdate=()=>{this.syncHostAttributes(),this.requestUpdate()};this.handleKeydown=t=>{t.key!=="Delete"&&t.key!=="Backspace"||(t.preventDefault(),this.requestDelete())}}connectedCallback(){if(super.connectedCallback(),this.group=this.closest("skdx-tag-group"),!this.group)throw new Error("<skdx-tag> must be used inside <skdx-tag-group>.");this.setAttribute("role","listitem"),this.setAttribute("data-skdx-tag",""),this.hasAttribute("tabindex")||this.setAttribute("tabindex","-1"),this.group.addEventListener(u,this.handleGroupUpdate),this.addEventListener("keydown",this.handleKeydown),this.syncHostAttributes(),this.group.syncTabStops()}disconnectedCallback(){this.group?.removeEventListener(u,this.handleGroupUpdate),this.removeEventListener("keydown",this.handleKeydown),super.disconnectedCallback(),this.group?.syncTabStops()}updated(){this.syncHostAttributes(),this.dispatchEvent(new CustomEvent(g))}syncHostAttributes(){this.isDisabled?this.setAttribute("data-disabled",""):this.removeAttribute("data-disabled")}get isDisabled(){return this.disabled||!!this.group?.disabled}requestDelete(){this.isDisabled||(this.group?.setActiveIndex(y(this,this.index)),this.dispatchEvent(new CustomEvent("delete",{bubbles:!0,composed:!0})))}render(){return c`<slot></slot>`}};e.styles=b`
-    :host {
-      display: inline-block;
-    }
-  `,r([l({type:Number})],e.prototype,"index",2),r([l({type:String})],e.prototype,"value",2),r([l({type:Boolean,reflect:!0})],e.prototype,"disabled",2),e=r([m("skdx-tag","tag","root")],e);export{e as SkdxTag,g as TAG_UPDATE_EVENT};

package/dist/tag/TagDelete.cjs

@@ -1,17 +0,0 @@
-"use strict";var o=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var f=(a,e)=>{for(var i in e)o(a,i,{get:e[i],enumerable:!0})},y=(a,e,i,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of u(e))!k.call(a,t)&&t!==i&&o(a,t,{get:()=>e[t],enumerable:!(s=m(e,t))||s.enumerable});return a};var E=a=>y(o({},"__esModule",{value:!0}),a),p=(a,e,i,s)=>{for(var t=s>1?void 0:s?m(e,i):e,n=a.length-1,c;n>=0;n--)(c=a[n])&&(t=(s?c(e,i,t):c(t))||t);return s&&t&&o(e,i,t),t};var x={};f(x,{SkdxTagDelete:()=>d});module.exports=E(x);var l=require("lit"),b=require("lit/decorators.js"),g=require("../internal/define.cjs"),v=require("../internal/part.cjs"),r=require("../internal/styles.cjs"),h=require("./Tag.cjs");var d=class extends l.LitElement{constructor(){super(...arguments);this.tag=null;this.handleUpdate=()=>this.requestUpdate();this.handleClick=()=>this.tag?.requestDelete()}connectedCallback(){if(super.connectedCallback(),this.tag=this.closest("skdx-tag"),!this.tag)throw new Error("<skdx-tag-delete> must be used inside <skdx-tag>.");this.tag.addEventListener(h.TAG_UPDATE_EVENT,this.handleUpdate)}disconnectedCallback(){this.tag?.removeEventListener(h.TAG_UPDATE_EVENT,this.handleUpdate),super.disconnectedCallback()}updated(){(0,v.reflectHostState)(this,{"data-disabled":this.tag?.isDisabled?"":null})}render(){let i=this.tag,s=this.label??`Remove ${i?.value??""}`.trim(),t=!!i?.isDisabled;return l.html`
-      <button
-        part="delete"
-        type="button"
-        tabindex="-1"
-        aria-label=${s}
-        ?disabled=${t}
-        data-disabled=${t?"":l.nothing}
-        @click=${this.handleClick}
-      >
-        <slot></slot>
-      </button>
-    `}};d.styles=[r.resetNativeControl,r.hiddenHostStyles,l.css`
-      :host {
-        display: inline-block;
-      }
-    `,r.controlBoxOnHost],p([(0,b.property)({type:String})],d.prototype,"label",2),d=p([(0,g.customElement)("skdx-tag-delete","tag","delete")],d);0&&(module.exports={SkdxTagDelete});

package/dist/tag/TagDelete.d.cts

@@ -1,47 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * `<skdx-tag-delete>` — removes its closest `<skdx-tag>` on click. Renders a
- * native `<button type="button">` in shadow DOM named `Remove <value>` from
- * the tag's own text, so a group of them reads as "Remove react", "Remove
- * typescript" rather than a row of identical "Remove" buttons.
- *
- * It is deliberately **not** a Tab stop — hence no `delegatesFocus`, unlike
- * `<skdx-tags-input-item-delete>`: the group has a single Tab stop and the
- * keyboard path to removal is `Delete`/`Backspace` on the tag itself. Must be
- * used inside `<skdx-tag>`.
- *
- * @csspart delete - The native `<button>` element inside the shadow root.
- *
- * @example
- * ```html
- * <skdx-tag index="0" value="react">
- *   react
- *   <skdx-tag-delete>×</skdx-tag-delete>
- * </skdx-tag>
- * ```
- */
-export declare class SkdxTagDelete extends LitElement {
-    static styles: import("lit").CSSResult[];
-    /**
-     * Accessible name for the inner `<button>`, replacing the generated
-     * `Remove <value>`. The button lives in this element's shadow root, so an
-     * `aria-label` written on the host names nothing — this property is the only
-     * way in from markup, and "Remove" is not a word in every language. Set it
-     * per tag (the whole string, not a prefix), since it is what distinguishes
-     * one delete button from the next.
-     * @default undefined — keeps `` `Remove ${value}` ``
-     */
-    label?: string;
-    private tag;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    private readonly handleUpdate;
-    private readonly handleClick;
-    protected updated(): void;
-    render(): import("lit").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'skdx-tag-delete': SkdxTagDelete;
-    }
-}