@deepnoid/ui 0.1.223 → 1.0.0

package/dist/chunk-SKX5QPUD.mjs

@@ -1,482 +0,0 @@
-"use client";
-import {
-  useRipple
-} from "./chunk-SZL743JC.mjs";
-import {
-  ripple_default
-} from "./chunk-LXHUO6VM.mjs";
-import {
-  Icon_default
-} from "./chunk-6AID2NLT.mjs";
-import {
-  mapPropsVariants
-} from "./chunk-E3G5QXSH.mjs";
-import {
-  tv
-} from "./chunk-U4DJHAM5.mjs";
-
-// src/components/button/button.tsx
-import {
-  forwardRef,
-  useMemo,
-  useCallback,
-  isValidElement,
-  cloneElement
-} from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var extractTextFromChildren = (children) => {
-  if (typeof children === "string") {
-    return children;
-  }
-  if (typeof children === "number") {
-    return String(children);
-  }
-  if (isValidElement(children)) {
-    const childProps = children.props;
-    return extractTextFromChildren(childProps.children);
-  }
-  if (Array.isArray(children)) {
-    return children.map((child) => extractTextFromChildren(child)).join(" ");
-  }
-  return "";
-};
-var Button = forwardRef((originalProps, ref) => {
-  const [props, variantProps] = mapPropsVariants(originalProps, buttonStyle.variantKeys);
-  const { classNames, startContent, endContent, disableRipple, asChild, children, ...buttonProps } = props;
-  const slots = useMemo(() => buttonStyle({ ...variantProps }), [variantProps]);
-  const { onPress: onRipplePressHandler, onClear: onClearRipple, ripples } = useRipple();
-  const autoAriaLabel = useMemo(() => {
-    if (originalProps["aria-label"] || originalProps["aria-labelledby"]) {
-      return void 0;
-    }
-    if (originalProps.isLoading) {
-      const baseText = extractTextFromChildren(children);
-      return baseText ? `${baseText} (loading)` : "loading";
-    }
-    const textContent = extractTextFromChildren(children);
-    return textContent || void 0;
-  }, [originalProps["aria-label"], originalProps["aria-labelledby"], originalProps.isLoading, children]);
-  const handlePress = useCallback(
-    (e) => {
-      if (disableRipple || originalProps.disabled) return;
-      onRipplePressHandler(e);
-    },
-    [disableRipple, originalProps.disabled, onRipplePressHandler]
-  );
-  const mouseDownHandler = useCallback(
-    (e) => {
-      var _a;
-      (_a = buttonProps.onMouseDown) == null ? void 0 : _a.call(buttonProps, e);
-      if (disableRipple || originalProps.disabled) return;
-      handlePress(e);
-    },
-    [buttonProps.onMouseDown, disableRipple, originalProps.disabled, handlePress]
-  );
-  const getRippleProps = useCallback(
-    () => ({ ripples, onClear: onClearRipple }),
-    [ripples, onClearRipple]
-  );
-  const getBaseProps = useCallback(
-    () => ({
-      ...buttonProps,
-      onMouseDown: mouseDownHandler,
-      ref,
-      disabled: originalProps.disabled || originalProps.isLoading,
-      "data-loading": originalProps.isLoading,
-      className: slots.base({ class: classNames == null ? void 0 : classNames.base }),
-      "aria-label": originalProps["aria-label"] || autoAriaLabel
-    }),
-    [
-      buttonProps,
-      mouseDownHandler,
-      ref,
-      originalProps.disabled,
-      originalProps.isLoading,
-      originalProps["aria-label"],
-      autoAriaLabel,
-      slots,
-      classNames == null ? void 0 : classNames.base
-    ]
-  );
-  const getContentProps = useCallback(
-    () => ({
-      className: slots.content({ class: classNames == null ? void 0 : classNames.content }),
-      size: originalProps.size
-    }),
-    [slots, classNames, originalProps.size]
-  );
-  const renderContent = (content) => {
-    if (isValidElement(content)) {
-      const _content = content;
-      const existingProps = _content.props;
-      const mergedProps = {
-        ...getContentProps(),
-        className: `${getContentProps().className || ""} ${existingProps.className || ""}`.trim()
-      };
-      return cloneElement(content, mergedProps);
-    } else {
-      const contentProps = getContentProps();
-      return /* @__PURE__ */ jsx("div", { ...contentProps, children: content });
-    }
-  };
-  const buttonContent = /* @__PURE__ */ jsx(Fragment, { children: originalProps.isLoading ? renderContent(/* @__PURE__ */ jsx(Icon_default, { name: "loading", className: "animate-spin" })) : /* @__PURE__ */ jsxs(Fragment, { children: [
-    startContent && renderContent(startContent),
-    children,
-    endContent && renderContent(endContent),
-    !disableRipple && /* @__PURE__ */ jsx(ripple_default, { ...getRippleProps() })
-  ] }) });
-  if (asChild && isValidElement(children)) {
-    const childElement = children;
-    const baseProps = getBaseProps();
-    const mergedProps = {
-      ...childElement.props,
-      ...baseProps,
-      className: `${baseProps.className || ""} ${childElement.props.className || ""}`.trim(),
-      onClick: (e) => {
-        var _a, _b, _c;
-        (_b = (_a = childElement.props).onClick) == null ? void 0 : _b.call(_a, e);
-        (_c = baseProps.onClick) == null ? void 0 : _c.call(baseProps, e);
-      },
-      onMouseDown: (e) => {
-        var _a, _b, _c;
-        (_b = (_a = childElement.props).onMouseDown) == null ? void 0 : _b.call(_a, e);
-        (_c = baseProps.onMouseDown) == null ? void 0 : _c.call(baseProps, e);
-      },
-      children: /* @__PURE__ */ jsx(Fragment, { children: originalProps.isLoading ? renderContent(/* @__PURE__ */ jsx(Icon_default, { name: "loading", className: "animate-spin" })) : /* @__PURE__ */ jsxs(Fragment, { children: [
-        startContent && renderContent(startContent),
-        childElement.props.children,
-        endContent && renderContent(endContent),
-        !disableRipple && /* @__PURE__ */ jsx(ripple_default, { ...getRippleProps() })
-      ] }) })
-    };
-    return cloneElement(childElement, mergedProps);
-  }
-  return /* @__PURE__ */ jsx("button", { ...getBaseProps(), children: buttonContent });
-});
-Button.displayName = "Button";
-var button_default = Button;
-var buttonStyle = tv({
-  slots: {
-    base: "relative flex items-center justify-center whitespace-nowrap transition duration-200 select-none overflow-hidden box-border border border-transparent",
-    content: ""
-  },
-  variants: {
-    variant: {
-      solid: "",
-      soft: "",
-      outline: "",
-      ghost: ""
-    },
-    color: {
-      primary: "",
-      secondary: "",
-      neutral: "",
-      info: "",
-      success: "",
-      warning: "",
-      danger: ""
-    },
-    size: {
-      sm: {
-        base: "h-[24px] px-[8px] py-[3px] text-sm font-[700] rounded-sm gap-sm"
-      },
-      md: {
-        base: "h-[32px] px-[12px] py-[5.5px] text-md font-[700] rounded-md gap-md"
-      },
-      lg: {
-        base: "h-[40px] px-[16px] py-[8px] text-lg font-[700] rounded-lg gap-lg"
-      },
-      xl: {
-        base: "h-[50px] px-[20px] py-[11.5px] text-xl font-[700] rounded-xl gap-xl"
-      }
-    },
-    radius: {
-      default: {
-        base: ""
-      },
-      full: {
-        base: "rounded-full"
-      },
-      none: {
-        base: "rounded-none"
-      }
-    },
-    full: {
-      true: {
-        base: "w-full"
-      }
-    },
-    isLoading: {
-      true: {}
-    },
-    disabled: {
-      true: {
-        base: "!bg-neutral-soft !border-neutral-soft !text-neutral-light pointer-events-none"
-      }
-    },
-    isInGroup: {
-      true: {
-        base: "[&:not(:first-child):not(:last-child)]:rounded-none first:rounded-r-none last:rounded-l-none [&:not(:first-child)]:border-l-0"
-      }
-    }
-  },
-  defaultVariants: {
-    size: "md",
-    variant: "solid",
-    color: "primary",
-    full: false,
-    disabled: false,
-    isLoading: false,
-    isInGroup: false
-  },
-  compoundVariants: [
-    // solid & color
-    {
-      variant: "solid",
-      color: "primary",
-      class: {
-        base: ["text-white", "bg-primary-main", "hover:bg-gradient-to-r", "hover:from-white/20", "hover:to-white/20"]
-      }
-    },
-    {
-      variant: "solid",
-      color: "secondary",
-      class: {
-        base: ["text-white", "bg-secondary-main", "hover:bg-gradient-to-r", "hover:from-white/20", "hover:to-white/20"]
-      }
-    },
-    {
-      variant: "solid",
-      color: "neutral",
-      class: {
-        base: ["text-white", "bg-neutral-main", "hover:bg-gradient-to-r", "hover:from-white/20", "hover:to-white/20"]
-      }
-    },
-    {
-      variant: "solid",
-      color: "info",
-      class: {
-        base: ["text-white", "bg-info-main", "hover:bg-gradient-to-r", "hover:from-white/20", "hover:to-white/20"]
-      }
-    },
-    {
-      variant: "solid",
-      color: "success",
-      class: {
-        base: ["text-white", "bg-success-main", "hover:bg-gradient-to-r", "hover:from-white/20", "hover:to-white/20"]
-      }
-    },
-    {
-      variant: "solid",
-      color: "warning",
-      class: {
-        base: ["text-white", "bg-warning-main", "hover:bg-gradient-to-r", "hover:from-white/20", "hover:to-white/20"]
-      }
-    },
-    {
-      variant: "solid",
-      color: "danger",
-      class: {
-        base: ["text-white", "bg-danger-main", "hover:bg-gradient-to-r", "hover:from-white/20", "hover:to-white/20"]
-      }
-    },
-    // soft & color
-    {
-      variant: "soft",
-      color: "primary",
-      class: {
-        base: ["text-primary-main", "bg-primary-soft", "border-primary-soft", "hover:border-primary-light"]
-      }
-    },
-    {
-      variant: "soft",
-      color: "secondary",
-      class: {
-        base: ["text-secondary-main", "bg-secondary-soft", "border-secondary-soft", "hover:border-secondary-light"]
-      }
-    },
-    {
-      variant: "soft",
-      color: "neutral",
-      class: {
-        base: ["text-neutral-main", "bg-neutral-soft", "border-neutral-soft", "hover:border-neutral-light"]
-      }
-    },
-    {
-      variant: "soft",
-      color: "info",
-      class: {
-        base: ["text-info-main", "bg-info-soft", "border-info-soft", "hover:border-info-light"]
-      }
-    },
-    {
-      variant: "soft",
-      color: "success",
-      class: {
-        base: ["text-success-main", "bg-success-soft", "border-success-soft", "hover:border-success-light"]
-      }
-    },
-    {
-      variant: "soft",
-      color: "warning",
-      class: {
-        base: ["text-warning-main", "bg-warning-soft", "border-warning-soft", "hover:border-warning-light"]
-      }
-    },
-    {
-      variant: "soft",
-      color: "danger",
-      class: {
-        base: ["text-danger-main", "bg-danger-soft", "border-danger-soft", "hover:border-danger-light"]
-      }
-    },
-    // outline & color
-    {
-      variant: "outline",
-      color: "primary",
-      class: {
-        base: ["bg-body-background", "border-primary-main", "text-primary-main", "hover:bg-primary-soft"]
-      }
-    },
-    {
-      variant: "outline",
-      color: "secondary",
-      class: {
-        base: ["bg-body-background", "border-secondary-main", "text-secondary-main", "hover:bg-secondary-soft"]
-      }
-    },
-    {
-      variant: "outline",
-      color: "neutral",
-      class: {
-        base: ["bg-body-background", "border-neutral-main", "text-neutral-main", "hover:bg-neutral-soft"]
-      }
-    },
-    {
-      variant: "outline",
-      color: "info",
-      class: {
-        base: ["bg-body-background", "border-info-main", "text-info-main", "hover:bg-info-soft"]
-      }
-    },
-    {
-      variant: "outline",
-      color: "success",
-      class: {
-        base: ["bg-body-background", "border-success-main", "text-success-main", "hover:bg-success-soft"]
-      }
-    },
-    {
-      variant: "outline",
-      color: "warning",
-      class: {
-        base: ["bg-body-background", "border-warning-main", "text-warning-main", "hover:bg-warning-soft"]
-      }
-    },
-    {
-      variant: "outline",
-      color: "danger",
-      class: {
-        base: ["bg-body-background", "border-danger-main", "text-danger-main", "hover:bg-danger-soft"]
-      }
-    },
-    // ghost & color
-    {
-      variant: "ghost",
-      color: "primary",
-      class: {
-        base: ["text-primary-main", "border-transparent", "hover:bg-primary-soft"]
-      }
-    },
-    {
-      variant: "ghost",
-      color: "secondary",
-      class: {
-        base: ["text-secondary-main", "border-transparent", "hover:bg-secondary-soft"]
-      }
-    },
-    {
-      variant: "ghost",
-      color: "neutral",
-      class: {
-        base: ["text-neutral-main", "border-transparent", "hover:bg-neutral-soft"]
-      }
-    },
-    {
-      variant: "ghost",
-      color: "info",
-      class: {
-        base: ["text-info-main", "border-transparent", "hover:bg-info-soft"]
-      }
-    },
-    {
-      variant: "ghost",
-      color: "success",
-      class: {
-        base: ["text-success-main", "border-transparent", "hover:bg-success-soft"]
-      }
-    },
-    {
-      variant: "ghost",
-      color: "warning",
-      class: {
-        base: ["text-warning-main", "border-transparent", "hover:bg-warning-soft"]
-      }
-    },
-    {
-      variant: "ghost",
-      color: "danger",
-      class: {
-        base: ["text-danger-main", "border-transparent", "hover:bg-danger-soft"]
-      }
-    },
-    // variant && size
-    {
-      variant: ["soft", "outline"],
-      size: "sm",
-      class: {
-        base: "border-[1px]"
-      }
-    },
-    {
-      variant: ["soft", "outline"],
-      size: "md",
-      class: {
-        base: "border-[1.25px]"
-      }
-    },
-    {
-      variant: ["soft", "outline"],
-      size: "lg",
-      class: {
-        base: "border-[1.5px]"
-      }
-    },
-    {
-      variant: ["soft", "outline"],
-      size: "xl",
-      class: {
-        base: "border-[1.75px]"
-      }
-    },
-    // variant && disabled
-    {
-      variant: ["soft", "ghost"],
-      disabled: true,
-      class: {
-        base: "!border-neutral-soft"
-      }
-    },
-    {
-      variant: ["outline"],
-      disabled: true,
-      class: {
-        base: "!border-neutral-light"
-      }
-    }
-  ]
-});
-
-export {
-  button_default
-};