@deepnoid/ui 0.1.85 → 0.1.87

package/dist/{chunk-FKHKYVZH.mjs → chunk-NBLCM4J2.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;