@bricks-toolkit/toolkit 0.1.19 → 0.1.20

package/dist/chunk-7WNJ7L4Z.mjs

@@ -1,335 +0,0 @@
-import { cn } from './chunk-OCPFOFJ4.mjs';
-import { forwardRef, useId } from 'react';
-import { XMarkIcon } from '@heroicons/react/24/outline';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-var sizeClasses = {
-  xs: "h-6 px-2 text-xs",
-  sm: "h-8 px-3 text-sm",
-  md: "h-10 px-3 text-sm",
-  lg: "h-11 px-4 text-base",
-  xl: "h-12 px-4 text-lg"
-};
-var labelSizeClasses = {
-  xs: "text-xs",
-  sm: "text-xs",
-  md: "text-sm",
-  lg: "text-sm",
-  xl: "text-base"
-};
-var variantClasses = {
-  default: "rounded-md border border-border bg-surface shadow-sm focus:outline-none focus:ring-2 focus:ring-primary/40 focus:ring-offset-0 transition-all duration-normal",
-  filled: "rounded-md border border-transparent bg-surface-secondary focus:bg-surface focus:outline-none focus:ring-2 focus:ring-primary/40 focus:ring-offset-0 transition-all duration-normal",
-  flushed: "rounded-none border-0 border-b border-border bg-transparent focus:outline-none focus:ring-0",
-  unstyled: "border-0 bg-transparent p-0 focus:outline-none focus:ring-0"
-};
-var stateVariantClasses = {
-  default: {
-    default: "border-border focus:border-primary focus:ring-primary/40",
-    filled: "focus:border-primary focus:ring-primary/40",
-    flushed: "border-border focus:border-primary",
-    unstyled: ""
-  },
-  error: {
-    default: "border-error focus:border-error focus:ring-error/20",
-    filled: "bg-error/5 focus:border-error focus:ring-error/20",
-    flushed: "border-error focus:border-error",
-    unstyled: ""
-  },
-  success: {
-    default: "border-success focus:border-success focus:ring-success/20",
-    filled: "bg-success/5 focus:border-success focus:ring-success/20",
-    flushed: "border-success focus:border-success",
-    unstyled: ""
-  },
-  warning: {
-    default: "border-warning focus:border-warning focus:ring-warning/20",
-    filled: "bg-warning/5 focus:border-warning focus:ring-warning/20",
-    flushed: "border-warning focus:border-warning",
-    unstyled: ""
-  }
-};
-var stateMessageClasses = {
-  default: "text-text-muted",
-  error: "text-error font-medium",
-  success: "text-success font-medium",
-  warning: "text-warning font-medium"
-};
-var disabledClasses = "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-surface-secondary";
-function getAddonPadding(hasLeft, hasRight, size) {
-  const leftPad = {
-    xs: "pl-6",
-    sm: "pl-8",
-    md: "pl-9",
-    lg: "pl-10",
-    xl: "pl-11"
-  };
-  const rightPad = {
-    xs: "pr-6",
-    sm: "pr-8",
-    md: "pr-9",
-    lg: "pr-10",
-    xl: "pr-11"
-  };
-  const parts = [];
-  if (hasLeft) parts.push(leftPad[size]);
-  if (hasRight) parts.push(rightPad[size]);
-  return parts.join(" ");
-}
-function getStateMessage(state, errorMessage, successMessage, warningMessage) {
-  if (state === "error" && errorMessage) return errorMessage;
-  if (state === "success" && successMessage) return successMessage;
-  if (state === "warning" && warningMessage) return warningMessage;
-  return void 0;
-}
-function AddonIcon({
-  children,
-  side,
-  size,
-  pointerEvents = false
-}) {
-  const iconSizeClasses = {
-    xs: "w-3.5 h-3.5",
-    sm: "w-4 h-4",
-    md: "w-4 h-4",
-    lg: "w-5 h-5",
-    xl: "w-5 h-5"
-  };
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      "aria-hidden": "true",
-      className: cn(
-        "absolute top-1/2 -translate-y-1/2 text-text-secondary flex items-center justify-center",
-        !pointerEvents && "pointer-events-none",
-        side === "left" ? "left-3" : "right-3",
-        iconSizeClasses[size]
-      ),
-      children
-    }
-  );
-}
-function Addon({ children, side }) {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      "aria-hidden": "true",
-      className: cn(
-        "inline-flex items-center border border-border bg-surface-secondary px-3 text-sm text-text-secondary select-none",
-        side === "left" ? "rounded-l-md border-r-0" : "rounded-r-md border-l-0"
-      ),
-      children
-    }
-  );
-}
-var DatePicker = forwardRef(function DatePicker2({
-  label,
-  required = false,
-  helperText,
-  errorMessage,
-  successMessage,
-  warningMessage,
-  variant = "default",
-  size = "md",
-  state = "default",
-  fullWidth = true,
-  leftElement,
-  rightElement,
-  prefix,
-  suffix,
-  wrapperClassName,
-  inputGroupClassName,
-  inputClassName,
-  labelClassName,
-  helperClassName,
-  id: idProp,
-  disabled,
-  className,
-  clearable,
-  isLoading,
-  value,
-  onChange,
-  ...rest
-}, ref) {
-  const generatedId = useId();
-  const inputId = idProp ?? generatedId;
-  const helperId = `${inputId}-helper`;
-  const stateMessageId = `${inputId}-state`;
-  const isValueString = typeof value === "string";
-  const showClear = clearable && isValueString && value.length > 0;
-  const hasLeftElement = leftElement !== void 0;
-  const hasRightElement = rightElement !== void 0 || Boolean(showClear) || Boolean(isLoading);
-  const stateMessage = getStateMessage(state, errorMessage, successMessage, warningMessage);
-  const describedBy = [helperText ? helperId : null, stateMessage ? stateMessageId : null].filter(Boolean).join(" ") || void 0;
-  const handleClear = () => {
-    if (ref && typeof ref !== "function" && ref.current) {
-      const descriptor = Reflect.getOwnPropertyDescriptor(
-        window.HTMLInputElement.prototype,
-        "value"
-      );
-      const nativeInputValueSetter = descriptor?.set;
-      if (nativeInputValueSetter) {
-        Reflect.apply(nativeInputValueSetter, ref.current, [""]);
-      }
-      const event = new Event("input", { bubbles: true });
-      ref.current.dispatchEvent(event);
-    } else if (onChange) {
-      const e = {
-        target: { value: "" },
-        currentTarget: { value: "" },
-        preventDefault: () => {
-        },
-        stopPropagation: () => {
-        }
-      };
-      onChange(e);
-    }
-  };
-  const renderRightIcon = () => {
-    if (isLoading) {
-      return /* @__PURE__ */ jsxs(
-        "svg",
-        {
-          className: "animate-spin h-full w-full text-text-muted",
-          xmlns: "http://www.w3.org/2000/svg",
-          fill: "none",
-          viewBox: "0 0 24 24",
-          children: [
-            /* @__PURE__ */ jsx(
-              "circle",
-              {
-                className: "opacity-25",
-                cx: "12",
-                cy: "12",
-                r: "10",
-                stroke: "currentColor",
-                strokeWidth: "4"
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "path",
-              {
-                className: "opacity-75",
-                fill: "currentColor",
-                d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
-              }
-            )
-          ]
-        }
-      );
-    }
-    if (showClear) {
-      return /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: handleClear,
-          className: "flex items-center justify-center rounded-full text-text-muted hover:text-text hover:bg-hover p-0.5 transition-all duration-fast",
-          "aria-label": "Clear input",
-          children: /* @__PURE__ */ jsx(XMarkIcon, { className: "w-full h-full", strokeWidth: 2.5 })
-        }
-      );
-    }
-    return rightElement;
-  };
-  const inputElement = /* @__PURE__ */ jsx(
-    "input",
-    {
-      ref,
-      id: inputId,
-      disabled: Boolean(disabled) || Boolean(isLoading),
-      type: "date",
-      value,
-      onChange,
-      "aria-invalid": state === "error" ? true : void 0,
-      "aria-describedby": describedBy,
-      "aria-required": required,
-      className: cn(
-        "w-full transition-colors duration-150",
-        sizeClasses[size],
-        variantClasses[variant],
-        stateVariantClasses[state][variant],
-        disabledClasses,
-        getAddonPadding(hasLeftElement, hasRightElement, size),
-        inputClassName
-      ),
-      ...rest
-    }
-  );
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cn(
-        "flex flex-col gap-1",
-        fullWidth ? "w-full" : "w-fit",
-        wrapperClassName,
-        className
-      ),
-      children: [
-        label !== void 0 && /* @__PURE__ */ jsxs(
-          "label",
-          {
-            htmlFor: inputId,
-            className: cn(
-              "font-black leading-none text-text uppercase tracking-widest",
-              labelSizeClasses[size],
-              labelClassName
-            ),
-            children: [
-              label,
-              required && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "ml-1 text-error", children: "*" })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: cn("flex items-stretch", fullWidth ? "w-full" : "w-fit", inputGroupClassName),
-            children: [
-              prefix !== void 0 && /* @__PURE__ */ jsx(Addon, { side: "left", children: prefix }),
-              /* @__PURE__ */ jsxs("div", { className: "relative flex flex-1 items-center", children: [
-                hasLeftElement && /* @__PURE__ */ jsx(AddonIcon, { side: "left", size, children: leftElement }),
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: cn(
-                      "flex-1",
-                      prefix !== void 0 && suffix !== void 0 ? "[&>input]:rounded-none" : prefix !== void 0 ? "[&>input]:rounded-l-none" : suffix !== void 0 ? "[&>input]:rounded-r-none" : ""
-                    ),
-                    children: inputElement
-                  }
-                ),
-                hasRightElement && /* @__PURE__ */ jsx(AddonIcon, { side: "right", size, pointerEvents: !rightElement && Boolean(showClear), children: renderRightIcon() })
-              ] }),
-              suffix !== void 0 && /* @__PURE__ */ jsx(Addon, { side: "right", children: suffix })
-            ]
-          }
-        ),
-        helperText !== void 0 && /* @__PURE__ */ jsx(
-          "p",
-          {
-            id: helperId,
-            className: cn("text-xs leading-tight text-text-muted font-medium", helperClassName),
-            children: helperText
-          }
-        ),
-        stateMessage !== void 0 && /* @__PURE__ */ jsx(
-          "p",
-          {
-            id: stateMessageId,
-            role: state === "error" ? "alert" : void 0,
-            className: cn(
-              "text-xs leading-tight mt-1 font-medium",
-              stateMessageClasses[state],
-              helperClassName
-            ),
-            children: stateMessage
-          }
-        )
-      ]
-    }
-  );
-});
-DatePicker.displayName = "DatePicker";
-
-export { DatePicker };

package/dist/chunk-DHC5LI2P.cjs

@@ -1,338 +0,0 @@
-'use strict';
-
-var chunkL5VQZZVR_cjs = require('./chunk-L5VQZZVR.cjs');
-var react = require('react');
-var outline = require('@heroicons/react/24/outline');
-var jsxRuntime = require('react/jsx-runtime');
-
-var sizeClasses = {
-  xs: "h-6 px-2 text-xs",
-  sm: "h-8 px-3 text-sm",
-  md: "h-10 px-3 text-sm",
-  lg: "h-11 px-4 text-base",
-  xl: "h-12 px-4 text-lg"
-};
-var labelSizeClasses = {
-  xs: "text-xs",
-  sm: "text-xs",
-  md: "text-sm",
-  lg: "text-sm",
-  xl: "text-base"
-};
-var variantClasses = {
-  default: "rounded-md border border-border bg-surface shadow-sm focus:outline-none focus:ring-2 focus:ring-primary/40 focus:ring-offset-0 transition-all duration-normal",
-  filled: "rounded-md border border-transparent bg-surface-secondary focus:bg-surface focus:outline-none focus:ring-2 focus:ring-primary/40 focus:ring-offset-0 transition-all duration-normal",
-  flushed: "rounded-none border-0 border-b border-border bg-transparent focus:outline-none focus:ring-0",
-  unstyled: "border-0 bg-transparent p-0 focus:outline-none focus:ring-0"
-};
-var stateVariantClasses = {
-  default: {
-    default: "border-border focus:border-primary focus:ring-primary/40",
-    filled: "focus:border-primary focus:ring-primary/40",
-    flushed: "border-border focus:border-primary",
-    unstyled: ""
-  },
-  error: {
-    default: "border-error focus:border-error focus:ring-error/20",
-    filled: "bg-error/5 focus:border-error focus:ring-error/20",
-    flushed: "border-error focus:border-error",
-    unstyled: ""
-  },
-  success: {
-    default: "border-success focus:border-success focus:ring-success/20",
-    filled: "bg-success/5 focus:border-success focus:ring-success/20",
-    flushed: "border-success focus:border-success",
-    unstyled: ""
-  },
-  warning: {
-    default: "border-warning focus:border-warning focus:ring-warning/20",
-    filled: "bg-warning/5 focus:border-warning focus:ring-warning/20",
-    flushed: "border-warning focus:border-warning",
-    unstyled: ""
-  }
-};
-var stateMessageClasses = {
-  default: "text-text-muted",
-  error: "text-error font-medium",
-  success: "text-success font-medium",
-  warning: "text-warning font-medium"
-};
-var disabledClasses = "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-surface-secondary";
-function getAddonPadding(hasLeft, hasRight, size) {
-  const leftPad = {
-    xs: "pl-6",
-    sm: "pl-8",
-    md: "pl-9",
-    lg: "pl-10",
-    xl: "pl-11"
-  };
-  const rightPad = {
-    xs: "pr-8",
-    sm: "pr-10",
-    md: "pr-11",
-    lg: "pr-12",
-    xl: "pr-12"
-  };
-  const parts = [];
-  if (hasLeft) parts.push(leftPad[size]);
-  if (hasRight) parts.push(rightPad[size]);
-  return parts.join(" ");
-}
-function getStateMessage(state, errorMessage, successMessage, warningMessage) {
-  if (state === "error" && errorMessage) return errorMessage;
-  if (state === "success" && successMessage) return successMessage;
-  if (state === "warning" && warningMessage) return warningMessage;
-  return void 0;
-}
-function AddonIcon({
-  children,
-  side,
-  size,
-  pointerEvents = false
-}) {
-  const iconSizeClasses = {
-    xs: "w-3.5 h-3.5",
-    sm: "w-4 h-4",
-    md: "w-4 h-4",
-    lg: "w-5 h-5",
-    xl: "w-5 h-5"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "span",
-    {
-      "aria-hidden": "true",
-      className: chunkL5VQZZVR_cjs.cn(
-        "absolute top-1/2 -translate-y-1/2 text-text-secondary flex items-center justify-center",
-        !pointerEvents && "pointer-events-none",
-        side === "left" ? "left-3" : "right-3",
-        iconSizeClasses[size]
-      ),
-      children
-    }
-  );
-}
-function Addon({ children, side }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "span",
-    {
-      "aria-hidden": "true",
-      className: chunkL5VQZZVR_cjs.cn(
-        "inline-flex items-center border border-border bg-surface-secondary px-3 text-sm text-text-secondary select-none",
-        side === "left" ? "rounded-l-md border-r-0" : "rounded-r-md border-l-0"
-      ),
-      children
-    }
-  );
-}
-var TimePicker = react.forwardRef(function TimePicker2({
-  label,
-  required = false,
-  helperText,
-  errorMessage,
-  successMessage,
-  warningMessage,
-  variant = "default",
-  size = "md",
-  state = "default",
-  fullWidth = true,
-  leftElement,
-  rightElement,
-  prefix,
-  suffix,
-  wrapperClassName,
-  inputGroupClassName,
-  inputClassName,
-  labelClassName,
-  helperClassName,
-  id: idProp,
-  disabled,
-  className,
-  clearable,
-  isLoading,
-  value,
-  onChange,
-  ...rest
-}, ref) {
-  const generatedId = react.useId();
-  const inputId = idProp ?? generatedId;
-  const helperId = `${inputId}-helper`;
-  const stateMessageId = `${inputId}-state`;
-  const isValueString = typeof value === "string";
-  const showClear = clearable && isValueString && value.length > 0;
-  const hasLeftElement = leftElement !== void 0;
-  const hasRightElement = rightElement !== void 0 || Boolean(showClear) || Boolean(isLoading);
-  const stateMessage = getStateMessage(state, errorMessage, successMessage, warningMessage);
-  const describedBy = [helperText ? helperId : null, stateMessage ? stateMessageId : null].filter(Boolean).join(" ") || void 0;
-  const handleClear = () => {
-    if (ref && typeof ref !== "function" && ref.current) {
-      const descriptor = Reflect.getOwnPropertyDescriptor(
-        window.HTMLInputElement.prototype,
-        "value"
-      );
-      const nativeInputValueSetter = descriptor?.set;
-      if (nativeInputValueSetter) {
-        Reflect.apply(nativeInputValueSetter, ref.current, [""]);
-      }
-      const event = new Event("input", { bubbles: true });
-      ref.current.dispatchEvent(event);
-    } else if (onChange) {
-      const e = {
-        target: { value: "" },
-        currentTarget: { value: "" },
-        preventDefault: () => {
-        },
-        stopPropagation: () => {
-        }
-      };
-      onChange(e);
-    }
-  };
-  const renderRightIcon = () => {
-    if (isLoading) {
-      return /* @__PURE__ */ jsxRuntime.jsxs(
-        "svg",
-        {
-          className: "animate-spin h-full w-full text-text-muted",
-          xmlns: "http://www.w3.org/2000/svg",
-          fill: "none",
-          viewBox: "0 0 24 24",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "circle",
-              {
-                className: "opacity-25",
-                cx: "12",
-                cy: "12",
-                r: "10",
-                stroke: "currentColor",
-                strokeWidth: "4"
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "path",
-              {
-                className: "opacity-75",
-                fill: "currentColor",
-                d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
-              }
-            )
-          ]
-        }
-      );
-    }
-    if (showClear) {
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "button",
-        {
-          type: "button",
-          onClick: handleClear,
-          className: "pointer-events-auto flex items-center justify-center rounded-full text-text-muted hover:text-text hover:bg-hover p-0.5 transition-all duration-fast",
-          "aria-label": "Clear time",
-          children: /* @__PURE__ */ jsxRuntime.jsx(outline.XMarkIcon, { className: "w-full h-full", strokeWidth: 2.5 })
-        }
-      );
-    }
-    return rightElement;
-  };
-  const inputElement = /* @__PURE__ */ jsxRuntime.jsx(
-    "input",
-    {
-      ref,
-      id: inputId,
-      disabled: Boolean(disabled) || Boolean(isLoading),
-      type: "time",
-      value,
-      onChange,
-      "aria-invalid": state === "error" ? true : void 0,
-      "aria-describedby": describedBy,
-      "aria-required": required,
-      className: chunkL5VQZZVR_cjs.cn(
-        "w-full transition-colors duration-150",
-        "[&::-webkit-calendar-picker-indicator]:cursor-pointer [&::-webkit-calendar-picker-indicator]:opacity-60 hover:[&::-webkit-calendar-picker-indicator]:opacity-100",
-        sizeClasses[size],
-        variantClasses[variant],
-        stateVariantClasses[state][variant],
-        disabledClasses,
-        getAddonPadding(hasLeftElement, hasRightElement, size),
-        inputClassName
-      ),
-      ...rest
-    }
-  );
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: chunkL5VQZZVR_cjs.cn(
-        "flex flex-col gap-1",
-        fullWidth ? "w-full" : "w-fit",
-        wrapperClassName,
-        className
-      ),
-      children: [
-        label !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs(
-          "label",
-          {
-            htmlFor: inputId,
-            className: chunkL5VQZZVR_cjs.cn(
-              "font-black leading-none text-text uppercase tracking-widest",
-              labelSizeClasses[size],
-              labelClassName
-            ),
-            children: [
-              label,
-              required && /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "ml-1 text-error", children: "*" })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          "div",
-          {
-            className: chunkL5VQZZVR_cjs.cn("flex items-stretch", fullWidth ? "w-full" : "w-fit", inputGroupClassName),
-            children: [
-              prefix !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(Addon, { side: "left", children: prefix }),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-1 items-center", children: [
-                hasLeftElement && /* @__PURE__ */ jsxRuntime.jsx(AddonIcon, { side: "left", size, children: leftElement }),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "div",
-                  {
-                    className: chunkL5VQZZVR_cjs.cn(
-                      "flex-1",
-                      prefix !== void 0 && suffix !== void 0 ? "[&>input]:rounded-none" : prefix !== void 0 ? "[&>input]:rounded-l-none" : suffix !== void 0 ? "[&>input]:rounded-r-none" : ""
-                    ),
-                    children: inputElement
-                  }
-                ),
-                hasRightElement && /* @__PURE__ */ jsxRuntime.jsx(AddonIcon, { side: "right", size, pointerEvents: !rightElement && Boolean(showClear), children: renderRightIcon() })
-              ] }),
-              suffix !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(Addon, { side: "right", children: suffix })
-            ]
-          }
-        ),
-        helperText !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(
-          "p",
-          {
-            id: helperId,
-            className: chunkL5VQZZVR_cjs.cn("text-xs leading-tight text-text-muted font-medium", helperClassName),
-            children: helperText
-          }
-        ),
-        stateMessage !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(
-          "p",
-          {
-            id: stateMessageId,
-            role: state === "error" ? "alert" : void 0,
-            className: chunkL5VQZZVR_cjs.cn(
-              "text-xs leading-tight mt-1 font-medium",
-              stateMessageClasses[state],
-              helperClassName
-            ),
-            children: stateMessage
-          }
-        )
-      ]
-    }
-  );
-});
-TimePicker.displayName = "TimePicker";
-
-exports.TimePicker = TimePicker;