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

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

@@ -0,0 +1,184 @@
+import { Popover } from '../node_modules/@radix-ui/react-popover/dist/index.js';
+import { PopoverTrigger, PopoverContent } from '../popover/popover.js';
+import React__default, { useState } from 'react';
+import { prefixClassName } from './styled/StyledItem.js';
+import { useCascaderDropdownContext } from './use-value.js';
+import { CascaderDropdownList } from './cascader-dropdown-list.js';
+import { CascaderDropdownBreadcrumb } from './cascader-dropdown-breadcrumb.js';
+import { CascaderDropdownSearchInput } from './cascader-dropdown-search-input.js';
+import { CascaderDropdownSearchList } from './cascader-dropdown-search-list.js';
+import { optionTypes } from './helpers/cascader-dropdown-constants.js';
+import { Tooltip, TooltipProvider } from '../node_modules/@sparrowengg/twigs-react/dist/es/tooltip/tooltip.js';
+import { Button } from '../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
+  } = useCascaderDropdownContext();
+  const [searchQuery, setSearchQuery] = useState("");
+  const [resultCache, setResultCache] = useState({});
+  const [searchFocusedNode, setSearchFocusedNode] = useState(null);
+  const showValueSelector = (selectedNode == null ? void 0 : selectedNode.getType()) === optionTypes.VALUE_SELECTOR;
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, (tooltipProps == null ? void 0 : tooltipProps.content) ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Popover, __spreadValues({ open: popoverOpen, onOpenChange: setPopoverOpen }, props), /* @__PURE__ */ React__default.createElement(Tooltip, __spreadValues({}, tooltipProps), /* @__PURE__ */ React__default.createElement(
+    PopoverTrigger,
+    __spreadValues({
+      asChild: true,
+      className: prefixClassName("cascader-dropdown__trigger")
+    }, popoverTriggerProps),
+    children || /* @__PURE__ */ React__default.createElement(
+      Button,
+      __spreadValues({
+        variant: "ghost",
+        color: "default",
+        className: "twigs-editor-tool-button"
+      }, popoverTriggerButtonProps),
+      "Select"
+    )
+  )), /* @__PURE__ */ React__default.createElement(
+    PopoverContent,
+    __spreadValues({
+      "data-filter-popover-content": id,
+      className: prefixClassName("cascader-dropdown"),
+      css: {
+        padding: 0,
+        border: "0.5px solid $black300",
+        borderRadius: "$xl",
+        minWidth: "260px",
+        maxWidth: "260px"
+      }
+    }, dropdownContentProps),
+    /* @__PURE__ */ React__default.createElement(TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ React__default.createElement(
+      CascaderDropdownBreadcrumb,
+      {
+        focusNthColumn,
+        focusPreviousColumn,
+        foldersSelectionPath
+      }
+    ), !showValueSelector && rootNode.getChildren().length > 0 && /* @__PURE__ */ React__default.createElement(
+      CascaderDropdownSearchInput,
+      {
+        searchQuery,
+        setSearchQuery,
+        searchFocusedNode,
+        setSearchFocusedNode,
+        resultCache
+      }
+    ), !searchQuery && /* @__PURE__ */ React__default.createElement(CascaderDropdownList, null), searchQuery && /* @__PURE__ */ React__default.createElement(
+      CascaderDropdownSearchList,
+      {
+        searchQuery,
+        setSearchQuery,
+        resultCache,
+        setResultCache,
+        searchFocusedNode,
+        setSearchFocusedNode
+      }
+    ))
+  ))) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Popover, __spreadValues({ open: popoverOpen, onOpenChange: setPopoverOpen }, props), /* @__PURE__ */ React__default.createElement(
+    PopoverTrigger,
+    __spreadValues({
+      asChild: true,
+      className: prefixClassName("cascader-dropdown__trigger")
+    }, popoverTriggerProps),
+    children || /* @__PURE__ */ React__default.createElement(
+      Button,
+      __spreadValues({
+        variant: "ghost",
+        color: "default",
+        className: "twigs-editor-tool-button"
+      }, popoverTriggerButtonProps),
+      "Select"
+    )
+  ), /* @__PURE__ */ React__default.createElement(
+    PopoverContent,
+    __spreadValues({
+      "data-filter-popover-content": id,
+      className: prefixClassName("cascader-dropdown"),
+      css: {
+        padding: 0,
+        border: "0.5px solid $black300",
+        borderRadius: "$xl",
+        minWidth: "260px",
+        maxWidth: "260px"
+      }
+    }, dropdownContentProps),
+    /* @__PURE__ */ React__default.createElement(TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ React__default.createElement(
+      CascaderDropdownBreadcrumb,
+      {
+        focusNthColumn,
+        focusPreviousColumn,
+        foldersSelectionPath
+      }
+    ), !showValueSelector && rootNode.getChildren().length > 0 && /* @__PURE__ */ React__default.createElement(
+      CascaderDropdownSearchInput,
+      {
+        searchQuery,
+        setSearchQuery,
+        searchFocusedNode,
+        setSearchFocusedNode,
+        resultCache
+      }
+    ), !searchQuery && /* @__PURE__ */ React__default.createElement(CascaderDropdownList, null), searchQuery && /* @__PURE__ */ React__default.createElement(
+      CascaderDropdownSearchList,
+      {
+        searchQuery,
+        setSearchQuery,
+        resultCache,
+        setResultCache,
+        searchFocusedNode,
+        setSearchFocusedNode
+      }
+    ))
+  ))));
+};
+
+export { CascaderDropdownContent };
+//# sourceMappingURL=cascader-dropdown-content.js.map

package/dist/es/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":["React"],"mappings":"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"}

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

@@ -0,0 +1,63 @@
+import { StyledItem, prefixClassName } from './styled/StyledItem.js';
+import { useCascaderDropdownContext } from './use-value.js';
+import { optionTypes } from './helpers/cascader-dropdown-constants.js';
+import React__default from 'react';
+import { Text } from '../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js';
+import { Box } from '../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js';
+import { ChevronRightIcon } from '../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/chevron-right.js';
+
+const CascaderDropdownItem = ({ node }) => {
+  const {
+    selectedNode,
+    setSelectedNode,
+    setFocusedNode,
+    focusedNode,
+    handleChange
+  } = useCascaderDropdownContext();
+  const selectNode = () => {
+    var _a;
+    if (node.getChildren().length === 0 && node.getType() !== 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__default.createElement(
+    StyledItem,
+    {
+      className: 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__default.createElement(Text, { css: { color: "$neutral900" }, className: prefixClassName("cascader-dropdown__item-text") }, node.label),
+    (node.getChildren().length > 0 || node.getType() === optionTypes.VALUE_SELECTOR) && /* @__PURE__ */ React__default.createElement(
+      Box,
+      {
+        css: {
+          lineHeight: "0",
+          color: "$neutral600",
+          minWidth: "$5"
+        },
+        className: prefixClassName("cascader-dropdown__item-icon")
+      },
+      /* @__PURE__ */ React__default.createElement(ChevronRightIcon, { size: 20 })
+    )
+  );
+};
+
+export { CascaderDropdownItem };
+//# sourceMappingURL=cascader-dropdown-item.js.map

package/dist/es/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":["React"],"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,MAC1D,0BAA2B,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,KAAA,WAAA,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,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,gBAAgB,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,oBAECA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,GAAK,EAAA,EAAE,KAAO,EAAA,aAAA,EAAiB,EAAA,SAAA,EAAW,eAAgB,CAAA,8BAA8B,CAAI,EAAA,EAAA,IAAA,CAAK,KAAM,CAAA;AAAA,IAC3G,CAAA,IAAA,CAAK,aAAc,CAAA,MAAA,GAAS,KAAK,IAAK,CAAA,OAAA,EAAc,KAAA,WAAA,CAAY,cAChE,qBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,GAAA;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,EAAW,gBAAgB,8BAA8B,CAAA;AAAA,OAAA;AAAA,sBAEzDA,cAAA,CAAA,aAAA,CAAC,gBAAiB,EAAA,EAAA,IAAA,EAAM,EAAI,EAAA,CAAA;AAAA,KAC9B;AAAA,GAEJ,CAAA;AAEJ;;;;"}

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

@@ -0,0 +1,81 @@
+import React__default, { useRef, useEffect } from 'react';
+import { prefixClassName } from './styled/StyledItem.js';
+import { CascaderDropdownItem } from './cascader-dropdown-item.js';
+import { useCascaderDropdownContext } from './use-value.js';
+import { optionTypes, initialFilterValueSelectorValue } from './helpers/cascader-dropdown-constants.js';
+import CascaderDropdownValueSelector from './cascader-dropdown-value-selector.js';
+import { Box } from '../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js';
+import { Flex } from '../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';
+import { QuestionCircleIcon } from '../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/question-circle.js';
+import { Text } from '../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 = useRef(null);
+  const {
+    rootNode,
+    foldersSelectionPath,
+    selectedNode,
+    focusPreviousColumn,
+    handleChange,
+    selectorValue
+  } = useCascaderDropdownContext();
+  useEffect(() => {
+    if (containerRef.current) {
+      const selectedItem = containerRef.current.querySelector('[data-is-selected="true"]');
+      if (selectedItem)
+        selectedItem.scrollIntoView();
+    }
+  }, []);
+  if ((selectedNode == null ? void 0 : selectedNode.getType()) === optionTypes.VALUE_SELECTOR) {
+    return /* @__PURE__ */ React__default.createElement(
+      CascaderDropdownValueSelector,
+      {
+        hasOperator: false,
+        onApply: (value) => {
+          handleChange(selectedNode, __spreadProps(__spreadValues({}, initialFilterValueSelectorValue), {
+            [selectedNode.options.dataType]: value
+          }));
+        },
+        onCancel: focusPreviousColumn,
+        selectedNode,
+        selectorValue
+      }
+    );
+  }
+  return /* @__PURE__ */ React__default.createElement(
+    Box,
+    {
+      as: "ul",
+      css: { paddingTop: "$4", paddingBottom: "$4" },
+      ref: containerRef,
+      tabIndex: -1,
+      className: prefixClassName("cascader-dropdown__list")
+    },
+    rootNode.getChildren().length === 0 && /* @__PURE__ */ React__default.createElement(Flex, { css: { height: "112px", color: "$neutral600" }, alignItems: "center", justifyContent: "center", flexDirection: "column", gap: "$4" }, /* @__PURE__ */ React__default.createElement(QuestionCircleIcon, { size: 20 }), /* @__PURE__ */ React__default.createElement(Text, { css: { color: "$neutral800", marginBottom: "0" } }, "No data to show!")),
+    foldersSelectionPath.length === 0 && rootNode.children.map((child) => /* @__PURE__ */ React__default.createElement(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__default.createElement(CascaderDropdownItem, { key: child.value, node: child })))
+  );
+};
+
+export { CascaderDropdownList };
+//# sourceMappingURL=cascader-dropdown-list.js.map

package/dist/es/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":["React"],"mappings":"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"}

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

@@ -0,0 +1,88 @@
+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;
+  }
+}
+
+export { CascaderDropdownNode };
+//# sourceMappingURL=cascader-dropdown-node.js.map

package/dist/es/cascader-dropdown/cascader-dropdown-node.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cascader-dropdown-node.js","sources":["../../../src/cascader-dropdown/cascader-dropdown-node.tsx"],"sourcesContent":["import { CascaderDropdownDataValueType, dataTypes } from './helpers/cascader-dropdown-constants';\nimport React from 'react';\n\nexport interface CascaderDropdownNodeOptions {\n  disabled?: boolean;\n  shouldFetchOptions?: boolean;\n  dataType?: keyof typeof dataTypes;\n  choices?: CascaderDropdownDataValueType[];\n  regex?: string;\n}\n\nexport class CascaderDropdownNode {\n  value: string;\n\n  label: string;\n\n  children: CascaderDropdownNode[];\n\n  parent: CascaderDropdownNode | null = null;\n\n  prevNode: CascaderDropdownNode | null = null;\n\n  nextNode: CascaderDropdownNode | null = null;\n\n  isRoot = false;\n\n  disabled = false;\n\n  shouldFetchOptions = false;\n\n  dataFetched = false;\n\n  loading = false;\n\n  options: Record<string, any> = {};\n\n  level: number = 0;\n\n  labelPath: string = '';\n\n  valuePath: string = '';\n\n  type: string = '';\n\n  constructor(\n    value: string,\n    label: string,\n    options: CascaderDropdownNodeOptions,\n    children: CascaderDropdownNode[],\n    level: number,\n    labelPath: string,\n    valuePath: string,\n    type: string\n  ) {\n    this.value = value;\n    this.label = label;\n    this.children = children;\n\n    const { disabled, shouldFetchOptions, ...otherOptions } = options;\n    this.disabled = disabled ?? false;\n    this.shouldFetchOptions = shouldFetchOptions ?? false;\n    this.level = level;\n    this.labelPath = labelPath;\n    this.valuePath = valuePath;\n    this.type = type;\n    this.options = otherOptions;\n  }\n\n  setParent(node: CascaderDropdownNode | null) {\n    this.parent = node;\n  }\n\n  getParent() {\n    return this.parent;\n  }\n\n  setPrevNode(node: CascaderDropdownNode | null) {\n    this.prevNode = node;\n  }\n\n  setNextNode(node: CascaderDropdownNode | null) {\n    this.nextNode = node;\n  }\n\n  getFirstChild() {\n    return this.children[0] || null;\n  }\n\n  getLastChild() {\n    return this.children[this.children.length - 1];\n  }\n\n  appendChild(node: CascaderDropdownNode) {\n    this.children.push(node);\n  }\n\n  getLabelPath() {\n    return this.labelPath;\n  }\n\n  getValuePath() {\n    return this.valuePath;\n  }\n\n  getType() {\n    return this.type;\n  }\n\n  getChildren() {\n    return this.children;\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/es/cascader-dropdown/cascader-dropdown-provider.js

@@ -0,0 +1,170 @@
+import React__default, { useId, useRef, useState, useMemo, useEffect } from 'react';
+import { optionTypes } from './helpers/cascader-dropdown-constants.js';
+import { CascaderDropdownContext } from './use-value.js';
+import { buildSelectionPath, buildTree, findNextFocusableRowNode, findPrevFocusableRowNode, recursiveFind } from './helpers/cascader-dropdown-utils.js';
+
+const CascaderDropdownProvider = ({
+  children,
+  data,
+  value,
+  onChange,
+  selectorValue
+}) => {
+  const id = useId();
+  const inputRef = useRef(null);
+  const [popoverOpen, setPopoverOpen] = useState(false);
+  const [selectedNode, setSelectedNode] = useState(null);
+  const [focusedNode, setFocusedNode] = useState(null);
+  const { selectionPath, foldersSelectionPath } = useMemo(() => {
+    return buildSelectionPath(selectedNode);
+  }, [selectedNode]);
+  const rootNode = useMemo(() => {
+    const root = buildTree(data);
+    const node = root.findNode(value == null ? void 0 : value.value);
+    if (node)
+      setSelectedNode(node);
+    return root;
+  }, [data, value]);
+  const focusPreviousColumn = () => {
+    var _a, _b, _c;
+    if (foldersSelectionPath.length === 0 || foldersSelectionPath.length === 1) {
+      focusRootNode();
+      return;
+    }
+    if (foldersSelectionPath.length > 1) {
+      const selectedFolderNode = rootNode.findNode((_a = foldersSelectionPath.at(-1)) == null ? void 0 : _a.value);
+      const parentNode = rootNode.findNode((_b = foldersSelectionPath.at(-2)) == null ? void 0 : _b.value);
+      if (parentNode) {
+        setFocusedNode((_c = selectedFolderNode != null ? selectedFolderNode : parentNode.children.at(0)) != null ? _c : null);
+        setSelectedNode(parentNode);
+      }
+    }
+  };
+  const focusRootNode = () => {
+    var _a, _b;
+    if (foldersSelectionPath.length > 0) {
+      const selectedFolderNode = rootNode.findNode((_a = foldersSelectionPath.at(0)) == null ? void 0 : _a.value);
+      setFocusedNode(selectedFolderNode != null ? selectedFolderNode : null);
+      setSelectedNode(rootNode);
+      return;
+    }
+    setFocusedNode((_b = rootNode.children.at(0)) != null ? _b : null);
+    setSelectedNode(rootNode);
+  };
+  const focusNthColumn = (index) => {
+    var _a, _b, _c;
+    if (!index) {
+      focusRootNode();
+      return;
+    }
+    if (foldersSelectionPath.length > 0) {
+      const selectedFolderNode = rootNode.findNode((_a = foldersSelectionPath.at(index)) == null ? void 0 : _a.value);
+      const parent = rootNode.findNode((_b = foldersSelectionPath.at(index - 1)) == null ? void 0 : _b.value);
+      if (parent) {
+        setFocusedNode((_c = selectedFolderNode != null ? selectedFolderNode : parent.children.at(0)) != null ? _c : null);
+        setSelectedNode(parent);
+      }
+    }
+  };
+  const focusNextRow = () => {
+    if (focusedNode) {
+      const nextNode = findNextFocusableRowNode(focusedNode);
+      if (nextNode)
+        setFocusedNode(nextNode);
+    }
+  };
+  const focusPreviousRow = () => {
+    if (focusedNode) {
+      const prevNode = findPrevFocusableRowNode(focusedNode);
+      if (prevNode)
+        setFocusedNode(prevNode);
+    }
+  };
+  const focusNextColumn = () => {
+    var _a;
+    if (focusedNode && (focusedNode.children.length > 0 || focusedNode.getType() === optionTypes.VALUE_SELECTOR)) {
+      setFocusedNode((_a = focusedNode.children.at(0)) != null ? _a : null);
+      setSelectedNode(focusedNode);
+    }
+  };
+  const handleChange = (node, selectedSelectorValue) => {
+    setSelectedNode(null);
+    setFocusedNode(null);
+    setPopoverOpen(false);
+    onChange({
+      value: { label: node.label, value: node.value },
+      selectionPath: selectionPath.map((item) => ({ label: item.label, value: item.value })),
+      selectedProperty: recursiveFind(data, { value: node.value, label: node.label }),
+      selectorValue: selectedSelectorValue
+    });
+  };
+  const selectFocusedNode = () => {
+    var _a;
+    if (focusedNode) {
+      if (focusedNode.children.length > 0 || focusedNode.getType() === optionTypes.VALUE_SELECTOR) {
+        setFocusedNode((_a = focusedNode.children.at(0)) != null ? _a : null);
+        setSelectedNode(focusedNode);
+      } else {
+        handleChange(focusedNode);
+      }
+    }
+  };
+  useEffect(() => {
+    var _a, _b;
+    if (inputRef.current && document.activeElement !== inputRef.current)
+      inputRef.current.focus();
+    if (!focusedNode) {
+      const selectedFolder = foldersSelectionPath.length > 0 ? rootNode.findNode((_a = foldersSelectionPath.at(0)) == null ? void 0 : _a.value) : (_b = rootNode.children.at(0)) != null ? _b : null;
+      setFocusedNode(selectedFolder);
+    }
+  });
+  const providerValue = useMemo(() => ({
+    id,
+    data,
+    value,
+    inputRef,
+    rootNode,
+    focusedNode,
+    popoverOpen,
+    selectedNode,
+    selectionPath,
+    foldersSelectionPath,
+    focusNextRow,
+    setFocusedNode,
+    setPopoverOpen,
+    focusNthColumn,
+    focusNextColumn,
+    setSelectedNode,
+    focusPreviousRow,
+    focusPreviousColumn,
+    handleChange,
+    selectFocusedNode,
+    selectorValue
+  }), [
+    id,
+    data,
+    value,
+    inputRef,
+    rootNode,
+    focusedNode,
+    popoverOpen,
+    selectedNode,
+    selectionPath,
+    foldersSelectionPath,
+    focusNextRow,
+    setFocusedNode,
+    focusNthColumn,
+    setPopoverOpen,
+    focusNextColumn,
+    setSelectedNode,
+    focusPreviousRow,
+    focusPreviousColumn,
+    handleChange,
+    selectFocusedNode,
+    selectorValue
+  ]);
+  return /* @__PURE__ */ React__default.createElement(CascaderDropdownContext.Provider, { value: providerValue }, children);
+};
+
+export { CascaderDropdownProvider };
+//# sourceMappingURL=cascader-dropdown-provider.js.map