@sparrowengg/integrations-templates-frontend 1.9.84-beta.16 → 1.9.84-beta.18

package/dist/es/filter/filter-pill-value-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-pill-value-selector.js","sources":["../../../src/filter/filter-pill-value-selector.tsx"],"sourcesContent":["import { Popover, PopoverContent, PopoverTrigger } from '../popover';\nimport { prefixClassName } from '../cascader-dropdown/styled/StyledItem';\nimport { ReactNode, useId, useState } from 'react';\nimport CascaderDropdownValueSelector from '../cascader-dropdown/cascader-dropdown-value-selector';\nimport { CascaderDropdownNode } from '../cascader-dropdown/cascader-dropdown-node';\nimport {\n  dataTypes, optionTypes, CascaderDropdownDataValueType, CascaderDropdownValueSelectorType\n} from '../cascader-dropdown/helpers/cascader-dropdown-constants';\n\nconst FilterPillValueSelector = ({\n  children,\n  dataType,\n  choices,\n  onApply,\n  selectorValue\n}: {\n  children: ReactNode;\n  dataType: keyof typeof dataTypes;\n  choices?: CascaderDropdownDataValueType[];\n  onApply: (value: CascaderDropdownValueSelectorType[keyof CascaderDropdownValueSelectorType]) => void;\n  selectorValue: CascaderDropdownValueSelectorType;\n}) => {\n  const id = useId();\n\n  const [open, setOpen] = useState(false);\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild className={prefixClassName('cascader-dropdown__trigger')}>\n        {children}\n      </PopoverTrigger>\n      <PopoverContent\n        data-filter-popover-content={id}\n        className={prefixClassName('cascader-dropdown')}\n        css={{\n          padding: 0, border: '0.5px solid $black300', borderRadius: '$xl', minWidth: '260px', maxWidth: '260px'\n        }}\n      >\n        <CascaderDropdownValueSelector\n          hasOperator={false}\n          onApply={(value: CascaderDropdownValueSelectorType[keyof CascaderDropdownValueSelectorType]) => {\n            setOpen(false);\n            onApply(value);\n          }}\n          onCancel={() => {\n            setOpen(false);\n          }}\n          selectorValue={selectorValue}\n          selectedNode={new CascaderDropdownNode('', '', {\n            dataType,\n            choices\n          }, [], 0, '', '', optionTypes.VALUE_SELECTOR)}\n        />\n      </PopoverContent>\n    </Popover>\n  );\n};\n\nexport default FilterPillValueSelector;\n"],"names":[],"mappings":";;;;;;;AASA,MAAM,0BAA0B,CAAC;AAAA,EAC/B,QAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA;AACF,CAMM,KAAA;AACJ,EAAA,MAAM,KAAK,KAAM,EAAA,CAAA;AAEjB,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAEtC,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,IAAY,EAAA,YAAA,EAAc,2BAChC,KAAA,CAAA,aAAA,CAAA,cAAA,EAAA,EAAe,OAAO,EAAA,IAAA,EAAC,SAAW,EAAA,eAAA,CAAgB,4BAA4B,CAAA,EAAA,EAC5E,QACH,CACA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,6BAA6B,EAAA,EAAA;AAAA,MAC7B,SAAA,EAAW,gBAAgB,mBAAmB,CAAA;AAAA,MAC9C,GAAK,EAAA;AAAA,QACH,OAAS,EAAA,CAAA;AAAA,QAAG,MAAQ,EAAA,uBAAA;AAAA,QAAyB,YAAc,EAAA,KAAA;AAAA,QAAO,QAAU,EAAA,OAAA;AAAA,QAAS,QAAU,EAAA,OAAA;AAAA,OACjG;AAAA,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAAC,6BAAA;AAAA,MAAA;AAAA,QACC,WAAa,EAAA,KAAA;AAAA,QACb,OAAA,EAAS,CAAC,KAAsF,KAAA;AAC9F,UAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACb,UAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AAAA,SACf;AAAA,QACA,UAAU,MAAM;AACd,UAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AAAA,SACf;AAAA,QACA,aAAA;AAAA,QACA,YAAc,EAAA,IAAI,oBAAqB,CAAA,EAAA,EAAI,EAAI,EAAA;AAAA,UAC7C,QAAA;AAAA,UACA,OAAA;AAAA,WACC,EAAC,EAAG,GAAG,EAAI,EAAA,EAAA,EAAI,YAAY,cAAc,CAAA;AAAA,OAAA;AAAA,KAC9C;AAAA,GAEJ,CAAA,CAAA;AAEJ;;;;"}

package/dist/es/filter/filter-pill.js

@@ -0,0 +1,298 @@
+import { styled } from '../packages/frontend-templates/slitches.config.js';
+import { prefixClassName } from '../cascader-dropdown/styled/StyledItem.js';
+import React__default from 'react';
+import { CascaderDropdown } from '../cascader-dropdown/cascader-dropdown.js';
+import { dataTypes, optionTypes, initialFilterValueSelectorValue } from '../cascader-dropdown/helpers/cascader-dropdown-constants.js';
+import FilterPillValueSelector from './filter-pill-value-selector.js';
+import { Flex } from '../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';
+import { TooltipProvider, Tooltip } from '../node_modules/@sparrowengg/twigs-react/dist/es/tooltip/tooltip.js';
+import { Text } from '../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js';
+import { CloseCircleFillIcon } from '../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/close-circle-fill.js';
+import { Box } from '../node_modules/@sparrowengg/twigs-react/dist/es/box/box.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 getDisplayValue = (value) => {
+  var _a;
+  if (!value.connector)
+    return null;
+  const displayValue = (_a = value.value) == null ? void 0 : _a[value.connector.dataType];
+  if (typeof displayValue === "string")
+    return displayValue;
+  if (Array.isArray(displayValue))
+    return displayValue.join(", ");
+  if (value.connector.dataType === dataTypes.DATE_RANGE && typeof displayValue === "object" && displayValue !== null) {
+    return `${displayValue.start} - ${displayValue.end}`;
+  }
+  return null;
+};
+const FilterPill = ({
+  icon,
+  filterPillData,
+  setFilterPillData,
+  variant = "outline",
+  cascaderDropdownData,
+  onDelete,
+  showError = false
+}) => {
+  var _a, _b, _c, _d, _e;
+  const onChange = ({
+    selectedProperty,
+    selectorValue
+  }) => {
+    if (selectedProperty && "type" in selectedProperty && selectedProperty.type === optionTypes.VALUE_SELECTOR) {
+      if (!("dataType" in selectedProperty))
+        return;
+      const newFilterPillData = __spreadProps(__spreadValues({}, filterPillData), {
+        value: selectorValue != null ? selectorValue : initialFilterValueSelectorValue,
+        connector: {
+          dataType: selectedProperty.dataType,
+          label: `${selectedProperty.label}`,
+          value: `${selectedProperty.value}`,
+          type: selectedProperty.type
+        }
+      });
+      setFilterPillData(newFilterPillData);
+    }
+  };
+  return /* @__PURE__ */ React__default.createElement(TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ React__default.createElement(StyledFilterPill, { variant: showError ? "error" : variant }, /* @__PURE__ */ React__default.createElement(FilterPillLabel, { icon, label: filterPillData.property.label, labelProps: { css: { color: "$neutral900" } } }), /* @__PURE__ */ React__default.createElement(Flex, null, !((_a = filterPillData.connector) == null ? void 0 : _a.value) && /* @__PURE__ */ React__default.createElement(
+    CascaderDropdown,
+    {
+      data: cascaderDropdownData,
+      selectorValue: filterPillData.value,
+      onChange,
+      dropdownContentProps: { align: "start" }
+    },
+    /* @__PURE__ */ React__default.createElement(StyledValueButton, { css: { borderTopRightRadius: "$lg", borderBottomRightRadius: "$lg" } }, /* @__PURE__ */ React__default.createElement(
+      Text,
+      {
+        css: __spreadValues({
+          color: "$neutral700",
+          padding: "3px $4 3px $1"
+        }, showError && {
+          color: "$negative700",
+          fontWeight: "$5"
+        })
+      },
+      "Choose Condition"
+    ))
+  ), ((_b = filterPillData.connector) == null ? void 0 : _b.value) && /* @__PURE__ */ React__default.createElement(
+    CascaderDropdown,
+    {
+      data: cascaderDropdownData,
+      selectorValue: filterPillData.value,
+      onChange,
+      dropdownContentProps: { align: "start" }
+    },
+    /* @__PURE__ */ React__default.createElement(StyledValueButton, null, /* @__PURE__ */ React__default.createElement(Text, { css: { color: "$neutral700", padding: "3px $1 3px $1" } }, (_c = filterPillData.connector) == null ? void 0 : _c.label))
+  ), ((_d = filterPillData.connector) == null ? void 0 : _d.value) && /* @__PURE__ */ React__default.createElement(
+    CascaderDropdown,
+    {
+      data: cascaderDropdownData,
+      selectorValue: filterPillData.value,
+      value: filterPillData.connector,
+      onChange,
+      dropdownContentProps: { align: "start" }
+    },
+    /* @__PURE__ */ React__default.createElement(StyledValueButton, { css: { borderTopRightRadius: "$lg", borderBottomRightRadius: "$lg" } }, /* @__PURE__ */ React__default.createElement(
+      Text,
+      {
+        css: __spreadValues({
+          color: "$neutral900",
+          padding: "3px $4 3px $2"
+        }, showError && {
+          color: "$negative700"
+        }),
+        weight: "medium"
+      },
+      (_e = getDisplayValue(filterPillData)) != null ? _e : "Choose Value"
+    ))
+  )), /* @__PURE__ */ React__default.createElement(Tooltip, { content: "Remove" }, /* @__PURE__ */ React__default.createElement(StyledCloseButton, { className: prefixClassName("filter-pill__close-button"), onClick: () => onDelete() }, /* @__PURE__ */ React__default.createElement(CloseCircleFillIcon, { size: 16 })))));
+};
+const FilterPillLabel = ({
+  icon,
+  label,
+  css,
+  labelProps,
+  iconProps
+}) => {
+  return /* @__PURE__ */ React__default.createElement(Flex, { alignItems: "center", gap: "$2", css: __spreadValues({ padding: "3px $2 3px $4" }, css) }, icon && /* @__PURE__ */ React__default.createElement(
+    Box,
+    __spreadProps(__spreadValues({}, iconProps), {
+      css: __spreadValues({
+        lineHeight: 0,
+        flexShrink: 0,
+        color: "$neutral800",
+        "&, & svg": {
+          minWidth: "$4",
+          minHeight: "$4",
+          height: "$4",
+          width: "$4"
+        }
+      }, iconProps == null ? void 0 : iconProps.css)
+    }),
+    icon
+  ), /* @__PURE__ */ React__default.createElement(
+    Text,
+    __spreadProps(__spreadValues({
+      weight: "medium",
+      truncate: true
+    }, labelProps), {
+      css: __spreadValues({ color: "$neutral700", maxWidth: "$25" }, labelProps == null ? void 0 : labelProps.css)
+    }),
+    label
+  ));
+};
+const FilterPillWithoutOperator = ({
+  icon,
+  filterPillData,
+  setFilterPillData,
+  variant = "outline",
+  data,
+  onDelete,
+  showError = false
+}) => {
+  var _a;
+  const onChange = (value) => {
+    const newFilterPillData = __spreadProps(__spreadValues({}, filterPillData), {
+      value: __spreadProps(__spreadValues({}, filterPillData.value), {
+        [data.dataType]: value
+      }),
+      connector: {
+        dataType: data.dataType,
+        label: `${data.label}`,
+        value: `${data.value}`,
+        type: data.type
+      }
+    });
+    setFilterPillData(newFilterPillData);
+  };
+  return /* @__PURE__ */ React__default.createElement(TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ React__default.createElement(StyledFilterPill, { variant: showError ? "error" : variant }, /* @__PURE__ */ React__default.createElement(FilterPillLabel, { icon, label: `${filterPillData.property.label}:` }), /* @__PURE__ */ React__default.createElement(FilterPillValueSelector, { selectorValue: filterPillData.value, dataType: data.dataType, choices: data.choices, onApply: onChange }, /* @__PURE__ */ React__default.createElement(Flex, null, /* @__PURE__ */ React__default.createElement(StyledValueButton, { css: { borderTopRightRadius: "$lg", borderBottomRightRadius: "$lg" } }, /* @__PURE__ */ React__default.createElement(
+    Text,
+    {
+      css: __spreadValues({
+        color: "$neutral900",
+        padding: "3px $4 3px $2"
+      }, showError && {
+        color: "$negative700"
+      }),
+      weight: "medium"
+    },
+    (_a = getDisplayValue(filterPillData)) != null ? _a : "Choose Value"
+  )))), /* @__PURE__ */ React__default.createElement(Tooltip, { content: "Remove" }, /* @__PURE__ */ React__default.createElement(StyledCloseButton, { className: prefixClassName("filter-pill__close-button"), onClick: () => onDelete() }, /* @__PURE__ */ React__default.createElement(CloseCircleFillIcon, { size: 16 })))));
+};
+const StyledFilterPill = styled(Flex, {
+  height: "$7",
+  alignItems: "center",
+  borderWidth: "1px",
+  borderStyle: "solid",
+  borderColor: "$black200",
+  borderRadius: "$lg",
+  transition: "all $transitions$2",
+  cursor: "default",
+  width: "fit-content",
+  position: "relative",
+  flexShrink: 0,
+  "&:hover": {
+    borderColor: "$black400"
+  },
+  [`&:hover .${prefixClassName("filter-pill__close-button")}`]: {
+    opacity: 1
+  },
+  variants: {
+    disabled: {
+      true: {
+        opacity: 0.4,
+        cursor: "not-allowed"
+      }
+    },
+    variant: {
+      outline: {
+        backgroundColor: "transparent"
+      },
+      filled: {
+        backgroundColor: "$secondary50"
+      },
+      error: {
+        backgroundColorOpacity: ["$negative500", 0.05],
+        borderStyle: "dashed",
+        borderColor: "$negative400",
+        "&:hover": {
+          borderColor: "$negative400"
+        }
+      }
+    }
+  },
+  defaultVariants: {
+    variant: "outline"
+  }
+});
+const StyledValueButton = styled("button", {
+  backgroundColor: "transparent",
+  display: "flex",
+  alignItems: "center",
+  border: "none",
+  cursor: "pointer",
+  height: "100%",
+  transition: "all $transitions$2",
+  outlineWidth: "1px",
+  outlineStyle: "solid",
+  outlineColor: "transparent",
+  flexShrink: 0,
+  "&:focus, &:active": {
+    outlineColor: "transparent"
+  },
+  "&:focus-visible": {
+    outline: "1px solid $primary400"
+  }
+});
+const StyledCloseButton = styled("button", {
+  backgroundColor: "transparent",
+  border: "none",
+  cursor: "pointer",
+  outline: "none",
+  color: "$neutral500",
+  transition: "all $transitions$2",
+  lineHeight: 0,
+  position: "absolute",
+  right: 0,
+  top: 0,
+  transform: "translate(35%, -35%)",
+  opacity: 0,
+  background: "radial-gradient($white900, $white900 50%, transparent 50%, transparent)",
+  "&:hover, &:focus, &:active, &:focus-visible": {
+    opacity: 1
+  },
+  "& path": {
+    outlineWidth: "3px",
+    outlineStyle: "solid",
+    outlineColor: "$white900",
+    borderRadius: "$round"
+  },
+  "&:hover": {
+    color: "$neutral800"
+  },
+  "&:hover path, &:focus path, &:active path, &:focus-visible path": {
+    outlineColor: "#F2F5F8"
+  }
+});
+
+export { FilterPill, FilterPillWithoutOperator };
+//# sourceMappingURL=filter-pill.js.map

package/dist/es/filter/filter-pill.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-pill.js","sources":["../../../src/filter/filter-pill.tsx"],"sourcesContent":["import { CloseCircleFillIcon } from '@sparrowengg/twigs-react-icons';\nimport { Box, BoxProps } from '@sparrowengg/twigs-react';\nimport { Flex } from '@sparrowengg/twigs-react';\nimport { Tooltip, TooltipProvider } from '@sparrowengg/twigs-react';\nimport { styled } from '../../slitches.config';\nimport { Text, TextProps } from '@sparrowengg/twigs-react';\nimport { prefixClassName } from '../cascader-dropdown/styled/StyledItem';\nimport React from 'react';\nimport { CascaderDropdown, OnChangeReturnType } from '../cascader-dropdown';\nimport {\n  CascaderDropdownItemType, CascaderDropdownOperatorType, CascaderDropdownValueSelectorType, dataTypes, initialFilterValueSelectorValue, optionTypes\n} from '../cascader-dropdown/helpers/cascader-dropdown-constants';\nimport { CSS } from '@stitches/react';\nimport FilterPillValueSelector from './filter-pill-value-selector';\nimport { FilterType } from './stories/filter.stories';\n\nexport type FilterPillProps = {\n  icon?: React.ReactNode;\n  filterPillData: FilterType;\n  setFilterPillData: (value: FilterType) => void;\n  variant?: 'filled' | 'outline';\n  cascaderDropdownData: (CascaderDropdownItemType | CascaderDropdownOperatorType)[];\n  onDelete: () => void;\n  showError?: boolean;\n};\n\nexport type FilterValueOperatorType = {\n  label: string;\n  value: string;\n  dataType: keyof typeof dataTypes;\n  choices?: { label: string; value: string }[];\n};\n\nexport type FilterValueItemType = {\n  label?: string;\n  value?: string;\n  options: FilterValueOperatorType[];\n};\n\nconst getDisplayValue = (value: FilterType) => {\n  if (!value.connector) return null;\n  const displayValue = value.value?.[value.connector.dataType];\n  if (typeof displayValue === 'string') return displayValue;\n  if (Array.isArray(displayValue)) return displayValue.join(', ');\n  if (value.connector.dataType === dataTypes.DATE_RANGE && typeof displayValue === 'object' && displayValue !== null) {\n    return `${displayValue.start} - ${displayValue.end}`;\n  }\n  return null;\n};\n\nexport const FilterPill = ({\n  icon,\n  filterPillData,\n  setFilterPillData,\n  variant = 'outline',\n  cascaderDropdownData,\n  onDelete,\n  showError = false\n}: FilterPillProps) => {\n  const onChange = ({\n    selectedProperty,\n    selectorValue\n  }: OnChangeReturnType) => {\n    if (selectedProperty && 'type' in selectedProperty && selectedProperty.type === optionTypes.VALUE_SELECTOR) {\n      if (!('dataType' in selectedProperty)) return;\n      const newFilterPillData = {\n        ...filterPillData,\n        value: selectorValue ?? initialFilterValueSelectorValue,\n        connector: {\n          dataType: selectedProperty.dataType as keyof typeof dataTypes,\n          label: `${selectedProperty.label}`,\n          value: `${selectedProperty.value}`,\n          type: selectedProperty.type as 'VALUE_SELECTOR'\n        }\n      };\n      setFilterPillData(newFilterPillData);\n    }\n  };\n\n  return (\n    <TooltipProvider delayDuration={0}>\n      <StyledFilterPill variant={showError ? 'error' : variant}>\n        <FilterPillLabel icon={icon} label={filterPillData.property.label} labelProps={{ css: { color: '$neutral900' } }} />\n        <Flex>\n          {!filterPillData.connector?.value && (\n            <CascaderDropdown\n              data={cascaderDropdownData}\n              selectorValue={filterPillData.value}\n              onChange={onChange}\n              dropdownContentProps={{ align: 'start' }}\n            >\n              <StyledValueButton css={{ borderTopRightRadius: '$lg', borderBottomRightRadius: '$lg' }}>\n                <Text\n                  css={{\n                    color: '$neutral700',\n                    padding: '3px $4 3px $1',\n                    ...(showError && {\n                      color: '$negative700',\n                      fontWeight: '$5'\n                    })\n                  }}\n                >\n                  Choose Condition\n                </Text>\n              </StyledValueButton>\n            </CascaderDropdown>\n          )}\n          {filterPillData.connector?.value && (\n            <CascaderDropdown\n              data={cascaderDropdownData}\n              selectorValue={filterPillData.value}\n              onChange={onChange}\n              dropdownContentProps={{ align: 'start' }}\n            >\n              <StyledValueButton>\n                <Text css={{ color: '$neutral700', padding: '3px $1 3px $1' }}>{filterPillData.connector?.label}</Text>\n              </StyledValueButton>\n            </CascaderDropdown>\n          )}\n          {filterPillData.connector?.value && (\n            <CascaderDropdown\n              data={cascaderDropdownData}\n              selectorValue={filterPillData.value}\n              value={filterPillData.connector}\n              onChange={onChange}\n              dropdownContentProps={{ align: 'start' }}\n            >\n              <StyledValueButton css={{ borderTopRightRadius: '$lg', borderBottomRightRadius: '$lg' }}>\n                <Text\n                  css={{\n                    color: '$neutral900',\n                    padding: '3px $4 3px $2',\n                    ...(showError && {\n                      color: '$negative700'\n                    })\n                  }}\n                  weight=\"medium\"\n                >\n                  {getDisplayValue(filterPillData) ?? 'Choose Value'}\n                </Text>\n              </StyledValueButton>\n            </CascaderDropdown>\n          )}\n        </Flex>\n        <Tooltip content=\"Remove\">\n          <StyledCloseButton className={prefixClassName('filter-pill__close-button')} onClick={() => onDelete()}>\n            <CloseCircleFillIcon size={16} />\n          </StyledCloseButton>\n        </Tooltip>\n      </StyledFilterPill>\n    </TooltipProvider>\n  );\n};\n\nconst FilterPillLabel = ({\n  icon, label, css, labelProps, iconProps\n}: { icon?: React.ReactNode, label?: string, css?: CSS, labelProps?: TextProps, iconProps?: BoxProps }) => {\n  return (\n    <Flex alignItems=\"center\" gap=\"$2\" css={{ padding: '3px $2 3px $4', ...css }}>\n      {icon && (\n        <Box\n          {...iconProps}\n          css={{\n            lineHeight: 0,\n            flexShrink: 0,\n            color: '$neutral800',\n            '&, & svg': {\n              minWidth: '$4',\n              minHeight: '$4',\n              height: '$4',\n              width: '$4'\n            },\n            ...iconProps?.css\n          }}\n        >\n          {icon}\n        </Box>\n      )}\n      <Text\n        weight=\"medium\"\n        truncate\n        {...labelProps}\n        css={{ color: '$neutral700', maxWidth: '$25', ...labelProps?.css }}\n      >\n        {label}\n      </Text>\n    </Flex>\n  );\n};\n\ntype FilterPillWithoutOperatorProps = {\n  icon?: React.ReactNode;\n  filterPillData: FilterType;\n  setFilterPillData: (value: FilterType) => void;\n  variant?: 'filled' | 'outline';\n  data: CascaderDropdownOperatorType;\n  onDelete: () => void;\n  showError?: boolean;\n};\nexport const FilterPillWithoutOperator = ({\n  icon,\n  filterPillData,\n  setFilterPillData,\n  variant = 'outline',\n  data,\n  onDelete,\n  showError = false\n}: FilterPillWithoutOperatorProps) => {\n  const onChange = (value: CascaderDropdownValueSelectorType[keyof CascaderDropdownValueSelectorType]) => {\n    const newFilterPillData = {\n      ...filterPillData,\n      value: {\n        ...filterPillData.value,\n        [data.dataType]: value\n      },\n      connector: {\n        dataType: data.dataType,\n        label: `${data.label}`,\n        value: `${data.value}`,\n        type: data.type\n      }\n    };\n    setFilterPillData(newFilterPillData);\n  };\n\n  return (\n    <TooltipProvider delayDuration={0}>\n      <StyledFilterPill variant={showError ? 'error' : variant}>\n        <FilterPillLabel icon={icon} label={`${filterPillData.property.label}:`} />\n        <FilterPillValueSelector selectorValue={filterPillData.value} dataType={data.dataType} choices={data.choices} onApply={onChange}>\n          <Flex>\n            <StyledValueButton css={{ borderTopRightRadius: '$lg', borderBottomRightRadius: '$lg' }}>\n              <Text\n                css={{\n                  color: '$neutral900',\n                  padding: '3px $4 3px $2',\n                  ...(showError && {\n                    color: '$negative700'\n                  })\n                }}\n                weight=\"medium\"\n              >\n                {getDisplayValue(filterPillData) ?? 'Choose Value'}\n              </Text>\n            </StyledValueButton>\n          </Flex>\n        </FilterPillValueSelector>\n        <Tooltip content=\"Remove\">\n          <StyledCloseButton className={prefixClassName('filter-pill__close-button')} onClick={() => onDelete()}>\n            <CloseCircleFillIcon size={16} />\n          </StyledCloseButton>\n        </Tooltip>\n      </StyledFilterPill>\n    </TooltipProvider>\n  );\n};\n\nconst StyledFilterPill = styled(Flex, {\n  height: '$7',\n  alignItems: 'center',\n  borderWidth: '1px',\n  borderStyle: 'solid',\n  borderColor: '$black200',\n  borderRadius: '$lg',\n  transition: 'all $transitions$2',\n  cursor: 'default',\n  width: 'fit-content',\n  position: 'relative',\n  flexShrink: 0,\n  '&:hover': {\n    borderColor: '$black400'\n  },\n  [`&:hover .${prefixClassName('filter-pill__close-button')}`]: {\n    opacity: 1\n  },\n  variants: {\n    disabled: {\n      true: {\n        opacity: 0.4,\n        cursor: 'not-allowed'\n      }\n    },\n    variant: {\n      outline: {\n        backgroundColor: 'transparent'\n      },\n      filled: {\n        backgroundColor: '$secondary50'\n      },\n      error: {\n        backgroundColorOpacity: ['$negative500', 0.05],\n        borderStyle: 'dashed',\n        borderColor: '$negative400',\n        '&:hover': {\n          borderColor: '$negative400'\n        }\n      }\n    }\n  },\n  defaultVariants: {\n    variant: 'outline'\n  }\n});\n\nconst StyledValueButton = styled('button', {\n  backgroundColor: 'transparent',\n  display: 'flex',\n  alignItems: 'center',\n  border: 'none',\n  cursor: 'pointer',\n  height: '100%',\n  transition: 'all $transitions$2',\n  outlineWidth: '1px',\n  outlineStyle: 'solid',\n  outlineColor: 'transparent',\n  flexShrink: 0,\n  '&:focus, &:active': {\n    outlineColor: 'transparent'\n  },\n  '&:focus-visible': {\n    outline: '1px solid $primary400'\n  }\n});\n\nconst StyledCloseButton = styled('button', {\n  backgroundColor: 'transparent',\n  border: 'none',\n  cursor: 'pointer',\n  outline: 'none',\n  color: '$neutral500',\n  transition: 'all $transitions$2',\n  lineHeight: 0,\n  position: 'absolute',\n  right: 0,\n  top: 0,\n  transform: 'translate(35%, -35%)',\n  opacity: 0,\n  background: 'radial-gradient($white900, $white900 50%, transparent 50%, transparent)',\n  '&:hover, &:focus, &:active, &:focus-visible': {\n    opacity: 1\n  },\n  '& path': {\n    outlineWidth: '3px',\n    outlineStyle: 'solid',\n    outlineColor: '$white900',\n    borderRadius: '$round'\n  },\n  '&:hover': {\n    color: '$neutral800'\n  },\n  '&:hover path, &:focus path, &:active path, &:focus-visible path': {\n    outlineColor: '#F2F5F8'\n  }\n});\n"],"names":["React"],"mappings":"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"}

package/dist/es/index.js

@@ -5,4 +5,6 @@ export { SingleMapping } from './single-mapping/index.js';
 export { Triggers } from './triggers/index.js';
 export { ContactImport } from './contact-import/index.js';
 export { DynamicMapping } from './dynamic-mapping/index.js';
+export { FilterPill, FilterPillWithoutOperator } from './filter/filter-pill.js';
+export { CascaderDropdown } from './cascader-dropdown/cascader-dropdown.js';
 //# sourceMappingURL=index.js.map

package/dist/es/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/es/integration-template/components/dashboard.js

@@ -811,7 +811,7 @@ const SingleMappingDashboardItem = ({
         css: {
           border: isMappingDisplayed ? "$borderWidths$xs solid $black400" : "$borderWidths$xs solid $neutral200",
           borderRadius: isMappingDisplayed ? "$2xl $2xl 0 0" : "$2xl",
-          padding: "15px $12",
+          padding: (field == null ? void 0 : field.mappingName) || (field == null ? void 0 : field.mappingDescription) ? "$10 $12" : "15px $12",
           width: "100%",
           backgroundColor: isMappingDisplayed ? "rgba(100, 116, 139, 0.04)" : "$white900"
         },
@@ -857,7 +857,7 @@ const SingleMappingDashboardItem = ({
           },
           /* @__PURE__ */ React__default.createElement(Sync, null)
         )
-      )) : null, (() => (field == null ? void 0 : field.isEnabled) !== null && (field == null ? void 0 : field.isEnabled) !== void 0)() ? /* @__PURE__ */ React__default.createElement(
+      )) : null, (() => (field == null ? void 0 : field.isEnabled) !== null && (field == null ? void 0 : field.isEnabled) !== void 0 && syncMapping)() ? /* @__PURE__ */ React__default.createElement(
         Box,
         {
           css: {