@apipass/design-system 4.1.0 → 4.2.1
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/lib/embedded-styles.js +1 -1
- package/dist/lib/lib.index.cjs +1 -1
- package/dist/lib/lib.index.js +696 -694
- package/dist/lib/lib.index.js.map +1 -1
- package/dist/lib/style.css +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.cjs +1 -1
- package/dist/lib/ui/components/Widget/Widget.cjs +1 -1
- package/dist/lib/ui/components/WidgetGrid/WidgetGrid.cjs +1 -1
- package/dist/lib/ui/primitives/Button/Button.cjs +1 -1
- package/dist/lib/ui/primitives/CodeBlock/CodeBlock.cjs +1 -1
- package/dist/lib/ui/primitives/CodeEditor/CodeEditor.cjs +1 -1
- package/dist/lib/ui/primitives/ComboBox/ComboBox.cjs +1 -1
- package/dist/lib/ui/primitives/ComboBox/ComboBox.cjs.map +1 -1
- package/dist/lib/ui/primitives/ComboBox/ComboBox.js +60 -37
- package/dist/lib/ui/primitives/ComboBox/ComboBox.js.map +1 -1
- package/dist/lib/ui/primitives/DateRangePicker/DateRangePicker.cjs +1 -1
- package/dist/lib/ui/primitives/FileUpload/FileUpload.cjs +1 -1
- package/dist/lib/ui/primitives/FileUpload/FileUpload.js +10 -10
- package/dist/lib/ui/primitives/IconButton/IconButton.cjs +1 -1
- package/dist/lib/ui/primitives/Input/Input.js +2 -2
- package/dist/lib/ui/primitives/JsonViewer/JsonEditor.cjs +1 -1
- package/dist/lib/ui/primitives/JsonViewer/JsonViewer.cjs +1 -1
- package/dist/lib/ui/primitives/Link/Link.cjs +1 -1
- package/dist/lib/ui/primitives/Link/Link.js +3 -3
- package/dist/lib/ui/primitives/Menu/Menu.cjs +1 -1
- package/dist/lib/ui/primitives/Menu/Menu.cjs.map +1 -1
- package/dist/lib/ui/primitives/Menu/Menu.js +28 -28
- package/dist/lib/ui/primitives/Menu/Menu.js.map +1 -1
- package/dist/lib/ui/primitives/Search/Search.cjs +1 -1
- package/dist/lib/ui/primitives/Search/Search.js +8 -8
- package/dist/lib/ui/primitives/Select/MultiSelect.cjs +2 -0
- package/dist/lib/ui/primitives/Select/MultiSelect.cjs.map +1 -0
- package/dist/lib/ui/primitives/Select/MultiSelect.js +113 -0
- package/dist/lib/ui/primitives/Select/MultiSelect.js.map +1 -0
- package/dist/lib/ui/primitives/Select/Select.cjs +1 -1
- package/dist/lib/ui/primitives/Select/Select.cjs.map +1 -1
- package/dist/lib/ui/primitives/Select/Select.js +19 -12
- package/dist/lib/ui/primitives/Select/Select.js.map +1 -1
- package/dist/lib/vendor/@monaco-editor/react/dist/index.cjs +1 -1
- package/dist/lib/vendor/@monaco-editor/react/dist/index.cjs.map +1 -1
- package/dist/lib/vendor/@monaco-editor/react/dist/index.js +21 -21
- package/dist/lib/vendor/@react-aria/interactions/dist/useFocusable.cjs +1 -1
- package/dist/lib/vendor/@react-aria/interactions/dist/useFocusable.js +4 -4
- package/dist/lib/vendor/@react-aria/ssr/dist/SSRProvider.js.map +1 -1
- package/dist/lib/vendor/@react-stately/utils/dist/useControlledState.cjs +1 -1
- package/dist/lib/vendor/react-draggable/build/cjs/Draggable.cjs +2 -2
- package/dist/lib/vendor/react-draggable/build/cjs/Draggable.js +8 -8
- package/dist/lib/vendor/react-grid-layout/build/GridItem.cjs +1 -1
- package/dist/lib/vendor/react-grid-layout/build/ReactGridLayout.cjs +1 -1
- package/dist/lib/vendor/react-grid-layout/build/ReactGridLayout.js +6 -6
- package/dist/lib/vendor/react-grid-layout/build/ReactGridLayout.js.map +1 -1
- package/dist/lib/vendor/react-grid-layout/build/ReactGridLayoutPropTypes.js +2 -2
- package/dist/lib/vendor/react-grid-layout/build/ResponsiveReactGridLayout.cjs +1 -1
- package/dist/lib/vendor/react-grid-layout/build/ResponsiveReactGridLayout.js.map +1 -1
- package/dist/lib/vendor/react-grid-layout/build/components/WidthProvider.cjs +1 -1
- package/dist/lib/vendor/react-grid-layout/build/components/WidthProvider.js +6 -6
- package/dist/lib/vendor/react-grid-layout/build/components/WidthProvider.js.map +1 -1
- package/dist/lib/vendor/react-grid-layout/build/utils.cjs +1 -1
- package/dist/lib/vendor/react-grid-layout/build/utils.js +27 -27
- package/dist/lib/vendor/react-resizable/build/Resizable.cjs +1 -1
- package/dist/lib/vendor/react-resizable/build/Resizable.js +17 -17
- package/dist/lib/vendor/react-resizable/build/Resizable.js.map +1 -1
- package/dist/lib/vendor/react-resizable/build/ResizableBox.cjs +1 -1
- package/dist/lib/vendor/react-resizable/build/ResizableBox.js +5 -5
- package/dist/lib/vendor/react-resizable/build/ResizableBox.js.map +1 -1
- package/dist/lib/vendor/react-resizable/build/utils.cjs +1 -1
- package/dist/lib/vendor/react-resizable/build/utils.cjs.map +1 -1
- package/dist/lib/vendor/react-resizable/build/utils.js +2 -2
- package/dist/lib/vendor/react-toastify/dist/index.cjs +1 -1
- package/dist/lib/vendor/react-toastify/dist/index.js +10 -10
- package/dist/types/ui/primitives/Select/MultiSelect.d.ts +15 -0
- package/dist/types/ui/primitives/index.d.ts +1 -0
- package/package.json +1 -1
|
@@ -7,9 +7,9 @@ import { Menu as M, MenuTrigger as p, Popover as N, MenuItem as h, Separator as
|
|
|
7
7
|
import { IconChevronDown as v } from "../../icons/IconChevronDown.js";
|
|
8
8
|
import { Label as I, Description as x, Keyboard as y } from "../Fieldset/Fieldset.js";
|
|
9
9
|
import { IconButton as b } from "../IconButton/IconButton.js";
|
|
10
|
-
import { Button as
|
|
11
|
-
import { useOverlayPortalContainer as
|
|
12
|
-
import { TextHeading as
|
|
10
|
+
import { Button as C } from "../Button/Button.js";
|
|
11
|
+
import { useOverlayPortalContainer as P } from "../../hooks/useOverlayPortal.js";
|
|
12
|
+
import { TextHeading as S } from "../Text/Text.js";
|
|
13
13
|
let i = !1;
|
|
14
14
|
function c(n) {
|
|
15
15
|
i || u.Children.forEach(n, (e) => {
|
|
@@ -26,12 +26,12 @@ function c(n) {
|
|
|
26
26
|
}
|
|
27
27
|
});
|
|
28
28
|
}
|
|
29
|
-
function
|
|
29
|
+
function T({ className: n, ...e }) {
|
|
30
30
|
return c(
|
|
31
31
|
typeof e.children == "function" ? null : e.children
|
|
32
32
|
), /* @__PURE__ */ t(M, { className: o(n, "menu"), ...e });
|
|
33
33
|
}
|
|
34
|
-
function
|
|
34
|
+
function A({ ...n }) {
|
|
35
35
|
return /* @__PURE__ */ t(p, { ...n });
|
|
36
36
|
}
|
|
37
37
|
function z({
|
|
@@ -42,16 +42,16 @@ function z({
|
|
|
42
42
|
variant: s,
|
|
43
43
|
...l
|
|
44
44
|
}) {
|
|
45
|
-
return /* @__PURE__ */ m(
|
|
46
|
-
r ? /* @__PURE__ */ t(b, { variant: s, "aria-label": n, children: r }) : /* @__PURE__ */ t(
|
|
47
|
-
/* @__PURE__ */ t(
|
|
45
|
+
return /* @__PURE__ */ m(A, { children: [
|
|
46
|
+
r ? /* @__PURE__ */ t(b, { variant: s, "aria-label": n, children: r }) : /* @__PURE__ */ t(C, { variant: s, children: n }),
|
|
47
|
+
/* @__PURE__ */ t(B, { placement: a, children: /* @__PURE__ */ t(T, { ...l, children: e }) })
|
|
48
48
|
] });
|
|
49
49
|
}
|
|
50
|
-
function
|
|
50
|
+
function B({
|
|
51
51
|
UNSTABLE_portalContainer: n,
|
|
52
52
|
...e
|
|
53
53
|
}) {
|
|
54
|
-
const r =
|
|
54
|
+
const r = P();
|
|
55
55
|
return /* @__PURE__ */ t(
|
|
56
56
|
N,
|
|
57
57
|
{
|
|
@@ -67,31 +67,31 @@ function K({ className: n, ...e }) {
|
|
|
67
67
|
s && /* @__PURE__ */ t(v, {})
|
|
68
68
|
] }) });
|
|
69
69
|
}
|
|
70
|
-
function
|
|
70
|
+
function R({ className: n, ...e }) {
|
|
71
71
|
const r = o(n, "menu-header");
|
|
72
72
|
return /* @__PURE__ */ t("div", { ...e, className: r });
|
|
73
73
|
}
|
|
74
|
-
function
|
|
74
|
+
function U({ className: n, ...e }) {
|
|
75
75
|
const r = o(n, "menu-section");
|
|
76
76
|
return /* @__PURE__ */ t("div", { ...e, className: r });
|
|
77
77
|
}
|
|
78
|
-
function
|
|
78
|
+
function W({ className: n, ...e }) {
|
|
79
79
|
const r = o(n, "menu-heading");
|
|
80
|
-
return /* @__PURE__ */ t(
|
|
80
|
+
return /* @__PURE__ */ t(S, { ...e, className: r });
|
|
81
81
|
}
|
|
82
|
-
function
|
|
82
|
+
function _({ className: n, ...e }) {
|
|
83
83
|
const r = o(n, "menu-separator");
|
|
84
84
|
return /* @__PURE__ */ t(g, { ...e, className: r });
|
|
85
85
|
}
|
|
86
|
-
function
|
|
86
|
+
function k({ className: n, ...e }) {
|
|
87
87
|
const r = o(n, "menu-label");
|
|
88
88
|
return /* @__PURE__ */ t(I, { ...e, className: r });
|
|
89
89
|
}
|
|
90
|
-
function
|
|
90
|
+
function J({ className: n, ...e }) {
|
|
91
91
|
const r = o(n, "menu-description");
|
|
92
92
|
return /* @__PURE__ */ t(x, { ...e, className: r });
|
|
93
93
|
}
|
|
94
|
-
function
|
|
94
|
+
function Q({
|
|
95
95
|
children: n,
|
|
96
96
|
className: e,
|
|
97
97
|
...r
|
|
@@ -100,17 +100,17 @@ function R({
|
|
|
100
100
|
return /* @__PURE__ */ t(y, { ...r, className: a, children: n });
|
|
101
101
|
}
|
|
102
102
|
export {
|
|
103
|
-
|
|
103
|
+
T as Menu,
|
|
104
104
|
z as MenuButton,
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
105
|
+
J as MenuDescription,
|
|
106
|
+
R as MenuHeader,
|
|
107
|
+
W as MenuHeading,
|
|
108
108
|
K as MenuItem,
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
109
|
+
k as MenuLabel,
|
|
110
|
+
B as MenuPopover,
|
|
111
|
+
U as MenuSection,
|
|
112
|
+
_ as MenuSeparator,
|
|
113
|
+
Q as MenuShortcut,
|
|
114
|
+
A as MenuTrigger
|
|
115
115
|
};
|
|
116
116
|
//# sourceMappingURL=Menu.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Menu.js","sources":["../../../../../src/ui/primitives/Menu/Menu.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconChevronDown } from \"icons\";\nimport {\n Button,\n ButtonProps,\n Description,\n DescriptionProps,\n IconButton,\n Keyboard,\n KeyboardProps,\n Label,\n LabelProps,\n TextHeading,\n type TextHeadingProps,\n} from \"primitives\";\nimport React from \"react\";\nimport { PermissionGate } from \"../PermissionGate/PermissionGate\";\nimport {\n Menu as RACMenu,\n MenuItem as RACMenuItem,\n MenuTrigger as RACMenuTrigger,\n Popover as RACPopover,\n Separator as RACSeparator,\n type MenuItemProps as RACMenuItemProps,\n type MenuProps as RACMenuProps,\n type MenuTriggerProps as RACMenuTriggerProps,\n type PopoverProps as RACPopoverProps,\n type SeparatorProps as RACSeparatorProps,\n} from \"react-aria-components\";\nimport \"./menu.css\";\n\n/**\n * Aviso de desenvolvimento: um `PermissionGate` EM VOLTA de um `MenuItem` quebra\n * o menu. O collection builder do react-aria-components só entende nós de\n * coleção (`MenuItem`, `MenuSeparator`, `MenuSection`); o `<span>` que o gate\n * renderiza no ramo negado entra na coleção com `node` nulo e arrebenta a lista\n * encadeada de chaves — o item envolvido e todos os seguintes desaparecem, e se\n * ele for o primeiro filho o menu abre VAZIO, levando embora também os itens\n * permitidos. Não há erro no console, e a forma errada passa despercebida em QA\n * feito com um usuário que tem todas as permissões, porque o ramo que envolve só\n * é renderizado quando a ação é negada.\n *\n * O gate deve ficar DENTRO do item, em volta do conteúdo — ali é seguro, porque\n * o conteúdo do item é renderizado no DOM real, fora da coleção. Mesmo padrão\n * das ações de linha do `DataTable`.\n *\n * O aviso é incondicional, e não atrás de `process.env.NODE_ENV`: o build da lib\n * (`vite.lib.config.ts`) substitui essa variável pelo literal `\"production\"`, o\n * que transformaria o guard em código morto justamente nos consumidores. Só\n * dispara uma vez por sessão, e só quando já existe um bug na árvore.\n */\nlet hasWarnedAboutGateAroundItem = false;\n\nfunction warnOnGateAroundItem(children: React.ReactNode) {\n if (hasWarnedAboutGateAroundItem) return;\n React.Children.forEach(children, (child) => {\n if (!React.isValidElement(child)) return;\n if (child.type === React.Fragment) {\n warnOnGateAroundItem(\n (child.props as { children?: React.ReactNode }).children,\n );\n return;\n }\n if (child.type === PermissionGate) {\n hasWarnedAboutGateAroundItem = true;\n // eslint-disable-next-line no-console\n console.error(\n \"[design-system] Menu: PermissionGate não pode envolver um MenuItem — \" +\n \"o react-aria descarta esse item e os seguintes, e o menu abre vazio \" +\n \"quando ele é o primeiro. Mova o gate para dentro do MenuItem, em \" +\n \"volta do conteúdo do item.\",\n );\n }\n });\n}\n\nexport type MenuProps<T> = RACMenuProps<T>;\nexport function Menu<T extends object>({ className, ...props }: MenuProps<T>) {\n // children pode ser uma função nas coleções dinâmicas do react-aria.\n warnOnGateAroundItem(\n typeof props.children === \"function\" ? null : props.children,\n );\n return <RACMenu className={clsx(className, \"menu\")} {...props} />;\n}\n\nexport type MenuTriggerProps = RACMenuTriggerProps;\nexport function MenuTrigger({ ...props }: MenuTriggerProps) {\n return <RACMenuTrigger {...props} />;\n}\n\nexport interface MenuButtonProps<T>\n extends RACMenuProps<T>,\n Omit<RACMenuTriggerProps, \"children\"> {\n label: string;\n variant?: ButtonProps[\"variant\"];\n placement?: MenuPopoverProps[\"placement\"];\n icon?: React.ReactNode;\n}\nexport function MenuButton<T extends object>({\n label,\n children,\n icon,\n placement,\n variant,\n ...props\n}: MenuButtonProps<T>) {\n return (\n <MenuTrigger>\n {icon ? (\n <IconButton variant={variant} aria-label={label}>\n {icon}\n </IconButton>\n ) : (\n <Button variant={variant}>{label}</Button>\n )}\n <MenuPopover placement={placement}>\n <Menu {...props}>{children}</Menu>\n </MenuPopover>\n </MenuTrigger>\n );\n}\n\nexport type MenuPopoverProps = RACPopoverProps;\nexport function MenuPopover({\n UNSTABLE_portalContainer,\n ...props\n}: MenuPopoverProps) {\n // Sem container explícito o menu faz portal no document.body — fora da shadow\n // root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <RACPopover\n {...props}\n UNSTABLE_portalContainer={UNSTABLE_portalContainer ?? portalContainer}\n />\n );\n}\n\nexport type MenuItemProps = RACMenuItemProps;\nexport function MenuItem({ className, ...props }: MenuItemProps) {\n const classNames = clsx(className, \"menu-item\");\n const textValue =\n props.textValue ||\n (typeof props.children === \"string\" ? props.children : undefined);\n return (\n <RACMenuItem {...props} className={classNames} textValue={textValue}>\n {({ hasSubmenu }) => (\n <>\n {props.children}\n {hasSubmenu && <IconChevronDown />}\n </>\n )}\n </RACMenuItem>\n );\n}\n\nexport type MenuHeaderProps = React.ComponentPropsWithoutRef<\"div\">;\nexport function MenuHeader({ className, ...props }: MenuHeaderProps) {\n const classNames = clsx(className, \"menu-header\");\n return <div {...props} className={classNames} />;\n}\n\nexport type MenuSectionProps = React.ComponentPropsWithoutRef<\"div\">;\nexport function MenuSection({ className, ...props }: MenuSectionProps) {\n const classNames = clsx(className, \"menu-section\");\n return <div {...props} className={classNames} />;\n}\n\nexport type MenuHeadingProps = TextHeadingProps;\nexport function MenuHeading({ className, ...props }: MenuHeadingProps) {\n const classNames = clsx(className, \"menu-heading\");\n return <TextHeading {...props} className={classNames} />;\n}\n\nexport type MenuSeparatorProps = RACSeparatorProps;\nexport function MenuSeparator({ className, ...props }: MenuSeparatorProps) {\n const classNames = clsx(className, \"menu-separator\");\n return <RACSeparator {...props} className={classNames} />;\n}\n\nexport type MenuLabelProps = LabelProps;\nexport function MenuLabel({ className, ...props }: MenuLabelProps) {\n const classNames = clsx(className, \"menu-label\");\n return <Label {...props} className={classNames} />;\n}\n\nexport type MenuDescriptionProps = DescriptionProps;\nexport function MenuDescription({ className, ...props }: MenuDescriptionProps) {\n const classNames = clsx(className, \"menu-description\");\n return <Description {...props} className={classNames} />;\n}\n\nexport type MenuShortcutProps = KeyboardProps;\nexport function MenuShortcut({\n children,\n className,\n ...props\n}: MenuShortcutProps) {\n const classNames = clsx(className, \"menu-shortcut\");\n return (\n <Keyboard {...props} className={classNames}>\n {children}\n </Keyboard>\n );\n}\n"],"names":["hasWarnedAboutGateAroundItem","warnOnGateAroundItem","children","React","child","PermissionGate","Menu","className","props","jsx","RACMenu","clsx","MenuTrigger","RACMenuTrigger","MenuButton","label","icon","placement","variant","IconButton","Button","MenuPopover","UNSTABLE_portalContainer","portalContainer","useOverlayPortalContainer","RACPopover","MenuItem","classNames","textValue","RACMenuItem","hasSubmenu","jsxs","Fragment","IconChevronDown","MenuHeader","MenuSection","MenuHeading","TextHeading","MenuSeparator","RACSeparator","MenuLabel","Label","MenuDescription","Description","MenuShortcut","Keyboard"],"mappings":";;;;;;;;;;;;AAoDA,IAAIA,IAA+B;AAEnC,SAASC,EAAqBC,GAA2B;AACvD,EAAIF,KACJG,EAAM,SAAS,QAAQD,GAAU,CAACE,MAAU;AAC1C,QAAKD,EAAM,eAAeC,CAAK,GAC/B;AAAA,UAAIA,EAAM,SAASD,EAAM,UAAU;AACjC,QAAAF;AAAA,UACGG,EAAM,MAAyC;AAAA,QAAA;AAElD;AAAA,MACF;AACA,MAAIA,EAAM,SAASC,MACjBL,IAA+B,IAE/B,QAAQ;AAAA,QACN;AAAA,MAAA;AAAA;AAAA,EAMN,CAAC;AACH;AAGO,SAASM,EAAuB,EAAE,WAAAC,GAAW,GAAGC,KAAuB;AAE5E,SAAAP;AAAA,IACE,OAAOO,EAAM,YAAa,aAAa,OAAOA,EAAM;AAAA,EAAA,GAE/C,gBAAAC,EAACC,KAAQ,WAAWC,EAAKJ,GAAW,MAAM,GAAI,GAAGC,GAAO;AACjE;AAGO,SAASI,EAAY,EAAE,GAAGJ,KAA2B;AAC1D,SAAO,gBAAAC,EAACI,GAAA,EAAgB,GAAGL,EAAA,CAAO;AACpC;AAUO,SAASM,EAA6B;AAAA,EAC3C,OAAAC;AAAA,EACA,UAAAb;AAAA,EACA,MAAAc;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGV;AACL,GAAuB;AACrB,2BACGI,GAAA,EACE,UAAA;AAAA,IAAAI,IACC,gBAAAP,EAACU,GAAA,EAAW,SAAAD,GAAkB,cAAYH,GACvC,aACH,IAEA,gBAAAN,EAACW,GAAA,EAAO,SAAAF,GAAmB,UAAAH,GAAM;AAAA,IAEnC,gBAAAN,EAACY,KAAY,WAAAJ,GACX,UAAA,gBAAAR,EAACH,KAAM,GAAGE,GAAQ,UAAAN,GAAS,EAAA,CAC7B;AAAA,EAAA,GACF;AAEJ;AAGO,SAASmB,EAAY;AAAA,EAC1B,0BAAAC;AAAA,EACA,GAAGd;AACL,GAAqB;AAGnB,QAAMe,IAAkBC,EAAA;AACxB,SACE,gBAAAf;AAAA,IAACgB;AAAAA,IAAA;AAAA,MACE,GAAGjB;AAAA,MACJ,0BAA0Bc,KAA4BC;AAAA,IAAA;AAAA,EAAA;AAG5D;AAGO,SAASG,EAAS,EAAE,WAAAnB,GAAW,GAAGC,KAAwB;AAC/D,QAAMmB,IAAahB,EAAKJ,GAAW,WAAW,GACxCqB,IACJpB,EAAM,cACL,OAAOA,EAAM,YAAa,WAAWA,EAAM,WAAW;AACzD,SACE,gBAAAC,EAACoB,GAAA,EAAa,GAAGrB,GAAO,WAAWmB,GAAY,WAAAC,GAC5C,UAAA,CAAC,EAAE,YAAAE,EAAA,MACF,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAxB,EAAM;AAAA,IACNsB,uBAAeG,GAAA,CAAA,CAAgB;AAAA,EAAA,EAAA,CAClC,EAAA,CAEJ;AAEJ;AAGO,SAASC,EAAW,EAAE,WAAA3B,GAAW,GAAGC,KAA0B;AACnE,QAAMmB,IAAahB,EAAKJ,GAAW,aAAa;AAChD,SAAO,gBAAAE,EAAC,OAAA,EAAK,GAAGD,GAAO,WAAWmB,GAAY;AAChD;AAGO,SAASQ,EAAY,EAAE,WAAA5B,GAAW,GAAGC,KAA2B;AACrE,QAAMmB,IAAahB,EAAKJ,GAAW,cAAc;AACjD,SAAO,gBAAAE,EAAC,OAAA,EAAK,GAAGD,GAAO,WAAWmB,GAAY;AAChD;AAGO,SAASS,EAAY,EAAE,WAAA7B,GAAW,GAAGC,KAA2B;AACrE,QAAMmB,IAAahB,EAAKJ,GAAW,cAAc;AACjD,SAAO,gBAAAE,EAAC4B,GAAA,EAAa,GAAG7B,GAAO,WAAWmB,GAAY;AACxD;AAGO,SAASW,EAAc,EAAE,WAAA/B,GAAW,GAAGC,KAA6B;AACzE,QAAMmB,IAAahB,EAAKJ,GAAW,gBAAgB;AACnD,SAAO,gBAAAE,EAAC8B,GAAA,EAAc,GAAG/B,GAAO,WAAWmB,GAAY;AACzD;AAGO,SAASa,EAAU,EAAE,WAAAjC,GAAW,GAAGC,KAAyB;AACjE,QAAMmB,IAAahB,EAAKJ,GAAW,YAAY;AAC/C,SAAO,gBAAAE,EAACgC,GAAA,EAAO,GAAGjC,GAAO,WAAWmB,GAAY;AAClD;AAGO,SAASe,EAAgB,EAAE,WAAAnC,GAAW,GAAGC,KAA+B;AAC7E,QAAMmB,IAAahB,EAAKJ,GAAW,kBAAkB;AACrD,SAAO,gBAAAE,EAACkC,GAAA,EAAa,GAAGnC,GAAO,WAAWmB,GAAY;AACxD;AAGO,SAASiB,EAAa;AAAA,EAC3B,UAAA1C;AAAA,EACA,WAAAK;AAAA,EACA,GAAGC;AACL,GAAsB;AACpB,QAAMmB,IAAahB,EAAKJ,GAAW,eAAe;AAClD,2BACGsC,GAAA,EAAU,GAAGrC,GAAO,WAAWmB,GAC7B,UAAAzB,GACH;AAEJ;"}
|
|
1
|
+
{"version":3,"file":"Menu.js","sources":["../../../../../src/ui/primitives/Menu/Menu.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconChevronDown } from \"icons\";\nimport {\n Button,\n ButtonProps,\n Description,\n DescriptionProps,\n IconButton,\n Keyboard,\n KeyboardProps,\n Label,\n LabelProps,\n TextHeading,\n type TextHeadingProps,\n} from \"primitives\";\nimport React from \"react\";\nimport { PermissionGate } from \"../PermissionGate/PermissionGate\";\nimport {\n Menu as RACMenu,\n MenuItem as RACMenuItem,\n MenuTrigger as RACMenuTrigger,\n Popover as RACPopover,\n Separator as RACSeparator,\n type MenuItemProps as RACMenuItemProps,\n type MenuProps as RACMenuProps,\n type MenuTriggerProps as RACMenuTriggerProps,\n type PopoverProps as RACPopoverProps,\n type SeparatorProps as RACSeparatorProps,\n} from \"react-aria-components\";\nimport \"./menu.css\";\n\n/**\n * Aviso de desenvolvimento: um `PermissionGate` EM VOLTA de um `MenuItem` quebra\n * o menu. O collection builder do react-aria-components só entende nós de\n * coleção (`MenuItem`, `MenuSeparator`, `MenuSection`); o `<span>` que o gate\n * renderiza no ramo negado entra na coleção com `node` nulo e arrebenta a lista\n * encadeada de chaves — o item envolvido e todos os seguintes desaparecem, e se\n * ele for o primeiro filho o menu abre VAZIO, levando embora também os itens\n * permitidos. Não há erro no console, e a forma errada passa despercebida em QA\n * feito com um usuário que tem todas as permissões, porque o ramo que envolve só\n * é renderizado quando a ação é negada.\n *\n * O gate deve ficar DENTRO do item, em volta do conteúdo — ali é seguro, porque\n * o conteúdo do item é renderizado no DOM real, fora da coleção. Mesmo padrão\n * das ações de linha do `DataTable`.\n *\n * O aviso é incondicional, e não atrás de `process.env.NODE_ENV`: o build da lib\n * (`vite.lib.config.ts`) substitui essa variável pelo literal `\"production\"`, o\n * que transformaria o guard em código morto justamente nos consumidores. Só\n * dispara uma vez por sessão, e só quando já existe um bug na árvore.\n */\nlet hasWarnedAboutGateAroundItem = false;\n\nfunction warnOnGateAroundItem(children: React.ReactNode) {\n if (hasWarnedAboutGateAroundItem) return;\n React.Children.forEach(children, (child) => {\n if (!React.isValidElement(child)) return;\n if (child.type === React.Fragment) {\n warnOnGateAroundItem(\n (child.props as { children?: React.ReactNode }).children,\n );\n return;\n }\n if (child.type === PermissionGate) {\n hasWarnedAboutGateAroundItem = true;\n console.error(\n \"[design-system] Menu: PermissionGate não pode envolver um MenuItem — \" +\n \"o react-aria descarta esse item e os seguintes, e o menu abre vazio \" +\n \"quando ele é o primeiro. Mova o gate para dentro do MenuItem, em \" +\n \"volta do conteúdo do item.\",\n );\n }\n });\n}\n\nexport type MenuProps<T> = RACMenuProps<T>;\nexport function Menu<T extends object>({ className, ...props }: MenuProps<T>) {\n // children pode ser uma função nas coleções dinâmicas do react-aria.\n warnOnGateAroundItem(\n typeof props.children === \"function\" ? null : props.children,\n );\n return <RACMenu className={clsx(className, \"menu\")} {...props} />;\n}\n\nexport type MenuTriggerProps = RACMenuTriggerProps;\nexport function MenuTrigger({ ...props }: MenuTriggerProps) {\n return <RACMenuTrigger {...props} />;\n}\n\nexport interface MenuButtonProps<T>\n extends RACMenuProps<T>,\n Omit<RACMenuTriggerProps, \"children\"> {\n label: string;\n variant?: ButtonProps[\"variant\"];\n placement?: MenuPopoverProps[\"placement\"];\n icon?: React.ReactNode;\n}\nexport function MenuButton<T extends object>({\n label,\n children,\n icon,\n placement,\n variant,\n ...props\n}: MenuButtonProps<T>) {\n return (\n <MenuTrigger>\n {icon ? (\n <IconButton variant={variant} aria-label={label}>\n {icon}\n </IconButton>\n ) : (\n <Button variant={variant}>{label}</Button>\n )}\n <MenuPopover placement={placement}>\n <Menu {...props}>{children}</Menu>\n </MenuPopover>\n </MenuTrigger>\n );\n}\n\nexport type MenuPopoverProps = RACPopoverProps;\nexport function MenuPopover({\n UNSTABLE_portalContainer,\n ...props\n}: MenuPopoverProps) {\n // Sem container explícito o menu faz portal no document.body — fora da shadow\n // root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <RACPopover\n {...props}\n UNSTABLE_portalContainer={UNSTABLE_portalContainer ?? portalContainer}\n />\n );\n}\n\nexport type MenuItemProps = RACMenuItemProps;\nexport function MenuItem({ className, ...props }: MenuItemProps) {\n const classNames = clsx(className, \"menu-item\");\n const textValue =\n props.textValue ||\n (typeof props.children === \"string\" ? props.children : undefined);\n return (\n <RACMenuItem {...props} className={classNames} textValue={textValue}>\n {({ hasSubmenu }) => (\n <>\n {props.children}\n {hasSubmenu && <IconChevronDown />}\n </>\n )}\n </RACMenuItem>\n );\n}\n\nexport type MenuHeaderProps = React.ComponentPropsWithoutRef<\"div\">;\nexport function MenuHeader({ className, ...props }: MenuHeaderProps) {\n const classNames = clsx(className, \"menu-header\");\n return <div {...props} className={classNames} />;\n}\n\nexport type MenuSectionProps = React.ComponentPropsWithoutRef<\"div\">;\nexport function MenuSection({ className, ...props }: MenuSectionProps) {\n const classNames = clsx(className, \"menu-section\");\n return <div {...props} className={classNames} />;\n}\n\nexport type MenuHeadingProps = TextHeadingProps;\nexport function MenuHeading({ className, ...props }: MenuHeadingProps) {\n const classNames = clsx(className, \"menu-heading\");\n return <TextHeading {...props} className={classNames} />;\n}\n\nexport type MenuSeparatorProps = RACSeparatorProps;\nexport function MenuSeparator({ className, ...props }: MenuSeparatorProps) {\n const classNames = clsx(className, \"menu-separator\");\n return <RACSeparator {...props} className={classNames} />;\n}\n\nexport type MenuLabelProps = LabelProps;\nexport function MenuLabel({ className, ...props }: MenuLabelProps) {\n const classNames = clsx(className, \"menu-label\");\n return <Label {...props} className={classNames} />;\n}\n\nexport type MenuDescriptionProps = DescriptionProps;\nexport function MenuDescription({ className, ...props }: MenuDescriptionProps) {\n const classNames = clsx(className, \"menu-description\");\n return <Description {...props} className={classNames} />;\n}\n\nexport type MenuShortcutProps = KeyboardProps;\nexport function MenuShortcut({\n children,\n className,\n ...props\n}: MenuShortcutProps) {\n const classNames = clsx(className, \"menu-shortcut\");\n return (\n <Keyboard {...props} className={classNames}>\n {children}\n </Keyboard>\n );\n}\n"],"names":["hasWarnedAboutGateAroundItem","warnOnGateAroundItem","children","React","child","PermissionGate","Menu","className","props","jsx","RACMenu","clsx","MenuTrigger","RACMenuTrigger","MenuButton","label","icon","placement","variant","IconButton","Button","MenuPopover","UNSTABLE_portalContainer","portalContainer","useOverlayPortalContainer","RACPopover","MenuItem","classNames","textValue","RACMenuItem","hasSubmenu","jsxs","Fragment","IconChevronDown","MenuHeader","MenuSection","MenuHeading","TextHeading","MenuSeparator","RACSeparator","MenuLabel","Label","MenuDescription","Description","MenuShortcut","Keyboard"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),d=require("../../../vendor/clsx/dist/clsx.cjs"),a=require("react"),u=require("react-aria-components");;/* empty css */const q=require("../../icons/IconX.cjs"),S=require("../../icons/IconSearch.cjs"),b=require("../../hooks/useOverlayPortal.cjs"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),d=require("../../../vendor/clsx/dist/clsx.cjs"),a=require("react"),u=require("react-aria-components");;/* empty css */const q=require("../../icons/IconX.cjs"),S=require("../../icons/IconSearch.cjs"),b=require("../../hooks/useOverlayPortal.cjs"),f=require("../Fieldset/Fieldset.cjs"),v=require("../Input/Input.cjs"),h=require("../IconButton/IconButton.cjs"),x=require("../ListBox/ListBox.cjs"),B=a.forwardRef(function({className:m,results:c,onSearch:o,...i},n){const[l,j]=a.useState(""),t=a.useRef(null),s=e=>{j(e),o&&o(e)},p=d.clsx(m,"search-input-container"),I=b.useOverlayPortalContainer();return r.jsxs(u.ComboBox,{className:p,children:[r.jsx(f.Label,{hidden:!0,children:i["aria-label"]||"Search"}),r.jsx(v.Input,{type:"search",className:"search-input",value:l,onInput:e=>s(e.currentTarget.value),ref:e=>{t.current=e,typeof n=="function"?n(e):n&&(n.current=e)},...i}),r.jsx("span",{className:"search-icon",children:l?r.jsx(h.IconButton,{"aria-label":"Clear search",onPress:()=>s(""),size:"small",variant:"subtle",children:r.jsx(q.IconX,{})}):r.jsx(h.IconButton,{"aria-label":"Clear search",onPress:()=>{var e;return(e=t==null?void 0:t.current)==null?void 0:e.focus()},size:"small",variant:"subtle",children:r.jsx(S.IconSearch,{})})}),r.jsx(u.Popover,{UNSTABLE_portalContainer:I,children:r.jsx(x.ListBox,{children:c==null?void 0:c.map(e=>r.jsx(x.ListBoxItem,{onAction:()=>s(e),children:e},e))})})]})});exports.Search=B;
|
|
2
2
|
//# sourceMappingURL=Search.cjs.map
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { jsxs as f, jsx as e } from "react/jsx-runtime";
|
|
2
2
|
import { clsx as d } from "../../../vendor/clsx/dist/clsx.js";
|
|
3
3
|
import I, { useState as b, useRef as x } from "react";
|
|
4
|
-
import { ComboBox as v, Popover as
|
|
4
|
+
import { ComboBox as v, Popover as C } from "react-aria-components";
|
|
5
5
|
/* empty css */
|
|
6
|
-
import { IconX as
|
|
7
|
-
import { IconSearch as
|
|
6
|
+
import { IconX as S } from "../../icons/IconX.js";
|
|
7
|
+
import { IconSearch as B } from "../../icons/IconSearch.js";
|
|
8
8
|
import { useOverlayPortalContainer as N } from "../../hooks/useOverlayPortal.js";
|
|
9
9
|
import { Label as L } from "../Fieldset/Fieldset.js";
|
|
10
10
|
import { Input as P } from "../Input/Input.js";
|
|
11
11
|
import { IconButton as m } from "../IconButton/IconButton.js";
|
|
12
12
|
import { ListBox as T, ListBoxItem as y } from "../ListBox/ListBox.js";
|
|
13
|
-
const
|
|
13
|
+
const D = I.forwardRef(function({ className: l, results: a, onSearch: c, ...i }, o) {
|
|
14
14
|
const [s, p] = b(""), t = x(null), n = (r) => {
|
|
15
15
|
p(r), c && c(r);
|
|
16
16
|
}, h = d(l, "search-input-container"), u = N();
|
|
@@ -36,7 +36,7 @@ const q = I.forwardRef(function({ className: l, results: a, onSearch: c, ...i },
|
|
|
36
36
|
onPress: () => n(""),
|
|
37
37
|
size: "small",
|
|
38
38
|
variant: "subtle",
|
|
39
|
-
children: /* @__PURE__ */ e(
|
|
39
|
+
children: /* @__PURE__ */ e(S, {})
|
|
40
40
|
}
|
|
41
41
|
) : /* @__PURE__ */ e(
|
|
42
42
|
m,
|
|
@@ -48,13 +48,13 @@ const q = I.forwardRef(function({ className: l, results: a, onSearch: c, ...i },
|
|
|
48
48
|
},
|
|
49
49
|
size: "small",
|
|
50
50
|
variant: "subtle",
|
|
51
|
-
children: /* @__PURE__ */ e(
|
|
51
|
+
children: /* @__PURE__ */ e(B, {})
|
|
52
52
|
}
|
|
53
53
|
) }),
|
|
54
|
-
/* @__PURE__ */ e(
|
|
54
|
+
/* @__PURE__ */ e(C, { UNSTABLE_portalContainer: u, children: /* @__PURE__ */ e(T, { children: a == null ? void 0 : a.map((r) => /* @__PURE__ */ e(y, { onAction: () => n(r), children: r }, r)) }) })
|
|
55
55
|
] });
|
|
56
56
|
});
|
|
57
57
|
export {
|
|
58
|
-
|
|
58
|
+
D as Search
|
|
59
59
|
};
|
|
60
60
|
//# sourceMappingURL=Search.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),E=require("../../../vendor/clsx/dist/clsx.cjs"),s=require("react"),h=require("react-aria-components");;/* empty css */const F=require("../../icons/IconChevronDown.cjs"),N=require("../../hooks/useOverlayPortal.cjs"),u=require("../Fieldset/Fieldset.cjs"),R=require("../ListBox/ListBox.cjs");function v(t){const{id:e}=t.props;return String(e??t.key??"")}function I(t){const{textValue:e,children:r}=t.props;return e!==void 0?e:typeof r=="string"?r:""}function m(t,e){s.Children.forEach(t,r=>{s.isValidElement(r)&&e(r)})}function M(t){const e=new Set;return m(t,r=>e.add(v(r))),e}function O(t,e){const r=new Set([...e].map(String)),o=[];return m(t,c=>{r.has(v(c))&&o.push(I(c))}),o.join(", ")}function B({className:t,label:e,description:r,errorMessage:o,placeholder:c,children:d,selectedKeys:x,onSelectionChange:j,isDisabled:S,isInvalid:y,disallowEmptySelection:q,"aria-label":g}){const C=E.clsx(t,"select-container"),b=N.useOverlayPortalContainer(),l=s.useRef(null),[T,w]=s.useState(),f=s.useCallback(()=>{l.current&&w(`${l.current.offsetWidth}px`)},[]);s.useLayoutEffect(()=>{f();const i=l.current;if(!i||typeof ResizeObserver>"u")return;const p=new ResizeObserver(f);return p.observe(i),()=>p.disconnect()},[f]);const a=O(d,x);return n.jsx("div",{className:C,children:n.jsxs(u.Field,{children:[e&&n.jsx(u.Label,{children:e}),n.jsxs(h.MenuTrigger,{children:[n.jsxs(h.Button,{ref:l,className:"select","aria-label":g,isDisabled:S,"data-invalid":y||void 0,children:[n.jsx("span",{className:"select-value","data-placeholder":a===""||void 0,title:a||void 0,children:a===""?c:a}),n.jsx(F.IconChevronDown,{"aria-hidden":"true"})]}),n.jsx(h.Popover,{className:"select-popover",style:{"--trigger-width":T},UNSTABLE_portalContainer:b,children:n.jsx(R.ListBox,{"aria-label":e??g,autoFocus:!0,selectionMode:"multiple",disallowEmptySelection:q,selectedKeys:x,onSelectionChange:i=>j(i==="all"?M(d):new Set(i)),children:d})})]}),r&&n.jsx(u.Description,{children:r}),n.jsx(u.FieldError,{children:o})]})})}exports.MultiSelectField=B;
|
|
2
|
+
//# sourceMappingURL=MultiSelect.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MultiSelect.cjs","sources":["../../../../../src/ui/primitives/Select/MultiSelect.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Label,\n ListBox,\n SharedFieldProps,\n} from \"primitives\";\nimport React, { useCallback, useLayoutEffect, useRef, useState } from \"react\";\nimport {\n Button as RACButton,\n MenuTrigger as RACMenuTrigger,\n Popover as RACPopover,\n type Key as RACKey,\n type Selection as RACSelection,\n} from \"react-aria-components\";\nimport \"./select.css\";\n\nfunction itemKey(item: React.ReactElement): string {\n const { id } = item.props as { id?: RACKey };\n return String(id ?? item.key ?? \"\");\n}\n\nfunction itemText(item: React.ReactElement): string {\n const { textValue, children } = item.props as {\n textValue?: string;\n children?: React.ReactNode;\n };\n if (textValue !== undefined) return textValue;\n return typeof children === \"string\" ? children : \"\";\n}\n\nfunction forEachItem(\n children: React.ReactNode,\n visit: (item: React.ReactElement) => void,\n) {\n React.Children.forEach(children, (child) => {\n if (React.isValidElement(child)) visit(child);\n });\n}\n\nfunction allItemKeys(children: React.ReactNode): Set<RACKey> {\n const keys = new Set<RACKey>();\n forEachItem(children, (item) => keys.add(itemKey(item)));\n return keys;\n}\n\nfunction selectedItemsText(\n children: React.ReactNode,\n selectedKeys: Iterable<RACKey>,\n): string {\n const selected = new Set([...selectedKeys].map(String));\n const texts: string[] = [];\n forEachItem(children, (item) => {\n if (selected.has(itemKey(item))) texts.push(itemText(item));\n });\n return texts.join(\", \");\n}\n\nexport interface MultiSelectFieldProps extends SharedFieldProps {\n children: React.ReactNode;\n selectedKeys: Iterable<RACKey>;\n onSelectionChange: (keys: Set<RACKey>) => void;\n className?: string;\n isDisabled?: boolean;\n isInvalid?: boolean;\n disallowEmptySelection?: boolean;\n \"aria-label\"?: string;\n}\n\nexport function MultiSelectField({\n className,\n label,\n description,\n errorMessage,\n placeholder,\n children,\n selectedKeys,\n onSelectionChange,\n isDisabled,\n isInvalid,\n disallowEmptySelection,\n \"aria-label\": ariaLabel,\n}: MultiSelectFieldProps) {\n const classNames = clsx(className, \"select-container\");\n const portalContainer = useOverlayPortalContainer();\n const triggerRef = useRef<HTMLButtonElement>(null);\n const [triggerWidth, setTriggerWidth] = useState<string>();\n\n const measureTrigger = useCallback(() => {\n if (triggerRef.current) {\n setTriggerWidth(`${triggerRef.current.offsetWidth}px`);\n }\n }, []);\n\n useLayoutEffect(() => {\n measureTrigger();\n const trigger = triggerRef.current;\n if (!trigger || typeof ResizeObserver === \"undefined\") return;\n const observer = new ResizeObserver(measureTrigger);\n observer.observe(trigger);\n return () => observer.disconnect();\n }, [measureTrigger]);\n\n const chosenText = selectedItemsText(children, selectedKeys);\n\n return (\n <div className={classNames}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACMenuTrigger>\n <RACButton\n ref={triggerRef}\n className=\"select\"\n aria-label={ariaLabel}\n isDisabled={isDisabled}\n data-invalid={isInvalid || undefined}\n >\n <span\n className=\"select-value\"\n data-placeholder={chosenText === \"\" || undefined}\n title={chosenText || undefined}\n >\n {chosenText === \"\" ? placeholder : chosenText}\n </span>\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n <RACPopover\n className=\"select-popover\"\n style={{ \"--trigger-width\": triggerWidth } as React.CSSProperties}\n UNSTABLE_portalContainer={portalContainer}\n >\n <ListBox\n aria-label={label ?? ariaLabel}\n autoFocus\n selectionMode=\"multiple\"\n disallowEmptySelection={disallowEmptySelection}\n selectedKeys={selectedKeys}\n onSelectionChange={(keys: RACSelection) =>\n onSelectionChange(\n keys === \"all\" ? allItemKeys(children) : new Set(keys),\n )\n }\n >\n {children}\n </ListBox>\n </RACPopover>\n </RACMenuTrigger>\n {description && <Description>{description}</Description>}\n <FieldError>{errorMessage}</FieldError>\n </Field>\n </div>\n );\n}\n"],"names":["itemKey","item","id","itemText","textValue","children","forEachItem","visit","React","child","allItemKeys","keys","selectedItemsText","selectedKeys","selected","texts","MultiSelectField","className","label","description","errorMessage","placeholder","onSelectionChange","isDisabled","isInvalid","disallowEmptySelection","ariaLabel","classNames","clsx","portalContainer","useOverlayPortalContainer","triggerRef","useRef","triggerWidth","setTriggerWidth","useState","measureTrigger","useCallback","useLayoutEffect","trigger","observer","chosenText","jsx","Field","Label","RACMenuTrigger","jsxs","RACButton","IconChevronDown","RACPopover","ListBox","Description","FieldError"],"mappings":"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"}
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import { jsx as n, jsxs as d } from "react/jsx-runtime";
|
|
2
|
+
import { clsx as N } from "../../../vendor/clsx/dist/clsx.js";
|
|
3
|
+
import h, { useRef as R, useState as F, useCallback as I, useLayoutEffect as j } from "react";
|
|
4
|
+
import { MenuTrigger as B, Button as L, Popover as M } from "react-aria-components";
|
|
5
|
+
/* empty css */
|
|
6
|
+
import { IconChevronDown as O } from "../../icons/IconChevronDown.js";
|
|
7
|
+
import { useOverlayPortalContainer as W } from "../../hooks/useOverlayPortal.js";
|
|
8
|
+
import { Field as k, Label as z, Description as D, FieldError as P } from "../Fieldset/Fieldset.js";
|
|
9
|
+
import { ListBox as V } from "../ListBox/ListBox.js";
|
|
10
|
+
function g(t) {
|
|
11
|
+
const { id: e } = t.props;
|
|
12
|
+
return String(e ?? t.key ?? "");
|
|
13
|
+
}
|
|
14
|
+
function A(t) {
|
|
15
|
+
const { textValue: e, children: r } = t.props;
|
|
16
|
+
return e !== void 0 ? e : typeof r == "string" ? r : "";
|
|
17
|
+
}
|
|
18
|
+
function v(t, e) {
|
|
19
|
+
h.Children.forEach(t, (r) => {
|
|
20
|
+
h.isValidElement(r) && e(r);
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
function K(t) {
|
|
24
|
+
const e = /* @__PURE__ */ new Set();
|
|
25
|
+
return v(t, (r) => e.add(g(r))), e;
|
|
26
|
+
}
|
|
27
|
+
function U(t, e) {
|
|
28
|
+
const r = new Set([...e].map(String)), i = [];
|
|
29
|
+
return v(t, (s) => {
|
|
30
|
+
r.has(g(s)) && i.push(A(s));
|
|
31
|
+
}), i.join(", ");
|
|
32
|
+
}
|
|
33
|
+
function Z({
|
|
34
|
+
className: t,
|
|
35
|
+
label: e,
|
|
36
|
+
description: r,
|
|
37
|
+
errorMessage: i,
|
|
38
|
+
placeholder: s,
|
|
39
|
+
children: a,
|
|
40
|
+
selectedKeys: f,
|
|
41
|
+
onSelectionChange: x,
|
|
42
|
+
isDisabled: S,
|
|
43
|
+
isInvalid: y,
|
|
44
|
+
disallowEmptySelection: C,
|
|
45
|
+
"aria-label": m
|
|
46
|
+
}) {
|
|
47
|
+
const T = N(t, "select-container"), b = W(), c = R(null), [w, E] = F(), u = I(() => {
|
|
48
|
+
c.current && E(`${c.current.offsetWidth}px`);
|
|
49
|
+
}, []);
|
|
50
|
+
j(() => {
|
|
51
|
+
u();
|
|
52
|
+
const o = c.current;
|
|
53
|
+
if (!o || typeof ResizeObserver > "u") return;
|
|
54
|
+
const p = new ResizeObserver(u);
|
|
55
|
+
return p.observe(o), () => p.disconnect();
|
|
56
|
+
}, [u]);
|
|
57
|
+
const l = U(a, f);
|
|
58
|
+
return /* @__PURE__ */ n("div", { className: T, children: /* @__PURE__ */ d(k, { children: [
|
|
59
|
+
e && /* @__PURE__ */ n(z, { children: e }),
|
|
60
|
+
/* @__PURE__ */ d(B, { children: [
|
|
61
|
+
/* @__PURE__ */ d(
|
|
62
|
+
L,
|
|
63
|
+
{
|
|
64
|
+
ref: c,
|
|
65
|
+
className: "select",
|
|
66
|
+
"aria-label": m,
|
|
67
|
+
isDisabled: S,
|
|
68
|
+
"data-invalid": y || void 0,
|
|
69
|
+
children: [
|
|
70
|
+
/* @__PURE__ */ n(
|
|
71
|
+
"span",
|
|
72
|
+
{
|
|
73
|
+
className: "select-value",
|
|
74
|
+
"data-placeholder": l === "" || void 0,
|
|
75
|
+
title: l || void 0,
|
|
76
|
+
children: l === "" ? s : l
|
|
77
|
+
}
|
|
78
|
+
),
|
|
79
|
+
/* @__PURE__ */ n(O, { "aria-hidden": "true" })
|
|
80
|
+
]
|
|
81
|
+
}
|
|
82
|
+
),
|
|
83
|
+
/* @__PURE__ */ n(
|
|
84
|
+
M,
|
|
85
|
+
{
|
|
86
|
+
className: "select-popover",
|
|
87
|
+
style: { "--trigger-width": w },
|
|
88
|
+
UNSTABLE_portalContainer: b,
|
|
89
|
+
children: /* @__PURE__ */ n(
|
|
90
|
+
V,
|
|
91
|
+
{
|
|
92
|
+
"aria-label": e ?? m,
|
|
93
|
+
autoFocus: !0,
|
|
94
|
+
selectionMode: "multiple",
|
|
95
|
+
disallowEmptySelection: C,
|
|
96
|
+
selectedKeys: f,
|
|
97
|
+
onSelectionChange: (o) => x(
|
|
98
|
+
o === "all" ? K(a) : new Set(o)
|
|
99
|
+
),
|
|
100
|
+
children: a
|
|
101
|
+
}
|
|
102
|
+
)
|
|
103
|
+
}
|
|
104
|
+
)
|
|
105
|
+
] }),
|
|
106
|
+
r && /* @__PURE__ */ n(D, { children: r }),
|
|
107
|
+
/* @__PURE__ */ n(P, { children: i })
|
|
108
|
+
] }) });
|
|
109
|
+
}
|
|
110
|
+
export {
|
|
111
|
+
Z as MultiSelectField
|
|
112
|
+
};
|
|
113
|
+
//# sourceMappingURL=MultiSelect.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MultiSelect.js","sources":["../../../../../src/ui/primitives/Select/MultiSelect.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Label,\n ListBox,\n SharedFieldProps,\n} from \"primitives\";\nimport React, { useCallback, useLayoutEffect, useRef, useState } from \"react\";\nimport {\n Button as RACButton,\n MenuTrigger as RACMenuTrigger,\n Popover as RACPopover,\n type Key as RACKey,\n type Selection as RACSelection,\n} from \"react-aria-components\";\nimport \"./select.css\";\n\nfunction itemKey(item: React.ReactElement): string {\n const { id } = item.props as { id?: RACKey };\n return String(id ?? item.key ?? \"\");\n}\n\nfunction itemText(item: React.ReactElement): string {\n const { textValue, children } = item.props as {\n textValue?: string;\n children?: React.ReactNode;\n };\n if (textValue !== undefined) return textValue;\n return typeof children === \"string\" ? children : \"\";\n}\n\nfunction forEachItem(\n children: React.ReactNode,\n visit: (item: React.ReactElement) => void,\n) {\n React.Children.forEach(children, (child) => {\n if (React.isValidElement(child)) visit(child);\n });\n}\n\nfunction allItemKeys(children: React.ReactNode): Set<RACKey> {\n const keys = new Set<RACKey>();\n forEachItem(children, (item) => keys.add(itemKey(item)));\n return keys;\n}\n\nfunction selectedItemsText(\n children: React.ReactNode,\n selectedKeys: Iterable<RACKey>,\n): string {\n const selected = new Set([...selectedKeys].map(String));\n const texts: string[] = [];\n forEachItem(children, (item) => {\n if (selected.has(itemKey(item))) texts.push(itemText(item));\n });\n return texts.join(\", \");\n}\n\nexport interface MultiSelectFieldProps extends SharedFieldProps {\n children: React.ReactNode;\n selectedKeys: Iterable<RACKey>;\n onSelectionChange: (keys: Set<RACKey>) => void;\n className?: string;\n isDisabled?: boolean;\n isInvalid?: boolean;\n disallowEmptySelection?: boolean;\n \"aria-label\"?: string;\n}\n\nexport function MultiSelectField({\n className,\n label,\n description,\n errorMessage,\n placeholder,\n children,\n selectedKeys,\n onSelectionChange,\n isDisabled,\n isInvalid,\n disallowEmptySelection,\n \"aria-label\": ariaLabel,\n}: MultiSelectFieldProps) {\n const classNames = clsx(className, \"select-container\");\n const portalContainer = useOverlayPortalContainer();\n const triggerRef = useRef<HTMLButtonElement>(null);\n const [triggerWidth, setTriggerWidth] = useState<string>();\n\n const measureTrigger = useCallback(() => {\n if (triggerRef.current) {\n setTriggerWidth(`${triggerRef.current.offsetWidth}px`);\n }\n }, []);\n\n useLayoutEffect(() => {\n measureTrigger();\n const trigger = triggerRef.current;\n if (!trigger || typeof ResizeObserver === \"undefined\") return;\n const observer = new ResizeObserver(measureTrigger);\n observer.observe(trigger);\n return () => observer.disconnect();\n }, [measureTrigger]);\n\n const chosenText = selectedItemsText(children, selectedKeys);\n\n return (\n <div className={classNames}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACMenuTrigger>\n <RACButton\n ref={triggerRef}\n className=\"select\"\n aria-label={ariaLabel}\n isDisabled={isDisabled}\n data-invalid={isInvalid || undefined}\n >\n <span\n className=\"select-value\"\n data-placeholder={chosenText === \"\" || undefined}\n title={chosenText || undefined}\n >\n {chosenText === \"\" ? placeholder : chosenText}\n </span>\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n <RACPopover\n className=\"select-popover\"\n style={{ \"--trigger-width\": triggerWidth } as React.CSSProperties}\n UNSTABLE_portalContainer={portalContainer}\n >\n <ListBox\n aria-label={label ?? ariaLabel}\n autoFocus\n selectionMode=\"multiple\"\n disallowEmptySelection={disallowEmptySelection}\n selectedKeys={selectedKeys}\n onSelectionChange={(keys: RACSelection) =>\n onSelectionChange(\n keys === \"all\" ? allItemKeys(children) : new Set(keys),\n )\n }\n >\n {children}\n </ListBox>\n </RACPopover>\n </RACMenuTrigger>\n {description && <Description>{description}</Description>}\n <FieldError>{errorMessage}</FieldError>\n </Field>\n </div>\n );\n}\n"],"names":["itemKey","item","id","itemText","textValue","children","forEachItem","visit","React","child","allItemKeys","keys","selectedItemsText","selectedKeys","selected","texts","MultiSelectField","className","label","description","errorMessage","placeholder","onSelectionChange","isDisabled","isInvalid","disallowEmptySelection","ariaLabel","classNames","clsx","portalContainer","useOverlayPortalContainer","triggerRef","useRef","triggerWidth","setTriggerWidth","useState","measureTrigger","useCallback","useLayoutEffect","trigger","observer","chosenText","jsx","Field","Label","RACMenuTrigger","jsxs","RACButton","IconChevronDown","RACPopover","ListBox","Description","FieldError"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../../vendor/clsx/dist/clsx.cjs"),n=require("react-aria-components");;/* empty css */const h=require("../../icons/IconChevronDown.cjs"),S=require("../../icons/IconCheck.cjs"),q=require("../../hooks/useOverlayPortal.cjs"),r=require("../Fieldset/Fieldset.cjs"),a=require("../ListBox/ListBox.cjs");function
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../../vendor/clsx/dist/clsx.cjs"),n=require("react-aria-components");;/* empty css */const h=require("../../icons/IconChevronDown.cjs"),S=require("../../icons/IconCheck.cjs"),q=require("../../hooks/useOverlayPortal.cjs"),r=require("../Fieldset/Fieldset.cjs"),a=require("../ListBox/ListBox.cjs");function N({className:s,label:t,description:c,errorMessage:l,children:o,items:x,...m}){const j=i.clsx(s,"select-container"),d=q.useOverlayPortalContainer();return e.jsx(u,{className:j,...m,children:e.jsxs(r.Field,{children:[t&&e.jsx(r.Label,{children:t}),e.jsxs(n.Button,{className:"select",children:[e.jsx(n.SelectValue,{className:"select-value"}),e.jsx(h.IconChevronDown,{"aria-hidden":"true"})]}),e.jsx(n.Popover,{className:"select-popover",UNSTABLE_portalContainer:d,children:e.jsx(a.ListBox,{items:x,children:o})}),c&&e.jsx(r.Description,{children:c}),e.jsx(r.FieldError,{children:l})]})})}function u({...s}){return e.jsx(n.Select,{...s})}function p({children:s,className:t,...c}){const l=i.clsx(t,"select-item"),o=typeof s=="string"?s:"";return e.jsx(a.ListBoxItem,{textValue:o,className:l,...c,children:e.jsxs(e.Fragment,{children:[e.jsx(S.IconCheck,{className:"select-item-check"}),s]})})}exports.Select=u;exports.SelectField=N;exports.SelectItem=p;
|
|
2
2
|
//# sourceMappingURL=Select.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.cjs","sources":["../../../../../src/ui/primitives/Select/Select.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconCheck, IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Label,\n ListBox,\n ListBoxItem,\n SharedFieldProps,\n type ListBoxItemProps,\n} from \"primitives\";\nimport {\n Button as RACButton,\n Popover as RACPopover,\n Select as RACSelect,\n SelectValue as RACSelectValue,\n type SelectProps as RACSelectProps,\n} from \"react-aria-components\";\nimport \"./select.css\";\n\nexport interface SelectFieldProps<T extends object>\n extends Omit<SelectProps<T>, \"children\">,\n SharedFieldProps {\n items?: Iterable<T>;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n}\nexport function SelectField<T extends object>({\n className,\n label,\n description,\n errorMessage,\n children,\n items,\n ...props\n}: SelectFieldProps<T>) {\n const classNames = clsx(className, \"select-container\");\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <Select className={classNames} {...props}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACButton className=\"select\">\n <RACSelectValue className=\"select-value\" />\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n <RACPopover
|
|
1
|
+
{"version":3,"file":"Select.cjs","sources":["../../../../../src/ui/primitives/Select/Select.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconCheck, IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Label,\n ListBox,\n ListBoxItem,\n SharedFieldProps,\n type ListBoxItemProps,\n} from \"primitives\";\nimport {\n Button as RACButton,\n Popover as RACPopover,\n Select as RACSelect,\n SelectValue as RACSelectValue,\n type SelectProps as RACSelectProps,\n} from \"react-aria-components\";\nimport \"./select.css\";\n\nexport interface SelectFieldProps<T extends object>\n extends Omit<SelectProps<T>, \"children\">,\n SharedFieldProps {\n items?: Iterable<T>;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n}\nexport function SelectField<T extends object>({\n className,\n label,\n description,\n errorMessage,\n children,\n items,\n ...props\n}: SelectFieldProps<T>) {\n const classNames = clsx(className, \"select-container\");\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <Select className={classNames} {...props}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACButton className=\"select\">\n <RACSelectValue className=\"select-value\" />\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n <RACPopover\n className=\"select-popover\"\n UNSTABLE_portalContainer={portalContainer}\n >\n <ListBox items={items}>{children}</ListBox>\n </RACPopover>\n {description && <Description>{description}</Description>}\n <FieldError>{errorMessage}</FieldError>\n </Field>\n </Select>\n );\n}\n\nexport type SelectProps<T extends object> = RACSelectProps<T>;\nexport function Select<T extends object>({ ...props }: SelectProps<T>) {\n return <RACSelect<T> {...props} />;\n}\n\nexport type SelectItemProps = ListBoxItemProps;\nexport function SelectItem({ children, className, ...props }: SelectItemProps) {\n const classNames = clsx(className, \"select-item\");\n const textValue = typeof children === \"string\" ? children : \"\";\n return (\n <ListBoxItem textValue={textValue} className={classNames} {...props}>\n <>\n <IconCheck className=\"select-item-check\" />\n {children}\n </>\n </ListBoxItem>\n );\n}\n"],"names":["SelectField","className","label","description","errorMessage","children","items","props","classNames","clsx","portalContainer","useOverlayPortalContainer","Select","Field","jsx","Label","jsxs","RACButton","RACSelectValue","IconChevronDown","RACPopover","ListBox","Description","FieldError","RACSelect","SelectItem","textValue","ListBoxItem","Fragment","IconCheck"],"mappings":"sbA4BO,SAASA,EAA8B,CAC5C,UAAAC,EACA,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,MAAAC,EACA,GAAGC,CACL,EAAwB,CACtB,MAAMC,EAAaC,EAAAA,KAAKR,EAAW,kBAAkB,EAG/CS,EAAkBC,EAAAA,0BAAA,EACxB,aACGC,EAAA,CAAO,UAAWJ,EAAa,GAAGD,EACjC,gBAACM,EAAAA,MAAA,CACE,SAAA,CAAAX,GAASY,EAAAA,IAACC,EAAAA,OAAO,SAAAb,CAAA,CAAM,EACxBc,EAAAA,KAACC,EAAAA,OAAA,CAAU,UAAU,SACnB,SAAA,CAAAH,EAAAA,IAACI,EAAAA,YAAA,CAAe,UAAU,cAAA,CAAe,EACzCJ,EAAAA,IAACK,EAAAA,gBAAA,CAAgB,cAAY,MAAA,CAAO,CAAA,EACtC,EACAL,EAAAA,IAACM,EAAAA,QAAA,CACC,UAAU,iBACV,yBAA0BV,EAE1B,SAAAI,EAAAA,IAACO,EAAAA,QAAA,CAAQ,MAAAf,EAAe,SAAAD,CAAA,CAAS,CAAA,CAAA,EAElCF,GAAeW,EAAAA,IAACQ,EAAAA,YAAA,CAAa,SAAAnB,CAAA,CAAY,EAC1CW,EAAAA,IAACS,EAAAA,YAAY,SAAAnB,CAAA,CAAa,CAAA,CAAA,CAC5B,CAAA,CACF,CAEJ,CAGO,SAASQ,EAAyB,CAAE,GAAGL,GAAyB,CACrE,OAAOO,MAACU,EAAAA,OAAA,CAAc,GAAGjB,CAAA,CAAO,CAClC,CAGO,SAASkB,EAAW,CAAE,SAAApB,EAAU,UAAAJ,EAAW,GAAGM,GAA0B,CAC7E,MAAMC,EAAaC,EAAAA,KAAKR,EAAW,aAAa,EAC1CyB,EAAY,OAAOrB,GAAa,SAAWA,EAAW,GAC5D,aACGsB,EAAAA,YAAA,CAAY,UAAAD,EAAsB,UAAWlB,EAAa,GAAGD,EAC5D,SAAAS,EAAAA,KAAAY,EAAAA,SAAA,CACE,SAAA,CAAAd,EAAAA,IAACe,EAAAA,UAAA,CAAU,UAAU,mBAAA,CAAoB,EACxCxB,CAAA,CAAA,CACH,CAAA,CACF,CAEJ"}
|
|
@@ -1,38 +1,45 @@
|
|
|
1
1
|
import { jsx as e, jsxs as l, Fragment as u } from "react/jsx-runtime";
|
|
2
|
-
import { clsx as
|
|
3
|
-
import { Button as f, SelectValue as d, Popover as h, Select as
|
|
2
|
+
import { clsx as n } from "../../../vendor/clsx/dist/clsx.js";
|
|
3
|
+
import { Button as f, SelectValue as d, Popover as h, Select as N } from "react-aria-components";
|
|
4
4
|
/* empty css */
|
|
5
|
-
import { IconChevronDown as
|
|
5
|
+
import { IconChevronDown as x } from "../../icons/IconChevronDown.js";
|
|
6
6
|
import { IconCheck as S } from "../../icons/IconCheck.js";
|
|
7
|
-
import { useOverlayPortalContainer as
|
|
8
|
-
import { Field as
|
|
7
|
+
import { useOverlayPortalContainer as v } from "../../hooks/useOverlayPortal.js";
|
|
8
|
+
import { Field as C, Label as B, Description as F, FieldError as I } from "../Fieldset/Fieldset.js";
|
|
9
9
|
import { ListBox as L, ListBoxItem as V } from "../ListBox/ListBox.js";
|
|
10
10
|
function T({
|
|
11
11
|
className: t,
|
|
12
12
|
label: r,
|
|
13
13
|
description: o,
|
|
14
14
|
errorMessage: c,
|
|
15
|
-
children:
|
|
15
|
+
children: s,
|
|
16
16
|
items: i,
|
|
17
17
|
...a
|
|
18
18
|
}) {
|
|
19
|
-
const m =
|
|
20
|
-
return /* @__PURE__ */ e(g, { className: m, ...a, children: /* @__PURE__ */ l(
|
|
19
|
+
const m = n(t, "select-container"), p = v();
|
|
20
|
+
return /* @__PURE__ */ e(g, { className: m, ...a, children: /* @__PURE__ */ l(C, { children: [
|
|
21
21
|
r && /* @__PURE__ */ e(B, { children: r }),
|
|
22
22
|
/* @__PURE__ */ l(f, { className: "select", children: [
|
|
23
23
|
/* @__PURE__ */ e(d, { className: "select-value" }),
|
|
24
|
-
/* @__PURE__ */ e(
|
|
24
|
+
/* @__PURE__ */ e(x, { "aria-hidden": "true" })
|
|
25
25
|
] }),
|
|
26
|
-
/* @__PURE__ */ e(
|
|
26
|
+
/* @__PURE__ */ e(
|
|
27
|
+
h,
|
|
28
|
+
{
|
|
29
|
+
className: "select-popover",
|
|
30
|
+
UNSTABLE_portalContainer: p,
|
|
31
|
+
children: /* @__PURE__ */ e(L, { items: i, children: s })
|
|
32
|
+
}
|
|
33
|
+
),
|
|
27
34
|
o && /* @__PURE__ */ e(F, { children: o }),
|
|
28
35
|
/* @__PURE__ */ e(I, { children: c })
|
|
29
36
|
] }) });
|
|
30
37
|
}
|
|
31
38
|
function g({ ...t }) {
|
|
32
|
-
return /* @__PURE__ */ e(
|
|
39
|
+
return /* @__PURE__ */ e(N, { ...t });
|
|
33
40
|
}
|
|
34
41
|
function U({ children: t, className: r, ...o }) {
|
|
35
|
-
const c =
|
|
42
|
+
const c = n(r, "select-item");
|
|
36
43
|
return /* @__PURE__ */ e(V, { textValue: typeof t == "string" ? t : "", className: c, ...o, children: /* @__PURE__ */ l(u, { children: [
|
|
37
44
|
/* @__PURE__ */ e(S, { className: "select-item-check" }),
|
|
38
45
|
t
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sources":["../../../../../src/ui/primitives/Select/Select.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconCheck, IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Label,\n ListBox,\n ListBoxItem,\n SharedFieldProps,\n type ListBoxItemProps,\n} from \"primitives\";\nimport {\n Button as RACButton,\n Popover as RACPopover,\n Select as RACSelect,\n SelectValue as RACSelectValue,\n type SelectProps as RACSelectProps,\n} from \"react-aria-components\";\nimport \"./select.css\";\n\nexport interface SelectFieldProps<T extends object>\n extends Omit<SelectProps<T>, \"children\">,\n SharedFieldProps {\n items?: Iterable<T>;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n}\nexport function SelectField<T extends object>({\n className,\n label,\n description,\n errorMessage,\n children,\n items,\n ...props\n}: SelectFieldProps<T>) {\n const classNames = clsx(className, \"select-container\");\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <Select className={classNames} {...props}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACButton className=\"select\">\n <RACSelectValue className=\"select-value\" />\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n <RACPopover
|
|
1
|
+
{"version":3,"file":"Select.js","sources":["../../../../../src/ui/primitives/Select/Select.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconCheck, IconChevronDown } from \"icons\";\nimport {\n Description,\n Field,\n FieldError,\n Label,\n ListBox,\n ListBoxItem,\n SharedFieldProps,\n type ListBoxItemProps,\n} from \"primitives\";\nimport {\n Button as RACButton,\n Popover as RACPopover,\n Select as RACSelect,\n SelectValue as RACSelectValue,\n type SelectProps as RACSelectProps,\n} from \"react-aria-components\";\nimport \"./select.css\";\n\nexport interface SelectFieldProps<T extends object>\n extends Omit<SelectProps<T>, \"children\">,\n SharedFieldProps {\n items?: Iterable<T>;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n}\nexport function SelectField<T extends object>({\n className,\n label,\n description,\n errorMessage,\n children,\n items,\n ...props\n}: SelectFieldProps<T>) {\n const classNames = clsx(className, \"select-container\");\n // Sem container explícito o dropdown faz portal no document.body — fora da\n // shadow root do MFE, sem CSS. Ver ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <Select className={classNames} {...props}>\n <Field>\n {label && <Label>{label}</Label>}\n <RACButton className=\"select\">\n <RACSelectValue className=\"select-value\" />\n <IconChevronDown aria-hidden=\"true\" />\n </RACButton>\n <RACPopover\n className=\"select-popover\"\n UNSTABLE_portalContainer={portalContainer}\n >\n <ListBox items={items}>{children}</ListBox>\n </RACPopover>\n {description && <Description>{description}</Description>}\n <FieldError>{errorMessage}</FieldError>\n </Field>\n </Select>\n );\n}\n\nexport type SelectProps<T extends object> = RACSelectProps<T>;\nexport function Select<T extends object>({ ...props }: SelectProps<T>) {\n return <RACSelect<T> {...props} />;\n}\n\nexport type SelectItemProps = ListBoxItemProps;\nexport function SelectItem({ children, className, ...props }: SelectItemProps) {\n const classNames = clsx(className, \"select-item\");\n const textValue = typeof children === \"string\" ? children : \"\";\n return (\n <ListBoxItem textValue={textValue} className={classNames} {...props}>\n <>\n <IconCheck className=\"select-item-check\" />\n {children}\n </>\n </ListBoxItem>\n );\n}\n"],"names":["SelectField","className","label","description","errorMessage","children","items","props","classNames","clsx","portalContainer","useOverlayPortalContainer","Select","Field","jsx","Label","jsxs","RACButton","RACSelectValue","IconChevronDown","RACPopover","ListBox","Description","FieldError","RACSelect","SelectItem","ListBoxItem","Fragment","IconCheck"],"mappings":";;;;;;;;;AA4BO,SAASA,EAA8B;AAAA,EAC5C,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACL,GAAwB;AACtB,QAAMC,IAAaC,EAAKR,GAAW,kBAAkB,GAG/CS,IAAkBC,EAAA;AACxB,2BACGC,GAAA,EAAO,WAAWJ,GAAa,GAAGD,GACjC,4BAACM,GAAA,EACE,UAAA;AAAA,IAAAX,KAAS,gBAAAY,EAACC,KAAO,UAAAb,EAAA,CAAM;AAAA,IACxB,gBAAAc,EAACC,GAAA,EAAU,WAAU,UACnB,UAAA;AAAA,MAAA,gBAAAH,EAACI,GAAA,EAAe,WAAU,eAAA,CAAe;AAAA,MACzC,gBAAAJ,EAACK,GAAA,EAAgB,eAAY,OAAA,CAAO;AAAA,IAAA,GACtC;AAAA,IACA,gBAAAL;AAAA,MAACM;AAAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,0BAA0BV;AAAA,QAE1B,UAAA,gBAAAI,EAACO,GAAA,EAAQ,OAAAf,GAAe,UAAAD,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,IAElCF,KAAe,gBAAAW,EAACQ,GAAA,EAAa,UAAAnB,EAAA,CAAY;AAAA,IAC1C,gBAAAW,EAACS,KAAY,UAAAnB,EAAA,CAAa;AAAA,EAAA,EAAA,CAC5B,EAAA,CACF;AAEJ;AAGO,SAASQ,EAAyB,EAAE,GAAGL,KAAyB;AACrE,SAAO,gBAAAO,EAACU,GAAA,EAAc,GAAGjB,EAAA,CAAO;AAClC;AAGO,SAASkB,EAAW,EAAE,UAAApB,GAAU,WAAAJ,GAAW,GAAGM,KAA0B;AAC7E,QAAMC,IAAaC,EAAKR,GAAW,aAAa;AAEhD,2BACGyB,GAAA,EAAY,WAFG,OAAOrB,KAAa,WAAWA,IAAW,IAEvB,WAAWG,GAAa,GAAGD,GAC5D,UAAA,gBAAAS,EAAAW,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAb,EAACc,GAAA,EAAU,WAAU,oBAAA,CAAoB;AAAA,IACxCvB;AAAA,EAAA,EAAA,CACH,EAAA,CACF;AAEJ;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const Q=require("../../loader/lib/es/loader/index.cjs"),e=require("react");var K={wrapper:{display:"flex",position:"relative",textAlign:"initial"},fullWidth:{width:"100%"},hide:{display:"none"}},J=K,ee={container:{display:"flex",height:"100%",width:"100%",justifyContent:"center",alignItems:"center"}},te=ee;function re({children:r}){return e.createElement("div",{style:te.container},r)}var ne=re,ue=ne;function ie({width:r,height:o,isEditorReady:l,loading:u,_ref:p,className:h,wrapperProps:w}){return e.createElement("section",{style:{...J.wrapper,width:r,height:o},...w},!l&&e.createElement(ue,null,u),e.createElement("div",{ref:p,style:{...J.fullWidth,...!l&&J.hide},className:h}))}var oe=ie,T=e.memo(oe);function ae(r){e.useEffect(r,[])}var X=ae;function ce(r,o,l=!0){let u=e.useRef(!0);e.useEffect(u.current||!l?()=>{u.current=!1}:r,o)}var m=ce;function D(){}function b(r,o,l,u){return le(r,u)||de(r,o,l,u)}function le(r,o){return r.editor.getModel(Y(r,o))}function de(r,o,l,u){return r.editor.createModel(o,l,u?Y(r,u):void 0)}function Y(r,o){return r.Uri.parse(o)}function se({original:r,modified:o,language:l,originalLanguage:u,modifiedLanguage:p,originalModelPath:h,modifiedModelPath:w,keepCurrentOriginalModel:L=!1,keepCurrentModifiedModel:q=!1,theme:R="light",loading:U="Loading...",options:E={},height:z="100%",width:H="100%",className:W,wrapperProps:A={},beforeMount:B=D,onMount:G=D}){let[M,y]=e.useState(!1),[V,s]=e.useState(!0),f=e.useRef(null),d=e.useRef(null),x=e.useRef(null),g=e.useRef(G),i=e.useRef(B),C=e.useRef(!1);X(()=>{let t=Q.init();return t.then(a=>(d.current=a)&&s(!1)).catch(a=>(a==null?void 0:a.type)!=="cancelation"&&console.error("Monaco initialization: error:",a)),()=>f.current?P():t.cancel()}),m(()=>{if(f.current&&d.current){let t=f.current.getOriginalEditor(),a=b(d.current,r||"",u||l||"text",h||"");a!==t.getModel()&&t.setModel(a)}},[h],M),m(()=>{if(f.current&&d.current){let t=f.current.getModifiedEditor(),a=b(d.current,o||"",p||l||"text",w||"");a!==t.getModel()&&t.setModel(a)}},[w],M),m(()=>{let t=f.current.getModifiedEditor();t.getOption(d.current.editor.EditorOption.readOnly)?t.setValue(o||""):o!==t.getValue()&&(t.executeEdits("",[{range:t.getModel().getFullModelRange(),text:o||"",forceMoveMarkers:!0}]),t.pushUndoStop())},[o],M),m(()=>{var t,a;(a=(t=f.current)==null?void 0:t.getModel())==null||a.original.setValue(r||"")},[r],M),m(()=>{let{original:t,modified:a}=f.current.getModel();d.current.editor.setModelLanguage(t,u||l||"text"),d.current.editor.setModelLanguage(a,p||l||"text")},[l,u,p],M),m(()=>{var t;(t=d.current)==null||t.editor.setTheme(R)},[R],M),m(()=>{var t;(t=f.current)==null||t.updateOptions(E)},[E],M);let F=e.useCallback(()=>{var S;if(!d.current)return;i.current(d.current);let t=b(d.current,r||"",u||l||"text",h||""),a=b(d.current,o||"",p||l||"text",w||"");(S=f.current)==null||S.setModel({original:t,modified:a})},[l,o,p,r,u,h,w]),I=e.useCallback(()=>{var t;!C.current&&x.current&&(f.current=d.current.editor.createDiffEditor(x.current,{automaticLayout:!0,...E}),F(),(t=d.current)==null||t.editor.setTheme(R),y(!0),C.current=!0)},[E,R,F]);e.useEffect(()=>{M&&g.current(f.current,d.current)},[M]),e.useEffect(()=>{!V&&!M&&I()},[V,M,I]);function P(){var a,S,k,N;let t=(a=f.current)==null?void 0:a.getModel();L||((S=t==null?void 0:t.original)==null||S.dispose()),q||((k=t==null?void 0:t.modified)==null||k.dispose()),(N=f.current)==null||N.dispose()}return e.createElement(T,{width:H,height:z,isEditorReady:M,loading:U,_ref:x,className:W,wrapperProps:A})}var fe=se;e.memo(fe);function ge(r){let o=e.useRef();return e.useEffect(()=>{o.current=r},[r]),o.current}var pe=ge,j=new Map;function he({defaultValue:r,defaultLanguage:o,defaultPath:l,value:u,language:p,path:h,theme:w="light",line:L,loading:q="Loading...",options:R={},overrideServices:U={},saveViewState:E=!0,keepCurrentModel:z=!1,width:H="100%",height:W="100%",className:A,wrapperProps:B={},beforeMount:G=D,onMount:M=D,onChange:y,onValidate:V=D}){let[s,f]=e.useState(!1),[d,x]=e.useState(!0),g=e.useRef(null),i=e.useRef(null),C=e.useRef(null),F=e.useRef(M),I=e.useRef(G),P=e.useRef(),t=e.useRef(u),a=pe(h),S=e.useRef(!1),k=e.useRef(!1);X(()=>{let n=Q.init();return n.then(c=>(g.current=c)&&x(!1)).catch(c=>(c==null?void 0:c.type)!=="cancelation"&&console.error("Monaco initialization: error:",c)),()=>i.current?$():n.cancel()}),m(()=>{var c,v,_,O;let n=b(g.current,r||u||"",o||p||"",h||l||"");n!==((c=i.current)==null?void 0:c.getModel())&&(E&&j.set(a,(v=i.current)==null?void 0:v.saveViewState()),(_=i.current)==null||_.setModel(n),E&&((O=i.current)==null||O.restoreViewState(j.get(h))))},[h],s),m(()=>{var n;(n=i.current)==null||n.updateOptions(R)},[R],s),m(()=>{!i.current||u===void 0||(i.current.getOption(g.current.editor.EditorOption.readOnly)?i.current.setValue(u):u!==i.current.getValue()&&(k.current=!0,i.current.executeEdits("",[{range:i.current.getModel().getFullModelRange(),text:u,forceMoveMarkers:!0}]),i.current.pushUndoStop(),k.current=!1))},[u],s),m(()=>{var c,v;let n=(c=i.current)==null?void 0:c.getModel();n&&p&&((v=g.current)==null||v.editor.setModelLanguage(n,p))},[p],s),m(()=>{var n;L!==void 0&&((n=i.current)==null||n.revealLine(L))},[L],s),m(()=>{var n;(n=g.current)==null||n.editor.setTheme(w)},[w],s);let N=e.useCallback(()=>{var n;if(!(!C.current||!g.current)&&!S.current){I.current(g.current);let c=h||l,v=b(g.current,u||r||"",o||p||"",c||"");i.current=(n=g.current)==null?void 0:n.editor.create(C.current,{model:v,automaticLayout:!0,...R},U),E&&i.current.restoreViewState(j.get(c)),g.current.editor.setTheme(w),L!==void 0&&i.current.revealLine(L),f(!0),S.current=!0}},[r,o,l,u,p,h,R,U,E,w,L]);e.useEffect(()=>{s&&F.current(i.current,g.current)},[s]),e.useEffect(()=>{!d&&!s&&N()},[d,s,N]),t.current=u,e.useEffect(()=>{var n,c;s&&y&&((n=P.current)==null||n.dispose(),P.current=(c=i.current)==null?void 0:c.onDidChangeModelContent(v=>{k.current||y(i.current.getValue(),v)}))},[s,y]),e.useEffect(()=>{if(s){let n=g.current.editor.onDidChangeMarkers(c=>{var _;let v=(_=i.current.getModel())==null?void 0:_.uri;if(v&&c.find(O=>O.path===v.path)){let O=g.current.editor.getModelMarkers({resource:v});V==null||V(O)}});return()=>{n==null||n.dispose()}}return()=>{}},[s,V]);function $(){var n,c;(n=P.current)==null||n.dispose(),z?E&&j.set(h,i.current.saveViewState()):(c=i.current.getModel())==null||c.dispose(),i.current.dispose()}return e.createElement(T,{width:H,height:W,isEditorReady:s,loading:q,_ref:C,className:A,wrapperProps:B})}var Me=he,Z=e.memo(Me),ve=Z;exports.loader=Q;exports.Editor=Z;exports.default=ve;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|