@hitachivantara/uikit-react-lab 5.19.2 → 5.19.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/Dashboard/Dashboard.cjs.map +1 -0
- package/dist/cjs/Dashboard/Dashboard.styles.cjs.map +1 -0
- package/dist/cjs/Flow/Background/Background.cjs.map +1 -0
- package/dist/cjs/Flow/Controls/Controls.cjs.map +1 -0
- package/dist/cjs/Flow/DroppableFlow.cjs.map +1 -0
- package/dist/cjs/Flow/Empty/Empty.cjs.map +1 -0
- package/dist/cjs/Flow/Empty/Empty.styles.cjs.map +1 -0
- package/dist/cjs/Flow/Flow.cjs.map +1 -0
- package/dist/cjs/Flow/Flow.styles.cjs.map +1 -0
- package/dist/cjs/Flow/FlowContext/FlowContext.cjs.map +1 -0
- package/dist/cjs/Flow/FlowContext/NodeMetaContext.cjs.map +1 -0
- package/dist/cjs/Flow/Minimap/Minimap.cjs.map +1 -0
- package/dist/cjs/Flow/Minimap/Minimap.styles.cjs.map +1 -0
- package/dist/cjs/Flow/Node/BaseNode.cjs.map +1 -0
- package/dist/cjs/Flow/Node/BaseNode.styles.cjs.map +1 -0
- package/dist/cjs/Flow/Node/Node.cjs.map +1 -0
- package/dist/cjs/Flow/Node/Node.styles.cjs.map +1 -0
- package/dist/cjs/Flow/Node/Parameters/ParamRenderer.cjs.map +1 -0
- package/dist/cjs/Flow/Node/Parameters/Select.cjs.map +1 -0
- package/dist/cjs/Flow/Node/Parameters/Text.cjs.map +1 -0
- package/dist/cjs/Flow/Sidebar/Sidebar.cjs.map +1 -0
- package/dist/cjs/Flow/Sidebar/Sidebar.styles.cjs.map +1 -0
- package/dist/cjs/Flow/Sidebar/SidebarGroup/SidebarGroup.cjs.map +1 -0
- package/dist/cjs/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.cjs.map +1 -0
- package/dist/cjs/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.cjs +2 -2
- package/dist/cjs/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.cjs.map +1 -0
- package/dist/cjs/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.cjs.map +1 -0
- package/dist/cjs/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.cjs.map +1 -0
- package/dist/cjs/Flow/Sidebar/utils.cjs.map +1 -0
- package/dist/cjs/Flow/base.cjs.map +1 -0
- package/dist/cjs/Flow/hooks/useFlowContext.cjs.map +1 -0
- package/dist/cjs/Flow/hooks/useFlowNode.cjs.map +1 -0
- package/dist/cjs/Flow/hooks/useFlowNodeMeta.cjs.map +1 -0
- package/dist/cjs/StepNavigation/DefaultNavigation/DefaultNavigation.cjs.map +1 -0
- package/dist/cjs/StepNavigation/DefaultNavigation/Step/Step.cjs.map +1 -0
- package/dist/cjs/StepNavigation/DefaultNavigation/Step/Step.styles.cjs.map +1 -0
- package/dist/cjs/StepNavigation/DefaultNavigation/utils.cjs.map +1 -0
- package/dist/cjs/StepNavigation/SimpleNavigation/Dot/Dot.cjs.map +1 -0
- package/dist/cjs/StepNavigation/SimpleNavigation/Dot/Dot.styles.cjs.map +1 -0
- package/dist/cjs/StepNavigation/SimpleNavigation/SimpleNavigation.cjs.map +1 -0
- package/dist/cjs/StepNavigation/SimpleNavigation/utils.cjs.map +1 -0
- package/dist/cjs/StepNavigation/StepNavigation.cjs.map +1 -0
- package/dist/cjs/StepNavigation/StepNavigation.styles.cjs.map +1 -0
- package/dist/cjs/StepNavigation/utils.cjs.map +1 -0
- package/dist/cjs/Wizard/Wizard.cjs.map +1 -0
- package/dist/cjs/Wizard/Wizard.styles.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardActions/WizardActions.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardActions/WizardActions.styles.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardContainer/WizardContainer.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardContainer/WizardContainer.styles.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardContent/LoadingContainer.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardContent/LoadingContainer.styles.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardContent/WizardContent.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardContent/WizardContent.styles.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardContext/WizardContext.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardTitle/WizardTitle.cjs.map +1 -0
- package/dist/cjs/Wizard/WizardTitle/WizardTitle.styles.cjs.map +1 -0
- package/dist/cjs/index.cjs +31 -31
- package/dist/esm/Dashboard/Dashboard.js.map +1 -0
- package/dist/esm/Dashboard/Dashboard.styles.js.map +1 -0
- package/dist/esm/Flow/Background/Background.js.map +1 -0
- package/dist/esm/Flow/Controls/Controls.js.map +1 -0
- package/dist/esm/Flow/DroppableFlow.js.map +1 -0
- package/dist/esm/Flow/Empty/Empty.js.map +1 -0
- package/dist/esm/Flow/Empty/Empty.styles.js.map +1 -0
- package/dist/esm/Flow/Flow.js.map +1 -0
- package/dist/esm/Flow/Flow.styles.js.map +1 -0
- package/dist/esm/Flow/FlowContext/FlowContext.js.map +1 -0
- package/dist/esm/Flow/FlowContext/NodeMetaContext.js.map +1 -0
- package/dist/esm/Flow/Minimap/Minimap.js.map +1 -0
- package/dist/esm/Flow/Minimap/Minimap.styles.js.map +1 -0
- package/dist/esm/Flow/Node/BaseNode.js.map +1 -0
- package/dist/esm/Flow/Node/BaseNode.styles.js.map +1 -0
- package/dist/esm/Flow/Node/Node.js.map +1 -0
- package/dist/esm/Flow/Node/Node.styles.js.map +1 -0
- package/dist/esm/Flow/Node/Parameters/ParamRenderer.js.map +1 -0
- package/dist/esm/Flow/Node/Parameters/Select.js.map +1 -0
- package/dist/esm/Flow/Node/Parameters/Text.js.map +1 -0
- package/dist/esm/Flow/Sidebar/Sidebar.js.map +1 -0
- package/dist/esm/Flow/Sidebar/Sidebar.styles.js.map +1 -0
- package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.js.map +1 -0
- package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.js.map +1 -0
- package/dist/esm/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.js +1 -1
- package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.js.map +1 -0
- package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.js.map +1 -0
- package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.js.map +1 -0
- package/dist/esm/Flow/Sidebar/utils.js.map +1 -0
- package/dist/esm/Flow/base.js.map +1 -0
- package/dist/esm/Flow/hooks/useFlowContext.js.map +1 -0
- package/dist/esm/Flow/hooks/useFlowNode.js.map +1 -0
- package/dist/esm/Flow/hooks/useFlowNodeMeta.js.map +1 -0
- package/dist/esm/StepNavigation/DefaultNavigation/DefaultNavigation.js.map +1 -0
- package/dist/esm/StepNavigation/DefaultNavigation/Step/Step.js.map +1 -0
- package/dist/esm/StepNavigation/DefaultNavigation/Step/Step.styles.js.map +1 -0
- package/dist/esm/StepNavigation/DefaultNavigation/utils.js.map +1 -0
- package/dist/esm/StepNavigation/SimpleNavigation/Dot/Dot.js.map +1 -0
- package/dist/esm/StepNavigation/SimpleNavigation/Dot/Dot.styles.js.map +1 -0
- package/dist/esm/StepNavigation/SimpleNavigation/SimpleNavigation.js.map +1 -0
- package/dist/esm/StepNavigation/SimpleNavigation/utils.js.map +1 -0
- package/dist/esm/StepNavigation/StepNavigation.js.map +1 -0
- package/dist/esm/StepNavigation/StepNavigation.styles.js.map +1 -0
- package/dist/esm/StepNavigation/utils.js.map +1 -0
- package/dist/esm/Wizard/Wizard.js.map +1 -0
- package/dist/esm/Wizard/Wizard.styles.js.map +1 -0
- package/dist/esm/Wizard/WizardActions/WizardActions.js.map +1 -0
- package/dist/esm/Wizard/WizardActions/WizardActions.styles.js.map +1 -0
- package/dist/esm/Wizard/WizardContainer/WizardContainer.js.map +1 -0
- package/dist/esm/Wizard/WizardContainer/WizardContainer.styles.js.map +1 -0
- package/dist/esm/Wizard/WizardContent/LoadingContainer.js.map +1 -0
- package/dist/esm/Wizard/WizardContent/LoadingContainer.styles.js.map +1 -0
- package/dist/esm/Wizard/WizardContent/WizardContent.js.map +1 -0
- package/dist/esm/Wizard/WizardContent/WizardContent.styles.js.map +1 -0
- package/dist/esm/Wizard/WizardContext/WizardContext.js.map +1 -0
- package/dist/esm/Wizard/WizardTitle/WizardTitle.js.map +1 -0
- package/dist/esm/Wizard/WizardTitle/WizardTitle.styles.js.map +1 -0
- package/dist/esm/index.js +31 -31
- package/dist/types/index.d.ts +3 -3
- package/package.json +3 -3
- package/dist/cjs/components/Dashboard/Dashboard.cjs.map +0 -1
- package/dist/cjs/components/Dashboard/Dashboard.styles.cjs.map +0 -1
- package/dist/cjs/components/Flow/Background/Background.cjs.map +0 -1
- package/dist/cjs/components/Flow/Controls/Controls.cjs.map +0 -1
- package/dist/cjs/components/Flow/DroppableFlow.cjs.map +0 -1
- package/dist/cjs/components/Flow/Empty/Empty.cjs.map +0 -1
- package/dist/cjs/components/Flow/Empty/Empty.styles.cjs.map +0 -1
- package/dist/cjs/components/Flow/Flow.cjs.map +0 -1
- package/dist/cjs/components/Flow/Flow.styles.cjs.map +0 -1
- package/dist/cjs/components/Flow/FlowContext/FlowContext.cjs.map +0 -1
- package/dist/cjs/components/Flow/FlowContext/NodeMetaContext.cjs.map +0 -1
- package/dist/cjs/components/Flow/Minimap/Minimap.cjs.map +0 -1
- package/dist/cjs/components/Flow/Minimap/Minimap.styles.cjs.map +0 -1
- package/dist/cjs/components/Flow/Node/BaseNode.cjs.map +0 -1
- package/dist/cjs/components/Flow/Node/BaseNode.styles.cjs.map +0 -1
- package/dist/cjs/components/Flow/Node/Node.cjs.map +0 -1
- package/dist/cjs/components/Flow/Node/Node.styles.cjs.map +0 -1
- package/dist/cjs/components/Flow/Node/Parameters/ParamRenderer.cjs.map +0 -1
- package/dist/cjs/components/Flow/Node/Parameters/Select.cjs.map +0 -1
- package/dist/cjs/components/Flow/Node/Parameters/Text.cjs.map +0 -1
- package/dist/cjs/components/Flow/Sidebar/Sidebar.cjs.map +0 -1
- package/dist/cjs/components/Flow/Sidebar/Sidebar.styles.cjs.map +0 -1
- package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroup.cjs.map +0 -1
- package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.cjs.map +0 -1
- package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.cjs.map +0 -1
- package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.cjs.map +0 -1
- package/dist/cjs/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.cjs.map +0 -1
- package/dist/cjs/components/Flow/Sidebar/utils.cjs.map +0 -1
- package/dist/cjs/components/Flow/base.cjs.map +0 -1
- package/dist/cjs/components/Flow/hooks/useFlowContext.cjs.map +0 -1
- package/dist/cjs/components/Flow/hooks/useFlowNode.cjs.map +0 -1
- package/dist/cjs/components/Flow/hooks/useFlowNodeMeta.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/DefaultNavigation/DefaultNavigation.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/DefaultNavigation/Step/Step.styles.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/DefaultNavigation/utils.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/SimpleNavigation/SimpleNavigation.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/SimpleNavigation/utils.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/StepNavigation.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/StepNavigation.styles.cjs.map +0 -1
- package/dist/cjs/components/StepNavigation/utils.cjs.map +0 -1
- package/dist/cjs/components/Wizard/Wizard.cjs.map +0 -1
- package/dist/cjs/components/Wizard/Wizard.styles.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardActions/WizardActions.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardActions/WizardActions.styles.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardContainer/WizardContainer.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardContainer/WizardContainer.styles.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardContent/LoadingContainer.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardContent/LoadingContainer.styles.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardContent/WizardContent.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardContent/WizardContent.styles.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardContext/WizardContext.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardTitle/WizardTitle.cjs.map +0 -1
- package/dist/cjs/components/Wizard/WizardTitle/WizardTitle.styles.cjs.map +0 -1
- package/dist/esm/components/Dashboard/Dashboard.js.map +0 -1
- package/dist/esm/components/Dashboard/Dashboard.styles.js.map +0 -1
- package/dist/esm/components/Flow/Background/Background.js.map +0 -1
- package/dist/esm/components/Flow/Controls/Controls.js.map +0 -1
- package/dist/esm/components/Flow/DroppableFlow.js.map +0 -1
- package/dist/esm/components/Flow/Empty/Empty.js.map +0 -1
- package/dist/esm/components/Flow/Empty/Empty.styles.js.map +0 -1
- package/dist/esm/components/Flow/Flow.js.map +0 -1
- package/dist/esm/components/Flow/Flow.styles.js.map +0 -1
- package/dist/esm/components/Flow/FlowContext/FlowContext.js.map +0 -1
- package/dist/esm/components/Flow/FlowContext/NodeMetaContext.js.map +0 -1
- package/dist/esm/components/Flow/Minimap/Minimap.js.map +0 -1
- package/dist/esm/components/Flow/Minimap/Minimap.styles.js.map +0 -1
- package/dist/esm/components/Flow/Node/BaseNode.js.map +0 -1
- package/dist/esm/components/Flow/Node/BaseNode.styles.js.map +0 -1
- package/dist/esm/components/Flow/Node/Node.js.map +0 -1
- package/dist/esm/components/Flow/Node/Node.styles.js.map +0 -1
- package/dist/esm/components/Flow/Node/Parameters/ParamRenderer.js.map +0 -1
- package/dist/esm/components/Flow/Node/Parameters/Select.js.map +0 -1
- package/dist/esm/components/Flow/Node/Parameters/Text.js.map +0 -1
- package/dist/esm/components/Flow/Sidebar/Sidebar.js.map +0 -1
- package/dist/esm/components/Flow/Sidebar/Sidebar.styles.js.map +0 -1
- package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroup.js.map +0 -1
- package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.js.map +0 -1
- package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.js.map +0 -1
- package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.js.map +0 -1
- package/dist/esm/components/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.js.map +0 -1
- package/dist/esm/components/Flow/Sidebar/utils.js.map +0 -1
- package/dist/esm/components/Flow/base.js.map +0 -1
- package/dist/esm/components/Flow/hooks/useFlowContext.js.map +0 -1
- package/dist/esm/components/Flow/hooks/useFlowNode.js.map +0 -1
- package/dist/esm/components/Flow/hooks/useFlowNodeMeta.js.map +0 -1
- package/dist/esm/components/StepNavigation/DefaultNavigation/DefaultNavigation.js.map +0 -1
- package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.js.map +0 -1
- package/dist/esm/components/StepNavigation/DefaultNavigation/Step/Step.styles.js.map +0 -1
- package/dist/esm/components/StepNavigation/DefaultNavigation/utils.js.map +0 -1
- package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.js.map +0 -1
- package/dist/esm/components/StepNavigation/SimpleNavigation/Dot/Dot.styles.js.map +0 -1
- package/dist/esm/components/StepNavigation/SimpleNavigation/SimpleNavigation.js.map +0 -1
- package/dist/esm/components/StepNavigation/SimpleNavigation/utils.js.map +0 -1
- package/dist/esm/components/StepNavigation/StepNavigation.js.map +0 -1
- package/dist/esm/components/StepNavigation/StepNavigation.styles.js.map +0 -1
- package/dist/esm/components/StepNavigation/utils.js.map +0 -1
- package/dist/esm/components/Wizard/Wizard.js.map +0 -1
- package/dist/esm/components/Wizard/Wizard.styles.js.map +0 -1
- package/dist/esm/components/Wizard/WizardActions/WizardActions.js.map +0 -1
- package/dist/esm/components/Wizard/WizardActions/WizardActions.styles.js.map +0 -1
- package/dist/esm/components/Wizard/WizardContainer/WizardContainer.js.map +0 -1
- package/dist/esm/components/Wizard/WizardContainer/WizardContainer.styles.js.map +0 -1
- package/dist/esm/components/Wizard/WizardContent/LoadingContainer.js.map +0 -1
- package/dist/esm/components/Wizard/WizardContent/LoadingContainer.styles.js.map +0 -1
- package/dist/esm/components/Wizard/WizardContent/WizardContent.js.map +0 -1
- package/dist/esm/components/Wizard/WizardContent/WizardContent.styles.js.map +0 -1
- package/dist/esm/components/Wizard/WizardContext/WizardContext.js.map +0 -1
- package/dist/esm/components/Wizard/WizardTitle/WizardTitle.js.map +0 -1
- package/dist/esm/components/Wizard/WizardTitle/WizardTitle.styles.js.map +0 -1
- /package/dist/cjs/{components/Dashboard → Dashboard}/Dashboard.cjs +0 -0
- /package/dist/cjs/{components/Dashboard → Dashboard}/Dashboard.styles.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Background/Background.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Controls/Controls.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/DroppableFlow.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Empty/Empty.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Empty/Empty.styles.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Flow.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Flow.styles.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/FlowContext/FlowContext.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/FlowContext/NodeMetaContext.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Minimap/Minimap.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Minimap/Minimap.styles.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Node/BaseNode.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Node/BaseNode.styles.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Node/Node.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Node/Node.styles.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Node/Parameters/ParamRenderer.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Node/Parameters/Select.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Node/Parameters/Text.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Sidebar/Sidebar.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Sidebar/Sidebar.styles.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroup.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroup.styles.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/Sidebar/utils.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/base.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/hooks/useFlowContext.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/hooks/useFlowNode.cjs +0 -0
- /package/dist/cjs/{components/Flow → Flow}/hooks/useFlowNodeMeta.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/DefaultNavigation/DefaultNavigation.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/DefaultNavigation/Step/Step.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/DefaultNavigation/Step/Step.styles.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/DefaultNavigation/utils.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/SimpleNavigation/Dot/Dot.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/SimpleNavigation/Dot/Dot.styles.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/SimpleNavigation/SimpleNavigation.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/SimpleNavigation/utils.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/StepNavigation.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/StepNavigation.styles.cjs +0 -0
- /package/dist/cjs/{components/StepNavigation → StepNavigation}/utils.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/Wizard.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/Wizard.styles.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardActions/WizardActions.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardActions/WizardActions.styles.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardContainer/WizardContainer.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardContainer/WizardContainer.styles.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardContent/LoadingContainer.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardContent/LoadingContainer.styles.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardContent/WizardContent.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardContent/WizardContent.styles.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardContext/WizardContext.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardTitle/WizardTitle.cjs +0 -0
- /package/dist/cjs/{components/Wizard → Wizard}/WizardTitle/WizardTitle.styles.cjs +0 -0
- /package/dist/esm/{components/Dashboard → Dashboard}/Dashboard.js +0 -0
- /package/dist/esm/{components/Dashboard → Dashboard}/Dashboard.styles.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Background/Background.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Controls/Controls.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/DroppableFlow.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Empty/Empty.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Empty/Empty.styles.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Flow.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Flow.styles.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/FlowContext/FlowContext.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/FlowContext/NodeMetaContext.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Minimap/Minimap.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Minimap/Minimap.styles.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Node/BaseNode.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Node/BaseNode.styles.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Node/Node.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Node/Node.styles.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Node/Parameters/ParamRenderer.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Node/Parameters/Select.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Node/Parameters/Text.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Sidebar/Sidebar.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Sidebar/Sidebar.styles.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroup.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroup.styles.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/Sidebar/utils.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/base.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/hooks/useFlowContext.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/hooks/useFlowNode.js +0 -0
- /package/dist/esm/{components/Flow → Flow}/hooks/useFlowNodeMeta.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/DefaultNavigation/DefaultNavigation.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/DefaultNavigation/Step/Step.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/DefaultNavigation/Step/Step.styles.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/DefaultNavigation/utils.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/SimpleNavigation/Dot/Dot.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/SimpleNavigation/Dot/Dot.styles.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/SimpleNavigation/SimpleNavigation.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/SimpleNavigation/utils.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/StepNavigation.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/StepNavigation.styles.js +0 -0
- /package/dist/esm/{components/StepNavigation → StepNavigation}/utils.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/Wizard.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/Wizard.styles.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardActions/WizardActions.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardActions/WizardActions.styles.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardContainer/WizardContainer.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardContainer/WizardContainer.styles.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardContent/LoadingContainer.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardContent/LoadingContainer.styles.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardContent/WizardContent.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardContent/WizardContent.styles.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardContext/WizardContext.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardTitle/WizardTitle.js +0 -0
- /package/dist/esm/{components/Wizard → Wizard}/WizardTitle/WizardTitle.styles.js +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dashboard.cjs","sources":["../../../src/Dashboard/Dashboard.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { Global } from \"@emotion/react\";\nimport {\n Responsive as ResponsiveGrid,\n ResponsiveProps,\n ReactGridLayoutProps,\n Layouts,\n WidthProvider,\n} from \"react-grid-layout\";\nimport {\n ExtractNames,\n useDefaultProps,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { gridStyles, staticClasses, useClasses } from \"./Dashboard.styles\";\n\nconst GridLayout = WidthProvider(ResponsiveGrid);\n\n/** Default column breakpoints. For now, use always 12-column */\nconst defaultCols: HvDashboardProps[\"cols\"] = {\n xs: 12,\n sm: 12,\n md: 12,\n lg: 12,\n xl: 12,\n};\n\nexport { staticClasses as dashboardClasses };\n\nexport type HvDashboardClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDashboardProps extends Omit<ResponsiveProps, \"cols\"> {\n /** Dashboard items. Each node must be `key`'ed */\n children: React.ReactNode;\n /** An object used to override or extend the styles applied. */\n classes?: HvDashboardClasses;\n /**\n * Layout is an array of object with the format:\n *\n * `{i: string, x: number, y: number, w: number, h: number}`\n *\n * The `i` must match the key used on each item component.\n */\n layout?: ReactGridLayoutProps[\"layout\"];\n /** Number of grid columns or an object of breakpoint -> #columns */\n cols?: number | ResponsiveProps[\"cols\"];\n}\n\n/**\n * A Dashboard grid layout component, based on `react-grid-layout`.\n * The children elements are grid items and must be `key`ed.\n *\n * @see https://github.com/react-grid-layout/react-grid-layout?tab=readme-ov-file#grid-layout-props\n *\n * DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvDashboard = (props: HvDashboardProps) => {\n const {\n children,\n className,\n layout,\n cols: colsProp,\n layouts: layoutsProp,\n classes: classesProp,\n ...others\n } = useDefaultProps(\"HvDashboard\", props);\n const { classes, cx } = useClasses(classesProp);\n const { activeTheme } = useTheme();\n\n const layouts = useMemo<Layouts>(() => {\n if (layoutsProp) return layoutsProp;\n if (!layout) return {};\n\n return { xs: layout, sm: layout, md: layout, lg: layout, xl: layout };\n }, [layoutsProp, layout]);\n\n const cols = useMemo<ResponsiveProps[\"cols\"]>(() => {\n if (!colsProp) return defaultCols;\n\n if (typeof colsProp === \"number\") {\n return {\n xs: colsProp,\n sm: colsProp,\n md: colsProp,\n lg: colsProp,\n xl: colsProp,\n };\n }\n\n return colsProp;\n }, [colsProp]);\n\n return (\n <>\n <Global styles={gridStyles} />\n <GridLayout\n className={cx(classes.root, className)}\n breakpoints={activeTheme?.breakpoints.values}\n cols={cols}\n layouts={layouts}\n {...others}\n >\n {children}\n </GridLayout>\n </>\n );\n};\n"],"names":["WidthProvider","ResponsiveGrid","useDefaultProps","useClasses","useTheme","useMemo","jsxs","Fragment","jsx","Global","gridStyles"],"mappings":";;;;;;;;AAiBA,MAAM,aAAaA,gBAAAA,cAAcC,gBAAAA,UAAc;AAG/C,MAAM,cAAwC;AAAA,EAC5C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AA+Ba,MAAA,cAAc,CAAC,UAA4B;AAChD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACDC,eAAgB,gBAAA,eAAe,KAAK;AACxC,QAAM,EAAE,SAAS,GAAG,IAAIC,4BAAW,WAAW;AACxC,QAAA,EAAE,gBAAgBC,eAAAA;AAElB,QAAA,UAAUC,MAAAA,QAAiB,MAAM;AACjC,QAAA;AAAoB,aAAA;AACxB,QAAI,CAAC;AAAQ,aAAO;AAEb,WAAA,EAAE,IAAI,QAAQ,IAAI,QAAQ,IAAI,QAAQ,IAAI,QAAQ,IAAI,OAAO;AAAA,EAAA,GACnE,CAAC,aAAa,MAAM,CAAC;AAElB,QAAA,OAAOA,MAAAA,QAAiC,MAAM;AAClD,QAAI,CAAC;AAAiB,aAAA;AAElB,QAAA,OAAO,aAAa,UAAU;AACzB,aAAA;AAAA,QACL,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IAER;AAEO,WAAA;AAAA,EAAA,GACN,CAAC,QAAQ,CAAC;AAEb,SAEIC,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,IAACC,2BAAAA,IAAAC,MAAA,QAAA,EAAO,QAAQC,iBAAY,WAAA,CAAA;AAAA,IAC5BF,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QACrC,aAAa,aAAa,YAAY;AAAA,QACtC;AAAA,QACA;AAAA,QACC,GAAG;AAAA,QAEH;AAAA,MAAA;AAAA,IACH;AAAA,EACF,EAAA,CAAA;AAEJ;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dashboard.styles.cjs","sources":["../../../src/Dashboard/Dashboard.styles.ts"],"sourcesContent":["import { css } from \"@emotion/react\";\nimport { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDashboard\", {\n root: {},\n});\n\nexport const gridStyles = css`\n .react-grid-layout {\n position: relative;\n transition: height 200ms ease;\n }\n .react-grid-item {\n transition: all 200ms ease;\n transition-property: left, top, width, height;\n }\n .react-grid-item img {\n pointer-events: none;\n user-select: none;\n }\n .react-grid-item.cssTransforms {\n transition-property: transform, width, height;\n }\n .react-grid-item.resizing {\n transition: none;\n z-index: 1;\n will-change: width, height;\n }\n\n .react-grid-item.react-draggable-dragging {\n transition: none;\n z-index: 3;\n will-change: transform;\n }\n\n .react-grid-item.dropping {\n visibility: hidden;\n }\n\n .react-grid-item.react-grid-placeholder {\n background: ${theme.colors.primary_20};\n transition-duration: 100ms;\n z-index: 2;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n -o-user-select: none;\n user-select: none;\n }\n\n .react-grid-item.react-grid-placeholder.placeholder-resizing {\n transition: none;\n }\n\n .react-grid-item > .react-resizable-handle {\n position: absolute;\n width: 20px;\n height: 20px;\n }\n\n .react-grid-item > .react-resizable-handle::after {\n content: \"\";\n position: absolute;\n right: 3px;\n bottom: 3px;\n width: 5px;\n height: 5px;\n border-right: 2px solid rgba(0, 0, 0, 0.4);\n border-bottom: 2px solid rgba(0, 0, 0, 0.4);\n }\n\n .react-resizable-hide > .react-resizable-handle {\n display: none;\n }\n\n .react-grid-item > .react-resizable-handle.react-resizable-handle-sw {\n bottom: 0;\n left: 0;\n cursor: sw-resize;\n transform: rotate(90deg);\n }\n .react-grid-item > .react-resizable-handle.react-resizable-handle-se {\n bottom: 0;\n right: 0;\n cursor: se-resize;\n }\n .react-grid-item > .react-resizable-handle.react-resizable-handle-nw {\n top: 0;\n left: 0;\n cursor: nw-resize;\n transform: rotate(180deg);\n }\n .react-grid-item > .react-resizable-handle.react-resizable-handle-ne {\n top: 0;\n right: 0;\n cursor: ne-resize;\n transform: rotate(270deg);\n }\n .react-grid-item > .react-resizable-handle.react-resizable-handle-w,\n .react-grid-item > .react-resizable-handle.react-resizable-handle-e {\n top: 50%;\n margin-top: -10px;\n cursor: ew-resize;\n }\n .react-grid-item > .react-resizable-handle.react-resizable-handle-w {\n left: 0;\n transform: rotate(135deg);\n }\n .react-grid-item > .react-resizable-handle.react-resizable-handle-e {\n right: 0;\n transform: rotate(315deg);\n }\n .react-grid-item > .react-resizable-handle.react-resizable-handle-n,\n .react-grid-item > .react-resizable-handle.react-resizable-handle-s {\n left: 50%;\n margin-left: -10px;\n cursor: ns-resize;\n }\n .react-grid-item > .react-resizable-handle.react-resizable-handle-n {\n top: 0;\n transform: rotate(225deg);\n }\n .react-grid-item > .react-resizable-handle.react-resizable-handle-s {\n bottom: 0;\n transform: rotate(45deg);\n }\n\n .react-resizable {\n position: relative;\n }\n .react-resizable-handle {\n position: absolute;\n width: 20px;\n height: 20px;\n background-repeat: no-repeat;\n background-origin: content-box;\n box-sizing: border-box;\n background-image: url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+\");\n background-position: bottom right;\n padding: 0 3px 3px 0;\n }\n .react-resizable-handle-sw {\n bottom: 0;\n left: 0;\n cursor: sw-resize;\n transform: rotate(90deg);\n }\n .react-resizable-handle-se {\n bottom: 0;\n right: 0;\n cursor: se-resize;\n }\n .react-resizable-handle-nw {\n top: 0;\n left: 0;\n cursor: nw-resize;\n transform: rotate(180deg);\n }\n .react-resizable-handle-ne {\n top: 0;\n right: 0;\n cursor: ne-resize;\n transform: rotate(270deg);\n }\n .react-resizable-handle-w,\n .react-resizable-handle-e {\n top: 50%;\n margin-top: -10px;\n cursor: ew-resize;\n }\n .react-resizable-handle-w {\n left: 0;\n transform: rotate(135deg);\n }\n .react-resizable-handle-e {\n right: 0;\n transform: rotate(315deg);\n }\n .react-resizable-handle-n,\n .react-resizable-handle-s {\n left: 50%;\n margin-left: -10px;\n cursor: ns-resize;\n }\n .react-resizable-handle-n {\n top: 0;\n transform: rotate(225deg);\n }\n .react-resizable-handle-s {\n bottom: 0;\n transform: rotate(45deg);\n }\n`;\n"],"names":["createClasses","css","theme"],"mappings":";;;;AAGO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,eAAe;AAAA,EACxE,MAAM,CAAC;AACT,CAAC;AAEM,MAAM,aAAaC,MAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,kBAiCRC,eAAA,MAAM,OAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Background.cjs","sources":["../../../../src/Flow/Background/Background.tsx"],"sourcesContent":["import { Background, BackgroundProps } from \"reactflow\";\n\nimport { HvColorAny, getColor, theme } from \"@hitachivantara/uikit-styles\";\n\nexport interface HvFlowBackgroundProps extends Omit<BackgroundProps, \"color\"> {\n /** Color for the background dots. Defaults to `secondary`. */\n color?: HvColorAny;\n}\n\nexport const HvFlowBackground = ({\n color = \"secondary\",\n ...others\n}: HvFlowBackgroundProps) => {\n return (\n <Background color={getColor(color, theme.colors.secondary)} {...others} />\n );\n};\n"],"names":["jsx","Background","getColor","theme"],"mappings":";;;;;AASO,MAAM,mBAAmB,CAAC;AAAA,EAC/B,QAAQ;AAAA,EACR,GAAG;AACL,MAA6B;AAEzB,SAAAA,+BAACC,UAAAA,YAAW,EAAA,OAAOC,YAAAA,SAAS,OAAOC,kBAAM,OAAO,SAAS,GAAI,GAAG,OAAQ,CAAA;AAE5E;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Controls.cjs","sources":["../../../../src/Flow/Controls/Controls.tsx"],"sourcesContent":["import {\n ControlProps,\n Panel,\n PanelPosition,\n ReactFlowState,\n useReactFlow,\n useStore,\n useStoreApi,\n} from \"reactflow\";\n\nimport { shallow } from \"zustand/shallow\";\n\nimport {\n HvButton,\n HvMultiButton,\n useLabels,\n} from \"@hitachivantara/uikit-react-core\";\nimport {\n Focus,\n Lock,\n Unlock,\n ZoomIn,\n ZoomOut,\n} from \"@hitachivantara/uikit-react-icons\";\n\nexport type HvFlowControlsPosition = PanelPosition;\n\nexport interface HvFlowControlsProps\n extends Omit<\n ControlProps,\n \"position\" | \"showFitView\" | \"showInteractive\" | \"showZoom\"\n > {\n /** Controls position. Defaults to `bottom-center`. */\n position?: HvFlowControlsPosition;\n /** Controls orientation. Defaults to `horizontal`. */\n orientation?: \"vertical\" | \"horizontal\";\n /** Labels used on the controls buttons. */\n labels?: {\n zoomIn?: string;\n zoomOut?: string;\n fitView?: string;\n interactive?: string;\n };\n /** Whether to hide the zoom controls. */\n hideZoom?: boolean;\n /** Whether to hide the fit view controls. */\n hideFitView?: boolean;\n /** Whether to hide the interactive controls. */\n hideInteractive?: boolean;\n}\n\nconst DEFAULT_LABELS: HvFlowControlsProps[\"labels\"] = {\n fitView: \"Fit view\",\n zoomIn: \"Zoom in\",\n zoomOut: \"Zoom out\",\n interactive: \"Interactive\",\n};\n\nconst selector = (state: ReactFlowState) => ({\n isInteractive:\n state.nodesDraggable || state.nodesConnectable || state.elementsSelectable,\n minZoomReached: state.transform[2] <= state.minZoom,\n maxZoomReached: state.transform[2] >= state.maxZoom,\n});\n\nexport const HvFlowControls = ({\n onZoomIn: onZoomInProp,\n onZoomOut: onZoomOutProp,\n onFitView: onFitViewProp,\n labels: labelsProps,\n hideInteractive,\n hideFitView,\n hideZoom,\n position = \"bottom-center\",\n orientation = \"horizontal\",\n onInteractiveChange,\n fitViewOptions,\n children,\n ...others\n}: HvFlowControlsProps) => {\n const { isInteractive, minZoomReached, maxZoomReached } = useStore(\n selector,\n shallow\n );\n const store = useStoreApi();\n const { zoomIn, zoomOut, fitView } = useReactFlow();\n\n const labels = useLabels(DEFAULT_LABELS, labelsProps);\n\n const handleZoomIn = () => {\n zoomIn();\n onZoomInProp?.();\n };\n\n const handleZoomOut = () => {\n zoomOut();\n onZoomOutProp?.();\n };\n\n const handleFitView = () => {\n fitView(fitViewOptions);\n onFitViewProp?.();\n };\n\n const handleInteractive = () => {\n store.setState({\n nodesDraggable: !isInteractive,\n nodesConnectable: !isInteractive,\n elementsSelectable: !isInteractive,\n });\n\n onInteractiveChange?.(!isInteractive);\n };\n\n return (\n <Panel position={position} {...others}>\n <HvMultiButton vertical={orientation === \"vertical\"}>\n {!hideZoom && (\n <HvButton\n icon\n title={labels?.zoomIn}\n onClick={handleZoomIn}\n disabled={maxZoomReached}\n >\n <ZoomIn role=\"none\" />\n </HvButton>\n )}\n {!hideZoom && (\n <HvButton\n icon\n title={labels?.zoomOut}\n onClick={handleZoomOut}\n disabled={minZoomReached}\n >\n <ZoomOut role=\"none\" />\n </HvButton>\n )}\n {!hideFitView && (\n <HvButton icon title={labels?.fitView} onClick={handleFitView}>\n <Focus role=\"none\" />\n </HvButton>\n )}\n {!hideInteractive && (\n <HvButton\n icon\n title={labels?.interactive}\n onClick={handleInteractive}\n >\n {isInteractive ? <Unlock role=\"none\" /> : <Lock role=\"none\" />}\n </HvButton>\n )}\n {children}\n </HvMultiButton>\n </Panel>\n );\n};\n"],"names":["useStore","shallow","useStoreApi","useReactFlow","useLabels","jsx","Panel","jsxs","HvMultiButton","HvButton","ZoomIn","ZoomOut","Focus","Unlock","Lock"],"mappings":";;;;;;;AAmDA,MAAM,iBAAgD;AAAA,EACpD,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,aAAa;AACf;AAEA,MAAM,WAAW,CAAC,WAA2B;AAAA,EAC3C,eACE,MAAM,kBAAkB,MAAM,oBAAoB,MAAM;AAAA,EAC1D,gBAAgB,MAAM,UAAU,CAAC,KAAK,MAAM;AAAA,EAC5C,gBAAgB,MAAM,UAAU,CAAC,KAAK,MAAM;AAC9C;AAEO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,UAAU;AAAA,EACV,WAAW;AAAA,EACX,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA2B;AACzB,QAAM,EAAE,eAAe,gBAAgB,eAAmB,IAAAA,UAAA;AAAA,IACxD;AAAA,IACAC,QAAA;AAAA,EAAA;AAEF,QAAM,QAAQC,UAAAA;AACd,QAAM,EAAE,QAAQ,SAAS,YAAYC,UAAa,aAAA;AAE5C,QAAA,SAASC,eAAAA,UAAU,gBAAgB,WAAW;AAEpD,QAAM,eAAe,MAAM;AAClB;AACQ;EAAA;AAGjB,QAAM,gBAAgB,MAAM;AAClB;AACQ;EAAA;AAGlB,QAAM,gBAAgB,MAAM;AAC1B,YAAQ,cAAc;AACN;EAAA;AAGlB,QAAM,oBAAoB,MAAM;AAC9B,UAAM,SAAS;AAAA,MACb,gBAAgB,CAAC;AAAA,MACjB,kBAAkB,CAAC;AAAA,MACnB,oBAAoB,CAAC;AAAA,IAAA,CACtB;AAED,0BAAsB,CAAC,aAAa;AAAA,EAAA;AAIpC,SAAAC,2BAAA,IAACC,mBAAM,UAAqB,GAAG,QAC7B,UAACC,2BAAA,KAAAC,eAAA,eAAA,EAAc,UAAU,gBAAgB,YACtC,UAAA;AAAA,IAAA,CAAC,YACAH,2BAAA;AAAA,MAACI,eAAA;AAAA,MAAA;AAAA,QACC,MAAI;AAAA,QACJ,OAAO,QAAQ;AAAA,QACf,SAAS;AAAA,QACT,UAAU;AAAA,QAEV,UAAAJ,2BAAAA,IAACK,gBAAAA,QAAO,EAAA,MAAK,OAAO,CAAA;AAAA,MAAA;AAAA,IACtB;AAAA,IAED,CAAC,YACAL,2BAAA;AAAA,MAACI,eAAA;AAAA,MAAA;AAAA,QACC,MAAI;AAAA,QACJ,OAAO,QAAQ;AAAA,QACf,SAAS;AAAA,QACT,UAAU;AAAA,QAEV,UAAAJ,2BAAAA,IAACM,gBAAAA,SAAQ,EAAA,MAAK,OAAO,CAAA;AAAA,MAAA;AAAA,IACvB;AAAA,IAED,CAAC,eACCN,2BAAAA,IAAAI,eAAA,UAAA,EAAS,MAAI,MAAC,OAAO,QAAQ,SAAS,SAAS,eAC9C,UAAAJ,+BAACO,gBAAAA,OAAM,EAAA,MAAK,OAAO,CAAA,GACrB;AAAA,IAED,CAAC,mBACAP,2BAAA;AAAA,MAACI,eAAA;AAAA,MAAA;AAAA,QACC,MAAI;AAAA,QACJ,OAAO,QAAQ;AAAA,QACf,SAAS;AAAA,QAER,UAAA,+CAAiBI,gBAAO,QAAA,EAAA,MAAK,QAAO,IAAKR,2BAAA,IAACS,gBAAK,MAAA,EAAA,MAAK,OAAO,CAAA;AAAA,MAAA;AAAA,IAC9D;AAAA,IAED;AAAA,EAAA,EACH,CAAA,EACF,CAAA;AAEJ;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DroppableFlow.cjs","sources":["../../../src/Flow/DroppableFlow.tsx"],"sourcesContent":["import { useCallback, useState } from \"react\";\n\nimport ReactFlow, {\n Connection,\n EdgeChange,\n NodeChange,\n ReactFlowProps,\n addEdge,\n applyEdgeChanges,\n applyNodeChanges,\n useReactFlow,\n MarkerType,\n Edge,\n Node,\n} from \"reactflow\";\n\nimport { Global } from \"@emotion/react\";\n\nimport { DragEndEvent, useDndMonitor, useDroppable } from \"@dnd-kit/core\";\n\nimport { uid } from \"uid\";\n\nimport { ExtractNames, useUniqueId } from \"@hitachivantara/uikit-react-core\";\n\nimport { HvFlowNodeMetaRegistry } from \"./types\";\nimport { staticClasses, useClasses } from \"./Flow.styles\";\nimport { useFlowContext } from \"./hooks\";\nimport { flowStyles } from \"./base\";\nimport { useNodeMetaRegistry } from \"./FlowContext/NodeMetaContext\";\n\nexport { staticClasses as flowClasses };\n\nexport type HvFlowClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDroppableFlowProps<\n NodeType extends string | undefined = string | undefined,\n NodeData = any\n> extends Omit<ReactFlowProps, \"nodes\" | \"edges\" | \"nodeTypes\"> {\n /** Flow content: background, controls, and minimap. */\n children?: React.ReactNode;\n /** Flow nodes. */\n nodes?: Node<NodeData, NodeType>[];\n /** Flow edges. */\n edges?: Edge[];\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowClasses;\n /** Callback called when the flow changes. Returns the updated nodes and edges. */\n onFlowChange?: (nodes: Node<NodeData, NodeType>[], edges: Edge[]) => void;\n /**\n * Callback called when a node is dropped in the flow.\n *\n * This callback should be used to override the custom UI Kit drop event.\n * Thus, when defined, the user is responsible for adding nodes to the flow.\n *\n * This callback is called when `HvFlowSidebar` is used or a custom sidebar was created using Dnd Kit.\n * When a custom sidebar was created using the native HTML drag and drop API, refer to the `onDrop` callback.\n *\n * Returns the event and the node to be added to the flow.\n */\n onDndDrop?: (event: DragEndEvent, node: Node) => void;\n}\n\nexport const getNode = (nodes: Node[], nodeId: string) => {\n return nodes.find((n) => n.id === nodeId);\n};\n\nconst validateEdge = (\n nodes: Node[],\n edges: Edge[],\n edge: Edge,\n nodeMetaRegistry: HvFlowNodeMetaRegistry\n) => {\n if (!edge.sourceHandle || !edge.targetHandle) return false;\n\n const sourceNode = getNode(nodes, edge.source);\n const targetNode = getNode(nodes, edge.target);\n\n if (!sourceNode || !targetNode) return false;\n\n const sourceType = sourceNode.type;\n const targetType = targetNode.type;\n\n if (!sourceType || !targetType) return false;\n\n const inputs = nodeMetaRegistry[edge.target]?.inputs || [];\n const outputs = nodeMetaRegistry[edge.source]?.outputs || [];\n\n const sourceProvides = outputs[edge.sourceHandle]?.provides || \"\";\n const targetAccepts = inputs[edge.targetHandle]?.accepts || [];\n const sourceMaxConnections = outputs[edge.sourceHandle]?.maxConnections;\n const targetMaxConnections = inputs[edge.targetHandle]?.maxConnections;\n\n let isValid =\n targetAccepts.length === 0 || targetAccepts.includes(sourceProvides);\n\n if (isValid && targetMaxConnections != null) {\n const targetConnections = edges.filter(\n (edg) =>\n edg.target === edge.target && edg.targetHandle === edge.targetHandle\n ).length;\n\n isValid = targetConnections < targetMaxConnections;\n }\n\n if (isValid && sourceMaxConnections != null) {\n const sourceConnections = edges.filter(\n (edg) =>\n edg.source === edge.source && edg.sourceHandle === edge.sourceHandle\n ).length;\n\n isValid = sourceConnections < sourceMaxConnections;\n }\n\n return isValid;\n};\n\nexport const HvDroppableFlow = ({\n id,\n className,\n children,\n onFlowChange,\n onDndDrop,\n classes: classesProp,\n nodes: initialNodes = [],\n edges: initialEdges = [],\n onConnect: onConnectProp,\n onNodesChange: onNodesChangeProp,\n onEdgesChange: onEdgesChangeProp,\n defaultEdgeOptions: defaultEdgeOptionsProp,\n ...others\n}: HvDroppableFlowProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const elementId = useUniqueId(id, \"hvFlow\");\n\n const reactFlowInstance = useReactFlow();\n\n const { nodeTypes } = useFlowContext();\n\n const [nodes, setNodes] = useState(initialNodes);\n const [edges, setEdges] = useState(initialEdges);\n\n const { setNodeRef } = useDroppable({\n id: elementId,\n });\n\n const handleDragEnd = useCallback(\n (event: DragEndEvent) => {\n if (event.over?.id !== elementId) return;\n\n const hvFlow = event.active.data.current?.hvFlow;\n const type = hvFlow?.type;\n\n // Only known node types can be dropped in the canvas\n if (!type || !nodeTypes?.[type]) {\n if (import.meta.env.DEV) {\n // eslint-disable-next-line no-console\n console.error(\n `Could not add node to the flow because of unknown type ${type}. Use nodeTypes to define all the node types.`\n );\n }\n return;\n }\n\n // Converts the coordinates to the react flow coordinate system\n const position = reactFlowInstance.project({\n x: (hvFlow?.x || 0) - event.over.rect.left,\n y: (hvFlow?.y || 0) - event.over.rect.top,\n });\n\n // Node data\n const data = hvFlow?.data || {};\n\n // Node to add\n const newNode: Node = {\n id: uid(),\n position,\n data,\n type,\n };\n\n // Drop override\n if (onDndDrop) {\n onDndDrop(event, newNode);\n return;\n }\n\n setNodes((nds) => nds.concat(newNode));\n },\n [elementId, nodeTypes, onDndDrop, reactFlowInstance]\n );\n\n useDndMonitor({\n onDragEnd: handleDragEnd,\n });\n\n const handleFlowChange = useCallback(\n (\n nds: NonNullable<HvDroppableFlowProps[\"nodes\"]>,\n eds: NonNullable<HvDroppableFlowProps[\"edges\"]>\n ) => {\n // The new flow is returned if the user is not dragging nodes\n // This avoids triggering this handler too many times\n const isDragging = nds.find((node) => node.dragging);\n if (!isDragging) {\n onFlowChange?.(nds, eds);\n }\n },\n [onFlowChange]\n );\n\n const handleConnect = useCallback(\n (connection: Connection) => {\n const eds = addEdge(connection, edges);\n setEdges(eds);\n\n handleFlowChange(nodes, eds);\n onConnectProp?.(connection);\n },\n [edges, handleFlowChange, nodes, onConnectProp]\n );\n\n const handleNodesChange = useCallback(\n (changes: NodeChange[]) => {\n const nds = applyNodeChanges(changes, nodes);\n setNodes(nds);\n\n handleFlowChange(nds, edges);\n onNodesChangeProp?.(changes);\n },\n [edges, handleFlowChange, nodes, onNodesChangeProp]\n );\n\n const handleEdgesChange = useCallback(\n (changes: EdgeChange[]) => {\n const eds = applyEdgeChanges(changes, edges);\n setEdges(eds);\n\n handleFlowChange(nodes, eds);\n onEdgesChangeProp?.(changes);\n },\n [edges, handleFlowChange, nodes, onEdgesChangeProp]\n );\n\n const { registry } = useNodeMetaRegistry();\n const isValidConnection = (connection) =>\n validateEdge(nodes, edges, connection, registry);\n\n const defaultEdgeOptions = {\n markerEnd: {\n type: MarkerType.ArrowClosed,\n height: 20,\n width: 20,\n },\n type: \"smoothstep\",\n pathOptions: {\n borderRadius: 40,\n },\n ...defaultEdgeOptionsProp,\n };\n\n return (\n <>\n <Global styles={flowStyles} />\n <div\n id={elementId}\n ref={setNodeRef}\n className={cx(classes.root, className)}\n >\n <ReactFlow\n nodes={nodes}\n edges={edges}\n nodeTypes={nodeTypes}\n onNodesChange={handleNodesChange}\n onEdgesChange={handleEdgesChange}\n onConnect={handleConnect}\n isValidConnection={isValidConnection}\n defaultEdgeOptions={defaultEdgeOptions}\n snapGrid={[1, 1]}\n snapToGrid\n onError={(code, message) => {\n if (import.meta.env.DEV) {\n // eslint-disable-next-line no-console\n console.error(message);\n }\n }}\n {...others}\n >\n {children}\n </ReactFlow>\n </div>\n </>\n );\n};\n"],"names":["useClasses","useUniqueId","useReactFlow","useFlowContext","useState","useDroppable","useCallback","uid","useDndMonitor","addEdge","applyNodeChanges","applyEdgeChanges","useNodeMetaRegistry","MarkerType","jsxs","Fragment","jsx","Global","flowStyles","ReactFlow"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Empty.cjs","sources":["../../../../src/Flow/Empty/Empty.tsx"],"sourcesContent":["import { useNodes } from \"reactflow\";\nimport {\n HvEmptyState,\n HvEmptyStateProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./Empty.styles\";\n\nexport interface HvFlowEmptyProps extends HvEmptyStateProps {}\n\nexport const HvFlowEmpty = ({ className, ...others }: HvFlowEmptyProps) => {\n const { classes, cx } = useClasses();\n const nodes = useNodes();\n return (\n !nodes ||\n (nodes.length === 0 ? (\n <HvEmptyState className={cx(classes.root, className)} {...others} />\n ) : null)\n );\n};\n"],"names":["useClasses","useNodes","jsx","HvEmptyState"],"mappings":";;;;;;AAUO,MAAM,cAAc,CAAC,EAAE,WAAW,GAAG,aAA+B;AACzE,QAAM,EAAE,SAAS,GAAG,IAAIA,aAAW,WAAA;AACnC,QAAM,QAAQC,UAAAA;AACd,SACE,CAAC,UACA,MAAM,WAAW,IACfC,2BAAAA,IAAAC,eAAAA,cAAA,EAAa,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,OAAQ,CAAA,IAChE;AAER;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Empty.styles.cjs","sources":["../../../../src/Flow/Empty/Empty.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowEmpty\", {\n root: {\n width: \"100%\",\n height: \"100%\",\n alignItems: \"center\",\n justifyContent: \"center\",\n backgroundColor: theme.colors.backgroundColor,\n position: \"absolute\",\n zIndex: theme.zIndices.popover,\n },\n});\n"],"names":["createClasses","theme"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,eAAe;AAAA,EACxE,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,iBAAiBC,eAAAA,MAAM,OAAO;AAAA,IAC9B,UAAU;AAAA,IACV,QAAQA,eAAAA,MAAM,SAAS;AAAA,EACzB;AACF,CAAC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Flow.cjs","sources":["../../../src/Flow/Flow.tsx"],"sourcesContent":["import {\n DndContext,\n DndContextProps,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\n\nimport { ReactFlowProvider } from \"reactflow\";\n\nimport { HvFlowNodeAction, HvFlowNodeGroups, HvFlowNodeTypes } from \"./types\";\nimport { HvFlowProvider } from \"./FlowContext\";\nimport { HvDroppableFlow, HvDroppableFlowProps } from \"./DroppableFlow\";\n\nexport interface HvFlowProps<\n NodeGroups extends keyof any = string,\n NodeType extends string | undefined = string | undefined,\n NodeData = any\n> extends HvDroppableFlowProps<NodeType, NodeData> {\n /** Flow nodes groups. */\n nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n /** Flow nodes types. */\n nodeTypes?: HvFlowNodeTypes<NodeGroups, NodeData>;\n /** Flow sidebar. */\n sidebar?: React.ReactNode;\n /** Flow default actions. */\n defaultActions?: HvFlowNodeAction[];\n /**\n * Dnd Kit context props. This should be used for accessibility purposes.\n *\n * More information can be found on the [Dnd Kit documentation](https://docs.dndkit.com/guides/accessibility)\n */\n dndContextProps?: Pick<DndContextProps, \"accessibility\">;\n}\n\n/**\n * Flow component to build interactive node-based UIs.\n *\n * This implementation leverages [React Flow](https://reactflow.dev).\n * The drag and drop functionality leverages [Dnd Kit](https://docs.dndkit.com)\n *\n * DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvFlow = ({\n nodeTypes,\n nodeGroups,\n sidebar,\n defaultActions,\n dndContextProps,\n ...others\n}: HvFlowProps) => {\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor)\n );\n\n // We're wrapping the main Flow component with the ReactFlowProvider to access the react flow instance.\n // HvFlowContext is our custom internal context.\n return (\n <ReactFlowProvider>\n <HvFlowProvider\n nodeGroups={nodeGroups}\n nodeTypes={nodeTypes}\n defaultActions={defaultActions}\n >\n <DndContext\n sensors={sensors}\n modifiers={[restrictToWindowEdges]}\n {...dndContextProps}\n >\n <HvDroppableFlow {...others} />\n {sidebar}\n </DndContext>\n </HvFlowProvider>\n </ReactFlowProvider>\n );\n};\n"],"names":["useSensors","useSensor","PointerSensor","KeyboardSensor","ReactFlowProvider","jsx","HvFlowProvider","jsxs","DndContext","restrictToWindowEdges","HvDroppableFlow"],"mappings":";;;;;;;;AA6CO,MAAM,SAAS,CAAC;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAmB;AACjB,QAAM,UAAUA,KAAA;AAAA,IACdC,KAAAA,UAAUC,KAAAA,aAAa;AAAA,IACvBD,KAAAA,UAAUE,KAAAA,cAAc;AAAA,EAAA;AAK1B,wCACGC,UAAAA,mBACC,EAAA,UAAAC,2BAAA;AAAA,IAACC,YAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MAEA,UAAAC,2BAAA;AAAA,QAACC,KAAA;AAAA,QAAA;AAAA,UACC;AAAA,UACA,WAAW,CAACC,UAAAA,qBAAqB;AAAA,UAChC,GAAG;AAAA,UAEJ,UAAA;AAAA,YAACJ,2BAAAA,IAAAK,cAAA,iBAAA,EAAiB,GAAG,QAAQ;AAAA,YAC5B;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Flow.styles.cjs","sources":["../../../src/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nimport { flowBaseNodeClasses } from \"./Node\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlow\", {\n root: {\n height: \"100%\",\n \"& .react-flow__handle\": {\n backgroundColor: theme.colors.secondary_60,\n width: 8,\n height: 8,\n zIndex: theme.zIndices.overlay,\n },\n \"& .react-flow__handle-connecting\": {\n backgroundColor: theme.colors.negative_20,\n width: 12,\n height: 12,\n \"&.react-flow__handle-left\": {\n translate: \"0 4px\",\n },\n },\n \"& .react-flow__handle-valid\": {\n backgroundColor: theme.colors.positive_20,\n width: 12,\n height: 12,\n \"&.react-flow__handle-left\": {\n translate: \"0 4px\",\n },\n },\n [`& .selected > .${flowBaseNodeClasses.root}`]: {\n border: `1px solid ${theme.colors.secondary_60}`,\n borderRadius: theme.radii.round,\n boxSizing: \"border-box\",\n },\n },\n});\n"],"names":["createClasses","theme","flowBaseNodeClasses"],"mappings":";;;;;;;;;;AAIO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,UAAU;AAAA,EACnE,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,yBAAyB;AAAA,MACvB,iBAAiBC,eAAAA,MAAM,OAAO;AAAA,MAC9B,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,QAAQA,eAAAA,MAAM,SAAS;AAAA,IACzB;AAAA,IACA,oCAAoC;AAAA,MAClC,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,MAC9B,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3B,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,+BAA+B;AAAA,MAC7B,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,MAC9B,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3B,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,CAAC,kBAAkBC,8BAAoB,IAAI,EAAE,GAAG;AAAA,MAC9C,QAAQ,aAAaD,eAAM,MAAA,OAAO,YAAY;AAAA,MAC9C,cAAcA,eAAAA,MAAM,MAAM;AAAA,MAC1B,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FlowContext.cjs","sources":["../../../../src/Flow/FlowContext/FlowContext.tsx"],"sourcesContent":["import {\n Dispatch,\n SetStateAction,\n createContext,\n useMemo,\n useState,\n} from \"react\";\n\nimport { HvFlowNodeAction, HvFlowNodeGroups, HvFlowNodeTypes } from \"../types\";\nimport { HvFlowNodeMetaProvider } from \"./NodeMetaContext\";\n\nexport interface HvFlowContextValue<NodeGroups extends keyof any = string> {\n /** Flow nodes types. */\n nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n /** Flow nodes groups. */\n nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n /** Flow nodes groups expanded on sidebar. */\n expandedNodeGroups?: string[];\n /** Flow default actions. */\n defaultActions?: HvFlowNodeAction[];\n /** Function to set `expandedNodeGroups`. */\n setExpandedNodeGroups?: Dispatch<SetStateAction<string[]>>;\n}\n\nexport const HvFlowContext = createContext<HvFlowContextValue>({});\n\nexport interface HvFlowProviderProps<NodeGroups extends keyof any = string> {\n /** Flow nodes types. */\n nodeTypes?: HvFlowContextValue<NodeGroups>[\"nodeTypes\"];\n /** Flow nodes groups. */\n nodeGroups?: HvFlowContextValue<NodeGroups>[\"nodeGroups\"];\n /** Flow default actions. */\n defaultActions?: HvFlowNodeAction[];\n /** Children. */\n children?: React.ReactNode;\n}\n\nexport const HvFlowProvider = ({\n nodeGroups,\n nodeTypes,\n defaultActions,\n children,\n}: HvFlowProviderProps) => {\n const [expandedNodeGroups, setExpandedNodeGroups] = useState<string[]>([]);\n\n const value = useMemo(\n () => ({\n nodeTypes,\n nodeGroups,\n defaultActions,\n expandedNodeGroups,\n setExpandedNodeGroups,\n }),\n [nodeTypes, nodeGroups, defaultActions, expandedNodeGroups]\n );\n\n return (\n <HvFlowNodeMetaProvider>\n <HvFlowContext.Provider value={value}>{children}</HvFlowContext.Provider>\n </HvFlowNodeMetaProvider>\n );\n};\n"],"names":["createContext","useState","useMemo","jsx","HvFlowNodeMetaProvider"],"mappings":";;;;;AAwBa,MAAA,gBAAgBA,MAAkC,cAAA,EAAE;AAa1D,MAAM,iBAAiB,CAAC;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA2B;AACzB,QAAM,CAAC,oBAAoB,qBAAqB,IAAIC,MAAA,SAAmB,CAAE,CAAA;AAEzE,QAAM,QAAQC,MAAA;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF,CAAC,WAAW,YAAY,gBAAgB,kBAAkB;AAAA,EAAA;AAI1D,SAAAC,+BAACC,gBAAAA,0BACC,UAACD,2BAAAA,IAAA,cAAc,UAAd,EAAuB,OAAe,SAAS,CAAA,EAClD,CAAA;AAEJ;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NodeMetaContext.cjs","sources":["../../../../src/Flow/FlowContext/NodeMetaContext.tsx"],"sourcesContent":["import { createContext, useRef, useCallback, useContext, useMemo } from \"react\";\n\nimport { HvFlowNodeMeta } from \"../types\";\n\ninterface HvFlowNodeMetaContextType {\n registerNode: (id: string, nodeInfo: HvFlowNodeMeta) => void;\n unregisterNode: (id: string) => void;\n getRegistry: () => Record<string, HvFlowNodeMeta>;\n}\n\nconst HvFlowNodeMetaContext = createContext<\n HvFlowNodeMetaContextType | undefined\n>(undefined);\n\nexport const HvFlowNodeMetaProvider = ({\n children,\n}: {\n children: React.ReactNode;\n}) => {\n const registryRef = useRef<Record<string, HvFlowNodeMeta>>({});\n\n const registerNode = useCallback((id: string, nodeInfo: HvFlowNodeMeta) => {\n registryRef.current[id] = nodeInfo;\n }, []);\n\n const unregisterNode = useCallback((id: string) => {\n delete registryRef.current[id];\n }, []);\n\n const getRegistry = useCallback(() => {\n return registryRef.current;\n }, []);\n\n const value = useMemo<HvFlowNodeMetaContextType>(\n () => ({\n registerNode,\n unregisterNode,\n getRegistry,\n }),\n [registerNode, unregisterNode, getRegistry]\n );\n\n return (\n <HvFlowNodeMetaContext.Provider value={value}>\n {children}\n </HvFlowNodeMetaContext.Provider>\n );\n};\n\nexport function useNodeMetaRegistry() {\n const context = useContext(HvFlowNodeMetaContext);\n\n if (context === undefined) {\n throw new Error(\n \"useNodeRegistry must be used within a HvFlowNodeMetaProvider\"\n );\n }\n\n return {\n registerNode: context.registerNode,\n unregisterNode: context.unregisterNode,\n registry: context.getRegistry(),\n };\n}\n"],"names":["createContext","useRef","useCallback","useMemo","jsx","useContext"],"mappings":";;;;AAUA,MAAM,wBAAwBA,MAAAA,cAE5B,MAAS;AAEJ,MAAM,yBAAyB,CAAC;AAAA,EACrC;AACF,MAEM;AACE,QAAA,cAAcC,aAAuC,CAAA,CAAE;AAE7D,QAAM,eAAeC,MAAAA,YAAY,CAAC,IAAY,aAA6B;AAC7D,gBAAA,QAAQ,EAAE,IAAI;AAAA,EAC5B,GAAG,CAAE,CAAA;AAEC,QAAA,iBAAiBA,kBAAY,CAAC,OAAe;AAC1C,WAAA,YAAY,QAAQ,EAAE;AAAA,EAC/B,GAAG,CAAE,CAAA;AAEC,QAAA,cAAcA,MAAAA,YAAY,MAAM;AACpC,WAAO,YAAY;AAAA,EACrB,GAAG,CAAE,CAAA;AAEL,QAAM,QAAQC,MAAA;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF,CAAC,cAAc,gBAAgB,WAAW;AAAA,EAAA;AAG5C,SACGC,2BAAAA,IAAA,sBAAsB,UAAtB,EAA+B,OAC7B,SACH,CAAA;AAEJ;AAEO,SAAS,sBAAsB;AAC9B,QAAA,UAAUC,iBAAW,qBAAqB;AAEhD,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI;AAAA,MACR;AAAA,IAAA;AAAA,EAEJ;AAEO,SAAA;AAAA,IACL,cAAc,QAAQ;AAAA,IACtB,gBAAgB,QAAQ;AAAA,IACxB,UAAU,QAAQ,YAAY;AAAA,EAAA;AAElC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Minimap.cjs","sources":["../../../../src/Flow/Minimap/Minimap.tsx"],"sourcesContent":["import { GetMiniMapNodeAttribute, MiniMap, MiniMapProps } from \"reactflow\";\n\nimport { ExtractNames } from \"@hitachivantara/uikit-react-core\";\nimport { HvColorAny, getColor } from \"@hitachivantara/uikit-styles\";\n\nimport { staticClasses, useClasses } from \"./Minimap.styles\";\n\nexport { staticClasses as flowMinimapClasses };\n\nexport type HvFlowMinimapClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowMinimapProps<NodeData = any>\n extends Omit<\n MiniMapProps<NodeData>,\n \"nodeColor\" | \"nodeStrokeColor\" | \"maskColor\" | \"maskStrokeColor\"\n > {\n /** Node color. Defaults to `atmo4`. */\n nodeColor?: HvColorAny | GetMiniMapNodeAttribute<NodeData>;\n /** Node stroke color. Defaults to `atmo4`. */\n nodeStrokeColor?: HvColorAny | GetMiniMapNodeAttribute<NodeData>;\n /** Mask color. Defaults to `atmo3`. */\n maskColor?: HvColorAny;\n /** Mask stroke color. Defaults to `atmo3`. */\n maskStrokeColor?: HvColorAny;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowMinimapClasses;\n}\n\nexport const HvFlowMinimap = ({\n nodeColor = \"atmo4\",\n maskColor = \"atmo3\",\n maskStrokeColor = \"atmo3\",\n nodeStrokeColor = \"atmo4\",\n classes: classesProp,\n className,\n ...others\n}: HvFlowMinimapProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <MiniMap\n className={cx(classes.root, className)}\n nodeColor={\n typeof nodeColor === \"string\" ? getColor(nodeColor, \"atmo4\") : nodeColor\n }\n nodeStrokeColor={\n typeof nodeStrokeColor === \"string\"\n ? getColor(nodeStrokeColor, \"atmo4\")\n : nodeStrokeColor\n }\n maskColor={getColor(maskColor, \"atmo3\")}\n maskStrokeColor={getColor(maskStrokeColor, \"atmo3\")}\n {...others}\n />\n );\n};\n"],"names":["useClasses","jsx","MiniMap","getColor"],"mappings":";;;;;;AA4BO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAA0B;AACxB,QAAM,EAAE,SAAS,GAAG,IAAIA,0BAAW,WAAW;AAG5C,SAAAC,2BAAA;AAAA,IAACC,UAAA;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACrC,WACE,OAAO,cAAc,WAAWC,YAAS,SAAA,WAAW,OAAO,IAAI;AAAA,MAEjE,iBACE,OAAO,oBAAoB,WACvBA,YAAS,SAAA,iBAAiB,OAAO,IACjC;AAAA,MAEN,WAAWA,YAAAA,SAAS,WAAW,OAAO;AAAA,MACtC,iBAAiBA,YAAAA,SAAS,iBAAiB,OAAO;AAAA,MACjD,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Minimap.styles.cjs","sources":["../../../../src/Flow/Minimap/Minimap.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowMinimap\", {\n root: {\n \"&.react-flow__minimap\": { backgroundColor: theme.colors.atmo2 },\n },\n});\n"],"names":["createClasses","theme"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,iBAAiB;AAAA,EAC1E,MAAM;AAAA,IACJ,yBAAyB,EAAE,iBAAiBC,qBAAM,OAAO,MAAM;AAAA,EACjE;AACF,CAAC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BaseNode.cjs","sources":["../../../../src/Flow/Node/BaseNode.tsx"],"sourcesContent":["import { isValidElement, useCallback, useEffect, useState } from \"react\";\nimport {\n Edge,\n Handle,\n NodeProps,\n NodeToolbar,\n Position,\n useReactFlow,\n} from \"reactflow\";\nimport { uid } from \"uid\";\nimport {\n ExtractNames,\n HvActionGeneric,\n HvBaseProps,\n HvButton,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Delete, Duplicate } from \"@hitachivantara/uikit-react-icons\";\nimport { HvColorAny, getColor, theme } from \"@hitachivantara/uikit-styles\";\n\nimport {\n HvFlowNodeAction,\n HvFlowBuiltInActions,\n HvFlowNodeInput,\n HvFlowNodeOutput,\n} from \"../types\";\nimport {\n useFlowNode,\n useFlowNodeInputEdges,\n useFlowNodeOutputEdges,\n} from \"../hooks/useFlowNode\";\nimport { useNodeMetaRegistry } from \"../FlowContext/NodeMetaContext\";\nimport { staticClasses, useClasses } from \"./BaseNode.styles\";\n\nexport { staticClasses as flowBaseNodeClasses };\n\nexport type HvFlowBaseNodeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowBaseNodeProps<T = any>\n extends Omit<HvBaseProps, \"id\">,\n NodeProps<T> {\n /** Header title */\n title?: string;\n /** Header icon */\n icon?: React.ReactNode;\n /** Header color */\n color?: HvColorAny;\n /** Header items */\n headerItems?: React.ReactNode;\n /** Node inputs */\n inputs?: HvFlowNodeInput[];\n /** Node outputs */\n outputs?: HvFlowNodeOutput[];\n /** Node actions */\n nodeActions?: HvFlowNodeAction[];\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowBaseNodeClasses;\n}\n\nconst isInputConnected = (\n id: string,\n type: \"target\" | \"source\",\n handleId: string,\n edges: Edge[]\n) => {\n if (type === \"target\") {\n return edges.some((e) => e.target === id && e.targetHandle === handleId);\n }\n if (type === \"source\") {\n return edges.some((e) => e.source === id && e.sourceHandle === handleId);\n }\n\n return false;\n};\n\nconst defaultActions: HvFlowBuiltInActions[] = [\n { id: \"delete\", label: \"Delete\", icon: <Delete /> },\n { id: \"duplicate\", label: \"Duplicate\", icon: <Duplicate /> },\n];\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowBaseNode = ({\n id,\n title,\n headerItems,\n icon,\n color: colorProp,\n inputs,\n outputs,\n nodeActions = defaultActions,\n classes: classesProp,\n className,\n children,\n}: HvFlowBaseNodeProps<unknown>) => {\n const { registerNode, unregisterNode } = useNodeMetaRegistry();\n useEffect(() => {\n registerNode(id, { label: title || \"\", inputs, outputs });\n return () => unregisterNode(id);\n }, [id, title, inputs, outputs, registerNode, unregisterNode]);\n\n const [showActions, setShowActions] = useState(false);\n const reactFlowInstance = useReactFlow();\n\n const { classes, cx, css } = useClasses(classesProp);\n\n const node = useFlowNode(id);\n const inputEdges = useFlowNodeInputEdges(id);\n const outputEdges = useFlowNodeOutputEdges(id);\n\n const handleDefaultAction = useCallback(\n (action: HvFlowNodeAction) => {\n if (!node) return;\n\n if (action.callback) {\n action.callback(node);\n return;\n }\n\n // built-in actions\n switch (action.id) {\n case \"delete\":\n reactFlowInstance.deleteElements({ nodes: [node] });\n break;\n case \"duplicate\":\n reactFlowInstance.addNodes([\n {\n ...node,\n id: uid(),\n position: {\n x: node.position.x,\n y: node.position.y + (node.height || 0) + 20,\n },\n selected: false,\n zIndex: Number(theme.zIndices.overlay),\n },\n ]);\n break;\n default:\n break;\n }\n },\n [node, reactFlowInstance]\n );\n\n if (!node) return null;\n\n const color = getColor(colorProp);\n const iconColor = isValidElement(icon)\n ? getColor(icon.props.color || \"base_dark\")\n : getColor(\"base_dark\");\n\n return (\n <div\n className={cx(\n \"nowheel\", // Disables the default canvas pan behaviour when scrolling inside the node\n css({ border: `1px solid ${color}` }),\n classes.root,\n className\n )}\n onMouseEnter={() => setShowActions(true)}\n onMouseLeave={() => setShowActions(false)}\n >\n <NodeToolbar isVisible={showActions} offset={0}>\n {nodeActions?.map((action) => (\n <HvButton\n key={action.id}\n icon\n onClick={() => handleDefaultAction(action)}\n >\n {renderedIcon(action.icon)}\n </HvButton>\n ))}\n </NodeToolbar>\n <div\n className={cx(css({ backgroundColor: color }), classes.headerContainer)}\n >\n <div\n className={cx(\n classes.titleContainer,\n css({ \"& svg *.color0\": { fill: iconColor } })\n )}\n >\n {icon}\n <HvTypography\n component=\"p\"\n variant=\"title4\"\n className={classes.title}\n >\n {title}\n </HvTypography>\n </div>\n {headerItems && <div style={{ display: \"flex\" }}>{headerItems}</div>}\n </div>\n {children && <div className={classes.contentContainer}>{children}</div>}\n {inputs && inputs.length > 0 && (\n <>\n <div className={classes.inputsTitleContainer}>\n <HvTypography>Inputs</HvTypography>\n </div>\n\n <div className={classes.inputsContainer}>\n {inputs?.map((input, idx) => {\n const handleId = input.id ?? idx.toString();\n return (\n <div className={classes.inputContainer} key={idx}>\n <Handle\n type=\"target\"\n isConnectableStart={false}\n id={handleId}\n position={Position.Left}\n style={{\n top: \"auto\",\n bottom:\n (outputs?.length ? 80 : 18) +\n (outputs?.length || 0) * 29 +\n 29 * idx,\n }}\n />\n <HvTypography>{input.label}</HvTypography>\n {input.isMandatory &&\n !isInputConnected(id, \"target\", handleId, inputEdges) && (\n <div className={classes.mandatory} />\n )}\n </div>\n );\n })}\n </div>\n </>\n )}\n {outputs && outputs.length > 0 && (\n <>\n <div className={classes.outputsTitleContainer}>\n <HvTypography>Outputs</HvTypography>\n </div>\n <div className={classes.outputsContainer}>\n {outputs?.map((output, idx) => {\n const handleId = output.id ?? idx.toString();\n return (\n <div className={classes.outputContainer} key={idx}>\n <Handle\n type=\"source\"\n isConnectableEnd={false}\n id={handleId}\n position={Position.Right}\n style={{\n bottom: -10 + 29 * (outputs.length - idx),\n top: \"auto\",\n }}\n />\n {output.isMandatory &&\n !isInputConnected(id, \"source\", handleId, outputEdges) && (\n <div className={classes.mandatory} />\n )}\n <HvTypography>{output.label}</HvTypography>\n </div>\n );\n })}\n </div>\n </>\n )}\n </div>\n );\n};\n"],"names":["jsx","Delete","Duplicate","isValidElement","useNodeMetaRegistry","useEffect","useState","useReactFlow","useClasses","useFlowNode","useFlowNodeInputEdges","useFlowNodeOutputEdges","useCallback","uid","theme","getColor","jsxs","NodeToolbar","HvButton","HvTypography","Fragment","Handle","Position"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BaseNode.styles.cjs","sources":["../../../../src/Flow/Node/BaseNode.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowBaseNode\", {\n root: {\n borderRadius: theme.radii.round,\n backgroundColor: theme.colors.atmo1,\n boxShadow: theme.colors.shadow,\n minWidth: \"250px\",\n },\n headerContainer: {\n padding: theme.spacing(0.5, 1),\n display: \"flex\",\n flexDirection: \"row\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n borderTopLeftRadius: \"inherit\",\n borderTopRightRadius: \"inherit\",\n },\n titleContainer: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n },\n title: {\n color: theme.colors.base_dark,\n },\n inputsTitleContainer: {\n display: \"flex\",\n justifyContent: \"center\",\n padding: theme.space.xs,\n backgroundColor: theme.colors.atmo2,\n borderTop: `1px solid ${theme.colors.atmo4}`,\n borderBottom: `1px solid ${theme.colors.atmo4}`,\n },\n outputsTitleContainer: {\n display: \"flex\",\n justifyContent: \"center\",\n padding: theme.space.xs,\n backgroundColor: theme.colors.atmo2,\n borderTop: `1px solid ${theme.colors.atmo4}`,\n borderBottom: `1px solid ${theme.colors.atmo4}`,\n },\n contentContainer: {},\n inputsContainer: {\n display: \"flex\",\n flexDirection: \"column\",\n padding: theme.space.sm,\n gap: theme.space.xs,\n alignItems: \"flex-start\",\n },\n outputsContainer: {\n display: \"flex\",\n flexDirection: \"column\",\n padding: theme.space.sm,\n gap: theme.space.xs,\n alignItems: \"flex-end\",\n },\n inputContainer: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n },\n outputContainer: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n },\n mandatory: {\n width: 10,\n height: 10,\n margin: theme.spacing(0, theme.space.xs),\n borderRadius: theme.radii.circle,\n backgroundColor: theme.colors.negative_20,\n },\n});\n"],"names":["createClasses","theme"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,kBAAkB;AAAA,EAC3E,MAAM;AAAA,IACJ,cAAcC,eAAAA,MAAM,MAAM;AAAA,IAC1B,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,IAC9B,WAAWA,eAAAA,MAAM,OAAO;AAAA,IACxB,UAAU;AAAA,EACZ;AAAA,EACA,iBAAiB;AAAA,IACf,SAASA,eAAA,MAAM,QAAQ,KAAK,CAAC;AAAA,IAC7B,SAAS;AAAA,IACT,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,qBAAqB;AAAA,IACrB,sBAAsB;AAAA,EACxB;AAAA,EACA,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,IACL,OAAOA,eAAAA,MAAM,OAAO;AAAA,EACtB;AAAA,EACA,sBAAsB;AAAA,IACpB,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,SAASA,eAAAA,MAAM,MAAM;AAAA,IACrB,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,IAC9B,WAAW,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,IAC1C,cAAc,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,EAC/C;AAAA,EACA,uBAAuB;AAAA,IACrB,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,SAASA,eAAAA,MAAM,MAAM;AAAA,IACrB,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,IAC9B,WAAW,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,IAC1C,cAAc,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,EAC/C;AAAA,EACA,kBAAkB,CAAC;AAAA,EACnB,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,eAAe;AAAA,IACf,SAASA,eAAAA,MAAM,MAAM;AAAA,IACrB,KAAKA,eAAAA,MAAM,MAAM;AAAA,IACjB,YAAY;AAAA,EACd;AAAA,EACA,kBAAkB;AAAA,IAChB,SAAS;AAAA,IACT,eAAe;AAAA,IACf,SAASA,eAAAA,MAAM,MAAM;AAAA,IACrB,KAAKA,eAAAA,MAAM,MAAM;AAAA,IACjB,YAAY;AAAA,EACd;AAAA,EACA,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,EACd;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,EACd;AAAA,EACA,WAAW;AAAA,IACT,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQA,eAAM,MAAA,QAAQ,GAAGA,eAAA,MAAM,MAAM,EAAE;AAAA,IACvC,cAAcA,eAAAA,MAAM,MAAM;AAAA,IAC1B,iBAAiBA,eAAAA,MAAM,OAAO;AAAA,EAChC;AACF,CAAC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Node.cjs","sources":["../../../../src/Flow/Node/Node.tsx"],"sourcesContent":["import React, { isValidElement, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvActionGeneric,\n HvActionsGenericProps,\n HvButton,\n HvButtonProps,\n HvDropDownMenu,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode } from \"../hooks\";\nimport { HvFlowNodeInput, HvFlowNodeOutput, HvFlowNodeParam } from \"../types\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\nimport {\n HvFlowBaseNode,\n HvFlowBaseNodeProps,\n HvFlowBaseNodeClasses,\n} from \"./BaseNode\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport interface HvFlowNodeClasses\n extends ExtractNames<typeof useClasses>,\n HvFlowBaseNodeClasses {}\n\nexport type HvFlowNodeDefaults = {\n title?: string;\n subTitle?: string;\n color?: string;\n icon?: React.ReactNode;\n};\n\nexport interface HvFlowNodeProps<T = any> extends HvFlowBaseNodeProps<T> {\n /** Node description */\n description?: string;\n /** Node actions */\n actions?: HvActionGeneric[]; // HvFlowNodeActions[];\n /** Node action callback */\n actionCallback?: HvActionsGenericProps[\"actionsCallback\"];\n /** Node maximum number of actions visible */\n maxVisibleActions?: number;\n /** Node expanded */\n expanded?: boolean;\n /** Node parameters */\n params?: HvFlowNodeParam[];\n /** A set of node default values for when there are no groups to fetch this data from. */\n nodeDefaults?: HvFlowNodeDefaults;\n /** Props to be passed to the expand parameters button. */\n expandParamsButtonProps?: HvButtonProps;\n /** Node outputs. */\n outputs?: HvFlowNodeOutput[];\n /** Node inputs. */\n inputs?: HvFlowNodeInput[];\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowNodeClasses;\n}\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowNode = ({\n id,\n type,\n headerItems,\n description,\n actions,\n outputs,\n inputs,\n actionCallback,\n maxVisibleActions = 1,\n expanded = false,\n params,\n nodeDefaults,\n classes: classesProp,\n children,\n expandParamsButtonProps,\n ...props\n}: HvFlowNodeProps<unknown>) => {\n const { classes } = useClasses(classesProp as HvFlowNodeClasses);\n\n const [showParams, setShowParams] = useState(expanded);\n\n const node = useFlowNode(id);\n\n const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n\n const subtitle = nodeTypes?.[type].meta?.label || nodeDefaults?.subTitle;\n const groupId = nodeTypes?.[type].meta?.groupId;\n\n const group = (groupId && nodeGroups && nodeGroups[groupId]) || undefined;\n const groupLabel = group?.label || nodeDefaults?.title;\n const icon = group?.icon || nodeDefaults?.icon;\n const color = group?.color || nodeDefaults?.color;\n\n const actsVisible = actions?.slice(0, maxVisibleActions);\n const actsDropdown = actions?.slice(maxVisibleActions);\n\n const hasParams = !!(params && params.length > 0);\n\n return (\n <HvFlowBaseNode\n id={id}\n type={type}\n title={groupLabel}\n icon={icon}\n color={color}\n inputs={inputs}\n outputs={outputs}\n nodeActions={defaultActions}\n classes={classesProp as HvFlowBaseNodeClasses}\n headerItems={\n <>\n {headerItems}\n {description && (\n <HvTooltip title={description}>\n <div>\n <Info color=\"base_dark\" />\n </div>\n </HvTooltip>\n )}\n {hasParams && (\n <HvButton\n icon\n overrideIconColors={false}\n onClick={() => setShowParams((p) => !p)}\n aria-label={showParams ? \"Collapse\" : \"Expand\"}\n {...expandParamsButtonProps}\n >\n {showParams ? (\n <Up role=\"none\" color=\"base_dark\" />\n ) : (\n <Down role=\"none\" color=\"base_dark\" />\n )}\n </HvButton>\n )}\n </>\n }\n {...props}\n >\n {(subtitle || actsVisible?.length || actsDropdown?.length) && (\n <div className={classes.subtitleContainer}>\n {subtitle && (\n <div>\n <HvTypography>{subtitle}</HvTypography>\n </div>\n )}\n <div className={classes.actions}>\n {actions?.length && actions?.length > 0 && (\n <>\n {actsVisible?.map((action) => (\n <HvTooltip key={action.id} title={action.label}>\n <HvButton\n icon\n onClick={(event) => {\n actionCallback?.(event, id, action);\n }}\n aria-label={action.label}\n >\n {renderedIcon(action.icon)}\n </HvButton>\n </HvTooltip>\n ))}\n\n {actsDropdown && actsDropdown.length > 0 && (\n <HvDropDownMenu\n keepOpened={false}\n dataList={actsDropdown?.map((action) => ({\n id: action.id,\n label: action.label,\n }))}\n onClick={(event, action) => {\n actionCallback?.(event, id, action as HvActionGeneric);\n }}\n />\n )}\n </>\n )}\n </div>\n </div>\n )}\n {children}\n {showParams && params && (\n <div className={classes.paramsContainer}>\n <ParamRenderer nodeId={id} params={params} data={node?.data} />\n </div>\n )}\n </HvFlowBaseNode>\n );\n};\n"],"names":["isValidElement","useClasses","useState","useFlowNode","useFlowContext","jsxs","HvFlowBaseNode","Fragment","jsx","HvTooltip","Info","HvButton","Up","Down","HvTypography","HvDropDownMenu","ParamRenderer"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Node.styles.cjs","sources":["../../../../src/Flow/Node/Node.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowNode\", {\n subtitleContainer: {\n minHeight: 48,\n padding: theme.spacing(\n theme.space.xs,\n theme.space.xs,\n theme.space.xs,\n theme.space.sm\n ),\n display: \"flex\",\n flexDirection: \"row\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n },\n actions: {\n display: \"flex\",\n alignItems: \"center\",\n },\n paramsContainer: {\n borderTop: `1px solid ${theme.colors.atmo4}`,\n display: \"flex\",\n flexDirection: \"column\",\n gap: theme.space.xs,\n padding: theme.space.sm,\n },\n});\n"],"names":["createClasses","theme"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,cAAc;AAAA,EACvE,mBAAmB;AAAA,IACjB,WAAW;AAAA,IACX,SAASC,eAAM,MAAA;AAAA,MACbA,qBAAM,MAAM;AAAA,MACZA,qBAAM,MAAM;AAAA,MACZA,qBAAM,MAAM;AAAA,MACZA,qBAAM,MAAM;AAAA,IACd;AAAA,IACA,SAAS;AAAA,IACT,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,YAAY;AAAA,EACd;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,iBAAiB;AAAA,IACf,WAAW,aAAaA,eAAM,MAAA,OAAO,KAAK;AAAA,IAC1C,SAAS;AAAA,IACT,eAAe;AAAA,IACf,KAAKA,eAAAA,MAAM,MAAM;AAAA,IACjB,SAASA,eAAAA,MAAM,MAAM;AAAA,EACvB;AACF,CAAC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ParamRenderer.cjs","sources":["../../../../../src/Flow/Node/Parameters/ParamRenderer.tsx"],"sourcesContent":["import { HvFlowNodeParam } from \"../../types\";\nimport Text from \"./Text\";\nimport Select from \"./Select\";\n\nexport type ParamRendererProps = {\n nodeId: string;\n params: HvFlowNodeParam[];\n data: any;\n};\n\nconst renderers = {\n text: Text,\n select: Select,\n};\n\nconst ParamRenderer = ({ nodeId, params, data }: ParamRendererProps) => {\n return (\n <>\n {params.map((param, idx) => {\n const Renderer = renderers[param.type];\n if (!Renderer) return null;\n\n return <Renderer key={idx} nodeId={nodeId} param={param} data={data} />;\n return null;\n })}\n </>\n );\n};\n\nexport default ParamRenderer;\n"],"names":["Text","Select","jsx","Fragment"],"mappings":";;;;;AAUA,MAAM,YAAY;AAAA,EAChB,MAAMA,KAAA;AAAA,EACN,QAAQC,OAAA;AACV;AAEA,MAAM,gBAAgB,CAAC,EAAE,QAAQ,QAAQ,WAA+B;AACtE,SAEKC,2BAAA,IAAAC,WAAA,UAAA,EAAA,UAAA,OAAO,IAAI,CAAC,OAAO,QAAQ;AACpB,UAAA,WAAW,UAAU,MAAM,IAAI;AACrC,QAAI,CAAC;AAAiB,aAAA;AAEtB,WAAQD,2BAAAA,IAAA,UAAA,EAAmB,QAAgB,OAAc,QAAnC,GAA+C;AAAA,EAEtE,CAAA,EACH,CAAA;AAEJ;AAEA,MAAA,kBAAe;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Select.cjs","sources":["../../../../../src/Flow/Node/Parameters/Select.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { HvDropdown, HvDropdownProps } from \"@hitachivantara/uikit-react-core\";\nimport { useReactFlow } from \"reactflow\";\n\nimport { HvFlowNodeSelectParam } from \"../../types\";\n\ninterface SelectProps {\n nodeId: string;\n param: Omit<HvFlowNodeSelectParam, \"type\">;\n data: any;\n}\n\nconst Select = ({ nodeId, param, data }: SelectProps) => {\n const { id, label, multiple = false, options } = param;\n\n const reactFlowInstance = useReactFlow();\n\n const [opts, setOpts] = useState<string[] | undefined>(\n data[id] ? (Array.isArray(data[id]) ? data[id] : [data[id]]) : undefined\n );\n\n const onSelectChange: HvDropdownProps[\"onChange\"] = (item) => {\n const nodes = reactFlowInstance.getNodes();\n\n const newOpts = Array.isArray(item)\n ? item.map((x) => x.label as string)\n : (item?.label as string) ?? undefined;\n\n const newNodes = nodes.map((node) => {\n if (node.id === nodeId) {\n node.data = {\n ...node.data,\n [id]: newOpts,\n };\n }\n return node;\n });\n\n reactFlowInstance.setNodes(newNodes);\n setOpts(\n newOpts ? (Array.isArray(newOpts) ? newOpts : [newOpts]) : undefined\n );\n };\n\n return (\n <HvDropdown\n className=\"nodrag\" // Prevents dragging within the select field\n disablePortal\n label={label}\n values={options?.map((o) => {\n return { id: o, label: o, selected: !!opts?.find((opt) => opt === o) };\n })}\n onChange={onSelectChange}\n maxHeight={100}\n multiSelect={multiple}\n />\n );\n};\n\nexport default Select;\n"],"names":["useReactFlow","useState","jsx","HvDropdown"],"mappings":";;;;;;AAYA,MAAM,SAAS,CAAC,EAAE,QAAQ,OAAO,WAAwB;AACvD,QAAM,EAAE,IAAI,OAAO,WAAW,OAAO,QAAY,IAAA;AAEjD,QAAM,oBAAoBA,UAAAA;AAEpB,QAAA,CAAC,MAAM,OAAO,IAAIC,MAAA;AAAA,IACtB,KAAK,EAAE,IAAK,MAAM,QAAQ,KAAK,EAAE,CAAC,IAAI,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,IAAK;AAAA,EAAA;AAG3D,QAAA,iBAA8C,CAAC,SAAS;AACtD,UAAA,QAAQ,kBAAkB;AAEhC,UAAM,UAAU,MAAM,QAAQ,IAAI,IAC9B,KAAK,IAAI,CAAC,MAAM,EAAE,KAAe,IAChC,MAAM,SAAoB;AAE/B,UAAM,WAAW,MAAM,IAAI,CAAC,SAAS;AAC/B,UAAA,KAAK,OAAO,QAAQ;AACtB,aAAK,OAAO;AAAA,UACV,GAAG,KAAK;AAAA,UACR,CAAC,EAAE,GAAG;AAAA,QAAA;AAAA,MAEV;AACO,aAAA;AAAA,IAAA,CACR;AAED,sBAAkB,SAAS,QAAQ;AACnC;AAAA,MACE,UAAW,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,IAAK;AAAA,IAAA;AAAA,EAC7D;AAIA,SAAAC,2BAAA;AAAA,IAACC,eAAA;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa;AAAA,MACb;AAAA,MACA,QAAQ,SAAS,IAAI,CAAC,MAAM;AAC1B,eAAO,EAAE,IAAI,GAAG,OAAO,GAAG,UAAU,CAAC,CAAC,MAAM,KAAK,CAAC,QAAQ,QAAQ,CAAC,EAAE;AAAA,MAAA,CACtE;AAAA,MACD,UAAU;AAAA,MACV,WAAW;AAAA,MACX,aAAa;AAAA,IAAA;AAAA,EAAA;AAGnB;AAEA,MAAA,WAAe;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Text.cjs","sources":["../../../../../src/Flow/Node/Parameters/Text.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { HvInput, HvInputProps } from \"@hitachivantara/uikit-react-core\";\nimport { useReactFlow } from \"reactflow\";\n\nimport { HvFlowNodeTextParam } from \"../../types\";\n\ninterface TextProps {\n nodeId: string;\n param: Omit<HvFlowNodeTextParam, \"type\">;\n data: any;\n}\n\nconst Text = ({ nodeId, param, data }: TextProps) => {\n const { id, label } = param;\n\n const reactFlowInstance = useReactFlow();\n\n const [text, setText] = useState(data[id]);\n\n const onTextChange: HvInputProps[\"onChange\"] = (event, val) => {\n const nodes = reactFlowInstance.getNodes();\n\n const newNodes = nodes.map((node) => {\n if (node.id === nodeId) {\n node.data = { ...node.data, [id]: val };\n }\n return node;\n });\n\n reactFlowInstance.setNodes(newNodes);\n setText(val);\n };\n\n return (\n <HvInput\n className=\"nodrag\" // Prevents dragging within the input field\n label={label}\n value={text}\n onChange={onTextChange}\n />\n );\n};\n\nexport default Text;\n"],"names":["useReactFlow","useState","jsx","HvInput"],"mappings":";;;;;;AAYA,MAAM,OAAO,CAAC,EAAE,QAAQ,OAAO,WAAsB;AAC7C,QAAA,EAAE,IAAI,MAAU,IAAA;AAEtB,QAAM,oBAAoBA,UAAAA;AAE1B,QAAM,CAAC,MAAM,OAAO,IAAIC,MAAS,SAAA,KAAK,EAAE,CAAC;AAEnC,QAAA,eAAyC,CAAC,OAAO,QAAQ;AACvD,UAAA,QAAQ,kBAAkB;AAEhC,UAAM,WAAW,MAAM,IAAI,CAAC,SAAS;AAC/B,UAAA,KAAK,OAAO,QAAQ;AACjB,aAAA,OAAO,EAAE,GAAG,KAAK,MAAM,CAAC,EAAE,GAAG;MACpC;AACO,aAAA;AAAA,IAAA,CACR;AAED,sBAAkB,SAAS,QAAQ;AACnC,YAAQ,GAAG;AAAA,EAAA;AAIX,SAAAC,2BAAA;AAAA,IAACC,eAAA;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV;AAAA,MACA,OAAO;AAAA,MACP,UAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;AAEA,MAAA,SAAe;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Sidebar.cjs","sources":["../../../../src/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 {\n HvFlowDraggableSidebarGroupItem,\n HvFlowSidebarGroupItem,\n} from \"./SidebarGroup/SidebarGroupItem\";\nimport { HvFlowNodeGroup } from \"../types\";\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 /** Props to be applied to the default nodes group. */\n defaultGroupProps?: HvFlowNodeGroup;\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 defaultGroupProps,\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, defaultGroupProps),\n [nodeGroups, nodeTypes, defaultGroupProps]\n );\n\n const [groups, setGroups] = useState(unfilteredGroups);\n const [ndTypes, setNdTypes] = useState(nodeTypes);\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 if (nodeGroups) {\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 } else if (nodeTypes) {\n const filteredNodeTypes = {};\n for (const [key, node] of Object.entries(nodeTypes)) {\n if (\n node.meta?.label\n .toLocaleLowerCase()\n .includes(value.toLocaleLowerCase())\n ) {\n filteredNodeTypes[key] = node;\n }\n }\n setNdTypes(value ? filteredNodeTypes : nodeTypes);\n }\n };\n\n const handleDebouncedSearch = debounce(handleSearch, 500);\n\n return (\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 component=\"p\" variant=\"title3\">\n {title}\n </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 {nodeGroups ? (\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 ) : (\n ndTypes &&\n Object.entries(ndTypes).map((obj) => {\n return (\n <HvFlowDraggableSidebarGroupItem\n key={obj[0]}\n id={obj[0]}\n type={obj[0]}\n label={obj[1]?.meta?.label || \"\"}\n data={obj[1]?.meta?.data}\n aria-roledescription={labels?.itemAriaRoleDescription}\n className={classes.nodeType}\n />\n );\n })\n )}\n </div>\n </div>\n <DragOverlay modifiers={[restrictToWindowEdges]} {...dragOverlayProps}>\n {draggingLabel ? (\n <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n ) : null}\n </DragOverlay>\n </HvDrawer>\n );\n};\n"],"names":["useClasses","useFlowContext","useMemo","buildGroups","useState","useEffect","useLabels","useUniqueId","useDroppable","useDndMonitor","debounce","jsxs","HvDrawer","jsx","Add","HvTypography","HvInput","HvFlowSidebarGroup","HvFlowDraggableSidebarGroupItem","DragOverlay","restrictToWindowEdges","HvFlowSidebarGroupItem"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Sidebar.styles.cjs","sources":["../../../../src/Flow/Sidebar/Sidebar.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowSidebar\", {\n drawerPaper: { width: \"360px\" },\n titleContainer: {\n display: \"flex\",\n padding: theme.spacing(\"sm\", \"lg\", \"xs\", \"sm\"),\n },\n contentContainer: { padding: theme.spacing(0, \"lg\", \"sm\", \"lg\") },\n description: { color: theme.colors.secondary_60 },\n searchRoot: {\n paddingTop: theme.space.sm,\n paddingBottom: theme.space.sm,\n },\n groupsContainer: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: theme.space.sm,\n listStyleType: \"none\",\n },\n nodeType: {\n marginBottom: theme.space.xs,\n },\n});\n"],"names":["createClasses","theme"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,iBAAiB;AAAA,EAC1E,aAAa,EAAE,OAAO,QAAQ;AAAA,EAC9B,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,SAASC,eAAM,MAAA,QAAQ,MAAM,MAAM,MAAM,IAAI;AAAA,EAC/C;AAAA,EACA,kBAAkB,EAAE,SAASA,qBAAM,QAAQ,GAAG,MAAM,MAAM,IAAI,EAAE;AAAA,EAChE,aAAa,EAAE,OAAOA,qBAAM,OAAO,aAAa;AAAA,EAChD,YAAY;AAAA,IACV,YAAYA,eAAAA,MAAM,MAAM;AAAA,IACxB,eAAeA,eAAAA,MAAM,MAAM;AAAA,EAC7B;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,eAAe;AAAA,IACf,KAAKA,eAAAA,MAAM,MAAM;AAAA,IACjB,eAAe;AAAA,EACjB;AAAA,EACA,UAAU;AAAA,IACR,cAAcA,eAAAA,MAAM,MAAM;AAAA,EAC5B;AACF,CAAC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SidebarGroup.cjs","sources":["../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroup.tsx"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\n\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\nimport {\n ExtractNames,\n HvButton,\n HvButtonProps,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { getColor } from \"@hitachivantara/uikit-styles\";\n\nimport { HvFlowNodeGroup } from \"../../types\";\nimport { staticClasses, useClasses } from \"./SidebarGroup.styles\";\nimport {\n HvFlowDraggableSidebarGroupItem,\n HvFlowDraggableSidebarGroupItemProps,\n} from \"./SidebarGroupItem\";\nimport { useFlowContext } from \"../../hooks\";\n\nexport { staticClasses as flowSidebarGroupClasses };\n\nexport type HvFlowSidebarGroupClasses = ExtractNames<typeof useClasses>;\n\nexport type HvFlowSidebarGroupNode = {\n type: string;\n label: string;\n data?: unknown;\n};\n\nexport type HvFlowSidebarGroupNodes = HvFlowSidebarGroupNode[];\n\nexport interface HvFlowSidebarGroupProps extends HvFlowNodeGroup {\n /** Group id. */\n id: string;\n /** Group nodes. */\n nodes: HvFlowSidebarGroupNodes;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowSidebarGroupClasses;\n /** Expand button props. */\n expandButtonProps?: HvButtonProps;\n /** Item group props. */\n itemProps?: Partial<HvFlowDraggableSidebarGroupItemProps>;\n}\n\nexport const HvFlowSidebarGroup = ({\n id,\n label,\n nodes,\n color,\n description,\n icon,\n expandButtonProps,\n classes: classesProp,\n itemProps,\n}: HvFlowSidebarGroupProps) => {\n const { classes, cx, css } = useClasses(classesProp);\n\n const { expandedNodeGroups, setExpandedNodeGroups } = useFlowContext();\n\n const opened = useMemo(\n () => !!expandedNodeGroups?.find((groupId) => groupId === id),\n [expandedNodeGroups, id]\n );\n\n const handleClick = useCallback(() => {\n setExpandedNodeGroups?.((prev) =>\n opened ? prev.filter((groupId) => id !== groupId) : [...prev, id]\n );\n }, [id, opened, setExpandedNodeGroups]);\n\n return (\n <li className={cx(css({ borderColor: getColor(color) }), classes.root)}>\n <div className={classes.titleContainer}>\n <div className={classes.labelContainer}>\n <div className={classes.icon} role=\"none\">\n {icon}\n </div>\n <HvTypography component=\"p\" variant=\"title4\">\n {nodes.length > 1 ? `${label} (${nodes.length})` : label}\n </HvTypography>\n </div>\n <HvButton\n icon\n onClick={handleClick}\n aria-expanded={opened}\n {...expandButtonProps}\n >\n {opened ? <Up role=\"none\" /> : <Down role=\"none\" />}\n </HvButton>\n </div>\n {description && (\n <div className={classes.descriptionContainer}>\n <HvTypography>{description}</HvTypography>\n </div>\n )}\n {opened && (\n <div className={classes.itemsContainer}>\n {nodes.map((obj) => (\n <HvFlowDraggableSidebarGroupItem\n key={obj.type}\n {...itemProps}\n {...obj}\n />\n ))}\n </div>\n )}\n </li>\n );\n};\n"],"names":["useClasses","useFlowContext","useMemo","useCallback","jsxs","getColor","jsx","HvTypography","HvButton","Up","Down","HvFlowDraggableSidebarGroupItem"],"mappings":";;;;;;;;;;AA4CO,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AACF,MAA+B;AAC7B,QAAM,EAAE,SAAS,IAAI,IAAI,IAAIA,oBAAAA,WAAW,WAAW;AAEnD,QAAM,EAAE,oBAAoB,sBAAsB,IAAIC,eAAe,eAAA;AAErE,QAAM,SAASC,MAAA;AAAA,IACb,MAAM,CAAC,CAAC,oBAAoB,KAAK,CAAC,YAAY,YAAY,EAAE;AAAA,IAC5D,CAAC,oBAAoB,EAAE;AAAA,EAAA;AAGnB,QAAA,cAAcC,MAAAA,YAAY,MAAM;AACpC;AAAA,MAAwB,CAAC,SACvB,SAAS,KAAK,OAAO,CAAC,YAAY,OAAO,OAAO,IAAI,CAAC,GAAG,MAAM,EAAE;AAAA,IAAA;AAAA,EAEjE,GAAA,CAAC,IAAI,QAAQ,qBAAqB,CAAC;AAEtC,SACGC,2BAAAA,KAAA,MAAA,EAAG,WAAW,GAAG,IAAI,EAAE,aAAaC,YAAAA,SAAS,KAAK,EAAE,CAAC,GAAG,QAAQ,IAAI,GACnE,UAAA;AAAA,IAACD,2BAAA,KAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,MAACA,2BAAA,KAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,QAAAE,+BAAC,SAAI,WAAW,QAAQ,MAAM,MAAK,QAChC,UACH,MAAA;AAAA,QACCA,+BAAAC,eAAAA,cAAA,EAAa,WAAU,KAAI,SAAQ,UACjC,UAAA,MAAM,SAAS,IAAI,GAAG,KAAK,KAAK,MAAM,MAAM,MAAM,OACrD;AAAA,MAAA,GACF;AAAA,MACAD,2BAAA;AAAA,QAACE,eAAA;AAAA,QAAA;AAAA,UACC,MAAI;AAAA,UACJ,SAAS;AAAA,UACT,iBAAe;AAAA,UACd,GAAG;AAAA,UAEH,UAAA,wCAAUC,gBAAG,IAAA,EAAA,MAAK,QAAO,IAAKH,2BAAA,IAACI,gBAAK,MAAA,EAAA,MAAK,OAAO,CAAA;AAAA,QAAA;AAAA,MACnD;AAAA,IAAA,GACF;AAAA,IACC,8CACE,OAAI,EAAA,WAAW,QAAQ,sBACtB,UAAAJ,2BAAAA,IAACC,eAAAA,cAAc,EAAA,UAAA,YAAA,CAAY,EAC7B,CAAA;AAAA,IAED,yCACE,OAAI,EAAA,WAAW,QAAQ,gBACrB,UAAA,MAAM,IAAI,CAAC,QACVD,2BAAA;AAAA,MAACK,0BAAA;AAAA,MAAA;AAAA,QAEE,GAAG;AAAA,QACH,GAAG;AAAA,MAAA;AAAA,MAFC,IAAI;AAAA,IAIZ,CAAA,GACH;AAAA,EAEJ,EAAA,CAAA;AAEJ;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SidebarGroup.styles.cjs","sources":["../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n \"HvFlowSidebarGroup\",\n {\n root: {\n padding: theme.space.sm,\n borderRadius: theme.radii.round,\n borderWidth: \"1px\",\n borderTopWidth: \"3px\",\n },\n titleContainer: {\n display: \"flex\",\n justifyContent: \"space-between\",\n },\n labelContainer: {\n display: \"flex\",\n alignItems: \"center\",\n },\n icon: { paddingRight: theme.space.xs },\n descriptionContainer: {\n padding: `${theme.space.xs} 0 ${theme.space.sm} calc(32px + ${theme.space.xs})`,\n },\n itemsContainer: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: theme.space.xs,\n paddingLeft: theme.space.sm,\n },\n }\n);\n"],"names":["createClasses","theme"],"mappings":";;;AAEa,MAAA,EAAE,eAAe,WAAA,IAAeA,eAAA;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAASC,eAAAA,MAAM,MAAM;AAAA,MACrB,cAAcA,eAAAA,MAAM,MAAM;AAAA,MAC1B,aAAa;AAAA,MACb,gBAAgB;AAAA,IAClB;AAAA,IACA,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,gBAAgB;AAAA,IAClB;AAAA,IACA,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,YAAY;AAAA,IACd;AAAA,IACA,MAAM,EAAE,cAAcA,qBAAM,MAAM,GAAG;AAAA,IACrC,sBAAsB;AAAA,MACpB,SAAS,GAAGA,eAAAA,MAAM,MAAM,EAAE,MAAMA,eAAAA,MAAM,MAAM,EAAE,gBAAgBA,eAAAA,MAAM,MAAM,EAAE;AAAA,IAC9E;AAAA,IACA,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,eAAe;AAAA,MACf,KAAKA,eAAAA,MAAM,MAAM;AAAA,MACjB,aAAaA,eAAAA,MAAM,MAAM;AAAA,IAC3B;AAAA,EACF;AACF;;;"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
4
|
const React = require("react");
|
|
5
|
-
const
|
|
5
|
+
const utils = require("@mui/material/utils");
|
|
6
6
|
const core = require("@dnd-kit/core");
|
|
7
7
|
const uikitReactCore = require("@hitachivantara/uikit-react-core");
|
|
8
8
|
const SidebarGroupItem = require("./SidebarGroupItem.cjs");
|
|
@@ -31,7 +31,7 @@ const HvFlowDraggableSidebarGroupItem = ({
|
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
});
|
|
34
|
-
const forkedRef =
|
|
34
|
+
const forkedRef = utils.useForkRef(itemRef, setNodeRef);
|
|
35
35
|
const style = transform ? {
|
|
36
36
|
transform: `translate3d(${transform.x}px, ${transform.y}px, 0)`
|
|
37
37
|
} : void 0;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DraggableSidebarGroupItem.cjs","sources":["../../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.tsx"],"sourcesContent":["import { useRef } from \"react\";\n\nimport { useForkRef } from \"@mui/material/utils\";\n\nimport { useDraggable } from \"@dnd-kit/core\";\n\nimport { useUniqueId } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n HvFlowSidebarGroupItem,\n HvFlowSidebarGroupItemProps,\n} from \"./SidebarGroupItem\";\n\nexport interface HvFlowDraggableSidebarGroupItemProps\n extends HvFlowSidebarGroupItemProps {\n /** Item type. */\n type: string;\n /** Item data. */\n data?: unknown;\n}\n\nexport const HvFlowDraggableSidebarGroupItem = ({\n id,\n label,\n type,\n data,\n ...others\n}: HvFlowDraggableSidebarGroupItemProps) => {\n const itemRef = useRef<HTMLElement>(null);\n\n const elementId = useUniqueId(id, `hvFlowDraggableItem-${type}`);\n\n const { attributes, listeners, setNodeRef, isDragging, transform } =\n useDraggable({\n id: elementId,\n data: {\n hvFlow: {\n // Needed to know which item is being dragged and dropped\n type,\n // Needed for the drag overlay: otherwise the item is cut by the drawer because of overflow\n label,\n // Item position: used to position the item when dropped\n x: itemRef.current?.getBoundingClientRect().x,\n y: itemRef.current?.getBoundingClientRect().y,\n // Data\n data,\n },\n },\n });\n\n const forkedRef = useForkRef(itemRef, setNodeRef);\n\n const style = transform\n ? {\n transform: `translate3d(${transform.x}px, ${transform.y}px, 0)`,\n }\n : undefined;\n\n return (\n <HvFlowSidebarGroupItem\n ref={forkedRef}\n style={style}\n label={label}\n isDragging={isDragging}\n {...listeners}\n {...attributes}\n {...others}\n />\n );\n};\n"],"names":["useRef","useUniqueId","useDraggable","useForkRef","jsx","HvFlowSidebarGroupItem"],"mappings":";;;;;;;;AAqBO,MAAM,kCAAkC,CAAC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA4C;AACpC,QAAA,UAAUA,aAAoB,IAAI;AAExC,QAAM,YAAYC,eAAAA,YAAY,IAAI,uBAAuB,IAAI,EAAE;AAE/D,QAAM,EAAE,YAAY,WAAW,YAAY,YAAY,cACrDC,kBAAa;AAAA,IACX,IAAI;AAAA,IACJ,MAAM;AAAA,MACJ,QAAQ;AAAA;AAAA,QAEN;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA,GAAG,QAAQ,SAAS,sBAAwB,EAAA;AAAA,QAC5C,GAAG,QAAQ,SAAS,sBAAwB,EAAA;AAAA;AAAA,QAE5C;AAAA,MACF;AAAA,IACF;AAAA,EAAA,CACD;AAEG,QAAA,YAAYC,MAAAA,WAAW,SAAS,UAAU;AAEhD,QAAM,QAAQ,YACV;AAAA,IACE,WAAW,eAAe,UAAU,CAAC,OAAO,UAAU,CAAC;AAAA,EAEzD,IAAA;AAGF,SAAAC,2BAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SidebarGroupItem.cjs","sources":["../../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport {\n ExtractNames,\n HvBaseProps,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Drag } from \"@hitachivantara/uikit-react-icons\";\n\nimport { staticClasses, useClasses } from \"./SidebarGroupItem.styles\";\n\nexport { staticClasses as flowSidebarGroupItemClasses };\n\nexport type HvFlowSidebarGroupItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarGroupItemProps extends HvBaseProps {\n /** Item label. */\n label: string;\n /** Whether the item is being dragged. */\n isDragging?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowSidebarGroupItemClasses;\n}\n\nexport const HvFlowSidebarGroupItem = forwardRef<\n HTMLDivElement,\n HvFlowSidebarGroupItemProps\n>(\n (\n {\n label,\n isDragging,\n classes: classesProp,\n className,\n ...others\n }: HvFlowSidebarGroupItemProps,\n ref\n ) => {\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <div\n ref={ref}\n className={cx(\n classes.root,\n { [classes.dragging]: isDragging },\n className\n )}\n {...others}\n >\n <HvTypography>{label}</HvTypography>\n <Drag role=\"none\" />\n </div>\n );\n }\n);\n"],"names":["forwardRef","useClasses","jsxs","jsx","HvTypography","Drag"],"mappings":";;;;;;;AAwBO,MAAM,yBAAyBA,MAAA;AAAA,EAIpC,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,KAEL,QACG;AACH,UAAM,EAAE,SAAS,GAAG,IAAIC,mCAAW,WAAW;AAG5C,WAAAC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,UACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,WAAW;AAAA,UACjC;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAAC,2BAAAA,IAACC,+BAAc,UAAM,MAAA,CAAA;AAAA,UACrBD,2BAAAA,IAACE,gBAAK,MAAA,EAAA,MAAK,OAAO,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGxB;AACF;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SidebarGroupItem.styles.cjs","sources":["../../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.tsx"],"sourcesContent":["import {\n createClasses,\n outlineStyles,\n theme,\n} from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n \"HvFlowSidebarGroupItem\",\n {\n root: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n border: `1px solid ${theme.colors.atmo4}`,\n padding: theme.spacing(0, 0, 0, \"sm\"),\n cursor: \"pointer\",\n boxShadow: `0 1px 0 ${theme.colors.shad1}`,\n\n \"&:focus-visible\": {\n ...outlineStyles,\n },\n },\n dragging: { borderColor: theme.colors.primary_80 },\n }\n);\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;AAMa,MAAA,EAAE,eAAe,WAAA,IAAeA,eAAA;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,QAAQ,aAAaC,eAAM,MAAA,OAAO,KAAK;AAAA,MACvC,SAASA,eAAM,MAAA,QAAQ,GAAG,GAAG,GAAG,IAAI;AAAA,MACpC,QAAQ;AAAA,MACR,WAAW,WAAWA,eAAM,MAAA,OAAO,KAAK;AAAA,MAExC,mBAAmB;AAAA,QACjB,GAAGC,eAAA;AAAA,MACL;AAAA,IACF;AAAA,IACA,UAAU,EAAE,aAAaD,qBAAM,OAAO,WAAW;AAAA,EACnD;AACF;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.cjs","sources":["../../../../src/Flow/Sidebar/utils.ts"],"sourcesContent":["import { HvFlowContextValue } from \"../FlowContext\";\nimport { HvFlowNodeGroup } from \"../types\";\nimport {\n HvFlowSidebarGroupNodes,\n HvFlowSidebarGroupNode,\n} from \"./SidebarGroup\";\n\ntype NodeGroup = HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes };\n\nexport const buildGroups = (\n nodeGroups: HvFlowContextValue[\"nodeGroups\"],\n nodeTypes: HvFlowContextValue[\"nodeTypes\"],\n defaultGroupProps?: HvFlowNodeGroup\n) => {\n if (!nodeGroups) return {};\n\n return Object.entries(nodeGroups).reduce((acc, curr) => {\n const nodesWithGroupId: HvFlowSidebarGroupNode[] = [];\n const nodesWithoutGroupId: HvFlowSidebarGroupNode[] = [];\n\n if (nodeTypes) {\n for (const [nodeType, node] of Object.entries(nodeTypes)) {\n if (node.meta?.groupId === curr[0]) {\n nodesWithGroupId.push({\n type: nodeType,\n label: node.meta?.label,\n data: node.meta?.data,\n });\n } else if (!node.meta?.groupId) {\n nodesWithoutGroupId.push({\n type: nodeType,\n label: node.meta?.label || \"\",\n data: node.meta?.data,\n });\n }\n }\n }\n\n acc[curr[0]] = {\n ...curr[1],\n nodes: nodesWithGroupId,\n };\n\n // Create a \"Default\" group for nodes without a groupId\n if (nodesWithoutGroupId.length > 0) {\n acc.Default = {\n // @ts-ignore\n name: \"Default\",\n label: \"Default\",\n nodes: nodesWithoutGroupId,\n ...defaultGroupProps,\n };\n }\n\n return acc;\n }, {} as Record<string, NodeGroup>);\n};\n"],"names":[],"mappings":";;AASO,MAAM,cAAc,CACzB,YACA,WACA,sBACG;AACH,MAAI,CAAC;AAAY,WAAO;AAExB,SAAO,OAAO,QAAQ,UAAU,EAAE,OAAO,CAAC,KAAK,SAAS;AACtD,UAAM,mBAA6C,CAAA;AACnD,UAAM,sBAAgD,CAAA;AAEtD,QAAI,WAAW;AACb,iBAAW,CAAC,UAAU,IAAI,KAAK,OAAO,QAAQ,SAAS,GAAG;AACxD,YAAI,KAAK,MAAM,YAAY,KAAK,CAAC,GAAG;AAClC,2BAAiB,KAAK;AAAA,YACpB,MAAM;AAAA,YACN,OAAO,KAAK,MAAM;AAAA,YAClB,MAAM,KAAK,MAAM;AAAA,UAAA,CAClB;AAAA,QACQ,WAAA,CAAC,KAAK,MAAM,SAAS;AAC9B,8BAAoB,KAAK;AAAA,YACvB,MAAM;AAAA,YACN,OAAO,KAAK,MAAM,SAAS;AAAA,YAC3B,MAAM,KAAK,MAAM;AAAA,UAAA,CAClB;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAEI,QAAA,KAAK,CAAC,CAAC,IAAI;AAAA,MACb,GAAG,KAAK,CAAC;AAAA,MACT,OAAO;AAAA,IAAA;AAIL,QAAA,oBAAoB,SAAS,GAAG;AAClC,UAAI,UAAU;AAAA;AAAA,QAEZ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,OAAO;AAAA,QACP,GAAG;AAAA,MAAA;AAAA,IAEP;AAEO,WAAA;AAAA,EACT,GAAG,CAA+B,CAAA;AACpC;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base.cjs","sources":["../../../src/Flow/base.ts"],"sourcesContent":["import { css } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const flowStyles = css`\n /* this gets exported as style.css and can be used for the default theming */\n /* these are the necessary styles for React Flow, they get used by base.css and style.css */\n .react-flow__container {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n }\n .react-flow__pane {\n z-index: 1;\n cursor: -webkit-grab;\n cursor: grab;\n }\n .react-flow__pane.selection {\n cursor: pointer;\n }\n .react-flow__pane.dragging {\n cursor: -webkit-grabbing;\n cursor: grabbing;\n }\n .react-flow__viewport {\n transform-origin: 0 0;\n z-index: 2;\n pointer-events: none;\n }\n .react-flow__renderer {\n z-index: 4;\n }\n .react-flow__selection {\n z-index: 6;\n }\n .react-flow__nodesselection-rect:focus,\n .react-flow__nodesselection-rect:focus-visible {\n outline: none;\n }\n .react-flow .react-flow__edges {\n pointer-events: none;\n overflow: visible;\n }\n .react-flow__edge-path,\n .react-flow__connection-path {\n stroke: ${theme.colors.secondary};\n stroke-width: 1;\n fill: none;\n }\n .react-flow__edge {\n pointer-events: visibleStroke;\n cursor: pointer;\n }\n .react-flow__edge.animated path {\n stroke-dasharray: 5;\n -webkit-animation: dashdraw 0.5s linear infinite;\n animation: dashdraw 0.5s linear infinite;\n }\n .react-flow__edge.animated path.react-flow__edge-interaction {\n stroke-dasharray: none;\n -webkit-animation: none;\n animation: none;\n }\n .react-flow__edge.inactive {\n pointer-events: none;\n }\n .react-flow__edge.selected,\n .react-flow__edge:focus,\n .react-flow__edge:focus-visible {\n outline: none;\n }\n .react-flow__edge.selected .react-flow__edge-path,\n .react-flow__edge:focus .react-flow__edge-path,\n .react-flow__edge:focus-visible .react-flow__edge-path {\n stroke: #555;\n }\n .react-flow__edge-textwrapper {\n pointer-events: all;\n }\n .react-flow__edge-textbg {\n fill: white;\n }\n .react-flow__edge .react-flow__edge-text {\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n .react-flow__connection {\n pointer-events: none;\n }\n .react-flow__connection .animated {\n stroke-dasharray: 5;\n -webkit-animation: dashdraw 0.5s linear infinite;\n animation: dashdraw 0.5s linear infinite;\n }\n .react-flow__connectionline {\n z-index: 1001;\n }\n .react-flow__nodes {\n pointer-events: none;\n transform-origin: 0 0;\n }\n .react-flow__node {\n position: absolute;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n pointer-events: all;\n transform-origin: 0 0;\n box-sizing: border-box;\n cursor: -webkit-grab;\n cursor: grab;\n }\n .react-flow__node.dragging {\n cursor: -webkit-grabbing;\n cursor: grabbing;\n }\n .react-flow__nodesselection {\n z-index: 3;\n transform-origin: left top;\n pointer-events: none;\n }\n .react-flow__nodesselection-rect {\n position: absolute;\n pointer-events: all;\n cursor: -webkit-grab;\n cursor: grab;\n }\n .react-flow__handle {\n position: absolute;\n pointer-events: none;\n min-width: 5px;\n min-height: 5px;\n width: 6px;\n height: 6px;\n background: #1a192b;\n border: 1px solid white;\n border-radius: 100%;\n }\n .react-flow__handle.connectionindicator {\n pointer-events: all;\n cursor: crosshair;\n }\n .react-flow__handle-bottom {\n top: auto;\n left: 50%;\n bottom: -4px;\n transform: translate(-50%, 0);\n }\n .react-flow__handle-top {\n left: 50%;\n top: -4px;\n transform: translate(-50%, 0);\n }\n .react-flow__handle-left {\n top: 50%;\n left: -4px;\n transform: translate(0, -50%);\n }\n .react-flow__handle-right {\n right: -4px;\n top: 50%;\n transform: translate(0, -50%);\n }\n .react-flow__edgeupdater {\n cursor: move;\n pointer-events: all;\n }\n .react-flow__panel {\n position: absolute;\n z-index: 5;\n margin: 15px;\n }\n .react-flow__panel.top {\n top: 0;\n }\n .react-flow__panel.bottom {\n bottom: 0;\n }\n .react-flow__panel.left {\n left: 0;\n }\n .react-flow__panel.right {\n right: 0;\n }\n .react-flow__panel.center {\n left: 50%;\n transform: translateX(-50%);\n }\n .react-flow__attribution {\n font-size: 10px;\n background: rgba(255, 255, 255, 0.5);\n padding: 2px 3px;\n margin: 0;\n }\n .react-flow__attribution a {\n text-decoration: none;\n color: #999;\n }\n @-webkit-keyframes dashdraw {\n from {\n stroke-dashoffset: 10;\n }\n }\n @keyframes dashdraw {\n from {\n stroke-dashoffset: 10;\n }\n }\n .react-flow__edgelabel-renderer {\n position: absolute;\n width: 100%;\n height: 100%;\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n .react-flow__edge.updating .react-flow__edge-path {\n stroke: #777;\n }\n .react-flow__edge-text {\n font-size: 10px;\n }\n .react-flow__node.selectable:focus,\n .react-flow__node.selectable:focus-visible {\n outline: none;\n }\n .react-flow__node-default,\n .react-flow__node-input,\n .react-flow__node-output,\n .react-flow__node-group {\n padding: ${theme.space.sm};\n border-radius: ${theme.radii.round};\n width: 150px;\n color: ${theme.colors.secondary};\n text-align: center;\n border: 1px solid ${theme.colors.negative};\n background-color: ${theme.colors.negative_20};\n }\n .react-flow__node-default::before {\n content: \"Unknown node type\";\n display: block;\n }\n .react-flow__node-default.selectable:hover,\n .react-flow__node-input.selectable:hover,\n .react-flow__node-output.selectable:hover,\n .react-flow__node-group.selectable:hover {\n box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.08);\n }\n .react-flow__node-default.selectable.selected,\n .react-flow__node-default.selectable:focus,\n .react-flow__node-default.selectable:focus-visible,\n .react-flow__node-input.selectable.selected,\n .react-flow__node-input.selectable:focus,\n .react-flow__node-input.selectable:focus-visible,\n .react-flow__node-output.selectable.selected,\n .react-flow__node-output.selectable:focus,\n .react-flow__node-output.selectable:focus-visible,\n .react-flow__node-group.selectable.selected,\n .react-flow__node-group.selectable:focus,\n .react-flow__node-group.selectable:focus-visible {\n box-shadow: 0 0 0 0.5px #1a192b;\n }\n .react-flow__node-group {\n background-color: rgba(240, 240, 240, 0.25);\n }\n .react-flow__nodesselection-rect,\n .react-flow__selection {\n background: rgba(0, 89, 220, 0.08);\n border: 1px dotted rgba(0, 89, 220, 0.8);\n }\n .react-flow__nodesselection-rect:focus,\n .react-flow__nodesselection-rect:focus-visible,\n .react-flow__selection:focus,\n .react-flow__selection:focus-visible {\n outline: none;\n }\n .react-flow__controls {\n box-shadow: ${theme.colors.shadow};\n }\n .react-flow__controls-button {\n border: none;\n background: #fefefe;\n border-bottom: 1px solid #eee;\n box-sizing: content-box;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 16px;\n height: 16px;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n padding: 5px;\n }\n .react-flow__controls-button:hover {\n background: #f4f4f4;\n }\n .react-flow__controls-button svg {\n width: 100%;\n max-width: 12px;\n max-height: 12px;\n }\n .react-flow__controls-button:disabled {\n pointer-events: none;\n }\n .react-flow__controls-button:disabled svg {\n fill-opacity: 0.4;\n }\n .react-flow__minimap {\n background-color: #fff;\n }\n .react-flow__resize-control {\n position: absolute;\n }\n .react-flow__resize-control.left,\n .react-flow__resize-control.right {\n cursor: ew-resize;\n }\n .react-flow__resize-control.top,\n .react-flow__resize-control.bottom {\n cursor: ns-resize;\n }\n .react-flow__resize-control.top.left,\n .react-flow__resize-control.bottom.right {\n cursor: nwse-resize;\n }\n .react-flow__resize-control.bottom.left,\n .react-flow__resize-control.top.right {\n cursor: nesw-resize;\n }\n /* handle styles */\n .react-flow__resize-control.handle {\n width: 4px;\n height: 4px;\n border: 1px solid #fff;\n border-radius: 1px;\n background-color: ${theme.colors.primary};\n transform: translate(-50%, -50%);\n }\n .react-flow__resize-control.handle.left {\n left: 0;\n top: 50%;\n }\n .react-flow__resize-control.handle.right {\n left: 100%;\n top: 50%;\n }\n .react-flow__resize-control.handle.top {\n left: 50%;\n top: 0;\n }\n .react-flow__resize-control.handle.bottom {\n left: 50%;\n top: 100%;\n }\n .react-flow__resize-control.handle.top.left {\n left: 0;\n }\n .react-flow__resize-control.handle.bottom.left {\n left: 0;\n }\n .react-flow__resize-control.handle.top.right {\n left: 100%;\n }\n .react-flow__resize-control.handle.bottom.right {\n left: 100%;\n }\n /* line styles */\n .react-flow__resize-control.line {\n border-color: ${theme.colors.primary};\n border-width: 0;\n border-style: solid;\n }\n .react-flow__resize-control.line.left,\n .react-flow__resize-control.line.right {\n width: 1px;\n transform: translate(-50%, 0);\n top: 0;\n height: 100%;\n }\n .react-flow__resize-control.line.left {\n left: 0;\n border-left-width: 1px;\n }\n .react-flow__resize-control.line.right {\n left: 100%;\n border-right-width: 1px;\n }\n .react-flow__resize-control.line.top,\n .react-flow__resize-control.line.bottom {\n height: 1px;\n transform: translate(0, -50%);\n left: 0;\n width: 100%;\n }\n .react-flow__resize-control.line.top {\n top: 0;\n border-top-width: 1px;\n }\n .react-flow__resize-control.line.bottom {\n border-bottom-width: 1px;\n top: 100%;\n }\n`;\n"],"names":["css","theme"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFlowContext.cjs","sources":["../../../../src/Flow/hooks/useFlowContext.ts"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { HvFlowContext } from \"../FlowContext\";\n\nexport const useFlowContext = () => useContext(HvFlowContext);\n"],"names":["useContext","HvFlowContext"],"mappings":";;;;AAIa,MAAA,iBAAiB,MAAMA,MAAAA,WAAWC,YAAa,aAAA;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFlowNode.cjs","sources":["../../../../src/Flow/hooks/useFlowNode.ts"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\nimport {\n Node,\n Edge,\n ReactFlowState,\n useStore,\n useNodes,\n useEdges,\n} from \"reactflow\";\n\nexport function useFlowNode<T extends Node = Node>(id: string) {\n const nodeSelector = useCallback(\n (state: ReactFlowState) =>\n state.getNodes().find((n: Node): n is T => n.id === id),\n [id]\n );\n return useStore<T | undefined>(nodeSelector);\n}\n\nexport function useFlowNodeInputEdges(id: string) {\n const inputEdgesSelector = useCallback(\n (state: ReactFlowState) => state.edges.filter((e: Edge) => e.target === id),\n [id]\n );\n return useStore(inputEdgesSelector);\n}\n\nexport function useFlowNodeOutputEdges(id: string) {\n const outputEdgesSelector = useCallback(\n (state: ReactFlowState) => state.edges.filter((e: Edge) => e.source === id),\n [id]\n );\n return useStore(outputEdgesSelector);\n}\n\nexport function useFlowNodeEdges(id: string) {\n const edgesSelector = useCallback(\n (state: ReactFlowState) =>\n state.edges.filter((e: Edge) => e.source === id || e.target === id),\n [id]\n );\n return useStore(edgesSelector);\n}\n\nexport function useFlowNodeParents(id: string) {\n const inputEdges = useFlowNodeInputEdges(id);\n const parentNodesSelector = useCallback(\n (state: ReactFlowState) => {\n return inputEdges\n .map((e) => state.getNodes().find((n: Node) => n.id === e.source))\n .filter((n): n is Node => n !== null);\n },\n [inputEdges]\n );\n return useStore(parentNodesSelector);\n}\n\nexport function useFlowInputNodes<T = any>(id: string) {\n const nodes = useNodes();\n const edges = useEdges();\n\n return useMemo(() => {\n return edges\n .filter((e) => e.target === id)\n .map((e) => nodes.find((n) => n.id === e.source))\n .filter((n): n is Node<T> => n !== null);\n }, [edges, id, nodes]);\n}\n\nexport function useFlowOutputNodes<T = any>(id: string) {\n const nodes = useNodes();\n const edges = useEdges();\n\n return useMemo(() => {\n return edges\n .filter((e) => e.source === id)\n .map((e) => nodes.find((n) => n.id === e.target))\n .filter((n): n is Node<T> => n !== null);\n }, [edges, id, nodes]);\n}\n"],"names":["useCallback","useStore","useNodes","useEdges","useMemo"],"mappings":";;;;AAUO,SAAS,YAAmC,IAAY;AAC7D,QAAM,eAAeA,MAAA;AAAA,IACnB,CAAC,UACC,MAAM,WAAW,KAAK,CAAC,MAAoB,EAAE,OAAO,EAAE;AAAA,IACxD,CAAC,EAAE;AAAA,EAAA;AAEL,SAAOC,UAAAA,SAAwB,YAAY;AAC7C;AAEO,SAAS,sBAAsB,IAAY;AAChD,QAAM,qBAAqBD,MAAA;AAAA,IACzB,CAAC,UAA0B,MAAM,MAAM,OAAO,CAAC,MAAY,EAAE,WAAW,EAAE;AAAA,IAC1E,CAAC,EAAE;AAAA,EAAA;AAEL,SAAOC,UAAAA,SAAS,kBAAkB;AACpC;AAEO,SAAS,uBAAuB,IAAY;AACjD,QAAM,sBAAsBD,MAAA;AAAA,IAC1B,CAAC,UAA0B,MAAM,MAAM,OAAO,CAAC,MAAY,EAAE,WAAW,EAAE;AAAA,IAC1E,CAAC,EAAE;AAAA,EAAA;AAEL,SAAOC,UAAAA,SAAS,mBAAmB;AACrC;AAEO,SAAS,iBAAiB,IAAY;AAC3C,QAAM,gBAAgBD,MAAA;AAAA,IACpB,CAAC,UACC,MAAM,MAAM,OAAO,CAAC,MAAY,EAAE,WAAW,MAAM,EAAE,WAAW,EAAE;AAAA,IACpE,CAAC,EAAE;AAAA,EAAA;AAEL,SAAOC,UAAAA,SAAS,aAAa;AAC/B;AAEO,SAAS,mBAAmB,IAAY;AACvC,QAAA,aAAa,sBAAsB,EAAE;AAC3C,QAAM,sBAAsBD,MAAA;AAAA,IAC1B,CAAC,UAA0B;AAClB,aAAA,WACJ,IAAI,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,CAAC,MAAY,EAAE,OAAO,EAAE,MAAM,CAAC,EAChE,OAAO,CAAC,MAAiB,MAAM,IAAI;AAAA,IACxC;AAAA,IACA,CAAC,UAAU;AAAA,EAAA;AAEb,SAAOC,UAAAA,SAAS,mBAAmB;AACrC;AAEO,SAAS,kBAA2B,IAAY;AACrD,QAAM,QAAQC,UAAAA;AACd,QAAM,QAAQC,UAAAA;AAEd,SAAOC,cAAQ,MAAM;AACZ,WAAA,MACJ,OAAO,CAAC,MAAM,EAAE,WAAW,EAAE,EAC7B,IAAI,CAAC,MAAM,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,EAC/C,OAAO,CAAC,MAAoB,MAAM,IAAI;AAAA,EACxC,GAAA,CAAC,OAAO,IAAI,KAAK,CAAC;AACvB;AAEO,SAAS,mBAA4B,IAAY;AACtD,QAAM,QAAQF,UAAAA;AACd,QAAM,QAAQC,UAAAA;AAEd,SAAOC,cAAQ,MAAM;AACZ,WAAA,MACJ,OAAO,CAAC,MAAM,EAAE,WAAW,EAAE,EAC7B,IAAI,CAAC,MAAM,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,EAC/C,OAAO,CAAC,MAAoB,MAAM,IAAI;AAAA,EACxC,GAAA,CAAC,OAAO,IAAI,KAAK,CAAC;AACvB;;;;;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFlowNodeMeta.cjs","sources":["../../../../src/Flow/hooks/useFlowNodeMeta.ts"],"sourcesContent":["import { useNodeMetaRegistry } from \"../FlowContext/NodeMetaContext\";\n\nexport function useFlowNodeMeta(id: string) {\n const { registry } = useNodeMetaRegistry();\n\n return registry[id];\n}\n"],"names":["useNodeMetaRegistry"],"mappings":";;;AAEO,SAAS,gBAAgB,IAAY;AACpC,QAAA,EAAE,aAAaA,gBAAAA;AAErB,SAAO,SAAS,EAAE;AACpB;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DefaultNavigation.cjs","sources":["../../../../src/StepNavigation/DefaultNavigation/DefaultNavigation.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvStep, HvStepProps } from \"./Step\";\nimport { getColor, stepSizes } from \"./utils\";\n\nexport type ComponentChildProps = {\n stepsWidth: number;\n navWidth: number;\n separatorValues: {\n minWidth: number;\n maxWidth: number;\n getColor: (state: HvStepProps[\"state\"], activeTheme: HvTheme) => any;\n height: number;\n };\n stepValues: {\n minSize: number;\n maxSize: number;\n StepComponent: React.ComponentType<HvStepProps>;\n };\n};\n\nexport interface HvDefaultNavigationProps\n extends Omit<HvBaseProps, \"children\"> {\n /** Number of steps to show on the component. */\n numSteps: number;\n /** Sets one of the standard sizes of the steps. */\n stepSize: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Returns a `ReactNode` of the titles container. */\n getTitles: (\n getTitleProps?: (params: {\n state: HvStepProps[\"state\"];\n rawTitle: string;\n number: number;\n }) => { variant?: string; title?: string }\n ) => ReactNode;\n /** Returns dynamic width values of the component (width, titleWidth, separatorWidth). */\n getDynamicValues: (stepsWidth: number) => {\n width: number;\n titleWidth: number;\n separatorWidth: number;\n };\n /** Component to render Step Navigation with props = {separatorValues, stepValues, stepsWidth} */\n children: React.FunctionComponent<ComponentChildProps>;\n}\n\nexport const HvDefaultNavigation = ({\n numSteps,\n stepSize,\n getTitles,\n getDynamicValues,\n className,\n children,\n ...other\n}: HvDefaultNavigationProps) => {\n const { activeTheme } = useTheme();\n\n // step values\n const { container: maxSize, avatar: minSize } = stepSizes[stepSize];\n const StepComponent = HvStep;\n //\n\n const stepsWidth = maxSize + minSize * (numSteps - 1);\n const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);\n\n // separator values\n const maxWidth = Math.max(titleWidth - minSize, separatorWidth);\n const minWidth = Math.max(\n titleWidth - (maxSize + minSize) * 0.5,\n separatorWidth\n );\n //\n\n const Steps = children;\n\n const titles = getTitles(({ state }) => ({\n variant: \"label\",\n titleWidth,\n titleDisabled: state === \"Disabled\",\n }));\n\n return (\n <div {...other}>\n <Steps\n {...{\n stepsWidth,\n navWidth: width,\n separatorValues: {\n minWidth,\n maxWidth,\n getColor,\n height: activeTheme?.stepNavigation.defaultSeparatorHeight || 0,\n },\n stepValues: {\n minSize,\n maxSize,\n StepComponent,\n },\n }}\n />\n {titles}\n </div>\n );\n};\n"],"names":["useTheme","stepSizes","HvStep","jsxs","jsx","getColor"],"mappings":";;;;;;AAkDO,MAAM,sBAAsB,CAAC;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAgC;AACxB,QAAA,EAAE,gBAAgBA,eAAAA;AAGxB,QAAM,EAAE,WAAW,SAAS,QAAQ,YAAYC,MAAAA,UAAU,QAAQ;AAClE,QAAM,gBAAgBC,KAAAA;AAGhB,QAAA,aAAa,UAAU,WAAW,WAAW;AACnD,QAAM,EAAE,OAAO,YAAY,eAAe,IAAI,iBAAiB,UAAU;AAGzE,QAAM,WAAW,KAAK,IAAI,aAAa,SAAS,cAAc;AAC9D,QAAM,WAAW,KAAK;AAAA,IACpB,cAAc,UAAU,WAAW;AAAA,IACnC;AAAA,EAAA;AAIF,QAAM,QAAQ;AAEd,QAAM,SAAS,UAAU,CAAC,EAAE,aAAa;AAAA,IACvC,SAAS;AAAA,IACT;AAAA,IACA,eAAe,UAAU;AAAA,EACzB,EAAA;AAGA,SAAAC,2BAAA,KAAC,OAAK,EAAA,GAAG,OACP,UAAA;AAAA,IAAAC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,UACF;AAAA,UACA,UAAU;AAAA,UACV,iBAAiB;AAAA,YACf;AAAA,YACA;AAAA,YAAA,UACAC,MAAA;AAAA,YACA,QAAQ,aAAa,eAAe,0BAA0B;AAAA,UAChE;AAAA,UACA,YAAY;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,IACC;AAAA,EACH,EAAA,CAAA;AAEJ;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Step.cjs","sources":["../../../../../src/StepNavigation/DefaultNavigation/Step/Step.tsx"],"sourcesContent":["import {\n Level0Good,\n Level3Bad,\n HourGlass,\n} from \"@hitachivantara/uikit-react-icons\";\nimport {\n HvAvatarSize,\n HvButtonProps,\n HvBaseProps,\n ExtractNames,\n HvAvatar,\n HvButton,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { getColor, getSemantic } from \"../utils\";\nimport { useClasses } from \"./Step.styles\";\n\ntype HvStepClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvStepProps\n extends Pick<HvButtonProps, \"onClick\">,\n Omit<HvBaseProps, \"onClick\"> {\n /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvStepClasses;\n /** State of the step. Values = {\"Pending\", \"Failed\", \"Completed\", \"Current\", \"Disabled\", \"Enabled\"} */\n state:\n | \"Pending\"\n | \"Failed\"\n | \"Completed\"\n | \"Current\"\n | \"Disabled\"\n | \"Enabled\";\n /** Title of the step. */\n title: string;\n /** Sets one of the standard sizes of the step */\n size?: HvAvatarSize;\n /** Number of the step. */\n number?: number;\n /**\n * Define if a step is disabled/enabled.\n * If this property is not defined and the step is on state \"Disabled\", the step component will be disabled\n */\n disabled?: boolean;\n}\n\n/**\n * Step element of \"Default\" Step Navigation root component\n */\nexport const HvStep = ({\n className,\n classes: classesProp,\n state,\n title,\n onClick,\n disabled,\n size = \"md\",\n number = 1,\n}: HvStepProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const iconSize = {\n xs: \"XS\",\n sm: \"XS\",\n md: \"S\",\n ml: \"M\",\n xl: \"M\",\n }[size];\n\n const squareL = {\n Pending: 16,\n Failed: 24,\n Completed: 24,\n }[state];\n\n const svgSize = {\n xs: squareL - 8,\n sm: squareL,\n md: squareL + 8,\n lg: squareL + 16,\n xl: squareL + 24,\n }[size];\n\n const backgroundColor = getColor(state);\n\n const color = state === \"Pending\" ? \"atmo2\" : undefined;\n const semantic = state !== \"Pending\" ? getSemantic(state) : undefined;\n const status = state === \"Current\" ? \"secondary_60\" : undefined;\n\n const IconComponent = {\n Pending: HourGlass,\n Failed: Level3Bad,\n Completed: Level0Good,\n }[state];\n\n return (\n <div\n className={cx(\n classes.root,\n {\n [classes.notCurrent]: state !== \"Current\",\n },\n className\n )}\n >\n <HvButton\n className={cx(classes.ghost, {\n [classes.ghostDisabled]: state === \"Current\",\n })}\n aria-label={`${title}`}\n icon\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n <HvAvatar\n className={cx(classes.avatar, classes[size])}\n backgroundColor={backgroundColor}\n status={status}\n size={size}\n >\n {IconComponent ? (\n <IconComponent\n color={color}\n semantic={semantic}\n width={svgSize}\n height={svgSize}\n iconSize={iconSize}\n />\n ) : (\n number\n )}\n </HvAvatar>\n </HvButton>\n </div>\n );\n};\n"],"names":["useClasses","getColor","getSemantic","HourGlass","Level3Bad","Level0Good","jsx","HvButton","HvAvatar"],"mappings":";;;;;;;AAgDO,MAAM,SAAS,CAAC;AAAA,EACrB;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,SAAS;AACX,MAAmB;AACjB,QAAM,EAAE,SAAS,GAAG,IAAIA,uBAAW,WAAW;AAE9C,QAAM,WAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAEN,QAAM,UAAU;AAAA,IACd,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,KAAK;AAEP,QAAM,UAAU;AAAA,IACd,IAAI,UAAU;AAAA,IACd,IAAI;AAAA,IACJ,IAAI,UAAU;AAAA,IACd,IAAI,UAAU;AAAA,IACd,IAAI,UAAU;AAAA,IACd,IAAI;AAEA,QAAA,kBAAkBC,eAAS,KAAK;AAEhC,QAAA,QAAQ,UAAU,YAAY,UAAU;AAC9C,QAAM,WAAW,UAAU,YAAYC,MAAA,YAAY,KAAK,IAAI;AACtD,QAAA,SAAS,UAAU,YAAY,iBAAiB;AAEtD,QAAM,gBAAgB;AAAA,IACpB,SAASC,gBAAA;AAAA,IACT,QAAQC,gBAAA;AAAA,IACR,WAAWC,gBAAA;AAAA,IACX,KAAK;AAGL,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,UAAU,GAAG,UAAU;AAAA,QAClC;AAAA,QACA;AAAA,MACF;AAAA,MAEA,UAAAA,2BAAA;AAAA,QAACC,eAAA;AAAA,QAAA;AAAA,UACC,WAAW,GAAG,QAAQ,OAAO;AAAA,YAC3B,CAAC,QAAQ,aAAa,GAAG,UAAU;AAAA,UAAA,CACpC;AAAA,UACD,cAAY,GAAG,KAAK;AAAA,UACpB,MAAI;AAAA,UACJ,oBAAoB;AAAA,UACpB,UAAU,YAAY,CAAC,WAAW,UAAU,EAAE,SAAS,KAAK;AAAA,UAC5D;AAAA,UAEA,UAAAD,2BAAA;AAAA,YAACE,eAAA;AAAA,YAAA;AAAA,cACC,WAAW,GAAG,QAAQ,QAAQ,QAAQ,IAAI,CAAC;AAAA,cAC3C;AAAA,cACA;AAAA,cACA;AAAA,cAEC,UACC,gBAAAF,2BAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC;AAAA,kBACA;AAAA,kBACA,OAAO;AAAA,kBACP,QAAQ;AAAA,kBACR;AAAA,gBAAA;AAAA,cAAA,IAGF;AAAA,YAAA;AAAA,UAEJ;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Step.styles.cjs","sources":["../../../../../src/StepNavigation/DefaultNavigation/Step/Step.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvStep\", {\n root: {},\n ghost: {\n \"&:hover\": {\n backgroundColor: \"transparent\",\n },\n \"&$ghostDisabled\": {\n cursor: \"default\",\n },\n \"&$ghostDisabled&:hover\": {\n cursor: \"default\",\n },\n },\n ghostDisabled: {},\n notCurrent: { margin: \"-8px\" },\n xs: {},\n sm: {},\n md: {},\n lg: {},\n xl: {},\n avatar: {\n \"&$xs\": {\n fontSize: \"0.625rem\",\n },\n \"&$sm\": {\n fontSize: \"1rem\",\n },\n \"&$md\": {\n fontSize: \"1.5rem\",\n },\n \"&$lg\": {\n fontSize: \"2rem\",\n },\n \"&$xl\": {\n fontSize: \"2.5rem\",\n },\n },\n});\n"],"names":["createClasses"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,UAAU;AAAA,EACnE,MAAM,CAAC;AAAA,EACP,OAAO;AAAA,IACL,WAAW;AAAA,MACT,iBAAiB;AAAA,IACnB;AAAA,IACA,mBAAmB;AAAA,MACjB,QAAQ;AAAA,IACV;AAAA,IACA,0BAA0B;AAAA,MACxB,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,YAAY,EAAE,QAAQ,OAAO;AAAA,EAC7B,IAAI,CAAC;AAAA,EACL,IAAI,CAAC;AAAA,EACL,IAAI,CAAC;AAAA,EACL,IAAI,CAAC;AAAA,EACL,IAAI,CAAC;AAAA,EACL,QAAQ;AAAA,IACN,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,EACF;AACF,CAAC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.cjs","sources":["../../../../src/StepNavigation/DefaultNavigation/utils.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport type { HvStepProps } from \"./Step\";\n\nexport const getColor = (state: HvStepProps[\"state\"]) =>\n ({\n Pending: theme.colors.warning ?? \"warning\",\n Failed: theme.colors.negative ?? \"negative\",\n Completed: theme.colors.positive ?? \"positive\",\n Current: theme.colors.secondary ?? \"secondary\",\n Disabled: theme.colors.secondary_60 ?? \"secondary_60\",\n Enabled: theme.colors.secondary ?? \"secondary\",\n }[state]);\n\nexport const getSemantic = (state: HvStepProps[\"state\"]) =>\n ({\n Pending: \"warning\",\n Failed: \"negative\",\n Completed: \"positive\",\n Current: \"secondary\",\n Disabled: \"secondary_60\",\n Enabled: \"secondary\",\n }[state]);\n\nconst EXTRA_SMALL = { container: 32, avatar: 24 };\nconst SMALL = { container: 40, avatar: 32 };\nconst MEDIUM = { container: 48, avatar: 40 };\nconst LARGE = { container: 60, avatar: 52 };\nconst EXTRA_LARGE = { container: 96, avatar: 88 };\n\nexport const stepSizes = {\n xs: EXTRA_SMALL,\n sm: SMALL,\n md: MEDIUM,\n lg: LARGE,\n xl: EXTRA_LARGE,\n};\n"],"names":["theme"],"mappings":";;;AAIa,MAAA,WAAW,CAAC,WACtB;AAAA,EACC,SAASA,YAAM,MAAA,OAAO,WAAW;AAAA,EACjC,QAAQA,YAAM,MAAA,OAAO,YAAY;AAAA,EACjC,WAAWA,YAAM,MAAA,OAAO,YAAY;AAAA,EACpC,SAASA,YAAM,MAAA,OAAO,aAAa;AAAA,EACnC,UAAUA,YAAM,MAAA,OAAO,gBAAgB;AAAA,EACvC,SAASA,YAAM,MAAA,OAAO,aAAa;AACrC,GAAE,KAAK;AAEI,MAAA,cAAc,CAAC,WACzB;AAAA,EACC,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,SAAS;AAAA,EACT,UAAU;AAAA,EACV,SAAS;AACX,GAAE,KAAK;AAET,MAAM,cAAc,EAAE,WAAW,IAAI,QAAQ,GAAG;AAChD,MAAM,QAAQ,EAAE,WAAW,IAAI,QAAQ,GAAG;AAC1C,MAAM,SAAS,EAAE,WAAW,IAAI,QAAQ,GAAG;AAC3C,MAAM,QAAQ,EAAE,WAAW,IAAI,QAAQ,GAAG;AAC1C,MAAM,cAAc,EAAE,WAAW,IAAI,QAAQ,GAAG;AAEzC,MAAM,YAAY;AAAA,EACvB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dot.cjs","sources":["../../../../../src/StepNavigation/SimpleNavigation/Dot/Dot.tsx"],"sourcesContent":["import {\n ExtractNames,\n HvBaseProps,\n HvButton,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvStepProps } from \"../../DefaultNavigation\";\nimport { getColor, dotSizes } from \"../utils\";\nimport { staticClasses, useClasses } from \"./Dot.styles\";\n\nexport { staticClasses as dotClasses };\n\nexport type HvDotClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDotProps\n extends Pick<\n HvStepProps,\n \"size\" | \"title\" | \"state\" | \"onClick\" | \"disabled\"\n >,\n Omit<HvBaseProps, \"title\" | \"onClick\"> {\n /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvDotClasses;\n}\n\nexport const HvDot = ({\n classes: classesProp,\n className,\n state,\n title,\n size = \"sm\",\n onClick,\n disabled,\n}: HvDotProps) => {\n const { classes, cx, css } = useClasses(classesProp);\n\n const dotSize = dotSizes[size] * (state === \"Current\" ? 1.5 : 1);\n\n return (\n <HvButton\n className={cx(\n css({\n backgroundColor: getColor(state),\n width: dotSize,\n height: dotSize,\n \"&:hover, &:disabled\": {\n backgroundColor: getColor(state),\n },\n }),\n classes.root,\n {\n [classes.active]: state === \"Current\",\n [classes.ghostDisabled]:\n disabled ?? [\"Current\", \"Disabled\"].includes(state),\n },\n className\n )}\n aria-label={`${title}`}\n icon\n overrideIconColors={false}\n disabled={disabled ?? [\"Current\", \"Disabled\"].includes(state)}\n onClick={onClick}\n >\n {[]}\n </HvButton>\n );\n};\n"],"names":["useClasses","dotSizes","jsx","HvButton","getColor"],"mappings":";;;;;;AAwBO,MAAM,QAAQ,CAAC;AAAA,EACpB,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AACF,MAAkB;AAChB,QAAM,EAAE,SAAS,IAAI,IAAI,IAAIA,WAAAA,WAAW,WAAW;AAEnD,QAAM,UAAUC,MAAS,SAAA,IAAI,KAAK,UAAU,YAAY,MAAM;AAG5D,SAAAC,2BAAA;AAAA,IAACC,eAAA;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,IAAI;AAAA,UACF,iBAAiBC,eAAS,KAAK;AAAA,UAC/B,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,uBAAuB;AAAA,YACrB,iBAAiBA,eAAS,KAAK;AAAA,UACjC;AAAA,QAAA,CACD;AAAA,QACD,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,MAAM,GAAG,UAAU;AAAA,UAC5B,CAAC,QAAQ,aAAa,GACpB,YAAY,CAAC,WAAW,UAAU,EAAE,SAAS,KAAK;AAAA,QACtD;AAAA,QACA;AAAA,MACF;AAAA,MACA,cAAY,GAAG,KAAK;AAAA,MACpB,MAAI;AAAA,MACJ,oBAAoB;AAAA,MACpB,UAAU,YAAY,CAAC,WAAW,UAAU,EAAE,SAAS,KAAK;AAAA,MAC5D;AAAA,MAEC,UAAC,CAAA;AAAA,IAAA;AAAA,EAAA;AAGR;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dot.styles.cjs","sources":["../../../../../src/StepNavigation/SimpleNavigation/Dot/Dot.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDot\", {\n root: { borderRadius: \"50%\", zIndex: 1 },\n active: {},\n ghostDisabled: {},\n});\n"],"names":["createClasses"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,SAAS;AAAA,EAClE,MAAM,EAAE,cAAc,OAAO,QAAQ,EAAE;AAAA,EACvC,QAAQ,CAAC;AAAA,EACT,eAAe,CAAC;AAClB,CAAC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SimpleNavigation.cjs","sources":["../../../../src/StepNavigation/SimpleNavigation/SimpleNavigation.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport {\n HvBaseProps,\n HvTheme,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvDot, HvDotProps } from \"./Dot\";\nimport { getColor, dotSizes } from \"./utils\";\n\nexport type ComponentChildProps = {\n stepsWidth: number;\n navWidth: number;\n separatorValues: {\n minWidth: number;\n maxWidth: number;\n getColor: (state: HvDotProps[\"state\"], activeTheme: HvTheme) => any;\n height: number;\n };\n stepValues: {\n minSize: number;\n maxSize: number;\n StepComponent: React.ComponentType<HvDotProps>;\n };\n};\n\nexport interface HvSimpleNavigationProps extends Omit<HvBaseProps, \"children\"> {\n /** Sets one of the standard sizes of the steps. */\n stepSize?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Number of steps to show on the component. */\n numSteps: number;\n /** Returns a `ReactNode` of the titles container. */\n getTitles: (\n getTitleProps?: (params: {\n state: HvDotProps[\"state\"];\n rawTitle: string;\n number: number;\n }) => { variant: string; title: string }\n ) => ReactNode;\n /** Returns dynamic width values of the component (width, titleWidth, separatorWidth). */\n getDynamicValues: (stepsWidth: number) => {\n width: number;\n titleWidth: number;\n separatorWidth: number;\n };\n /** Component to render Step Navigation with props = {separatorValues, stepValues, stepsWidth} */\n children: React.FunctionComponent<ComponentChildProps>;\n}\n\nexport const HvSimpleNavigation = ({\n numSteps,\n stepSize = \"sm\",\n getTitles,\n getDynamicValues,\n children,\n ...others\n}: HvSimpleNavigationProps) => {\n const { activeTheme } = useTheme();\n\n // step values\n const dotSize = dotSizes[stepSize];\n const StepComponent = HvDot;\n //\n\n const stepsWidth = (numSteps + 0.5) * dotSize;\n const { width, titleWidth, separatorWidth } = getDynamicValues(stepsWidth);\n\n // separator values\n const maxWidth = Math.max(titleWidth - dotSize, separatorWidth);\n const minWidth = Math.max(titleWidth - dotSize * 1.25, separatorWidth);\n //\n\n const Steps = children;\n\n const titles = getTitles(({ rawTitle, number }) => ({\n variant: \"label\",\n title: `${number}. ${rawTitle}`,\n titleWidth,\n }));\n\n return (\n <div {...others}>\n {titles}\n <Steps\n {...{\n stepsWidth,\n navWidth: width,\n separatorValues: {\n minWidth,\n maxWidth,\n getColor,\n height: activeTheme?.stepNavigation.simpleSeparatorHeight || 0,\n },\n stepValues: {\n minSize: dotSize,\n maxSize: 1.5 * dotSize,\n StepComponent,\n },\n }}\n />\n </div>\n );\n};\n"],"names":["useTheme","dotSizes","HvDot","jsxs","jsx","getColor"],"mappings":";;;;;;AAiDO,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA+B;AACvB,QAAA,EAAE,gBAAgBA,eAAAA;AAGlB,QAAA,UAAUC,eAAS,QAAQ;AACjC,QAAM,gBAAgBC,IAAAA;AAGhB,QAAA,cAAc,WAAW,OAAO;AACtC,QAAM,EAAE,OAAO,YAAY,eAAe,IAAI,iBAAiB,UAAU;AAGzE,QAAM,WAAW,KAAK,IAAI,aAAa,SAAS,cAAc;AAC9D,QAAM,WAAW,KAAK,IAAI,aAAa,UAAU,MAAM,cAAc;AAGrE,QAAM,QAAQ;AAEd,QAAM,SAAS,UAAU,CAAC,EAAE,UAAU,cAAc;AAAA,IAClD,SAAS;AAAA,IACT,OAAO,GAAG,MAAM,KAAK,QAAQ;AAAA,IAC7B;AAAA,EACA,EAAA;AAGA,SAAAC,2BAAA,KAAC,OAAK,EAAA,GAAG,QACN,UAAA;AAAA,IAAA;AAAA,IACDC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,UACF;AAAA,UACA,UAAU;AAAA,UACV,iBAAiB;AAAA,YACf;AAAA,YACA;AAAA,YAAA,UACAC,MAAA;AAAA,YACA,QAAQ,aAAa,eAAe,yBAAyB;AAAA,UAC/D;AAAA,UACA,YAAY;AAAA,YACV,SAAS;AAAA,YACT,SAAS,MAAM;AAAA,YACf;AAAA,UACF;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.cjs","sources":["../../../../src/StepNavigation/SimpleNavigation/utils.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvStepProps } from \"../DefaultNavigation\";\n\nexport const dotSizes = {\n xs: 8,\n sm: 10,\n md: 12,\n lg: 14,\n xl: 16,\n};\n\nexport const getColor = (state: HvStepProps[\"state\"]) =>\n state === \"Disabled\" ? theme.colors.secondary_60 : theme.colors.secondary;\n"],"names":["theme"],"mappings":";;;AAIO,MAAM,WAAW;AAAA,EACtB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEa,MAAA,WAAW,CAAC,UACvB,UAAU,aAAaA,YAAM,MAAA,OAAO,eAAeA,YAAA,MAAM,OAAO;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StepNavigation.cjs","sources":["../../../src/StepNavigation/StepNavigation.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport styled from \"@emotion/styled\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport {\n HvBaseProps,\n HvBreakpoints,\n useTheme,\n useWidth,\n HvBox,\n HvTooltip,\n HvTypography,\n ExtractNames,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport {\n HvDefaultNavigation,\n HvDefaultNavigationProps,\n HvStepProps,\n} from \"./DefaultNavigation\";\nimport { HvSimpleNavigation } from \"./SimpleNavigation\";\nimport { SEPARATOR_WIDTH, TITLE_MARGIN, TITLE_WIDTH } from \"./utils\";\nimport { staticClasses, useClasses } from \"./StepNavigation.styles\";\n\nexport { staticClasses as stepNavigationClasses };\n\nexport type HvStepNavigationClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvStepNavigationProps extends HvBaseProps {\n /** Type of step navigation. Values = {\"Simple\", \"Default\"} */\n type?: \"Simple\" | \"Default\";\n /** Steps to show on the component. */\n steps: Array<\n Pick<\n HvStepProps,\n \"state\" | \"title\" | \"onClick\" | \"className\" | \"disabled\"\n > & {\n /** Class names to override styles on the separator component after the step. */\n separatorClassName?: string;\n /** Class names to override styles on the title component above the step. */\n titleClassName?: string;\n }\n >;\n /** Sets one of the standard sizes of the steps. */\n stepSize?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Width of the component element on each breakpoint screen resolution. */\n width?: { [breakpoint in HvBreakpoints]?: number };\n /** Defines either show a title or only a tooltip on each step component. */\n showTitles?: boolean;\n /** A Jss Object used to override or extend the styles applied to the empty state StepNavigation. */\n classes?: HvStepNavigationClasses;\n}\n\n/**\n * Navigation page with steps.\n *\n * You need to define the <b>steps<b/> displayed on the component so that itself can be drawn on the UI.\n * On each step, you need to define a <b>state</b> - 'Pending', 'Failed', 'Completed', 'Current', 'Disabled' -\n * and a <b>title</b> to be shown as a tooltip or a text above of the step. You can also:\n * * Define a <b>className</b> on each step element;\n * * Define a <b>separatorClassName</b> to specify a className for the separator element. The default height\n * values of the separator element are 2px/3px on 'Simple'/'Default' layouts respectively;\n * * Define a <b>titleClassName</b> to specify a className for the title above each step element.\n *\n * For the root element, you can:\n * * Define a <b>className</b>;\n * * Choose a <b>type</b> of layout: 'Simple' or 'Default';\n * * Choose the <b>stepSize</b> of the step component: \"xs\", \"sm\", \"md\", \"lg\", \"xl\". The default size will be\n * correspondent to the current media breakpoint;\n * * Choose either you want to <b>showTitles</b> near to each step component or a tooltip on hover;\n * * Define a <b>width</b> of the component. If you don't define any value and the step component has no title\n * displayed above, the width of the separator element will be 100px.\n * If the step component has titles, each one will have 215px of width by default.\n */\nexport const HvStepNavigation = ({\n className,\n classes: classesProp,\n width,\n steps,\n stepSize,\n showTitles,\n type = \"Default\",\n \"aria-label\": ariaLabel,\n ...others\n}: HvStepNavigationProps) => {\n const { classes, css, cx } = useClasses(classesProp);\n\n const { activeTheme } = useTheme();\n\n // current breakpoint 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n const breakpoint = useWidth();\n // step configurations\n const stepSizeKey =\n stepSize ?? ([\"xs\", \"sm\"].includes(breakpoint) ? \"sm\" : \"md\");\n const hasTitles = showTitles ?? ![\"xs\", \"sm\"].includes(breakpoint);\n\n const styledLi = (containerSize) =>\n styled(\"li\")({\n width: containerSize,\n height: containerSize,\n });\n\n const styledDiv = (containerSize) =>\n styled(\"div\")({\n width: containerSize,\n height: containerSize,\n });\n\n const styledSeparatorElement = (\n title,\n separatorClassName,\n separatorHeight,\n separatorWidth,\n backgroundColor\n ) => {\n const widthValue =\n separatorWidth -\n 2 *\n Number(\n (activeTheme?.stepNavigation.separatorMargin || \"0px\").replace(\n \"px\",\n \"\"\n )\n );\n\n return (\n <li\n aria-hidden\n key={`separator-${title}`}\n className={cx(\n css({\n height: separatorHeight,\n width: widthValue,\n backgroundColor,\n margin: `0 ${theme.stepNavigation.separatorMargin}`,\n }),\n classes.separator\n )}\n >\n <div className={separatorClassName} />\n </li>\n );\n };\n\n const drawItems = ({\n separatorValues: { minWidth, maxWidth, getColor, height },\n stepValues: { minSize, maxSize, StepComponent },\n }: any) => {\n const items = steps.reduce<ReactNode[]>(\n (acc, { state, title, separatorClassName, ...props }, index): any => {\n const containerSize = state === \"Current\" ? maxSize : minSize;\n const StepContainer = styledLi(containerSize);\n const Step = styledDiv(Math.max(containerSize, 30));\n const stepProps = {\n ...{\n size: stepSizeKey,\n state,\n title,\n number: index + 1,\n ...props,\n },\n };\n const stepElement = (\n <StepContainer key={`step-${title}`} className={classes.li}>\n {hasTitles ? (\n <StepComponent\n key={`step-${title}`}\n aria-label={`${title}`}\n {...stepProps}\n />\n ) : (\n <HvTooltip\n placement=\"bottom\"\n title={<HvTypography>{`${index + 1}. ${title}`}</HvTypography>}\n >\n <div>\n <Step className={classes.li}>\n <StepComponent aria-label={`${title}`} {...stepProps} />\n </Step>\n </div>\n </HvTooltip>\n )}\n </StepContainer>\n );\n if (index < steps.length - 1) {\n const separatorElement = styledSeparatorElement(\n title,\n separatorClassName,\n height,\n [steps[index + 1].state, state].includes(\"Current\")\n ? minWidth\n : maxWidth,\n getColor(\n steps[index + 1].state === \"Disabled\" ? \"Disabled\" : state,\n theme\n )\n );\n return [...acc, stepElement, separatorElement];\n }\n return [...acc, stepElement];\n },\n []\n );\n\n return <ol className={classes.ol}>{items}</ol>;\n };\n\n const getDynamicValues: HvDefaultNavigationProps[\"getDynamicValues\"] = (\n stepsWidth\n ) => {\n const themeBreakpoints = activeTheme?.breakpoints.values || {};\n const maxWidth =\n width?.[breakpoint] ??\n Math.max(\n Number(hasTitles) * (TITLE_WIDTH + TITLE_MARGIN) * steps.length -\n TITLE_MARGIN,\n SEPARATOR_WIDTH * (steps.length - 1) + stepsWidth\n );\n const next = Object.keys(themeBreakpoints).find((_, index, self) =>\n index - 1 >= 0 ? self[index - 1] === breakpoint : false\n );\n const navWidth = Math.min(\n maxWidth,\n next ? themeBreakpoints[next] : maxWidth\n );\n const titleWidth =\n Number(hasTitles) * Math.ceil((navWidth + TITLE_MARGIN) / steps.length);\n const separatorWidth =\n Number(!hasTitles) *\n Math.ceil((navWidth - stepsWidth) / (steps.length - 1));\n return { width: navWidth, titleWidth, separatorWidth };\n };\n\n const getTitles = (getTitleProps) =>\n hasTitles ? (\n <div className={classes.titles}>\n {steps.map(({ title: rawTitle, state, titleClassName }, index) => {\n const {\n variant = \"label\",\n title = rawTitle,\n titleWidth = 0,\n titleDisabled = false,\n } = getTitleProps({\n state,\n rawTitle,\n number: index + 1,\n });\n\n return (\n <HvTypography\n variant={variant}\n className={cx(\n css({\n textAlign: \"center\",\n width: titleWidth - TITLE_MARGIN,\n marginRight: TITLE_MARGIN,\n }),\n titleClassName\n )}\n disabled={titleDisabled}\n key={title}\n >\n {title}\n </HvTypography>\n );\n })}\n </div>\n ) : null;\n\n const StepNavigation = {\n Default: HvDefaultNavigation,\n Simple: HvSimpleNavigation,\n }[type];\n\n return (\n <StepNavigation\n numSteps={steps.length}\n stepSize={stepSizeKey}\n getTitles={getTitles}\n getDynamicValues={getDynamicValues}\n className={cx(classes.root, className)}\n {...others}\n >\n {({ stepsWidth, navWidth, ...itemsProps }) => (\n <HvBox\n component=\"nav\"\n style={{\n width: `${navWidth}px`,\n margin: 0,\n }}\n aria-label={ariaLabel}\n >\n {drawItems(itemsProps)}\n </HvBox>\n )}\n </StepNavigation>\n );\n};\n"],"names":["useClasses","useTheme","useWidth","styled","jsx","theme","HvTooltip","HvTypography","TITLE_WIDTH","TITLE_MARGIN","SEPARATOR_WIDTH","HvDefaultNavigation","HvSimpleNavigation","HvBox"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StepNavigation.styles.cjs","sources":["../../../src/StepNavigation/StepNavigation.styles.tsx"],"sourcesContent":["import { createClasses } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvStepNavigation\", {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n },\n titles: {\n marginTop: 8,\n display: \"flex\",\n },\n ol: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n flexWrap: \"wrap\",\n padding: 0,\n listStyle: \"none\",\n },\n li: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n separator: {\n userSelect: \"none\",\n \"& > div\": {\n display: \"flex\",\n },\n },\n});\n"],"names":["createClasses"],"mappings":";;;AAEO,MAAM,EAAE,eAAe,eAAeA,eAAAA,cAAc,oBAAoB;AAAA,EAC7E,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,eAAe;AAAA,EACjB;AAAA,EACA,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,SAAS;AAAA,EACX;AAAA,EACA,IAAI;AAAA,IACF,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,SAAS;AAAA,IACT,WAAW;AAAA,EACb;AAAA,EACA,IAAI;AAAA,IACF,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,EAClB;AAAA,EACA,WAAW;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,MACT,SAAS;AAAA,IACX;AAAA,EACF;AACF,CAAC;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.cjs","sources":["../../../src/StepNavigation/utils.ts"],"sourcesContent":["const TITLE_MARGIN = 20;\nconst TITLE_WIDTH = 215;\nconst STEP_MARGIN = 20;\nconst SEPARATOR_WIDTH = 100;\n\nexport { STEP_MARGIN, TITLE_MARGIN, TITLE_WIDTH, SEPARATOR_WIDTH };\n"],"names":[],"mappings":";;AAAA,MAAM,eAAe;AACrB,MAAM,cAAc;AAEpB,MAAM,kBAAkB;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Wizard.cjs","sources":["../../../src/Wizard/Wizard.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvBaseProps,\n HvDialogProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { ModalProps } from \"@mui/material/Modal\";\n\nimport { HvStepNavigationProps } from \"../StepNavigation\";\nimport { HvWizardContent } from \"./WizardContent\";\nimport { HvWizardContext, HvWizardTabs } from \"./WizardContext\";\nimport { HvWizardTitle, HvWizardTitleProps } from \"./WizardTitle\";\nimport { HvWizardActions, HvWizardActionsProps } from \"./WizardActions\";\nimport { HvWizardContainer } from \"./WizardContainer\";\n\nimport { staticClasses, useClasses } from \"./Wizard.styles\";\n\nexport { staticClasses as wizardClasses };\n\nexport type HvWizardClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvWizardProps\n extends HvBaseProps,\n Pick<HvDialogProps, \"maxWidth\" | \"fullWidth\"> {\n /** Current state of the Wizard. */\n open: boolean;\n /** Function executed on close. */\n onClose: ModalProps[\"onClose\"];\n /** Function executed on submit. */\n handleSubmit: (context: HvWizardTabs) => void;\n /** Title for the wizard. */\n title?: string;\n /** An object containing all the labels for the wizard. */\n labels?: HvWizardActionsProps[\"labels\"] & HvWizardTitleProps[\"labels\"];\n /** Shows the summary button. */\n hasSummary?: boolean;\n /** The content of the summary. */\n summaryContent?: React.ReactNode;\n /** Enables the skip button. */\n skippable?: boolean;\n /** Forces minimum height to the component. */\n fixedHeight?: boolean;\n /** Whether the loading animation is shown. */\n loading?: boolean;\n /** Custom object to define type, size and width of the StepNavigation component */\n customStep?: Pick<HvStepNavigationProps, \"type\" | \"stepSize\" | \"width\">;\n /** A Jss Object used to override or extend the styles applied to the empty state Wizard. */\n classes?: HvWizardClasses;\n}\n\nexport const HvWizard = ({\n className,\n children,\n onClose,\n handleSubmit,\n title,\n open,\n skippable = true,\n loading = false,\n hasSummary = false,\n summaryContent,\n labels = {\n cancel: \"Cancel\",\n next: \"Next\",\n previous: \"Previous\",\n skip: \"Skip\",\n submit: \"Submit\",\n summary: \"Summary\",\n },\n fixedHeight = false,\n customStep,\n classes: classesProp,\n ...others\n}: HvWizardProps) => {\n const { classes } = useClasses(classesProp);\n\n const [context, setContext] = useState<HvWizardTabs>({});\n const [summary, setSummary] = useState(false);\n const [tab, setTab] = useState(0);\n\n const handleClose = useCallback(\n (evt, reason) => {\n if (reason !== \"backdropClick\") {\n onClose?.(evt, reason);\n }\n },\n [onClose]\n );\n\n // on unmount\n useEffect(() => {\n return () => {\n if (!open) {\n setContext((c) =>\n Object.entries(c).reduce(\n (acc, [key, child]) => ({\n ...acc,\n [+key]: {\n ...child,\n touched: false,\n },\n }),\n {} as HvWizardTabs\n )\n );\n setTab(0);\n }\n };\n }, [open]);\n\n const value = useMemo(\n () => ({ context, setContext, summary, setSummary, tab, setTab }),\n [context, setContext, summary, setSummary, tab, setTab]\n );\n\n return (\n <HvWizardContext.Provider value={value}>\n <HvWizardContainer\n className={className}\n classes={{ root: classes.root }}\n handleClose={handleClose}\n open={open}\n {...others}\n >\n <HvWizardTitle\n title={title}\n hasSummary={hasSummary}\n labels={labels}\n customStep={customStep}\n />\n <HvWizardContent\n loading={loading}\n fixedHeight={fixedHeight}\n summaryContent={summaryContent}\n >\n {children}\n </HvWizardContent>\n <HvWizardActions\n loading={loading}\n skippable={skippable}\n labels={labels}\n handleClose={handleClose}\n handleSubmit={handleSubmit}\n />\n </HvWizardContainer>\n </HvWizardContext.Provider>\n );\n};\n"],"names":["useClasses","useState","useCallback","useEffect","useMemo","jsx","HvWizardContext","jsxs","HvWizardContainer","HvWizardTitle","HvWizardContent","HvWizardActions"],"mappings":";;;;;;;;;;AAoDO,MAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,aAAa;AAAA,EACb;AAAA,EACA,SAAS;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,UAAU;AAAA,IACV,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA,SAAS;AAAA,EACT,GAAG;AACL,MAAqB;AACnB,QAAM,EAAE,QAAA,IAAYA,cAAA,WAAW,WAAW;AAE1C,QAAM,CAAC,SAAS,UAAU,IAAIC,MAAA,SAAuB,CAAE,CAAA;AACvD,QAAM,CAAC,SAAS,UAAU,IAAIA,eAAS,KAAK;AAC5C,QAAM,CAAC,KAAK,MAAM,IAAIA,eAAS,CAAC;AAEhC,QAAM,cAAcC,MAAA;AAAA,IAClB,CAAC,KAAK,WAAW;AACf,UAAI,WAAW,iBAAiB;AAC9B,kBAAU,KAAK,MAAM;AAAA,MACvB;AAAA,IACF;AAAA,IACA,CAAC,OAAO;AAAA,EAAA;AAIVC,QAAAA,UAAU,MAAM;AACd,WAAO,MAAM;AACX,UAAI,CAAC,MAAM;AACT;AAAA,UAAW,CAAC,MACV,OAAO,QAAQ,CAAC,EAAE;AAAA,YAChB,CAAC,KAAK,CAAC,KAAK,KAAK,OAAO;AAAA,cACtB,GAAG;AAAA,cACH,CAAC,CAAC,GAAG,GAAG;AAAA,gBACN,GAAG;AAAA,gBACH,SAAS;AAAA,cACX;AAAA,YAAA;AAAA,YAEF,CAAC;AAAA,UACH;AAAA,QAAA;AAEF,eAAO,CAAC;AAAA,MACV;AAAA,IAAA;AAAA,EACF,GACC,CAAC,IAAI,CAAC;AAET,QAAM,QAAQC,MAAA;AAAA,IACZ,OAAO,EAAE,SAAS,YAAY,SAAS,YAAY,KAAK;IACxD,CAAC,SAAS,YAAY,SAAS,YAAY,KAAK,MAAM;AAAA,EAAA;AAGxD,SACGC,2BAAAA,IAAAC,cAAAA,QAAgB,UAAhB,EAAyB,OACxB,UAAAC,2BAAA;AAAA,IAACC,gBAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA,SAAS,EAAE,MAAM,QAAQ,KAAK;AAAA,MAC9B;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAAH,2BAAA;AAAA,UAACI,YAAA;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,QACAJ,2BAAA;AAAA,UAACK,cAAA;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YAEC;AAAA,UAAA;AAAA,QACH;AAAA,QACAL,2BAAA;AAAA,UAACM,cAAA;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;;;"}
|