@tecsinapse/cortex-react 2.2.2 → 2.3.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.
Files changed (9) hide show
  1. package/dist/cjs/components/Accordion/Root.js +6 -0
  2. package/dist/cjs/components/Accordion/Trigger.js +29 -9
  3. package/dist/esm/components/Accordion/Root.js +6 -0
  4. package/dist/esm/components/Accordion/Trigger.js +29 -9
  5. package/dist/types/components/Accordion/Root.d.ts +1 -1
  6. package/dist/types/components/Accordion/Trigger.d.ts +1 -1
  7. package/dist/types/components/Accordion/index.d.ts +2 -2
  8. package/dist/types/components/Accordion/types.d.ts +3 -0
  9. package/package.json +2 -2
package/dist/cjs/components/Accordion/Root.js CHANGED
@@ -10,6 +10,9 @@ const AccordionRoot = ({
10
10
  defaultOpen,
11
11
  label,
12
12
  floating,
13
+ showDivider,
14
+ showArrowBorder,
15
+ arrowPosition,
13
16
  onOpen,
14
17
  invertedArrow,
15
18
  onClose,
@@ -23,6 +26,9 @@ const AccordionRoot = ({
23
26
  floating,
24
27
  onOpen,
25
28
  onClose,
29
+ showDivider,
30
+ showArrowBorder,
31
+ arrowPosition,
26
32
  invertedArrow,
27
33
  direction
28
34
  }
package/dist/cjs/components/Accordion/Trigger.js CHANGED
@@ -7,7 +7,11 @@ var context = require('./context.js');
7
7
 
8
8
  const AccordionTrigger = ({
9
9
  label,
10
+ children,
10
11
  floating = false,
12
+ arrowPosition = "left",
13
+ showDivider = true,
14
+ showArrowBorder = true,
11
15
  /**
12
16
  * Only applied to trigger arrow
13
17
  */
@@ -18,9 +22,9 @@ const AccordionTrigger = ({
18
22
  direction = "horizontal"
19
23
  }) => {
20
24
  const { open, toggle } = context.useAccordionContext();
21
- if (!floating && !label) {
25
+ if (!floating && !label && !children) {
22
26
  throw new Error(
23
- "A label must be specified if the trigger is not floating variant"
27
+ "A label or children must be specified if the trigger is not floating variant"
24
28
  );
25
29
  }
26
30
  const action = () => {
@@ -35,25 +39,41 @@ const AccordionTrigger = ({
35
39
  "div",
36
40
  {
37
41
  className: clsx(
38
- "flex justify-between align-center border-secondary-light cursor-pointer",
42
+ "flex justify-between align-center cursor-pointer",
39
43
  { "mr-deca": floating && direction === "horizontal" },
40
44
  { "mb-deca": floating && direction === "vertical" },
41
- { "border-r flex-col px-mili": direction === "horizontal" },
42
- { "border-b py-mili": direction === "vertical" }
45
+ {
46
+ "border-r border-secondary-light flex-col px-mili": direction === "horizontal"
47
+ },
48
+ {
49
+ "border-b border-secondary-light py-mili": showDivider && direction === "vertical"
50
+ }
43
51
  ),
44
52
  onClick: action,
45
53
  children: [
54
+ !floating && arrowPosition === "right" && /* @__PURE__ */ jsxRuntime.jsx(
55
+ "span",
56
+ {
57
+ className: clsx({
58
+ "-rotate-180 [writing-mode:vertical-lr]": direction === "horizontal"
59
+ }),
60
+ children: children ?? label
61
+ }
62
+ ),
46
63
  /* @__PURE__ */ jsxRuntime.jsx(
47
64
  "div",
48
65
  {
49
66
  className: clsx(
50
- "rounded-mili border border-secondary-light flex align-center justify-center p-micro",
67
+ "rounded-mili flex align-center justify-center p-micro",
51
68
  {
52
69
  "absolute -translate-x-micro translate-y-deca bg-white": floating && direction === "horizontal"
53
70
  },
54
71
  {
55
72
  "absolute -translate-y-micro translate-x-deca bg-white": floating && direction === "vertical"
56
73
  },
74
+ {
75
+ "border border-secondary-light": showArrowBorder
76
+ },
57
77
  className
58
78
  ),
59
79
  children: direction === "horizontal" ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -79,15 +99,15 @@ const AccordionTrigger = ({
79
99
  )
80
100
  }
81
101
  ),
82
- !floating ? /* @__PURE__ */ jsxRuntime.jsx(
102
+ !floating && arrowPosition === "left" && /* @__PURE__ */ jsxRuntime.jsx(
83
103
  "span",
84
104
  {
85
105
  className: clsx({
86
106
  "-rotate-180 [writing-mode:vertical-lr]": direction === "horizontal"
87
107
  }),
88
- children: label
108
+ children: children ?? label
89
109
  }
90
- ) : null
110
+ )
91
111
  ]
92
112
  }
93
113
  );
package/dist/esm/components/Accordion/Root.js CHANGED
@@ -8,6 +8,9 @@ const AccordionRoot = ({
8
8
  defaultOpen,
9
9
  label,
10
10
  floating,
11
+ showDivider,
12
+ showArrowBorder,
13
+ arrowPosition,
11
14
  onOpen,
12
15
  invertedArrow,
13
16
  onClose,
@@ -21,6 +24,9 @@ const AccordionRoot = ({
21
24
  floating,
22
25
  onOpen,
23
26
  onClose,
27
+ showDivider,
28
+ showArrowBorder,
29
+ arrowPosition,
24
30
  invertedArrow,
25
31
  direction
26
32
  }
package/dist/esm/components/Accordion/Trigger.js CHANGED
@@ -5,7 +5,11 @@ import { useAccordionContext } from './context.js';
5
5
 
6
6
  const AccordionTrigger = ({
7
7
  label,
8
+ children,
8
9
  floating = false,
10
+ arrowPosition = "left",
11
+ showDivider = true,
12
+ showArrowBorder = true,
9
13
  /**
10
14
  * Only applied to trigger arrow
11
15
  */
@@ -16,9 +20,9 @@ const AccordionTrigger = ({
16
20
  direction = "horizontal"
17
21
  }) => {
18
22
  const { open, toggle } = useAccordionContext();
19
- if (!floating && !label) {
23
+ if (!floating && !label && !children) {
20
24
  throw new Error(
21
- "A label must be specified if the trigger is not floating variant"
25
+ "A label or children must be specified if the trigger is not floating variant"
22
26
  );
23
27
  }
24
28
  const action = () => {
@@ -33,25 +37,41 @@ const AccordionTrigger = ({
33
37
  "div",
34
38
  {
35
39
  className: clsx(
36
- "flex justify-between align-center border-secondary-light cursor-pointer",
40
+ "flex justify-between align-center cursor-pointer",
37
41
  { "mr-deca": floating && direction === "horizontal" },
38
42
  { "mb-deca": floating && direction === "vertical" },
39
- { "border-r flex-col px-mili": direction === "horizontal" },
40
- { "border-b py-mili": direction === "vertical" }
43
+ {
44
+ "border-r border-secondary-light flex-col px-mili": direction === "horizontal"
45
+ },
46
+ {
47
+ "border-b border-secondary-light py-mili": showDivider && direction === "vertical"
48
+ }
41
49
  ),
42
50
  onClick: action,
43
51
  children: [
52
+ !floating && arrowPosition === "right" && /* @__PURE__ */ jsx(
53
+ "span",
54
+ {
55
+ className: clsx({
56
+ "-rotate-180 [writing-mode:vertical-lr]": direction === "horizontal"
57
+ }),
58
+ children: children ?? label
59
+ }
60
+ ),
44
61
  /* @__PURE__ */ jsx(
45
62
  "div",
46
63
  {
47
64
  className: clsx(
48
- "rounded-mili border border-secondary-light flex align-center justify-center p-micro",
65
+ "rounded-mili flex align-center justify-center p-micro",
49
66
  {
50
67
  "absolute -translate-x-micro translate-y-deca bg-white": floating && direction === "horizontal"
51
68
  },
52
69
  {
53
70
  "absolute -translate-y-micro translate-x-deca bg-white": floating && direction === "vertical"
54
71
  },
72
+ {
73
+ "border border-secondary-light": showArrowBorder
74
+ },
55
75
  className
56
76
  ),
57
77
  children: direction === "horizontal" ? /* @__PURE__ */ jsx(
@@ -77,15 +97,15 @@ const AccordionTrigger = ({
77
97
  )
78
98
  }
79
99
  ),
80
- !floating ? /* @__PURE__ */ jsx(
100
+ !floating && arrowPosition === "left" && /* @__PURE__ */ jsx(
81
101
  "span",
82
102
  {
83
103
  className: clsx({
84
104
  "-rotate-180 [writing-mode:vertical-lr]": direction === "horizontal"
85
105
  }),
86
- children: label
106
+ children: children ?? label
87
107
  }
88
- ) : null
108
+ )
89
109
  ]
90
110
  }
91
111
  );
package/dist/types/components/Accordion/Root.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import { AccordionProps } from './types';
2
- export declare const AccordionRoot: ({ children, defaultOpen, label, floating, onOpen, invertedArrow, onClose, direction, }: AccordionProps) => import("react/jsx-runtime").JSX.Element;
2
+ export declare const AccordionRoot: ({ children, defaultOpen, label, floating, showDivider, showArrowBorder, arrowPosition, onOpen, invertedArrow, onClose, direction, }: AccordionProps) => import("react/jsx-runtime").JSX.Element;
package/dist/types/components/Accordion/Trigger.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import { AccordionProps } from './types';
2
- export declare const AccordionTrigger: ({ label, floating, className, onOpen, onClose, invertedArrow, direction, }: Pick<AccordionProps, "floating" | "label" | "onOpen" | "onClose" | "invertedArrow" | "direction"> & {
2
+ export declare const AccordionTrigger: ({ label, children, floating, arrowPosition, showDivider, showArrowBorder, className, onOpen, onClose, invertedArrow, direction, }: Pick<AccordionProps, "floating" | "arrowPosition" | "showDivider" | "showArrowBorder" | "label" | "children" | "onOpen" | "onClose" | "invertedArrow" | "direction"> & {
3
3
  className?: string;
4
4
  }) => import("react/jsx-runtime").JSX.Element;
package/dist/types/components/Accordion/index.d.ts CHANGED
@@ -1,8 +1,8 @@
1
1
  export declare const Accordion: {
2
- Root: ({ children, defaultOpen, label, floating, onOpen, invertedArrow, onClose, direction, }: import("./types").AccordionProps) => import("react/jsx-runtime").JSX.Element;
2
+ Root: ({ children, defaultOpen, label, floating, showDivider, showArrowBorder, arrowPosition, onOpen, invertedArrow, onClose, direction, }: import("./types").AccordionProps) => import("react/jsx-runtime").JSX.Element;
3
3
  Face: ({ children, defaultOpen, direction, }: Pick<import("./types").AccordionProps, "children" | "defaultOpen" | "direction">) => import("react/jsx-runtime").JSX.Element;
4
4
  Content: ({ children, direction, }: Pick<import("./types").AccordionProps, "children" | "direction">) => import("react/jsx-runtime").JSX.Element;
5
- Trigger: ({ label, floating, className, onOpen, onClose, invertedArrow, direction, }: Pick<import("./types").AccordionProps, "floating" | "label" | "onOpen" | "onClose" | "invertedArrow" | "direction"> & {
5
+ Trigger: ({ label, children, floating, arrowPosition, showDivider, showArrowBorder, className, onOpen, onClose, invertedArrow, direction, }: Pick<import("./types").AccordionProps, "floating" | "arrowPosition" | "showDivider" | "showArrowBorder" | "label" | "children" | "onOpen" | "onClose" | "invertedArrow" | "direction"> & {
6
6
  className?: string;
7
7
  }) => import("react/jsx-runtime").JSX.Element;
8
8
  };
package/dist/types/components/Accordion/types.d.ts CHANGED
@@ -3,6 +3,9 @@ export interface AccordionProps {
3
3
  defaultOpen?: boolean;
4
4
  label?: string;
5
5
  floating?: boolean;
6
+ showArrowBorder?: boolean;
7
+ showDivider?: boolean;
8
+ arrowPosition?: 'left' | 'right';
6
9
  onOpen?: () => void;
7
10
  onClose?: () => void;
8
11
  invertedArrow?: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tecsinapse/cortex-react",
3
- "version": "2.2.2",
3
+ "version": "2.3.0",
4
4
  "description": "React components based in @tecsinapse/cortex-core",
5
5
  "license": "MIT",
6
6
  "main": "dist/esm/index.js",
@@ -50,5 +50,5 @@
50
50
  "react-icons": ">=5.2.0",
51
51
  "tailwindcss": "^4.1.16"
52
52
  },
53
- "gitHead": "ac45f443e4d90f67261fba76b2e7568f79380f3a"
53
+ "gitHead": "f0d4f613efb9659f0ce42db9cd8d6cd4c1106c67"
54
54
  }