@smwb/ui-solid 0.11.1 → 0.12.0

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

@@ -0,0 +1,2 @@
+export { DescriptionList, DescriptionItem, default } from "./descriptionList";
+export type { DescriptionListProps, DescriptionItemProps, DescriptionListEntry, DescriptionListLayout, } from "./descriptionList";

package/dist/components/dataDisplay/expansionPanel/expansionPanel.js

@@ -1,5 +1,6 @@
 import { createComponent as o, insert as r, Portal as L, addEventListener as S, isServer as P, template as m, use as B, effect as A, className as D, memo as h, delegateEvents as T } from "solid-js/web";
-import '../../../assets/styles/less/components/expansionPanel/expansionPanel.entry.css';/* empty css                                                                       */
+import '../../../assets/styles/less/components/expansionPanel/expansionPanel.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
+/* empty css                                                                       */
 import { mergeProps as I, splitProps as K, createEffect as y, onCleanup as E, Show as $ } from "solid-js";
 import N from "clsx";
 import { createControllableState as U } from "../../../primitives/createControllableState.js";
@@ -15,7 +16,7 @@ const J = {
   placeholder: "Panel is open in fullscreen",
   placeholderClose: "Close"
 };
-function te(F) {
+function oe(F) {
   const k = I({
     defaultMode: "tile",
     disableExpand: !1,
@@ -169,6 +170,6 @@ function te(F) {
 }
 T(["click"]);
 export {
-  te as ExpansionPanel
+  oe as ExpansionPanel
 };
 //# sourceMappingURL=expansionPanel.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"expansionPanel.js","sources":["../../../../src/components/dataDisplay/expansionPanel/expansionPanel.tsx"],"sourcesContent":["import { type JSX, Show, createEffect, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport { Portal, isServer } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Button } from \"../../inputs/button\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type ExpansionMode = \"tile\" | \"row\" | \"fullscreen\";\n\nexport interface ExpansionPanelLabels {\n  expandRow?: string;\n  collapseRow?: string;\n  expandFullscreen?: string;\n  closeFullscreen?: string;\n  placeholder?: string;\n  placeholderClose?: string;\n}\n\nexport interface ExpansionPanelRenderContext {\n  mode: ExpansionMode;\n  isFullscreen: boolean;\n  isFullRow: boolean;\n}\n\nexport interface ExpansionPanelControlsContext extends ExpansionPanelRenderContext {\n  setMode: (next: ExpansionMode | ((current: ExpansionMode) => ExpansionMode)) => void;\n  toggleRow: () => void;\n  openFullscreen: () => void;\n  closeFullscreen: () => void;\n  labels: Required<ExpansionPanelLabels>;\n}\n\ntype ExpansionPanelChildren = JSX.Element | ((ctx: ExpansionPanelRenderContext) => JSX.Element);\ntype ExpansionPanelControls = JSX.Element | ((ctx: ExpansionPanelControlsContext) => JSX.Element);\n\nexport interface ExpansionPanelProps {\n  class?: string;\n  header?: JSX.Element;\n  mode?: ExpansionMode;\n  defaultMode?: ExpansionMode;\n  onModeChange?: (mode: ExpansionMode) => void;\n  disableExpand?: boolean;\n  noControls?: boolean;\n  renderControls?: ExpansionPanelControls;\n  closeOnOutsideClick?: boolean;\n  closeOnEsc?: boolean;\n  labels?: ExpansionPanelLabels;\n  children?: ExpansionPanelChildren;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst DEFAULT_LABELS: Required<ExpansionPanelLabels> = {\n  expandRow: \"Expand to full row\",\n  collapseRow: \"Collapse to grid\",\n  expandFullscreen: \"Expand to fullscreen\",\n  closeFullscreen: \"Close fullscreen\",\n  placeholder: \"Panel is open in fullscreen\",\n  placeholderClose: \"Close\",\n};\n\nexport function ExpansionPanel(props: ExpansionPanelProps): JSX.Element {\n  const merged = mergeProps(\n    { defaultMode: \"tile\" as ExpansionMode, disableExpand: false, noControls: false, closeOnOutsideClick: true, closeOnEsc: true },\n    props\n  );\n  const [local] = splitProps(merged, [\n    \"class\",\n    \"header\",\n    \"mode\",\n    \"defaultMode\",\n    \"onModeChange\",\n    \"disableExpand\",\n    \"noControls\",\n    \"renderControls\",\n    \"closeOnOutsideClick\",\n    \"closeOnEsc\",\n    \"labels\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const [mode, setMode] = createControllableState<ExpansionMode>({\n    value: () => local.mode,\n    defaultValue: local.defaultMode,\n    onChange: (next) => local.onModeChange?.(next),\n  });\n\n  const labels = (): Required<ExpansionPanelLabels> => ({ ...DEFAULT_LABELS, ...local.labels });\n  const effectiveMode = (): ExpansionMode => (local.disableExpand ? \"tile\" : mode());\n  const isFullRow = (): boolean => effectiveMode() === \"row\";\n  const isFullscreen = (): boolean => effectiveMode() === \"fullscreen\";\n\n  const toggleRow = (): void => setMode((current) => (current === \"row\" ? \"tile\" : \"row\"));\n  const openFullscreen = (): void => setMode(\"fullscreen\");\n  const closeFullscreen = (): void => setMode(\"tile\");\n\n  const controlsContext = (overlay: boolean): ExpansionPanelControlsContext => ({\n    mode: effectiveMode(),\n    isFullscreen: overlay,\n    isFullRow: overlay ? false : isFullRow(),\n    setMode,\n    toggleRow,\n    openFullscreen,\n    closeFullscreen,\n    labels: labels(),\n  });\n\n  const renderChildren = (overlay: boolean): JSX.Element => {\n    const ctx: ExpansionPanelRenderContext = { mode: effectiveMode(), isFullscreen: overlay, isFullRow: overlay ? false : isFullRow() };\n    return typeof local.children === \"function\" ? local.children(ctx) : local.children;\n  };\n\n  const defaultControls = (overlay: boolean): JSX.Element => {\n    if (overlay) {\n      return (\n        <Button\n          type=\"button\"\n          variant=\"outlined\"\n          size=\"small\"\n          aria-label={labels().closeFullscreen}\n          title={labels().closeFullscreen}\n          onClick={closeFullscreen}\n          data-testid=\"expansion-panel-close\"\n          icon={<Icon name=\"close\" size={18} />}\n        />\n      );\n    }\n    return (\n      <>\n        <Button\n          type=\"button\"\n          variant=\"outlined\"\n          size=\"small\"\n          aria-pressed={isFullRow()}\n          aria-label={isFullRow() ? labels().collapseRow : labels().expandRow}\n          title={isFullRow() ? labels().collapseRow : labels().expandRow}\n          onClick={toggleRow}\n          data-testid=\"expansion-panel-row\"\n          icon={<Icon name={isFullRow() ? \"grid_view\" : \"table_rows\"} size={18} />}\n        />\n        <Button\n          type=\"button\"\n          variant=\"outlined\"\n          size=\"small\"\n          aria-label={labels().expandFullscreen}\n          title={labels().expandFullscreen}\n          onClick={openFullscreen}\n          data-testid=\"expansion-panel-fullscreen\"\n          icon={<Icon name=\"open_in_full\" size={18} />}\n        />\n      </>\n    );\n  };\n\n  const controlBar = (overlay: boolean): JSX.Element => {\n    if (local.disableExpand || local.noControls) return null;\n    const content = local.renderControls\n      ? typeof local.renderControls === \"function\"\n        ? local.renderControls(controlsContext(overlay))\n        : local.renderControls\n      : defaultControls(overlay);\n    return <Show when={content}>{(c) => <div class=\"smwb-expansion-panel__controls\">{c() as JSX.Element}</div>}</Show>;\n  };\n\n  // Lock body scroll while fullscreen.\n  createEffect(() => {\n    if (!isFullscreen()) return;\n    const prev = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    onCleanup(() => {\n      document.body.style.overflow = prev;\n    });\n  });\n\n  // Escape closes fullscreen.\n  createEffect(() => {\n    if (!isFullscreen() || !local.closeOnEsc) return;\n    const onKeyDown = (event: KeyboardEvent): void => {\n      if (event.key === \"Escape\") setMode(\"tile\");\n    };\n    document.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\n  });\n\n  const card = (): JSX.Element => (\n    <div\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-expansion-panel\", { \"smwb-expansion-panel_row\": isFullRow() }, local.class)}\n      data-testid=\"expansion-panel\"\n    >\n      <div class=\"smwb-expansion-panel__head\">\n        <div class=\"smwb-expansion-panel__header\">{local.header}</div>\n        {controlBar(false)}\n      </div>\n      <div class=\"smwb-expansion-panel__body\">{renderChildren(false)}</div>\n    </div>\n  );\n\n  return (\n    <Show when={isFullscreen()} fallback={card()}>\n      <>\n        <div class=\"smwb-expansion-panel__placeholder\" data-testid=\"expansion-panel-placeholder\">\n          <span>{labels().placeholder}</span>\n          <Button type=\"button\" variant=\"outlined\" size=\"small\" label={labels().placeholderClose} onClick={() => setMode(\"tile\")} />\n        </div>\n        <Portal mount={(isServer ? undefined : document.body) as Node}>\n          <div\n            class=\"smwb-expansion-panel__overlay smwb-dark\"\n            role=\"dialog\"\n            aria-modal=\"true\"\n            data-testid=\"expansion-panel-overlay\"\n            onClick={\n              local.closeOnOutsideClick\n                ? (event) => {\n                    if (event.target === event.currentTarget) setMode(\"tile\");\n                  }\n                : undefined\n            }\n          >\n            <div class=\"smwb-expansion-panel__dialog\">\n              <div class=\"smwb-expansion-panel__head\">\n                <div class=\"smwb-expansion-panel__header\">{local.header}</div>\n                {controlBar(true)}\n              </div>\n              <div class=\"smwb-expansion-panel__body smwb-expansion-panel__body_fullscreen\">{renderChildren(true)}</div>\n            </div>\n          </div>\n        </Portal>\n      </>\n    </Show>\n  );\n}\n\nexport default ExpansionPanel;\n"],"names":["DEFAULT_LABELS","expandRow","collapseRow","expandFullscreen","closeFullscreen","placeholder","placeholderClose","ExpansionPanel","props","merged","mergeProps","defaultMode","disableExpand","noControls","closeOnOutsideClick","closeOnEsc","local","splitProps","mode","setMode","createControllableState","value","defaultValue","onChange","next","onModeChange","labels","effectiveMode","isFullRow","isFullscreen","toggleRow","current","openFullscreen","controlsContext","overlay","renderChildren","ctx","children","defaultControls","_$createComponent","Button","type","variant","size","title","onClick","icon","Icon","name","_$memo","controlBar","content","renderControls","Show","when","c","_el$","_tmpl$","_$insert","createEffect","prev","document","body","style","overflow","onCleanup","onKeyDown","event","key","addEventListener","removeEventListener","card","_el$2","_tmpl$2","_el$3","firstChild","_el$4","_el$5","nextSibling","_ref$","mergeRefs","ref","_$use","header","_$effect","_$className","cn","class","fallback","_el$6","_tmpl$3","_el$7","label","Portal","mount","isServer","undefined","_el$8","_tmpl$4","_el$9","_el$0","_el$1","_el$10","_$addEventListener","target","currentTarget","_$delegateEvents"],"mappings":";;;;;;;;;AAqDA,MAAMA,IAAiD;AAAA,EACrDC,WAAW;AAAA,EACXC,aAAa;AAAA,EACbC,kBAAkB;AAAA,EAClBC,iBAAiB;AAAA,EACjBC,aAAa;AAAA,EACbC,kBAAkB;AACpB;AAEO,SAASC,GAAeC,GAAyC;AACtE,QAAMC,IAASC,EACb;AAAA,IAAEC,aAAa;AAAA,IAAyBC,eAAe;AAAA,IAAOC,YAAY;AAAA,IAAOC,qBAAqB;AAAA,IAAMC,YAAY;AAAA,EAAA,GACxHP,CACF,GACM,CAACQ,CAAK,IAAIC,EAAWR,GAAQ,CACjC,SACA,UACA,QACA,eACA,gBACA,iBACA,cACA,kBACA,uBACA,cACA,UACA,YACA,KAAK,CACN,GAEK,CAACS,GAAMC,CAAO,IAAIC,EAAuC;AAAA,IAC7DC,OAAOA,MAAML,EAAME;AAAAA,IACnBI,cAAcN,EAAML;AAAAA,IACpBY,UAAWC,CAAAA,MAASR,EAAMS,eAAeD,CAAI;AAAA,EAAA,CAC9C,GAEKE,IAASA,OAAuC;AAAA,IAAE,GAAG1B;AAAAA,IAAgB,GAAGgB,EAAMU;AAAAA,EAAAA,IAC9EC,IAAgBA,MAAsBX,EAAMJ,gBAAgB,SAASM,EAAAA,GACrEU,IAAYA,MAAeD,EAAAA,MAAoB,OAC/CE,IAAeA,MAAeF,EAAAA,MAAoB,cAElDG,IAAYA,MAAYX,EAASY,OAAaA,MAAY,QAAQ,SAAS,KAAM,GACjFC,IAAiBA,MAAYb,EAAQ,YAAY,GACjDf,IAAkBA,MAAYe,EAAQ,MAAM,GAE5Cc,IAAkBA,CAACC,OAAqD;AAAA,IAC5EhB,MAAMS,EAAAA;AAAAA,IACNE,cAAcK;AAAAA,IACdN,WAAWM,IAAU,KAAQN,EAAAA;AAAAA,IAC7BT,SAAAA;AAAAA,IACAW,WAAAA;AAAAA,IACAE,gBAAAA;AAAAA,IACA5B,iBAAAA;AAAAA,IACAsB,QAAQA,EAAAA;AAAAA,EAAO,IAGXS,IAAiBA,CAACD,MAAkC;AACxD,UAAME,IAAmC;AAAA,MAAElB,MAAMS,EAAAA;AAAAA,MAAiBE,cAAcK;AAAAA,MAASN,WAAWM,IAAU,KAAQN,EAAAA;AAAAA,IAAU;AAChI,WAAO,OAAOZ,EAAMqB,YAAa,aAAarB,EAAMqB,SAASD,CAAG,IAAIpB,EAAMqB;AAAAA,EAC5E,GAEMC,IAAkBA,CAACJ,MACnBA,IACFK,EACGC,GAAM;AAAA,IACLC,MAAI;AAAA,IACJC,SAAO;AAAA,IACPC,MAAI;AAAA,IAAA,IAAA,eAAA;AAAA,aACQjB,IAAStB;AAAAA,IAAe;AAAA,IAAA,IACpCwC,QAAK;AAAA,aAAElB,IAAStB;AAAAA,IAAe;AAAA,IAC/ByC,SAASzC;AAAAA,IAAe,eAAA;AAAA,IAAA,IAExB0C,OAAI;AAAA,aAAAP,EAAGQ,GAAI;AAAA,QAACC,MAAI;AAAA,QAASL,MAAM;AAAA,MAAA,CAAE;AAAA,IAAA;AAAA,EAAA,CAAA,IAIvC,CAAAJ,EAEKC,GAAM;AAAA,IACLC,MAAI;AAAA,IACJC,SAAO;AAAA,IACPC,MAAI;AAAA,IAAA,IAAA,iBAAA;AAAA,aACUf,EAAAA;AAAAA,IAAW;AAAA,IAAA,IAAA,eAAA;AAAA,aACbqB,EAAA,MAAA,CAAA,CAAArB,EAAAA,CAAW,MAAGF,IAASxB,cAAcwB,EAAAA,EAASzB;AAAAA,IAAS;AAAA,IAAA,IACnE2C,QAAK;AAAA,aAAEK,EAAA,MAAA,CAAA,CAAArB,EAAAA,CAAW,MAAGF,IAASxB,cAAcwB,EAAAA,EAASzB;AAAAA,IAAS;AAAA,IAC9D4C,SAASf;AAAAA,IAAS,eAAA;AAAA,IAAA,IAElBgB,OAAI;AAAA,aAAAP,EAAGQ,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEpB,EAAAA,IAAc,cAAc;AAAA,QAAY;AAAA,QAAEe,MAAM;AAAA,MAAA,CAAE;AAAA,IAAA;AAAA,EAAA,CAAA,GAAAJ,EAErEC,GAAM;AAAA,IACLC,MAAI;AAAA,IACJC,SAAO;AAAA,IACPC,MAAI;AAAA,IAAA,IAAA,eAAA;AAAA,aACQjB,IAASvB;AAAAA,IAAgB;AAAA,IAAA,IACrCyC,QAAK;AAAA,aAAElB,IAASvB;AAAAA,IAAgB;AAAA,IAChC0C,SAASb;AAAAA,IAAc,eAAA;AAAA,IAAA,IAEvBc,OAAI;AAAA,aAAAP,EAAGQ,GAAI;AAAA,QAACC,MAAI;AAAA,QAAgBL,MAAM;AAAA,MAAA,CAAE;AAAA,IAAA;AAAA,EAAA,CAAA,CAAA,GAM1CO,IAAaA,CAAChB,MAAkC;AACpD,QAAIlB,EAAMJ,iBAAiBI,EAAMH,WAAY,QAAO;AACpD,UAAMsC,IAAUnC,EAAMoC,iBAClB,OAAOpC,EAAMoC,kBAAmB,aAC9BpC,EAAMoC,eAAenB,EAAgBC,CAAO,CAAC,IAC7ClB,EAAMoC,iBACRd,EAAgBJ,CAAO;AAC3B,WAAAK,EAAQc,GAAI;AAAA,MAACC,MAAMH;AAAAA,MAAOd,UAAIkB,QAAC,MAAA;AAAA,YAAAC,IAAAC,EAAAA;AAAAC,eAAAA,EAAAF,GAAA,MAAkDD,GAAkB,GAAAC;AAAAA,MAAA,GAAA;AAAA,IAAA,CAAO;AAAA,EAC5G;AAGAG,EAAAA,EAAa,MAAM;AACjB,QAAI,CAAC9B,IAAgB;AACrB,UAAM+B,IAAOC,SAASC,KAAKC,MAAMC;AACjCH,aAASC,KAAKC,MAAMC,WAAW,UAC/BC,EAAU,MAAM;AACdJ,eAASC,KAAKC,MAAMC,WAAWJ;AAAAA,IACjC,CAAC;AAAA,EACH,CAAC,GAGDD,EAAa,MAAM;AACjB,QAAI,CAAC9B,EAAAA,KAAkB,CAACb,EAAMD,WAAY;AAC1C,UAAMmD,IAAYA,CAACC,MAA+B;AAChD,MAAIA,EAAMC,QAAQ,YAAUjD,EAAQ,MAAM;AAAA,IAC5C;AACA0C,aAASQ,iBAAiB,WAAWH,CAAS,GAC9CD,EAAU,MAAMJ,SAASS,oBAAoB,WAAWJ,CAAS,CAAC;AAAA,EACpE,CAAC;AAED,QAAMK,IAAOA,OAAe,MAAA;AAAA,QAAAC,IAAAC,KAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAH,EAAAI,aAAAC,IAEnBC,EAAUhE,EAAMiE,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAP,CAAA,GAAAd,EAAAkB,GAAA,MAKoB5D,EAAMmE,MAAM,GAAAzB,EAAAgB,GAAA,MACtDxB,EAAW,EAAK,GAAC,IAAA,GAAAQ,EAAAmB,GAAA,MAEqB1C,EAAe,EAAK,CAAC,GAAAiD,EAAA,MAAAC,EAAAb,GAPvDc,EAAG,wBAAwB;AAAA,MAAE,4BAA4B1D,EAAAA;AAAAA,IAAU,GAAKZ,EAAMuE,KAAK,CAAC,CAAA,GAAAf;AAAAA,EAAA,GAAA;AAW/F,SAAAjC,EACGc,GAAI;AAAA,IAAA,IAACC,OAAI;AAAA,aAAEzB,EAAAA;AAAAA,IAAc;AAAA,IAAA,IAAE2D,WAAQ;AAAA,aAAEjB,EAAAA;AAAAA,IAAM;AAAA,IAAA,IAAAlC,WAAA;AAAA,aAAA,EAAA,MAAA;AAAA,YAAAoD,IAAAC,EAAAA,GAAAC,IAAAF,EAAAd;AAAAjB,eAAAA,EAAAiC,GAAA,MAG/BjE,EAAAA,EAASrB,WAAW,GAAAqD,EAAA+B,GAAAlD,EAC1BC,GAAM;AAAA,UAACC,MAAI;AAAA,UAAUC,SAAO;AAAA,UAAYC,MAAI;AAAA,UAAA,IAASiD,QAAK;AAAA,mBAAElE,IAASpB;AAAAA,UAAgB;AAAA,UAAEuC,SAASA,MAAM1B,EAAQ,MAAM;AAAA,QAAA,CAAC,GAAA,IAAA,GAAAsE;AAAAA,MAAA,GAAA,GAAAlD,EAEvHsD,GAAM;AAAA,QAAA,IAACC,QAAK;AAAA,iBAAGC,IAAWC,SAAYnC,SAASC;AAAAA,QAAa;AAAA,QAAA,IAAAzB,WAAA;AAAA,cAAA4D,IAAAC,EAAAA,GAAAC,IAAAF,EAAAtB,YAAAyB,IAAAD,EAAAxB,YAAA0B,IAAAD,EAAAzB,YAAA2B,IAAAF,EAAAtB;AAAAyB,iBAAAA,EAAAN,GAAA,SAOvDjF,EAAMF,sBACDqD,CAAAA,MAAU;AACT,YAAIA,EAAMqC,WAAWrC,EAAMsC,mBAAuB,MAAM;AAAA,UAC1D,IACAT,QAAS,EAAA,GAAAtC,EAAA2C,GAAA,MAKgCrF,EAAMmE,MAAM,GAAAzB,EAAA0C,GAAA,MACtDlD,EAAW,EAAI,GAAC,IAAA,GAAAQ,EAAA4C,GAAA,MAE4DnE,EAAe,EAAI,CAAC,GAAA8D;AAAAA,QAAA;AAAA,MAAA,CAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA;AAOjH;AAE8BS,EAAA,CAAA,OAAA,CAAA;"}
+{"version":3,"file":"expansionPanel.js","sources":["../../../../src/components/dataDisplay/expansionPanel/expansionPanel.tsx"],"sourcesContent":["import { type JSX, Show, createEffect, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport { Portal, isServer } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Button } from \"../../inputs/button\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type ExpansionMode = \"tile\" | \"row\" | \"fullscreen\";\n\nexport interface ExpansionPanelLabels {\n  expandRow?: string;\n  collapseRow?: string;\n  expandFullscreen?: string;\n  closeFullscreen?: string;\n  placeholder?: string;\n  placeholderClose?: string;\n}\n\nexport interface ExpansionPanelRenderContext {\n  mode: ExpansionMode;\n  isFullscreen: boolean;\n  isFullRow: boolean;\n}\n\nexport interface ExpansionPanelControlsContext extends ExpansionPanelRenderContext {\n  setMode: (next: ExpansionMode | ((current: ExpansionMode) => ExpansionMode)) => void;\n  toggleRow: () => void;\n  openFullscreen: () => void;\n  closeFullscreen: () => void;\n  labels: Required<ExpansionPanelLabels>;\n}\n\ntype ExpansionPanelChildren = JSX.Element | ((ctx: ExpansionPanelRenderContext) => JSX.Element);\ntype ExpansionPanelControls = JSX.Element | ((ctx: ExpansionPanelControlsContext) => JSX.Element);\n\nexport interface ExpansionPanelProps {\n  class?: string;\n  header?: JSX.Element;\n  mode?: ExpansionMode;\n  defaultMode?: ExpansionMode;\n  onModeChange?: (mode: ExpansionMode) => void;\n  disableExpand?: boolean;\n  noControls?: boolean;\n  renderControls?: ExpansionPanelControls;\n  closeOnOutsideClick?: boolean;\n  closeOnEsc?: boolean;\n  labels?: ExpansionPanelLabels;\n  children?: ExpansionPanelChildren;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst DEFAULT_LABELS: Required<ExpansionPanelLabels> = {\n  expandRow: \"Expand to full row\",\n  collapseRow: \"Collapse to grid\",\n  expandFullscreen: \"Expand to fullscreen\",\n  closeFullscreen: \"Close fullscreen\",\n  placeholder: \"Panel is open in fullscreen\",\n  placeholderClose: \"Close\",\n};\n\nexport function ExpansionPanel(props: ExpansionPanelProps): JSX.Element {\n  const merged = mergeProps(\n    { defaultMode: \"tile\" as ExpansionMode, disableExpand: false, noControls: false, closeOnOutsideClick: true, closeOnEsc: true },\n    props\n  );\n  const [local] = splitProps(merged, [\n    \"class\",\n    \"header\",\n    \"mode\",\n    \"defaultMode\",\n    \"onModeChange\",\n    \"disableExpand\",\n    \"noControls\",\n    \"renderControls\",\n    \"closeOnOutsideClick\",\n    \"closeOnEsc\",\n    \"labels\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const [mode, setMode] = createControllableState<ExpansionMode>({\n    value: () => local.mode,\n    defaultValue: local.defaultMode,\n    onChange: (next) => local.onModeChange?.(next),\n  });\n\n  const labels = (): Required<ExpansionPanelLabels> => ({ ...DEFAULT_LABELS, ...local.labels });\n  const effectiveMode = (): ExpansionMode => (local.disableExpand ? \"tile\" : mode());\n  const isFullRow = (): boolean => effectiveMode() === \"row\";\n  const isFullscreen = (): boolean => effectiveMode() === \"fullscreen\";\n\n  const toggleRow = (): void => setMode((current) => (current === \"row\" ? \"tile\" : \"row\"));\n  const openFullscreen = (): void => setMode(\"fullscreen\");\n  const closeFullscreen = (): void => setMode(\"tile\");\n\n  const controlsContext = (overlay: boolean): ExpansionPanelControlsContext => ({\n    mode: effectiveMode(),\n    isFullscreen: overlay,\n    isFullRow: overlay ? false : isFullRow(),\n    setMode,\n    toggleRow,\n    openFullscreen,\n    closeFullscreen,\n    labels: labels(),\n  });\n\n  const renderChildren = (overlay: boolean): JSX.Element => {\n    const ctx: ExpansionPanelRenderContext = { mode: effectiveMode(), isFullscreen: overlay, isFullRow: overlay ? false : isFullRow() };\n    return typeof local.children === \"function\" ? local.children(ctx) : local.children;\n  };\n\n  const defaultControls = (overlay: boolean): JSX.Element => {\n    if (overlay) {\n      return (\n        <Button\n          type=\"button\"\n          variant=\"outlined\"\n          size=\"small\"\n          aria-label={labels().closeFullscreen}\n          title={labels().closeFullscreen}\n          onClick={closeFullscreen}\n          data-testid=\"expansion-panel-close\"\n          icon={<Icon name=\"close\" size={18} />}\n        />\n      );\n    }\n    return (\n      <>\n        <Button\n          type=\"button\"\n          variant=\"outlined\"\n          size=\"small\"\n          aria-pressed={isFullRow()}\n          aria-label={isFullRow() ? labels().collapseRow : labels().expandRow}\n          title={isFullRow() ? labels().collapseRow : labels().expandRow}\n          onClick={toggleRow}\n          data-testid=\"expansion-panel-row\"\n          icon={<Icon name={isFullRow() ? \"grid_view\" : \"table_rows\"} size={18} />}\n        />\n        <Button\n          type=\"button\"\n          variant=\"outlined\"\n          size=\"small\"\n          aria-label={labels().expandFullscreen}\n          title={labels().expandFullscreen}\n          onClick={openFullscreen}\n          data-testid=\"expansion-panel-fullscreen\"\n          icon={<Icon name=\"open_in_full\" size={18} />}\n        />\n      </>\n    );\n  };\n\n  const controlBar = (overlay: boolean): JSX.Element => {\n    if (local.disableExpand || local.noControls) return null;\n    const content = local.renderControls\n      ? typeof local.renderControls === \"function\"\n        ? local.renderControls(controlsContext(overlay))\n        : local.renderControls\n      : defaultControls(overlay);\n    return <Show when={content}>{(c) => <div class=\"smwb-expansion-panel__controls\">{c() as JSX.Element}</div>}</Show>;\n  };\n\n  // Lock body scroll while fullscreen.\n  createEffect(() => {\n    if (!isFullscreen()) return;\n    const prev = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    onCleanup(() => {\n      document.body.style.overflow = prev;\n    });\n  });\n\n  // Escape closes fullscreen.\n  createEffect(() => {\n    if (!isFullscreen() || !local.closeOnEsc) return;\n    const onKeyDown = (event: KeyboardEvent): void => {\n      if (event.key === \"Escape\") setMode(\"tile\");\n    };\n    document.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\n  });\n\n  const card = (): JSX.Element => (\n    <div\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-expansion-panel\", { \"smwb-expansion-panel_row\": isFullRow() }, local.class)}\n      data-testid=\"expansion-panel\"\n    >\n      <div class=\"smwb-expansion-panel__head\">\n        <div class=\"smwb-expansion-panel__header\">{local.header}</div>\n        {controlBar(false)}\n      </div>\n      <div class=\"smwb-expansion-panel__body\">{renderChildren(false)}</div>\n    </div>\n  );\n\n  return (\n    <Show when={isFullscreen()} fallback={card()}>\n      <>\n        <div class=\"smwb-expansion-panel__placeholder\" data-testid=\"expansion-panel-placeholder\">\n          <span>{labels().placeholder}</span>\n          <Button type=\"button\" variant=\"outlined\" size=\"small\" label={labels().placeholderClose} onClick={() => setMode(\"tile\")} />\n        </div>\n        <Portal mount={(isServer ? undefined : document.body) as Node}>\n          <div\n            class=\"smwb-expansion-panel__overlay smwb-dark\"\n            role=\"dialog\"\n            aria-modal=\"true\"\n            data-testid=\"expansion-panel-overlay\"\n            onClick={\n              local.closeOnOutsideClick\n                ? (event) => {\n                    if (event.target === event.currentTarget) setMode(\"tile\");\n                  }\n                : undefined\n            }\n          >\n            <div class=\"smwb-expansion-panel__dialog\">\n              <div class=\"smwb-expansion-panel__head\">\n                <div class=\"smwb-expansion-panel__header\">{local.header}</div>\n                {controlBar(true)}\n              </div>\n              <div class=\"smwb-expansion-panel__body smwb-expansion-panel__body_fullscreen\">{renderChildren(true)}</div>\n            </div>\n          </div>\n        </Portal>\n      </>\n    </Show>\n  );\n}\n\nexport default ExpansionPanel;\n"],"names":["DEFAULT_LABELS","expandRow","collapseRow","expandFullscreen","closeFullscreen","placeholder","placeholderClose","ExpansionPanel","props","merged","mergeProps","defaultMode","disableExpand","noControls","closeOnOutsideClick","closeOnEsc","local","splitProps","mode","setMode","createControllableState","value","defaultValue","onChange","next","onModeChange","labels","effectiveMode","isFullRow","isFullscreen","toggleRow","current","openFullscreen","controlsContext","overlay","renderChildren","ctx","children","defaultControls","_$createComponent","Button","type","variant","size","title","onClick","icon","Icon","name","_$memo","controlBar","content","renderControls","Show","when","c","_el$","_tmpl$","_$insert","createEffect","prev","document","body","style","overflow","onCleanup","onKeyDown","event","key","addEventListener","removeEventListener","card","_el$2","_tmpl$2","_el$3","firstChild","_el$4","_el$5","nextSibling","_ref$","mergeRefs","ref","_$use","header","_$effect","_$className","cn","class","fallback","_el$6","_tmpl$3","_el$7","label","Portal","mount","isServer","undefined","_el$8","_tmpl$4","_el$9","_el$0","_el$1","_el$10","_$addEventListener","target","currentTarget","_$delegateEvents"],"mappings":"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"}

package/dist/components/dataDisplay/imagesList/imagesList.js

@@ -1,18 +1,19 @@
-import { createComponent as p, use as b, insert as w, effect as y, className as c, setAttribute as d, setStyleProperty as g, template as H } from "solid-js/web";
-import '../../../assets/styles/less/components/imagesList/imagesList.entry.css';/* empty css                                                               */
+import { createComponent as h, use as b, insert as w, effect as y, className as c, setAttribute as d, setStyleProperty as g, template as H } from "solid-js/web";
+import '../../../assets/styles/less/components/imagesList/imagesList.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
+/* empty css                                                               */
 import { mergeProps as P, splitProps as x } from "solid-js";
 import f from "clsx";
 import { ImagesListContext as C } from "./imagesListContext.js";
 import { mergeRefs as I } from "../../../primitives/mergeRefs.js";
 var L = /* @__PURE__ */ H("<div data-testid=images-list><ul>");
-function k(u) {
-  const h = P({
+function q(u) {
+  const p = P({
     gap: 4,
     cols: 3,
     rowsHeight: 0,
     variant: "default"
-  }, u), [r] = x(h, ["class", "children", "gap", "cols", "rowsHeight", "variant", "aria-label", "id", "ref"]);
-  return p(C.Provider, {
+  }, u), [r] = x(p, ["class", "children", "gap", "cols", "rowsHeight", "variant", "aria-label", "id", "ref"]);
+  return h(C.Provider, {
     get value() {
       return {
         rowsHeight: r.rowsHeight,
@@ -36,6 +37,6 @@ function k(u) {
   });
 }
 export {
-  k as ImagesList
+  q as ImagesList
 };
 //# sourceMappingURL=imagesList.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"imagesList.js","sources":["../../../../src/components/dataDisplay/imagesList/imagesList.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { ImagesListContext } from \"./imagesListContext\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface ImagesListProps {\n  class?: string;\n  rowsHeight?: number;\n  cols: number;\n  variant?: \"woven\" | \"masonry\" | \"default\";\n  gap?: number;\n  \"aria-label\"?: string;\n  id?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function ImagesList(props: ParentProps<ImagesListProps>): JSX.Element {\n  const merged = mergeProps({ gap: 4, cols: 3, rowsHeight: 0, variant: \"default\" as const }, props);\n  const [local] = splitProps(merged, [\"class\", \"children\", \"gap\", \"cols\", \"rowsHeight\", \"variant\", \"aria-label\", \"id\", \"ref\"]);\n\n  return (\n    <ImagesListContext.Provider value={{ rowsHeight: local.rowsHeight, variant: local.variant }}>\n      <div class={cn(\"smwb-gallery\", local.class)} data-testid=\"images-list\" ref={mergeRefs(local.ref)} id={local.id}>\n        <ul\n          aria-label={local[\"aria-label\"]}\n          class={cn(\"smwb-gallery__list\", `smwb-${local.variant}`)}\n          style={{ \"--cols-count\": `${local.cols}`, \"--gap\": `${local.gap}px` }}\n        >\n          {local.children}\n        </ul>\n      </div>\n    </ImagesListContext.Provider>\n  );\n}\n\nexport default ImagesList;\n"],"names":["ImagesList","props","merged","mergeProps","gap","cols","rowsHeight","variant","local","splitProps","_$createComponent","ImagesListContext","Provider","value","children","_el$","_tmpl$","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","_$insert","_$effect","_p$","_v$","cn","class","_v$2","id","_v$3","_v$4","_v$5","_v$6","e","_$className","t","_$setAttribute","a","o","i","_$setStyleProperty","n","undefined"],"mappings":";;;;;;;AAiBO,SAASA,EAAWC,GAAkD;AAC3E,QAAMC,IAASC,EAAW;AAAA,IAAEC,KAAK;AAAA,IAAGC,MAAM;AAAA,IAAGC,YAAY;AAAA,IAAGC,SAAS;AAAA,EAAA,GAAsBN,CAAK,GAC1F,CAACO,CAAK,IAAIC,EAAWP,GAAQ,CAAC,SAAS,YAAY,OAAO,QAAQ,cAAc,WAAW,cAAc,MAAM,KAAK,CAAC;AAE3H,SAAAQ,EACGC,EAAkBC,UAAQ;AAAA,IAAA,IAACC,QAAK;AAAA,aAAE;AAAA,QAAEP,YAAYE,EAAMF;AAAAA,QAAYC,SAASC,EAAMD;AAAAA,MAAAA;AAAAA,IAAS;AAAA,IAAA,IAAAO,WAAA;AAAA,UAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IACbC,EAAUZ,EAAMa,GAAG;AAAC,oBAAAF,KAAA,cAAAG,EAAAH,GAAAJ,CAAA,GAAAQ,EAAAN,GAAA,MAM3FT,EAAMM,QAAQ,GAAAU,EAAAC,CAAAA,MAAA;AAAA,YAAAC,IANPC,EAAG,gBAAgBnB,EAAMoB,KAAK,GAACC,IAA2DrB,EAAMsB,IAAEC,IAE9FvB,EAAM,YAAY,GAACwB,IACxBL,EAAG,sBAAsB,QAAQnB,EAAMD,OAAO,EAAE,GAAC0B,IAC/B,GAAGzB,EAAMH,IAAI,IAAE6B,IAAW,GAAG1B,EAAMJ,GAAG;AAAIsB,eAAAA,MAAAD,EAAAU,KAAAC,EAAArB,GAAAU,EAAAU,IAAAT,CAAA,GAAAG,MAAAJ,EAAAY,KAAAC,EAAAvB,GAAA,MAAAU,EAAAY,IAAAR,CAAA,GAAAE,MAAAN,EAAAc,KAAAD,EAAArB,GAAA,cAAAQ,EAAAc,IAAAR,CAAA,GAAAC,MAAAP,EAAAe,KAAAJ,EAAAnB,GAAAQ,EAAAe,IAAAR,CAAA,GAAAC,MAAAR,EAAAgB,KAAAC,EAAAzB,GAAA,gBAAAQ,EAAAgB,IAAAR,CAAA,GAAAC,MAAAT,EAAAkB,KAAAD,EAAAzB,GAAA,SAAAQ,EAAAkB,IAAAT,CAAA,GAAAT;AAAAA,MAAA,GAAA;AAAA,QAAAU,GAAAS;AAAAA,QAAAP,GAAAO;AAAAA,QAAAL,GAAAK;AAAAA,QAAAJ,GAAAI;AAAAA,QAAAH,GAAAG;AAAAA,QAAAD,GAAAC;AAAAA,MAAAA,CAAA,GAAA7B;AAAAA,IAAA;AAAA,EAAA,CAAA;AAO7E;"}
+{"version":3,"file":"imagesList.js","sources":["../../../../src/components/dataDisplay/imagesList/imagesList.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { ImagesListContext } from \"./imagesListContext\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface ImagesListProps {\n  class?: string;\n  rowsHeight?: number;\n  cols: number;\n  variant?: \"woven\" | \"masonry\" | \"default\";\n  gap?: number;\n  \"aria-label\"?: string;\n  id?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function ImagesList(props: ParentProps<ImagesListProps>): JSX.Element {\n  const merged = mergeProps({ gap: 4, cols: 3, rowsHeight: 0, variant: \"default\" as const }, props);\n  const [local] = splitProps(merged, [\"class\", \"children\", \"gap\", \"cols\", \"rowsHeight\", \"variant\", \"aria-label\", \"id\", \"ref\"]);\n\n  return (\n    <ImagesListContext.Provider value={{ rowsHeight: local.rowsHeight, variant: local.variant }}>\n      <div class={cn(\"smwb-gallery\", local.class)} data-testid=\"images-list\" ref={mergeRefs(local.ref)} id={local.id}>\n        <ul\n          aria-label={local[\"aria-label\"]}\n          class={cn(\"smwb-gallery__list\", `smwb-${local.variant}`)}\n          style={{ \"--cols-count\": `${local.cols}`, \"--gap\": `${local.gap}px` }}\n        >\n          {local.children}\n        </ul>\n      </div>\n    </ImagesListContext.Provider>\n  );\n}\n\nexport default ImagesList;\n"],"names":["ImagesList","props","merged","mergeProps","gap","cols","rowsHeight","variant","local","splitProps","_$createComponent","ImagesListContext","Provider","value","children","_el$","_tmpl$","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","_$insert","_$effect","_p$","_v$","cn","class","_v$2","id","_v$3","_v$4","_v$5","_v$6","e","_$className","t","_$setAttribute","a","o","i","_$setStyleProperty","n","undefined"],"mappings":";;;;;;;;AAkBO,SAASA,EAAWC,GAAkD;AAC3E,QAAMC,IAASC,EAAW;AAAA,IAAEC,KAAK;AAAA,IAAGC,MAAM;AAAA,IAAGC,YAAY;AAAA,IAAGC,SAAS;AAAA,EAAA,GAAsBN,CAAK,GAC1F,CAACO,CAAK,IAAIC,EAAWP,GAAQ,CAAC,SAAS,YAAY,OAAO,QAAQ,cAAc,WAAW,cAAc,MAAM,KAAK,CAAC;AAE3H,SAAAQ,EACGC,EAAkBC,UAAQ;AAAA,IAAA,IAACC,QAAK;AAAA,aAAE;AAAA,QAAEP,YAAYE,EAAMF;AAAAA,QAAYC,SAASC,EAAMD;AAAAA,MAAAA;AAAAA,IAAS;AAAA,IAAA,IAAAO,WAAA;AAAA,UAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IACbC,EAAUZ,EAAMa,GAAG;AAAC,oBAAAF,KAAA,cAAAG,EAAAH,GAAAJ,CAAA,GAAAQ,EAAAN,GAAA,MAM3FT,EAAMM,QAAQ,GAAAU,EAAAC,CAAAA,MAAA;AAAA,YAAAC,IANPC,EAAG,gBAAgBnB,EAAMoB,KAAK,GAACC,IAA2DrB,EAAMsB,IAAEC,IAE9FvB,EAAM,YAAY,GAACwB,IACxBL,EAAG,sBAAsB,QAAQnB,EAAMD,OAAO,EAAE,GAAC0B,IAC/B,GAAGzB,EAAMH,IAAI,IAAE6B,IAAW,GAAG1B,EAAMJ,GAAG;AAAIsB,eAAAA,MAAAD,EAAAU,KAAAC,EAAArB,GAAAU,EAAAU,IAAAT,CAAA,GAAAG,MAAAJ,EAAAY,KAAAC,EAAAvB,GAAA,MAAAU,EAAAY,IAAAR,CAAA,GAAAE,MAAAN,EAAAc,KAAAD,EAAArB,GAAA,cAAAQ,EAAAc,IAAAR,CAAA,GAAAC,MAAAP,EAAAe,KAAAJ,EAAAnB,GAAAQ,EAAAe,IAAAR,CAAA,GAAAC,MAAAR,EAAAgB,KAAAC,EAAAzB,GAAA,gBAAAQ,EAAAgB,IAAAR,CAAA,GAAAC,MAAAT,EAAAkB,KAAAD,EAAAzB,GAAA,SAAAQ,EAAAkB,IAAAT,CAAA,GAAAT;AAAAA,MAAA,GAAA;AAAA,QAAAU,GAAAS;AAAAA,QAAAP,GAAAO;AAAAA,QAAAL,GAAAK;AAAAA,QAAAJ,GAAAI;AAAAA,QAAAH,GAAAG;AAAAA,QAAAD,GAAAC;AAAAA,MAAAA,CAAA,GAAA7B;AAAAA,IAAA;AAAA,EAAA,CAAA;AAO7E;"}

package/dist/components/dataDisplay/imagesList/imagesListItem/imagesListItem.js

@@ -1,42 +1,47 @@
-import { insert as u, createComponent as v, effect as f, className as o, style as B, setAttribute as b, template as _, delegateEvents as I } from "solid-js/web";
-import '../../../../assets/styles/less/components/imagesList/imagesListItem/imagesListItem.entry.css';/* empty css                                                                                     */
-import { mergeProps as P, splitProps as x, createSignal as L, createEffect as O, Show as k } from "solid-js";
+import { insert as w, createComponent as f, effect as b, className as i, style as I, setAttribute as p, template as y, delegateEvents as P } from "solid-js/web";
+import '../../../../assets/styles/less/components/imagesList/imagesListItem/imagesListItem.entry.css';import '../../../../assets/styles/less/tokens.entry.css';/* empty css                                        */
+/* empty css                                                                                     */
+import { mergeProps as x, splitProps as L, children as O, createSignal as k, createEffect as E, onCleanup as H, Show as S } from "solid-js";
 import l from "clsx";
-import { ImagesListItemModal as E } from "./imagesListItemModal.js";
-import { useImagesListContext as H } from "../imagesListContext.js";
-var S = /* @__PURE__ */ _("<div>"), A = /* @__PURE__ */ _("<li data-testid=images-list-item><div class=smwb-gallery-item__inner><div class=smwb-gallery-item__img-wrapper><img>");
-function F(p) {
-  const h = P({
+import { ImagesListItemModal as A } from "./imagesListItemModal.js";
+import { useImagesListContext as M } from "../imagesListContext.js";
+var N = /* @__PURE__ */ y("<div>"), j = /* @__PURE__ */ y("<li data-testid=images-list-item><div class=smwb-gallery-item__inner><div class=smwb-gallery-item__img-wrapper><img>");
+function Q(_) {
+  const h = x({
     cols: 1,
     rows: 1,
     itemBarPlacement: "bottom",
     alt: "image"
-  }, p), [t] = x(h, ["class", "src", "rounded", "itemBarContent", "cols", "rows", "itemBarPlacement", "alt"]), s = H(), [a, m] = L(!1);
-  O(() => {
-    document.body.style.overflow = a() ? "hidden" : "auto";
+  }, _), [t] = L(h, ["class", "src", "rounded", "itemBarContent", "cols", "rows", "itemBarPlacement", "alt"]), m = O(() => t.itemBarContent), s = M(), [a, n] = k(!1);
+  E(() => {
+    if (!a()) return;
+    const r = document.body.style.overflow;
+    document.body.style.overflow = "hidden", H(() => {
+      document.body.style.overflow = r;
+    });
   });
-  const y = () => ({
+  const $ = () => ({
     height: s.rowsHeight ? `${s.rowsHeight * t.rows}px` : "",
     "grid-row-end": `span ${t.rows}`,
     "grid-column-end": `span ${t.cols}`
   });
   return [(() => {
-    var r = A(), n = r.firstChild, $ = n.firstChild, i = $.firstChild;
-    return r.$$click = () => m(!0), u(n, v(k, {
+    var r = j(), c = r.firstChild, C = c.firstChild, o = C.firstChild;
+    return r.$$click = () => n(!0), w(c, f(S, {
       get when() {
-        return t.itemBarContent;
+        return m();
       },
       get children() {
-        var e = S();
-        return u(e, () => t.itemBarContent), f(() => o(e, l("smwb-gallery-item__bar", t.class, `smwb-${t.itemBarPlacement}`, {
+        var e = N();
+        return w(e, m), b(() => i(e, l("smwb-gallery-item__bar", t.class, `smwb-${t.itemBarPlacement}`, {
           "smwb-rounded": t.rounded
         }))), e;
       }
-    }), null), f((e) => {
-      var c = l("smwb-gallery__list__item", t.class, "smwb-gallery-item", `smwb-${s.variant}`), C = y(), d = t.src, g = t.alt || "image", w = l("smwb-gallery-item__img", {
+    }), null), b((e) => {
+      var d = l("smwb-gallery__list__item", t.class, "smwb-gallery-item", `smwb-${s.variant}`), B = $(), g = t.src, u = t.alt || "image", v = l("smwb-gallery-item__img", {
         "smwb-rounded": t.rounded
       });
-      return c !== e.e && o(r, e.e = c), e.t = B(r, C, e.t), d !== e.a && b(i, "src", e.a = d), g !== e.o && b(i, "alt", e.o = g), w !== e.i && o(i, e.i = w), e;
+      return d !== e.e && i(r, e.e = d), e.t = I(r, B, e.t), g !== e.a && p(o, "src", e.a = g), u !== e.o && p(o, "alt", e.o = u), v !== e.i && i(o, e.i = v), e;
     }, {
       e: void 0,
       t: void 0,
@@ -44,18 +49,18 @@ function F(p) {
       o: void 0,
       i: void 0
     }), r;
-  })(), v(E, {
+  })(), f(A, {
     get src() {
       return t.src;
     },
-    onClose: () => m(!1),
+    onClose: () => n(!1),
     get isOpen() {
       return a();
     }
   })];
 }
-I(["click"]);
+P(["click"]);
 export {
-  F as ImagesListItem
+  Q as ImagesListItem
 };
 //# sourceMappingURL=imagesListItem.js.map

package/dist/components/dataDisplay/imagesList/imagesListItem/imagesListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"imagesListItem.js","sources":["../../../../../src/components/dataDisplay/imagesList/imagesListItem/imagesListItem.tsx"],"sourcesContent":["import { type JSX, Show, createEffect, createSignal, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { ImagesListItemModal } from \"./imagesListItemModal\";\nimport { useImagesListContext } from \"../imagesListContext\";\n\nexport interface ImagesListItemProps {\n  class?: string;\n  src: string;\n  rowsHeight?: number;\n  cols: number;\n  rows: number;\n  rounded?: boolean;\n  itemBarPlacement?: \"top\" | \"bottom\" | \"under\";\n  itemBarContent?: JSX.Element;\n  alt?: string;\n}\n\nexport function ImagesListItem(props: ImagesListItemProps): JSX.Element {\n  const merged = mergeProps({ cols: 1, rows: 1, itemBarPlacement: \"bottom\" as const, alt: \"image\" }, props);\n  const [local] = splitProps(merged, [\n    \"class\",\n    \"src\",\n    \"rounded\",\n    \"itemBarContent\",\n    \"cols\",\n    \"rows\",\n    \"itemBarPlacement\",\n    \"alt\",\n  ]);\n\n  const ctx = useImagesListContext();\n  const [isOpen, setIsOpen] = createSignal(false);\n\n  createEffect(() => {\n    document.body.style.overflow = isOpen() ? \"hidden\" : \"auto\";\n  });\n\n  const style = (): JSX.CSSProperties => ({\n    height: ctx.rowsHeight ? `${ctx.rowsHeight * local.rows}px` : \"\",\n    \"grid-row-end\": `span ${local.rows}`,\n    \"grid-column-end\": `span ${local.cols}`,\n  });\n\n  return (\n    <>\n      <li\n        data-testid=\"images-list-item\"\n        class={cn(\"smwb-gallery__list__item\", local.class, \"smwb-gallery-item\", `smwb-${ctx.variant}`)}\n        onClick={() => setIsOpen(true)}\n        style={style()}\n      >\n        <div class=\"smwb-gallery-item__inner\">\n          <div class=\"smwb-gallery-item__img-wrapper\">\n            <img src={local.src} alt={local.alt || \"image\"} class={cn(\"smwb-gallery-item__img\", { \"smwb-rounded\": local.rounded })} />\n          </div>\n          <Show when={local.itemBarContent}>\n            <div\n              class={cn(\"smwb-gallery-item__bar\", local.class, `smwb-${local.itemBarPlacement}`, { \"smwb-rounded\": local.rounded })}\n            >\n              {local.itemBarContent}\n            </div>\n          </Show>\n        </div>\n      </li>\n      <ImagesListItemModal src={local.src} onClose={() => setIsOpen(false)} isOpen={isOpen()} />\n    </>\n  );\n}\n\nexport default ImagesListItem;\n"],"names":["ImagesListItem","props","merged","mergeProps","cols","rows","itemBarPlacement","alt","local","splitProps","ctx","useImagesListContext","isOpen","setIsOpen","createSignal","createEffect","document","body","style","overflow","height","rowsHeight","_el$","_tmpl$2","_el$2","firstChild","_el$3","_el$4","$$click","_$insert","_$createComponent","Show","when","itemBarContent","children","_el$5","_tmpl$","_$effect","_$className","cn","class","rounded","_p$","_v$","variant","_v$2","_v$3","src","_v$4","_v$5","e","t","_$style","a","_$setAttribute","o","i","undefined","ImagesListItemModal","onClose","_$delegateEvents"],"mappings":";;;;;;;AAkBO,SAASA,EAAeC,GAAyC;AACtE,QAAMC,IAASC,EAAW;AAAA,IAAEC,MAAM;AAAA,IAAGC,MAAM;AAAA,IAAGC,kBAAkB;AAAA,IAAmBC,KAAK;AAAA,EAAA,GAAWN,CAAK,GAClG,CAACO,CAAK,IAAIC,EAAWP,GAAQ,CACjC,SACA,OACA,WACA,kBACA,QACA,QACA,oBACA,KAAK,CACN,GAEKQ,IAAMC,EAAAA,GACN,CAACC,GAAQC,CAAS,IAAIC,EAAa,EAAK;AAE9CC,EAAAA,EAAa,MAAM;AACjBC,aAASC,KAAKC,MAAMC,WAAWP,EAAAA,IAAW,WAAW;AAAA,EACvD,CAAC;AAED,QAAMM,IAAQA,OAA0B;AAAA,IACtCE,QAAQV,EAAIW,aAAa,GAAGX,EAAIW,aAAab,EAAMH,IAAI,OAAO;AAAA,IAC9D,gBAAgB,QAAQG,EAAMH,IAAI;AAAA,IAClC,mBAAmB,QAAQG,EAAMJ,IAAI;AAAA,EAAA;AAGvC,SAAA,EAAA,MAAA;AAAA,QAAAkB,IAAAC,KAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAAAD,EAAAD;AAAAH,WAAAA,EAAAM,UAKe,MAAMf,EAAU,EAAI,GAACgB,EAAAL,GAAAM,EAO3BC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAExB,EAAMyB;AAAAA,MAAc;AAAA,MAAA,IAAAC,WAAA;AAAA,YAAAC,IAAAC,EAAAA;AAAAP,eAAAA,EAAAM,GAAA,MAI3B3B,EAAMyB,cAAc,GAAAI,QAAAC,EAAAH,GAFdI,EAAG,0BAA0B/B,EAAMgC,OAAO,QAAQhC,EAAMF,gBAAgB,IAAI;AAAA,UAAE,gBAAgBE,EAAMiC;AAAAA,QAAAA,CAAS,CAAC,CAAA,GAAAN;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAE,EAAAK,CAAAA,MAAA;AAAA,UAAAC,IAVpHJ,EAAG,4BAA4B/B,EAAMgC,OAAO,qBAAqB,QAAQ9B,EAAIkC,OAAO,EAAE,GAACC,IAEvF3B,KAAO4B,IAIAtC,EAAMuC,KAAGC,IAAOxC,EAAMD,OAAO,SAAO0C,IAASV,EAAG,0BAA0B;AAAA,QAAE,gBAAgB/B,EAAMiC;AAAAA,MAAAA,CAAS;AAACE,aAAAA,MAAAD,EAAAQ,KAAAZ,EAAAhB,GAAAoB,EAAAQ,IAAAP,CAAA,GAAAD,EAAAS,IAAAC,EAAA9B,GAAAuB,GAAAH,EAAAS,CAAA,GAAAL,MAAAJ,EAAAW,KAAAC,EAAA3B,GAAA,OAAAe,EAAAW,IAAAP,CAAA,GAAAE,MAAAN,EAAAa,KAAAD,EAAA3B,GAAA,OAAAe,EAAAa,IAAAP,CAAA,GAAAC,MAAAP,EAAAc,KAAAlB,EAAAX,GAAAe,EAAAc,IAAAP,CAAA,GAAAP;AAAAA,IAAA,GAAA;AAAA,MAAAQ,GAAAO;AAAAA,MAAAN,GAAAM;AAAAA,MAAAJ,GAAAI;AAAAA,MAAAF,GAAAE;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA,GAAAnC;AAAAA,EAAA,GAAA,GAAAQ,EAW3H4B,GAAmB;AAAA,IAAA,IAACX,MAAG;AAAA,aAAEvC,EAAMuC;AAAAA,IAAG;AAAA,IAAEY,SAASA,MAAM9C,EAAU,EAAK;AAAA,IAAC,IAAED,SAAM;AAAA,aAAEA,EAAAA;AAAAA,IAAQ;AAAA,EAAA,CAAA,CAAA;AAG5F;AAE8BgD,EAAA,CAAA,OAAA,CAAA;"}
+{"version":3,"file":"imagesListItem.js","sources":["../../../../../src/components/dataDisplay/imagesList/imagesListItem/imagesListItem.tsx"],"sourcesContent":["import { type JSX, Show, children, createEffect, createSignal, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { ImagesListItemModal } from \"./imagesListItemModal\";\nimport { useImagesListContext } from \"../imagesListContext\";\n\nexport interface ImagesListItemProps {\n  class?: string;\n  src: string;\n  rowsHeight?: number;\n  cols: number;\n  rows: number;\n  rounded?: boolean;\n  itemBarPlacement?: \"top\" | \"bottom\" | \"under\";\n  itemBarContent?: JSX.Element;\n  alt?: string;\n}\n\nexport function ImagesListItem(props: ImagesListItemProps): JSX.Element {\n  const merged = mergeProps({ cols: 1, rows: 1, itemBarPlacement: \"bottom\" as const, alt: \"image\" }, props);\n  const [local] = splitProps(merged, [\n    \"class\",\n    \"src\",\n    \"rounded\",\n    \"itemBarContent\",\n    \"cols\",\n    \"rows\",\n    \"itemBarPlacement\",\n    \"alt\",\n  ]);\n  // Read once: markup passed as a prop is created anew on every read, and\n  // during hydration a copy the server never rendered has no DOM node.\n  const itemBar = children(() => local.itemBarContent);\n\n  const ctx = useImagesListContext();\n  const [isOpen, setIsOpen] = createSignal(false);\n\n  // Lock the page's scroll while the viewer is open, and give it back as it was.\n  // (Every item used to set it to \"auto\" when it mounted, undoing another lock.)\n  createEffect(() => {\n    if (!isOpen()) return;\n    const previous = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    onCleanup(() => {\n      document.body.style.overflow = previous;\n    });\n  });\n\n  const style = (): JSX.CSSProperties => ({\n    height: ctx.rowsHeight ? `${ctx.rowsHeight * local.rows}px` : \"\",\n    \"grid-row-end\": `span ${local.rows}`,\n    \"grid-column-end\": `span ${local.cols}`,\n  });\n\n  return (\n    <>\n      <li\n        data-testid=\"images-list-item\"\n        class={cn(\"smwb-gallery__list__item\", local.class, \"smwb-gallery-item\", `smwb-${ctx.variant}`)}\n        onClick={() => setIsOpen(true)}\n        style={style()}\n      >\n        <div class=\"smwb-gallery-item__inner\">\n          <div class=\"smwb-gallery-item__img-wrapper\">\n            <img src={local.src} alt={local.alt || \"image\"} class={cn(\"smwb-gallery-item__img\", { \"smwb-rounded\": local.rounded })} />\n          </div>\n          <Show when={itemBar()}>\n            <div\n              class={cn(\"smwb-gallery-item__bar\", local.class, `smwb-${local.itemBarPlacement}`, { \"smwb-rounded\": local.rounded })}\n            >\n              {itemBar()}\n            </div>\n          </Show>\n        </div>\n      </li>\n      <ImagesListItemModal src={local.src} onClose={() => setIsOpen(false)} isOpen={isOpen()} />\n    </>\n  );\n}\n\nexport default ImagesListItem;\n"],"names":["ImagesListItem","props","merged","mergeProps","cols","rows","itemBarPlacement","alt","local","splitProps","itemBar","children","itemBarContent","ctx","useImagesListContext","isOpen","setIsOpen","createSignal","createEffect","previous","document","body","style","overflow","onCleanup","height","rowsHeight","_el$","_tmpl$2","_el$2","firstChild","_el$3","_el$4","$$click","_$insert","_$createComponent","Show","when","_el$5","_tmpl$","_$effect","_$className","cn","class","rounded","_p$","_v$","variant","_v$2","_v$3","src","_v$4","_v$5","e","t","_$style","a","_$setAttribute","o","i","undefined","ImagesListItemModal","onClose","_$delegateEvents"],"mappings":"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"}

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

@@ -0,0 +1,2 @@
+export { Kanban, KanbanColumn, KanbanCard, default } from "./kanban";
+export type { KanbanProps, KanbanColumnProps, KanbanCardProps } from "./kanban";

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

@@ -0,0 +1,42 @@
+import { type JSX, type ParentProps } from "solid-js";
+import { type Ref } from "../../../primitives/mergeRefs";
+export interface KanbanProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    /**
+     * The narrowest a column gets before the board scrolls sideways: a number of
+     * pixels or any CSS length. 15.5rem by default.
+     */
+    columnWidth?: number | string;
+    ref?: Ref<HTMLDivElement>;
+}
+export interface KanbanColumnProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, "title"> {
+    /** The column's name: text or a badge. It names the column for assistive technology. */
+    title: JSX.Element;
+    /** How many cards the column holds (it may show fewer), beside the title. Nothing is shown for null. */
+    count?: number | string | null;
+    /** The column's colour, a stripe along its top: any CSS colour. */
+    accent?: string;
+    /** Shown in place of the cards when there are none, e.g. "Empty". */
+    empty?: JSX.Element;
+    /** Under the cards, e.g. a link to the rest as a list. */
+    footer?: JSX.Element;
+    ref?: Ref<HTMLDivElement>;
+}
+export interface KanbanCardProps extends Omit<JSX.HTMLAttributes<HTMLLIElement>, "title"> {
+    /** The card's title, clamped to `titleLines` lines. */
+    title?: JSX.Element;
+    /** Makes the title a link, and the whole card open it. */
+    href?: string;
+    /** Lines the title is clamped to: 3 by default. */
+    titleLines?: number;
+    ref?: Ref<HTMLLIElement>;
+}
+/** A board: KanbanColumn children side by side, scrolling sideways when they do not fit. */
+export declare function Kanban(props: ParentProps<KanbanProps>): JSX.Element;
+/** A column of the board: its title and count, then its KanbanCard children, or `empty` when it has none. */
+export declare function KanbanColumn(props: ParentProps<KanbanColumnProps>): JSX.Element;
+/**
+ * A card on the board: its title (a link with `href`, and then the whole card
+ * opens it) and the children under it.
+ */
+export declare function KanbanCard(props: ParentProps<KanbanCardProps>): JSX.Element;
+export default Kanban;

package/dist/components/dataDisplay/kanban/kanban.js

@@ -0,0 +1,133 @@
+import { use as g, spread as $, mergeProps as w, insert as r, createComponent as m, effect as K, setAttribute as h, memo as j, template as s } from "solid-js/web";
+import '../../../assets/styles/less/components/kanban/kanban.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
+/* empty css                                                       */
+import { splitProps as k, mergeProps as x, children as b, Show as u, createUniqueId as A } from "solid-js";
+import y from "clsx";
+import { mergeRefs as v } from "../../../primitives/mergeRefs.js";
+var I = /* @__PURE__ */ s("<div data-testid=kanban>"), S = /* @__PURE__ */ s("<span class=smwb-kanban__count>"), W = /* @__PURE__ */ s("<ul class=smwb-kanban__cards role=list>"), q = /* @__PURE__ */ s("<div class=smwb-kanban__column-footer>"), B = /* @__PURE__ */ s("<div data-testid=kanban-column role=group><div class=smwb-kanban__column-header><div class=smwb-kanban__column-title>"), O = /* @__PURE__ */ s("<div class=smwb-kanban__empty>"), R = /* @__PURE__ */ s("<div class=smwb-kanban__card-body>"), U = /* @__PURE__ */ s("<li data-testid=kanban-card>"), z = /* @__PURE__ */ s("<div class=smwb-kanban__card-title>"), D = /* @__PURE__ */ s("<a class=smwb-kanban__card-title>");
+const C = (e) => typeof e == "object" && e ? e : {}, E = (e) => typeof e == "number" ? `${e}px` : e, f = (e) => e != null && e !== !1 && e !== !0 && e !== "";
+function Q(e) {
+  const [t, l] = k(e, ["class", "style", "columnWidth", "children", "ref"]);
+  return (() => {
+    var c = I(), o = v(t.ref);
+    return typeof o == "function" && g(o, c), $(c, w(l, {
+      get class() {
+        return y("smwb-kanban", t.class);
+      },
+      get style() {
+        return {
+          ...C(t.style),
+          "--smwb-kanban-column-width": E(t.columnWidth)
+        };
+      }
+    }), !1, !0), r(c, () => t.children), c;
+  })();
+}
+function T(e) {
+  const [t, l] = k(e, ["class", "style", "title", "count", "accent", "empty", "footer", "children", "ref"]), c = `${A()}-title`, o = b(() => t.children), _ = b(() => t.empty), i = b(() => t.footer), p = () => o.toArray().some(f);
+  return (() => {
+    var n = B(), d = n.firstChild, L = d.firstChild, P = v(t.ref);
+    return typeof P == "function" && g(P, n), h(n, "aria-labelledby", c), $(n, w(l, {
+      get class() {
+        return y("smwb-kanban__column", t.class);
+      },
+      get style() {
+        return {
+          ...C(t.style),
+          "--smwb-kanban-accent": t.accent
+        };
+      }
+    }), !1, !0), h(L, "id", c), r(L, () => t.title), r(d, m(u, {
+      get when() {
+        return j(() => t.count !== void 0)() && t.count !== null;
+      },
+      get children() {
+        var a = S();
+        return r(a, () => t.count), a;
+      }
+    }), null), r(n, m(u, {
+      get when() {
+        return p();
+      },
+      get fallback() {
+        return m(u, {
+          get when() {
+            return f(_());
+          },
+          get children() {
+            var a = O();
+            return r(a, _), a;
+          }
+        });
+      },
+      get children() {
+        var a = W();
+        return r(a, o), a;
+      }
+    }), null), r(n, m(u, {
+      get when() {
+        return f(i());
+      },
+      get children() {
+        var a = q();
+        return r(a, i), a;
+      }
+    }), null), n;
+  })();
+}
+function V(e) {
+  const t = x({
+    titleLines: 3
+  }, e), [l, c] = k(t, ["class", "style", "title", "href", "titleLines", "children", "ref"]), o = b(() => l.title), _ = b(() => l.children);
+  return (() => {
+    var i = U(), p = v(l.ref);
+    return typeof p == "function" && g(p, i), $(i, w(c, {
+      get class() {
+        return y("smwb-kanban__card", {
+          "smwb-kanban__card_link": !!l.href
+        }, l.class);
+      },
+      get style() {
+        return {
+          ...C(l.style),
+          "--smwb-kanban-title-lines": String(l.titleLines)
+        };
+      }
+    }), !1, !0), r(i, m(u, {
+      get when() {
+        return f(o());
+      },
+      get children() {
+        return m(u, {
+          get when() {
+            return l.href;
+          },
+          get fallback() {
+            return (() => {
+              var n = z();
+              return r(n, o), n;
+            })();
+          },
+          children: (n) => (() => {
+            var d = D();
+            return r(d, o), K(() => h(d, "href", n())), d;
+          })()
+        });
+      }
+    }), null), r(i, m(u, {
+      get when() {
+        return f(_());
+      },
+      get children() {
+        var n = R();
+        return r(n, _), n;
+      }
+    }), null), i;
+  })();
+}
+export {
+  Q as Kanban,
+  V as KanbanCard,
+  T as KanbanColumn
+};
+//# sourceMappingURL=kanban.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"kanban.js","sources":["../../../../src/components/dataDisplay/kanban/kanban.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, children, createUniqueId, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface KanbanProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  /**\n   * The narrowest a column gets before the board scrolls sideways: a number of\n   * pixels or any CSS length. 15.5rem by default.\n   */\n  columnWidth?: number | string;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport interface KanbanColumnProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"title\"> {\n  /** The column's name: text or a badge. It names the column for assistive technology. */\n  title: JSX.Element;\n  /** How many cards the column holds (it may show fewer), beside the title. Nothing is shown for null. */\n  count?: number | string | null;\n  /** The column's colour, a stripe along its top: any CSS colour. */\n  accent?: string;\n  /** Shown in place of the cards when there are none, e.g. \"Empty\". */\n  empty?: JSX.Element;\n  /** Under the cards, e.g. a link to the rest as a list. */\n  footer?: JSX.Element;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport interface KanbanCardProps extends Omit<JSX.HTMLAttributes<HTMLLIElement>, \"title\"> {\n  /** The card's title, clamped to `titleLines` lines. */\n  title?: JSX.Element;\n  /** Makes the title a link, and the whole card open it. */\n  href?: string;\n  /** Lines the title is clamped to: 3 by default. */\n  titleLines?: number;\n  ref?: Ref<HTMLLIElement>;\n}\n\ntype Style = JSX.CSSProperties | string | undefined;\n\nconst styleObject = (style: Style): JSX.CSSProperties => (typeof style === \"object\" && style ? style : {});\n\nconst cssLength = (value: number | string | undefined): string | undefined =>\n  typeof value === \"number\" ? `${value}px` : value;\n\nconst present = (value: unknown): boolean =>\n  value !== undefined && value !== null && value !== false && value !== true && value !== \"\";\n\n/** A board: KanbanColumn children side by side, scrolling sideways when they do not fit. */\nexport function Kanban(props: ParentProps<KanbanProps>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"style\", \"columnWidth\", \"children\", \"ref\"]);\n  return (\n    <div\n      data-testid=\"kanban\"\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-kanban\", local.class)}\n      style={{ ...styleObject(local.style), \"--smwb-kanban-column-width\": cssLength(local.columnWidth) }}\n    >\n      {local.children}\n    </div>\n  );\n}\n\n/** A column of the board: its title and count, then its KanbanCard children, or `empty` when it has none. */\nexport function KanbanColumn(props: ParentProps<KanbanColumnProps>): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"class\",\n    \"style\",\n    \"title\",\n    \"count\",\n    \"accent\",\n    \"empty\",\n    \"footer\",\n    \"children\",\n    \"ref\",\n  ]);\n  const titleId = `${createUniqueId()}-title`;\n\n  // Read each slot once: markup passed as a prop is created anew on every read,\n  // and during hydration the copy made for a <Show> test has no server DOM node.\n  const cards = children(() => local.children);\n  const empty = children(() => local.empty);\n  const footer = children(() => local.footer);\n  const hasCards = (): boolean => cards.toArray().some(present);\n\n  return (\n    <div\n      data-testid=\"kanban-column\"\n      role=\"group\"\n      aria-labelledby={titleId}\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-kanban__column\", local.class)}\n      style={{ ...styleObject(local.style), \"--smwb-kanban-accent\": local.accent }}\n    >\n      <div class=\"smwb-kanban__column-header\">\n        <div class=\"smwb-kanban__column-title\" id={titleId}>\n          {local.title}\n        </div>\n        <Show when={local.count !== undefined && local.count !== null}>\n          <span class=\"smwb-kanban__count\">{local.count}</span>\n        </Show>\n      </div>\n      <Show\n        when={hasCards()}\n        fallback={\n          <Show when={present(empty())}>\n            <div class=\"smwb-kanban__empty\">{empty()}</div>\n          </Show>\n        }\n      >\n        <ul class=\"smwb-kanban__cards\" role=\"list\">\n          {cards()}\n        </ul>\n      </Show>\n      <Show when={present(footer())}>\n        <div class=\"smwb-kanban__column-footer\">{footer()}</div>\n      </Show>\n    </div>\n  );\n}\n\n/**\n * A card on the board: its title (a link with `href`, and then the whole card\n * opens it) and the children under it.\n */\nexport function KanbanCard(props: ParentProps<KanbanCardProps>): JSX.Element {\n  const merged = mergeProps({ titleLines: 3 }, props);\n  const [local, rest] = splitProps(merged, [\"class\", \"style\", \"title\", \"href\", \"titleLines\", \"children\", \"ref\"]);\n\n  const title = children(() => local.title);\n  const body = children(() => local.children);\n\n  return (\n    <li\n      data-testid=\"kanban-card\"\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-kanban__card\", { \"smwb-kanban__card_link\": Boolean(local.href) }, local.class)}\n      style={{ ...styleObject(local.style), \"--smwb-kanban-title-lines\": String(local.titleLines) }}\n    >\n      <Show when={present(title())}>\n        <Show when={local.href} fallback={<div class=\"smwb-kanban__card-title\">{title()}</div>}>\n          {(href) => (\n            <a class=\"smwb-kanban__card-title\" href={href()}>\n              {title()}\n            </a>\n          )}\n        </Show>\n      </Show>\n      <Show when={present(body())}>\n        <div class=\"smwb-kanban__card-body\">{body()}</div>\n      </Show>\n    </li>\n  );\n}\n\nexport default Kanban;\n"],"names":["styleObject","style","cssLength","value","present","Kanban","props","local","rest","splitProps","_el$","_tmpl$","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","columnWidth","_$insert","children","KanbanColumn","titleId","createUniqueId","cards","empty","footer","hasCards","toArray","some","_el$2","_tmpl$5","_el$3","firstChild","_el$4","_ref$2","_$setAttribute","accent","title","_$createComponent","Show","when","_$memo","count","undefined","_el$5","_tmpl$2","fallback","_el$8","_tmpl$6","_el$6","_tmpl$3","_el$7","_tmpl$4","KanbanCard","merged","mergeProps","titleLines","body","_el$9","_tmpl$8","_ref$3","Boolean","href","String","_el$1","_tmpl$9","_el$10","_tmpl$0","_$effect","_el$0","_tmpl$7"],"mappings":"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"}

package/dist/components/dataDisplay/lazyImage/lazyImage.js

@@ -1,50 +1,51 @@
-import { insert as o, createComponent as u, memo as $, use as h, spread as k, mergeProps as E, effect as I, className as P, style as R, template as i } from "solid-js/web";
-import '../../../assets/styles/less/components/lazyImage/lazyImage.entry.css';/* empty css                                                             */
-import { mergeProps as S, splitProps as C, createSignal as g, onMount as F, Show as p, onCleanup as O } from "solid-js";
-import x from "clsx";
-import { mergeRefs as L } from "../../../primitives/mergeRefs.js";
-var M = /* @__PURE__ */ i("<span class=smwb-lazy-image__fallback>"), N = /* @__PURE__ */ i("<img>", !0, !1, !1), V = /* @__PURE__ */ i("<span>");
-function G(d) {
+import { insert as l, createComponent as g, use as $, spread as k, mergeProps as E, effect as I, className as P, style as R, template as i } from "solid-js/web";
+import '../../../assets/styles/less/components/lazyImage/lazyImage.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
+/* empty css                                                             */
+import { mergeProps as S, splitProps as C, createSignal as p, onMount as F, children as O, Show as d, onCleanup as x } from "solid-js";
+import L from "clsx";
+import { mergeRefs as M } from "../../../primitives/mergeRefs.js";
+var N = /* @__PURE__ */ i("<span class=smwb-lazy-image__fallback>"), V = /* @__PURE__ */ i("<img>", !0, !1, !1), j = /* @__PURE__ */ i("<span>");
+function J(v) {
   const c = S({
     lazy: !0
-  }, d), [r, v] = C(c, ["src", "alt", "fallback", "lazy", "aspectRatio", "class", "onError", "ref"]), [y, b] = g(!1), [m, f] = g(!c.lazy);
-  let s;
+  }, v), [r, y] = C(c, ["src", "alt", "fallback", "lazy", "aspectRatio", "class", "onError", "ref"]), [b, z] = p(!1), [m, f] = p(!c.lazy);
+  let a;
   F(() => {
-    if (!r.lazy || m() || !s) return;
+    if (!r.lazy || m() || !a) return;
     if (typeof IntersectionObserver > "u") {
       f(!0);
       return;
     }
     const t = new IntersectionObserver((e) => {
-      e.some((a) => a.isIntersecting) && (f(!0), t.disconnect());
+      e.some((s) => s.isIntersecting) && (f(!0), t.disconnect());
     });
-    t.observe(s), O(() => t.disconnect());
+    t.observe(a), x(() => t.disconnect());
   });
-  const z = (t) => {
-    b(!0), r.onError?.(t);
-  }, n = () => y() || !r.src, w = () => m() ? r.src : void 0, _ = () => r.aspectRatio != null ? {
+  const w = (t) => {
+    z(!0), r.onError?.(t);
+  }, n = () => b() || !r.src, _ = () => m() ? r.src : void 0, u = O(() => n() ? r.fallback : void 0), h = () => r.aspectRatio != null ? {
     "aspect-ratio": String(r.aspectRatio)
   } : void 0;
   return (() => {
-    var t = V();
-    return o(t, u(p, {
+    var t = j();
+    return l(t, g(d, {
       get when() {
-        return $(() => !!n())() && r.fallback;
+        return u();
       },
       get children() {
-        var e = M();
-        return o(e, () => r.fallback), e;
+        var e = N();
+        return l(e, u), e;
       }
-    }), null), o(t, u(p, {
+    }), null), l(t, g(d, {
       get when() {
         return !n();
       },
       get children() {
-        var e = N(), a = L(r.ref, (l) => s = l);
-        return typeof a == "function" && h(a, e), k(e, E(v, {
+        var e = V(), s = M(r.ref, (o) => a = o);
+        return typeof s == "function" && $(s, e), k(e, E(y, {
           class: "smwb-lazy-image__img",
           get src() {
-            return w();
+            return _();
           },
           get alt() {
             return r.alt ?? "";
@@ -53,14 +54,14 @@ function G(d) {
             return r.lazy ? "lazy" : void 0;
           },
           decoding: "async",
-          onError: z
+          onError: w
         }), !1, !1), e;
       }
     }), null), I((e) => {
-      var a = x("smwb-lazy-image", r.class, {
+      var s = L("smwb-lazy-image", r.class, {
         "smwb-lazy-image--empty": n()
-      }), l = _();
-      return a !== e.e && P(t, e.e = a), e.t = R(t, l, e.t), e;
+      }), o = h();
+      return s !== e.e && P(t, e.e = s), e.t = R(t, o, e.t), e;
     }, {
       e: void 0,
       t: void 0
@@ -68,6 +69,6 @@ function G(d) {
   })();
 }
 export {
-  G as LazyImage
+  J as LazyImage
 };
 //# sourceMappingURL=lazyImage.js.map