@kopexa/accordion 17.3.41 → 17.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -7,8 +7,15 @@ type AccordionRootProps = ComponentProps<typeof AccordionPrimitive.Root> & Accor
7
7
  declare function AccordionRoot({ className, color, radius, spacing, border, triggerSpacing, ...props }: AccordionRootProps): react_jsx_runtime.JSX.Element;
8
8
  type AccordionItemProps = ComponentProps<typeof AccordionPrimitive.Item>;
9
9
  declare function AccordionItem({ className, ...props }: AccordionItemProps): react_jsx_runtime.JSX.Element;
10
- type AccordionTriggerProps = ComponentProps<typeof AccordionPrimitive.Trigger>;
11
- declare function AccordionTrigger({ className, children, ...props }: AccordionTriggerProps): react_jsx_runtime.JSX.Element;
10
+ type AccordionTriggerProps = ComponentProps<typeof AccordionPrimitive.Trigger> & {
11
+ /**
12
+ * Content rendered outside the trigger button but inside the header.
13
+ * Use this for interactive elements (buttons, popovers) that must not
14
+ * be nested inside the accordion trigger button.
15
+ */
16
+ action?: React.ReactNode;
17
+ };
18
+ declare function AccordionTrigger({ className, children, action, ...props }: AccordionTriggerProps): react_jsx_runtime.JSX.Element;
12
19
  type AccordionContentProps = ComponentProps<typeof AccordionPrimitive.Content>;
13
20
  declare function AccordionContent({ className, children, ...props }: AccordionContentProps): react_jsx_runtime.JSX.Element;
14
21
 
@@ -7,8 +7,15 @@ type AccordionRootProps = ComponentProps<typeof AccordionPrimitive.Root> & Accor
7
7
  declare function AccordionRoot({ className, color, radius, spacing, border, triggerSpacing, ...props }: AccordionRootProps): react_jsx_runtime.JSX.Element;
8
8
  type AccordionItemProps = ComponentProps<typeof AccordionPrimitive.Item>;
9
9
  declare function AccordionItem({ className, ...props }: AccordionItemProps): react_jsx_runtime.JSX.Element;
10
- type AccordionTriggerProps = ComponentProps<typeof AccordionPrimitive.Trigger>;
11
- declare function AccordionTrigger({ className, children, ...props }: AccordionTriggerProps): react_jsx_runtime.JSX.Element;
10
+ type AccordionTriggerProps = ComponentProps<typeof AccordionPrimitive.Trigger> & {
11
+ /**
12
+ * Content rendered outside the trigger button but inside the header.
13
+ * Use this for interactive elements (buttons, popovers) that must not
14
+ * be nested inside the accordion trigger button.
15
+ */
16
+ action?: React.ReactNode;
17
+ };
18
+ declare function AccordionTrigger({ className, children, action, ...props }: AccordionTriggerProps): react_jsx_runtime.JSX.Element;
12
19
  type AccordionContentProps = ComponentProps<typeof AccordionPrimitive.Content>;
13
20
  declare function AccordionContent({ className, children, ...props }: AccordionContentProps): react_jsx_runtime.JSX.Element;
14
21
 
package/dist/accordion.js CHANGED
@@ -77,21 +77,47 @@ function AccordionItem({ className, ...props }) {
77
77
  function AccordionTrigger({
78
78
  className,
79
79
  children,
80
+ action,
80
81
  ...props
81
82
  }) {
82
83
  const { styles } = useProvider();
83
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
84
- AccordionPrimitive.Trigger,
85
- {
86
- "data-slot": "accordion-trigger",
87
- className: styles.trigger({ className }),
88
- ...props,
89
- children: [
90
- children,
91
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDownIcon, { className: styles.triggerIcon() })
92
- ]
93
- }
94
- ) });
84
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AccordionPrimitive.Header, { className: "flex items-center", children: [
85
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
86
+ AccordionPrimitive.Trigger,
87
+ {
88
+ "data-slot": "accordion-trigger",
89
+ className: styles.trigger({
90
+ className: action ? `${className != null ? className : ""} pr-0` : className
91
+ }),
92
+ ...props,
93
+ children: [
94
+ children,
95
+ !action && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDownIcon, { className: styles.triggerIcon() })
96
+ ]
97
+ }
98
+ ),
99
+ action && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
100
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
101
+ "div",
102
+ {
103
+ "data-slot": "accordion-action",
104
+ className: "flex items-center gap-1.5 shrink-0 px-2",
105
+ children: action
106
+ }
107
+ ),
108
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
109
+ AccordionPrimitive.Trigger,
110
+ {
111
+ tabIndex: -1,
112
+ "data-slot": "accordion-chevron",
113
+ className: styles.trigger({
114
+ className: "w-auto flex-none pl-0"
115
+ }),
116
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDownIcon, { className: styles.triggerIcon() })
117
+ }
118
+ )
119
+ ] })
120
+ ] });
95
121
  }
96
122
  function AccordionContent({
97
123
  className,
@@ -5,7 +5,7 @@ import {
5
5
  AccordionItem,
6
6
  AccordionRoot,
7
7
  AccordionTrigger
8
- } from "./chunk-ZBE65WPV.mjs";
8
+ } from "./chunk-MCZ7N7QC.mjs";
9
9
  export {
10
10
  AccordionContent,
11
11
  AccordionItem,
@@ -10,7 +10,7 @@ import { ChevronDownIcon } from "@kopexa/icons";
10
10
  import { createContext } from "@kopexa/react-utils";
11
11
  import { accordion } from "@kopexa/theme";
12
12
  import * as AccordionPrimitive from "@radix-ui/react-accordion";
13
- import { jsx, jsxs } from "react/jsx-runtime";
13
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
14
14
  var [Provider, useProvider] = createContext();
15
15
  function AccordionRoot({
16
16
  className,
@@ -45,21 +45,47 @@ function AccordionItem({ className, ...props }) {
45
45
  function AccordionTrigger({
46
46
  className,
47
47
  children,
48
+ action,
48
49
  ...props
49
50
  }) {
50
51
  const { styles } = useProvider();
51
- return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
52
- AccordionPrimitive.Trigger,
53
- {
54
- "data-slot": "accordion-trigger",
55
- className: styles.trigger({ className }),
56
- ...props,
57
- children: [
58
- children,
59
- /* @__PURE__ */ jsx(ChevronDownIcon, { className: styles.triggerIcon() })
60
- ]
61
- }
62
- ) });
52
+ return /* @__PURE__ */ jsxs(AccordionPrimitive.Header, { className: "flex items-center", children: [
53
+ /* @__PURE__ */ jsxs(
54
+ AccordionPrimitive.Trigger,
55
+ {
56
+ "data-slot": "accordion-trigger",
57
+ className: styles.trigger({
58
+ className: action ? `${className != null ? className : ""} pr-0` : className
59
+ }),
60
+ ...props,
61
+ children: [
62
+ children,
63
+ !action && /* @__PURE__ */ jsx(ChevronDownIcon, { className: styles.triggerIcon() })
64
+ ]
65
+ }
66
+ ),
67
+ action && /* @__PURE__ */ jsxs(Fragment, { children: [
68
+ /* @__PURE__ */ jsx(
69
+ "div",
70
+ {
71
+ "data-slot": "accordion-action",
72
+ className: "flex items-center gap-1.5 shrink-0 px-2",
73
+ children: action
74
+ }
75
+ ),
76
+ /* @__PURE__ */ jsx(
77
+ AccordionPrimitive.Trigger,
78
+ {
79
+ tabIndex: -1,
80
+ "data-slot": "accordion-chevron",
81
+ className: styles.trigger({
82
+ className: "w-auto flex-none pl-0"
83
+ }),
84
+ children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: styles.triggerIcon() })
85
+ }
86
+ )
87
+ ] })
88
+ ] });
63
89
  }
64
90
  function AccordionContent({
65
91
  className,
@@ -5,7 +5,7 @@ import {
5
5
  AccordionRoot,
6
6
  AccordionTrigger,
7
7
  __export
8
- } from "./chunk-ZBE65WPV.mjs";
8
+ } from "./chunk-MCZ7N7QC.mjs";
9
9
 
10
10
  // src/namespace.ts
11
11
  var namespace_exports = {};
package/dist/index.js CHANGED
@@ -79,21 +79,47 @@ function AccordionItem({ className, ...props }) {
79
79
  function AccordionTrigger({
80
80
  className,
81
81
  children,
82
+ action,
82
83
  ...props
83
84
  }) {
84
85
  const { styles } = useProvider();
85
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
86
- AccordionPrimitive.Trigger,
87
- {
88
- "data-slot": "accordion-trigger",
89
- className: styles.trigger({ className }),
90
- ...props,
91
- children: [
92
- children,
93
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDownIcon, { className: styles.triggerIcon() })
94
- ]
95
- }
96
- ) });
86
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AccordionPrimitive.Header, { className: "flex items-center", children: [
87
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
88
+ AccordionPrimitive.Trigger,
89
+ {
90
+ "data-slot": "accordion-trigger",
91
+ className: styles.trigger({
92
+ className: action ? `${className != null ? className : ""} pr-0` : className
93
+ }),
94
+ ...props,
95
+ children: [
96
+ children,
97
+ !action && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDownIcon, { className: styles.triggerIcon() })
98
+ ]
99
+ }
100
+ ),
101
+ action && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
102
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
103
+ "div",
104
+ {
105
+ "data-slot": "accordion-action",
106
+ className: "flex items-center gap-1.5 shrink-0 px-2",
107
+ children: action
108
+ }
109
+ ),
110
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
111
+ AccordionPrimitive.Trigger,
112
+ {
113
+ tabIndex: -1,
114
+ "data-slot": "accordion-chevron",
115
+ className: styles.trigger({
116
+ className: "w-auto flex-none pl-0"
117
+ }),
118
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDownIcon, { className: styles.triggerIcon() })
119
+ }
120
+ )
121
+ ] })
122
+ ] });
97
123
  }
98
124
  function AccordionContent({
99
125
  className,
package/dist/index.mjs CHANGED
@@ -1,13 +1,13 @@
1
1
  "use client";
2
2
  import {
3
3
  namespace_exports
4
- } from "./chunk-MLYUHYQ3.mjs";
4
+ } from "./chunk-YUFP3YJJ.mjs";
5
5
  import {
6
6
  AccordionContent,
7
7
  AccordionItem,
8
8
  AccordionRoot,
9
9
  AccordionTrigger
10
- } from "./chunk-ZBE65WPV.mjs";
10
+ } from "./chunk-MCZ7N7QC.mjs";
11
11
  export {
12
12
  namespace_exports as Accordion,
13
13
  AccordionContent,
package/dist/namespace.js CHANGED
@@ -78,21 +78,47 @@ function AccordionItem({ className, ...props }) {
78
78
  function AccordionTrigger({
79
79
  className,
80
80
  children,
81
+ action,
81
82
  ...props
82
83
  }) {
83
84
  const { styles } = useProvider();
84
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
85
- AccordionPrimitive.Trigger,
86
- {
87
- "data-slot": "accordion-trigger",
88
- className: styles.trigger({ className }),
89
- ...props,
90
- children: [
91
- children,
92
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDownIcon, { className: styles.triggerIcon() })
93
- ]
94
- }
95
- ) });
85
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AccordionPrimitive.Header, { className: "flex items-center", children: [
86
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
87
+ AccordionPrimitive.Trigger,
88
+ {
89
+ "data-slot": "accordion-trigger",
90
+ className: styles.trigger({
91
+ className: action ? `${className != null ? className : ""} pr-0` : className
92
+ }),
93
+ ...props,
94
+ children: [
95
+ children,
96
+ !action && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDownIcon, { className: styles.triggerIcon() })
97
+ ]
98
+ }
99
+ ),
100
+ action && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
101
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
102
+ "div",
103
+ {
104
+ "data-slot": "accordion-action",
105
+ className: "flex items-center gap-1.5 shrink-0 px-2",
106
+ children: action
107
+ }
108
+ ),
109
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
110
+ AccordionPrimitive.Trigger,
111
+ {
112
+ tabIndex: -1,
113
+ "data-slot": "accordion-chevron",
114
+ className: styles.trigger({
115
+ className: "w-auto flex-none pl-0"
116
+ }),
117
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ChevronDownIcon, { className: styles.triggerIcon() })
118
+ }
119
+ )
120
+ ] })
121
+ ] });
96
122
  }
97
123
  function AccordionContent({
98
124
  className,
@@ -1,11 +1,11 @@
1
1
  "use client";
2
- import "./chunk-MLYUHYQ3.mjs";
2
+ import "./chunk-YUFP3YJJ.mjs";
3
3
  import {
4
4
  AccordionContent,
5
5
  AccordionItem,
6
6
  AccordionRoot,
7
7
  AccordionTrigger
8
- } from "./chunk-ZBE65WPV.mjs";
8
+ } from "./chunk-MCZ7N7QC.mjs";
9
9
  export {
10
10
  AccordionContent as Content,
11
11
  AccordionItem as Item,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kopexa/accordion",
3
- "version": "17.3.41",
3
+ "version": "17.4.0",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "accordion"
@@ -28,14 +28,14 @@
28
28
  "motion": ">=12.23.6",
29
29
  "react": ">=19.0.0-rc.0",
30
30
  "react-dom": ">=19.0.0-rc.0",
31
- "@kopexa/theme": "17.27.2"
31
+ "@kopexa/theme": "17.27.3"
32
32
  },
33
33
  "dependencies": {
34
34
  "@base-ui/react": "^1.1.0",
35
35
  "@radix-ui/react-accordion": "^1.2.12",
36
- "@kopexa/shared-utils": "17.0.76",
37
- "@kopexa/icons": "17.10.5",
38
- "@kopexa/react-utils": "17.1.18"
36
+ "@kopexa/icons": "17.10.6",
37
+ "@kopexa/react-utils": "17.1.19",
38
+ "@kopexa/shared-utils": "17.0.77"
39
39
  },
40
40
  "clean-package": "../../../clean-package.config.json",
41
41
  "module": "dist/index.mjs",