@smwb/ui-solid 0.1.0

package/dist/components/dataDisplay/table/tablePagination/tablePagination.d.ts

@@ -0,0 +1,20 @@
+import { type JSX } from "solid-js";
+export interface BaseTablePaginationProps {
+    page: number;
+    limit: number;
+    onPrev?: () => void;
+    onNext?: () => void;
+    limitOptions?: number[];
+    onLimitChange?: (limit: number) => void;
+}
+interface WithTotalCount extends BaseTablePaginationProps {
+    totalCount: number;
+    hasNextPage?: never;
+}
+interface WithHasNextPage extends BaseTablePaginationProps {
+    totalCount?: never;
+    hasNextPage: boolean;
+}
+export type TablePaginationProps = WithTotalCount | WithHasNextPage;
+export declare function TablePagination(props: TablePaginationProps): JSX.Element;
+export default TablePagination;

package/dist/components/dataDisplay/table/tablePagination/tablePagination.js

@@ -0,0 +1,55 @@
+import { insert as i, createComponent as c, effect as b, className as x, memo as S, template as d, delegateEvents as N } from "solid-js/web";
+import '../../../../assets/styles/less/components/table/tablePagination/tablePagination.entry.css';/* empty css                                                                                  */
+import { Show as k, For as L } from "solid-js";
+import O from "clsx";
+import { Icon as h } from "../../../base/icon/icon.js";
+var P = /* @__PURE__ */ d("<div class=smwb-table__pagination__rows><span>Rows per page</span><select id=rows class=smwb-table__pagination__select>"), T = /* @__PURE__ */ d("<div class=smwb-table__pagination><div class=smwb-table__pagination__controls><div class=smwb-table__pagination__current-count></div><div class=smwb-table__pagination__buttons><button class=smwb-table__pagination__control></button><span class=smwb-table__pagination__page></span><button class=smwb-table__pagination__control>"), z = /* @__PURE__ */ d("<option>");
+function F(t) {
+  const u = () => typeof t.totalCount > "u", $ = () => u() ? !t.hasNextPage : t.page === Math.ceil(t.totalCount / t.limit), f = () => {
+    const n = t.page * t.limit - t.limit, l = t.page * t.limit;
+    return `${n}–${l}` + (u() ? "" : ` of ${t.totalCount}`);
+  }, w = (n) => {
+    t.onLimitChange?.(+n.currentTarget.value);
+  };
+  return (() => {
+    var n = T(), l = n.firstChild, m = l.firstChild, C = m.nextSibling, o = C.firstChild, v = o.nextSibling, r = v.nextSibling;
+    return i(l, c(k, {
+      get when() {
+        return S(() => !!t.limitOptions)() && t.limitOptions.length > 1;
+      },
+      get children() {
+        var e = P(), _ = e.firstChild, a = _.nextSibling;
+        return a.addEventListener("change", w), i(a, c(L, {
+          get each() {
+            return t.limitOptions;
+          },
+          children: (g) => (() => {
+            var s = z();
+            return s.value = g, i(s, g), b(() => x(s, O("smwb-select-option", {
+              selected: g === t.limit
+            }))), s;
+          })()
+        })), b(() => a.value = t.limit), e;
+      }
+    }), m), i(m, f), o.$$click = () => t.onPrev?.(), i(o, c(h, {
+      name: "chevron_left",
+      size: 24,
+      weight: 600
+    })), i(v, () => t.page), r.$$click = () => t.onNext?.(), i(r, c(h, {
+      name: "chevron_right",
+      size: 24,
+      weight: 600
+    })), b((e) => {
+      var _ = t.page === 1, a = $();
+      return _ !== e.e && (o.disabled = e.e = _), a !== e.t && (r.disabled = e.t = a), e;
+    }, {
+      e: void 0,
+      t: void 0
+    }), n;
+  })();
+}
+N(["click"]);
+export {
+  F as TablePagination
+};
+//# sourceMappingURL=tablePagination.js.map

package/dist/components/dataDisplay/table/tablePagination/tablePagination.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tablePagination.js","sources":["../../../../../src/components/dataDisplay/table/tablePagination/tablePagination.tsx"],"sourcesContent":["import { type JSX, For, Show } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../../base/icon\";\n\nexport interface BaseTablePaginationProps {\n  page: number;\n  limit: number;\n  onPrev?: () => void;\n  onNext?: () => void;\n  limitOptions?: number[];\n  onLimitChange?: (limit: number) => void;\n}\n\ninterface WithTotalCount extends BaseTablePaginationProps {\n  totalCount: number;\n  hasNextPage?: never;\n}\n\ninterface WithHasNextPage extends BaseTablePaginationProps {\n  totalCount?: never;\n  hasNextPage: boolean;\n}\n\nexport type TablePaginationProps = WithTotalCount | WithHasNextPage;\n\nexport function TablePagination(props: TablePaginationProps): JSX.Element {\n  const isInfiniteMode = (): boolean => typeof props.totalCount === \"undefined\";\n  const isDisabledNext = (): boolean =>\n    isInfiniteMode() ? !props.hasNextPage : props.page === Math.ceil((props.totalCount as number) / props.limit);\n\n  const countText = (): string => {\n    const from = props.page * props.limit - props.limit;\n    const to = props.page * props.limit;\n    return `${from}–${to}` + (isInfiniteMode() ? \"\" : ` of ${props.totalCount}`);\n  };\n\n  const onLimitChange: JSX.EventHandler<HTMLSelectElement, Event> = (event) => {\n    props.onLimitChange?.(+event.currentTarget.value);\n  };\n\n  return (\n    <div class=\"smwb-table__pagination\">\n      <div class=\"smwb-table__pagination__controls\">\n        <Show when={props.limitOptions && props.limitOptions.length > 1}>\n          <div class=\"smwb-table__pagination__rows\">\n            <span>Rows per page</span>\n            <select id=\"rows\" class=\"smwb-table__pagination__select\" onChange={onLimitChange} value={props.limit}>\n              <For each={props.limitOptions}>\n                {(opt) => (\n                  <option value={opt} class={cn(\"smwb-select-option\", { selected: opt === props.limit })}>\n                    {opt}\n                  </option>\n                )}\n              </For>\n            </select>\n          </div>\n        </Show>\n        <div class=\"smwb-table__pagination__current-count\">{countText()}</div>\n        <div class=\"smwb-table__pagination__buttons\">\n          <button class=\"smwb-table__pagination__control\" onClick={() => props.onPrev?.()} disabled={props.page === 1}>\n            <Icon name=\"chevron_left\" size={24} weight={600} />\n          </button>\n          <span class=\"smwb-table__pagination__page\">{props.page}</span>\n          <button class=\"smwb-table__pagination__control\" onClick={() => props.onNext?.()} disabled={isDisabledNext()}>\n            <Icon name=\"chevron_right\" size={24} weight={600} />\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default TablePagination;\n"],"names":["TablePagination","props","isInfiniteMode","totalCount","isDisabledNext","hasNextPage","page","Math","ceil","limit","countText","from","to","onLimitChange","event","currentTarget","value","_el$","_tmpl$2","_el$2","firstChild","_el$6","_el$7","nextSibling","_el$8","_el$9","_el$0","_$insert","_$createComponent","Show","when","_$memo","limitOptions","length","children","_el$3","_tmpl$","_el$4","_el$5","addEventListener","For","each","opt","_el$1","_tmpl$3","_$effect","_$className","cn","selected","$$click","onPrev","Icon","name","size","weight","onNext","_p$","_v$","_v$2","e","disabled","t","undefined","_$delegateEvents"],"mappings":";;;;;;AA0BO,SAASA,EAAgBC,GAA0C;AACxE,QAAMC,IAAiBA,MAAe,OAAOD,EAAME,aAAe,KAC5DC,IAAiBA,MACrBF,EAAAA,IAAmB,CAACD,EAAMI,cAAcJ,EAAMK,SAASC,KAAKC,KAAMP,EAAME,aAAwBF,EAAMQ,KAAK,GAEvGC,IAAYA,MAAc;AAC9B,UAAMC,IAAOV,EAAMK,OAAOL,EAAMQ,QAAQR,EAAMQ,OACxCG,IAAKX,EAAMK,OAAOL,EAAMQ;AAC9B,WAAO,GAAGE,CAAI,IAAIC,CAAE,MAAMV,MAAmB,KAAK,OAAOD,EAAME,UAAU;AAAA,EAC3E,GAEMU,IAA6DC,CAAAA,MAAU;AAC3Eb,IAAAA,EAAMY,gBAAgB,CAACC,EAAMC,cAAcC,KAAK;AAAA,EAClD;AAEA,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAE,aAAAC,IAAAF,EAAAF,YAAAK,IAAAD,EAAAD,aAAAG,IAAAD,EAAAF;AAAAI,WAAAA,EAAAR,GAAAS,EAGOC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEC,EAAA,MAAA,CAAA,CAAA9B,EAAM+B,YAAY,EAAA,KAAI/B,EAAM+B,aAAaC,SAAS;AAAA,MAAC;AAAA,MAAA,IAAAC,WAAA;AAAA,YAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAf,YAAAkB,IAAAD,EAAAd;AAAAe,eAAAA,EAAAC,iBAAA,UAGQ1B,CAAa,GAAAc,EAAAW,GAAAV,EAC7EY,GAAG;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAExC,EAAM+B;AAAAA,UAAY;AAAA,UAAAE,UACzBQ,QAAG,MAAA;AAAA,gBAAAC,IAAAC,EAAAA;AAAAD,mBAAAA,EAAA3B,QACY0B,GAAGf,EAAAgB,GACfD,CAAG,GAAAG,EAAA,MAAAC,EAAAH,GADqBI,EAAG,sBAAsB;AAAA,cAAEC,UAAUN,MAAQzC,EAAMQ;AAAAA,YAAAA,CAAO,CAAC,CAAA,GAAAkC;AAAAA,UAAA,GAAA;AAAA,QAAA,CAGvF,CAAA,GAAAE,QAAAP,EAAAtB,QANoFf,EAAMQ,KAAK,GAAA0B;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAAd,CAAA,GAAAM,EAAAN,GAWpDX,CAAS,GAAAc,EAAAyB,UAEF,MAAMhD,EAAMiD,SAAAA,GAAUvB,EAAAH,GAAAI,EAC5EuB,GAAI;AAAA,MAACC,MAAI;AAAA,MAAgBC,MAAM;AAAA,MAAIC,QAAQ;AAAA,IAAA,CAAG,CAAA,GAAA3B,EAAAF,GAAA,MAELxB,EAAMK,IAAI,GAAAoB,EAAAuB,UACG,MAAMhD,EAAMsD,SAAAA,GAAU5B,EAAAD,GAAAE,EAC5EuB,GAAI;AAAA,MAACC,MAAI;AAAA,MAAiBC,MAAM;AAAA,MAAIC,QAAQ;AAAA,IAAA,CAAG,CAAA,GAAAT,EAAAW,CAAAA,MAAA;AAAA,UAAAC,IALyCxD,EAAMK,SAAS,GAACoD,IAIhBtD,EAAAA;AAAgBqD,aAAAA,MAAAD,EAAAG,MAAAnC,EAAAoC,WAAAJ,EAAAG,IAAAF,IAAAC,MAAAF,EAAAK,MAAAnC,EAAAkC,WAAAJ,EAAAK,IAAAH,IAAAF;AAAAA,IAAA,GAAA;AAAA,MAAAG,GAAAG;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA,GAAA7C;AAAAA,EAAA,GAAA;AAOrH;AAE+B8C,EAAA,CAAA,OAAA,CAAA;"}

package/dist/components/dataDisplay/table/tableRow.d.ts

@@ -0,0 +1,11 @@
+import { type JSX, type ParentProps } from "solid-js";
+import { type Ref } from "../../../primitives/mergeRefs";
+export interface TableRowProps extends JSX.HTMLAttributes<HTMLTableRowElement> {
+    /** Marks the row as selected (adds aria-selected + styling). */
+    selected?: boolean;
+    /** Reflects expandable-row state (adds aria-expanded + styling). */
+    expanded?: boolean;
+    ref?: Ref<HTMLTableRowElement>;
+}
+export declare function TableRow(props: ParentProps<TableRowProps>): JSX.Element;
+export default TableRow;

package/dist/components/dataDisplay/table/tableRow.js

@@ -0,0 +1,30 @@
+import { use as o, spread as d, mergeProps as l, insert as n, template as p } from "solid-js/web";
+import { splitProps as c } from "solid-js";
+import i from "clsx";
+import { mergeRefs as m } from "../../../primitives/mergeRefs.js";
+var f = /* @__PURE__ */ p("<tr>");
+function x(a) {
+  const [e, s] = c(a, ["children", "class", "selected", "expanded", "ref"]);
+  return (() => {
+    var r = f(), t = m(e.ref);
+    return typeof t == "function" && o(t, r), d(r, l(s, {
+      "data-testid": "table-row",
+      get class() {
+        return i("smwb-table__row", e.class, {
+          "smwb-table__row_selected": e.selected,
+          "smwb-table__row_expanded": e.expanded
+        });
+      },
+      get "aria-selected"() {
+        return e.selected ?? void 0;
+      },
+      get "aria-expanded"() {
+        return e.expanded ?? void 0;
+      }
+    }), !1, !0), n(r, () => e.children), r;
+  })();
+}
+export {
+  x as TableRow
+};
+//# sourceMappingURL=tableRow.js.map

package/dist/components/dataDisplay/table/tableRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tableRow.js","sources":["../../../../src/components/dataDisplay/table/tableRow.tsx"],"sourcesContent":["import { type JSX, type ParentProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface TableRowProps extends JSX.HTMLAttributes<HTMLTableRowElement> {\n  /** Marks the row as selected (adds aria-selected + styling). */\n  selected?: boolean;\n  /** Reflects expandable-row state (adds aria-expanded + styling). */\n  expanded?: boolean;\n  ref?: Ref<HTMLTableRowElement>;\n}\n\nexport function TableRow(props: ParentProps<TableRowProps>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"selected\", \"expanded\", \"ref\"]);\n  return (\n    <tr\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      data-testid=\"table-row\"\n      class={cn(\"smwb-table__row\", local.class, {\n        \"smwb-table__row_selected\": local.selected,\n        \"smwb-table__row_expanded\": local.expanded,\n      })}\n      aria-selected={local.selected ?? undefined}\n      aria-expanded={local.expanded ?? undefined}\n    >\n      {local.children}\n    </tr>\n  );\n}\n\nexport default TableRow;\n"],"names":["TableRow","props","local","rest","splitProps","_el$","_tmpl$","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","selected","expanded","undefined","_$insert","children"],"mappings":";;;;;AAYO,SAASA,EAASC,GAAgD;AACvE,QAAM,CAACC,GAAOC,CAAI,IAAIC,EAAWH,GAAO,CAAC,YAAY,SAAS,YAAY,YAAY,KAAK,CAAC;AAC5F,UAAA,MAAA;AAAA,QAAAI,IAAAC,EAAAA,GAAAC,IAGSC,EAAUN,EAAMO,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAO,EADrBT,GAAI;AAAA,MAAA,eAEI;AAAA,MAAW,IAAA,QAAA;AAAA,eAChBU,EAAG,mBAAmBX,EAAMY,OAAO;AAAA,UACxC,4BAA4BZ,EAAMa;AAAAA,UAClC,4BAA4Bb,EAAMc;AAAAA,QAAAA,CACnC;AAAA,MAAC;AAAA,MAAA,IAAA,kBAAA;AAAA,eACad,EAAMa,YAAYE;AAAAA,MAAS;AAAA,MAAA,IAAA,kBAAA;AAAA,eAC3Bf,EAAMc,YAAYC;AAAAA,MAAS;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAC,EAAAb,GAAA,MAEzCH,EAAMiB,QAAQ,GAAAd;AAAAA,EAAA,GAAA;AAGrB;"}

package/dist/components/dataDisplay/treeView/index.d.ts

@@ -0,0 +1,2 @@
+export { TreeView, default } from "./treeView";
+export type { TreeViewProps, ITreeNodeItem } from "./treeView";

package/dist/components/dataDisplay/treeView/treeView.d.ts

@@ -0,0 +1,31 @@
+import { type JSX } from "solid-js";
+import { type Ref } from "../../../primitives/mergeRefs";
+export interface ITreeNodeItem {
+    /** Stable identifier. Falls back to the positional path when omitted. */
+    id?: string;
+    label: string;
+    children?: ITreeNodeItem[];
+    /** Hint that the node is expandable even before its children are loaded. */
+    hasChildren?: boolean;
+}
+export interface TreeViewProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, "onSelect"> {
+    nodeIcon?: {
+        opened?: string;
+        closed?: string;
+    };
+    listIcon?: string;
+    data: ITreeNodeItem[];
+    expanded?: string[];
+    defaultExpanded?: string[];
+    onExpandedChange?: (expanded: string[]) => void;
+    selected?: string[];
+    defaultSelected?: string[];
+    onSelectedChange?: (selected: string[]) => void;
+    selectable?: boolean;
+    checkboxes?: boolean;
+    renderLabel?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;
+    loadChildren?: (item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare function TreeView(props: TreeViewProps): JSX.Element;
+export default TreeView;

package/dist/components/dataDisplay/treeView/treeView.js

@@ -0,0 +1,177 @@
+import { createComponent as s, use as T, spread as D, mergeProps as R, insert as g, template as _, effect as I, setAttribute as S, memo as E, className as F, delegateEvents as K } from "solid-js/web";
+import '../../../assets/styles/less/components/treeView/treeView.entry.css';/* empty css                                                           */
+import { mergeProps as j, splitProps as q, createSignal as y, For as V, createContext as B, useContext as G, Show as w } from "solid-js";
+import z from "clsx";
+import { createControllableState as P } from "../../../primitives/createControllableState.js";
+import { mergeRefs as H } from "../../../primitives/mergeRefs.js";
+import { Icon as O } from "../../base/icon/icon.js";
+var J = /* @__PURE__ */ _("<input type=checkbox class=smwb-tree__node__checkbox>"), M = /* @__PURE__ */ _("<div role=group>"), Q = /* @__PURE__ */ _("<div role=treeitem><span class=smwb-tree__node__content tabindex=0 role=button><span class=smwb-tree__node__label>"), U = /* @__PURE__ */ _("<div class=smwb-tree__node__loading role=status>Загрузка…"), W = /* @__PURE__ */ _("<div>"), X = /* @__PURE__ */ _("<div class=smwb-tree__wrapper role=presentation>");
+const A = B();
+function N(o) {
+  const n = G(A), e = () => o.item.id ?? o.path, h = () => o.item.children ?? n.loadedChildren()[e()], C = () => n.hasLoader && (!!o.item.hasChildren || !!n.loadedChildren()[e()]), c = () => !!h() && (h()?.length ?? 0) > 0 || C(), f = () => n.expandedIds().includes(e()), m = () => n.selectedIds().includes(e()), v = () => n.loadingIds().includes(e()), x = () => {
+    c() && (f() || n.ensureLoaded(o.item, e()), n.toggleExpanded(e())), n.selectable && n.toggleSelected(e());
+  }, L = (a) => {
+    a.key === "Enter" || a.key === " " ? (a.preventDefault(), x()) : a.key === "ArrowRight" && c() ? (n.ensureLoaded(o.item, e()), n.setOpen(e(), !0)) : a.key === "ArrowLeft" && c() && n.setOpen(e(), !1);
+  };
+  return (() => {
+    var a = Q(), p = a.firstChild, $ = p.firstChild;
+    return p.$$keydown = L, p.$$click = x, g(p, s(w, {
+      get when() {
+        return n.checkboxes;
+      },
+      get children() {
+        var r = J();
+        return r.addEventListener("change", () => n.toggleSelected(e())), r.$$click = (u) => u.stopPropagation(), I(() => S(r, "aria-label", o.item.label)), I(() => r.checked = m()), r;
+      }
+    }), $), g($, s(w, {
+      get when() {
+        return c();
+      },
+      get fallback() {
+        return s(O, {
+          get name() {
+            return n.listIcon;
+          },
+          size: 20
+        });
+      },
+      get children() {
+        return s(O, {
+          get name() {
+            return E(() => !!f())() ? n.nodeIcon.opened ?? "folder_open" : n.nodeIcon.closed ?? "folder";
+          },
+          fill: 1,
+          size: 20
+        });
+      }
+    }), null), g($, (() => {
+      var r = E(() => !!n.renderLabel);
+      return () => r() ? n.renderLabel(o.item, e()) : o.item.label;
+    })(), null), g(a, s(w, {
+      get when() {
+        return E(() => !!c())() && f();
+      },
+      get children() {
+        var r = M();
+        return g(r, s(w, {
+          get when() {
+            return !(v() && !h());
+          },
+          get fallback() {
+            return U();
+          },
+          get children() {
+            return s(V, {
+              get each() {
+                return h() ?? [];
+              },
+              children: (u, b) => s(N, {
+                item: u,
+                get path() {
+                  return `${o.path}.${b()}`;
+                }
+              })
+            });
+          }
+        })), r;
+      }
+    }), null), I((r) => {
+      var u = z("smwb-tree__node", {
+        "smwb-tree__node_selected": m()
+      }), b = c() ? f() : void 0, t = n.selectable || n.checkboxes ? m() : void 0;
+      return u !== r.e && F(a, r.e = u), b !== r.t && S(a, "aria-expanded", r.t = b), t !== r.a && S(a, "aria-selected", r.a = t), r;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    }), a;
+  })();
+}
+function de(o) {
+  const n = j({
+    listIcon: "draft",
+    nodeIcon: {
+      closed: "folder",
+      opened: "folder_open"
+    },
+    data: [],
+    defaultExpanded: [],
+    defaultSelected: [],
+    selectable: !1,
+    checkboxes: !1
+  }, o), [e, h] = q(n, ["class", "listIcon", "nodeIcon", "data", "expanded", "defaultExpanded", "onExpandedChange", "selected", "defaultSelected", "onSelectedChange", "selectable", "checkboxes", "renderLabel", "loadChildren", "ref"]), [C, c] = y({}), [f, m] = y([]), [v, x] = P({
+    value: () => e.expanded,
+    defaultValue: e.defaultExpanded,
+    onChange: (t) => e.onExpandedChange?.(t)
+  }), [L, a] = P({
+    value: () => e.selected,
+    defaultValue: e.defaultSelected,
+    onChange: (t) => e.onSelectedChange?.(t)
+  }), b = {
+    expandedIds: v,
+    selectedIds: L,
+    loadedChildren: C,
+    loadingIds: f,
+    toggleExpanded: (t) => x((l) => l.includes(t) ? l.filter((d) => d !== t) : [...l, t]),
+    setOpen: (t, l) => x((d) => {
+      const i = d.includes(t);
+      return l && !i ? [...d, t] : !l && i ? d.filter((k) => k !== t) : d;
+    }),
+    toggleSelected: (t) => a((l) => l.includes(t) ? l.filter((d) => d !== t) : [...l, t]),
+    ensureLoaded: (t, l) => {
+      !e.loadChildren || C()[l] || t.children && t.children.length > 0 || (m((d) => d.includes(l) ? d : [...d, l]), e.loadChildren(t, l).then((d) => c((i) => ({
+        ...i,
+        [l]: d
+      }))).finally(() => m((d) => d.filter((i) => i !== l))));
+    },
+    get selectable() {
+      return e.selectable;
+    },
+    get checkboxes() {
+      return e.checkboxes;
+    },
+    get nodeIcon() {
+      return e.nodeIcon;
+    },
+    get listIcon() {
+      return e.listIcon;
+    },
+    get renderLabel() {
+      return e.renderLabel;
+    },
+    get hasLoader() {
+      return !!e.loadChildren;
+    }
+  };
+  return s(A.Provider, {
+    value: b,
+    get children() {
+      var t = W(), l = H(e.ref);
+      return typeof l == "function" && T(l, t), D(t, R(h, {
+        "data-testid": "tree-view",
+        role: "tree",
+        get class() {
+          return z("smwb-tree", e.class);
+        }
+      }), !1, !0), g(t, s(V, {
+        get each() {
+          return e.data;
+        },
+        children: (d, i) => (() => {
+          var k = X();
+          return g(k, s(N, {
+            item: d,
+            get path() {
+              return `${i()}`;
+            }
+          })), k;
+        })()
+      })), t;
+    }
+  });
+}
+K(["click", "keydown"]);
+export {
+  de as TreeView
+};
+//# sourceMappingURL=treeView.js.map

package/dist/components/dataDisplay/treeView/treeView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"treeView.js","sources":["../../../../src/components/dataDisplay/treeView/treeView.tsx"],"sourcesContent":["import { type Accessor, type JSX, For, Show, createContext, createSignal, mergeProps, splitProps, useContext } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface ITreeNodeItem {\n  /** Stable identifier. Falls back to the positional path when omitted. */\n  id?: string;\n  label: string;\n  children?: ITreeNodeItem[];\n  /** Hint that the node is expandable even before its children are loaded. */\n  hasChildren?: boolean;\n}\n\nexport interface TreeViewProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onSelect\"> {\n  nodeIcon?: { opened?: string; closed?: string };\n  listIcon?: string;\n  data: ITreeNodeItem[];\n  expanded?: string[];\n  defaultExpanded?: string[];\n  onExpandedChange?: (expanded: string[]) => void;\n  selected?: string[];\n  defaultSelected?: string[];\n  onSelectedChange?: (selected: string[]) => void;\n  selectable?: boolean;\n  checkboxes?: boolean;\n  renderLabel?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;\n  loadChildren?: (item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>;\n  ref?: Ref<HTMLDivElement>;\n}\n\ninterface TreeContextValue {\n  expandedIds: Accessor<string[]>;\n  selectedIds: Accessor<string[]>;\n  loadedChildren: Accessor<Record<string, ITreeNodeItem[]>>;\n  loadingIds: Accessor<string[]>;\n  toggleExpanded: (id: string) => void;\n  setOpen: (id: string, open: boolean) => void;\n  toggleSelected: (id: string) => void;\n  ensureLoaded: (item: ITreeNodeItem, nodeId: string) => void;\n  selectable: boolean;\n  checkboxes: boolean;\n  nodeIcon: { opened?: string; closed?: string };\n  listIcon: string;\n  renderLabel: ((item: ITreeNodeItem, nodeId: string) => JSX.Element) | undefined;\n  hasLoader: boolean;\n}\n\nconst TreeContext = createContext<TreeContextValue>();\n\nfunction TreeNode(props: { item: ITreeNodeItem; path: string }): JSX.Element {\n  const ctx = useContext(TreeContext)!;\n  const nodeId = (): string => props.item.id ?? props.path;\n  const resolvedChildren = (): ITreeNodeItem[] | undefined => props.item.children ?? ctx.loadedChildren()[nodeId()];\n  const isLazy = (): boolean => ctx.hasLoader && (!!props.item.hasChildren || !!ctx.loadedChildren()[nodeId()]);\n  const hasChildNodes = (): boolean => (!!resolvedChildren() && (resolvedChildren()?.length ?? 0) > 0) || isLazy();\n  const isOpen = (): boolean => ctx.expandedIds().includes(nodeId());\n  const isSelected = (): boolean => ctx.selectedIds().includes(nodeId());\n  const isLoading = (): boolean => ctx.loadingIds().includes(nodeId());\n\n  const onLabelClick = (): void => {\n    if (hasChildNodes()) {\n      if (!isOpen()) ctx.ensureLoaded(props.item, nodeId());\n      ctx.toggleExpanded(nodeId());\n    }\n    if (ctx.selectable) ctx.toggleSelected(nodeId());\n  };\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      onLabelClick();\n    } else if (event.key === \"ArrowRight\" && hasChildNodes()) {\n      ctx.ensureLoaded(props.item, nodeId());\n      ctx.setOpen(nodeId(), true);\n    } else if (event.key === \"ArrowLeft\" && hasChildNodes()) {\n      ctx.setOpen(nodeId(), false);\n    }\n  };\n\n  return (\n    <div\n      class={cn(\"smwb-tree__node\", { \"smwb-tree__node_selected\": isSelected() })}\n      role=\"treeitem\"\n      aria-expanded={hasChildNodes() ? isOpen() : undefined}\n      aria-selected={ctx.selectable || ctx.checkboxes ? isSelected() : undefined}\n    >\n      <span class=\"smwb-tree__node__content\" onClick={onLabelClick} onKeyDown={onKeyDown} tabindex={0} role=\"button\">\n        <Show when={ctx.checkboxes}>\n          <input\n            type=\"checkbox\"\n            class=\"smwb-tree__node__checkbox\"\n            checked={isSelected()}\n            onClick={(e) => e.stopPropagation()}\n            onChange={() => ctx.toggleSelected(nodeId())}\n            aria-label={props.item.label}\n          />\n        </Show>\n        <span class=\"smwb-tree__node__label\">\n          <Show when={hasChildNodes()} fallback={<Icon name={ctx.listIcon} size={20} />}>\n            <Icon name={isOpen() ? ctx.nodeIcon.opened ?? \"folder_open\" : ctx.nodeIcon.closed ?? \"folder\"} fill={1} size={20} />\n          </Show>\n          {ctx.renderLabel ? ctx.renderLabel(props.item, nodeId()) : props.item.label}\n        </span>\n      </span>\n      <Show when={hasChildNodes() && isOpen()}>\n        <div role=\"group\">\n          <Show\n            when={!(isLoading() && !resolvedChildren())}\n            fallback={\n              <div class=\"smwb-tree__node__loading\" role=\"status\">\n                Загрузка…\n              </div>\n            }\n          >\n            <For each={resolvedChildren() ?? []}>\n              {(child, idx) => <TreeNode item={child} path={`${props.path}.${idx()}`} />}\n            </For>\n          </Show>\n        </div>\n      </Show>\n    </div>\n  );\n}\n\nexport function TreeView(props: TreeViewProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      listIcon: \"draft\",\n      nodeIcon: { closed: \"folder\", opened: \"folder_open\" } as { opened?: string; closed?: string },\n      data: [] as ITreeNodeItem[],\n      defaultExpanded: [] as string[],\n      defaultSelected: [] as string[],\n      selectable: false,\n      checkboxes: false,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"listIcon\",\n    \"nodeIcon\",\n    \"data\",\n    \"expanded\",\n    \"defaultExpanded\",\n    \"onExpandedChange\",\n    \"selected\",\n    \"defaultSelected\",\n    \"onSelectedChange\",\n    \"selectable\",\n    \"checkboxes\",\n    \"renderLabel\",\n    \"loadChildren\",\n    \"ref\",\n  ]);\n\n  const [loadedChildren, setLoadedChildren] = createSignal<Record<string, ITreeNodeItem[]>>({});\n  const [loadingIds, setLoadingIds] = createSignal<string[]>([]);\n  const [expandedIds, setExpandedIds] = createControllableState<string[]>({\n    value: () => local.expanded,\n    defaultValue: local.defaultExpanded,\n    onChange: (next) => local.onExpandedChange?.(next),\n  });\n  const [selectedIds, setSelectedIds] = createControllableState<string[]>({\n    value: () => local.selected,\n    defaultValue: local.defaultSelected,\n    onChange: (next) => local.onSelectedChange?.(next),\n  });\n\n  const toggleExpanded = (id: string): void =>\n    setExpandedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n\n  const setOpen = (id: string, open: boolean): void =>\n    setExpandedIds((prev) => {\n      const has = prev.includes(id);\n      if (open && !has) return [...prev, id];\n      if (!open && has) return prev.filter((x) => x !== id);\n      return prev;\n    });\n\n  const toggleSelected = (id: string): void =>\n    setSelectedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n\n  const ensureLoaded = (item: ITreeNodeItem, nodeId: string): void => {\n    if (!local.loadChildren || loadedChildren()[nodeId] || (item.children && item.children.length > 0)) return;\n    setLoadingIds((prev) => (prev.includes(nodeId) ? prev : [...prev, nodeId]));\n    void local\n      .loadChildren(item, nodeId)\n      .then((children) => setLoadedChildren((prev) => ({ ...prev, [nodeId]: children })))\n      .finally(() => setLoadingIds((prev) => prev.filter((x) => x !== nodeId)));\n  };\n\n  const contextValue: TreeContextValue = {\n    expandedIds,\n    selectedIds,\n    loadedChildren,\n    loadingIds,\n    toggleExpanded,\n    setOpen,\n    toggleSelected,\n    ensureLoaded,\n    get selectable() {\n      return local.selectable;\n    },\n    get checkboxes() {\n      return local.checkboxes;\n    },\n    get nodeIcon() {\n      return local.nodeIcon;\n    },\n    get listIcon() {\n      return local.listIcon;\n    },\n    get renderLabel() {\n      return local.renderLabel;\n    },\n    get hasLoader() {\n      return !!local.loadChildren;\n    },\n  };\n\n  return (\n    <TreeContext.Provider value={contextValue}>\n      <div {...rest} data-testid=\"tree-view\" ref={mergeRefs(local.ref)} role=\"tree\" class={cn(\"smwb-tree\", local.class)}>\n        <For each={local.data}>\n          {(node, idx) => (\n            <div class=\"smwb-tree__wrapper\" role=\"presentation\">\n              <TreeNode item={node} path={`${idx()}`} />\n            </div>\n          )}\n        </For>\n      </div>\n    </TreeContext.Provider>\n  );\n}\n\nexport default TreeView;\n"],"names":["TreeContext","createContext","TreeNode","props","ctx","useContext","nodeId","item","id","path","resolvedChildren","children","loadedChildren","isLazy","hasLoader","hasChildren","hasChildNodes","length","isOpen","expandedIds","includes","isSelected","selectedIds","isLoading","loadingIds","onLabelClick","ensureLoaded","toggleExpanded","selectable","toggleSelected","onKeyDown","event","key","preventDefault","setOpen","_el$","_tmpl$3","_el$2","firstChild","_el$4","$$keydown","$$click","_$insert","_$createComponent","Show","when","checkboxes","_el$3","_tmpl$","addEventListener","e","stopPropagation","_$effect","_$setAttribute","label","checked","fallback","Icon","name","listIcon","size","_$memo","nodeIcon","opened","closed","fill","_c$","renderLabel","_el$5","_tmpl$2","_tmpl$4","For","each","child","idx","_p$","_v$","cn","_v$2","undefined","_v$3","_$className","t","a","TreeView","merged","mergeProps","data","defaultExpanded","defaultSelected","local","rest","splitProps","setLoadedChildren","createSignal","setLoadingIds","setExpandedIds","createControllableState","value","expanded","defaultValue","onChange","next","onExpandedChange","setSelectedIds","selected","onSelectedChange","contextValue","prev","filter","x","open","has","loadChildren","then","finally","Provider","_el$7","_tmpl$5","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","class","node","_el$8","_tmpl$6","_$delegateEvents"],"mappings":"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"}

package/dist/components/dataDisplay/typography/index.d.ts

@@ -0,0 +1,2 @@
+export { Typography, default } from "./typography";
+export type { TypographyProps, TypographyVariant, TypographyColor } from "./typography";

package/dist/components/dataDisplay/typography/typography.d.ts

@@ -0,0 +1,18 @@
+import { type JSX, type ParentProps } from "solid-js";
+import { type Ref } from "../../../primitives/mergeRefs";
+export type TypographyVariant = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "caption" | "overline" | "button";
+export type TypographyColor = "inherit" | "primary" | "secondary" | "error" | "success" | "warning" | "info" | "textPrimary" | "textSecondary" | "disabled";
+export interface TypographyProps extends JSX.HTMLAttributes<HTMLElement> {
+    variant?: TypographyVariant;
+    color?: TypographyColor;
+    align?: "left" | "center" | "right" | "justify";
+    /** Add a bottom margin (block rhythm). */
+    gutterBottom?: boolean;
+    /** Truncate with an ellipsis on a single line. */
+    noWrap?: boolean;
+    /** Render as a different element. */
+    component?: string;
+    ref?: Ref<HTMLElement>;
+}
+export declare function Typography(props: ParentProps<TypographyProps>): JSX.Element;
+export default Typography;

package/dist/components/dataDisplay/typography/typography.js

@@ -0,0 +1,49 @@
+import { createComponent as a, Dynamic as i, mergeProps as s } from "solid-js/web";
+import '../../../assets/styles/less/components/typography/typography.entry.css';/* empty css                                                               */
+import { mergeProps as m, splitProps as h } from "solid-js";
+import c from "clsx";
+import { mergeRefs as g } from "../../../primitives/mergeRefs.js";
+const l = {
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  subtitle1: "h6",
+  subtitle2: "h6",
+  body1: "p",
+  body2: "p",
+  caption: "span",
+  overline: "span",
+  button: "span"
+};
+function w(t) {
+  const e = m({
+    variant: "body1",
+    color: "inherit"
+  }, t), [r, n] = h(e, ["variant", "color", "align", "gutterBottom", "noWrap", "component", "class", "children", "ref"]);
+  return a(i, s({
+    get component() {
+      return r.component ?? l[r.variant];
+    },
+    ref(p) {
+      var o = g(r.ref);
+      typeof o == "function" && o(p);
+    },
+    get class() {
+      return c("smwb-typography", `smwb-typography_${r.variant}`, r.color !== "inherit" && `smwb-typography_color-${r.color}`, r.align && `smwb-typography_align-${r.align}`, {
+        "smwb-typography_gutter": r.gutterBottom,
+        "smwb-typography_nowrap": r.noWrap
+      }, r.class);
+    }
+  }, n, {
+    get children() {
+      return r.children;
+    }
+  }));
+}
+export {
+  w as Typography
+};
+//# sourceMappingURL=typography.js.map

package/dist/components/dataDisplay/typography/typography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.js","sources":["../../../../src/components/dataDisplay/typography/typography.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type TypographyVariant =\n  | \"h1\"\n  | \"h2\"\n  | \"h3\"\n  | \"h4\"\n  | \"h5\"\n  | \"h6\"\n  | \"subtitle1\"\n  | \"subtitle2\"\n  | \"body1\"\n  | \"body2\"\n  | \"caption\"\n  | \"overline\"\n  | \"button\";\n\nexport type TypographyColor =\n  | \"inherit\"\n  | \"primary\"\n  | \"secondary\"\n  | \"error\"\n  | \"success\"\n  | \"warning\"\n  | \"info\"\n  | \"textPrimary\"\n  | \"textSecondary\"\n  | \"disabled\";\n\nconst defaultTag: Record<TypographyVariant, string> = {\n  h1: \"h1\",\n  h2: \"h2\",\n  h3: \"h3\",\n  h4: \"h4\",\n  h5: \"h5\",\n  h6: \"h6\",\n  subtitle1: \"h6\",\n  subtitle2: \"h6\",\n  body1: \"p\",\n  body2: \"p\",\n  caption: \"span\",\n  overline: \"span\",\n  button: \"span\",\n};\n\nexport interface TypographyProps extends JSX.HTMLAttributes<HTMLElement> {\n  variant?: TypographyVariant;\n  color?: TypographyColor;\n  align?: \"left\" | \"center\" | \"right\" | \"justify\";\n  /** Add a bottom margin (block rhythm). */\n  gutterBottom?: boolean;\n  /** Truncate with an ellipsis on a single line. */\n  noWrap?: boolean;\n  /** Render as a different element. */\n  component?: string;\n  ref?: Ref<HTMLElement>;\n}\n\nexport function Typography(props: ParentProps<TypographyProps>): JSX.Element {\n  const merged = mergeProps({ variant: \"body1\" as TypographyVariant, color: \"inherit\" as TypographyColor }, props);\n  const [local, rest] = splitProps(merged, [\n    \"variant\",\n    \"color\",\n    \"align\",\n    \"gutterBottom\",\n    \"noWrap\",\n    \"component\",\n    \"class\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  return (\n    <Dynamic\n      component={local.component ?? defaultTag[local.variant]}\n      ref={mergeRefs(local.ref)}\n      class={cn(\n        \"smwb-typography\",\n        `smwb-typography_${local.variant}`,\n        local.color !== \"inherit\" && `smwb-typography_color-${local.color}`,\n        local.align && `smwb-typography_align-${local.align}`,\n        {\n          \"smwb-typography_gutter\": local.gutterBottom,\n          \"smwb-typography_nowrap\": local.noWrap,\n        },\n        local.class\n      )}\n      {...rest}\n    >\n      {local.children}\n    </Dynamic>\n  );\n}\n\nexport default Typography;\n"],"names":["defaultTag","h1","h2","h3","h4","h5","h6","subtitle1","subtitle2","body1","body2","caption","overline","button","Typography","props","merged","mergeProps","variant","color","local","rest","splitProps","_$createComponent","Dynamic","_$mergeProps","component","ref","r$","_ref$","mergeRefs","cn","align","gutterBottom","noWrap","class","children"],"mappings":";;;;;AAiCA,MAAMA,IAAgD;AAAA,EACpDC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,WAAW;AAAA,EACXC,WAAW;AAAA,EACXC,OAAO;AAAA,EACPC,OAAO;AAAA,EACPC,SAAS;AAAA,EACTC,UAAU;AAAA,EACVC,QAAQ;AACV;AAeO,SAASC,EAAWC,GAAkD;AAC3E,QAAMC,IAASC,EAAW;AAAA,IAAEC,SAAS;AAAA,IAA8BC,OAAO;AAAA,EAAA,GAAgCJ,CAAK,GACzG,CAACK,GAAOC,CAAI,IAAIC,EAAWN,GAAQ,CACvC,WACA,SACA,SACA,gBACA,UACA,aACA,SACA,YACA,KAAK,CACN;AAED,SAAAO,EACGC,GAAOC,EAAA;AAAA,IAAA,IACNC,YAAS;AAAA,aAAEN,EAAMM,aAAa1B,EAAWoB,EAAMF,OAAO;AAAA,IAAC;AAAA,IAAAS,IAAAC,GAAA;AAAA,UAAAC,IAClDC,EAAUV,EAAMO,GAAG;AAAC,aAAAE,KAAA,cAAAA,EAAAD,CAAA;AAAA,IAAA;AAAA,IAAA,IAAA,QAAA;AAAA,aAClBG,EACL,mBACA,mBAAmBX,EAAMF,OAAO,IAChCE,EAAMD,UAAU,aAAa,yBAAyBC,EAAMD,KAAK,IACjEC,EAAMY,SAAS,yBAAyBZ,EAAMY,KAAK,IACnD;AAAA,QACE,0BAA0BZ,EAAMa;AAAAA,QAChC,0BAA0Bb,EAAMc;AAAAA,MAAAA,GAElCd,EAAMe,KACR;AAAA,IAAC;AAAA,EAAA,GACGd,GAAI;AAAA,IAAA,IAAAe,WAAA;AAAA,aAEPhB,EAAMgB;AAAAA,IAAQ;AAAA,EAAA,CAAA,CAAA;AAGrB;"}

package/dist/components/feedBack/message/index.d.ts

@@ -0,0 +1,2 @@
+export { Message, MessageContainer, default } from "./message";
+export type { MessageProps, MessageSeverity } from "./message";

package/dist/components/feedBack/message/message.d.ts

@@ -0,0 +1,20 @@
+import { type JSX, type ParentProps } from "solid-js";
+import { type Ref } from "../../../primitives/mergeRefs";
+export type MessageSeverity = "success" | "error" | "warning" | "info";
+export interface MessageProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    variant?: "outlined" | "filled" | "left-accent";
+    onClose?: () => void;
+    /** @deprecated use `severity`. */
+    type?: MessageSeverity;
+    /** Semantic severity of the message. */
+    severity?: MessageSeverity;
+    /** Accessible label for the close button. */
+    closeAriaLabel?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare function MessageContainer(props: ParentProps<MessageProps>): JSX.Element;
+declare function Header(props: ParentProps): JSX.Element;
+export declare const Message: typeof MessageContainer & {
+    Header: typeof Header;
+};
+export default Message;

package/dist/components/feedBack/message/message.js

@@ -0,0 +1,54 @@
+import { use as p, spread as g, mergeProps as u, insert as a, createComponent as m, effect as f, setAttribute as v, template as n, delegateEvents as d } from "solid-js/web";
+import '../../../assets/styles/less/components/message/message.entry.css';/* empty css                                                         */
+import { mergeProps as b, splitProps as _, Show as $ } from "solid-js";
+import h from "clsx";
+import { mergeRefs as w } from "../../../primitives/mergeRefs.js";
+import { Icon as y } from "../../base/icon/icon.js";
+var C = /* @__PURE__ */ n("<button class=smwb-message__close-btn type=button>"), A = /* @__PURE__ */ n("<div>"), P = /* @__PURE__ */ n("<div class=smwb-message__header>");
+function L(o) {
+  const t = b({
+    variant: "filled",
+    closeAriaLabel: "Close"
+  }, o), [e, c] = _(t, ["class", "children", "type", "severity", "variant", "onClose", "closeAriaLabel", "ref"]), l = () => e.severity ?? e.type;
+  return (() => {
+    var r = A(), i = w(e.ref);
+    return typeof i == "function" && p(i, r), g(r, u(c, {
+      "data-testid": "message",
+      role: "alert",
+      get "aria-live"() {
+        return l() === "error" ? "assertive" : "polite";
+      },
+      get class() {
+        return h("smwb-message", `smwb-message_${e.variant}`, e.class, {
+          [`smwb-message_${l()}`]: !!l()
+        });
+      }
+    }), !1, !0), a(r, () => e.children, null), a(r, m($, {
+      get when() {
+        return e.onClose;
+      },
+      get children() {
+        var s = C();
+        return s.$$click = () => e.onClose?.(), a(s, m(y, {
+          name: "close",
+          weight: 1e3
+        })), f(() => v(s, "aria-label", e.closeAriaLabel)), s;
+      }
+    }), null), r;
+  })();
+}
+function k(o) {
+  return (() => {
+    var t = P();
+    return a(t, () => o.children), t;
+  })();
+}
+const H = Object.assign(L, {
+  Header: k
+});
+d(["click"]);
+export {
+  H as Message,
+  L as MessageContainer
+};
+//# sourceMappingURL=message.js.map

package/dist/components/feedBack/message/message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"message.js","sources":["../../../../src/components/feedBack/message/message.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type MessageSeverity = \"success\" | \"error\" | \"warning\" | \"info\";\n\nexport interface MessageProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  variant?: \"outlined\" | \"filled\" | \"left-accent\";\n  onClose?: () => void;\n  /** @deprecated use `severity`. */\n  type?: MessageSeverity;\n  /** Semantic severity of the message. */\n  severity?: MessageSeverity;\n  /** Accessible label for the close button. */\n  closeAriaLabel?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function MessageContainer(props: ParentProps<MessageProps>): JSX.Element {\n  const merged = mergeProps({ variant: \"filled\" as const, closeAriaLabel: \"Close\" }, props);\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"children\",\n    \"type\",\n    \"severity\",\n    \"variant\",\n    \"onClose\",\n    \"closeAriaLabel\",\n    \"ref\",\n  ]);\n\n  const resolvedSeverity = (): MessageSeverity | undefined => local.severity ?? local.type;\n\n  return (\n    <div\n      {...rest}\n      data-testid=\"message\"\n      role=\"alert\"\n      aria-live={resolvedSeverity() === \"error\" ? \"assertive\" : \"polite\"}\n      class={cn(\"smwb-message\", `smwb-message_${local.variant}`, local.class, {\n        [`smwb-message_${resolvedSeverity()}`]: Boolean(resolvedSeverity()),\n      })}\n      ref={mergeRefs(local.ref)}\n    >\n      {local.children}\n      <Show when={local.onClose}>\n        <button\n          class=\"smwb-message__close-btn\"\n          onClick={() => local.onClose?.()}\n          aria-label={local.closeAriaLabel}\n          type=\"button\"\n        >\n          <Icon name=\"close\" weight={1000} />\n        </button>\n      </Show>\n    </div>\n  );\n}\n\nfunction Header(props: ParentProps): JSX.Element {\n  return <div class=\"smwb-message__header\">{props.children}</div>;\n}\n\nexport const Message = Object.assign(MessageContainer, { Header });\n\nexport default Message;\n"],"names":["MessageContainer","props","merged","mergeProps","variant","closeAriaLabel","local","rest","splitProps","resolvedSeverity","severity","type","_el$","_tmpl$2","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","Boolean","_$insert","children","_$createComponent","Show","when","onClose","_el$2","_tmpl$","$$click","Icon","name","weight","_$effect","_$setAttribute","Header","_el$3","_tmpl$3","Message","Object","assign","_$delegateEvents"],"mappings":";;;;;;;AAoBO,SAASA,EAAiBC,GAA+C;AAC9E,QAAMC,IAASC,EAAW;AAAA,IAAEC,SAAS;AAAA,IAAmBC,gBAAgB;AAAA,EAAA,GAAWJ,CAAK,GAClF,CAACK,GAAOC,CAAI,IAAIC,EAAWN,GAAQ,CACvC,SACA,YACA,QACA,YACA,WACA,WACA,kBACA,KAAK,CACN,GAEKO,IAAmBA,MAAmCH,EAAMI,YAAYJ,EAAMK;AAEpF,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA,GAAAC,IASSC,EAAUT,EAAMU,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAO,EAPrBZ,GAAI;AAAA,MAAA,eACI;AAAA,MAAS,MAChB;AAAA,MAAO,IAAA,cAAA;AAAA,eACDE,EAAAA,MAAuB,UAAU,cAAc;AAAA,MAAQ;AAAA,MAAA,IAAA,QAAA;AAAA,eAC3DW,EAAG,gBAAgB,gBAAgBd,EAAMF,OAAO,IAAIE,EAAMe,OAAO;AAAA,UACtE,CAAC,gBAAgBZ,EAAAA,CAAkB,EAAE,GAAGa,EAAQb;QAAkB,CACnE;AAAA,MAAC;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAc,EAAAX,GAAA,MAGDN,EAAMkB,UAAQ,IAAA,GAAAD,EAAAX,GAAAa,EACdC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAErB,EAAMsB;AAAAA,MAAO;AAAA,MAAA,IAAAJ,WAAA;AAAA,YAAAK,IAAAC,EAAAA;AAAAD,eAAAA,EAAAE,UAGZ,MAAMzB,EAAMsB,UAAAA,GAAWL,EAAAM,GAAAJ,EAI/BO,GAAI;AAAA,UAACC,MAAI;AAAA,UAASC,QAAQ;AAAA,QAAA,CAAI,CAAA,GAAAC,QAAAC,EAAAP,GAAA,cAHnBvB,EAAMD,cAAc,CAAA,GAAAwB;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAjB;AAAAA,EAAA,GAAA;AAQ1C;AAEA,SAASyB,EAAOpC,GAAiC;AAC/C,UAAA,MAAA;AAAA,QAAAqC,IAAAC,EAAAA;AAAAhB,WAAAA,EAAAe,GAAA,MAA0CrC,EAAMuB,QAAQ,GAAAc;AAAAA,EAAA,GAAA;AAC1D;AAEO,MAAME,IAAUC,OAAOC,OAAO1C,GAAkB;AAAA,EAAEqC,QAAAA;AAAO,CAAC;AAE1CM,EAAA,CAAA,OAAA,CAAA;"}

package/dist/components/feedBack/modal/index.d.ts

@@ -0,0 +1,2 @@
+export { Modal, default } from "./modal";
+export type { ModalProps, ModalSlotProps } from "./modal";

package/dist/components/feedBack/modal/modal.d.ts

@@ -0,0 +1,34 @@
+import { type JSX, type ParentProps } from "solid-js";
+import { type Ref } from "../../../primitives/mergeRefs";
+export interface ModalProps {
+    size?: "small" | "medium" | "large" | "fullscreen";
+    closeOnOutsideClick?: boolean;
+    onClose?: () => void;
+    open: boolean;
+    animation?: "fade" | "scale" | "drop";
+    class?: string;
+    backdrop?: "blured" | "dark" | "transparent" | "darkBlured";
+    asForm?: boolean;
+    disableAppearAnimation?: boolean;
+    /** ARIA role of the dialog. */
+    role?: "dialog" | "alertdialog";
+    /** Close the modal when Escape is pressed. */
+    closeOnEsc?: boolean;
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+    "aria-describedby"?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+declare function ModalBase(props: ParentProps<ModalProps>): JSX.Element;
+export interface ModalSlotProps {
+    class?: string;
+}
+export declare function Header(props: ParentProps<ModalSlotProps>): JSX.Element;
+export declare function Content(props: ParentProps<ModalSlotProps>): JSX.Element;
+export declare function Footer(props: ParentProps<ModalSlotProps>): JSX.Element;
+export declare const Modal: typeof ModalBase & {
+    Footer: typeof Footer;
+    Header: typeof Header;
+    Content: typeof Content;
+};
+export default Modal;