@sky.ui/core 0.0.8 → 0.0.20

package/dist/sky-dropdown-item/sky-dropdown-item.js

@@ -1,341 +0,0 @@
-import{__decorate as t,__metadata as e}from"tslib";import{LitElement as s,css as o,html as i}from"lit";import{property as r,state as a,customElement as n}from"lit/decorators.js";import{when as d}from"lit/directives/when.js";import{classMap as c}from"lit/directives/class-map.js";import{SkyIcon as p}from"../sky-icon/sky-icon.js";let l=class extends s{constructor(){super(...arguments),this.iconL="",this.iconR="",this.label="",this.value="",this.description="",this.shortcut="",this.badge="",this.badgeVariant="neutral",this.metaRight="",this.disabled=!1,this.selected=!1,this.type="default",this.size="md",this.hasPrefix=!1,this.hasSuffix=!1,this.hasDescSlot=!1,this._onPrefixChange=t=>{const e=t.target;this.hasPrefix=e.assignedNodes({flatten:!0}).length>0},this._onSuffixChange=t=>{const e=t.target;this.hasSuffix=e.assignedNodes({flatten:!0}).length>0},this._onDescChange=t=>{const e=t.target;this.hasDescSlot=e.assignedNodes({flatten:!0}).length>0}}static{this.dependencies={"sky-icon":p}}static{this.styles=o`
-    :host {
-      display: block;
-      width: 100%;
-      margin: 2px 0;
-      --di-gap: 10px;
-      --di-pad-y: 8px;
-      --di-pad-x: 12px;
-      --di-fs: 14px;
-      --di-line: 20px;
-      --di-radius: 8px;
-    }
-
-    :host([size="sm"]) {
-      --di-gap: 8px;
-      --di-pad-y: 6px;
-      --di-pad-x: 12px;
-      --di-radius: 6px;
-      --di-fs: 13px;
-      --di-line: 18px;
-    }
-
-    :host([size="lg"]) {
-      --di-gap: 12px;
-      --di-pad-y: 10px;
-      --di-pad-x: 12px;
-      --di-radius: 10px;
-      --di-fs: 15px;
-      --di-line: 22px;
-    }
-
-    :host([disabled]) {
-      pointer-events: none;
-      cursor: not-allowed;
-    }
-
-    .root {
-      display: flex;
-      align-items: center;
-      gap: var(--di-gap);
-      padding: var(--di-pad-y) var(--di-pad-x);
-      width: 100%;
-      font-family: var(--sky-font);
-      font-size: var(--di-fs);
-      line-height: var(--di-line);
-      text-align: left;
-      border: 0;
-      border-radius: var(--di-radius);
-      background: transparent;
-      cursor: pointer;
-      box-sizing: border-box;
-      transition: background-color 120ms ease, color 120ms ease,
-        transform 60ms ease;
-      color: inherit;
-    }
-
-    .root:hover {
-      background: var(--sky-hover-primary);
-    }
-
-    .root:active {
-      background: var(--sky-hover-primary);
-    }
-
-    .root:focus-visible {
-      outline: 2px solid var(--sky-active-primary);
-      outline-offset: 2px;
-    }
-
-    :host([selected]) .root {
-      background: var(--sky-active-primary);
-      color: var(--sky-text-white);
-    }
-
-    :host([selected]) .label {
-      color: var(--sky-text-white);
-    }
-
-    :host([selected]) .desc {
-      color: var(--sky-text-white);
-    }
-
-    .root[aria-disabled="true"] {
-      cursor: not-allowed;
-      opacity: 0.55;
-      filter: grayscale(8%);
-      pointer-events: none;
-      user-select: none;
-    }
-
-    .root[aria-disabled="true"]:hover,
-    .root[aria-disabled="true"]:active {
-      background: transparent !important;
-      transform: none;
-    }
-
-    /* Override type-specific hover states when disabled */
-    :host([disabled]) .root:hover,
-    :host([disabled]) .root:active,
-    :host([disabled][type="success"]) .root:hover,
-    :host([disabled][type="info"]) .root:hover,
-    :host([disabled][type="warning"]) .root:hover,
-    :host([disabled][type="danger"]) .root:hover,
-    :host([disabled][type="active"]) .root:hover {
-      background: transparent !important;
-      transform: none;
-    }
-
-    :host([type="active"]) .root {
-      background: var(--sky-active-primary);
-      color: var(--sky-text-white);
-    }
-
-    :host([type="success"]) .root {
-      color: var(--sky-success-primary);
-    }
-
-    :host([type="success"]) .root:hover {
-      background: var(--sky-success-g1);
-    }
-
-    :host([type="success"][selected]) .root,
-    :host([type="success"]) .root:active {
-      background: var(--sky-success-g1);
-      color: var(--sky-text-white);
-    }
-
-    :host([type="info"]) .root {
-      color: var(--sky-info-primary, var(--sky-active-primary));
-    }
-
-    :host([type="info"]) .root:hover {
-      background: var(--sky-info-g1, var(--sky-hover-primary));
-    }
-
-    :host([type="info"][selected]) .root,
-    :host([type="info"]) .root:active {
-      background: var(--sky-info-g1);
-      color: var(--sky-text-white);
-    }
-
-    :host([type="warning"]) .root {
-      color: var(--sky-warning-primary);
-    }
-
-    :host([type="warning"]) .root:hover {
-      background: var(--sky-warning-g1);
-    }
-
-    :host([type="warning"][selected]) .root,
-    :host([type="warning"]) .root:active {
-      background: var(--sky-warning-g1);
-      color: var(--sky-text-white);
-    }
-
-    :host([type="danger"]) .root {
-      color: var(--sky-danger-primary);
-    }
-
-    :host([type="danger"]) .root:hover {
-      background: var(--sky-danger-g1);
-    }
-
-    :host([type="danger"][selected]) .root,
-    :host([type="danger"]) .root:active {
-      background: var(--sky-danger-g1);
-      color: var(--sky-text-white);
-    }
-
-    .prefix,
-    .suffix {
-      inline-size: 18px;
-      block-size: 18px;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      flex: 0 0 18px;
-      color: inherit;
-    }
-
-    ::slotted([slot="prefix"]),
-    ::slotted([slot="suffix"]) {
-      inline-size: 18px;
-      block-size: 18px;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      flex: 0 0 18px;
-      color: inherit;
-    }
-
-    .content {
-      flex: 1;
-      min-width: 0;
-      display: grid;
-      grid-auto-rows: min-content;
-      row-gap: 2px;
-      color: inherit;
-    }
-
-    .label {
-      color: inherit;
-      white-space: nowrap;
-      overflow: hidden;
-      font-weight: 500;
-      text-overflow: ellipsis;
-    }
-
-    .desc {
-      color: var(--sky-text-secondary);
-      font-size: calc(var(--di-fs) - 1px);
-      line-height: calc(var(--di-line) - 2px);
-      font-weight: 400;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-
-    .right {
-      margin-left: auto;
-      display: inline-flex;
-      align-items: center;
-      gap: 8px;
-      white-space: nowrap;
-      color: inherit;
-    }
-
-    .meta {
-      color: var(--sky-text-secondary);
-      font-size: 12px;
-      line-height: 16px;
-    }
-
-    .shortcut {
-      color: var(--sky-text-secondary);
-      font-variant-numeric: tabular-nums;
-      font-size: 13px;
-      line-height: 16px;
-      padding: 0 4px;
-      border-radius: var(--sky-radius-primary);
-      background: var(--sky-glass-primary);
-      border: var(--sky-border-primary);
-      transition: background-color 120ms ease;
-    }
-
-    .root:hover .shortcut {
-      background: var(--sky-hover-secondary);
-    }
-
-    .root[aria-disabled="true"]:hover .shortcut,
-    :host([disabled]) .root:hover .shortcut {
-      background: var(--sky-glass-primary);
-    }
-
-    .badge {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      padding: 0 7px;
-      border-radius: var(--sky-radius-full);
-      font-size: 12px;
-      line-height: 16px;
-      background: var(--sky-glass-primary);
-      color: var(--sky-text-primary);
-    }
-
-    .badge.success {
-      background: var(--sky-success-g1);
-      color: var(--sky-success-primary);
-    }
-
-    .badge.warning {
-      background: var(--sky-warning-g1);
-      color: var(--sky-warning-primary);
-    }
-
-    .badge.danger {
-      background: var(--sky-danger-g1);
-      color: var(--sky-danger-primary);
-    }
-
-    /* RTL support */
-    :host([dir="rtl"]) .root {
-      text-align: right;
-    }
-
-    :host([dir="rtl"]) .right {
-      margin-left: 0;
-      margin-right: auto;
-    }
-  `}connectedCallback(){super.connectedCallback(),queueMicrotask(()=>{const t=this.shadowRoot?.querySelector('slot[name="prefix"]'),e=this.shadowRoot?.querySelector('slot[name="suffix"]'),s=this.shadowRoot?.querySelector('slot[name="description"]');t&&(this.hasPrefix=t.assignedNodes({flatten:!0}).length>0),e&&(this.hasSuffix=e.assignedNodes({flatten:!0}).length>0),s&&(this.hasDescSlot=s.assignedNodes({flatten:!0}).length>0)})}_computedLabel(){const t=(this.label??"").trim();if(t)return t;return(this.textContent??"").trim()}_onActivate(t){if(this.disabled)return t.preventDefault(),void t.stopPropagation();this.dispatchEvent(new CustomEvent("dropdown-item-click",{detail:{label:this._computedLabel(),type:this.type,selected:this.selected},bubbles:!0,composed:!0}))}_onKeyDown(t){this.disabled||"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),this._onActivate(t))}getLabel(){return this._computedLabel()}activate(){this.disabled||this._onActivate(new Event("click"))}focusItem(){const t=this.shadowRoot?.querySelector(".root");t&&t.focus()}render(){const t=this.disabled,e=[];this.metaRight&&e.push(i`<span class="meta" part="meta">${this.metaRight}</span>`),this.badge&&e.push(i`<span class="badge ${this.badgeVariant}" part="badge"
-          >${this.badge}</span
-        >`),this.shortcut&&e.push(i`<span class="shortcut" part="shortcut">${this.shortcut}</span>`);const s=!!this.iconL||this.hasPrefix,o=!!this.iconR||this.hasSuffix;return i`
-      <div
-        class=${c({root:!0,disabled:!!t})}
-        part="root"
-        role="menuitem"
-        tabindex=${t?-1:0}
-        aria-disabled=${t?"true":"false"}
-        @click=${this._onActivate}
-        @keydown=${this._onKeyDown}
-      >
-        ${d(s&&this.iconL,()=>i`<sky-icon
-            class="prefix"
-            part="prefix"
-            .icon=${this.iconL}
-            width="18"
-            height="18"
-          ></sky-icon>`,()=>i`<slot
-            name="prefix"
-            part="prefix"
-            @slotchange=${this._onPrefixChange}
-          ></slot>`)}
-
-        <span class="content" part="content">
-          <span class="label" part="label"><slot>${this.label}</slot></span>
-          ${d(this.description&&!this.hasDescSlot,()=>i`<span class="desc" part="description">${this.description}</span>`,()=>i`<slot
-              name="description"
-              class="desc"
-              part="description"
-              @slotchange=${this._onDescChange}
-            ></slot>`)}
-        </span>
-
-        <span class="right" part="right">
-          ${e}
-          ${d(o&&this.iconR,()=>i`<sky-icon
-              class="suffix"
-              part="suffix"
-              .icon=${this.iconR}
-              width="18"
-              height="18"
-            ></sky-icon>`,()=>i`<slot
-              name="suffix"
-              part="suffix"
-              @slotchange=${this._onSuffixChange}
-            ></slot>`)}
-        </span>
-      </div>
-    `}};t([r({type:String}),e("design:type",Object)],l.prototype,"iconL",void 0),t([r({type:String}),e("design:type",Object)],l.prototype,"iconR",void 0),t([r({type:String}),e("design:type",Object)],l.prototype,"label",void 0),t([r({type:String,reflect:!0}),e("design:type",Object)],l.prototype,"value",void 0),t([r({type:String}),e("design:type",Object)],l.prototype,"description",void 0),t([r({type:String}),e("design:type",Object)],l.prototype,"shortcut",void 0),t([r({type:String}),e("design:type",Object)],l.prototype,"badge",void 0),t([r({type:String}),e("design:type",String)],l.prototype,"badgeVariant",void 0),t([r({type:String}),e("design:type",Object)],l.prototype,"metaRight",void 0),t([r({type:Boolean,reflect:!0}),e("design:type",Object)],l.prototype,"disabled",void 0),t([r({type:Boolean,reflect:!0}),e("design:type",Object)],l.prototype,"selected",void 0),t([r({type:String,reflect:!0}),e("design:type",String)],l.prototype,"type",void 0),t([r({type:String,reflect:!0}),e("design:type",String)],l.prototype,"size",void 0),t([a(),e("design:type",Object)],l.prototype,"hasPrefix",void 0),t([a(),e("design:type",Object)],l.prototype,"hasSuffix",void 0),t([a(),e("design:type",Object)],l.prototype,"hasDescSlot",void 0),l=t([n("sky-dropdown-item")],l);export{l as SkyDropdownItem};
-//# sourceMappingURL=sky-dropdown-item.js.map

package/dist/sky-dropdown-item/sky-dropdown-item.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sky-dropdown-item.js","sources":["../../src/sky-dropdown-item/sky-dropdown-item.ts"],"sourcesContent":[null],"names":["SkyDropdownItem","LitElement","constructor","this","iconL","iconR","label","value","description","shortcut","badge","badgeVariant","metaRight","disabled","selected","type","size","hasPrefix","hasSuffix","hasDescSlot","_onPrefixChange","e","slot","target","assignedNodes","flatten","length","_onSuffixChange","_onDescChange","dependencies","SkyIcon","styles","css","connectedCallback","super","queueMicrotask","p","shadowRoot","querySelector","s","d","_computedLabel","fromProp","trim","textContent","_onActivate","preventDefault","stopPropagation","dispatchEvent","CustomEvent","detail","bubbles","composed","_onKeyDown","key","getLabel","activate","Event","focusItem","root","focus","render","rightBits","push","html","showPrefix","showSuffix","classMap","when","__decorate","property","String","prototype","reflect","Boolean","state","customElement"],"mappings":"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"}

package/dist/sky-flexbar/index.d.ts

@@ -1 +0,0 @@
-export * from "./sky-flexbar";

package/dist/sky-flexbar/index.js

@@ -1 +0,0 @@
-export * from './sky-flexbar.js';

package/dist/sky-flexbar/sky-flexbar.d.ts

@@ -1,189 +0,0 @@
-import { LitElement, PropertyValues } from "lit";
-export type SkyFlexbarDirection = "horizontal" | "vertical";
-export type SkyFlexbarDirectionChangedDetail = {
-    flexDirection: SkyFlexbarDirection;
-};
-export type SkyFlexbarMenuToggleDetail = {
-    open: boolean;
-};
-/**
- * @element sky-flexbar
- *
- * @summary Responsive action bar that moves overflowing items into a hamburger menu.
- *
- * @status stable
- * @since 1.0.0
- *
- * @documentation https://library.sky-ui.com/components/flexbar
- * @dependency sky-icon
- *
- * @uiVModel isHamburgerOpen menu-toggle detail=open
- *
- * @slot - Default slot for visible bar items. Apply `class="menu-parent"` to each.
- * @slot hamburger - Receives items that overflow the main bar.
- *
- * @property {boolean} isHamburgerOpen - Whether the overflow menu is open.
- * @property {boolean} isFullyHidden - Whether all slotted items are currently overflowed.
- * @property {number} gapThreshold - Reserved space in px used during overflow measurement.
- * @property {SkyFlexbarDirection} flexDirection - Current layout direction.
- * @property {number} stackAt - Width threshold (px) for switching to vertical mode; `0` disables.
- * @property {string} partialIcon - Icon shown when only some items overflow.
- * @property {string} fullIcon - Icon shown when all items overflow.
- *
- * @fires {CustomEvent<SkyFlexbarDirectionChangedDetail>} flex-direction-changed - Fired when layout direction changes.
- * @fires {CustomEvent<SkyFlexbarMenuToggleDetail>} menu-toggle - Fired when the hamburger menu opens or closes.
- * @method openMenu Opens the hamburger menu.
- * @method closeMenu Closes the hamburger menu.
- * @method toggleMenu Toggles the hamburger menu state.
- * @method recalculateLayout Re-runs layout and overflow measurement.
- *
- * @csspart container - The outer flex container.
- * @csspart hamburger-button - The hamburger/ellipsis toggle button.
- * @csspart menu - The dropdown menu container.
- * @csspart menu-inner - Wrapper inside the dropdown menu.
- *
- * @Behavior
- * - Automatically measures available space using ResizeObserver
- * - Moves overflowing `.menu-parent` items into hamburger menu
- * - Switches between horizontal and vertical layouts based on width
- * - Uses PopoverController for dropdown positioning and management
- * - Maintains accessibility with proper ARIA attributes
- *
- * - Items with `class="menu-parent"` are measured for fit
- * - Overflowing items are moved to `slot="hamburger"`
- * - Hamburger button shows different icons based on overflow state
- * - Menu automatically closes when all items fit in main bar
- *
- * - `stackAt` property controls vertical stacking breakpoint
- * - Dynamically switches between horizontal/vertical layouts
- * - Emits `flex-direction-changed` events for child components
- *
- * @example
- * ```html
- * <sky-flexbar stack-at="640" partial-icon="ion:ellipsis-horizontal" full-icon="ion:menu">
- *   <sky-flexitem class="menu-parent">
- *     <span slot="title">Home</span>
- *     <span slot="content">Dashboard</span>
- *   </sky-flexitem>
- *   <sky-flexitem class="menu-parent">
- *     <span slot="title">Reports</span>
- *     <span slot="content">Monthly</span>
- *   </sky-flexitem>
- * </sky-flexbar>
- * ```
- * ```vue
- * <template>
- *   <sky-flexbar stack-at="640">
- *     <sky-flexitem class="menu-parent"><span slot="title">Home</span><span slot="content">Dashboard</span></sky-flexitem>
- *     <sky-flexitem class="menu-parent"><span slot="title">Reports</span><span slot="content">Monthly</span></sky-flexitem>
- *   </sky-flexbar>
- * </template>
- * ```
- * ```jsx
- * export default function Demo() {
- *   return (
- *     <sky-flexbar stack-at="640">
- *       <sky-flexitem class="menu-parent"><span slot="title">Home</span><span slot="content">Dashboard</span></sky-flexitem>
- *       <sky-flexitem class="menu-parent"><span slot="title">Reports</span><span slot="content">Monthly</span></sky-flexitem>
- *     </sky-flexbar>
- *   );
- * }
- * ```
- */
-export declare class SkyFlexbar extends LitElement {
-    static dependencies: Record<string, CustomElementConstructor>;
-    /**
-     * Whether the dropdown menu is open.
-     * @public
-     */
-    isHamburgerOpen: boolean;
-    /**
-     * True if all items overflow into the menu.
-     * @public
-     */
-    isFullyHidden: boolean;
-    /**
-     * Space (px) reserved for paddings/margins when measuring.
-     * @public
-     */
-    gapThreshold: number;
-    /**
-     * Current layout direction.
-     * @public
-     */
-    flexDirection: SkyFlexbarDirection;
-    /**
-     * Stack vertically when component width is below this (px). `0` disables.
-     * @public
-     */
-    stackAt: number;
-    /**
-     * Icon name for "some items overflow" state.
-     * @public
-     */
-    partialIcon: string;
-    /**
-     * Icon name for "all items overflow" state.
-     * @public
-     */
-    fullIcon: string;
-    /** @private */
-    private _ro?;
-    /** @private */
-    private _itemElements;
-    /** @private */
-    private _scheduled;
-    /** @private */
-    private _initialized;
-    /** @private */
-    private _mo?;
-    /** @private */
-    private hamburgerEl;
-    /** @private */
-    private dropdownPopover;
-    static styles: import("lit").CSSResult;
-    /** @protected */
-    protected firstUpdated(_changedProperties: PropertyValues): void;
-    /** @protected */
-    connectedCallback(): void;
-    /** @protected */
-    disconnectedCallback(): void;
-    /**
-     * Collects all .menu-parent elements for measurement.
-     * @private
-     */
-    private _collectItems;
-    /**
-     * Schedules a measurement for the next animation frame.
-     * @private
-     */
-    private _scheduleMeasure;
-    /**
-     * Measures available space and manages item overflow.
-     * @private
-     */
-    private _measure;
-    /**
-     * Opens the hamburger menu.
-     * @public
-     */
-    openMenu(): void;
-    /**
-     * Closes the hamburger menu.
-     * @public
-     */
-    closeMenu(): void;
-    /**
-     * Toggles the hamburger menu.
-     * @public
-     */
-    toggleMenu(): void;
-    /**
-     * Forces a recalculation of item layout.
-     * Useful when items change size dynamically.
-     * @public
-     */
-    recalculateLayout(): void;
-    /** @protected */
-    render(): import("lit-html").TemplateResult<1>;
-}