@nisoku/sazami 0.1.0

package/dist/primitives/accordion.d.ts

@@ -0,0 +1,35 @@
+import { SazamiComponent } from "./base";
+declare const accordionConfig: {
+    readonly properties: {
+        readonly "single-open": {
+            readonly type: "boolean";
+            readonly reflect: false;
+        };
+        readonly index: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly open: {
+            readonly type: "boolean";
+            readonly reflect: false;
+        };
+    };
+    readonly events: {
+        readonly change: {
+            readonly name: "saz-change";
+            readonly detail: {
+                readonly index: "index";
+                readonly open: "open";
+            };
+        };
+    };
+};
+export declare class SazamiAccordion extends SazamiComponent<typeof accordionConfig> {
+    "single-open": boolean;
+    index: string;
+    open: boolean;
+    private _itemElements;
+    private _handlersAdded;
+    render(): void;
+}
+export {};

package/dist/primitives/avatar.d.ts

@@ -0,0 +1,54 @@
+import { SazamiComponent } from "./base";
+import { type Readable } from "@nisoku/sairin";
+declare const avatarConfig: {
+    readonly properties: {
+        readonly alt: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly initials: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly size: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly shape: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly src: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+    };
+    readonly structuralRoots: {
+        readonly image: "img";
+        readonly initials: "span";
+    };
+};
+export declare class SazamiAvatar extends SazamiComponent<typeof avatarConfig> {
+    private _srcSignal;
+    private _imgElement;
+    private _initialsElement;
+    private _srcDisposer;
+    private _modeEffectDisposer;
+    private _altObserver;
+    private _isImageMode;
+    protected getRenderMode(): string;
+    private _isReadableStr;
+    private _disposeSrcBinding;
+    private _getCurrentSrc;
+    private _isImageModeNow;
+    set src(value: string | Readable<string>);
+    get src(): string | Readable<string>;
+    private _setupSrcBinding;
+    private _updateDisplay;
+    render(): void;
+    private _setupSignalWatcher;
+    private _getInitials;
+    static get observedAttributes(): string[];
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+}
+export {};

package/dist/primitives/badge.d.ts

@@ -0,0 +1,34 @@
+import { SazamiComponent } from "./base";
+import { type Readable } from "@nisoku/sairin";
+declare const badgeConfig: {
+    readonly observedAttributes: readonly ["content"];
+    readonly properties: {
+        readonly size: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly variant: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly shape: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+    };
+};
+export declare class SazamiBadge extends SazamiComponent<typeof badgeConfig> {
+    size: string;
+    variant: string;
+    shape: string;
+    private _contentSignal;
+    private _textNode;
+    private _textContent;
+    private _contentDispose;
+    private _isReadable;
+    set content(value: string | Readable<string>);
+    get content(): string | Readable<string> | undefined;
+    render(): void;
+    attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;
+}
+export {};

package/dist/primitives/base.d.ts

@@ -0,0 +1,129 @@
+import { type Readable } from "@nisoku/sairin";
+export declare type BindTarget = "textContent" | "innerHTML" | "value" | "checked" | "disabled" | "visible" | string;
+export interface SazamiComponentConfig {
+    observedAttributes?: readonly string[] | string[];
+    properties?: Record<string, AnyPropertyConfig>;
+    events?: Record<string, EventConfig>;
+    binds?: Record<string, BindingType>;
+    structuralRoots?: Record<string, string>;
+}
+export interface PropertyConfig {
+    type: "string";
+    reflect?: boolean;
+    default?: string;
+}
+export interface PropertyConfigNumber {
+    type: "number";
+    reflect?: boolean;
+    default: number;
+}
+export interface PropertyConfigBoolean {
+    type: "boolean";
+    reflect?: boolean;
+    default?: boolean;
+}
+export declare type AnyPropertyConfig = PropertyConfig | PropertyConfigNumber | PropertyConfigBoolean;
+export interface EventConfig {
+    name: string;
+    detail?: Record<string, string>;
+}
+export declare type BindingType = "attribute" | "property" | "input";
+declare type GetPropConfig<C extends SazamiComponentConfig, P extends string> = C["properties"] extends Record<string, AnyPropertyConfig> ? P extends keyof C["properties"] ? C["properties"][P] : never : never;
+declare type PropType<C extends SazamiComponentConfig, P extends string> = GetPropConfig<C, P> extends AnyPropertyConfig ? GetPropConfig<C, P>["type"] extends "boolean" ? boolean : GetPropConfig<C, P>["type"] extends "number" ? number : string : string;
+declare type EventDetail<C extends SazamiComponentConfig, D extends Record<string, string>> = {
+    [K in keyof D]: D[K] extends string ? PropType<C, D[K]> : never;
+};
+export declare type InferProps<C extends SazamiComponentConfig> = C["properties"] extends Record<string, AnyPropertyConfig> ? {
+    [P in keyof C["properties"]]: PropType<C, P & string>;
+} : {};
+export declare type InferEvents<C extends SazamiComponentConfig> = C["events"] extends Record<string, EventConfig> ? {
+    [E in keyof C["events"]]: C["events"][E] extends EventConfig ? C["events"][E]["detail"] extends Record<string, string> ? EventDetail<C, C["events"][E]["detail"]> : {} : {};
+} : {};
+export declare function component<C extends SazamiComponentConfig>(config: C): <T extends new () => SazamiComponent<C>>(Constructor: T) => T;
+export declare class SazamiComponent<C extends SazamiComponentConfig = any> extends HTMLElement {
+    sazamiConfig: C;
+    componentId: string;
+    protected shadow: ShadowRoot;
+    protected _cleanupFns: Array<() => void>;
+    private _rendered;
+    private _propStorage;
+    private _dirty;
+    private _pendingStyles;
+    private _pendingTemplate;
+    private _lastTemplate;
+    private _lastStyles;
+    private _currentRootElement;
+    private _handlerId;
+    private _handlers;
+    constructor();
+    static get observedAttributes(): string[];
+    protected getStructuralRoot(): string | null;
+    protected getRenderMode(): string;
+    private _extractRootElement;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;
+    render(): void;
+    /**
+     * Mounts the component's shadow DOM with the given styles and template.
+     * Auto-detects structural changes and renders synchronously when needed.
+     * For non-structural re-renders, defers to a microtask for batching.
+     * @param styles - CSS styles to inject
+     * @param template - HTML template string. Callers are responsible for escaping
+     *   user-provided data using escapeHtml() before interpolating into the template.
+     */
+    protected mount(styles: string, template: string): void;
+    /**
+     * Mounts the component's shadow DOM synchronously.
+     * Use this when you need to query/bind immediately after mounting.
+     * @param styles - CSS styles to inject
+     * @param template - HTML template string. Callers are responsible for escaping
+     *   user-provided data using escapeHtml() before interpolating into the template.
+     */
+    protected mountSync(styles: string, template: string): void;
+    /**
+     * Schedules a render to occur in the next microtask.
+     * Collapses multiple render() calls within the same tick into one DOM write.
+     * Uses backpressure, if a render is already queued, subsequent calls are dropped.
+     */
+    protected scheduleRender(styles: string, template: string): void;
+    /**
+     * Flushes pending styles and template to the shadow DOM.
+     * Called by scheduleRender when the microtask runs.
+     * Skips stale renders if structural change made them obsolete.
+     */
+    private _flush;
+    protected bind(selector: string, target: BindTarget, readable: Readable<any>): void;
+    protected bindText(selector: string, readable: Readable<string>): void;
+    protected bindHtml(selector: string, readable: Readable<string>): void;
+    protected bindValue(selector: string, readable: Readable<string>): void;
+    protected bindChecked(selector: string, readable: Readable<boolean>): void;
+    protected bindDisabled(selector: string, readable: Readable<boolean>): void;
+    protected bindVisible(selector: string, readable: Readable<boolean>): void;
+    protected bindAttribute(selector: string, attr: string, readable: Readable<any>): (() => void) | void;
+    protected bindProperty<T>(selector: string, prop: string, readable: Readable<T>): void;
+    protected bindStyle(selector: string, styleProp: string, readable: Readable<string>): void;
+    protected bindToggleClass(selector: string, className: string, readable: Readable<boolean>): void;
+    protected bindWidthPercent(selector: string, readable: Readable<number>, min?: number, max?: number): () => void;
+    protected bindWidthPercentAttribute(selector: string, attr: string, readable: Readable<number>, min?: number, max?: number): void;
+    protected $<K extends keyof HTMLElementTagNameMap>(selector: K): HTMLElementTagNameMap[K] | null;
+    protected $<E extends HTMLElement = HTMLElement>(selector: string): E | null;
+    protected addHandler(type: string, handler: Function, options?: {
+        internal?: boolean;
+        element?: EventTarget;
+    }): number;
+    protected removeHandler(typeOrId: string | number, idOrFn?: number | Function): void;
+    protected removeAllHandlers(options?: {
+        type?: string;
+        source?: "internal" | "user";
+    }): void;
+    protected dispatch<T = any>(name: string, detail?: T, options?: {
+        bubbles?: boolean;
+        composed?: boolean;
+    }): void;
+    protected dispatchEventTyped<E extends keyof InferEvents<C>>(event: E, detail: InferEvents<C>[E]): void;
+    protected onCleanup(fn: () => void): void;
+    private _installPropertyReflectors;
+    private _createReflector;
+}
+export {};

package/dist/primitives/button.d.ts

@@ -0,0 +1,55 @@
+import { SazamiComponent } from "./base";
+import { type Readable } from "@nisoku/sairin";
+declare const buttonConfig: {
+    readonly properties: {
+        readonly disabled: {
+            readonly type: "boolean";
+            readonly reflect: true;
+        };
+        readonly loading: {
+            readonly type: "boolean";
+            readonly reflect: true;
+        };
+        readonly active: {
+            readonly type: "boolean";
+            readonly reflect: true;
+        };
+        readonly size: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly variant: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly shape: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly tone: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+    };
+    readonly events: {
+        readonly click: {
+            readonly name: "saz-click";
+            readonly detail: {};
+        };
+    };
+};
+export declare class SazamiButton extends SazamiComponent<typeof buttonConfig> {
+    loading: boolean;
+    private _disabledSignal;
+    private _disabledValue;
+    private _disabledDispose;
+    private _isReadableBool;
+    set disabled(value: boolean | Readable<boolean>);
+    get disabled(): boolean | Readable<boolean>;
+    private _setDisabled;
+    private _getIsDisabled;
+    render(): void;
+    private _handleClick;
+    private _handleKeydown;
+}
+export {};

package/dist/primitives/card.d.ts

@@ -0,0 +1,44 @@
+import { SazamiComponent } from "./base";
+import { type Readable } from "@nisoku/sairin";
+declare const cardConfig: {
+    readonly properties: {
+        readonly layout: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly align: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly justify: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly size: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly variant: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly gap: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+    };
+};
+export declare class SazamiCard extends SazamiComponent<typeof cardConfig> {
+    layout: string;
+    align: string;
+    justify: string;
+    size: string;
+    variant: string;
+    gap: string;
+    private _loadingSignal;
+    private _isReadableBool;
+    set loading(value: boolean | Readable<boolean>);
+    get loading(): boolean | Readable<boolean>;
+    render(): void;
+}
+export {};

package/dist/primitives/checkbox.d.ts

@@ -0,0 +1,43 @@
+import { SazamiComponent } from "./base";
+import { type Readable } from "@nisoku/sairin";
+declare const checkboxConfig: {
+    readonly properties: {
+        readonly checked: {
+            readonly type: "boolean";
+            readonly reflect: true;
+        };
+        readonly disabled: {
+            readonly type: "boolean";
+            readonly reflect: true;
+        };
+    };
+    readonly events: {
+        readonly change: {
+            readonly name: "saz-change";
+            readonly detail: {
+                readonly checked: "checked";
+            };
+        };
+    };
+    readonly binds: {
+        readonly checked: "attribute";
+        readonly disabled: "attribute";
+    };
+};
+export declare class SazamiCheckbox extends SazamiComponent<typeof checkboxConfig> {
+    private _checkedSignal;
+    private _disabledSignal;
+    private _isReadableBool;
+    set checked(value: boolean | Readable<boolean>);
+    get checked(): boolean | Readable<boolean>;
+    private _setChecked;
+    set disabled(value: boolean | Readable<boolean>);
+    get disabled(): boolean | Readable<boolean>;
+    private _setDisabled;
+    private _getIsDisabled;
+    render(): void;
+    private _handleClick;
+    private _handleKeydown;
+    private _updateAria;
+}
+export {};

package/dist/primitives/chip.d.ts

@@ -0,0 +1,57 @@
+import { SazamiComponent } from "./base";
+import { Signal } from "@nisoku/sairin";
+declare const chipConfig: {
+    readonly properties: {
+        readonly label: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly variant: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly removable: {
+            readonly type: "boolean";
+            readonly reflect: false;
+        };
+        readonly selected: {
+            readonly type: "boolean";
+            readonly reflect: true;
+        };
+        readonly disabled: {
+            readonly type: "boolean";
+            readonly reflect: true;
+        };
+        readonly size: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+    };
+    readonly events: {
+        readonly change: {
+            readonly name: "saz-change";
+            readonly detail: {
+                readonly selected: "selected";
+            };
+        };
+        readonly remove: {
+            readonly name: "saz-remove";
+            readonly detail: {};
+        };
+    };
+};
+export declare class SazamiChip extends SazamiComponent<typeof chipConfig> {
+    label: string;
+    variant: string;
+    removable: boolean;
+    size: string;
+    selected: boolean;
+    disabled: boolean;
+    disabledSignal?: Signal<boolean>;
+    selectedSignal?: Signal<boolean>;
+    render(): void;
+    private _updateTabIndex;
+    private _handleClick;
+    private _handleKeydown;
+}
+export {};

package/dist/primitives/column.d.ts

@@ -0,0 +1,24 @@
+import { SazamiComponent } from "./base";
+declare const columnConfig: {
+    readonly properties: {
+        readonly justify: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly align: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly gap: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+    };
+};
+export declare class SazamiColumn extends SazamiComponent<typeof columnConfig> {
+    justify: string;
+    align: string;
+    gap: string;
+    render(): void;
+}
+export {};

package/dist/primitives/coverart.d.ts

@@ -0,0 +1,34 @@
+import { SazamiComponent } from "./base";
+import { type Readable } from "@nisoku/sairin";
+declare const coverartConfig: {
+    readonly properties: {
+        readonly alt: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly size: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly shape: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+    };
+};
+export declare class SazamiCoverart extends SazamiComponent<typeof coverartConfig> {
+    alt: string;
+    size: string;
+    shape: string;
+    private _srcSignal;
+    private _imgElement;
+    private _pendingSrc;
+    private _srcEffectDispose;
+    private _isReadableStr;
+    set src(value: string | Readable<string>);
+    get src(): string | Readable<string>;
+    private _updateSrc;
+    private _setupSrcEffect;
+    render(): void;
+}
+export {};

package/dist/primitives/divider.d.ts

@@ -0,0 +1,24 @@
+import { SazamiComponent } from "./base";
+declare const dividerConfig: {
+    readonly properties: {
+        readonly vertical: {
+            readonly type: "boolean";
+            readonly reflect: false;
+        };
+        readonly size: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly variant: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+    };
+};
+export declare class SazamiDivider extends SazamiComponent<typeof dividerConfig> {
+    vertical: boolean;
+    size: string;
+    variant: string;
+    render(): void;
+}
+export {};

package/dist/primitives/generic.d.ts

@@ -0,0 +1,4 @@
+import { SazamiComponent, SazamiComponentConfig } from "./base";
+export declare function createGenericClass<C extends SazamiComponentConfig = any>(config?: C): {
+    new (): SazamiComponent<C>;
+};

package/dist/primitives/grid.d.ts

@@ -0,0 +1,29 @@
+import { SazamiComponent } from "./base";
+declare const gridConfig: {
+    readonly properties: {
+        readonly cols: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly "md:cols": {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly "lg:cols": {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly gap: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+    };
+};
+export declare class SazamiGrid extends SazamiComponent<typeof gridConfig> {
+    cols: string;
+    "md:cols": string;
+    "lg:cols": string;
+    gap: string;
+    render(): void;
+}
+export {};

package/dist/primitives/heading.d.ts

@@ -0,0 +1,35 @@
+import { SazamiComponent } from "./base";
+import { type Readable } from "@nisoku/sairin";
+declare const headingConfig: {
+    readonly observedAttributes: readonly ["content"];
+    readonly properties: {
+        readonly size: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly weight: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+        readonly tone: {
+            readonly type: "string";
+            readonly reflect: false;
+        };
+    };
+};
+export declare class SazamiHeading extends SazamiComponent<typeof headingConfig> {
+    size: string;
+    weight: string;
+    tone: string;
+    private _content;
+    private _contentSignal;
+    private _textNode;
+    private _isReadable;
+    set content(value: string | Readable<string>);
+    get content(): string | Readable<string>;
+    private _setTextContent;
+    private _setupSignalBinding;
+    render(): void;
+    attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;
+}
+export {};

package/dist/primitives/icon-button.d.ts

@@ -0,0 +1,45 @@
+import { SazamiComponent } from "./base";
+import { type Readable } from "@nisoku/sairin";
+declare const iconButtonConfig: {
+    readonly properties: {
+        readonly icon: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly size: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+        readonly variant: {
+            readonly type: "string";
+            readonly reflect: true;
+        };
+    };
+    readonly events: {
+        readonly click: {
+            readonly name: "saz-click";
+            readonly detail: {};
+        };
+    };
+};
+export declare class SazamiIconButton extends SazamiComponent<typeof iconButtonConfig> {
+    icon: string;
+    size: string;
+    variant: string;
+    private _handlersAdded;
+    private _autoAriaLabel;
+    private _disabledSignal;
+    private _isReadableBool;
+    set disabled(value: boolean | Readable<boolean>);
+    get disabled(): boolean | Readable<boolean>;
+    private _setDisabled;
+    private _getIsDisabled;
+    render(): void;
+    private _updateTabIndex;
+    static get observedAttributes(): string[];
+    attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;
+    private _handleClick;
+    private _handleKeydown;
+    disconnectedCallback(): void;
+}
+export {};