@webx-ui/core 0.2.0 → 0.3.0

package/dist/components/Countdown/types.d.ts

@@ -0,0 +1,27 @@
+import { StatisticSize } from '../Statistic/types';
+import { TextAlign, TextTone } from '../Text/types';
+/** When the countdown reaches zero: a timestamp, a `Date`, or anything `Date` parses. */
+export type CountdownTarget = number | string | Date;
+export interface CountdownProps {
+    /** The moment being counted down to. */
+    value: CountdownTarget;
+    /**
+     * Pattern built from `DD`, `HH`, `mm`, `ss` and `SSS`. Only the tokens present are
+     * filled, so `mm:ss` counts the whole span in minutes rather than dropping the hours.
+     */
+    format?: string;
+    /** How often the display is refreshed, in milliseconds. */
+    interval?: number;
+    title?: string;
+    prefix?: string;
+    suffix?: string;
+    size?: StatisticSize;
+    tone?: TextTone;
+    align?: TextAlign;
+}
+export interface CountdownEmits {
+    /** Milliseconds left, on every tick. */
+    change: [remaining: number];
+    /** Fired once, when the target time is reached. */
+    finish: [];
+}

package/dist/components/DatePicker/DatePicker.d.ts

@@ -11,31 +11,31 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    close: () => any;
+    clear: () => any;
+    open: () => any;
     change: (value: DatePickerModelValue) => any;
     "update:modelValue": (value: DatePickerModelValue) => any;
-    open: () => any;
-    clear: () => any;
-    close: () => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onClose?: (() => any) | undefined;
+    onClear?: (() => any) | undefined;
+    onOpen?: (() => any) | undefined;
     onChange?: ((value: DatePickerModelValue) => any) | undefined;
     "onUpdate:modelValue"?: ((value: DatePickerModelValue) => any) | undefined;
-    onOpen?: (() => any) | undefined;
-    onClear?: (() => any) | undefined;
-    onClose?: (() => any) | undefined;
 }>, {
     name: string;
-    type: import('./types').DatePickerType;
     size: import('../..').ControlSize;
+    type: import('./types').DatePickerType;
     disabled: boolean;
-    id: string;
+    teleport: boolean | string;
+    placeholder: string;
     ariaLabel: string;
     clearable: boolean;
-    placeholder: string;
-    teleport: boolean | string;
-    readonly: boolean;
     status: import('../..').ControlStatus;
-    valueFormat: string;
+    id: string;
+    readonly: boolean;
     format: string;
+    valueFormat: string;
     minDate: string | Date;
     maxDate: string | Date;
     seconds: boolean;

package/dist/components/DateRangePicker/DateRangePicker.d.ts

@@ -11,30 +11,30 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    close: () => any;
+    clear: () => any;
+    open: () => any;
     change: (value: DateRangePickerModelValue) => any;
     "update:modelValue": (value: DateRangePickerModelValue) => any;
-    open: () => any;
-    clear: () => any;
-    close: () => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onClose?: (() => any) | undefined;
+    onClear?: (() => any) | undefined;
+    onOpen?: (() => any) | undefined;
     onChange?: ((value: DateRangePickerModelValue) => any) | undefined;
     "onUpdate:modelValue"?: ((value: DateRangePickerModelValue) => any) | undefined;
-    onOpen?: (() => any) | undefined;
-    onClear?: (() => any) | undefined;
-    onClose?: (() => any) | undefined;
 }>, {
     name: string;
     size: import('../..').ControlSize;
     disabled: boolean;
-    id: string;
+    teleport: boolean;
+    placeholder: string;
     ariaLabel: string;
     clearable: boolean;
-    placeholder: string;
-    teleport: boolean;
-    readonly: boolean;
     status: import('../..').ControlStatus;
-    valueFormat: string;
+    id: string;
+    readonly: boolean;
     format: string;
+    valueFormat: string;
     minDate: string | Date;
     maxDate: string | Date;
     weekStart: number;

package/dist/components/DateTimePicker/DateTimePicker.d.ts

@@ -25,15 +25,15 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
     name: string;
     size: import('../..').ControlSize;
     disabled: boolean;
-    id: string;
+    teleport: boolean | string;
+    placeholder: string;
     ariaLabel: string;
     clearable: boolean;
-    placeholder: string;
-    teleport: boolean | string;
-    readonly: boolean;
     status: import('../..').ControlStatus;
-    valueFormat: string;
+    id: string;
+    readonly: boolean;
     format: string;
+    valueFormat: string;
     minDate: string | Date;
     maxDate: string | Date;
     seconds: boolean;

package/dist/components/Dropdown/Dropdown.d.ts

@@ -0,0 +1,46 @@
+import { DropdownProps } from './types';
+type __VLS_Props = DropdownProps;
+declare function close(): void;
+type __VLS_PublicProps = {
+    'open'?: boolean;
+} & __VLS_Props;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        trigger?(_: {
+            open: boolean;
+        }): any;
+        default?(_: {
+            close: typeof close;
+        }): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    close: () => any;
+    open: () => any;
+    "update:open": (value: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onClose?: (() => any) | undefined;
+    onOpen?: (() => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {
+    disabled: boolean;
+    side: import('./types').DropdownSide;
+    align: import('./types').DropdownAlign;
+    offset: number;
+    alignOffset: number;
+    closeOnClick: boolean;
+    matchTriggerWidth: boolean;
+    teleport: boolean;
+    modal: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Dropdown/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxDropdown } from './Dropdown';
+export type * from './types';

package/dist/components/Dropdown/types.d.ts

@@ -0,0 +1,28 @@
+export type DropdownSide = 'top' | 'right' | 'bottom' | 'left';
+export type DropdownAlign = 'start' | 'center' | 'end';
+export interface DropdownProps {
+    /** Which side of the trigger the panel opens on. */
+    side?: DropdownSide;
+    /** How the panel lines up with the trigger along that side. */
+    align?: DropdownAlign;
+    /** Gap between the trigger and the panel, in pixels. */
+    offset?: number;
+    /** Shift along the trigger's edge, in pixels. */
+    alignOffset?: number;
+    /**
+     * Closes the panel when something inside it is clicked — menu behaviour. Turn it
+     * off for a panel of filters or checkboxes the user works in before leaving.
+     */
+    closeOnClick?: boolean;
+    /** Makes the panel at least as wide as the trigger. */
+    matchTriggerWidth?: boolean;
+    /** Render the panel in a portal so it escapes `overflow: hidden`. */
+    teleport?: boolean;
+    /** Blocks the rest of the page while the panel is open. */
+    modal?: boolean;
+    disabled?: boolean;
+}
+export interface DropdownEmits {
+    open: [];
+    close: [];
+}

package/dist/components/DropdownItem/DropdownItem.d.ts

@@ -0,0 +1,32 @@
+import { DropdownItemProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        before?(_: {}): any;
+        default?(_: {}): any;
+        after?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<DropdownItemProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<DropdownItemProps> & Readonly<{
+    onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    icon: import('..').IconName;
+    tone: import('./types').DropdownItemTone;
+    href: string;
+    target: string;
+    as: string | import('vue').Component;
+    disabled: boolean;
+    active: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/DropdownItem/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxDropdownItem } from './DropdownItem';
+export type * from './types';

package/dist/components/DropdownItem/types.d.ts

@@ -0,0 +1,20 @@
+import { Component } from 'vue';
+import { IconName } from '../Icon/types';
+export type DropdownItemTone = 'default' | 'primary' | 'danger' | 'success' | 'warning';
+export interface DropdownItemProps {
+    /** Icon before the label. */
+    icon?: IconName;
+    /** Renders an `<a>` instead of a `<button>`. */
+    href?: string;
+    target?: string;
+    /** Renders through another component — `RouterLink`, say, with `to` in the attrs. */
+    as?: string | Component;
+    /** Colour role. `danger` for the destructive row at the bottom of a menu. */
+    tone?: DropdownItemTone;
+    /** Marks the row as the current one. */
+    active?: boolean;
+    disabled?: boolean;
+}
+export interface DropdownItemEmits {
+    click: [event: MouseEvent];
+}

package/dist/components/EntityCard/EntityCard.d.ts

@@ -0,0 +1,40 @@
+import { EntityCardProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        media?(_: {}): any;
+        title?(_: {}): any;
+        subtitle?(_: {}): any;
+        meta?(_: {}): any;
+        default?(_: {}): any;
+        actions?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<EntityCardProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<EntityCardProps> & Readonly<{
+    onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    image: string;
+    size: import('./types').EntityCardSize;
+    meta: import('./types').EntityCardMeta[];
+    title: string;
+    href: string;
+    variant: import('./types').EntityCardVariant;
+    bordered: boolean;
+    subtitle: string;
+    imageAlt: string;
+    shape: import('./types').EntityCardShape;
+    imageSize: number | string;
+    selected: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/EntityCard/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxEntityCard } from './EntityCard';
+export type * from './types';

package/dist/components/EntityCard/types.d.ts

@@ -0,0 +1,37 @@
+export type EntityCardSize = 'sm' | 'md' | 'lg';
+export type EntityCardVariant = 'card' | 'plain';
+export type EntityCardShape = 'rounded' | 'square' | 'circle';
+/** One fact under the title: "Sections: News", "Updated 12.03", a status. */
+export interface EntityCardMeta {
+    /** Prefix shown in muted text — the field name. */
+    label?: string;
+    /** The value itself. Leave empty to show the label alone, as an empty field reads. */
+    text?: string;
+}
+export interface EntityCardProps {
+    /** Name of the entity — the line that identifies the row. */
+    title?: string;
+    /** Turns the title into a link. */
+    href?: string;
+    /** Second line, between the title and the meta row. */
+    subtitle?: string;
+    /** Thumbnail, avatar, cover — anything small and square. */
+    image?: string;
+    imageAlt?: string;
+    /** Shape of the thumbnail. Use `circle` for people, `rounded` for content. */
+    shape?: EntityCardShape;
+    /** Thumbnail size. A number is pixels; a string is used as a CSS length. */
+    imageSize?: number | string;
+    /** Facts under the title. Use the `meta` slot when a fact needs markup. */
+    meta?: EntityCardMeta[];
+    size?: EntityCardSize;
+    /** `card` sits on its own surface; `plain` drops the background for use inside one. */
+    variant?: EntityCardVariant;
+    bordered?: boolean;
+    /** Highlights the card as the current one — a picked item in a list. */
+    selected?: boolean;
+}
+export interface EntityCardEmits {
+    /** The card body was clicked — the row, not the buttons in `#actions`. */
+    click: [event: MouseEvent];
+}

package/dist/components/FormItem/FormItem.d.ts

@@ -16,10 +16,10 @@ declare const __VLS_component: import('vue').DefineComponent<FormItemProps, {
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<FormItemProps> & Readonly<{}>, {
     name: string;
     size: ControlSize;
-    disabled: boolean;
     label: string;
-    error: string | string[];
     required: boolean;
+    disabled: boolean;
+    error: string | string[];
     labelWidth: string;
     help: string;
     reserveErrorSpace: boolean;

package/dist/components/Heading/Heading.d.ts

@@ -0,0 +1,24 @@
+import { HeadingLevel, HeadingProps, HeadingSize } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<HeadingProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<HeadingProps> & Readonly<{}>, {
+    size: HeadingSize;
+    tone: import('..').TextTone;
+    align: import('..').TextAlign;
+    level: HeadingLevel;
+    truncate: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Heading/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxHeading } from './Heading';
+export type * from './types';

package/dist/components/Heading/types.d.ts

@@ -0,0 +1,16 @@
+import { TextAlign, TextTone } from '../Text/types';
+export type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+export type HeadingSize = 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
+export interface HeadingProps {
+    /** Which `<h*>` to render. Keep it truthful to the document outline. */
+    level?: HeadingLevel;
+    /**
+     * Visual size, when it should differ from the level — an `h3` that has to look
+     * like a page title, or an `h1` that must stay small in a drawer.
+     */
+    size?: HeadingSize;
+    tone?: TextTone;
+    align?: TextAlign;
+    /** Cuts the heading off with an ellipsis after one line. */
+    truncate?: boolean;
+}

package/dist/components/Icon/Icon.d.ts

@@ -0,0 +1,8 @@
+import { IconProps } from './types';
+declare const _default: import('vue').DefineComponent<IconProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<IconProps> & Readonly<{}>, {
+    size: import('./types').IconSize | number | string;
+    strokeWidth: number | string;
+    spin: boolean;
+    label: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/Icon/icons.d.ts

@@ -0,0 +1,85 @@
+/**
+ * The built-in icon set.
+ *
+ * Every entry is the *inside* of a 24×24 `<svg>` drawn in `currentColor` with a
+ * stroke — the wrapper in `Icon.vue` supplies the viewBox, the stroke width and the
+ * colour, so an icon inherits the text it sits next to. Shapes that read better
+ * filled (dots, pips) set `fill="currentColor" stroke="none"` themselves.
+ */
+export declare const builtinIcons: {
+    readonly check: "<path d=\"m5 13 4.5 4.5L19 7\"/>";
+    readonly 'check-circle': "<circle cx=\"12\" cy=\"12\" r=\"8.5\"/><path d=\"m8.2 12.2 2.6 2.6 5-5.2\"/>";
+    readonly close: "<path d=\"M18 6 6 18M6 6l12 12\"/>";
+    readonly 'close-circle': "<circle cx=\"12\" cy=\"12\" r=\"8.5\"/><path d=\"m9 9 6 6m0-6-6 6\"/>";
+    readonly plus: "<path d=\"M12 5v14M5 12h14\"/>";
+    readonly minus: "<path d=\"M5 12h14\"/>";
+    readonly edit: "<path d=\"M4 20h4L19.5 8.5a2.83 2.83 0 0 0-4-4L4 16v4Z\"/><path d=\"m14.5 5.5 4 4\"/>";
+    readonly trash: "<path d=\"M4 7h16M10 7V5.5A1.5 1.5 0 0 1 11.5 4h1A1.5 1.5 0 0 1 14 5.5V7M6.5 7l.8 11.6a2 2 0 0 0 2 1.9h5.4a2 2 0 0 0 2-1.9L17.5 7\"/><path d=\"M10 11v5.5M14 11v5.5\"/>";
+    readonly copy: "<rect x=\"8.5\" y=\"8.5\" width=\"11\" height=\"11\" rx=\"2.2\"/><path d=\"M15.5 8.5v-2a2 2 0 0 0-2-2h-7a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h2\"/>";
+    readonly search: "<circle cx=\"11\" cy=\"11\" r=\"6.5\"/><path d=\"m16 16 4.5 4.5\"/>";
+    readonly filter: "<path d=\"M4 5.5h16l-6.2 7.2v5.1l-3.6 2v-7.1z\"/>";
+    readonly refresh: "<path d=\"M4 12a8 8 0 0 1 13.7-5.6L20 8.5\"/><path d=\"M20 4.5v4h-4\"/><path d=\"M20 12a8 8 0 0 1-13.7 5.6L4 15.5\"/><path d=\"M4 19.5v-4h4\"/>";
+    readonly upload: "<path d=\"M12 16V4m0 0-4.5 4.5M12 4l4.5 4.5\"/><path d=\"M4 15v3.5A1.5 1.5 0 0 0 5.5 20h13a1.5 1.5 0 0 0 1.5-1.5V15\"/>";
+    readonly download: "<path d=\"M12 4v12m0 0-4.5-4.5M12 16l4.5-4.5\"/><path d=\"M4 15v3.5A1.5 1.5 0 0 0 5.5 20h13a1.5 1.5 0 0 0 1.5-1.5V15\"/>";
+    readonly logout: "<path d=\"M14 6V5a1.5 1.5 0 0 0-1.5-1.5h-6A1.5 1.5 0 0 0 5 5v14a1.5 1.5 0 0 0 1.5 1.5h6A1.5 1.5 0 0 0 14 19v-1\"/><path d=\"M10 12h10m0 0-3-3m3 3-3 3\"/>";
+    readonly 'chevron-down': "<path d=\"m6 9.5 6 6 6-6\"/>";
+    readonly 'chevron-up': "<path d=\"m6 14.5 6-6 6 6\"/>";
+    readonly 'chevron-left': "<path d=\"m14.5 6-6 6 6 6\"/>";
+    readonly 'chevron-right': "<path d=\"m9.5 6 6 6-6 6\"/>";
+    readonly 'arrow-up': "<path d=\"M12 20V4m0 0 6 6m-6-6-6 6\"/>";
+    readonly 'arrow-down': "<path d=\"M12 4v16m0 0 6-6m-6 6-6-6\"/>";
+    readonly 'arrow-left': "<path d=\"M20 12H4m0 0 6-6m-6 6 6 6\"/>";
+    readonly 'arrow-right': "<path d=\"M4 12h16m0 0-6-6m6 6-6 6\"/>";
+    readonly menu: "<path d=\"M4 7h16M4 12h16M4 17h16\"/>";
+    readonly 'more-horizontal': "<circle cx=\"5.5\" cy=\"12\" r=\"1.6\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"1.6\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"18.5\" cy=\"12\" r=\"1.6\" fill=\"currentColor\" stroke=\"none\"/>";
+    readonly 'more-vertical': "<circle cx=\"12\" cy=\"5.5\" r=\"1.6\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"1.6\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"12\" cy=\"18.5\" r=\"1.6\" fill=\"currentColor\" stroke=\"none\"/>";
+    readonly drag: "<circle cx=\"9\" cy=\"6\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"15\" cy=\"6\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"9\" cy=\"12\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"15\" cy=\"12\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"9\" cy=\"18\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"15\" cy=\"18\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\"/>";
+    readonly user: "<circle cx=\"12\" cy=\"8\" r=\"3.75\"/><path d=\"M4.5 20a7.5 7.5 0 0 1 15 0\"/>";
+    readonly users: "<circle cx=\"9.5\" cy=\"8.5\" r=\"3.4\"/><path d=\"M2.5 20a7 7 0 0 1 14 0\"/><path d=\"M16 5.5a3.4 3.4 0 0 1 0 6.6M17.5 14.2A6.3 6.3 0 0 1 21.5 20\"/>";
+    readonly settings: "<circle cx=\"12\" cy=\"12\" r=\"3\"/><path d=\"M12 4v2.5M12 17.5V20M4 12h2.5M17.5 12H20M6.34 6.34l1.77 1.77M15.89 15.89l1.77 1.77M17.66 6.34l-1.77 1.77M6.34 17.66l1.77-1.77\"/>";
+    readonly sliders: "<path d=\"M4 7h9M17 7h3M4 17h3M11 17h9\"/><circle cx=\"15\" cy=\"7\" r=\"2\"/><circle cx=\"9\" cy=\"17\" r=\"2\"/>";
+    readonly home: "<path d=\"M4 10.5 12 4l8 6.5V19a1.5 1.5 0 0 1-1.5 1.5H15V14H9v6.5H5.5A1.5 1.5 0 0 1 4 19Z\"/>";
+    readonly file: "<path d=\"M13.5 3.5H7a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V9zm0 0V9H19\"/>";
+    readonly folder: "<path d=\"M3.5 7a2 2 0 0 1 2-2h3.2a2 2 0 0 1 1.5.7l1.3 1.5h7a2 2 0 0 1 2 2v8.3a2 2 0 0 1-2 2h-13a2 2 0 0 1-2-2z\"/>";
+    readonly image: "<rect x=\"3.5\" y=\"4.5\" width=\"17\" height=\"15\" rx=\"2.5\"/><circle cx=\"8.75\" cy=\"9.75\" r=\"1.75\"/><path d=\"m4 17 4.5-4.2a2 2 0 0 1 2.7 0l3 2.8 1.6-1.5a2 2 0 0 1 2.7 0L20 16\"/>";
+    readonly calendar: "<rect x=\"3.5\" y=\"5.5\" width=\"17\" height=\"15\" rx=\"2.5\"/><path d=\"M3.5 10h17M8 3.5V7M16 3.5V7\"/>";
+    readonly clock: "<circle cx=\"12\" cy=\"12\" r=\"8.5\"/><path d=\"M12 7.5V12l3 2\"/>";
+    readonly mail: "<rect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"2.5\"/><path d=\"m4 7.5 6.9 5a2 2 0 0 0 2.2 0l6.9-5\"/>";
+    readonly phone: "<path d=\"M7 3.5 9.5 4l1.2 3.4-1.9 1.6a11 11 0 0 0 5.2 5.2l1.6-1.9 3.4 1.2.5 2.5a2 2 0 0 1-2 2.3A15.5 15.5 0 0 1 4.7 5.5a2 2 0 0 1 2.3-2Z\"/>";
+    readonly bell: "<path d=\"M7 10a5 5 0 0 1 10 0c0 4 1.5 5.5 1.5 5.5h-13S7 14 7 10Z\"/><path d=\"M10.2 18.5a2 2 0 0 0 3.6 0\"/>";
+    readonly cart: "<path d=\"M3 4.5h2.2l2.3 10.2a1.6 1.6 0 0 0 1.6 1.3h7.4a1.6 1.6 0 0 0 1.6-1.2L20 8H6\"/><circle cx=\"10\" cy=\"19.5\" r=\"1.5\"/><circle cx=\"17\" cy=\"19.5\" r=\"1.5\"/>";
+    readonly tag: "<path d=\"M4 11.2V5.5A1.5 1.5 0 0 1 5.5 4h5.7a2 2 0 0 1 1.4.6l7 7a2 2 0 0 1 0 2.8l-5.2 5.2a2 2 0 0 1-2.8 0l-7-7a2 2 0 0 1-.6-1.4Z\"/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.4\" fill=\"currentColor\" stroke=\"none\"/>";
+    readonly link: "<path d=\"M10 14a4 4 0 0 0 5.7 0l3-3a4 4 0 0 0-5.7-5.7L11.5 7\"/><path d=\"M14 10a4 4 0 0 0-5.7 0l-3 3A4 4 0 0 0 11 18.7L12.5 17\"/>";
+    readonly 'external-link': "<path d=\"M13.5 4.5H20V11\"/><path d=\"m11 13 9-8.5\"/><path d=\"M19 14.5v4a1.5 1.5 0 0 1-1.5 1.5h-11A1.5 1.5 0 0 1 5 18.5v-11A1.5 1.5 0 0 1 6.5 6h4\"/>";
+    readonly lock: "<rect x=\"4.5\" y=\"10\" width=\"15\" height=\"10\" rx=\"2.5\"/><path d=\"M8 10V7.8a4 4 0 0 1 8 0V10\"/>";
+    readonly unlock: "<rect x=\"4.5\" y=\"10\" width=\"15\" height=\"10\" rx=\"2.5\"/><path d=\"M8 10V7.8a4 4 0 0 1 7.6-1.8\"/>";
+    readonly grid: "<rect x=\"4\" y=\"4\" width=\"7\" height=\"7\" rx=\"1.8\"/><rect x=\"13\" y=\"4\" width=\"7\" height=\"7\" rx=\"1.8\"/><rect x=\"4\" y=\"13\" width=\"7\" height=\"7\" rx=\"1.8\"/><rect x=\"13\" y=\"13\" width=\"7\" height=\"7\" rx=\"1.8\"/>";
+    readonly list: "<path d=\"M9 6h11M9 12h11M9 18h11\"/><circle cx=\"5\" cy=\"6\" r=\"1.4\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"5\" cy=\"12\" r=\"1.4\" fill=\"currentColor\" stroke=\"none\"/><circle cx=\"5\" cy=\"18\" r=\"1.4\" fill=\"currentColor\" stroke=\"none\"/>";
+    readonly eye: "<path d=\"M2.5 12S6.8 5.5 12 5.5 21.5 12 21.5 12 17.2 18.5 12 18.5 2.5 12 2.5 12Z\"/><circle cx=\"12\" cy=\"12\" r=\"2.75\"/>";
+    readonly 'eye-off': "<path d=\"M10.2 6a9.9 9.9 0 0 1 1.8-.2c5.2 0 9.5 6.2 9.5 6.2a18 18 0 0 1-3.3 3.8M6.6 7.9A17.8 17.8 0 0 0 2.5 12s4.3 6.5 9.5 6.5a9.4 9.4 0 0 0 3.3-.6\"/><path d=\"m4 4 16 16\"/>";
+    readonly star: "<path d=\"m12 4 2.5 5.1 5.6.8-4 4 .9 5.6-5-2.7-5 2.7.9-5.6-4-4 5.6-.8z\"/>";
+    readonly heart: "<path d=\"M12 19.5S4 15 4 9.8A4.3 4.3 0 0 1 12 7.4 4.3 4.3 0 0 1 20 9.8c0 5.2-8 9.7-8 9.7Z\"/>";
+    readonly sun: "<circle cx=\"12\" cy=\"12\" r=\"4\"/><path d=\"M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6 7 7M17 17l1.4 1.4M18.4 5.6 17 7M7 17l-1.4 1.4\"/>";
+    readonly moon: "<path d=\"M20 14.5A8.5 8.5 0 0 1 9.5 4a8.5 8.5 0 1 0 10.5 10.5Z\"/>";
+    readonly info: "<circle cx=\"12\" cy=\"12\" r=\"8.5\"/><path d=\"M12 11v5\"/><circle cx=\"12\" cy=\"7.75\" r=\"1.05\" fill=\"currentColor\" stroke=\"none\"/>";
+    readonly warning: "<path d=\"M10.3 4.9a2 2 0 0 1 3.4 0l7 12.1a2 2 0 0 1-1.7 3H5a2 2 0 0 1-1.7-3z\"/><path d=\"M12 9.5v4\"/><circle cx=\"12\" cy=\"16.6\" r=\"1.05\" fill=\"currentColor\" stroke=\"none\"/>";
+    readonly question: "<circle cx=\"12\" cy=\"12\" r=\"8.5\"/><path d=\"M9.6 9.4a2.5 2.5 0 0 1 4.9.6c0 1.7-2.5 2-2.5 3.5\"/><circle cx=\"12\" cy=\"16.6\" r=\"1.05\" fill=\"currentColor\" stroke=\"none\"/>";
+    readonly loader: "<path d=\"M12 3.5v4M12 16.5v4M3.5 12h4M16.5 12h4M6 6l2.8 2.8M15.2 15.2 18 18M18 6l-2.8 2.8M8.8 15.2 6 18\"/>";
+};
+/** Every name the library ships with. */
+export type BuiltinIconName = keyof typeof builtinIcons;
+/**
+ * Adds icons to the set, so `<wx-icon name="my-logo" />` works anywhere in the app.
+ *
+ * ```ts
+ * registerIcons({ 'my-logo': '<path d="M4 4h16v16H4z" />' })
+ * ```
+ *
+ * The markup is injected as-is, so register only icons you author or control —
+ * never a string that arrived from a user or an API.
+ */
+export declare function registerIcons(icons: Record<string, string>): void;
+/** The markup of an icon, or `undefined` when nothing is registered under that name. */
+export declare function resolveIcon(name: string): string | undefined;
+/** Names currently available, built-in plus registered — handy for a docs gallery. */
+export declare function iconNames(): string[];

package/dist/components/Icon/index.d.ts

@@ -0,0 +1,4 @@
+export { default as WxIcon } from './Icon';
+export { builtinIcons, registerIcons, resolveIcon, iconNames } from './icons';
+export type { BuiltinIconName } from './icons';
+export type * from './types';

package/dist/components/Icon/types.d.ts

@@ -0,0 +1,25 @@
+import { BuiltinIconName } from './icons';
+/**
+ * A built-in name, or any string once `registerIcons` has added your own — the
+ * `(string & {})` arm keeps autocompletion for the built-ins while accepting the rest.
+ */
+export type IconName = BuiltinIconName | (string & {});
+export type IconSize = 'sm' | 'md' | 'lg';
+export interface IconProps {
+    /** Name in the icon set. Unknown names render nothing. */
+    name: IconName;
+    /**
+     * Box size. A keyword follows the text scale; a number is pixels; any other string
+     * is used as a CSS length. Defaults to `1em`, so an icon matches its surrounding text.
+     */
+    size?: IconSize | number | string;
+    /** Stroke width in the 24×24 grid. */
+    strokeWidth?: number | string;
+    /** Spins the icon — for `loader` and `refresh` while something is in flight. */
+    spin?: boolean;
+    /**
+     * Accessible name. Without it the icon is `aria-hidden`, which is what you want
+     * whenever there is a visible label beside it.
+     */
+    label?: string;
+}

package/dist/components/Indicator/Indicator.d.ts

@@ -0,0 +1,29 @@
+import { IndicatorProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+        mark?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLSpanElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<IndicatorProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<IndicatorProps> & Readonly<{}>, {
+    label: string;
+    type: import('./types').IndicatorType;
+    hidden: boolean;
+    offset: [number, number];
+    value: number | string;
+    dot: boolean;
+    max: number;
+    showZero: boolean;
+    placement: import('./types').IndicatorPlacement;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Indicator/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxIndicator } from './Indicator';
+export type * from './types';

package/dist/components/Indicator/types.d.ts

@@ -0,0 +1,21 @@
+export type IndicatorType = 'danger' | 'primary' | 'success' | 'warning' | 'info' | 'neutral';
+export type IndicatorPlacement = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
+export interface IndicatorProps {
+    /** The count (or any short text) to show. Numbers above `max` become `99+`. */
+    value?: number | string;
+    /** Largest number shown in full. Only applies to numeric values. */
+    max?: number;
+    /** Draws a plain dot instead of a number — "something happened here". */
+    dot?: boolean;
+    /** Keeps the mark visible at 0; by default a zero count hides it. */
+    showZero?: boolean;
+    /** Corner the mark sits in, relative to the wrapped element. */
+    placement?: IndicatorPlacement;
+    /** Nudge in pixels: `[x, y]`, positive values move right and down. */
+    offset?: [number, number];
+    type?: IndicatorType;
+    /** Hides the mark without unmounting what it wraps. */
+    hidden?: boolean;
+    /** Accessible text for the mark — e.g. `2 items in cart`. */
+    label?: string;
+}