@tecsinapse/cortex-react 1.9.22 → 1.9.24-beta.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.
- package/dist/cjs/components/Popover/Provider.js +7 -1
- package/dist/cjs/components/Popover/Trigger.js +1 -4
- package/dist/cjs/components/Select/Root.js +9 -1
- package/dist/cjs/components/Select/Trigger.js +1 -1
- package/dist/cjs/hooks/useFloatingElement.js +3 -2
- package/dist/cjs/styles/stepNodeVariants.js +1 -1
- package/dist/esm/components/Popover/Provider.js +7 -1
- package/dist/esm/components/Popover/Trigger.js +1 -4
- package/dist/esm/components/Select/Root.js +9 -1
- package/dist/esm/components/Select/Trigger.js +1 -1
- package/dist/esm/hooks/useFloatingElement.js +3 -2
- package/dist/esm/styles/stepNodeVariants.js +1 -1
- package/dist/types/components/Popover/Provider.d.ts +3 -1
- package/dist/types/components/Popover/Trigger.d.ts +1 -1
- package/dist/types/components/Popover/index.d.ts +2 -2
- package/dist/types/hooks/useFloatingElement.d.ts +2 -1
- package/package.json +2 -2
|
@@ -14,9 +14,15 @@ const PopoverProvider = ({
|
|
|
14
14
|
children,
|
|
15
15
|
placement,
|
|
16
16
|
trigger,
|
|
17
|
+
fallbackPlacements,
|
|
17
18
|
...props
|
|
18
19
|
}) => {
|
|
19
|
-
const floatingLogic = useFloatingElement.useFloatingElement({
|
|
20
|
+
const floatingLogic = useFloatingElement.useFloatingElement({
|
|
21
|
+
placement,
|
|
22
|
+
trigger,
|
|
23
|
+
fallbackPlacements,
|
|
24
|
+
...props
|
|
25
|
+
});
|
|
20
26
|
return /* @__PURE__ */ React.createElement(Context.Context.Provider, { value: { ...floatingLogic } }, children);
|
|
21
27
|
};
|
|
22
28
|
|
|
@@ -11,10 +11,7 @@ const isDisabledProps = {
|
|
|
11
11
|
onKeyUp: () => void 0,
|
|
12
12
|
onPointerDown: () => void 0
|
|
13
13
|
};
|
|
14
|
-
const PopoverTrigger = ({
|
|
15
|
-
children,
|
|
16
|
-
disabled = false
|
|
17
|
-
}) => {
|
|
14
|
+
const PopoverTrigger = ({ children, disabled }) => {
|
|
18
15
|
const { triggerProps } = Context.usePopoverContext();
|
|
19
16
|
const isDisabled = disabled ?? children.props?.disabled;
|
|
20
17
|
return react.cloneWithProps(children, {
|
|
@@ -12,7 +12,15 @@ const SelectRoot = ({
|
|
|
12
12
|
labelExtractor,
|
|
13
13
|
className
|
|
14
14
|
}) => {
|
|
15
|
-
return /* @__PURE__ */ React.createElement(
|
|
15
|
+
return /* @__PURE__ */ React.createElement(
|
|
16
|
+
index.Popover.Root,
|
|
17
|
+
{
|
|
18
|
+
fallbackPlacements: ["bottom", "top"],
|
|
19
|
+
placement: "bottom",
|
|
20
|
+
trigger: "click"
|
|
21
|
+
},
|
|
22
|
+
/* @__PURE__ */ React.createElement(context.SelectContext.Provider, { value: { value, keyExtractor, labelExtractor } }, /* @__PURE__ */ React.createElement(Content.Content, { className }, children))
|
|
23
|
+
);
|
|
16
24
|
};
|
|
17
25
|
|
|
18
26
|
exports.SelectRoot = SelectRoot;
|
|
@@ -23,7 +23,7 @@ const SelectTrigger = ({
|
|
|
23
23
|
return labelExtractor(value);
|
|
24
24
|
}, [label, value]);
|
|
25
25
|
const { className } = rest;
|
|
26
|
-
return /* @__PURE__ */ React.createElement(index.Popover.Trigger,
|
|
26
|
+
return /* @__PURE__ */ React.createElement(index.Popover.Trigger, { disabled }, /* @__PURE__ */ React.createElement(
|
|
27
27
|
"button",
|
|
28
28
|
{
|
|
29
29
|
className: button({ className }),
|
|
@@ -10,7 +10,8 @@ const useFloatingElement = ({
|
|
|
10
10
|
arrowRef,
|
|
11
11
|
controlled,
|
|
12
12
|
isOpen,
|
|
13
|
-
setIsOpen
|
|
13
|
+
setIsOpen,
|
|
14
|
+
fallbackPlacements = ["right", "bottom", "left", "top"]
|
|
14
15
|
}) => {
|
|
15
16
|
const [openUncontrolled, onOpenChangeUncontrolled] = React.useState(false);
|
|
16
17
|
const { x, y, strategy, refs, update, context, floatingStyles } = react.useFloating(
|
|
@@ -23,7 +24,7 @@ const useFloatingElement = ({
|
|
|
23
24
|
react.offset(10),
|
|
24
25
|
react.flip({
|
|
25
26
|
flipAlignment: true,
|
|
26
|
-
fallbackPlacements
|
|
27
|
+
fallbackPlacements
|
|
27
28
|
}),
|
|
28
29
|
react.shift(),
|
|
29
30
|
...arrowRef ? [react.arrow({ element: arrowRef })] : []
|
|
@@ -4,7 +4,7 @@ var tailwindVariants = require('tailwind-variants');
|
|
|
4
4
|
|
|
5
5
|
const StepNodeVariants = tailwindVariants.tv({
|
|
6
6
|
slots: {
|
|
7
|
-
container: "flex flex-col items-center justify-center text-center w-full
|
|
7
|
+
container: "flex flex-col items-center justify-center text-center w-full",
|
|
8
8
|
content: "flex p-mili text-center w-full text-sub justify-center font-bold",
|
|
9
9
|
separator: "h-micro w-full"
|
|
10
10
|
},
|
|
@@ -12,9 +12,15 @@ const PopoverProvider = ({
|
|
|
12
12
|
children,
|
|
13
13
|
placement,
|
|
14
14
|
trigger,
|
|
15
|
+
fallbackPlacements,
|
|
15
16
|
...props
|
|
16
17
|
}) => {
|
|
17
|
-
const floatingLogic = useFloatingElement({
|
|
18
|
+
const floatingLogic = useFloatingElement({
|
|
19
|
+
placement,
|
|
20
|
+
trigger,
|
|
21
|
+
fallbackPlacements,
|
|
22
|
+
...props
|
|
23
|
+
});
|
|
18
24
|
return /* @__PURE__ */ React__default.createElement(Context.Provider, { value: { ...floatingLogic } }, children);
|
|
19
25
|
};
|
|
20
26
|
|
|
@@ -9,10 +9,7 @@ const isDisabledProps = {
|
|
|
9
9
|
onKeyUp: () => void 0,
|
|
10
10
|
onPointerDown: () => void 0
|
|
11
11
|
};
|
|
12
|
-
const PopoverTrigger = ({
|
|
13
|
-
children,
|
|
14
|
-
disabled = false
|
|
15
|
-
}) => {
|
|
12
|
+
const PopoverTrigger = ({ children, disabled }) => {
|
|
16
13
|
const { triggerProps } = usePopoverContext();
|
|
17
14
|
const isDisabled = disabled ?? children.props?.disabled;
|
|
18
15
|
return cloneWithProps(children, {
|
|
@@ -10,7 +10,15 @@ const SelectRoot = ({
|
|
|
10
10
|
labelExtractor,
|
|
11
11
|
className
|
|
12
12
|
}) => {
|
|
13
|
-
return /* @__PURE__ */ React__default.createElement(
|
|
13
|
+
return /* @__PURE__ */ React__default.createElement(
|
|
14
|
+
Popover.Root,
|
|
15
|
+
{
|
|
16
|
+
fallbackPlacements: ["bottom", "top"],
|
|
17
|
+
placement: "bottom",
|
|
18
|
+
trigger: "click"
|
|
19
|
+
},
|
|
20
|
+
/* @__PURE__ */ React__default.createElement(SelectContext.Provider, { value: { value, keyExtractor, labelExtractor } }, /* @__PURE__ */ React__default.createElement(Content, { className }, children))
|
|
21
|
+
);
|
|
14
22
|
};
|
|
15
23
|
|
|
16
24
|
export { SelectRoot };
|
|
@@ -21,7 +21,7 @@ const SelectTrigger = ({
|
|
|
21
21
|
return labelExtractor(value);
|
|
22
22
|
}, [label, value]);
|
|
23
23
|
const { className } = rest;
|
|
24
|
-
return /* @__PURE__ */ React__default.createElement(Popover.Trigger,
|
|
24
|
+
return /* @__PURE__ */ React__default.createElement(Popover.Trigger, { disabled }, /* @__PURE__ */ React__default.createElement(
|
|
25
25
|
"button",
|
|
26
26
|
{
|
|
27
27
|
className: button({ className }),
|
|
@@ -8,7 +8,8 @@ const useFloatingElement = ({
|
|
|
8
8
|
arrowRef,
|
|
9
9
|
controlled,
|
|
10
10
|
isOpen,
|
|
11
|
-
setIsOpen
|
|
11
|
+
setIsOpen,
|
|
12
|
+
fallbackPlacements = ["right", "bottom", "left", "top"]
|
|
12
13
|
}) => {
|
|
13
14
|
const [openUncontrolled, onOpenChangeUncontrolled] = useState(false);
|
|
14
15
|
const { x, y, strategy, refs, update, context, floatingStyles } = useFloating(
|
|
@@ -21,7 +22,7 @@ const useFloatingElement = ({
|
|
|
21
22
|
offset(10),
|
|
22
23
|
flip({
|
|
23
24
|
flipAlignment: true,
|
|
24
|
-
fallbackPlacements
|
|
25
|
+
fallbackPlacements
|
|
25
26
|
}),
|
|
26
27
|
shift(),
|
|
27
28
|
...arrowRef ? [arrow({ element: arrowRef })] : []
|
|
@@ -2,7 +2,7 @@ import { tv } from 'tailwind-variants';
|
|
|
2
2
|
|
|
3
3
|
const StepNodeVariants = tv({
|
|
4
4
|
slots: {
|
|
5
|
-
container: "flex flex-col items-center justify-center text-center w-full
|
|
5
|
+
container: "flex flex-col items-center justify-center text-center w-full",
|
|
6
6
|
content: "flex p-mili text-center w-full text-sub justify-center font-bold",
|
|
7
7
|
separator: "h-micro w-full"
|
|
8
8
|
},
|
|
@@ -4,14 +4,16 @@ export interface ControlledProps {
|
|
|
4
4
|
controlled: true;
|
|
5
5
|
isOpen: boolean;
|
|
6
6
|
setIsOpen: Dispatch<SetStateAction<boolean>>;
|
|
7
|
+
fallbackPlacements?: Array<Placement>;
|
|
7
8
|
}
|
|
8
9
|
export interface UncontrolledProviderProps {
|
|
9
10
|
children: ReactNode;
|
|
10
11
|
placement?: Placement;
|
|
12
|
+
fallbackPlacements?: Array<Placement>;
|
|
11
13
|
trigger?: 'hover' | 'click';
|
|
12
14
|
controlled?: false;
|
|
13
15
|
}
|
|
14
16
|
export interface ControlledPopoverProviderProps extends Omit<UncontrolledProviderProps, 'controlled'>, ControlledProps {
|
|
15
17
|
}
|
|
16
18
|
export type PopoverProviderProps = UncontrolledProviderProps | ControlledPopoverProviderProps;
|
|
17
|
-
export declare const PopoverProvider: ({ children, placement, trigger, ...props }: PopoverProviderProps) => React.JSX.Element;
|
|
19
|
+
export declare const PopoverProvider: ({ children, placement, trigger, fallbackPlacements, ...props }: PopoverProviderProps) => React.JSX.Element;
|
|
@@ -3,4 +3,4 @@ export interface PopoverTriggerProps {
|
|
|
3
3
|
children: React.ReactElement;
|
|
4
4
|
disabled?: boolean;
|
|
5
5
|
}
|
|
6
|
-
export declare const PopoverTrigger: ({ children, disabled
|
|
6
|
+
export declare const PopoverTrigger: ({ children, disabled }: PopoverTriggerProps) => React.FunctionComponentElement<any>;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export declare const Popover: {
|
|
2
2
|
Root: ({ children, placement, trigger, ...props }: import("./Root").PopoverRootProps) => import("react").JSX.Element;
|
|
3
|
-
Trigger: ({ children, disabled
|
|
3
|
+
Trigger: ({ children, disabled }: import("./Trigger").PopoverTriggerProps) => import("react").FunctionComponentElement<any>;
|
|
4
4
|
Content: ({ children, className, modal, ...rest }: import("./Content").PopoverContentProps) => import("react").JSX.Element;
|
|
5
|
-
Provider: ({ children, placement, trigger, ...props }: import("./Provider").PopoverProviderProps) => import("react").JSX.Element;
|
|
5
|
+
Provider: ({ children, placement, trigger, fallbackPlacements, ...props }: import("./Provider").PopoverProviderProps) => import("react").JSX.Element;
|
|
6
6
|
};
|
|
@@ -12,8 +12,9 @@ export interface FloatingElementProps {
|
|
|
12
12
|
controlled?: boolean;
|
|
13
13
|
isOpen?: boolean;
|
|
14
14
|
setIsOpen?: Dispatch<SetStateAction<boolean>> | undefined;
|
|
15
|
+
fallbackPlacements?: Array<Placement>;
|
|
15
16
|
}
|
|
16
|
-
export declare const useFloatingElement: ({ placement, trigger, delay, arrowRef, controlled, isOpen, setIsOpen, }: FloatingElementProps) => {
|
|
17
|
+
export declare const useFloatingElement: ({ placement, trigger, delay, arrowRef, controlled, isOpen, setIsOpen, fallbackPlacements, }: FloatingElementProps) => {
|
|
17
18
|
isOpen: boolean;
|
|
18
19
|
setIsOpen: Dispatch<SetStateAction<boolean>>;
|
|
19
20
|
x: number;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tecsinapse/cortex-react",
|
|
3
|
-
"version": "1.9.
|
|
3
|
+
"version": "1.9.24-beta.0",
|
|
4
4
|
"description": "React components based in @tecsinapse/cortex-core",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "dist/esm/index.js",
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"react-dom": ">=18.0.0",
|
|
49
49
|
"tailwind": ">=3.3.0"
|
|
50
50
|
},
|
|
51
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "83bce55599f2e5446609d025102aae1712106b1b"
|
|
52
52
|
}
|