@pathscale/ui 0.0.11 → 0.0.13

package/dist/chunk/T7IZ26YC.jsx

@@ -1,194 +0,0 @@
-import {
-  cva
-} from "./P7WPLZNA.jsx";
-
-// src/components/checkbox/Checkbox.tsx
-import {
-  splitProps,
-  createSignal,
-  Show,
-  untrack,
-  createEffect
-} from "solid-js";
-
-// src/components/checkbox/Checkbox.styles.ts
-var checkboxVariants = cva(
-  [
-    "relative inline-flex items-center gap-2 select-none",
-    "cursor-pointer disabled:cursor-default peer-disabled:cursor-default",
-    "peer-disabled:opacity-50"
-  ],
-  {
-    variants: {
-      size: {
-        sm: "text-sm",
-        md: "text-base",
-        lg: "text-lg"
-      },
-      color: {
-        primary: "text-blue-600",
-        success: "text-green-600",
-        warning: "text-yellow-600",
-        danger: "text-red-600"
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      color: "primary"
-    }
-  }
-);
-var checkboxMarkerVariants = cva(
-  [
-    "inline-flex items-center justify-center rounded-sm border",
-    "transition-colors duration-200",
-    "peer-disabled:opacity-50"
-  ],
-  {
-    variants: {
-      size: {
-        sm: "w-4 h-4 text-sm",
-        md: "w-5 h-5 text-base",
-        lg: "w-6 h-6 text-lg"
-      },
-      color: {
-        primary: "bg-blue-600 border-blue-600",
-        success: "bg-green-600 border-green-600",
-        warning: "bg-yellow-400 border-yellow-400",
-        danger: "bg-red-600 border-red-600"
-      },
-      variant: {
-        colored: "text-white",
-        default: "border-gray-400 text-gray-800 dark:text-gray-200 bg-transparent"
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      variant: "default"
-    }
-  }
-);
-var checkboxInputClass = "peer absolute opacity-0 w-4 h-4";
-var checkboxLabelClass = "ml-2 text-gray-800 dark:text-gray-200";
-
-// src/components/checkbox/CheckIcon.tsx
-import "solid-js";
-var CheckIcon = () => <svg
-  viewBox="0 0 24 24"
-  fill="none"
-  stroke="currentColor"
-  stroke-width="3"
-  stroke-linecap="round"
-  stroke-linejoin="round"
-  class="w-3.5 h-3.5"
->
-    <polyline points="20 6 9 17 4 12" />
-  </svg>;
-var CheckIcon_default = CheckIcon;
-
-// src/components/checkbox/MinusIcon.tsx
-import "solid-js";
-var MinusIcon = () => <svg
-  viewBox="0 0 24 24"
-  fill="none"
-  stroke="currentColor"
-  stroke-width="3"
-  stroke-linecap="round"
-  stroke-linejoin="round"
-  class="w-3.5 h-3.5"
->
-    <line x1="5" y1="12" x2="19" y2="12" />
-  </svg>;
-var MinusIcon_default = MinusIcon;
-
-// src/components/checkbox/Checkbox.tsx
-var Checkbox = (props) => {
-  const [localProps, variantProps, otherProps] = splitProps(
-    props,
-    [
-      "label",
-      "indeterminate",
-      "defaultChecked",
-      "checked",
-      "onChange",
-      "onFocus",
-      "onBlur",
-      "disabled"
-    ],
-    ["class", ...checkboxVariants.variantKeys]
-  );
-  let inputRef;
-  const isControlled = localProps.checked !== void 0;
-  const [status, setStatus] = createSignal(
-    localProps.indeterminate ? "indeterminate" : isControlled ? localProps.checked ? "checked" : "unchecked" : localProps.defaultChecked ? "checked" : "unchecked"
-  );
-  createEffect(() => {
-    if (isControlled) {
-      setStatus(
-        localProps.indeterminate ? "indeterminate" : localProps.checked ? "checked" : "unchecked"
-      );
-    }
-  });
-  const handleChange = (e) => {
-    const input = e.currentTarget;
-    if (input.indeterminate) {
-      input.indeterminate = false;
-      input.checked = true;
-      setStatus("checked");
-    } else {
-      setStatus(input.checked ? "checked" : "unchecked");
-    }
-    untrack(() => {
-      if (typeof localProps.onChange === "function") {
-        localProps.onChange(e);
-      }
-    });
-  };
-  return <label
-    class={checkboxVariants()}
-    role="checkbox"
-    aria-checked={status() === "indeterminate" ? "mixed" : status() === "checked"}
-  >
-      <input
-    ref={(el) => {
-      inputRef = el;
-      if (status() === "indeterminate") {
-        el.indeterminate = true;
-      }
-    }}
-    type="checkbox"
-    class={checkboxInputClass}
-    checked={status() === "checked"}
-    disabled={localProps.disabled}
-    aria-hidden="true"
-    {...otherProps}
-    onChange={handleChange}
-    onFocus={localProps.onFocus}
-    onBlur={localProps.onBlur}
-  />
-
-      <span
-    class={checkboxMarkerVariants({
-      size: variantProps.size,
-      color: status() !== "unchecked" ? variantProps.color : void 0,
-      variant: status() !== "unchecked" ? "colored" : "default"
-    })}
-  >
-        <Show when={status() !== "unchecked"}>
-          {status() === "indeterminate" ? <MinusIcon_default /> : <CheckIcon_default />}
-        </Show>
-      </span>
-
-      <Show when={localProps.label}>
-        <span class={checkboxLabelClass}>{localProps.label}</span>
-      </Show>
-    </label>;
-};
-var Checkbox_default = Checkbox;
-
-// src/components/checkbox/index.ts
-var checkbox_default = Checkbox_default;
-
-export {
-  checkbox_default
-};

package/dist/chunk/TT2JYGLU.js

@@ -1,218 +0,0 @@
-import { cva, classes } from './HKS7ET6T.js';
-import { delegateEvents, template, spread, mergeProps, insert, createComponent, effect, className } from 'solid-js/web';
-import { splitProps, createSignal, createMemo, For, Show } from 'solid-js';
-
-// src/components/steps/Steps.styles.ts
-var stepsContainer = cva("flex flex-col", {
-  variants: {
-    animated: {
-      true: "transition-all duration-300 ease-in-out",
-      false: ""
-    }
-  },
-  defaultVariants: { animated: false }
-});
-var navBar = cva("flex items-center justify-between mb-6");
-var navItem = cva(
-  "relative flex-1 flex flex-col items-center",
-  {
-    variants: {
-      clickable: {
-        true: "cursor-pointer",
-        false: "pointer-events-none"
-      },
-      disabled: {
-        true: "opacity-50 pointer-events-none",
-        false: ""
-      }
-    },
-    defaultVariants: { clickable: false, disabled: false }
-  }
-);
-var marker = cva(
-  "w-8 h-8 flex items-center justify-center rounded-full border-2",
-  {
-    variants: {
-      active: {
-        true: "bg-blue-500 border-blue-500 text-white",
-        false: "bg-white border-gray-300 text-gray-600"
-      }
-    },
-    defaultVariants: { active: false }
-  }
-);
-var line = cva("absolute top-1/2 left-full w-full h-0.5", {
-  variants: {
-    active: {
-      true: "bg-blue-500",
-      false: "bg-gray-300"
-    }
-  },
-  defaultVariants: { active: false }
-});
-var title = cva("mt-2 text-sm", {
-  variants: {
-    active: {
-      true: "text-blue-600 font-medium",
-      false: "text-gray-600"
-    }
-  },
-  defaultVariants: { active: false }
-});
-var subtitle = cva("text-xs mt-1", {
-  variants: {
-    color: {
-      default: "text-blue-500",
-      muted: "text-gray-500",
-      accent: "text-green-500"
-    }
-  },
-  defaultVariants: { color: "default" }
-});
-var buttonSteps = cva("px-4 py-2 bg-blue-600 text-white rounded");
-
-// src/components/steps/Steps.tsx
-var _tmpl$ = /* @__PURE__ */ template(`<div><nav></nav><div>`);
-var _tmpl$2 = /* @__PURE__ */ template(`<div>`);
-var _tmpl$3 = /* @__PURE__ */ template(`<div><div></div><div>`);
-var _tmpl$4 = /* @__PURE__ */ template(`<button type=button class="px-4 py-2 border rounded">Back`);
-var _tmpl$5 = /* @__PURE__ */ template(`<button type=button>Next`);
-var _tmpl$6 = /* @__PURE__ */ template(`<button type=button class="px-4 py-2 bg-green-600 text-white rounded">Restart`);
-var _tmpl$7 = /* @__PURE__ */ template(`<div><div class="flex justify-end gap-2 mt-6">`);
-var Steps = (props) => {
-  const [local, variantProps, otherProps] = splitProps(props, ["steps", "animated", "initial", "value", "onStepChange", "className"], ["animated"]);
-  const isControlled = () => local.value !== void 0;
-  const [internalIndex, setInternalIndex] = createSignal(local.initial ?? 0);
-  const activeIndex = createMemo(() => isControlled() ? local.value : internalIndex());
-  const clamp = (i) => Math.max(0, Math.min(i, local.steps.length - 1));
-  const changeIndex = (i) => {
-    const idx = clamp(i);
-    if (isControlled()) local.onStepChange?.(idx);
-    else setInternalIndex(idx);
-  };
-  const next = () => changeIndex(activeIndex() + 1);
-  const back = () => changeIndex(activeIndex() - 1);
-  const isActive = (i) => i === activeIndex();
-  const isPast = (i) => i < activeIndex();
-  return (() => {
-    var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling;
-    spread(_el$, mergeProps({
-      get ["class"]() {
-        return classes(stepsContainer({
-          animated: local.animated
-        }), local.className);
-      }
-    }, otherProps), false, true);
-    insert(_el$2, createComponent(For, {
-      get each() {
-        return local.steps;
-      },
-      children: (step, idx) => {
-        const i = idx();
-        return (() => {
-          var _el$4 = _tmpl$3(), _el$5 = _el$4.firstChild, _el$7 = _el$5.nextSibling;
-          _el$4.$$click = () => step.clickable && changeIndex(i);
-          insert(_el$5, () => step.marker ?? String(i + 1));
-          insert(_el$4, createComponent(Show, {
-            get when() {
-              return i < local.steps.length - 1;
-            },
-            get children() {
-              var _el$6 = _tmpl$2();
-              effect(() => className(_el$6, line({
-                active: isPast(i)
-              })));
-              return _el$6;
-            }
-          }), _el$7);
-          insert(_el$7, () => step.title);
-          insert(_el$4, createComponent(Show, {
-            get when() {
-              return step.subtitle;
-            },
-            get children() {
-              var _el$8 = _tmpl$2();
-              insert(_el$8, () => step.subtitle);
-              effect(() => className(_el$8, subtitle()));
-              return _el$8;
-            }
-          }), null);
-          effect((_p$) => {
-            var _v$ = navItem({
-              clickable: !!step.clickable
-            }), _v$2 = marker({
-              active: isActive(i) || isPast(i)
-            }), _v$3 = title({
-              active: isActive(i) || isPast(i)
-            });
-            _v$ !== _p$.e && className(_el$4, _p$.e = _v$);
-            _v$2 !== _p$.t && className(_el$5, _p$.t = _v$2);
-            _v$3 !== _p$.a && className(_el$7, _p$.a = _v$3);
-            return _p$;
-          }, {
-            e: void 0,
-            t: void 0,
-            a: void 0
-          });
-          return _el$4;
-        })();
-      }
-    }));
-    insert(_el$3, createComponent(For, {
-      get each() {
-        return local.steps;
-      },
-      children: (step, idx) => {
-        const i = idx();
-        return createComponent(Show, {
-          get when() {
-            return isActive(i);
-          },
-          get children() {
-            var _el$9 = _tmpl$7(), _el$0 = _el$9.firstChild;
-            insert(_el$9, () => step.content, _el$0);
-            insert(_el$0, createComponent(Show, {
-              when: i > 0,
-              get children() {
-                var _el$1 = _tmpl$4();
-                _el$1.$$click = back;
-                return _el$1;
-              }
-            }), null);
-            insert(_el$0, createComponent(Show, {
-              get when() {
-                return i < local.steps.length - 1;
-              },
-              get children() {
-                var _el$10 = _tmpl$5();
-                _el$10.$$click = next;
-                effect(() => className(_el$10, buttonSteps()));
-                return _el$10;
-              }
-            }), null);
-            insert(_el$0, createComponent(Show, {
-              get when() {
-                return i === local.steps.length - 1;
-              },
-              get children() {
-                var _el$11 = _tmpl$6();
-                _el$11.$$click = () => changeIndex(0);
-                return _el$11;
-              }
-            }), null);
-            return _el$9;
-          }
-        });
-      }
-    }));
-    effect(() => className(_el$2, navBar()));
-    return _el$;
-  })();
-};
-var Steps_default = Steps;
-delegateEvents(["click"]);
-
-// src/components/steps/index.ts
-var steps_default = Steps_default;
-
-export { steps_default };

package/dist/chunk/V6Y5E7BL.js

@@ -1,133 +0,0 @@
-import { cva } from './HKS7ET6T.js';
-import { template, insert, effect, setAttribute, spread, mergeProps, memo, className } from 'solid-js/web';
-import { splitProps, children, createMemo, untrack } from 'solid-js';
-
-// src/components/breadcrumb/Breadcrumb.styles.ts
-var breadcrumbContainerVariants = cva(
-  ["flex", "items-center", "gap-2", "text-sm"],
-  {
-    variants: {
-      alignment: {
-        left: "justify-start",
-        center: "justify-center",
-        right: "justify-end"
-      },
-      size: {
-        sm: "text-xs gap-1",
-        md: "text-sm gap-2",
-        lg: "text-base gap-3"
-      },
-      separator: {
-        arrow: "breadcrumb-arrow",
-        dot: "breadcrumb-dot",
-        bullet: "breadcrumb-bullet",
-        succeeds: "breadcrumb-succeeds"
-      }
-    },
-    defaultVariants: {
-      alignment: "left",
-      size: "md"
-    }
-  }
-);
-var breadcrumbItemVariants = cva(
-  ["text-gray-600", "dark:text-gray-300"],
-  {
-    variants: {
-      active: {
-        true: "text-blue-600 font-semibold cursor-default",
-        false: "hover:underline"
-      }
-    },
-    defaultVariants: {
-      active: false
-    }
-  }
-);
-
-// src/components/breadcrumb/Breadcrumb.tsx
-var _tmpl$ = /* @__PURE__ */ template(`<li class="text-gray-400 select-none"aria-hidden=true>`);
-var _tmpl$2 = /* @__PURE__ */ template(`<li><span>`);
-var _tmpl$3 = /* @__PURE__ */ template(`<nav aria-label=Breadcrumb><ol class="flex items-center flex-wrap gap-1">`);
-var separatorMap = {
-  arrow: "\u2192",
-  dot: "\xB7",
-  bullet: "\u2022",
-  succeeds: "\xBB"
-};
-var Breadcrumb = (props) => {
-  const [local, variantProps, otherProps] = splitProps(props, ["children"], ["alignment", "size", "separator"]);
-  const resolvedChildren = children(() => local.children);
-  const items = createMemo(() => resolvedChildren.toArray());
-  const separator = createMemo(() => untrack(() => {
-    const sep = variantProps.separator;
-    return sep && separatorMap[sep] ? separatorMap[sep] : "/";
-  }));
-  const containerClasses = createMemo(() => breadcrumbContainerVariants(variantProps));
-  const renderItems = createMemo(() => {
-    return items().reduce((acc, item, idx) => {
-      if (idx > 0) {
-        acc.push((() => {
-          var _el$ = _tmpl$();
-          insert(_el$, separator);
-          return _el$;
-        })());
-      }
-      acc.push((() => {
-        var _el$2 = _tmpl$2(), _el$3 = _el$2.firstChild;
-        insert(_el$3, item);
-        effect(() => setAttribute(_el$3, "aria-current", idx === items().length - 1 ? "page" : void 0));
-        return _el$2;
-      })());
-      return acc;
-    }, []);
-  });
-  return (() => {
-    var _el$4 = _tmpl$3(), _el$5 = _el$4.firstChild;
-    spread(_el$4, mergeProps({
-      get ["class"]() {
-        return containerClasses();
-      }
-    }, otherProps), false, true);
-    insert(_el$5, renderItems);
-    return _el$4;
-  })();
-};
-var Breadcrumb_default = Breadcrumb;
-var _tmpl$4 = /* @__PURE__ */ template(`<li class="flex items-center gap-1">`);
-var _tmpl$22 = /* @__PURE__ */ template(`<a>`);
-var _tmpl$32 = /* @__PURE__ */ template(`<span>`);
-var BreadcrumbItem = (props) => {
-  const [local, variantProps] = splitProps(props, ["children", "href", "active"], ["active"]);
-  return (() => {
-    var _el$ = _tmpl$4();
-    insert(_el$, (() => {
-      var _c$ = memo(() => !!(local.href && !local.active));
-      return () => _c$() ? (() => {
-        var _el$2 = _tmpl$22();
-        insert(_el$2, () => local.children);
-        effect((_p$) => {
-          var _v$ = local.href, _v$2 = breadcrumbItemVariants(variantProps);
-          _v$ !== _p$.e && setAttribute(_el$2, "href", _p$.e = _v$);
-          _v$2 !== _p$.t && className(_el$2, _p$.t = _v$2);
-          return _p$;
-        }, {
-          e: void 0,
-          t: void 0
-        });
-        return _el$2;
-      })() : (() => {
-        var _el$3 = _tmpl$32();
-        insert(_el$3, () => local.children);
-        effect(() => className(_el$3, breadcrumbItemVariants({
-          active: true
-        })));
-        return _el$3;
-      })();
-    })());
-    return _el$;
-  })();
-};
-var BreadcrumbItem_default = BreadcrumbItem;
-
-export { BreadcrumbItem_default, Breadcrumb_default };

package/dist/chunk/WB6NEEQV.jsx

@@ -1,107 +0,0 @@
-import {
-  classes,
-  cva
-} from "./P7WPLZNA.jsx";
-
-// src/components/textarea/Textarea.tsx
-import {
-  createMemo,
-  createSignal,
-  splitProps,
-  Show
-} from "solid-js";
-
-// src/components/textarea/Textarea.styles.ts
-var textareaVariants = cva(
-  [
-    "block w-full rounded-md border bg-white px-3 py-2 text-sm",
-    "text-gray-900 placeholder-gray-400",
-    "focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent",
-    "disabled:opacity-50 disabled:cursor-not-allowed"
-  ],
-  {
-    variants: {
-      size: {
-        sm: "text-sm py-1.5",
-        md: "text-base py-2",
-        lg: "text-lg py-3"
-      },
-      color: {
-        primary: "border-blue-500",
-        info: "border-cyan-500",
-        success: "border-green-500",
-        warning: "border-yellow-500",
-        danger: "border-red-500"
-      },
-      loading: {
-        true: "opacity-50 cursor-wait",
-        false: ""
-      },
-      resize: {
-        none: "resize-none",
-        both: "resize",
-        x: "resize-x",
-        y: "resize-y"
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      color: "primary",
-      loading: false,
-      resize: "y"
-    }
-  }
-);
-
-// src/components/textarea/Textarea.tsx
-var Textarea = (props) => {
-  const [localProps, variantProps, otherProps] = splitProps(
-    props,
-    ["hasCounter", "value", "onInput", "onFocus", "onBlur", "maxLength"],
-    ["class", ...textareaVariants.variantKeys]
-  );
-  const [isFocused, setFocused] = createSignal(false);
-  const valueLength = createMemo(
-    () => typeof localProps.value === "string" ? localProps.value.length : 0
-  );
-  const showCounter = createMemo(
-    () => localProps.maxLength && localProps.hasCounter
-  );
-  return <div class="relative w-full">
-      <textarea
-    class={textareaVariants(variantProps)}
-    value={localProps.value}
-    maxLength={localProps.maxLength}
-    onInput={localProps.onInput}
-    onFocus={(e) => {
-      setFocused(true);
-      typeof localProps.onFocus === "function" && localProps.onFocus(e);
-    }}
-    onBlur={(e) => {
-      setFocused(false);
-      typeof localProps.onBlur === "function" && localProps.onBlur(e);
-    }}
-    aria-invalid={variantProps.color === "danger" ? "true" : void 0}
-    {...otherProps}
-  />
-
-      <Show when={showCounter()}>
-        <small
-    class={classes(
-      "absolute bottom-1 right-2 text-xs text-gray-500 transition-opacity",
-      isFocused() ? "opacity-100" : "opacity-0"
-    )}
-  >
-          {valueLength()} / {localProps.maxLength}
-        </small>
-      </Show>
-    </div>;
-};
-var Textarea_default = Textarea;
-
-// src/components/textarea/index.ts
-var textarea_default = Textarea_default;
-
-export {
-  textarea_default
-};