@pathscale/ui 0.0.161 → 0.0.163

package/dist/components/checkbox/Checkbox.js

@@ -0,0 +1,78 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import "./checkbox.css";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<input>");
+const Checkbox = (props)=>{
+    let inputRef;
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "color",
+        "size",
+        "indeterminate",
+        "dataTheme",
+        "class",
+        "className",
+        "style",
+        "aria-label",
+        "aria-describedby",
+        "aria-invalid",
+        "aria-required",
+        "aria-labelledby"
+    ]);
+    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("checkbox", local.class, local.className, (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+            "checkbox-xl": "xl" === local.size,
+            "checkbox-lg": "lg" === local.size,
+            "checkbox-md": "md" === local.size,
+            "checkbox-sm": "sm" === local.size,
+            "checkbox-xs": "xs" === local.size,
+            "checkbox-neutral": "neutral" === local.color,
+            "checkbox-primary": "primary" === local.color,
+            "checkbox-secondary": "secondary" === local.color,
+            "checkbox-accent": "accent" === local.color,
+            "checkbox-info": "info" === local.color,
+            "checkbox-success": "success" === local.color,
+            "checkbox-warning": "warning" === local.color,
+            "checkbox-error": "error" === local.color
+        }));
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onMount)(()=>{
+        if (inputRef && void 0 !== local.indeterminate) inputRef.indeterminate = local.indeterminate;
+    });
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createEffect)(()=>{
+        if (inputRef) inputRef.indeterminate = !!local.indeterminate;
+    });
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)((el)=>inputRef = el, _el$);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
+            type: "checkbox",
+            get ["data-theme"] () {
+                return local.dataTheme;
+            },
+            get ["class"] () {
+                return classes();
+            },
+            get style () {
+                return local.style;
+            },
+            get ["aria-label"] () {
+                return local["aria-label"];
+            },
+            get ["aria-describedby"] () {
+                return local["aria-describedby"];
+            },
+            get ["aria-invalid"] () {
+                return local["aria-invalid"];
+            },
+            get ["aria-required"] () {
+                return local["aria-required"];
+            },
+            get ["aria-labelledby"] () {
+                return local["aria-labelledby"];
+            }
+        }), false, false);
+        return _el$;
+    })();
+};
+const checkbox_Checkbox = Checkbox;
+export { checkbox_Checkbox as default };

package/dist/components/checkbox/checkbox.css

@@ -0,0 +1,168 @@
+@layer components {
+  .checkbox {
+      border: var(--border) solid var(--input-color, var(--color-base-content));
+      position: relative;
+      display: inline-block;
+      flex-shrink: 0;
+      cursor: pointer;
+      appearance: none;
+      border-radius: var(--radius-selector);
+      padding: calc(0.25rem * 1);
+      vertical-align: middle;
+      color: var(--color-base-content);
+      box-shadow: 0 1px oklch(0% 0 0 / calc(var(--depth) * 0.1)) inset, 0 0 #0000 inset, 0 0 #0000;
+      transition: background-color 0.2s, box-shadow 0.2s;
+      --size: calc(var(--size-selector, 0.25rem) * 6);
+      width: var(--size);
+      height: var(--size);
+      background-size: auto, calc(var(--noise) * 100%);
+      background-image: none, var(--fx-noise);
+    }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .checkbox {
+      border: var(--border) solid var(--input-color, color-mix(in oklab, var(--color-base-content) 20%, #0000));
+    }
+    }
+
+  .checkbox:before {
+      --tw-content: "";
+      content: var(--tw-content);
+      display: block;
+      width: 100%;
+      height: 100%;
+      rotate: 45deg;
+      background-color: currentcolor;
+      opacity: 0%;
+      transition: clip-path 0.3s, opacity 0.1s, rotate 0.3s, translate 0.3s;
+      transition-delay: 0.1s;
+      clip-path: polygon(20% 100%, 20% 80%, 50% 80%, 50% 80%, 70% 80%, 70% 100%);
+      box-shadow: 0px 3px 0 0px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset;
+      font-size: 1rem;
+      line-height: 0.75;
+    }
+
+  .checkbox:focus-visible {
+      outline: 2px solid var(--input-color, currentColor);
+      outline-offset: 2px;
+    }
+
+  .checkbox:checked,
+    .checkbox[aria-checked="true"] {
+      background-color: var(--input-color, #0000);
+      box-shadow: 0 0 #0000 inset, 0 8px 0 -4px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset, 0 1px oklch(0% 0 0 / calc(var(--depth) * 0.1));
+    }
+
+  .checkbox:checked:before,
+    .checkbox[aria-checked="true"]:before {
+      clip-path: polygon(20% 100%, 20% 80%, 50% 80%, 50% 0%, 70% 0%, 70% 100%);
+      opacity: 100%;
+    }
+
+  @media (forced-colors: active) {
+    .checkbox:checked:before,
+    .checkbox[aria-checked="true"]:before {
+      rotate: 0deg;
+      background-color: transparent;
+      --tw-content: "✔︎";
+      clip-path: none;
+    }
+    }
+
+  @media print {
+    .checkbox:checked:before,
+    .checkbox[aria-checked="true"]:before {
+      rotate: 0deg;
+      background-color: transparent;
+      --tw-content: "✔︎";
+      clip-path: none;
+    }
+    }
+
+  .checkbox:indeterminate {
+      background-color: var( --input-color, var(--color-base-content) );
+    }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .checkbox:indeterminate {
+      background-color: var( --input-color, color-mix(in oklab, var(--color-base-content) 20%, #0000) );
+    }
+    }
+
+  .checkbox:indeterminate:before {
+      rotate: 0deg;
+      opacity: 100%;
+      translate: 0 -35%;
+      clip-path: polygon(20% 100%, 20% 80%, 50% 80%, 50% 80%, 80% 80%, 80% 100%);
+    }
+
+  .checkbox:disabled {
+      cursor: not-allowed;
+      opacity: 20%;
+    }
+
+  .checkbox-lg {
+      padding: 0.3125rem;
+      --size: calc(var(--size-selector, 0.25rem) * 7);
+    }
+
+  .checkbox-md {
+      padding: 0.25rem;
+      --size: calc(var(--size-selector, 0.25rem) * 6);
+    }
+
+  .checkbox-sm {
+      padding: 0.1875rem;
+      --size: calc(var(--size-selector, 0.25rem) * 5);
+    }
+
+  .checkbox-xl {
+      padding: 0.375rem;
+      --size: calc(var(--size-selector, 0.25rem) * 8);
+    }
+
+  .checkbox-xs {
+      padding: 0.125rem;
+      --size: calc(var(--size-selector, 0.25rem) * 4);
+    }
+
+  .checkbox-accent {
+      color: var(--color-accent-content);
+      --input-color: var(--color-accent);
+    }
+
+  .checkbox-error {
+      color: var(--color-error-content);
+      --input-color: var(--color-error);
+    }
+
+  .checkbox-info {
+      color: var(--color-info-content);
+      --input-color: var(--color-info);
+    }
+
+  .checkbox-neutral {
+      color: var(--color-neutral-content);
+      --input-color: var(--color-neutral);
+    }
+
+  .checkbox-primary {
+      color: var(--color-primary-content);
+      --input-color: var(--color-primary);
+    }
+
+  .checkbox-secondary {
+      color: var(--color-secondary-content);
+      --input-color: var(--color-secondary);
+    }
+
+  .checkbox-success {
+      color: var(--color-success-content);
+      --input-color: var(--color-success);
+    }
+
+  .checkbox-warning {
+      color: var(--color-warning-content);
+      --input-color: var(--color-warning);
+    }
+}

package/dist/components/checkbox/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__Checkbox_js_a7cc257b__ from "./Checkbox.js";
+var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__Checkbox_js_a7cc257b__["default"];
+export { __webpack_exports__default as default };

package/dist/components/codemockup/CodeMockup.js

@@ -0,0 +1,33 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+const CodeMockup = (props)=>{
+    const [local, rest] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "class",
+        "className",
+        "children",
+        "dataTheme",
+        "aria-label"
+    ]);
+    const resolvedChildren = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.children)(()=>local.children);
+    const classes = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("mockup-code w-full", local.class, local.className));
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get ["class"] () {
+                return classes();
+            },
+            get ["data-theme"] () {
+                return local.dataTheme;
+            },
+            get ["aria-label"] () {
+                return local["aria-label"] || "Code mockup";
+            }
+        }, rest), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, resolvedChildren);
+        return _el$;
+    })();
+};
+const codemockup_CodeMockup = CodeMockup;
+export { codemockup_CodeMockup as default };

package/dist/components/codemockup/CodeMockupLine.js

@@ -0,0 +1,53 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<pre><code>");
+const CodeMockupLine_CodeMockupLine = (props)=>{
+    const merged = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.mergeProps)({
+        dataPrefix: ">",
+        status: null,
+        class: ""
+    }, props);
+    const [local, rest] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(merged, [
+        "dataPrefix",
+        "status",
+        "innerProps",
+        "innerRef",
+        "class",
+        "children",
+        "dataTheme"
+    ]);
+    const statusClass = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)((0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])({
+            "bg-info": "info" === local.status,
+            "bg-success": "success" === local.status,
+            "bg-warning": "warning" === local.status,
+            "bg-error": "error" === local.status,
+            "text-info-content": "info" === local.status,
+            "text-success-content": "success" === local.status,
+            "text-warning-content": "warning" === local.status,
+            "text-error-content": "error" === local.status
+        }), local.class);
+    const prefix = ()=>false !== local.dataPrefix ? local.dataPrefix || ">" : void 0;
+    return (()=>{
+        var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get ["class"] () {
+                return statusClass();
+            },
+            get ["data-prefix"] () {
+                return prefix();
+            },
+            get ["data-theme"] () {
+                return local.dataTheme;
+            }
+        }, rest), false, true);
+        var _ref$ = local.innerRef;
+        "function" == typeof _ref$ ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$, _el$2) : local.innerRef = _el$2;
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>local.innerProps), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>local.children);
+        return _el$;
+    })();
+};
+const CodeMockupLine = CodeMockupLine_CodeMockupLine;
+export { CodeMockupLine as default };

package/dist/components/codemockup/index.js

@@ -0,0 +1,5 @@
+import * as __WEBPACK_EXTERNAL_MODULE__CodeMockup_js_bbe70a29__ from "./CodeMockup.js";
+import * as __WEBPACK_EXTERNAL_MODULE__CodeMockupLine_js_c17af207__ from "./CodeMockupLine.js";
+var __webpack_exports__CodeMockup = __WEBPACK_EXTERNAL_MODULE__CodeMockup_js_bbe70a29__["default"];
+var __webpack_exports__CodeMockupLine = __WEBPACK_EXTERNAL_MODULE__CodeMockupLine_js_c17af207__["default"];
+export { __webpack_exports__CodeMockup as CodeMockup, __webpack_exports__CodeMockupLine as CodeMockupLine };

package/dist/components/collapse/Collapse.d.ts

@@ -1,3 +1,4 @@
+import "./collapse.css";
 import { type JSX } from "solid-js";
 import type { IComponentBaseProps } from "../types";
 import CollapseDetails from "./CollapseDetails";

package/dist/components/collapse/Collapse.js

@@ -0,0 +1,104 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import "./collapse.css";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+import * as __WEBPACK_EXTERNAL_MODULE__CollapseDetails_js_6c8028ea__ from "./CollapseDetails.js";
+import * as __WEBPACK_EXTERNAL_MODULE__CollapseTitle_js_e4e27ece__ from "./CollapseTitle.js";
+import * as __WEBPACK_EXTERNAL_MODULE__CollapseContent_js_2eec9312__ from "./CollapseContent.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>"), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<input type=checkbox class=peer>");
+const classesFn = ({ className, icon, open })=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("collapse", className, (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+        "collapse-arrow": "arrow" === icon,
+        "collapse-plus": "plus" === icon,
+        "collapse-open": true === open,
+        "collapse-close": false === open
+    }));
+const Collapse = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "children",
+        "checkbox",
+        "icon",
+        "open",
+        "onOpen",
+        "onClose",
+        "onToggle",
+        "dataTheme",
+        "class",
+        "className",
+        "style"
+    ]);
+    const [internalOpen, setInternalOpen] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
+    const isControlled = void 0 !== local.open;
+    const isChecked = ()=>isControlled ? local.open : internalOpen();
+    const handleCheckboxChange = ()=>{
+        if (local.onToggle) local.onToggle();
+        if (isControlled) {
+            if (local.open && local.onClose) local.onClose();
+            if (!local.open && local.onOpen) local.onOpen();
+        } else {
+            const next = !internalOpen();
+            setInternalOpen(next);
+            if (next && local.onOpen) local.onOpen();
+            if (!next && local.onClose) local.onClose();
+        }
+    };
+    const handleBlur = (e)=>{
+        if (!local.checkbox) {
+            local.onToggle?.();
+            local.onClose?.();
+        }
+        if ("function" == typeof others.onBlur) others.onBlur(e);
+    };
+    const handleFocus = (e)=>{
+        if (!local.checkbox) {
+            local.onToggle?.();
+            local.onOpen?.();
+        }
+        if ("function" == typeof others.onFocus) others.onFocus(e);
+    };
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get ["aria-expanded"] () {
+                return local.open;
+            }
+        }, others, {
+            get ["data-theme"] () {
+                return local.dataTheme;
+            },
+            get ["class"] () {
+                return classesFn({
+                    className: (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(local.class, local.className),
+                    icon: local.icon,
+                    open: local.open
+                });
+            },
+            get style () {
+                return local.style;
+            },
+            get tabIndex () {
+                return local.checkbox || isChecked() ? void 0 : 0;
+            },
+            onBlur: handleBlur,
+            onFocus: handleFocus
+        }), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$ = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.checkbox);
+            return ()=>_c$() && (()=>{
+                    var _el$2 = _tmpl$2();
+                    _el$2.addEventListener("change", handleCheckboxChange);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)((el)=>el, _el$2);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$2, "tabindex", isChecked() ? 0 : void 0));
+                    return _el$2;
+                })();
+        })(), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>local.children, null);
+        return _el$;
+    })();
+};
+const collapse_Collapse = Object.assign(Collapse, {
+    Details: __WEBPACK_EXTERNAL_MODULE__CollapseDetails_js_6c8028ea__["default"],
+    Title: __WEBPACK_EXTERNAL_MODULE__CollapseTitle_js_e4e27ece__.CollapseTitle,
+    Content: __WEBPACK_EXTERNAL_MODULE__CollapseContent_js_2eec9312__["default"]
+});
+export { classesFn, collapse_Collapse as default };

package/dist/components/collapse/CollapseContent.js

@@ -0,0 +1,15 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+function CollapseContent(props) {
+    const classes = (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("collapse-content", props.class);
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(props, {
+            "data-collapse-part": "content",
+            class: classes
+        }), false, false);
+        return _el$;
+    })();
+}
+export { CollapseContent as default };

package/dist/components/collapse/CollapseDetails.js

@@ -0,0 +1,33 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+import * as __WEBPACK_EXTERNAL_MODULE__CollapseTitle_js_e4e27ece__ from "./CollapseTitle.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<details>");
+function classesFn({ className, icon, open }) {
+    return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("collapse", className, (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+        "collapse-arrow": "arrow" === icon,
+        "collapse-plus": "plus" === icon,
+        "collapse-open": true === open,
+        "collapse-close": false === open
+    }));
+}
+function CollapseDetails(props) {
+    const classes = classesFn({
+        className: props.class,
+        icon: props.icon,
+        open: props.open
+    });
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(props, {
+            class: classes,
+            get open () {
+                return props.open;
+            }
+        }), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>props.children);
+        return _el$;
+    })();
+}
+CollapseDetails.Title = __WEBPACK_EXTERNAL_MODULE__CollapseTitle_js_e4e27ece__.Summary;
+export { classesFn, CollapseDetails as default };

package/dist/components/collapse/CollapseTitle.js

@@ -0,0 +1,47 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>"), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<summary>");
+const TITLE_PART = "title";
+const classesFn = ({ className })=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("collapse-title", className);
+function CollapseTitle(props) {
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "class",
+        "onClick"
+    ]);
+    const handleClick = (event)=>{
+        const titleNode = event.currentTarget;
+        const root = titleNode.closest(".collapse");
+        const toggleInput = root?.querySelector(':scope > input[type="checkbox"], :scope > input[type="radio"]');
+        if (toggleInput) toggleInput.click();
+        if ("function" == typeof local.onClick) local.onClick(event);
+    };
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
+            "data-collapse-part": TITLE_PART,
+            get ["class"] () {
+                return classesFn({
+                    className: local.class
+                });
+            },
+            onClick: handleClick
+        }), false, false);
+        return _el$;
+    })();
+}
+function Summary(props) {
+    return (()=>{
+        var _el$2 = _tmpl$2();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(props, {
+            "data-collapse-part": TITLE_PART,
+            get ["class"] () {
+                return classesFn({
+                    className: props.class
+                });
+            }
+        }), false, false);
+        return _el$2;
+    })();
+}
+export { CollapseTitle, Summary, classesFn };