@sparrowengg/integrations-templates-frontend 1.9.84-beta.9 → 2.0.0

package/dist/cjs/_virtual/index10.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var reactIs = {exports: {}};
+var lib = {};
 
-exports.__module = reactIs;
+exports.__exports = lib;
 //# sourceMappingURL=index10.js.map

package/dist/cjs/_virtual/index8.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var cjs = {};
+var reactIs = {exports: {}};
 
-exports.__exports = cjs;
+exports.__module = reactIs;
 //# sourceMappingURL=index8.js.map

package/dist/cjs/_virtual/index9.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var lib = {};
+var cjs = {};
 
-exports.__exports = lib;
+exports.__exports = cjs;
 //# sourceMappingURL=index9.js.map

package/dist/cjs/cascader-dropdown/cascader-dropdown-breadcrumb.js

@@ -0,0 +1,118 @@
+'use strict';
+
+var React = require('react');
+var flex = require('../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js');
+var box = require('../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js');
+var tooltip = require('../node_modules/@sparrowengg/twigs-react/dist/es/tooltip/tooltip.js');
+var button = require('../node_modules/@sparrowengg/twigs-react/dist/es/button/button.js');
+var chevronRight = require('../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/chevron-right.js');
+var text = require('../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js');
+var iconButton = require('../node_modules/@sparrowengg/twigs-react/dist/es/button/icon-button.js');
+var chevronLeft = require('../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/chevron-left.js');
+
+const textWidth = {
+  1: 104,
+  2: 48,
+  3: 32
+};
+const letterCount = {
+  1: 14,
+  2: 6,
+  3: 3
+};
+const CascaderDropdownBreadcrumb = ({
+  focusNthColumn,
+  focusPreviousColumn = () => {
+  },
+  foldersSelectionPath,
+  showBackButton = true
+}) => {
+  if (foldersSelectionPath.length === 0)
+    return null;
+  return /* @__PURE__ */ React.createElement(
+    flex.Flex,
+    {
+      css: {
+        width: "100%",
+        backgroundColor: "$secondary50",
+        padding: "9px",
+        overflow: "hidden",
+        borderBottom: "1px solid $neutral100",
+        borderTopLeftRadius: "$xl",
+        borderTopRightRadius: "$xl"
+      },
+      alignItems: "center"
+    },
+    showBackButton && /* @__PURE__ */ React.createElement(BackButton, { focusPreviousColumn }),
+    showBackButton && /* @__PURE__ */ React.createElement(
+      box.Box,
+      {
+        css: {
+          width: "1px",
+          height: "$4",
+          backgroundColor: "$secondary100",
+          margin: "0 $4",
+          minWidth: "1px"
+        }
+      }
+    ),
+    foldersSelectionPath.map(({ value, label }, index) => /* @__PURE__ */ React.createElement(React.Fragment, { key: value }, /* @__PURE__ */ React.createElement(
+      tooltip.Tooltip,
+      {
+        content: `${label}`.length > letterCount[foldersSelectionPath.length] ? `${label}` : void 0,
+        className: "dm-sans",
+        css: {
+          maxWidth: "140px",
+          overflowWrap: "anywhere",
+          whiteSpace: "break-spaces",
+          zIndex: 199
+        }
+      },
+      /* @__PURE__ */ React.createElement(
+        button.Button,
+        {
+          css: {
+            color: "$secondary500",
+            marginBottom: 0,
+            padding: "0",
+            height: "auto",
+            "&, &:hover, &:focus, &:active": {
+              border: "none !important",
+              boxShadow: "none !important",
+              backgroundColor: "transparent !important"
+            },
+            borderRadius: "0",
+            fontWeight: "$4",
+            overflow: "hidden",
+            ".twigs-button__content": {
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap",
+              maxWidth: textWidth[foldersSelectionPath.length]
+            },
+            "&:hover": {
+              color: "$secondary700"
+            }
+          },
+          onClick: () => focusNthColumn(index)
+        },
+        label
+      )
+    ), /* @__PURE__ */ React.createElement(box.Box, { css: { flexShrink: "0", lineHeight: 0, color: "$secondary500" } }, /* @__PURE__ */ React.createElement(chevronRight.ChevronRightIcon, { size: 16 })))),
+    /* @__PURE__ */ React.createElement(text.Text, { css: { color: "$secondary800", marginBottom: 0, flexShrink: 0 }, weight: "medium", truncate: true }, "Choose")
+  );
+};
+const BackButton = ({ focusPreviousColumn }) => {
+  return /* @__PURE__ */ React.createElement(tooltip.Tooltip, { content: "Previous Level", css: { zIndex: 199 } }, /* @__PURE__ */ React.createElement(
+    iconButton.IconButton,
+    {
+      icon: /* @__PURE__ */ React.createElement(chevronLeft.ChevronLeftIcon, null),
+      onClick: () => focusPreviousColumn(),
+      css: { height: "$5", width: "$5", minWidth: "$5" },
+      color: "default"
+    }
+  ));
+};
+
+exports.CascaderDropdownBreadcrumb = CascaderDropdownBreadcrumb;
+//# sourceMappingURL=cascader-dropdown-breadcrumb.js.map

package/dist/cjs/cascader-dropdown/cascader-dropdown-breadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cascader-dropdown-breadcrumb.js","sources":["../../../src/cascader-dropdown/cascader-dropdown-breadcrumb.tsx"],"sourcesContent":["import { Flex } from '@sparrowengg/twigs-react';\nimport { ChevronLeftIcon, ChevronRightIcon } from '@sparrowengg/twigs-react-icons';\nimport { Button, IconButton } from '@sparrowengg/twigs-react';\nimport { Box } from '@sparrowengg/twigs-react';\nimport { Fragment } from 'react';\nimport { Tooltip } from '@sparrowengg/twigs-react';\nimport { Text } from '@sparrowengg/twigs-react';\nimport React from 'react';\n\nconst textWidth = {\n  1: 104,\n  2: 48,\n  3: 32\n};\n\nconst letterCount = {\n  1: 14,\n  2: 6,\n  3: 3\n};\n\nexport const CascaderDropdownBreadcrumb = ({\n  focusNthColumn,\n  focusPreviousColumn = () => {},\n  foldersSelectionPath,\n  showBackButton = true\n}: {\n  focusNthColumn: (index: number) => void,\n  focusPreviousColumn?: () => void,\n  foldersSelectionPath: { value: string, label: string }[],\n  showBackButton?: boolean\n}) => {\n  if (foldersSelectionPath.length === 0) return null;\n\n  return (\n    <Flex\n      css={{\n        width: '100%',\n        backgroundColor: '$secondary50',\n        padding: '9px',\n        overflow: 'hidden',\n        borderBottom: '1px solid $neutral100',\n        borderTopLeftRadius: '$xl',\n        borderTopRightRadius: '$xl'\n      }}\n      alignItems=\"center\"\n    >\n      {showBackButton && <BackButton focusPreviousColumn={focusPreviousColumn} />}\n      {showBackButton && (\n        <Box\n          css={{\n            width: '1px',\n            height: '$4',\n            backgroundColor: '$secondary100',\n            margin: '0 $4',\n            minWidth: '1px'\n          }}\n        />\n      )}\n      {foldersSelectionPath.map(({ value, label }, index) => (\n        <Fragment key={value}>\n          <Tooltip\n            content={`${label}`.length > letterCount[foldersSelectionPath.length] ? `${label}` : undefined}\n            className=\"dm-sans\"\n            css={{\n              maxWidth: '140px',\n              overflowWrap: 'anywhere',\n              whiteSpace: 'break-spaces',\n              zIndex: 199\n            }}\n          >\n            <Button\n              css={{\n                color: '$secondary500',\n                marginBottom: 0,\n                padding: '0',\n                height: 'auto',\n                '&, &:hover, &:focus, &:active': {\n                  border: 'none !important', boxShadow: 'none !important', backgroundColor: 'transparent !important'\n                },\n                borderRadius: '0',\n                fontWeight: '$4',\n                overflow: 'hidden',\n                '.twigs-button__content': {\n                  overflow: 'hidden',\n                  textOverflow: 'ellipsis',\n                  whiteSpace: 'nowrap',\n                  maxWidth: textWidth[foldersSelectionPath.length]\n                },\n                '&:hover': {\n                  color: '$secondary700'\n                }\n              }}\n              onClick={() => focusNthColumn(index)}\n            >\n              {label}\n            </Button>\n          </Tooltip>\n          <Box css={{ flexShrink: '0', lineHeight: 0, color: '$secondary500' }}>\n            <ChevronRightIcon size={16} />\n          </Box>\n        </Fragment>\n      ))}\n      <Text css={{ color: '$secondary800', marginBottom: 0, flexShrink: 0 }} weight=\"medium\" truncate>Choose</Text>\n    </Flex>\n  );\n};\n\nconst BackButton = ({ focusPreviousColumn }: { focusPreviousColumn: () => void }) => {\n  return (\n    <Tooltip content=\"Previous Level\" css={{ zIndex: 199 }}>\n      <IconButton\n        icon={<ChevronLeftIcon />}\n        onClick={() => focusPreviousColumn()}\n        css={{ height: '$5', width: '$5', minWidth: '$5' }}\n        color=\"default\"\n      />\n    </Tooltip>\n  );\n};\n"],"names":["Flex","Box","Fragment","Tooltip","Button","ChevronRightIcon","Text","IconButton","ChevronLeftIcon"],"mappings":"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"}

package/dist/cjs/cascader-dropdown/cascader-dropdown-content.js

@@ -0,0 +1,186 @@
+'use strict';
+
+var index = require('../node_modules/@radix-ui/react-popover/dist/index.js');
+var popover = require('../popover/popover.js');
+var React = require('react');
+var StyledItem = require('./styled/StyledItem.js');
+var useValue = require('./use-value.js');
+var cascaderDropdownList = require('./cascader-dropdown-list.js');
+var cascaderDropdownBreadcrumb = require('./cascader-dropdown-breadcrumb.js');
+var cascaderDropdownSearchInput = require('./cascader-dropdown-search-input.js');
+var cascaderDropdownSearchList = require('./cascader-dropdown-search-list.js');
+var cascaderDropdownConstants = require('./helpers/cascader-dropdown-constants.js');
+var tooltip = require('../node_modules/@sparrowengg/twigs-react/dist/es/tooltip/tooltip.js');
+var button = require('../node_modules/@sparrowengg/twigs-react/dist/es/button/button.js');
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const CascaderDropdownContent = (_a) => {
+  var _b = _a, {
+    children,
+    dropdownContentProps,
+    tooltipProps,
+    popoverTriggerButtonProps,
+    popoverTriggerProps
+  } = _b, props = __objRest(_b, [
+    "children",
+    "dropdownContentProps",
+    "tooltipProps",
+    "popoverTriggerButtonProps",
+    "popoverTriggerProps"
+  ]);
+  const {
+    popoverOpen,
+    setPopoverOpen,
+    id,
+    selectedNode,
+    focusNthColumn,
+    focusPreviousColumn,
+    foldersSelectionPath,
+    rootNode
+  } = useValue.useCascaderDropdownContext();
+  const [searchQuery, setSearchQuery] = React.useState("");
+  const [resultCache, setResultCache] = React.useState({});
+  const [searchFocusedNode, setSearchFocusedNode] = React.useState(null);
+  const showValueSelector = (selectedNode == null ? void 0 : selectedNode.getType()) === cascaderDropdownConstants.optionTypes.VALUE_SELECTOR;
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, (tooltipProps == null ? void 0 : tooltipProps.content) ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(index.Popover, __spreadValues({ open: popoverOpen, onOpenChange: setPopoverOpen }, props), /* @__PURE__ */ React.createElement(tooltip.Tooltip, __spreadValues({}, tooltipProps), /* @__PURE__ */ React.createElement(
+    popover.PopoverTrigger,
+    __spreadValues({
+      asChild: true,
+      className: StyledItem.prefixClassName("cascader-dropdown__trigger")
+    }, popoverTriggerProps),
+    children || /* @__PURE__ */ React.createElement(
+      button.Button,
+      __spreadValues({
+        variant: "ghost",
+        color: "default",
+        className: "twigs-editor-tool-button"
+      }, popoverTriggerButtonProps),
+      "Select"
+    )
+  )), /* @__PURE__ */ React.createElement(
+    popover.PopoverContent,
+    __spreadValues({
+      "data-filter-popover-content": id,
+      className: StyledItem.prefixClassName("cascader-dropdown"),
+      css: {
+        padding: 0,
+        border: "0.5px solid $black300",
+        borderRadius: "$xl",
+        minWidth: "260px",
+        maxWidth: "260px"
+      }
+    }, dropdownContentProps),
+    /* @__PURE__ */ React.createElement(tooltip.TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ React.createElement(
+      cascaderDropdownBreadcrumb.CascaderDropdownBreadcrumb,
+      {
+        focusNthColumn,
+        focusPreviousColumn,
+        foldersSelectionPath
+      }
+    ), !showValueSelector && rootNode.getChildren().length > 0 && /* @__PURE__ */ React.createElement(
+      cascaderDropdownSearchInput.CascaderDropdownSearchInput,
+      {
+        searchQuery,
+        setSearchQuery,
+        searchFocusedNode,
+        setSearchFocusedNode,
+        resultCache
+      }
+    ), !searchQuery && /* @__PURE__ */ React.createElement(cascaderDropdownList.CascaderDropdownList, null), searchQuery && /* @__PURE__ */ React.createElement(
+      cascaderDropdownSearchList.CascaderDropdownSearchList,
+      {
+        searchQuery,
+        setSearchQuery,
+        resultCache,
+        setResultCache,
+        searchFocusedNode,
+        setSearchFocusedNode
+      }
+    ))
+  ))) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(index.Popover, __spreadValues({ open: popoverOpen, onOpenChange: setPopoverOpen }, props), /* @__PURE__ */ React.createElement(
+    popover.PopoverTrigger,
+    __spreadValues({
+      asChild: true,
+      className: StyledItem.prefixClassName("cascader-dropdown__trigger")
+    }, popoverTriggerProps),
+    children || /* @__PURE__ */ React.createElement(
+      button.Button,
+      __spreadValues({
+        variant: "ghost",
+        color: "default",
+        className: "twigs-editor-tool-button"
+      }, popoverTriggerButtonProps),
+      "Select"
+    )
+  ), /* @__PURE__ */ React.createElement(
+    popover.PopoverContent,
+    __spreadValues({
+      "data-filter-popover-content": id,
+      className: StyledItem.prefixClassName("cascader-dropdown"),
+      css: {
+        padding: 0,
+        border: "0.5px solid $black300",
+        borderRadius: "$xl",
+        minWidth: "260px",
+        maxWidth: "260px"
+      }
+    }, dropdownContentProps),
+    /* @__PURE__ */ React.createElement(tooltip.TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ React.createElement(
+      cascaderDropdownBreadcrumb.CascaderDropdownBreadcrumb,
+      {
+        focusNthColumn,
+        focusPreviousColumn,
+        foldersSelectionPath
+      }
+    ), !showValueSelector && rootNode.getChildren().length > 0 && /* @__PURE__ */ React.createElement(
+      cascaderDropdownSearchInput.CascaderDropdownSearchInput,
+      {
+        searchQuery,
+        setSearchQuery,
+        searchFocusedNode,
+        setSearchFocusedNode,
+        resultCache
+      }
+    ), !searchQuery && /* @__PURE__ */ React.createElement(cascaderDropdownList.CascaderDropdownList, null), searchQuery && /* @__PURE__ */ React.createElement(
+      cascaderDropdownSearchList.CascaderDropdownSearchList,
+      {
+        searchQuery,
+        setSearchQuery,
+        resultCache,
+        setResultCache,
+        searchFocusedNode,
+        setSearchFocusedNode
+      }
+    ))
+  ))));
+};
+
+exports.CascaderDropdownContent = CascaderDropdownContent;
+//# sourceMappingURL=cascader-dropdown-content.js.map

package/dist/cjs/cascader-dropdown/cascader-dropdown-content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cascader-dropdown-content.js","sources":["../../../src/cascader-dropdown/cascader-dropdown-content.tsx"],"sourcesContent":["import { Popover, PopoverProps } from '@radix-ui/react-popover';\nimport { PopoverContent, PopoverTrigger } from '../popover';\nimport {\n  Tooltip,\n  TooltipProps,\n  TooltipProvider,\n} from \"@sparrowengg/twigs-react\";\nimport React, { ComponentProps, ReactNode, useState } from \"react\";\nimport { prefixClassName } from \"./styled/StyledItem\";\nimport { Button } from \"@sparrowengg/twigs-react\";\nimport { useCascaderDropdownContext } from \"./use-value\";\nimport { CascaderDropdownNode } from \"./cascader-dropdown-node\";\nimport { CascaderDropdownList } from \"./cascader-dropdown-list\";\nimport { CascaderDropdownBreadcrumb } from \"./cascader-dropdown-breadcrumb\";\nimport { CascaderDropdownSearchInput } from \"./cascader-dropdown-search-input\";\nimport { CascaderDropdownSearchList } from \"./cascader-dropdown-search-list\";\nimport { optionTypes } from \"./helpers/cascader-dropdown-constants\";\nimport { DropdownContentProps } from \"./cascader-dropdown\";\n\nexport type ResultCacheType = Record<string, CascaderDropdownNode[]>;\n\nexport const CascaderDropdownContent = ({\n  children,\n  dropdownContentProps,\n  tooltipProps,\n  popoverTriggerButtonProps,\n  popoverTriggerProps,\n  ...props\n}: {\n  children: ReactNode;\n  dropdownContentProps?: DropdownContentProps;\n  tooltipProps?: TooltipProps;\n  popoverTriggerButtonProps?: Partial<ComponentProps<typeof Button>>;\n  popoverTriggerProps?: Partial<ComponentProps<typeof PopoverTrigger>>;\n} & PopoverProps) => {\n  const {\n    popoverOpen,\n    setPopoverOpen,\n    id,\n    selectedNode,\n    focusNthColumn,\n    focusPreviousColumn,\n    foldersSelectionPath,\n    rootNode,\n  } = useCascaderDropdownContext();\n\n  const [searchQuery, setSearchQuery] = useState(\"\");\n  const [resultCache, setResultCache] = useState<ResultCacheType>({});\n\n  const [searchFocusedNode, setSearchFocusedNode] =\n    useState<CascaderDropdownNode | null>(null);\n\n  const showValueSelector =\n    selectedNode?.getType() === optionTypes.VALUE_SELECTOR;\n\n  return (\n    <>\n      {tooltipProps?.content ? (\n        <>\n          <Popover open={popoverOpen} onOpenChange={setPopoverOpen} {...props}>\n            <Tooltip {...tooltipProps}>\n              <PopoverTrigger\n                asChild\n                className={prefixClassName(\"cascader-dropdown__trigger\")}\n                {...popoverTriggerProps}\n              >\n                {children || (\n                  <Button\n                    variant=\"ghost\"\n                    color=\"default\"\n                    className=\"twigs-editor-tool-button\"\n                    {...popoverTriggerButtonProps}\n                  >\n                    Select\n                  </Button>\n                )}\n              </PopoverTrigger>\n            </Tooltip>\n            <PopoverContent\n              data-filter-popover-content={id}\n              className={prefixClassName(\"cascader-dropdown\")}\n              css={{\n                padding: 0,\n                border: \"0.5px solid $black300\",\n                borderRadius: \"$xl\",\n                minWidth: \"260px\",\n                maxWidth: \"260px\",\n              }}\n              {...dropdownContentProps}\n            >\n              <TooltipProvider delayDuration={0}>\n                <CascaderDropdownBreadcrumb\n                  focusNthColumn={focusNthColumn}\n                  focusPreviousColumn={focusPreviousColumn}\n                  foldersSelectionPath={\n                    foldersSelectionPath as { value: string; label: string }[]\n                  }\n                />\n                {!showValueSelector && rootNode.getChildren().length > 0 && (\n                  <CascaderDropdownSearchInput\n                    searchQuery={searchQuery}\n                    setSearchQuery={setSearchQuery}\n                    searchFocusedNode={searchFocusedNode}\n                    setSearchFocusedNode={setSearchFocusedNode}\n                    resultCache={resultCache}\n                  />\n                )}\n                {!searchQuery && <CascaderDropdownList />}\n                {searchQuery && (\n                  <CascaderDropdownSearchList\n                    searchQuery={searchQuery}\n                    setSearchQuery={setSearchQuery}\n                    resultCache={resultCache}\n                    setResultCache={setResultCache}\n                    searchFocusedNode={searchFocusedNode}\n                    setSearchFocusedNode={setSearchFocusedNode}\n                  />\n                )}\n              </TooltipProvider>\n            </PopoverContent>\n          </Popover>\n        </>\n      ) : (\n        <>\n          <Popover open={popoverOpen} onOpenChange={setPopoverOpen} {...props}>\n            <PopoverTrigger\n              asChild\n              className={prefixClassName(\"cascader-dropdown__trigger\")}\n              {...popoverTriggerProps}\n            >\n              {children || (\n                <Button\n                  variant=\"ghost\"\n                  color=\"default\"\n                  className=\"twigs-editor-tool-button\"\n                  {...popoverTriggerButtonProps}\n                >\n                  Select\n                </Button>\n              )}\n            </PopoverTrigger>\n            <PopoverContent\n              data-filter-popover-content={id}\n              className={prefixClassName(\"cascader-dropdown\")}\n              css={{\n                padding: 0,\n                border: \"0.5px solid $black300\",\n                borderRadius: \"$xl\",\n                minWidth: \"260px\",\n                maxWidth: \"260px\",\n              }}\n              {...dropdownContentProps}\n            >\n              <TooltipProvider delayDuration={0}>\n                <CascaderDropdownBreadcrumb\n                  focusNthColumn={focusNthColumn}\n                  focusPreviousColumn={focusPreviousColumn}\n                  foldersSelectionPath={\n                    foldersSelectionPath as { value: string; label: string }[]\n                  }\n                />\n                {!showValueSelector && rootNode.getChildren().length > 0 && (\n                  <CascaderDropdownSearchInput\n                    searchQuery={searchQuery}\n                    setSearchQuery={setSearchQuery}\n                    searchFocusedNode={searchFocusedNode}\n                    setSearchFocusedNode={setSearchFocusedNode}\n                    resultCache={resultCache}\n                  />\n                )}\n                {!searchQuery && <CascaderDropdownList />}\n                {searchQuery && (\n                  <CascaderDropdownSearchList\n                    searchQuery={searchQuery}\n                    setSearchQuery={setSearchQuery}\n                    resultCache={resultCache}\n                    setResultCache={setResultCache}\n                    searchFocusedNode={searchFocusedNode}\n                    setSearchFocusedNode={setSearchFocusedNode}\n                  />\n                )}\n              </TooltipProvider>\n            </PopoverContent>\n          </Popover>\n        </>\n      )}\n    </>\n  );\n};\n"],"names":["useCascaderDropdownContext","useState","optionTypes","Popover","Tooltip","PopoverTrigger","prefixClassName","Button","PopoverContent","TooltipProvider","CascaderDropdownBreadcrumb","CascaderDropdownSearchInput","CascaderDropdownList","CascaderDropdownSearchList"],"mappings":"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"}

package/dist/cjs/cascader-dropdown/cascader-dropdown-item.js

@@ -0,0 +1,65 @@
+'use strict';
+
+var StyledItem = require('./styled/StyledItem.js');
+var useValue = require('./use-value.js');
+var cascaderDropdownConstants = require('./helpers/cascader-dropdown-constants.js');
+var React = require('react');
+var text = require('../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js');
+var box = require('../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js');
+var chevronRight = require('../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/chevron-right.js');
+
+const CascaderDropdownItem = ({ node }) => {
+  const {
+    selectedNode,
+    setSelectedNode,
+    setFocusedNode,
+    focusedNode,
+    handleChange
+  } = useValue.useCascaderDropdownContext();
+  const selectNode = () => {
+    var _a;
+    if (node.getChildren().length === 0 && node.getType() !== cascaderDropdownConstants.optionTypes.VALUE_SELECTOR) {
+      handleChange(node);
+      return;
+    }
+    setSelectedNode(node);
+    setFocusedNode((_a = node.getChildren().at(0)) != null ? _a : node);
+  };
+  const onMouseEnter = () => {
+    setFocusedNode(node);
+  };
+  const onClick = () => {
+    selectNode();
+  };
+  return /* @__PURE__ */ React.createElement(
+    StyledItem.StyledItem,
+    {
+      className: StyledItem.prefixClassName("cascader-dropdown__item"),
+      onClick,
+      hovered: (focusedNode == null ? void 0 : focusedNode.value) === node.value,
+      "data-is-focused": (focusedNode == null ? void 0 : focusedNode.value) === node.value,
+      "data-is-selected": (selectedNode == null ? void 0 : selectedNode.value) === node.value,
+      selected: (selectedNode == null ? void 0 : selectedNode.value) === node.value,
+      onMouseEnter,
+      css: {
+        justifyContent: "space-between"
+      }
+    },
+    /* @__PURE__ */ React.createElement(text.Text, { css: { color: "$neutral900" }, className: StyledItem.prefixClassName("cascader-dropdown__item-text") }, node.label),
+    (node.getChildren().length > 0 || node.getType() === cascaderDropdownConstants.optionTypes.VALUE_SELECTOR) && /* @__PURE__ */ React.createElement(
+      box.Box,
+      {
+        css: {
+          lineHeight: "0",
+          color: "$neutral600",
+          minWidth: "$5"
+        },
+        className: StyledItem.prefixClassName("cascader-dropdown__item-icon")
+      },
+      /* @__PURE__ */ React.createElement(chevronRight.ChevronRightIcon, { size: 20 })
+    )
+  );
+};
+
+exports.CascaderDropdownItem = CascaderDropdownItem;
+//# sourceMappingURL=cascader-dropdown-item.js.map

package/dist/cjs/cascader-dropdown/cascader-dropdown-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cascader-dropdown-item.js","sources":["../../../src/cascader-dropdown/cascader-dropdown-item.tsx"],"sourcesContent":["import { Text } from '@sparrowengg/twigs-react';\nimport { prefixClassName } from './styled/StyledItem';\nimport { ChevronRightIcon } from '@sparrowengg/twigs-react-icons';\nimport { Box } from '@sparrowengg/twigs-react';\nimport { useCascaderDropdownContext } from './use-value';\nimport { CascaderDropdownNode } from './cascader-dropdown-node';\nimport { StyledItem } from './styled/StyledItem';\nimport { optionTypes } from './helpers/cascader-dropdown-constants';\nimport React from 'react';\n\nexport const CascaderDropdownItem = ({ node }: { node: CascaderDropdownNode }) => {\n  const {\n    selectedNode, setSelectedNode, setFocusedNode, focusedNode, handleChange\n  } = useCascaderDropdownContext();\n\n  const selectNode = () => {\n    if (node.getChildren().length === 0 && node.getType() !== optionTypes.VALUE_SELECTOR) {\n      handleChange(node);\n      return;\n    }\n    setSelectedNode(node);\n    setFocusedNode(node.getChildren().at(0) ?? node);\n  };\n\n  const onMouseEnter = () => {\n    setFocusedNode(node);\n  };\n\n  const onClick = () => {\n    selectNode();\n  };\n\n  return (\n    <StyledItem\n      className={prefixClassName('cascader-dropdown__item')}\n      onClick={onClick}\n      hovered={focusedNode?.value === node.value}\n      data-is-focused={focusedNode?.value === node.value}\n      data-is-selected={selectedNode?.value === node.value}\n      selected={selectedNode?.value === node.value}\n      onMouseEnter={onMouseEnter}\n      css={{\n        justifyContent: 'space-between'\n      }}\n    >\n      <Text css={{ color: '$neutral900' }} className={prefixClassName('cascader-dropdown__item-text')}>{node.label}</Text>\n      {(node.getChildren().length > 0 || node.getType() === optionTypes.VALUE_SELECTOR) && (\n        <Box\n          css={{\n            lineHeight: '0', color: '$neutral600', minWidth: '$5'\n          }}\n          className={prefixClassName('cascader-dropdown__item-icon')}\n        >\n          <ChevronRightIcon size={20} />\n        </Box>\n      )}\n    </StyledItem>\n  );\n};\n"],"names":["useCascaderDropdownContext","optionTypes","StyledItem","prefixClassName","Text","Box","ChevronRightIcon"],"mappings":";;;;;;;;;;AAUO,MAAM,oBAAuB,GAAA,CAAC,EAAE,IAAA,EAA2C,KAAA;AAChF,EAAM,MAAA;AAAA,IACJ,YAAA;AAAA,IAAc,eAAA;AAAA,IAAiB,cAAA;AAAA,IAAgB,WAAA;AAAA,IAAa,YAAA;AAAA,MAC1DA,mCAA2B,EAAA,CAAA;AAE/B,EAAA,MAAM,aAAa,MAAM;AAf3B,IAAA,IAAA,EAAA,CAAA;AAgBI,IAAI,IAAA,IAAA,CAAK,aAAc,CAAA,MAAA,KAAW,KAAK,IAAK,CAAA,OAAA,EAAc,KAAAC,qCAAA,CAAY,cAAgB,EAAA;AACpF,MAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AACjB,MAAA,OAAA;AAAA,KACF;AACA,IAAA,eAAA,CAAgB,IAAI,CAAA,CAAA;AACpB,IAAA,cAAA,CAAA,CAAe,UAAK,WAAY,EAAA,CAAE,GAAG,CAAC,CAAA,KAAvB,YAA4B,IAAI,CAAA,CAAA;AAAA,GACjD,CAAA;AAEA,EAAA,MAAM,eAAe,MAAM;AACzB,IAAA,cAAA,CAAe,IAAI,CAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAA,MAAM,UAAU,MAAM;AACpB,IAAW,UAAA,EAAA,CAAA;AAAA,GACb,CAAA;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAACC,qBAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,2BAAgB,yBAAyB,CAAA;AAAA,MACpD,OAAA;AAAA,MACA,OAAA,EAAA,CAAS,WAAa,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAA,KAAA,MAAU,IAAK,CAAA,KAAA;AAAA,MACrC,iBAAA,EAAA,CAAiB,WAAa,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAA,KAAA,MAAU,IAAK,CAAA,KAAA;AAAA,MAC7C,kBAAA,EAAA,CAAkB,YAAc,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,KAAA,MAAU,IAAK,CAAA,KAAA;AAAA,MAC/C,QAAA,EAAA,CAAU,YAAc,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,KAAA,MAAU,IAAK,CAAA,KAAA;AAAA,MACvC,YAAA;AAAA,MACA,GAAK,EAAA;AAAA,QACH,cAAgB,EAAA,eAAA;AAAA,OAClB;AAAA,KAAA;AAAA,oBAEC,KAAA,CAAA,aAAA,CAAAC,SAAA,EAAA,EAAK,GAAK,EAAA,EAAE,KAAO,EAAA,aAAA,EAAiB,EAAA,SAAA,EAAWD,0BAAgB,CAAA,8BAA8B,CAAI,EAAA,EAAA,IAAA,CAAK,KAAM,CAAA;AAAA,IAC3G,CAAA,IAAA,CAAK,aAAc,CAAA,MAAA,GAAS,KAAK,IAAK,CAAA,OAAA,EAAc,KAAAF,qCAAA,CAAY,cAChE,qBAAA,KAAA,CAAA,aAAA;AAAA,MAACI,OAAA;AAAA,MAAA;AAAA,QACC,GAAK,EAAA;AAAA,UACH,UAAY,EAAA,GAAA;AAAA,UAAK,KAAO,EAAA,aAAA;AAAA,UAAe,QAAU,EAAA,IAAA;AAAA,SACnD;AAAA,QACA,SAAA,EAAWF,2BAAgB,8BAA8B,CAAA;AAAA,OAAA;AAAA,sBAEzD,KAAA,CAAA,aAAA,CAACG,6BAAiB,EAAA,EAAA,IAAA,EAAM,EAAI,EAAA,CAAA;AAAA,KAC9B;AAAA,GAEJ,CAAA;AAEJ;;;;"}

package/dist/cjs/cascader-dropdown/cascader-dropdown-list.js

@@ -0,0 +1,83 @@
+'use strict';
+
+var React = require('react');
+var StyledItem = require('./styled/StyledItem.js');
+var cascaderDropdownItem = require('./cascader-dropdown-item.js');
+var useValue = require('./use-value.js');
+var cascaderDropdownConstants = require('./helpers/cascader-dropdown-constants.js');
+var cascaderDropdownValueSelector = require('./cascader-dropdown-value-selector.js');
+var box = require('../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js');
+var flex = require('../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js');
+var questionCircle = require('../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/question-circle.js');
+var text = require('../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js');
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const CascaderDropdownList = () => {
+  var _a, _b;
+  const containerRef = React.useRef(null);
+  const {
+    rootNode,
+    foldersSelectionPath,
+    selectedNode,
+    focusPreviousColumn,
+    handleChange,
+    selectorValue
+  } = useValue.useCascaderDropdownContext();
+  React.useEffect(() => {
+    if (containerRef.current) {
+      const selectedItem = containerRef.current.querySelector('[data-is-selected="true"]');
+      if (selectedItem)
+        selectedItem.scrollIntoView();
+    }
+  }, []);
+  if ((selectedNode == null ? void 0 : selectedNode.getType()) === cascaderDropdownConstants.optionTypes.VALUE_SELECTOR) {
+    return /* @__PURE__ */ React.createElement(
+      cascaderDropdownValueSelector.default,
+      {
+        hasOperator: false,
+        onApply: (value) => {
+          handleChange(selectedNode, __spreadProps(__spreadValues({}, cascaderDropdownConstants.initialFilterValueSelectorValue), {
+            [selectedNode.options.dataType]: value
+          }));
+        },
+        onCancel: focusPreviousColumn,
+        selectedNode,
+        selectorValue
+      }
+    );
+  }
+  return /* @__PURE__ */ React.createElement(
+    box.Box,
+    {
+      as: "ul",
+      css: { paddingTop: "$4", paddingBottom: "$4" },
+      ref: containerRef,
+      tabIndex: -1,
+      className: StyledItem.prefixClassName("cascader-dropdown__list")
+    },
+    rootNode.getChildren().length === 0 && /* @__PURE__ */ React.createElement(flex.Flex, { css: { height: "112px", color: "$neutral600" }, alignItems: "center", justifyContent: "center", flexDirection: "column", gap: "$4" }, /* @__PURE__ */ React.createElement(questionCircle.QuestionCircleIcon, { size: 20 }), /* @__PURE__ */ React.createElement(text.Text, { css: { color: "$neutral800", marginBottom: "0" } }, "No data to show!")),
+    foldersSelectionPath.length === 0 && rootNode.children.map((child) => /* @__PURE__ */ React.createElement(cascaderDropdownItem.CascaderDropdownItem, { key: child.value, node: child })),
+    foldersSelectionPath.length > 0 && ((_b = rootNode.findNode((_a = foldersSelectionPath.at(-1)) == null ? void 0 : _a.value)) == null ? void 0 : _b.children.map((child) => /* @__PURE__ */ React.createElement(cascaderDropdownItem.CascaderDropdownItem, { key: child.value, node: child })))
+  );
+};
+
+exports.CascaderDropdownList = CascaderDropdownList;
+//# sourceMappingURL=cascader-dropdown-list.js.map

package/dist/cjs/cascader-dropdown/cascader-dropdown-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cascader-dropdown-list.js","sources":["../../../src/cascader-dropdown/cascader-dropdown-list.tsx"],"sourcesContent":["import { Box } from '@sparrowengg/twigs-react';\nimport { useEffect, useRef } from 'react';\nimport { prefixClassName } from './styled/StyledItem';\nimport { QuestionCircleIcon } from '@sparrowengg/twigs-react-icons';\nimport { Flex } from '@sparrowengg/twigs-react';\nimport { Text } from '@sparrowengg/twigs-react';\nimport { CascaderDropdownItem } from './cascader-dropdown-item';\nimport { useCascaderDropdownContext } from './use-value';\nimport { optionTypes, initialFilterValueSelectorValue } from './helpers/cascader-dropdown-constants';\nimport CascaderDropdownValueSelector from './cascader-dropdown-value-selector';\nimport React from 'react';\n\nexport const CascaderDropdownList = () => {\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const {\n    rootNode, foldersSelectionPath, selectedNode, focusPreviousColumn, handleChange, selectorValue\n  } = useCascaderDropdownContext();\n\n  useEffect(() => {\n    if (containerRef.current) {\n      const selectedItem = containerRef.current.querySelector('[data-is-selected=\"true\"]');\n      if (selectedItem) selectedItem.scrollIntoView();\n    }\n  }, []);\n\n  if (selectedNode?.getType() === optionTypes.VALUE_SELECTOR) {\n    return (\n      <CascaderDropdownValueSelector\n        hasOperator={false}\n        onApply={(value) => {\n          handleChange(selectedNode, {\n            ...initialFilterValueSelectorValue,\n            [selectedNode.options.dataType]: value\n          });\n        }}\n        onCancel={focusPreviousColumn}\n        selectedNode={selectedNode}\n        selectorValue={selectorValue}\n      />\n    );\n  }\n\n  return (\n    <Box\n      as=\"ul\"\n      css={{ paddingTop: '$4', paddingBottom: '$4' }}\n      ref={containerRef}\n      tabIndex={-1}\n      className={prefixClassName('cascader-dropdown__list')}\n    >\n      {rootNode.getChildren().length === 0 && (\n        <Flex css={{ height: '112px', color: '$neutral600' }} alignItems=\"center\" justifyContent=\"center\" flexDirection=\"column\" gap=\"$4\">\n          <QuestionCircleIcon size={20} />\n          <Text css={{ color: '$neutral800', marginBottom: '0' }}>No data to show!</Text>\n        </Flex>\n      )}\n      {foldersSelectionPath.length === 0 && rootNode.children.map((child) => (\n        <CascaderDropdownItem key={child.value} node={child} />\n      ))}\n      {foldersSelectionPath.length > 0 && rootNode.findNode(foldersSelectionPath.at(-1)?.value)?.children.map((child) => (\n        <CascaderDropdownItem key={child.value} node={child} />\n      ))}\n    </Box>\n  );\n};\n"],"names":["useRef","useCascaderDropdownContext","useEffect","optionTypes","CascaderDropdownValueSelector","initialFilterValueSelectorValue","Box","prefixClassName","Flex","QuestionCircleIcon","Text","CascaderDropdownItem"],"mappings":"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"}

package/dist/cjs/cascader-dropdown/cascader-dropdown-node.js

@@ -0,0 +1,90 @@
+'use strict';
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class CascaderDropdownNode {
+  constructor(value, label, options, children, level, labelPath, valuePath, type) {
+    __publicField(this, "value");
+    __publicField(this, "label");
+    __publicField(this, "children");
+    __publicField(this, "parent", null);
+    __publicField(this, "prevNode", null);
+    __publicField(this, "nextNode", null);
+    __publicField(this, "isRoot", false);
+    __publicField(this, "disabled", false);
+    __publicField(this, "shouldFetchOptions", false);
+    __publicField(this, "dataFetched", false);
+    __publicField(this, "loading", false);
+    __publicField(this, "options", {});
+    __publicField(this, "level", 0);
+    __publicField(this, "labelPath", "");
+    __publicField(this, "valuePath", "");
+    __publicField(this, "type", "");
+    this.value = value;
+    this.label = label;
+    this.children = children;
+    const _a = options, { disabled, shouldFetchOptions } = _a, otherOptions = __objRest(_a, ["disabled", "shouldFetchOptions"]);
+    this.disabled = disabled != null ? disabled : false;
+    this.shouldFetchOptions = shouldFetchOptions != null ? shouldFetchOptions : false;
+    this.level = level;
+    this.labelPath = labelPath;
+    this.valuePath = valuePath;
+    this.type = type;
+    this.options = otherOptions;
+  }
+  setParent(node) {
+    this.parent = node;
+  }
+  getParent() {
+    return this.parent;
+  }
+  setPrevNode(node) {
+    this.prevNode = node;
+  }
+  setNextNode(node) {
+    this.nextNode = node;
+  }
+  getFirstChild() {
+    return this.children[0] || null;
+  }
+  getLastChild() {
+    return this.children[this.children.length - 1];
+  }
+  appendChild(node) {
+    this.children.push(node);
+  }
+  getLabelPath() {
+    return this.labelPath;
+  }
+  getValuePath() {
+    return this.valuePath;
+  }
+  getType() {
+    return this.type;
+  }
+  getChildren() {
+    return this.children;
+  }
+}
+
+exports.CascaderDropdownNode = CascaderDropdownNode;
+//# sourceMappingURL=cascader-dropdown-node.js.map