@vollowx/seele 0.13.5 → 0.13.7

package/src/base/option.js

@@ -1,16 +1,15 @@
-import { _ as _ts_decorate } from "@swc/helpers/_/_ts_decorate";
+import { __decorate } from "tslib";
 import { property } from 'lit/decorators.js';
 import { ListItem } from './list-item.js';
-export const OptionMixin = (superClass)=>{
+export const OptionMixin = (superClass) => {
     class OptionElement extends superClass {
-        constructor(...args){
-            super(...args), this.value = '';
+        constructor() {
+            super(...arguments);
+            this.value = '';
         }
     }
-    _ts_decorate([
-        property({
-            reflect: true
-        })
+    __decorate([
+        property({ reflect: true })
     ], OptionElement.prototype, "value", void 0);
     return OptionElement;
 };

package/src/base/radio.d.ts

@@ -0,0 +1,13 @@
+import { LitElement, PropertyValues } from 'lit';
+declare const Radio_base: Constructor<import("./mixins/form-associated.js").FormAssociatedInterface> & Constructor<import("./mixins/internals-attached.js").InternalsAttachedInterface> & typeof LitElement;
+export declare class Radio extends Radio_base {
+    #private;
+    value: string;
+    checked: boolean;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(changedProperties: PropertyValues<this>): void;
+    formResetCallback(): void;
+}
+export {};

package/src/base/radio.js

@@ -1,4 +1,5 @@
-import { _ as _ts_decorate } from "@swc/helpers/_/_ts_decorate";
+var _a;
+import { __decorate } from "tslib";
 import { LitElement } from 'lit';
 import { property } from 'lit/decorators.js';
 import { FormAssociated } from './mixins/form-associated.js';
@@ -8,8 +9,11 @@ export class Radio extends FormAssociated(InternalsAttached(LitElement)) {
     static #registry = new Map();
     #currentScope;
     #currentName;
-    constructor(){
-        super(), this.#currentScope = null, this.#currentName = '', this.checked = false;
+    constructor() {
+        super();
+        this.#currentScope = null;
+        this.#currentName = '';
+        this.checked = false;
         this[internals].role = 'radio';
     }
     connectedCallback() {
@@ -37,24 +41,25 @@ export class Radio extends FormAssociated(InternalsAttached(LitElement)) {
             }
             this[internals].setFormValue(this.checked ? this.value : null);
             this.#updateGroupTabIndices();
-            this.dispatchEvent(new Event('change', {
-                bubbles: true,
-                composed: true
-            }));
+            this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));
         }
-        if (changedProperties.has('disabled') || changedProperties.has('checked')) this.#updateAriaState();
+        if (changedProperties.has('disabled') || changedProperties.has('checked'))
+            this.#updateAriaState();
     }
     #handleClick() {
-        if (this.disabled || this.checked) return;
+        if (this.disabled || this.checked)
+            return;
         this.checked = true;
         this.focus();
     }
     #handleKeyDown(event) {
-        if (this.disabled) return;
-        switch(event.key){
+        if (this.disabled)
+            return;
+        switch (event.key) {
             case ' ':
                 event.preventDefault();
-                if (!this.checked) this.checked = true;
+                if (!this.checked)
+                    this.checked = true;
                 break;
             case 'ArrowDown':
             case 'ArrowRight':
@@ -72,14 +77,15 @@ export class Radio extends FormAssociated(InternalsAttached(LitElement)) {
         return this.form ?? this.getRootNode();
     }
     #registerToGroup() {
-        if (!this.name) return;
+        if (!this.name)
+            return;
         const scope = this.#getScope();
         this.#currentScope = scope;
         this.#currentName = this.name;
-        let scopeMap = Radio.#registry.get(scope);
+        let scopeMap = _a.#registry.get(scope);
         if (!scopeMap) {
             scopeMap = new Map();
-            Radio.#registry.set(scope, scopeMap);
+            _a.#registry.set(scope, scopeMap);
         }
         let group = scopeMap.get(this.name);
         if (!group) {
@@ -90,51 +96,56 @@ export class Radio extends FormAssociated(InternalsAttached(LitElement)) {
         this.#updateGroupTabIndices(group);
     }
     #unregisterFromGroup() {
-        if (!this.#currentScope || !this.#currentName) return;
-        const scopeMap = Radio.#registry.get(this.#currentScope);
+        if (!this.#currentScope || !this.#currentName)
+            return;
+        const scopeMap = _a.#registry.get(this.#currentScope);
         if (scopeMap) {
             const group = scopeMap.get(this.#currentName);
             if (group) {
                 group.delete(this);
                 if (group.size === 0) {
                     scopeMap.delete(this.#currentName);
-                } else {
+                }
+                else {
                     this.#updateGroupTabIndices(group);
                 }
             }
-            if (scopeMap.size === 0) Radio.#registry.delete(this.#currentScope);
+            if (scopeMap.size === 0)
+                _a.#registry.delete(this.#currentScope);
         }
         this.#currentScope = null;
         this.#currentName = '';
     }
     #getGroupRadios() {
-        if (!this.name) return [
-            this
-        ];
+        if (!this.name)
+            return [this];
         const scope = this.#getScope();
-        const group = Radio.#registry.get(scope)?.get(this.name);
-        return group ? Array.from(group) : [
-            this
-        ];
+        const group = _a.#registry.get(scope)?.get(this.name);
+        return group ? Array.from(group) : [this];
     }
     #uncheckSiblings() {
         const radios = this.#getGroupRadios();
-        for (const radio of radios)if (radio !== this && radio.checked) radio.checked = false;
+        for (const radio of radios)
+            if (radio !== this && radio.checked)
+                radio.checked = false;
     }
     #updateGroupTabIndices(groupSet) {
         const radios = groupSet ? Array.from(groupSet) : this.#getGroupRadios();
-        if (radios.length === 0) return;
-        const hasChecked = radios.some((r)=>r.checked && !r.disabled);
+        if (radios.length === 0)
+            return;
+        const hasChecked = radios.some((r) => r.checked && !r.disabled);
         let enabledFound = false;
-        for (const radio of radios){
+        for (const radio of radios) {
             const active = !radio.disabled && (hasChecked ? radio.checked : !enabledFound);
-            if (active) enabledFound = true;
+            if (active)
+                enabledFound = true;
             radio.tabIndex = active ? 0 : -1;
         }
     }
     #navigateGroup(direction) {
-        const radios = this.#getGroupRadios().filter((r)=>!r.disabled);
-        if (radios.length <= 1) return;
+        const radios = this.#getGroupRadios().filter((r) => !r.disabled);
+        if (radios.length <= 1)
+            return;
         const currentIndex = radios.indexOf(this);
         const nextIndex = (currentIndex + direction + radios.length) % radios.length;
         const targetRadio = radios[nextIndex];
@@ -149,14 +160,10 @@ export class Radio extends FormAssociated(InternalsAttached(LitElement)) {
         this.checked = this.hasAttribute('checked');
     }
 }
-_ts_decorate([
-    property({
-        type: String
-    })
+_a = Radio;
+__decorate([
+    property({ type: String })
 ], Radio.prototype, "value", void 0);
-_ts_decorate([
-    property({
-        type: Boolean,
-        reflect: true
-    })
+__decorate([
+    property({ type: Boolean, reflect: true })
 ], Radio.prototype, "checked", void 0);

package/src/base/select.d.ts

@@ -0,0 +1,116 @@
+import { LitElement, PropertyValues } from 'lit';
+import type { Placement, Strategy } from '@floating-ui/dom';
+import type { Field } from './field.js';
+import type { Menu, MenuItemFocusEvent, MenuSelectEvent } from './menu.js';
+import type { Option } from './option.js';
+declare const VALUE: unique symbol;
+declare const Base: Constructor<import("./mixins/form-associated.js").FormAssociatedInterface> & Constructor<import("./mixins/focus-delegated.js").FocusDelegatedInterface> & Constructor<import("./mixins/internals-attached.js").InternalsAttachedInterface> & typeof LitElement;
+/**
+ * @csspart field
+ * @csspart menu
+ * @csspart items
+ *
+ * @fires {Event} change - Fires when the value is changed.
+ * @fires {Event} input - Fires when the value is changed.
+ *
+ * TODO: Render multiple values
+ * FIXME: `aria-expanded` set twice by both Lit and Menu
+ */
+export declare class Select extends Base {
+    #private;
+    required: boolean;
+    error: boolean;
+    quick: boolean;
+    offset: number;
+    align: Placement;
+    alignStrategy: Strategy;
+    open: boolean;
+    /**
+     * Text to display in the field. Only set for SSR.
+     */
+    displayText: string;
+    get value(): string;
+    set value(value: string);
+    [VALUE]: string;
+    get $options(): Option[];
+    get selectedIndex(): number;
+    set selectedIndex(index: number);
+    get selectedOptions(): Option[];
+    $field: Field;
+    $menu: Menu;
+    private lastUserSetValue;
+    private lastUserSetSelectedIndex;
+    private lastSelectedOption;
+    private lastSelectedOptionRecords;
+    render(): import("lit-html").TemplateResult<1>;
+    /**
+     * Example content:
+     *
+     * ```html
+     * <your-field
+     *   id="field"
+     *   part="field"
+     *   @click=${this.toggle}
+     *   @keydown=${this.handleFieldKeydown}
+     *   tabindex=${this.disabled ? '-1' : '0'}
+     *   role="combobox"
+     *   aria-haspopup="listbox"
+     *   aria-expanded=${this.open}
+     *   aria-controls="menu"
+     *   aria-disabled=${this.disabled}
+     *   aria-required=${this.required}
+     * >
+     *   ${this.renderFieldContent()}
+     * </your-field>
+     * ```
+     */
+    protected renderField(): import("lit-html").TemplateResult<1>;
+    /**
+     * Example content:
+     *
+     * ```html
+     * <your-menu
+     *   id="menu"
+     *   for="field"
+     *   type="listbox"
+     *   data-tabindex="-1"
+     *   ?quick="${this.quick}"
+     *   offset="${this.offset}"
+     *   align="${this.align}"
+     *   align-strategy="${this.alignStrategy}"
+     *   keep-open-blur
+     *   no-focus-control
+     *   ?open="${this.open}"
+     *   @item-focus="${this.handleMenuItemFocus}"
+     *   @select="${this.handleMenuSelect}"
+     * >
+     *   <slot part="items" @slotchange=${this.handleSlotChange}></slot>
+     * </your-menu>
+     * ```
+     */
+    protected renderMenu(): import("lit-html").TemplateResult<1>;
+    protected renderFieldContent(): import("lit-html").TemplateResult<1>;
+    constructor();
+    protected firstUpdated(changed: PropertyValues<Select>): Promise<void>;
+    protected update(changed: PropertyValues<Select>): void;
+    protected updated(changed: PropertyValues): void;
+    /**
+     * TODO: Handle clear action
+     */
+    protected _handleFieldKeydown(event: KeyboardEvent): void;
+    protected _handleMenuSelect(event: MenuSelectEvent): void;
+    protected _handleMenuItemFocus(event: MenuItemFocusEvent): void;
+    protected _handleFocusOut(event: FocusEvent): void;
+    protected _handleSlotChange(): void;
+    private selectItem;
+    private initUserSelection;
+    private updateValueAndDisplayText;
+    private getSelectedOptions;
+    formResetCallback(): void;
+    formStateRestoreCallback(state: string): void;
+    select(value: string): void;
+    selectIndex(index: number): void;
+    reset(): void;
+    toggle(): void;
+}
+export {};