npm - @hitachivantara/uikit-react-lab - Versions diffs - 5.13.0 → 5.13.1 - Mend

@hitachivantara/uikit-react-lab 5.13.0 → 5.13.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.

Files changed (5) hide show

package/dist/cjs/components/Flow/Sidebar/Sidebar.cjs CHANGED Viewed

@@ -84,7 +84,7 @@ const HvFlowSidebar = ({
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvDrawer, { BackdropComponent: void 0, variant: "persistent", classes: {
       paper: classes.drawerPaper
-    }, anchor, buttonTitle, ...others, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { id: drawerElementId, ref: setNodeRef, children: [
+    }, showBackdrop: false, anchor, buttonTitle, ...others, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { id: drawerElementId, ref: setNodeRef, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.titleContainer, children: [
         /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Add, { role: "none" }),
         /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { variant: "title3", children: title })

package/dist/cjs/components/Flow/Sidebar/Sidebar.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Sidebar.cjs","sources":["../../../../../src/components/Flow/Sidebar/Sidebar.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport debounce from \"lodash/debounce\";\nimport {\n DndContextProps,\n DragOverlay,\n DragOverlayProps,\n useDndMonitor,\n useDroppable,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\nimport {\n ExtractNames,\n HvDrawer,\n HvDrawerProps,\n HvInput,\n HvInputProps,\n HvTypography,\n useLabels,\n useUniqueId,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Add } from \"@hitachivantara/uikit-react-icons\";\n\nimport { staticClasses, useClasses } from \"./Sidebar.styles\";\nimport { HvFlowSidebarGroup } from \"./SidebarGroup\";\nimport { useFlowContext } from \"../hooks\";\nimport { buildGroups } from \"./utils\";\nimport { HvFlowSidebarGroupItem } from \"./SidebarGroup/SidebarGroupItem\";\n\nexport { staticClasses as flowSidebarClasses };\n\nexport type HvFlowSidebarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarProps\n extends Omit<HvDrawerProps, \"classes\" \| \"title\"> {\n /** Sidebar title. /\n title?: string;\n /* Sidebar description. /\n description?: string;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvFlowSidebarClasses;\n /* Labels used on the sidebar. /\n labels?: {\n itemAriaRoleDescription?: string;\n expandGroupButtonAriaLabel?: string;\n searchPlaceholder?: string;\n searchAriaLabel?: string;\n };\n /\n Dnd Kit drag overlay props for customization.\n \n More information can be found in the [Dnd Kit documentation](https://docs.dndkit.com/api-documentation/draggable/drag-overlay).\n */\n dragOverlayProps?: DragOverlayProps;\n}\n\nconst DEFAULT_LABELS: HvFlowSidebarProps[\"labels\"] = {\n itemAriaRoleDescription: \"Draggable\",\n expandGroupButtonAriaLabel: \"Expand group\",\n searchPlaceholder: \"Search node...\",\n searchAriaLabel: \"Search node...\",\n};\n\nexport const HvFlowSidebar = ({\n id,\n title,\n description,\n anchor = \"right\",\n buttonTitle = \"Close\",\n classes: classesProp,\n labels: labelsProps,\n dragOverlayProps,\n ...others\n}: HvFlowSidebarProps) => {\n const { classes } = useClasses(classesProp);\n\n const { nodeGroups, nodeTypes, setExpandedNodeGroups } = useFlowContext();\n\n const unfilteredGroups = useMemo(\n () => buildGroups(nodeGroups, nodeTypes),\n [nodeGroups, nodeTypes]\n );\n\n const [groups, setGroups] = useState(unfilteredGroups);\n const [draggingLabel, setDraggingLabel] = useState(undefined);\n\n useEffect(() => {\n setGroups(unfilteredGroups);\n }, [unfilteredGroups]);\n\n const labels = useLabels(DEFAULT_LABELS, labelsProps);\n\n const drawerElementId = useUniqueId(id, \"hvFlowSidebarDrawer\");\n const groupsElementId = useUniqueId(id, \"hvFlowSidebarGroups\");\n\n // The sidebar is droppable to distinguish between the canvas and the sidebar\n // Otherwise items dropped inside the sidebar will be added to the canvas\n const { setNodeRef } = useDroppable({\n id: drawerElementId,\n });\n\n const handleDragStart: DndContextProps[\"onDragStart\"] = (event) => {\n if (event.active.data.current?.hvFlow) {\n setDraggingLabel(event.active.data.current.hvFlow?.label);\n }\n };\n\n const handleDragEnd: DndContextProps[\"onDragEnd\"] = () => {\n setDraggingLabel(undefined);\n };\n\n useDndMonitor({\n onDragEnd: handleDragEnd,\n onDragStart: handleDragStart,\n });\n\n const handleSearch: HvInputProps[\"onChange\"] = (event, value) => {\n const gps = value\n ? Object.entries(unfilteredGroups).reduce((acc, curr) => {\n // Filter nodes by search\n const filteredNodes = curr[1].nodes.filter((obj) =>\n obj.label.toLocaleLowerCase().includes(value.toLocaleLowerCase())\n );\n const nodesCount = filteredNodes.length;\n\n // Only show groups with nodes\n if (nodesCount > 0) {\n acc[curr[0]] = {\n ...curr[1],\n nodes: filteredNodes,\n };\n }\n\n return acc;\n }, {})\n : unfilteredGroups;\n\n setGroups(gps);\n setExpandedNodeGroups?.(value ? Object.keys(gps) : []);\n };\n\n const handleDebouncedSearch = debounce(handleSearch, 500);\n\n return (\n <>\n <HvDrawer\n BackdropComponent={undefined}\n variant=\"persistent\"\n classes={{\n paper: classes.drawerPaper,\n }}\n anchor={anchor}\n buttonTitle={buttonTitle}\n {...others}\n >\n <div id={drawerElementId} ref={setNodeRef}>\n <div className={classes.titleContainer}>\n <Add role=\"none\" />\n <HvTypography variant=\"title3\">{title}</HvTypography>\n </div>\n <div className={classes.contentContainer}>\n <HvTypography className={classes.description}>\n {description}\n </HvTypography>\n <HvInput\n className={classes.searchRoot}\n type=\"search\"\n placeholder={labels?.searchPlaceholder}\n aria-label={labels?.searchAriaLabel}\n aria-controls={groupsElementId}\n aria-owns={groupsElementId}\n onChange={handleDebouncedSearch}\n inputProps={{ autoComplete: \"off\" }}\n />\n <ul id={groupsElementId} className={classes.groupsContainer}>\n {Object.entries(groups).map((obj) => {\n return (\n <HvFlowSidebarGroup\n key={obj[0]}\n id={obj[0]}\n expandButtonProps={{\n \"aria-label\": labels?.expandGroupButtonAriaLabel,\n }}\n itemProps={{\n \"aria-roledescription\": labels?.itemAriaRoleDescription,\n }}\n {...obj[1]}\n />\n );\n })}\n </ul>\n </div>\n </div>\n </HvDrawer>\n <DragOverlay modifiers={[restrictToWindowEdges]} {...dragOverlayProps}>\n {draggingLabel ? (\n <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n ) : null}\n </DragOverlay>\n </>\n );\n};\n"],"names":["DEFAULT_LABELS","itemAriaRoleDescription","expandGroupButtonAriaLabel","searchPlaceholder","searchAriaLabel","HvFlowSidebar","id","title","description","anchor","buttonTitle","classes","classesProp","labels","labelsProps","dragOverlayProps","others","useClasses","nodeGroups","nodeTypes","setExpandedNodeGroups","useFlowContext","unfilteredGroups","useMemo","buildGroups","groups","setGroups","useState","draggingLabel","setDraggingLabel","undefined","useEffect","useLabels","drawerElementId","useUniqueId","groupsElementId","setNodeRef","useDroppable","handleDragStart","event","active","data","current","hvFlow","label","handleDragEnd","useDndMonitor","onDragEnd","onDragStart","handleSearch","value","gps","Object","entries","reduce","acc","curr","filteredNodes","nodes","filter","obj","toLocaleLowerCase","includes","nodesCount","length","keys","handleDebouncedSearch","debounce","jsxs","Fragment","jsx","HvDrawer","paper","drawerPaper","titleContainer","Add","HvTypography","contentContainer","HvInput","searchRoot","autoComplete","groupsContainer","map","HvFlowSidebarGroup","DragOverlay","restrictToWindowEdges","HvFlowSidebarGroupItem"],"mappings":";;;;;;;;;;;;;;;;AAuDA,MAAMA,iBAA+C;AAAA,EACnDC,yBAAyB;AAAA,EACzBC,4BAA4B;AAAA,EAC5BC,mBAAmB;AAAA,EACnBC,iBAAiB;AACnB;AAEO,MAAMC,gBAAgBA,CAAC;AAAA,EAC5BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,SAAS;AAAA,EACTC,cAAc;AAAA,EACdC,SAASC;AAAAA,EACTC,QAAQC;AAAAA,EACRC;AAAAA,EACA,GAAGC;AACe,MAAM;AAClB,QAAA;AAAA,IAAEL;AAAAA,EAAAA,IAAYM,eAAAA,WAAWL,WAAW;AAEpC,QAAA;AAAA,IAAEM;AAAAA,IAAYC;AAAAA,IAAWC;AAAAA,MAA0BC,eAAe,eAAA;AAElEC,QAAAA,mBAAmBC,cACvB,MAAMC,kBAAYN,YAAYC,SAAS,GACvC,CAACD,YAAYC,SAAS,CACxB;AAEA,QAAM,CAACM,QAAQC,SAAS,IAAIC,eAASL,gBAAgB;AACrD,QAAM,CAACM,eAAeC,gBAAgB,IAAIF,MAAAA,SAASG,MAAS;AAE5DC,QAAAA,UAAU,MAAM;AACdL,cAAUJ,gBAAgB;AAAA,EAAA,GACzB,CAACA,gBAAgB,CAAC;AAEfT,QAAAA,SAASmB,eAAAA,UAAUhC,gBAAgBc,WAAW;AAE9CmB,QAAAA,kBAAkBC,eAAAA,YAAY5B,IAAI,qBAAqB;AACvD6B,QAAAA,kBAAkBD,eAAAA,YAAY5B,IAAI,qBAAqB;AAIvD,QAAA;AAAA,IAAE8B;AAAAA,MAAeC,kBAAa;AAAA,IAClC/B,IAAI2B;AAAAA,EAAAA,CACL;AAED,QAAMK,kBAAmDC,CAAU,UAAA;AACjE,QAAIA,MAAMC,OAAOC,KAAKC,SAASC,QAAQ;AACrCd,uBAAiBU,MAAMC,OAAOC,KAAKC,QAAQC,QAAQC,KAAK;AAAA,IAC1D;AAAA,EAAA;AAGF,QAAMC,gBAA8CA,MAAM;AACxDhB,qBAAiBC,MAAS;AAAA,EAAA;AAGdgB,qBAAA;AAAA,IACZC,WAAWF;AAAAA,IACXG,aAAaV;AAAAA,EAAAA,CACd;AAEKW,QAAAA,eAAyCA,CAACV,OAAOW,UAAU;AACzDC,UAAAA,MAAMD,QACRE,OAAOC,QAAQ/B,gBAAgB,EAAEgC,OAAO,CAACC,KAAKC,SAAS;AAErD,YAAMC,gBAAgBD,KAAK,CAAC,EAAEE,MAAMC,OAAQC,CAAAA,QAC1CA,IAAIhB,MAAMiB,oBAAoBC,SAASZ,MAAMW,kBAAmB,CAAA,CAClE;AACA,YAAME,aAAaN,cAAcO;AAGjC,UAAID,aAAa,GAAG;AACdP,YAAAA,KAAK,CAAC,CAAC,IAAI;AAAA,UACb,GAAGA,KAAK,CAAC;AAAA,UACTE,OAAOD;AAAAA,QAAAA;AAAAA,MAEX;AAEOF,aAAAA;AAAAA,IAAAA,GACN,CAAA,CAAE,IACLjC;AAEJI,cAAUyB,GAAG;AACb/B,4BAAwB8B,QAAQE,OAAOa,KAAKd,GAAG,IAAI,CAAA,CAAE;AAAA,EAAA;AAGjDe,QAAAA,wBAAwBC,kBAAAA,QAASlB,cAAc,GAAG;AAExD,SAEImB,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,IAAAC,2BAAA,IAACC,eACC,UAAA,EAAA,mBAAmBzC,QACnB,SAAQ,cACR,SAAS;AAAA,MACP0C,OAAO7D,QAAQ8D;AAAAA,IACjB,GACA,QACA,aACA,GAAIzD,QAEJ,0CAAC,OAAI,EAAA,IAAIiB,iBAAiB,KAAKG,YAC7B,UAAA;AAAA,MAACgC,2BAAA,KAAA,OAAA,EAAI,WAAWzD,QAAQ+D,gBACtB,UAAA;AAAA,QAACJ,2BAAAA,IAAAK,gBAAA,KAAA,EAAI,MAAK,OAAM,CAAA;AAAA,QACfL,2BAAA,IAAAM,eAAA,cAAA,EAAa,SAAQ,UAAUrE,UAAM,OAAA;AAAA,MAAA,GACxC;AAAA,MACC6D,2BAAA,KAAA,OAAA,EAAI,WAAWzD,QAAQkE,kBACtB,UAAA;AAAA,QAAAP,2BAAA,IAACM,eAAa,cAAA,EAAA,WAAWjE,QAAQH,aAC9BA,UACH,aAAA;AAAA,uCACCsE,eAAAA,SACC,EAAA,WAAWnE,QAAQoE,YACnB,MAAK,UACL,aAAalE,QAAQV,mBACrB,cAAYU,QAAQT,iBACpB,iBAAe+B,iBACf,aAAWA,iBACX,UAAU+B,uBACV,YAAY;AAAA,UAAEc,cAAc;AAAA,QAAA,GAAQ;AAAA,QAErCV,2BAAA,IAAA,MAAA,EAAG,IAAInC,iBAAiB,WAAWxB,QAAQsE,iBACzC7B,UAAAA,OAAOC,QAAQ5B,MAAM,EAAEyD,IAAKtB,CAAQ,QAAA;AACnC,gDACGuB,aAAAA,oBAEC,EAAA,IAAIvB,IAAI,CAAC,GACT,mBAAmB;AAAA,YACjB,cAAc/C,QAAQX;AAAAA,aAExB,WAAW;AAAA,YACT,wBAAwBW,QAAQZ;AAAAA,UAAAA,GAE9B2D,GAAAA,IAAI,CAAC,EARJA,GAAAA,IAAI,CAAC,CASV;AAAA,QAEL,CAAA,GACH;AAAA,MAAA,GACF;AAAA,IAAA,EAAA,CACF,EACF,CAAA;AAAA,mCACCwB,KAAY,aAAA,EAAA,WAAW,CAACC,UAAAA,qBAAqB,GAAG,GAAItE,kBAClDa,UACC,gBAAA0C,2BAAAA,IAACgB,2CAAuB,OAAO1D,eAAe,YAAU,KAAA,CAAA,IACtD,MACN;AAAA,EACF,EAAA,CAAA;AAEJ;;;"}
1	+ {"version":3,"file":"Sidebar.cjs","sources":["../../../../../src/components/Flow/Sidebar/Sidebar.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport debounce from \"lodash/debounce\";\nimport {\n DndContextProps,\n DragOverlay,\n DragOverlayProps,\n useDndMonitor,\n useDroppable,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\nimport {\n ExtractNames,\n HvDrawer,\n HvDrawerProps,\n HvInput,\n HvInputProps,\n HvTypography,\n useLabels,\n useUniqueId,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Add } from \"@hitachivantara/uikit-react-icons\";\n\nimport { staticClasses, useClasses } from \"./Sidebar.styles\";\nimport { HvFlowSidebarGroup } from \"./SidebarGroup\";\nimport { useFlowContext } from \"../hooks\";\nimport { buildGroups } from \"./utils\";\nimport { HvFlowSidebarGroupItem } from \"./SidebarGroup/SidebarGroupItem\";\n\nexport { staticClasses as flowSidebarClasses };\n\nexport type HvFlowSidebarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarProps\n extends Omit<HvDrawerProps, \"classes\" \| \"title\"> {\n /** Sidebar title. /\n title?: string;\n /* Sidebar description. /\n description?: string;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvFlowSidebarClasses;\n /* Labels used on the sidebar. /\n labels?: {\n itemAriaRoleDescription?: string;\n expandGroupButtonAriaLabel?: string;\n searchPlaceholder?: string;\n searchAriaLabel?: string;\n };\n /\n Dnd Kit drag overlay props for customization.\n \n More information can be found in the [Dnd Kit documentation](https://docs.dndkit.com/api-documentation/draggable/drag-overlay).\n */\n dragOverlayProps?: DragOverlayProps;\n}\n\nconst DEFAULT_LABELS: HvFlowSidebarProps[\"labels\"] = {\n itemAriaRoleDescription: \"Draggable\",\n expandGroupButtonAriaLabel: \"Expand group\",\n searchPlaceholder: \"Search node...\",\n searchAriaLabel: \"Search node...\",\n};\n\nexport const HvFlowSidebar = ({\n id,\n title,\n description,\n anchor = \"right\",\n buttonTitle = \"Close\",\n classes: classesProp,\n labels: labelsProps,\n dragOverlayProps,\n ...others\n}: HvFlowSidebarProps) => {\n const { classes } = useClasses(classesProp);\n\n const { nodeGroups, nodeTypes, setExpandedNodeGroups } = useFlowContext();\n\n const unfilteredGroups = useMemo(\n () => buildGroups(nodeGroups, nodeTypes),\n [nodeGroups, nodeTypes]\n );\n\n const [groups, setGroups] = useState(unfilteredGroups);\n const [draggingLabel, setDraggingLabel] = useState(undefined);\n\n useEffect(() => {\n setGroups(unfilteredGroups);\n }, [unfilteredGroups]);\n\n const labels = useLabels(DEFAULT_LABELS, labelsProps);\n\n const drawerElementId = useUniqueId(id, \"hvFlowSidebarDrawer\");\n const groupsElementId = useUniqueId(id, \"hvFlowSidebarGroups\");\n\n // The sidebar is droppable to distinguish between the canvas and the sidebar\n // Otherwise items dropped inside the sidebar will be added to the canvas\n const { setNodeRef } = useDroppable({\n id: drawerElementId,\n });\n\n const handleDragStart: DndContextProps[\"onDragStart\"] = (event) => {\n if (event.active.data.current?.hvFlow) {\n setDraggingLabel(event.active.data.current.hvFlow?.label);\n }\n };\n\n const handleDragEnd: DndContextProps[\"onDragEnd\"] = () => {\n setDraggingLabel(undefined);\n };\n\n useDndMonitor({\n onDragEnd: handleDragEnd,\n onDragStart: handleDragStart,\n });\n\n const handleSearch: HvInputProps[\"onChange\"] = (event, value) => {\n const gps = value\n ? Object.entries(unfilteredGroups).reduce((acc, curr) => {\n // Filter nodes by search\n const filteredNodes = curr[1].nodes.filter((obj) =>\n obj.label.toLocaleLowerCase().includes(value.toLocaleLowerCase())\n );\n const nodesCount = filteredNodes.length;\n\n // Only show groups with nodes\n if (nodesCount > 0) {\n acc[curr[0]] = {\n ...curr[1],\n nodes: filteredNodes,\n };\n }\n\n return acc;\n }, {})\n : unfilteredGroups;\n\n setGroups(gps);\n setExpandedNodeGroups?.(value ? Object.keys(gps) : []);\n };\n\n const handleDebouncedSearch = debounce(handleSearch, 500);\n\n return (\n <>\n <HvDrawer\n BackdropComponent={undefined}\n variant=\"persistent\"\n classes={{\n paper: classes.drawerPaper,\n }}\n showBackdrop={false}\n anchor={anchor}\n buttonTitle={buttonTitle}\n {...others}\n >\n <div id={drawerElementId} ref={setNodeRef}>\n <div className={classes.titleContainer}>\n <Add role=\"none\" />\n <HvTypography variant=\"title3\">{title}</HvTypography>\n </div>\n <div className={classes.contentContainer}>\n <HvTypography className={classes.description}>\n {description}\n </HvTypography>\n <HvInput\n className={classes.searchRoot}\n type=\"search\"\n placeholder={labels?.searchPlaceholder}\n aria-label={labels?.searchAriaLabel}\n aria-controls={groupsElementId}\n aria-owns={groupsElementId}\n onChange={handleDebouncedSearch}\n inputProps={{ autoComplete: \"off\" }}\n />\n <ul id={groupsElementId} className={classes.groupsContainer}>\n {Object.entries(groups).map((obj) => {\n return (\n <HvFlowSidebarGroup\n key={obj[0]}\n id={obj[0]}\n expandButtonProps={{\n \"aria-label\": labels?.expandGroupButtonAriaLabel,\n }}\n itemProps={{\n \"aria-roledescription\": labels?.itemAriaRoleDescription,\n }}\n {...obj[1]}\n />\n );\n })}\n </ul>\n </div>\n </div>\n </HvDrawer>\n <DragOverlay modifiers={[restrictToWindowEdges]} {...dragOverlayProps}>\n {draggingLabel ? (\n <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n ) : null}\n </DragOverlay>\n </>\n );\n};\n"],"names":["DEFAULT_LABELS","itemAriaRoleDescription","expandGroupButtonAriaLabel","searchPlaceholder","searchAriaLabel","HvFlowSidebar","id","title","description","anchor","buttonTitle","classes","classesProp","labels","labelsProps","dragOverlayProps","others","useClasses","nodeGroups","nodeTypes","setExpandedNodeGroups","useFlowContext","unfilteredGroups","useMemo","buildGroups","groups","setGroups","useState","draggingLabel","setDraggingLabel","undefined","useEffect","useLabels","drawerElementId","useUniqueId","groupsElementId","setNodeRef","useDroppable","handleDragStart","event","active","data","current","hvFlow","label","handleDragEnd","useDndMonitor","onDragEnd","onDragStart","handleSearch","value","gps","Object","entries","reduce","acc","curr","filteredNodes","nodes","filter","obj","toLocaleLowerCase","includes","nodesCount","length","keys","handleDebouncedSearch","debounce","jsxs","Fragment","jsx","HvDrawer","paper","drawerPaper","titleContainer","Add","HvTypography","contentContainer","HvInput","searchRoot","autoComplete","groupsContainer","map","HvFlowSidebarGroup","DragOverlay","restrictToWindowEdges","HvFlowSidebarGroupItem"],"mappings":";;;;;;;;;;;;;;;;AAuDA,MAAMA,iBAA+C;AAAA,EACnDC,yBAAyB;AAAA,EACzBC,4BAA4B;AAAA,EAC5BC,mBAAmB;AAAA,EACnBC,iBAAiB;AACnB;AAEO,MAAMC,gBAAgBA,CAAC;AAAA,EAC5BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,SAAS;AAAA,EACTC,cAAc;AAAA,EACdC,SAASC;AAAAA,EACTC,QAAQC;AAAAA,EACRC;AAAAA,EACA,GAAGC;AACe,MAAM;AAClB,QAAA;AAAA,IAAEL;AAAAA,EAAAA,IAAYM,eAAAA,WAAWL,WAAW;AAEpC,QAAA;AAAA,IAAEM;AAAAA,IAAYC;AAAAA,IAAWC;AAAAA,MAA0BC,eAAe,eAAA;AAElEC,QAAAA,mBAAmBC,cACvB,MAAMC,kBAAYN,YAAYC,SAAS,GACvC,CAACD,YAAYC,SAAS,CACxB;AAEA,QAAM,CAACM,QAAQC,SAAS,IAAIC,eAASL,gBAAgB;AACrD,QAAM,CAACM,eAAeC,gBAAgB,IAAIF,MAAAA,SAASG,MAAS;AAE5DC,QAAAA,UAAU,MAAM;AACdL,cAAUJ,gBAAgB;AAAA,EAAA,GACzB,CAACA,gBAAgB,CAAC;AAEfT,QAAAA,SAASmB,eAAAA,UAAUhC,gBAAgBc,WAAW;AAE9CmB,QAAAA,kBAAkBC,eAAAA,YAAY5B,IAAI,qBAAqB;AACvD6B,QAAAA,kBAAkBD,eAAAA,YAAY5B,IAAI,qBAAqB;AAIvD,QAAA;AAAA,IAAE8B;AAAAA,MAAeC,kBAAa;AAAA,IAClC/B,IAAI2B;AAAAA,EAAAA,CACL;AAED,QAAMK,kBAAmDC,CAAU,UAAA;AACjE,QAAIA,MAAMC,OAAOC,KAAKC,SAASC,QAAQ;AACrCd,uBAAiBU,MAAMC,OAAOC,KAAKC,QAAQC,QAAQC,KAAK;AAAA,IAC1D;AAAA,EAAA;AAGF,QAAMC,gBAA8CA,MAAM;AACxDhB,qBAAiBC,MAAS;AAAA,EAAA;AAGdgB,qBAAA;AAAA,IACZC,WAAWF;AAAAA,IACXG,aAAaV;AAAAA,EAAAA,CACd;AAEKW,QAAAA,eAAyCA,CAACV,OAAOW,UAAU;AACzDC,UAAAA,MAAMD,QACRE,OAAOC,QAAQ/B,gBAAgB,EAAEgC,OAAO,CAACC,KAAKC,SAAS;AAErD,YAAMC,gBAAgBD,KAAK,CAAC,EAAEE,MAAMC,OAAQC,CAAAA,QAC1CA,IAAIhB,MAAMiB,oBAAoBC,SAASZ,MAAMW,kBAAmB,CAAA,CAClE;AACA,YAAME,aAAaN,cAAcO;AAGjC,UAAID,aAAa,GAAG;AACdP,YAAAA,KAAK,CAAC,CAAC,IAAI;AAAA,UACb,GAAGA,KAAK,CAAC;AAAA,UACTE,OAAOD;AAAAA,QAAAA;AAAAA,MAEX;AAEOF,aAAAA;AAAAA,IAAAA,GACN,CAAA,CAAE,IACLjC;AAEJI,cAAUyB,GAAG;AACb/B,4BAAwB8B,QAAQE,OAAOa,KAAKd,GAAG,IAAI,CAAA,CAAE;AAAA,EAAA;AAGjDe,QAAAA,wBAAwBC,kBAAAA,QAASlB,cAAc,GAAG;AAExD,SAEImB,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,IAAAC,2BAAA,IAACC,eACC,UAAA,EAAA,mBAAmBzC,QACnB,SAAQ,cACR,SAAS;AAAA,MACP0C,OAAO7D,QAAQ8D;AAAAA,IAAAA,GAEjB,cAAc,OACd,QACA,aACIzD,GAAAA,QAEJ,UAAAoD,2BAAA,KAAC,OAAI,EAAA,IAAInC,iBAAiB,KAAKG,YAC7B,UAAA;AAAA,MAACgC,2BAAA,KAAA,OAAA,EAAI,WAAWzD,QAAQ+D,gBACtB,UAAA;AAAA,QAACJ,2BAAAA,IAAAK,gBAAA,KAAA,EAAI,MAAK,OAAM,CAAA;AAAA,QACfL,2BAAA,IAAAM,eAAA,cAAA,EAAa,SAAQ,UAAUrE,UAAM,OAAA;AAAA,MAAA,GACxC;AAAA,MACC6D,2BAAA,KAAA,OAAA,EAAI,WAAWzD,QAAQkE,kBACtB,UAAA;AAAA,QAAAP,2BAAA,IAACM,eAAa,cAAA,EAAA,WAAWjE,QAAQH,aAC9BA,UACH,aAAA;AAAA,uCACCsE,eAAAA,SACC,EAAA,WAAWnE,QAAQoE,YACnB,MAAK,UACL,aAAalE,QAAQV,mBACrB,cAAYU,QAAQT,iBACpB,iBAAe+B,iBACf,aAAWA,iBACX,UAAU+B,uBACV,YAAY;AAAA,UAAEc,cAAc;AAAA,QAAA,GAAQ;AAAA,QAErCV,2BAAA,IAAA,MAAA,EAAG,IAAInC,iBAAiB,WAAWxB,QAAQsE,iBACzC7B,UAAAA,OAAOC,QAAQ5B,MAAM,EAAEyD,IAAKtB,CAAQ,QAAA;AACnC,gDACGuB,aAAAA,oBAEC,EAAA,IAAIvB,IAAI,CAAC,GACT,mBAAmB;AAAA,YACjB,cAAc/C,QAAQX;AAAAA,aAExB,WAAW;AAAA,YACT,wBAAwBW,QAAQZ;AAAAA,UAAAA,GAE9B2D,GAAAA,IAAI,CAAC,EARJA,GAAAA,IAAI,CAAC,CASV;AAAA,QAEL,CAAA,GACH;AAAA,MAAA,GACF;AAAA,IAAA,EAAA,CACF,EACF,CAAA;AAAA,mCACCwB,KAAY,aAAA,EAAA,WAAW,CAACC,UAAAA,qBAAqB,GAAG,GAAItE,kBAClDa,UACC,gBAAA0C,2BAAAA,IAACgB,2CAAuB,OAAO1D,eAAe,YAAU,KAAA,CAAA,IACtD,MACN;AAAA,EACF,EAAA,CAAA;AAEJ;;;"}

package/dist/esm/components/Flow/Sidebar/Sidebar.js CHANGED Viewed

@@ -81,7 +81,7 @@ const HvFlowSidebar = ({
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(HvDrawer, { BackdropComponent: void 0, variant: "persistent", classes: {
       paper: classes.drawerPaper
-    }, anchor, buttonTitle, ...others, children: /* @__PURE__ */ jsxs("div", { id: drawerElementId, ref: setNodeRef, children: [
+    }, showBackdrop: false, anchor, buttonTitle, ...others, children: /* @__PURE__ */ jsxs("div", { id: drawerElementId, ref: setNodeRef, children: [
       /* @__PURE__ */ jsxs("div", { className: classes.titleContainer, children: [
         /* @__PURE__ */ jsx(Add, { role: "none" }),
         /* @__PURE__ */ jsx(HvTypography, { variant: "title3", children: title })

package/dist/esm/components/Flow/Sidebar/Sidebar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Sidebar.js","sources":["../../../../../src/components/Flow/Sidebar/Sidebar.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport debounce from \"lodash/debounce\";\nimport {\n DndContextProps,\n DragOverlay,\n DragOverlayProps,\n useDndMonitor,\n useDroppable,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\nimport {\n ExtractNames,\n HvDrawer,\n HvDrawerProps,\n HvInput,\n HvInputProps,\n HvTypography,\n useLabels,\n useUniqueId,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Add } from \"@hitachivantara/uikit-react-icons\";\n\nimport { staticClasses, useClasses } from \"./Sidebar.styles\";\nimport { HvFlowSidebarGroup } from \"./SidebarGroup\";\nimport { useFlowContext } from \"../hooks\";\nimport { buildGroups } from \"./utils\";\nimport { HvFlowSidebarGroupItem } from \"./SidebarGroup/SidebarGroupItem\";\n\nexport { staticClasses as flowSidebarClasses };\n\nexport type HvFlowSidebarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarProps\n extends Omit<HvDrawerProps, \"classes\" \| \"title\"> {\n /** Sidebar title. /\n title?: string;\n /* Sidebar description. /\n description?: string;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvFlowSidebarClasses;\n /* Labels used on the sidebar. /\n labels?: {\n itemAriaRoleDescription?: string;\n expandGroupButtonAriaLabel?: string;\n searchPlaceholder?: string;\n searchAriaLabel?: string;\n };\n /\n Dnd Kit drag overlay props for customization.\n \n More information can be found in the [Dnd Kit documentation](https://docs.dndkit.com/api-documentation/draggable/drag-overlay).\n */\n dragOverlayProps?: DragOverlayProps;\n}\n\nconst DEFAULT_LABELS: HvFlowSidebarProps[\"labels\"] = {\n itemAriaRoleDescription: \"Draggable\",\n expandGroupButtonAriaLabel: \"Expand group\",\n searchPlaceholder: \"Search node...\",\n searchAriaLabel: \"Search node...\",\n};\n\nexport const HvFlowSidebar = ({\n id,\n title,\n description,\n anchor = \"right\",\n buttonTitle = \"Close\",\n classes: classesProp,\n labels: labelsProps,\n dragOverlayProps,\n ...others\n}: HvFlowSidebarProps) => {\n const { classes } = useClasses(classesProp);\n\n const { nodeGroups, nodeTypes, setExpandedNodeGroups } = useFlowContext();\n\n const unfilteredGroups = useMemo(\n () => buildGroups(nodeGroups, nodeTypes),\n [nodeGroups, nodeTypes]\n );\n\n const [groups, setGroups] = useState(unfilteredGroups);\n const [draggingLabel, setDraggingLabel] = useState(undefined);\n\n useEffect(() => {\n setGroups(unfilteredGroups);\n }, [unfilteredGroups]);\n\n const labels = useLabels(DEFAULT_LABELS, labelsProps);\n\n const drawerElementId = useUniqueId(id, \"hvFlowSidebarDrawer\");\n const groupsElementId = useUniqueId(id, \"hvFlowSidebarGroups\");\n\n // The sidebar is droppable to distinguish between the canvas and the sidebar\n // Otherwise items dropped inside the sidebar will be added to the canvas\n const { setNodeRef } = useDroppable({\n id: drawerElementId,\n });\n\n const handleDragStart: DndContextProps[\"onDragStart\"] = (event) => {\n if (event.active.data.current?.hvFlow) {\n setDraggingLabel(event.active.data.current.hvFlow?.label);\n }\n };\n\n const handleDragEnd: DndContextProps[\"onDragEnd\"] = () => {\n setDraggingLabel(undefined);\n };\n\n useDndMonitor({\n onDragEnd: handleDragEnd,\n onDragStart: handleDragStart,\n });\n\n const handleSearch: HvInputProps[\"onChange\"] = (event, value) => {\n const gps = value\n ? Object.entries(unfilteredGroups).reduce((acc, curr) => {\n // Filter nodes by search\n const filteredNodes = curr[1].nodes.filter((obj) =>\n obj.label.toLocaleLowerCase().includes(value.toLocaleLowerCase())\n );\n const nodesCount = filteredNodes.length;\n\n // Only show groups with nodes\n if (nodesCount > 0) {\n acc[curr[0]] = {\n ...curr[1],\n nodes: filteredNodes,\n };\n }\n\n return acc;\n }, {})\n : unfilteredGroups;\n\n setGroups(gps);\n setExpandedNodeGroups?.(value ? Object.keys(gps) : []);\n };\n\n const handleDebouncedSearch = debounce(handleSearch, 500);\n\n return (\n <>\n <HvDrawer\n BackdropComponent={undefined}\n variant=\"persistent\"\n classes={{\n paper: classes.drawerPaper,\n }}\n anchor={anchor}\n buttonTitle={buttonTitle}\n {...others}\n >\n <div id={drawerElementId} ref={setNodeRef}>\n <div className={classes.titleContainer}>\n <Add role=\"none\" />\n <HvTypography variant=\"title3\">{title}</HvTypography>\n </div>\n <div className={classes.contentContainer}>\n <HvTypography className={classes.description}>\n {description}\n </HvTypography>\n <HvInput\n className={classes.searchRoot}\n type=\"search\"\n placeholder={labels?.searchPlaceholder}\n aria-label={labels?.searchAriaLabel}\n aria-controls={groupsElementId}\n aria-owns={groupsElementId}\n onChange={handleDebouncedSearch}\n inputProps={{ autoComplete: \"off\" }}\n />\n <ul id={groupsElementId} className={classes.groupsContainer}>\n {Object.entries(groups).map((obj) => {\n return (\n <HvFlowSidebarGroup\n key={obj[0]}\n id={obj[0]}\n expandButtonProps={{\n \"aria-label\": labels?.expandGroupButtonAriaLabel,\n }}\n itemProps={{\n \"aria-roledescription\": labels?.itemAriaRoleDescription,\n }}\n {...obj[1]}\n />\n );\n })}\n </ul>\n </div>\n </div>\n </HvDrawer>\n <DragOverlay modifiers={[restrictToWindowEdges]} {...dragOverlayProps}>\n {draggingLabel ? (\n <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n ) : null}\n </DragOverlay>\n </>\n );\n};\n"],"names":["DEFAULT_LABELS","itemAriaRoleDescription","expandGroupButtonAriaLabel","searchPlaceholder","searchAriaLabel","HvFlowSidebar","id","title","description","anchor","buttonTitle","classes","classesProp","labels","labelsProps","dragOverlayProps","others","useClasses","nodeGroups","nodeTypes","setExpandedNodeGroups","useFlowContext","unfilteredGroups","useMemo","buildGroups","groups","setGroups","useState","draggingLabel","setDraggingLabel","undefined","useEffect","useLabels","drawerElementId","useUniqueId","groupsElementId","setNodeRef","useDroppable","handleDragStart","event","active","data","current","hvFlow","label","handleDragEnd","onDragEnd","onDragStart","handleSearch","value","gps","Object","entries","reduce","acc","curr","filteredNodes","nodes","filter","obj","toLocaleLowerCase","includes","nodesCount","length","keys","handleDebouncedSearch","debounce","paper","drawerPaper","titleContainer","contentContainer","searchRoot","autoComplete","groupsContainer","map","restrictToWindowEdges"],"mappings":"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"}
1	+ {"version":3,"file":"Sidebar.js","sources":["../../../../../src/components/Flow/Sidebar/Sidebar.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport debounce from \"lodash/debounce\";\nimport {\n DndContextProps,\n DragOverlay,\n DragOverlayProps,\n useDndMonitor,\n useDroppable,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\nimport {\n ExtractNames,\n HvDrawer,\n HvDrawerProps,\n HvInput,\n HvInputProps,\n HvTypography,\n useLabels,\n useUniqueId,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Add } from \"@hitachivantara/uikit-react-icons\";\n\nimport { staticClasses, useClasses } from \"./Sidebar.styles\";\nimport { HvFlowSidebarGroup } from \"./SidebarGroup\";\nimport { useFlowContext } from \"../hooks\";\nimport { buildGroups } from \"./utils\";\nimport { HvFlowSidebarGroupItem } from \"./SidebarGroup/SidebarGroupItem\";\n\nexport { staticClasses as flowSidebarClasses };\n\nexport type HvFlowSidebarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarProps\n extends Omit<HvDrawerProps, \"classes\" \| \"title\"> {\n /** Sidebar title. /\n title?: string;\n /* Sidebar description. /\n description?: string;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvFlowSidebarClasses;\n /* Labels used on the sidebar. /\n labels?: {\n itemAriaRoleDescription?: string;\n expandGroupButtonAriaLabel?: string;\n searchPlaceholder?: string;\n searchAriaLabel?: string;\n };\n /\n Dnd Kit drag overlay props for customization.\n \n More information can be found in the [Dnd Kit documentation](https://docs.dndkit.com/api-documentation/draggable/drag-overlay).\n */\n dragOverlayProps?: DragOverlayProps;\n}\n\nconst DEFAULT_LABELS: HvFlowSidebarProps[\"labels\"] = {\n itemAriaRoleDescription: \"Draggable\",\n expandGroupButtonAriaLabel: \"Expand group\",\n searchPlaceholder: \"Search node...\",\n searchAriaLabel: \"Search node...\",\n};\n\nexport const HvFlowSidebar = ({\n id,\n title,\n description,\n anchor = \"right\",\n buttonTitle = \"Close\",\n classes: classesProp,\n labels: labelsProps,\n dragOverlayProps,\n ...others\n}: HvFlowSidebarProps) => {\n const { classes } = useClasses(classesProp);\n\n const { nodeGroups, nodeTypes, setExpandedNodeGroups } = useFlowContext();\n\n const unfilteredGroups = useMemo(\n () => buildGroups(nodeGroups, nodeTypes),\n [nodeGroups, nodeTypes]\n );\n\n const [groups, setGroups] = useState(unfilteredGroups);\n const [draggingLabel, setDraggingLabel] = useState(undefined);\n\n useEffect(() => {\n setGroups(unfilteredGroups);\n }, [unfilteredGroups]);\n\n const labels = useLabels(DEFAULT_LABELS, labelsProps);\n\n const drawerElementId = useUniqueId(id, \"hvFlowSidebarDrawer\");\n const groupsElementId = useUniqueId(id, \"hvFlowSidebarGroups\");\n\n // The sidebar is droppable to distinguish between the canvas and the sidebar\n // Otherwise items dropped inside the sidebar will be added to the canvas\n const { setNodeRef } = useDroppable({\n id: drawerElementId,\n });\n\n const handleDragStart: DndContextProps[\"onDragStart\"] = (event) => {\n if (event.active.data.current?.hvFlow) {\n setDraggingLabel(event.active.data.current.hvFlow?.label);\n }\n };\n\n const handleDragEnd: DndContextProps[\"onDragEnd\"] = () => {\n setDraggingLabel(undefined);\n };\n\n useDndMonitor({\n onDragEnd: handleDragEnd,\n onDragStart: handleDragStart,\n });\n\n const handleSearch: HvInputProps[\"onChange\"] = (event, value) => {\n const gps = value\n ? Object.entries(unfilteredGroups).reduce((acc, curr) => {\n // Filter nodes by search\n const filteredNodes = curr[1].nodes.filter((obj) =>\n obj.label.toLocaleLowerCase().includes(value.toLocaleLowerCase())\n );\n const nodesCount = filteredNodes.length;\n\n // Only show groups with nodes\n if (nodesCount > 0) {\n acc[curr[0]] = {\n ...curr[1],\n nodes: filteredNodes,\n };\n }\n\n return acc;\n }, {})\n : unfilteredGroups;\n\n setGroups(gps);\n setExpandedNodeGroups?.(value ? Object.keys(gps) : []);\n };\n\n const handleDebouncedSearch = debounce(handleSearch, 500);\n\n return (\n <>\n <HvDrawer\n BackdropComponent={undefined}\n variant=\"persistent\"\n classes={{\n paper: classes.drawerPaper,\n }}\n showBackdrop={false}\n anchor={anchor}\n buttonTitle={buttonTitle}\n {...others}\n >\n <div id={drawerElementId} ref={setNodeRef}>\n <div className={classes.titleContainer}>\n <Add role=\"none\" />\n <HvTypography variant=\"title3\">{title}</HvTypography>\n </div>\n <div className={classes.contentContainer}>\n <HvTypography className={classes.description}>\n {description}\n </HvTypography>\n <HvInput\n className={classes.searchRoot}\n type=\"search\"\n placeholder={labels?.searchPlaceholder}\n aria-label={labels?.searchAriaLabel}\n aria-controls={groupsElementId}\n aria-owns={groupsElementId}\n onChange={handleDebouncedSearch}\n inputProps={{ autoComplete: \"off\" }}\n />\n <ul id={groupsElementId} className={classes.groupsContainer}>\n {Object.entries(groups).map((obj) => {\n return (\n <HvFlowSidebarGroup\n key={obj[0]}\n id={obj[0]}\n expandButtonProps={{\n \"aria-label\": labels?.expandGroupButtonAriaLabel,\n }}\n itemProps={{\n \"aria-roledescription\": labels?.itemAriaRoleDescription,\n }}\n {...obj[1]}\n />\n );\n })}\n </ul>\n </div>\n </div>\n </HvDrawer>\n <DragOverlay modifiers={[restrictToWindowEdges]} {...dragOverlayProps}>\n {draggingLabel ? (\n <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n ) : null}\n </DragOverlay>\n </>\n );\n};\n"],"names":["DEFAULT_LABELS","itemAriaRoleDescription","expandGroupButtonAriaLabel","searchPlaceholder","searchAriaLabel","HvFlowSidebar","id","title","description","anchor","buttonTitle","classes","classesProp","labels","labelsProps","dragOverlayProps","others","useClasses","nodeGroups","nodeTypes","setExpandedNodeGroups","useFlowContext","unfilteredGroups","useMemo","buildGroups","groups","setGroups","useState","draggingLabel","setDraggingLabel","undefined","useEffect","useLabels","drawerElementId","useUniqueId","groupsElementId","setNodeRef","useDroppable","handleDragStart","event","active","data","current","hvFlow","label","handleDragEnd","onDragEnd","onDragStart","handleSearch","value","gps","Object","entries","reduce","acc","curr","filteredNodes","nodes","filter","obj","toLocaleLowerCase","includes","nodesCount","length","keys","handleDebouncedSearch","debounce","paper","drawerPaper","titleContainer","contentContainer","searchRoot","autoComplete","groupsContainer","map","restrictToWindowEdges"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-lab",
-  "version": "5.13.0",
+  "version": "5.13.1",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "Contributed React components for the NEXT UI Kit.",
@@ -32,7 +32,7 @@
     "@dnd-kit/core": "^6.0.8",
     "@dnd-kit/modifiers": "^6.0.1",
     "@emotion/css": "^11.11.0",
-    "@hitachivantara/uikit-react-core": "^5.35.0",
+    "@hitachivantara/uikit-react-core": "^5.36.0",
     "@hitachivantara/uikit-react-icons": "^5.6.12",
     "@hitachivantara/uikit-styles": "^5.16.0",
     "lodash": "^4.17.21",
@@ -48,7 +48,7 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "e322581164467dcb33d75ddcd8cfc12da884f71e",
+  "gitHead": "e0cb17343a2120b95474818aa0d2b693843e140f",
   "main": "dist/cjs/index.cjs",
   "exports": {
     ".": {