@deepnoid/ui 0.1.83 → 0.1.86

package/dist/{chunk-B6YYZVT6.mjs → chunk-V5OCV42N.mjs}

@@ -1,10 +1,10 @@
 "use client";
-import {
-  useRipple
-} from "./chunk-6PNKRBUT.mjs";
 import {
   ripple_default
 } from "./chunk-LXHUO6VM.mjs";
+import {
+  useRipple
+} from "./chunk-6PNKRBUT.mjs";
 import {
   Icon_default
 } from "./chunk-JP4TEWP7.mjs";
@@ -16,11 +16,17 @@ import {
 } from "./chunk-CDXBML6O.mjs";
 
 // src/components/button/button.tsx
-import React, { forwardRef, useMemo, useCallback } from "react";
+import {
+  forwardRef,
+  useMemo,
+  useCallback,
+  isValidElement,
+  cloneElement
+} from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var Button = forwardRef((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, buttonStyle.variantKeys);
-  const { classNames, startContent, endContent, disableRipple, children, ...buttonProps } = props;
+  const { classNames, startContent, endContent, disableRipple, asChild, children, ...buttonProps } = props;
   const slots = useMemo(() => buttonStyle({ ...variantProps }), [variantProps]);
   const { onPress: onRipplePressHandler, onClear: onClearRipple, ripples } = useRipple();
   const handlePress = useCallback(
@@ -62,25 +68,46 @@ var Button = forwardRef((originalProps, ref) => {
     [slots, classNames, originalProps.size]
   );
   const renderContent = (content) => {
-    if (React.isValidElement(content)) {
+    if (isValidElement(content)) {
       const _content = content;
       const existingProps = _content.props;
       const mergedProps = {
         ...getContentProps(),
         className: `${getContentProps().className || ""} ${existingProps.className || ""}`.trim()
       };
-      return React.cloneElement(content, mergedProps);
+      return cloneElement(content, mergedProps);
     } else {
       const contentProps = getContentProps();
       return /* @__PURE__ */ jsx("div", { ...contentProps, children: content });
     }
   };
-  return /* @__PURE__ */ jsx("button", { ...getBaseProps(), children: originalProps.isLoading ? renderContent(/* @__PURE__ */ jsx(Icon_default, { name: "loading", className: "animate-spin" })) : /* @__PURE__ */ jsxs(Fragment, { children: [
+  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);
+      }
+    };
+    return cloneElement(childElement, mergedProps);
+  }
+  return /* @__PURE__ */ jsx("button", { ...getBaseProps(), children: buttonContent });
 });
 Button.displayName = "Button";
 var button_default = Button;

package/dist/{chunk-FKHKYVZH.mjs → chunk-VSURAISO.mjs}

@@ -1,7 +1,4 @@
 "use client";
-import {
-  Icon_default
-} from "./chunk-JP4TEWP7.mjs";
 import {
   mapPropsVariants
 } from "./chunk-E3G5QXSH.mjs";
@@ -10,11 +7,29 @@ import {
 } from "./chunk-CDXBML6O.mjs";
 
 // src/components/accordion/accordionItem.tsx
-import { forwardRef, useCallback, useMemo, useRef, useState, useEffect } from "react";
+import {
+  forwardRef,
+  useCallback,
+  useMemo,
+  useRef,
+  useState,
+  useEffect,
+  isValidElement,
+  cloneElement
+} from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 var AccordionItem = forwardRef((originalProps, ref) => {
   const [props, variantProps] = mapPropsVariants(originalProps, accordionItem.variantKeys);
-  const { title, children, startIconName, endIconName, classNames, isOpen, onToggle, size, disableAnimation } = {
+  const {
+    title,
+    children,
+    startContent,
+    endContent,
+    classNames,
+    isOpen = false,
+    onToggle,
+    disableAnimation
+  } = {
     ...props,
     ...variantProps
   };
@@ -29,7 +44,22 @@ var AccordionItem = forwardRef((originalProps, ref) => {
       setContentHeight(isOpen ? `${contentRef.current.scrollHeight}px` : "0px");
     }
   }, [isOpen]);
-  const renderIcon = (name) => name ? /* @__PURE__ */ jsx(Icon_default, { name, fill: true, size, className: slots.icon({ class: classNames == null ? void 0 : classNames.icon }) }) : null;
+  const handleToggle = useCallback(() => {
+    onToggle == null ? void 0 : onToggle();
+  }, [onToggle]);
+  const renderContent = (content) => {
+    const actualContent = typeof content === "function" ? content(isOpen) : content;
+    if (isValidElement(actualContent)) {
+      const _content = actualContent;
+      const existingProps = _content.props;
+      const mergedProps = {
+        className: `${slots.icon({ class: classNames == null ? void 0 : classNames.icon }) || ""} ${existingProps.className || ""}`.trim()
+      };
+      return cloneElement(actualContent, mergedProps);
+    } else {
+      return /* @__PURE__ */ jsx("div", { className: slots.icon({ class: classNames == null ? void 0 : classNames.icon }), children: actualContent });
+    }
+  };
   const getContentProps = useCallback(() => {
     if (disableAnimation) {
       return {
@@ -50,10 +80,10 @@ var AccordionItem = forwardRef((originalProps, ref) => {
     };
   }, [slots, classNames == null ? void 0 : classNames.content, contentHeight, isOpen, disableAnimation]);
   return /* @__PURE__ */ jsxs("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: [
-    /* @__PURE__ */ jsxs("div", { "data-isOpen": isOpen, className: slots.header({ class: classNames == null ? void 0 : classNames.header }), onClick: onToggle, children: [
-      renderIcon(startIconName),
+    /* @__PURE__ */ jsxs("div", { "data-isOpen": isOpen, className: slots.header({ class: classNames == null ? void 0 : classNames.header }), onClick: handleToggle, children: [
+      startContent && renderContent(startContent),
       /* @__PURE__ */ jsx("span", { className: slots.headerTitle({ class: classNames == null ? void 0 : classNames.headerTitle }), children: title }),
-      renderIcon(endIconName)
+      endContent && renderContent(endContent)
     ] }),
     isOpen && /* @__PURE__ */ jsx("div", { ref: contentRef, ...getContentProps(), children })
   ] });
@@ -62,7 +92,7 @@ AccordionItem.displayName = "AccordionItem";
 var accordionItem_default = AccordionItem;
 var accordionItem = tv({
   slots: {
-    base: ["group/accordion", "w-full", "flex", "flex-col", "gap-[12px]", "p-[12px]"],
+    base: ["group/accordion", "w-full", "flex", "flex-col", "gap-[12px]", "p-[12px]", "bg-body-background"],
     header: [
       "flex",
       "justify-between",

package/dist/components/accordion/accordionItem.d.mts

@@ -3,15 +3,12 @@ import { VariantProps } from 'tailwind-variants';
 import * as react from 'react';
 import { ReactNode } from 'react';
 import { SlotsToClasses } from '../../utils/types.mjs';
-import { IconName } from '../icon/Icon.mjs';
-import 'react/jsx-runtime';
-import '../icon/template.mjs';
 
 interface Props {
     title?: string;
     children?: ReactNode;
-    startIconName?: IconName | null;
-    endIconName?: IconName | null;
+    startContent?: ReactNode | ((isOpen: boolean) => ReactNode);
+    endContent?: ReactNode | ((isOpen: boolean) => ReactNode);
     classNames?: SlotsToClasses<AccordionItemSlots>;
     isOpen?: boolean;
     onToggle?: () => void;

package/dist/components/accordion/accordionItem.d.ts

@@ -3,15 +3,12 @@ import { VariantProps } from 'tailwind-variants';
 import * as react from 'react';
 import { ReactNode } from 'react';
 import { SlotsToClasses } from '../../utils/types.js';
-import { IconName } from '../icon/Icon.js';
-import 'react/jsx-runtime';
-import '../icon/template.js';
 
 interface Props {
     title?: string;
     children?: ReactNode;
-    startIconName?: IconName | null;
-    endIconName?: IconName | null;
+    startContent?: ReactNode | ((isOpen: boolean) => ReactNode);
+    endContent?: ReactNode | ((isOpen: boolean) => ReactNode);
     classNames?: SlotsToClasses<AccordionItemSlots>;
     isOpen?: boolean;
     onToggle?: () => void;