@jinmi/ui 0.0.0-stage → 6.0.1

package/es/awesome/landingActions.mjs

@@ -0,0 +1,123 @@
+import Icon from "../Icon/Icon.mjs";
+import { isExternalHref, renderLandingLink } from "./landingLink.mjs";
+import BottomGradientButton from "./BottomGradientButton/BottomGradientButton.mjs";
+import { accentGradient } from "./landingTokens.mjs";
+import { Fragment } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { createStaticStyles, cx } from "antd-style";
+//#region src/awesome/landingActions.tsx
+const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
+	action: css`
+    display: inline-flex;
+    gap: 8px;
+    align-items: center;
+    justify-content: center;
+
+    min-block-size: 44px;
+    padding-block: 0;
+    padding-inline: 22px;
+    border: 1px solid transparent;
+    border-radius: 999px;
+
+    font-size: ${cssVar.fontSize};
+    font-weight: 600;
+    color: ${cssVar.colorText};
+    text-decoration: none;
+    white-space: nowrap;
+
+    background-image:
+      linear-gradient(${cssVar.colorBgContainer}, ${cssVar.colorBgContainer}), ${accentGradient};
+    background-clip: padding-box, border-box;
+    background-origin: border-box;
+
+    transition:
+      filter 140ms ease,
+      transform 90ms ease;
+
+    &:hover {
+      color: ${cssVar.colorText};
+      filter: brightness(1.06);
+    }
+
+    &:active {
+      transform: scale(0.97);
+    }
+  `,
+	actionPrimary: css`
+    && {
+      color: ${cssVar.colorBgContainer};
+      background: ${cssVar.colorText};
+    }
+
+    &&:hover {
+      color: ${cssVar.colorBgContainer};
+    }
+  `,
+	actionSmall: css`
+    && {
+      gap: 6px;
+      min-block-size: 34px;
+      padding-inline: 14px;
+      font-size: ${cssVar.fontSizeSM};
+    }
+  `,
+	group: css`
+    display: flex;
+    flex-wrap: wrap;
+    gap: 12px;
+
+    &[data-size='small'] {
+      gap: 8px;
+    }
+
+    ${responsive.mobile} {
+      &[data-size='large'] {
+        align-self: stretch;
+      }
+
+      &[data-size='large'] > * {
+        flex: 1;
+      }
+    }
+  `
+}));
+const LandingActions = ({ actions, className, onNavigate, renderLink, size = "large" }) => /* @__PURE__ */ jsx("div", {
+	className: cx(styles.group, className),
+	"data-size": size,
+	children: actions.map(({ external, href, icon, iconPlacement = "start", label, primary }) => {
+		const iconNode = icon && /* @__PURE__ */ jsx(Icon, {
+			icon,
+			size: size === "small" ? 14 : 16
+		});
+		if (!primary) {
+			const isExternal = external ?? isExternalHref(href);
+			return /* @__PURE__ */ jsx(BottomGradientButton, {
+				href,
+				icon: iconNode,
+				iconPosition: iconPlacement,
+				rel: isExternal ? "noreferrer" : void 0,
+				size: size === "small" ? "middle" : "large",
+				target: isExternal ? "_blank" : void 0,
+				onClick: !isExternal && onNavigate ? (event) => {
+					event.preventDefault();
+					onNavigate(href);
+				} : void 0,
+				children: label
+			}, href);
+		}
+		return /* @__PURE__ */ jsx(Fragment, { children: renderLandingLink(renderLink, {
+			children: /* @__PURE__ */ jsxs(Fragment$1, { children: [
+				iconPlacement === "start" && iconNode,
+				label,
+				iconPlacement === "end" && iconNode
+			] }),
+			className: cx(styles.action, styles.actionPrimary, size === "small" && styles.actionSmall),
+			external,
+			href
+		}) }, href);
+	})
+});
+//#endregion
+export { LandingActions };
+
+//# sourceMappingURL=landingActions.mjs.map

package/es/awesome/landingActions.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"landingActions.mjs","names":[],"sources":["../../src/awesome/landingActions.tsx"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\r\nimport { Fragment, type ReactNode } from 'react';\r\n\r\nimport BottomGradientButton from '@/awesome/BottomGradientButton';\r\nimport { isExternalHref, type LandingLinkRender, renderLandingLink } from '@/awesome/landingLink';\r\nimport { accentGradient } from '@/awesome/landingTokens';\r\nimport Icon, { type IconProps } from '@/Icon';\r\n\r\nexport interface LandingAction {\r\n  /** Opens in a new tab. Inferred from absolute URLs when omitted. */\r\n  external?: boolean;\r\n  href: string;\r\n  icon?: IconProps['icon'];\r\n  /** Places the icon after the label, e.g. for an arrow. */\r\n  iconPlacement?: 'start' | 'end';\r\n  label: ReactNode;\r\n  /** The primary action is a filled pill; others render as BottomGradientButton. */\r\n  primary?: boolean;\r\n}\r\n\r\nconst styles = createStaticStyles(({ css, cssVar, responsive }) => ({\r\n  action: css`\r\n    display: inline-flex;\r\n    gap: 8px;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    min-block-size: 44px;\r\n    padding-block: 0;\r\n    padding-inline: 22px;\r\n    border: 1px solid transparent;\r\n    border-radius: 999px;\r\n\r\n    font-size: ${cssVar.fontSize};\r\n    font-weight: 600;\r\n    color: ${cssVar.colorText};\r\n    text-decoration: none;\r\n    white-space: nowrap;\r\n\r\n    background-image:\r\n      linear-gradient(${cssVar.colorBgContainer}, ${cssVar.colorBgContainer}), ${accentGradient};\r\n    background-clip: padding-box, border-box;\r\n    background-origin: border-box;\r\n\r\n    transition:\r\n      filter 140ms ease,\r\n      transform 90ms ease;\r\n\r\n    &:hover {\r\n      color: ${cssVar.colorText};\r\n      filter: brightness(1.06);\r\n    }\r\n\r\n    &:active {\r\n      transform: scale(0.97);\r\n    }\r\n  `,\r\n  actionPrimary: css`\r\n    && {\r\n      color: ${cssVar.colorBgContainer};\r\n      background: ${cssVar.colorText};\r\n    }\r\n\r\n    &&:hover {\r\n      color: ${cssVar.colorBgContainer};\r\n    }\r\n  `,\r\n  actionSmall: css`\r\n    && {\r\n      gap: 6px;\r\n      min-block-size: 34px;\r\n      padding-inline: 14px;\r\n      font-size: ${cssVar.fontSizeSM};\r\n    }\r\n  `,\r\n  group: css`\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    gap: 12px;\r\n\r\n    &[data-size='small'] {\r\n      gap: 8px;\r\n    }\r\n\r\n    ${responsive.mobile} {\r\n      &[data-size='large'] {\r\n        align-self: stretch;\r\n      }\r\n\r\n      &[data-size='large'] > * {\r\n        flex: 1;\r\n      }\r\n    }\r\n  `,\r\n}));\r\n\r\nexport type LandingNavigate = (href: string) => void;\r\n\r\nexport interface LandingActionsProps {\r\n  actions: LandingAction[];\r\n  className?: string;\r\n  /** Client-side navigation for internal non-primary actions, which render as buttons with an href. */\r\n  onNavigate?: LandingNavigate;\r\n  renderLink?: LandingLinkRender;\r\n  size?: 'large' | 'small';\r\n}\r\n\r\nexport const LandingActions = ({\r\n  actions,\r\n  className,\r\n  onNavigate,\r\n  renderLink,\r\n  size = 'large',\r\n}: LandingActionsProps) => (\r\n  <div className={cx(styles.group, className)} data-size={size}>\r\n    {actions.map(({ external, href, icon, iconPlacement = 'start', label, primary }) => {\r\n      const iconNode = icon && <Icon icon={icon} size={size === 'small' ? 14 : 16} />;\r\n      if (!primary) {\r\n        const isExternal = external ?? isExternalHref(href);\r\n        return (\r\n          <BottomGradientButton\r\n            href={href}\r\n            icon={iconNode}\r\n            iconPosition={iconPlacement}\r\n            key={href}\r\n            rel={isExternal ? 'noreferrer' : undefined}\r\n            size={size === 'small' ? 'middle' : 'large'}\r\n            target={isExternal ? '_blank' : undefined}\r\n            onClick={\r\n              !isExternal && onNavigate\r\n                ? (event) => {\r\n                    event.preventDefault();\r\n                    onNavigate(href);\r\n                  }\r\n                : undefined\r\n            }\r\n          >\r\n            {label}\r\n          </BottomGradientButton>\r\n        );\r\n      }\r\n      return (\r\n        <Fragment key={href}>\r\n          {renderLandingLink(renderLink, {\r\n            children: (\r\n              <>\r\n                {iconPlacement === 'start' && iconNode}\r\n                {label}\r\n                {iconPlacement === 'end' && iconNode}\r\n              </>\r\n            ),\r\n            className: cx(\r\n              styles.action,\r\n              styles.actionPrimary,\r\n              size === 'small' && styles.actionSmall,\r\n            ),\r\n            external,\r\n            href,\r\n          })}\r\n        </Fragment>\r\n      );\r\n    })}\r\n  </div>\r\n);\r\n"],"mappings":";;;;;;;;AAoBA,MAAM,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CAClE,QAAQ,GAAG;;;;;;;;;;;;iBAYI,OAAO,SAAS;;aAEpB,OAAO,UAAU;;;;;wBAKN,OAAO,iBAAiB,IAAI,OAAO,iBAAiB,KAAK,eAAe;;;;;;;;;eASjF,OAAO,UAAU;;;;;;;;CAQ9B,eAAe,GAAG;;eAEL,OAAO,iBAAiB;oBACnB,OAAO,UAAU;;;;eAItB,OAAO,iBAAiB;;;CAGrC,aAAa,GAAG;;;;;mBAKC,OAAO,WAAW;;;CAGnC,OAAO,GAAG;;;;;;;;;MASN,WAAW,OAAO;;;;;;;;;;AAUxB,EAAE;AAaF,MAAa,kBAAkB,EAC7B,SACA,WACA,YACA,YACA,OAAO,cAEP,oBAAC,OAAD;CAAK,WAAW,GAAG,OAAO,OAAO,SAAS;CAAG,aAAW;CACrD,UAAA,QAAQ,KAAK,EAAE,UAAU,MAAM,MAAM,gBAAgB,SAAS,OAAO,cAAc;EAClF,MAAM,WAAW,QAAQ,oBAAC,MAAD;GAAY;GAAM,MAAM,SAAS,UAAU,KAAK;EAAK,CAAA;EAC9E,IAAI,CAAC,SAAS;GACZ,MAAM,aAAa,YAAY,eAAe,IAAI;GAClD,OACE,oBAAC,sBAAD;IACQ;IACN,MAAM;IACN,cAAc;IAEd,KAAK,aAAa,eAAe,KAAA;IACjC,MAAM,SAAS,UAAU,WAAW;IACpC,QAAQ,aAAa,WAAW,KAAA;IAChC,SACE,CAAC,cAAc,cACV,UAAU;KACT,MAAM,eAAe;KACrB,WAAW,IAAI;IACjB,IACA,KAAA;IAGL,UAAA;GACmB,GAdf,IAce;EAE1B;EACA,OACE,oBAAC,UAAD,EAAA,UACG,kBAAkB,YAAY;GAC7B,UACE,qBAAA,YAAA,EAAA,UAAA;IACG,kBAAkB,WAAW;IAC7B;IACA,kBAAkB,SAAS;GAC5B,EAAA,CAAA;GAEJ,WAAW,GACT,OAAO,QACP,OAAO,eACP,SAAS,WAAW,OAAO,WAC7B;GACA;GACA;EACF,CAAC,EACO,GAjBK,IAiBL;CAEd,CAAC;AACE,CAAA"}

package/es/awesome/landingIcon.mjs

@@ -0,0 +1,13 @@
+import { isValidElement } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/awesome/landingIcon.tsx
+const isElementType = (icon) => typeof icon === "function" || typeof icon === "object" && icon !== null && !isValidElement(icon) && "$$typeof" in icon;
+/** Renders an icon given either a component (e.g. from `@lobehub/icons`) or a ready-made node. */
+const renderLandingIcon = (icon, size) => {
+	if (!isElementType(icon)) return icon;
+	return /* @__PURE__ */ jsx(icon, { size });
+};
+//#endregion
+export { renderLandingIcon };
+
+//# sourceMappingURL=landingIcon.mjs.map

package/es/awesome/landingIcon.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"landingIcon.mjs","names":["IconComponent"],"sources":["../../src/awesome/landingIcon.tsx"],"sourcesContent":["import { type ElementType, isValidElement, type ReactNode } from 'react';\r\n\r\nexport type LandingIconSource = ElementType<{ size: number }> | ReactNode;\r\n\r\nconst isElementType = (icon: LandingIconSource): icon is ElementType<{ size: number }> =>\r\n  typeof icon === 'function' ||\r\n  (typeof icon === 'object' && icon !== null && !isValidElement(icon) && '$$typeof' in icon);\r\n\r\n/** Renders an icon given either a component (e.g. from `@lobehub/icons`) or a ready-made node. */\r\nexport const renderLandingIcon = (icon: LandingIconSource, size: number): ReactNode => {\r\n  if (!isElementType(icon)) return icon as ReactNode;\r\n  const IconComponent = icon;\r\n  return <IconComponent size={size} />;\r\n};\r\n"],"mappings":";;;AAIA,MAAM,iBAAiB,SACrB,OAAO,SAAS,cACf,OAAO,SAAS,YAAY,SAAS,QAAQ,CAAC,eAAe,IAAI,KAAK,cAAc;;AAGvF,MAAa,qBAAqB,MAAyB,SAA4B;CACrF,IAAI,CAAC,cAAc,IAAI,GAAG,OAAO;CAEjC,OAAO,oBAACA,MAAD,EAAqB,KAAO,CAAA;AACrC"}

package/es/awesome/landingLink.d.mts

@@ -0,0 +1,12 @@
+import { ReactNode } from "react";
+//#region src/awesome/landingLink.d.ts
+interface LandingLinkProps {
+  children: ReactNode;
+  className?: string;
+  external?: boolean;
+  href: string;
+}
+type LandingLinkRender = (props: LandingLinkProps) => ReactNode;
+//#endregion
+export { LandingLinkProps, LandingLinkRender };
+//# sourceMappingURL=landingLink.d.mts.map

package/es/awesome/landingLink.mjs

@@ -0,0 +1,23 @@
+import { jsx } from "react/jsx-runtime";
+//#region src/awesome/landingLink.tsx
+const isExternalHref = (href) => /^[a-z][\d+.a-z-]*:/i.test(href);
+const renderLandingLink = (renderLink, { external, href, ...props }) => {
+	const isExternal = external ?? isExternalHref(href);
+	if (renderLink) return renderLink({
+		...props,
+		external: isExternal,
+		href
+	});
+	return /* @__PURE__ */ jsx("a", {
+		href,
+		...isExternal ? {
+			rel: "noreferrer",
+			target: "_blank"
+		} : {},
+		...props
+	});
+};
+//#endregion
+export { isExternalHref, renderLandingLink };
+
+//# sourceMappingURL=landingLink.mjs.map

package/es/awesome/landingLink.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"landingLink.mjs","names":[],"sources":["../../src/awesome/landingLink.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\r\n\r\nexport interface LandingLinkProps {\r\n  children: ReactNode;\r\n  className?: string;\r\n  external?: boolean;\r\n  href: string;\r\n}\r\n\r\nexport type LandingLinkRender = (props: LandingLinkProps) => ReactNode;\r\n\r\nexport const isExternalHref = (href: string) => /^[a-z][\\d+.a-z-]*:/i.test(href);\r\n\r\nexport const renderLandingLink = (\r\n  renderLink: LandingLinkRender | undefined,\r\n  { external, href, ...props }: LandingLinkProps,\r\n): ReactNode => {\r\n  const isExternal = external ?? isExternalHref(href);\r\n  if (renderLink) return renderLink({ ...props, external: isExternal, href });\r\n\r\n  return (\r\n    <a href={href} {...(isExternal ? { rel: 'noreferrer', target: '_blank' } : {})} {...props} />\r\n  );\r\n};\r\n"],"mappings":";;AAWA,MAAa,kBAAkB,SAAiB,sBAAsB,KAAK,IAAI;AAE/E,MAAa,qBACX,YACA,EAAE,UAAU,MAAM,GAAG,YACP;CACd,MAAM,aAAa,YAAY,eAAe,IAAI;CAClD,IAAI,YAAY,OAAO,WAAW;EAAE,GAAG;EAAO,UAAU;EAAY;CAAK,CAAC;CAE1E,OACE,oBAAC,KAAD;EAAS;EAAM,GAAK,aAAa;GAAE,KAAK;GAAc,QAAQ;EAAS,IAAI,CAAC;EAAI,GAAI;CAAQ,CAAA;AAEhG"}

package/es/awesome/landingTokens.d.mts

@@ -0,0 +1,10 @@
+//#region src/awesome/landingTokens.d.ts
+type LandingPalette = [string, string, string];
+declare const LANDING_PALETTE_LIGHT: LandingPalette;
+declare const LANDING_PALETTE_DARK: LandingPalette;
+/** Consumers can override the accent of every landing component with this CSS variable. */
+declare const LANDING_GRADIENT_VAR = "--jinmi-landing-gradient";
+declare const accentGradient: string;
+//#endregion
+export { LANDING_GRADIENT_VAR, LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT, LandingPalette, accentGradient };
+//# sourceMappingURL=landingTokens.d.mts.map

package/es/awesome/landingTokens.mjs

@@ -0,0 +1,19 @@
+//#region src/awesome/landingTokens.ts
+const LANDING_PALETTE_LIGHT = [
+	"#7c5cff",
+	"#d6549e",
+	"#f0885f"
+];
+const LANDING_PALETTE_DARK = [
+	"#a78bfa",
+	"#ef7fc0",
+	"#f8a878"
+];
+const landingGradient = ([from, via, to]) => `linear-gradient(105deg, ${from} 8%, ${via} 55%, ${to} 95%)`;
+/** Consumers can override the accent of every landing component with this CSS variable. */
+const LANDING_GRADIENT_VAR = "--jinmi-landing-gradient";
+const accentGradient = `var(${LANDING_GRADIENT_VAR}, ${landingGradient(LANDING_PALETTE_LIGHT)})`;
+//#endregion
+export { LANDING_GRADIENT_VAR, LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT, accentGradient, landingGradient };
+
+//# sourceMappingURL=landingTokens.mjs.map

package/es/awesome/landingTokens.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"landingTokens.mjs","names":[],"sources":["../../src/awesome/landingTokens.ts"],"sourcesContent":["export type LandingPalette = [string, string, string];\n\nexport const LANDING_PALETTE_LIGHT: LandingPalette = ['#7c5cff', '#d6549e', '#f0885f'];\nexport const LANDING_PALETTE_DARK: LandingPalette = ['#a78bfa', '#ef7fc0', '#f8a878'];\n\nexport const landingGradient = ([from, via, to]: LandingPalette) =>\n  `linear-gradient(105deg, ${from} 8%, ${via} 55%, ${to} 95%)`;\n\n/** Consumers can override the accent of every landing component with this CSS variable. */\nexport const LANDING_GRADIENT_VAR = '--jinmi-landing-gradient';\n\nexport const accentGradient = `var(${LANDING_GRADIENT_VAR}, ${landingGradient(LANDING_PALETTE_LIGHT)})`;\n"],"mappings":";AAEA,MAAa,wBAAwC;CAAC;CAAW;CAAW;AAAS;AACrF,MAAa,uBAAuC;CAAC;CAAW;CAAW;AAAS;AAEpF,MAAa,mBAAmB,CAAC,MAAM,KAAK,QAC1C,2BAA2B,KAAK,OAAO,IAAI,QAAQ,GAAG;;AAGxD,MAAa,uBAAuB;AAEpC,MAAa,iBAAiB,OAAO,qBAAqB,IAAI,gBAAgB,qBAAqB,EAAE"}

package/es/base-ui/Accordion/Accordion.d.mts

@@ -0,0 +1,7 @@
+import { AccordionProps } from "./type.mjs";
+import { FC } from "react";
+//#region src/base-ui/Accordion/Accordion.d.ts
+declare const Accordion: FC<AccordionProps>;
+//#endregion
+export { Accordion as default };
+//# sourceMappingURL=Accordion.d.mts.map

package/es/base-ui/Accordion/Accordion.mjs

@@ -0,0 +1,58 @@
+"use client";
+import { actionVariants } from "./style.mjs";
+import { AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger } from "./atoms.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+//#region src/base-ui/Accordion/Accordion.tsx
+const Accordion = ({ className, classNames, defaultValue, gap, hideIndicator, indicatorPlacement = "start", items, keepMounted, multiple = true, onValueChange, ref, style, styles: customStyles, value, variant = "borderless" }) => {
+	return /* @__PURE__ */ jsx(AccordionRoot, {
+		className: cx(classNames?.root, className),
+		defaultValue,
+		hideIndicator,
+		indicatorPlacement,
+		multiple,
+		ref,
+		style: {
+			gap,
+			...style,
+			...customStyles?.root
+		},
+		value,
+		variant,
+		onValueChange: onValueChange ? (next) => onValueChange(next) : void 0,
+		children: items?.map((item) => /* @__PURE__ */ jsxs(AccordionItem, {
+			className: classNames?.item,
+			disabled: item.disabled,
+			style: customStyles?.item,
+			value: item.key,
+			children: [/* @__PURE__ */ jsxs(AccordionHeader, {
+				className: classNames?.header,
+				style: customStyles?.header,
+				children: [/* @__PURE__ */ jsx(AccordionTrigger, {
+					className: classNames?.trigger,
+					style: customStyles?.trigger,
+					children: item.title
+				}), item.action && /* @__PURE__ */ jsx("div", {
+					style: customStyles?.action,
+					className: cx("accordion-action", actionVariants({
+						alwaysVisible: item.alwaysShowAction,
+						variant
+					}), classNames?.action),
+					children: item.action
+				})]
+			}), /* @__PURE__ */ jsx(AccordionPanel, {
+				className: classNames?.panel,
+				contentClassName: classNames?.content,
+				contentStyle: customStyles?.content,
+				keepMounted,
+				style: customStyles?.panel,
+				children: item.children
+			})]
+		}, item.key))
+	});
+};
+Accordion.displayName = "Accordion";
+//#endregion
+export { Accordion as default };
+
+//# sourceMappingURL=Accordion.mjs.map

package/es/base-ui/Accordion/Accordion.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.mjs","names":[],"sources":["../../../src/base-ui/Accordion/Accordion.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { cx } from 'antd-style';\r\nimport { type FC } from 'react';\r\n\r\nimport {\r\n  AccordionHeader,\r\n  AccordionItem,\r\n  AccordionPanel,\r\n  AccordionRoot,\r\n  AccordionTrigger,\r\n} from './atoms';\r\nimport { actionVariants } from './style';\r\nimport type { AccordionProps } from './type';\r\n\r\nconst Accordion: FC<AccordionProps> = ({\r\n  className,\r\n  classNames,\r\n  defaultValue,\r\n  gap,\r\n  hideIndicator,\r\n  indicatorPlacement = 'start',\r\n  items,\r\n  keepMounted,\r\n  multiple = true,\r\n  onValueChange,\r\n  ref,\r\n  style,\r\n  styles: customStyles,\r\n  value,\r\n  variant = 'borderless',\r\n}) => {\r\n  return (\r\n    <AccordionRoot\r\n      className={cx(classNames?.root, className)}\r\n      defaultValue={defaultValue}\r\n      hideIndicator={hideIndicator}\r\n      indicatorPlacement={indicatorPlacement}\r\n      multiple={multiple}\r\n      ref={ref}\r\n      style={{ gap, ...style, ...customStyles?.root }}\r\n      value={value}\r\n      variant={variant}\r\n      onValueChange={onValueChange ? (next) => onValueChange(next as string[]) : undefined}\r\n    >\r\n      {items?.map((item) => (\r\n        <AccordionItem\r\n          className={classNames?.item}\r\n          disabled={item.disabled}\r\n          key={item.key}\r\n          style={customStyles?.item}\r\n          value={item.key}\r\n        >\r\n          <AccordionHeader className={classNames?.header} style={customStyles?.header}>\r\n            <AccordionTrigger className={classNames?.trigger} style={customStyles?.trigger}>\r\n              {item.title}\r\n            </AccordionTrigger>\r\n            {item.action && (\r\n              <div\r\n                style={customStyles?.action}\r\n                className={cx(\r\n                  'accordion-action',\r\n                  actionVariants({ alwaysVisible: item.alwaysShowAction, variant }),\r\n                  classNames?.action,\r\n                )}\r\n              >\r\n                {item.action}\r\n              </div>\r\n            )}\r\n          </AccordionHeader>\r\n          <AccordionPanel\r\n            className={classNames?.panel}\r\n            contentClassName={classNames?.content}\r\n            contentStyle={customStyles?.content}\r\n            keepMounted={keepMounted}\r\n            style={customStyles?.panel}\r\n          >\r\n            {item.children}\r\n          </AccordionPanel>\r\n        </AccordionItem>\r\n      ))}\r\n    </AccordionRoot>\r\n  );\r\n};\r\n\r\nAccordion.displayName = 'Accordion';\r\n\r\nexport default Accordion;\r\n"],"mappings":";;;;;;AAeA,MAAM,aAAiC,EACrC,WACA,YACA,cACA,KACA,eACA,qBAAqB,SACrB,OACA,aACA,WAAW,MACX,eACA,KACA,OACA,QAAQ,cACR,OACA,UAAU,mBACN;CACJ,OACE,oBAAC,eAAD;EACE,WAAW,GAAG,YAAY,MAAM,SAAS;EAC3B;EACC;EACK;EACV;EACL;EACL,OAAO;GAAE;GAAK,GAAG;GAAO,GAAG,cAAc;EAAK;EACvC;EACE;EACT,eAAe,iBAAiB,SAAS,cAAc,IAAgB,IAAI,KAAA;EAE1E,UAAA,OAAO,KAAK,SACX,qBAAC,eAAD;GACE,WAAW,YAAY;GACvB,UAAU,KAAK;GAEf,OAAO,cAAc;GACrB,OAAO,KAAK;GALd,UAAA,CAOE,qBAAC,iBAAD;IAAiB,WAAW,YAAY;IAAQ,OAAO,cAAc;IAArE,UAAA,CACE,oBAAC,kBAAD;KAAkB,WAAW,YAAY;KAAS,OAAO,cAAc;KACpE,UAAA,KAAK;IACU,CAAA,GACjB,KAAK,UACJ,oBAAC,OAAD;KACE,OAAO,cAAc;KACrB,WAAW,GACT,oBACA,eAAe;MAAE,eAAe,KAAK;MAAkB;KAAQ,CAAC,GAChE,YAAY,MACd;KAEC,UAAA,KAAK;IACH,CAAA,CAEQ;GACjB,CAAA,GAAA,oBAAC,gBAAD;IACE,WAAW,YAAY;IACvB,kBAAkB,YAAY;IAC9B,cAAc,cAAc;IACf;IACb,OAAO,cAAc;IAEpB,UAAA,KAAK;GACQ,CAAA,CACH;EA9BR,GAAA,KAAK,GA8BG,CAChB;CACY,CAAA;AAEnB;AAEA,UAAU,cAAc"}

package/es/base-ui/Accordion/atoms.d.mts

@@ -0,0 +1,18 @@
+import { AccordionHeaderProps, AccordionIndicatorPlacement, AccordionItemProps, AccordionPanelProps, AccordionRootProps, AccordionTriggerProps, AccordionVariant } from "./type.mjs";
+import { styles } from "./style.mjs";
+import { FC } from "react";
+//#region src/base-ui/Accordion/atoms.d.ts
+interface AccordionContextValue {
+  hideIndicator: boolean;
+  indicatorPlacement: AccordionIndicatorPlacement;
+  variant: AccordionVariant;
+}
+declare const useAccordionContext: () => AccordionContextValue;
+declare const AccordionRoot: FC<AccordionRootProps>;
+declare const AccordionItem: FC<AccordionItemProps>;
+declare const AccordionHeader: FC<AccordionHeaderProps>;
+declare const AccordionTrigger: FC<AccordionTriggerProps>;
+declare const AccordionPanel: FC<AccordionPanelProps>;
+//#endregion
+export { AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, styles as accordionStyles, useAccordionContext };
+//# sourceMappingURL=atoms.d.mts.map

package/es/base-ui/Accordion/atoms.mjs

@@ -0,0 +1,111 @@
+"use client";
+import { contentVariants, headerVariants, indicatorVariants, itemVariants, rootVariants, styles, triggerVariants } from "./style.mjs";
+import { createContext, use, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { ChevronDown, ChevronRight, Play } from "lucide-react";
+import { Accordion } from "@base-ui/react/accordion";
+//#region src/base-ui/Accordion/atoms.tsx
+const AccordionContext = createContext({
+	hideIndicator: false,
+	indicatorPlacement: "start",
+	variant: "borderless"
+});
+const useAccordionContext = () => use(AccordionContext);
+const AccordionRoot = ({ children, className, hideIndicator = false, indicatorPlacement = "start", multiple = true, variant = "borderless", ...rest }) => {
+	const contextValue = useMemo(() => ({
+		hideIndicator,
+		indicatorPlacement,
+		variant
+	}), [
+		hideIndicator,
+		indicatorPlacement,
+		variant
+	]);
+	return /* @__PURE__ */ jsx(AccordionContext, {
+		value: contextValue,
+		children: /* @__PURE__ */ jsx(Accordion.Root, {
+			className: cx(rootVariants({ variant }), className),
+			multiple,
+			...rest,
+			children
+		})
+	});
+};
+AccordionRoot.displayName = "AccordionRoot";
+const AccordionItem = ({ className, variant: variantProp, ...rest }) => {
+	const ctx = useAccordionContext();
+	const variant = variantProp ?? ctx.variant;
+	return /* @__PURE__ */ jsx(Accordion.Item, {
+		className: cx(itemVariants({ variant }), className),
+		...rest
+	});
+};
+AccordionItem.displayName = "AccordionItem";
+const AccordionHeader = ({ className, indicatorPlacement: placementProp, variant: variantProp, ...rest }) => {
+	const ctx = useAccordionContext();
+	const variant = variantProp ?? ctx.variant;
+	const inline = (placementProp ?? ctx.indicatorPlacement) === "inline";
+	return /* @__PURE__ */ jsx(Accordion.Header, {
+		className: cx(headerVariants({
+			inline,
+			variant
+		}), className),
+		...rest
+	});
+};
+AccordionHeader.displayName = "AccordionHeader";
+const AccordionTrigger = ({ children, className, hideIndicator: hideIndicatorProp, indicatorPlacement: placementProp, variant: variantProp, ...rest }) => {
+	const ctx = useAccordionContext();
+	const variant = variantProp ?? ctx.variant;
+	const hideIndicator = hideIndicatorProp ?? ctx.hideIndicator;
+	const placement = placementProp ?? ctx.indicatorPlacement;
+	const indicator = !hideIndicator && /* @__PURE__ */ jsxs("span", {
+		className: indicatorVariants({ placement }),
+		children: [
+			placement === "start" && /* @__PURE__ */ jsx(ChevronRight, { size: 16 }),
+			placement === "inline" && /* @__PURE__ */ jsx(Play, {
+				fill: "currentColor",
+				size: 7,
+				strokeWidth: 1
+			}),
+			placement === "end" && /* @__PURE__ */ jsx(ChevronDown, { size: 16 })
+		]
+	});
+	return /* @__PURE__ */ jsxs(Accordion.Trigger, {
+		className: cx(triggerVariants({ variant }), className),
+		...rest,
+		children: [
+			placement === "start" && indicator,
+			children,
+			placement !== "start" && indicator
+		]
+	});
+};
+AccordionTrigger.displayName = "AccordionTrigger";
+const AccordionPanel = ({ children, className, contentClassName, contentStyle, hideIndicator: hideIndicatorProp, indicatorPlacement: placementProp, variant: variantProp, ...rest }) => {
+	const ctx = useAccordionContext();
+	const variant = variantProp ?? ctx.variant;
+	const hideIndicator = hideIndicatorProp ?? ctx.hideIndicator;
+	const placement = placementProp ?? ctx.indicatorPlacement;
+	const indent = !hideIndicator && placement === "start";
+	const inline = placement === "inline";
+	return /* @__PURE__ */ jsx(Accordion.Panel, {
+		className: cx(styles.panel, className),
+		...rest,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cx(contentVariants({
+				indent,
+				inline,
+				variant
+			}), contentClassName),
+			style: contentStyle,
+			children
+		})
+	});
+};
+AccordionPanel.displayName = "AccordionPanel";
+//#endregion
+export { AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, styles as accordionStyles, useAccordionContext };
+
+//# sourceMappingURL=atoms.mjs.map

package/es/base-ui/Accordion/atoms.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"atoms.mjs","names":["BaseUIAccordion"],"sources":["../../../src/base-ui/Accordion/atoms.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { Accordion as BaseUIAccordion } from '@base-ui/react/accordion';\r\nimport { cx } from 'antd-style';\r\nimport { ChevronDown, ChevronRight, Play } from 'lucide-react';\r\nimport { createContext, type FC, use, useMemo } from 'react';\r\n\r\nimport {\r\n  contentVariants,\r\n  headerVariants,\r\n  indicatorVariants,\r\n  itemVariants,\r\n  rootVariants,\r\n  styles,\r\n  triggerVariants,\r\n} from './style';\r\nimport type {\r\n  AccordionHeaderProps,\r\n  AccordionIndicatorPlacement,\r\n  AccordionItemProps,\r\n  AccordionPanelProps,\r\n  AccordionRootProps,\r\n  AccordionTriggerProps,\r\n  AccordionVariant,\r\n} from './type';\r\n\r\ninterface AccordionContextValue {\r\n  hideIndicator: boolean;\r\n  indicatorPlacement: AccordionIndicatorPlacement;\r\n  variant: AccordionVariant;\r\n}\r\n\r\nconst AccordionContext = createContext<AccordionContextValue>({\r\n  hideIndicator: false,\r\n  indicatorPlacement: 'start',\r\n  variant: 'borderless',\r\n});\r\n\r\nexport const useAccordionContext = () => use(AccordionContext);\r\n\r\nexport const AccordionRoot: FC<AccordionRootProps> = ({\r\n  children,\r\n  className,\r\n  hideIndicator = false,\r\n  indicatorPlacement = 'start',\r\n  multiple = true,\r\n  variant = 'borderless',\r\n  ...rest\r\n}) => {\r\n  const contextValue = useMemo(\r\n    () => ({ hideIndicator, indicatorPlacement, variant }),\r\n    [hideIndicator, indicatorPlacement, variant],\r\n  );\r\n\r\n  return (\r\n    <AccordionContext value={contextValue}>\r\n      <BaseUIAccordion.Root\r\n        className={cx(rootVariants({ variant }), className)}\r\n        multiple={multiple}\r\n        {...rest}\r\n      >\r\n        {children}\r\n      </BaseUIAccordion.Root>\r\n    </AccordionContext>\r\n  );\r\n};\r\n\r\nAccordionRoot.displayName = 'AccordionRoot';\r\n\r\nexport const AccordionItem: FC<AccordionItemProps> = ({\r\n  className,\r\n  variant: variantProp,\r\n  ...rest\r\n}) => {\r\n  const ctx = useAccordionContext();\r\n  const variant = variantProp ?? ctx.variant;\r\n\r\n  return <BaseUIAccordion.Item className={cx(itemVariants({ variant }), className)} {...rest} />;\r\n};\r\n\r\nAccordionItem.displayName = 'AccordionItem';\r\n\r\nexport const AccordionHeader: FC<AccordionHeaderProps> = ({\r\n  className,\r\n  indicatorPlacement: placementProp,\r\n  variant: variantProp,\r\n  ...rest\r\n}) => {\r\n  const ctx = useAccordionContext();\r\n  const variant = variantProp ?? ctx.variant;\r\n  const inline = (placementProp ?? ctx.indicatorPlacement) === 'inline';\r\n\r\n  return (\r\n    <BaseUIAccordion.Header\r\n      className={cx(headerVariants({ inline, variant }), className)}\r\n      {...rest}\r\n    />\r\n  );\r\n};\r\n\r\nAccordionHeader.displayName = 'AccordionHeader';\r\n\r\nexport const AccordionTrigger: FC<AccordionTriggerProps> = ({\r\n  children,\r\n  className,\r\n  hideIndicator: hideIndicatorProp,\r\n  indicatorPlacement: placementProp,\r\n  variant: variantProp,\r\n  ...rest\r\n}) => {\r\n  const ctx = useAccordionContext();\r\n  const variant = variantProp ?? ctx.variant;\r\n  const hideIndicator = hideIndicatorProp ?? ctx.hideIndicator;\r\n  const placement = placementProp ?? ctx.indicatorPlacement;\r\n\r\n  const indicator = !hideIndicator && (\r\n    <span className={indicatorVariants({ placement })}>\r\n      {placement === 'start' && <ChevronRight size={16} />}\r\n      {placement === 'inline' && <Play fill=\"currentColor\" size={7} strokeWidth={1} />}\r\n      {placement === 'end' && <ChevronDown size={16} />}\r\n    </span>\r\n  );\r\n\r\n  return (\r\n    <BaseUIAccordion.Trigger className={cx(triggerVariants({ variant }), className)} {...rest}>\r\n      {placement === 'start' && indicator}\r\n      {children}\r\n      {placement !== 'start' && indicator}\r\n    </BaseUIAccordion.Trigger>\r\n  );\r\n};\r\n\r\nAccordionTrigger.displayName = 'AccordionTrigger';\r\n\r\nexport const AccordionPanel: FC<AccordionPanelProps> = ({\r\n  children,\r\n  className,\r\n  contentClassName,\r\n  contentStyle,\r\n  hideIndicator: hideIndicatorProp,\r\n  indicatorPlacement: placementProp,\r\n  variant: variantProp,\r\n  ...rest\r\n}) => {\r\n  const ctx = useAccordionContext();\r\n  const variant = variantProp ?? ctx.variant;\r\n  const hideIndicator = hideIndicatorProp ?? ctx.hideIndicator;\r\n  const placement = placementProp ?? ctx.indicatorPlacement;\r\n  const indent = !hideIndicator && placement === 'start';\r\n  const inline = placement === 'inline';\r\n\r\n  return (\r\n    <BaseUIAccordion.Panel className={cx(styles.panel, className)} {...rest}>\r\n      <div\r\n        className={cx(contentVariants({ indent, inline, variant }), contentClassName)}\r\n        style={contentStyle}\r\n      >\r\n        {children}\r\n      </div>\r\n    </BaseUIAccordion.Panel>\r\n  );\r\n};\r\n\r\nAccordionPanel.displayName = 'AccordionPanel';\r\n\r\nexport { styles as accordionStyles } from './style';\r\n"],"mappings":";;;;;;;;AAgCA,MAAM,mBAAmB,cAAqC;CAC5D,eAAe;CACf,oBAAoB;CACpB,SAAS;AACX,CAAC;AAED,MAAa,4BAA4B,IAAI,gBAAgB;AAE7D,MAAa,iBAAyC,EACpD,UACA,WACA,gBAAgB,OAChB,qBAAqB,SACrB,WAAW,MACX,UAAU,cACV,GAAG,WACC;CACJ,MAAM,eAAe,eACZ;EAAE;EAAe;EAAoB;CAAQ,IACpD;EAAC;EAAe;EAAoB;CAAO,CAC7C;CAEA,OACE,oBAAC,kBAAD;EAAkB,OAAO;EACvB,UAAA,oBAACA,UAAgB,MAAjB;GACE,WAAW,GAAG,aAAa,EAAE,QAAQ,CAAC,GAAG,SAAS;GACxC;GACV,GAAI;GAEH;EACmB,CAAA;CACN,CAAA;AAEtB;AAEA,cAAc,cAAc;AAE5B,MAAa,iBAAyC,EACpD,WACA,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CAEnC,OAAO,oBAACA,UAAgB,MAAjB;EAAsB,WAAW,GAAG,aAAa,EAAE,QAAQ,CAAC,GAAG,SAAS;EAAG,GAAI;CAAO,CAAA;AAC/F;AAEA,cAAc,cAAc;AAE5B,MAAa,mBAA6C,EACxD,WACA,oBAAoB,eACpB,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CACnC,MAAM,UAAU,iBAAiB,IAAI,wBAAwB;CAE7D,OACE,oBAACA,UAAgB,QAAjB;EACE,WAAW,GAAG,eAAe;GAAE;GAAQ;EAAQ,CAAC,GAAG,SAAS;EAC5D,GAAI;CACL,CAAA;AAEL;AAEA,gBAAgB,cAAc;AAE9B,MAAa,oBAA+C,EAC1D,UACA,WACA,eAAe,mBACf,oBAAoB,eACpB,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CACnC,MAAM,gBAAgB,qBAAqB,IAAI;CAC/C,MAAM,YAAY,iBAAiB,IAAI;CAEvC,MAAM,YAAY,CAAC,iBACjB,qBAAC,QAAD;EAAM,WAAW,kBAAkB,EAAE,UAAU,CAAC;EAAhD,UAAA;GACG,cAAc,WAAW,oBAAC,cAAD,EAAc,MAAM,GAAK,CAAA;GAClD,cAAc,YAAY,oBAAC,MAAD;IAAM,MAAK;IAAe,MAAM;IAAG,aAAa;GAAI,CAAA;GAC9E,cAAc,SAAS,oBAAC,aAAD,EAAa,MAAM,GAAK,CAAA;EAC5C;;CAGR,OACE,qBAACA,UAAgB,SAAjB;EAAyB,WAAW,GAAG,gBAAgB,EAAE,QAAQ,CAAC,GAAG,SAAS;EAAG,GAAI;EAArF,UAAA;GACG,cAAc,WAAW;GACzB;GACA,cAAc,WAAW;EACH;;AAE7B;AAEA,iBAAiB,cAAc;AAE/B,MAAa,kBAA2C,EACtD,UACA,WACA,kBACA,cACA,eAAe,mBACf,oBAAoB,eACpB,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CACnC,MAAM,gBAAgB,qBAAqB,IAAI;CAC/C,MAAM,YAAY,iBAAiB,IAAI;CACvC,MAAM,SAAS,CAAC,iBAAiB,cAAc;CAC/C,MAAM,SAAS,cAAc;CAE7B,OACE,oBAACA,UAAgB,OAAjB;EAAuB,WAAW,GAAG,OAAO,OAAO,SAAS;EAAG,GAAI;EACjE,UAAA,oBAAC,OAAD;GACE,WAAW,GAAG,gBAAgB;IAAE;IAAQ;IAAQ;GAAQ,CAAC,GAAG,gBAAgB;GAC5E,OAAO;GAEN;EACE,CAAA;CACgB,CAAA;AAE3B;AAEA,eAAe,cAAc"}

package/es/base-ui/Accordion/index.d.mts

@@ -0,0 +1,5 @@
+import { AccordionClassNames, AccordionHeaderProps, AccordionIndicatorPlacement, AccordionItemProps, AccordionItemType, AccordionPanelProps, AccordionProps, AccordionRootProps, AccordionStyles, AccordionTriggerProps, AccordionVariant } from "./type.mjs";
+import Accordion from "./Accordion.mjs";
+import { styles } from "./style.mjs";
+import { AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger, useAccordionContext } from "./atoms.mjs";
+export { type AccordionClassNames, AccordionHeader, type AccordionHeaderProps, type AccordionIndicatorPlacement, AccordionItem, type AccordionItemProps, type AccordionItemType, AccordionPanel, type AccordionPanelProps, type AccordionProps, AccordionRoot, type AccordionRootProps, type AccordionStyles, AccordionTrigger, type AccordionTriggerProps, type AccordionVariant, styles as accordionStyles, Accordion as default, useAccordionContext };

package/es/base-ui/Accordion/style.d.mts

@@ -0,0 +1,33 @@
+//#region src/base-ui/Accordion/style.d.ts
+declare const styles: {
+  action: string;
+  actionAlwaysVisible: string;
+  actionBorderless: string;
+  actionOutlined: string;
+  content: string;
+  contentBorderless: string;
+  contentIndent: string;
+  contentIndentOutlined: string;
+  contentOutlined: string;
+  header: string;
+  headerBorderless: string;
+  headerFilled: string;
+  headerInline: string;
+  contentInline: string;
+  indicator: string;
+  indicatorInline: string;
+  indicatorEnd: string;
+  indicatorStart: string;
+  item: string;
+  itemOutlined: string;
+  panel: string;
+  root: string;
+  rootOutlined: string;
+  trigger: string;
+  triggerBorderless: string;
+  triggerFilled: string;
+  triggerOutlined: string;
+};
+//#endregion
+export { styles };
+//# sourceMappingURL=style.d.mts.map