@lax-wp/design-system 0.13.33 → 0.13.35

package/dist/components/navigation/tabs/TabOptions.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabOptions.es.js","sources":["../../../../src/components/navigation/tabs/TabOptions.tsx"],"sourcesContent":["import {\n  FormatListBulletedOutlined,\n  LockOpenRounded,\n  LockOutlined,\n  RemoveRedEyeOutlined,\n  Search,\n  SwapVertOutlined,\n  TagOutlined,\n  Tune,\n  VisibilityOffOutlined,\n  VisibilityOutlined,\n} from '@mui/icons-material';\nimport { Popover } from 'antd';\nimport classNames from 'classnames';\nimport { useEffect, useState } from 'react';\nimport Button from '../../button/Button';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { BaseInputField } from '../../forms/base-input-field/BaseInputField';\nimport { SelectField } from '../../forms/select-field/SelectField';\nimport { Toggle } from '../../forms/toggle/Toggle';\nimport IconButton from '../../button/IconButton';\nimport type { TabOptionConfig } from './types';\nimport { INITIAL_TAB_OPTION_CONFIG } from './types';\n\ntype TabOptionsProps = {\n  savedConfig: TabOptionConfig;\n  onApplyFilter: (config: TabOptionConfig) => void;\n  setUnsavedChanges: (unsavedChanges: boolean) => void;\n  handleTabSort: (order: 'asc' | 'desc') => void;\n  onSearchChange: (searchValue: string, filterType: 'contains' | 'does-not-contain') => void;\n  hasSuffixRecord: boolean;\n};\n\nconst SortAlphabetDownIcon = ({ fontSize = 24 }: { fontSize?: number }) => (\n  <svg width={fontSize} height={fontSize} viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M3.5 7H9.5M3.5 12H7.5M3.5 17H5.5M14 16L17 19M17 19L20 16M17 19V5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n);\n\nconst SortAlphabetUpIcon = ({ fontSize = 24 }: { fontSize?: number }) => (\n  <svg width={fontSize} height={fontSize} viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M3.5 17H9.5M3.5 12H7.5M3.5 7H5.5M14 8L17 5M17 5L20 8M17 5V19\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n);\n\nconst SORT_OPTIONS = [\n  {\n    label: 'Default',\n    value: 'default',\n    icon: <FormatListBulletedOutlined sx={{ height: '14px', width: '14px' }} />,\n  },\n  {\n    label: 'A-Z',\n    value: 'asc',\n    icon: <SortAlphabetDownIcon fontSize={24} />,\n  },\n  {\n    label: 'Z-A',\n    value: 'desc',\n    icon: <SortAlphabetUpIcon fontSize={24} />,\n  },\n];\n\nexport const TabOptions = ({\n  savedConfig,\n  onApplyFilter,\n  setUnsavedChanges,\n  handleTabSort,\n  onSearchChange,\n  hasSuffixRecord = false,\n}: TabOptionsProps) => {\n  const [isTabOptionsVisible, setIsTabOptionsVisible] = useState(false);\n  const [tabOptionConfig, setTabOptionConfig] = useState<TabOptionConfig>(INITIAL_TAB_OPTION_CONFIG);\n  const [filterValue, setFilterValue] = useState('');\n\n  const handleConfigChange = <K extends keyof typeof tabOptionConfig>(key: K, value: (typeof tabOptionConfig)[K]) => {\n    setTabOptionConfig((prev) => ({\n      ...prev,\n      [key]: value,\n    }));\n  };\n\n  const handleReset = () => {\n    setTabOptionConfig({\n      filterType: { label: 'Contains', value: 'contains' },\n      sortOrder: 'default',\n      showCounts: true,\n      lockOrder: false,\n    });\n    setFilterValue('');\n    onSearchChange('', 'contains');\n  };\n\n  const applyFilter = () => {\n    onApplyFilter({\n      filterType: tabOptionConfig.filterType,\n      sortOrder: tabOptionConfig.sortOrder,\n      showCounts: tabOptionConfig.showCounts,\n      lockOrder: tabOptionConfig.lockOrder,\n    });\n    handleTabSort(tabOptionConfig.sortOrder as 'asc' | 'desc');\n    setUnsavedChanges(true);\n    setIsTabOptionsVisible(false);\n    if (filterValue) {\n      onSearchChange(filterValue, tabOptionConfig.filterType.value);\n    }\n  };\n\n  useEffect(() => {\n    if (savedConfig && JSON.stringify(savedConfig) !== JSON.stringify(tabOptionConfig)) {\n      setTabOptionConfig(savedConfig);\n    }\n  }, [savedConfig]);\n\n  const content = (\n    <div>\n      <div className=\"p-5 space-y-5\">\n        <div className=\"space-y-2\">\n          <Typography size=\"extra-small\" variant=\"regular\" className=\"!text-neutral-600 dark:!text-neutral-400 uppercase\" appearance=\"title\">\n            <Search sx={{ height: '14px', width: '14px' }} /> Filter Tabs\n          </Typography>\n          <div className=\"grid grid-cols-[150px_3fr] gap-2\">\n            <SelectField\n              showSearch={false}\n              allowClear={false}\n              value={tabOptionConfig.filterType}\n              onChange={(value) => handleConfigChange('filterType', value)}\n              options={[\n                { label: 'Contains', value: 'contains' },\n                { label: 'Does not contain', value: 'does-not-contain' },\n              ]}\n            />\n            <BaseInputField\n              id=\"base-input-field-tab-options-filter\"\n              placeholder=\"Insert value\"\n              value={filterValue}\n              onChange={(value: string) => setFilterValue(value)}\n              isClearable\n            />\n          </div>\n        </div>\n        <div className=\"space-y-2\">\n          <Typography size=\"extra-small\" variant=\"regular\" className=\"!text-neutral-600 dark:!text-neutral-400 uppercase\" appearance=\"title\">\n            <SwapVertOutlined sx={{ height: '14px', width: '14px' }} /> Sort\n          </Typography>\n          <div className=\"grid grid-cols-3 gap-2\">\n            {SORT_OPTIONS.map((option) => {\n              const isActive = tabOptionConfig.sortOrder === option.value;\n              return (\n                <Button\n                  appearance=\"outline\"\n                  status={isActive ? 'secondary' : 'secondary-neutral'}\n                  id={`sort-option-${option.value}`}\n                  onClick={() => handleConfigChange('sortOrder', option.value as 'default' | 'asc' | 'desc')}\n                  className=\"w-full\"\n                  key={option.value}\n                >\n                  {option.icon}\n                  {option.label}\n                </Button>\n              );\n            })}\n          </div>\n        </div>\n        <div className=\"space-y-2\">\n          <Typography size=\"extra-small\" variant=\"regular\" className=\"!text-neutral-600 dark:!text-neutral-400 uppercase\" appearance=\"title\">\n            <VisibilityOutlined sx={{ height: '14px', width: '14px' }} /> Display Options\n          </Typography>\n          {hasSuffixRecord && (\n            <div className=\"rounded-lg border-0 bg-neutral-100 dark:bg-neutral-800 flex items-center justify-between w-full py-2 px-3\">\n              <div className=\"flex items-center gap-2\">\n                <div className=\"flex items-center justify-center h-8 w-8 bg-white dark:bg-neutral-700 rounded-lg\">\n                  <TagOutlined sx={{ height: '16px', width: '16px' }} className=\"text-neutral-800 dark:text-white\" />\n                </div>\n                <div className=\"flex flex-col gap-0\">\n                  <Typography size=\"small\" variant=\"medium\" appearance=\"title\">\n                    Show Counts\n                  </Typography>\n                  <Typography size=\"extra-small\" variant=\"regular\" appearance=\"subtitle\">\n                    Display item counts on tabs\n                  </Typography>\n                </div>\n              </div>\n              <div className=\"flex items-center justify-end\">\n                <Toggle\n                  isChecked={tabOptionConfig.showCounts}\n                  onChange={(v) => handleConfigChange('showCounts', v)}\n                  hideStatus\n                  icon={{\n                    checkedIcon: <RemoveRedEyeOutlined sx={{ fontSize: 12 }} className=\"cursor-pointer !block text-primary-600 dark:text-primary-400\" />,\n                    uncheckedIcon: <VisibilityOffOutlined sx={{ fontSize: 12 }} className=\"cursor-pointer !block text-neutral-700 dark:text-neutral-300\" />,\n                  }}\n                  withIcon\n                />\n              </div>\n            </div>\n          )}\n          <div className=\"rounded-lg border-0 bg-neutral-100 dark:bg-neutral-800 flex items-center justify-between w-full py-2 px-3\">\n            <div className=\"flex items-center gap-2\">\n              <div className=\"flex items-center justify-center h-8 w-8 bg-white dark:bg-neutral-700 rounded-lg\">\n                <LockOutlined sx={{ height: '16px', width: '16px' }} className=\"text-neutral-800 dark:text-white\" />\n              </div>\n              <div className=\"flex flex-col gap-0\">\n                <Typography size=\"small\" variant=\"medium\" appearance=\"title\">\n                  Lock Order\n                </Typography>\n                <Typography size=\"extra-small\" variant=\"regular\" appearance=\"subtitle\">\n                  Prevent tab reordering\n                </Typography>\n              </div>\n            </div>\n            <div className=\"flex items-center justify-end\">\n              <Toggle\n                isChecked={tabOptionConfig.lockOrder}\n                onChange={(v) => handleConfigChange('lockOrder', v)}\n                hideStatus\n                withIcon\n                icon={{\n                  checkedIcon: <LockOutlined sx={{ fontSize: 12 }} className=\"cursor-pointer !block text-primary-600 dark:text-primary-400\" />,\n                  uncheckedIcon: <LockOpenRounded sx={{ fontSize: 12 }} className=\"cursor-pointer !block text-neutral-700\" />,\n                }}\n              />\n            </div>\n          </div>\n        </div>\n      </div>\n      <div className=\"grid grid-cols-2 gap-2 border-t border-neutral-200 dark:border-neutral-800 p-5\">\n        <Button id=\"btn-tab-options-reset\" appearance=\"outline\" status=\"cancel\" className=\"w-full\" onClick={handleReset}>\n          Reset\n        </Button>\n        <Button\n          id=\"btn-tab-options-apply\"\n          appearance=\"filled\"\n          status=\"primary\"\n          className=\"w-full\"\n          onClick={applyFilter}\n          disabled={JSON.stringify(savedConfig) === JSON.stringify(tabOptionConfig) && filterValue === ''}\n        >\n          Apply\n        </Button>\n      </div>\n    </div>\n  );\n\n  return (\n    <Popover\n      classNames={{\n        body: 'rounded-md w-[348px] !p-0',\n      }}\n      placement=\"bottomLeft\"\n      content={content}\n      trigger={['click']}\n      arrow={false}\n      open={isTabOptionsVisible}\n      onOpenChange={setIsTabOptionsVisible}\n    >\n      <div className=\"border-l border-neutral-200 dark:border-neutral-800 pl-2\">\n        <IconButton\n          tooltip=\"Manage Tabs\"\n          variant=\"ghost\"\n          className=\"!text-neutral-400 hover:!text-primary-600 dark:hover:!bg-primary-900 relative\"\n          onClick={() => setIsTabOptionsVisible(true)}\n        >\n          <Tune sx={{ height: '20px', width: '20px' }} />\n          {JSON.stringify(tabOptionConfig) !== JSON.stringify(INITIAL_TAB_OPTION_CONFIG) && <Indicator className=\"text-primary-600\" />}\n        </IconButton>\n      </div>\n    </Popover>\n  );\n};\n\nexport const Indicator = ({ className }: { className?: string }) => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"5\"\n      height=\"5\"\n      viewBox=\"0 0 4 4\"\n      fill=\"none\"\n      className={classNames('absolute top-0.5 right-0.5', className)}\n    >\n      <circle cx=\"2\" cy=\"2\" r=\"2\" fill=\"currentColor\" />\n    </svg>\n  );\n};\n"],"names":["SortAlphabetDownIcon","fontSize","jsx","SortAlphabetUpIcon","SORT_OPTIONS","FormatListBulletedOutlined","TabOptions","savedConfig","onApplyFilter","setUnsavedChanges","handleTabSort","onSearchChange","hasSuffixRecord","isTabOptionsVisible","setIsTabOptionsVisible","useState","tabOptionConfig","setTabOptionConfig","INITIAL_TAB_OPTION_CONFIG","filterValue","setFilterValue","handleConfigChange","key","value","prev","handleReset","applyFilter","useEffect","content","jsxs","Typography","Search","SelectField","BaseInputField","SwapVertOutlined","option","isActive","Button","VisibilityOutlined","TagOutlined","Toggle","v","RemoveRedEyeOutlined","VisibilityOffOutlined","LockOutlined","LockOpenRounded","Popover","IconButton","Tune","Indicator","className","classNames"],"mappings":"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"}
+{"version":3,"file":"TabOptions.es.js","sources":["../../../../src/components/navigation/tabs/TabOptions.tsx"],"sourcesContent":["import {\n  FormatListBulletedOutlined,\n  LockOpenRounded,\n  LockOutlined,\n  RemoveRedEyeOutlined,\n  Search,\n  SwapVertOutlined,\n  TagOutlined,\n  Tune,\n  VisibilityOffOutlined,\n  VisibilityOutlined,\n} from '@mui/icons-material';\nimport { Popover } from 'antd';\nimport classNames from 'classnames';\nimport { useEffect, useState } from 'react';\nimport Button from '../../button/Button';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { BaseInputField } from '../../forms/base-input-field/BaseInputField';\nimport { SelectField } from '../../forms/select-field/SelectField';\nimport { Toggle } from '../../forms/toggle/Toggle';\nimport IconButton from '../../button/IconButton';\nimport type { TabOptionConfig } from './types';\nimport { INITIAL_TAB_OPTION_CONFIG } from './types';\n\ntype TabOptionsProps = {\n  savedConfig: TabOptionConfig;\n  onApplyFilter: (config: TabOptionConfig) => void;\n  setUnsavedChanges: (unsavedChanges: boolean) => void;\n  handleTabSort: (order: 'asc' | 'desc') => void;\n  onSearchChange: (searchValue: string, filterType: 'contains' | 'does-not-contain') => void;\n  hasSuffixRecord: boolean;\n};\n\nconst SortAlphabetDownIcon = ({ fontSize = 24 }: { fontSize?: number }) => (\n  <svg width={fontSize} height={fontSize} viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M3.5 7H9.5M3.5 12H7.5M3.5 17H5.5M14 16L17 19M17 19L20 16M17 19V5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n);\n\nconst SortAlphabetUpIcon = ({ fontSize = 24 }: { fontSize?: number }) => (\n  <svg width={fontSize} height={fontSize} viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M3.5 17H9.5M3.5 12H7.5M3.5 7H5.5M14 8L17 5M17 5L20 8M17 5V19\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n  </svg>\n);\n\nconst SORT_OPTIONS = [\n  {\n    label: 'Default',\n    value: 'default',\n    icon: <FormatListBulletedOutlined sx={{ height: '14px', width: '14px' }} />,\n  },\n  {\n    label: 'A-Z',\n    value: 'asc',\n    icon: <SortAlphabetDownIcon fontSize={24} />,\n  },\n  {\n    label: 'Z-A',\n    value: 'desc',\n    icon: <SortAlphabetUpIcon fontSize={24} />,\n  },\n];\n\nexport const TabOptions = ({\n  savedConfig,\n  onApplyFilter,\n  setUnsavedChanges,\n  handleTabSort,\n  onSearchChange,\n  hasSuffixRecord = false,\n}: TabOptionsProps) => {\n  const [isTabOptionsVisible, setIsTabOptionsVisible] = useState(false);\n  const [tabOptionConfig, setTabOptionConfig] = useState<TabOptionConfig>(INITIAL_TAB_OPTION_CONFIG);\n  const [filterValue, setFilterValue] = useState('');\n\n  const handleConfigChange = <K extends keyof typeof tabOptionConfig>(key: K, value: (typeof tabOptionConfig)[K]) => {\n    setTabOptionConfig((prev) => ({\n      ...prev,\n      [key]: value,\n    }));\n  };\n\n  const handleReset = () => {\n    setTabOptionConfig({\n      filterType: { label: 'Contains', value: 'contains' },\n      sortOrder: 'default',\n      showCounts: true,\n      lockOrder: false,\n    });\n    setFilterValue('');\n    onSearchChange('', 'contains');\n  };\n\n  const applyFilter = () => {\n    onApplyFilter({\n      filterType: tabOptionConfig.filterType,\n      sortOrder: tabOptionConfig.sortOrder,\n      showCounts: tabOptionConfig.showCounts,\n      lockOrder: tabOptionConfig.lockOrder,\n    });\n    handleTabSort(tabOptionConfig.sortOrder as 'asc' | 'desc');\n    setUnsavedChanges(true);\n    setIsTabOptionsVisible(false);\n    if (filterValue) {\n      onSearchChange(filterValue, tabOptionConfig.filterType.value);\n    }\n  };\n\n  useEffect(() => {\n    if (savedConfig && JSON.stringify(savedConfig) !== JSON.stringify(tabOptionConfig)) {\n      setTabOptionConfig(savedConfig);\n    }\n  }, [savedConfig]);\n\n  const content = (\n    <div>\n      <div className=\"p-5 space-y-5\">\n        <div className=\"space-y-2\">\n          <Typography size=\"extra-small\" variant=\"regular\" className=\"!text-neutral-600 dark:!text-neutral-400 uppercase\" appearance=\"title\">\n            <Search sx={{ height: '14px', width: '14px' }} /> Filter Tabs\n          </Typography>\n          <div className=\"grid grid-cols-[150px_3fr] gap-2\">\n            <SelectField\n              showSearch={false}\n              allowClear={false}\n              value={tabOptionConfig.filterType}\n              onChange={(value) => handleConfigChange('filterType', value)}\n              options={[\n                { label: 'Contains', value: 'contains' },\n                { label: 'Does not contain', value: 'does-not-contain' },\n              ]}\n            />\n            <BaseInputField\n              id=\"base-input-field-tab-options-filter\"\n              placeholder=\"Insert value\"\n              value={filterValue}\n              onChange={(value: string) => setFilterValue(value)}\n              isClearable\n            />\n          </div>\n        </div>\n        <div className=\"space-y-2\">\n          <Typography size=\"extra-small\" variant=\"regular\" className=\"!text-neutral-600 dark:!text-neutral-400 uppercase\" appearance=\"title\">\n            <SwapVertOutlined sx={{ height: '14px', width: '14px' }} /> Sort\n          </Typography>\n          <div className=\"grid grid-cols-3 gap-2\">\n            {SORT_OPTIONS.map((option) => {\n              const isActive = tabOptionConfig.sortOrder === option.value;\n              return (\n                <Button\n                  appearance=\"outline\"\n                  status={isActive ? 'secondary' : 'secondary-neutral'}\n                  id={`sort-option-${option.value}`}\n                  onClick={() => handleConfigChange('sortOrder', option.value as 'default' | 'asc' | 'desc')}\n                  className=\"w-full\"\n                  key={option.value}\n                >\n                  {option.icon}\n                  {option.label}\n                </Button>\n              );\n            })}\n          </div>\n        </div>\n        <div className=\"space-y-2\">\n          <Typography size=\"extra-small\" variant=\"regular\" className=\"!text-neutral-600 dark:!text-neutral-400 uppercase\" appearance=\"title\">\n            <VisibilityOutlined sx={{ height: '14px', width: '14px' }} /> Display Options\n          </Typography>\n          {hasSuffixRecord && (\n            <div className=\"rounded-lg border-0 bg-neutral-100 dark:bg-neutral-800 flex items-center justify-between w-full py-2 px-3\">\n              <div className=\"flex items-center gap-2\">\n                <div className=\"flex items-center justify-center h-8 w-8 bg-white dark:bg-neutral-700 rounded-lg\">\n                  <TagOutlined sx={{ height: '16px', width: '16px' }} className=\"text-neutral-800 dark:text-white\" />\n                </div>\n                <div className=\"flex flex-col gap-0\">\n                  <Typography size=\"small\" variant=\"medium\" appearance=\"title\">\n                    Show Counts\n                  </Typography>\n                  <Typography size=\"extra-small\" variant=\"regular\" appearance=\"subtitle\">\n                    Display item counts on tabs\n                  </Typography>\n                </div>\n              </div>\n              <div className=\"flex items-center justify-end\">\n                <Toggle\n                  isChecked={tabOptionConfig.showCounts}\n                  onChange={(v) => handleConfigChange('showCounts', v)}\n                  hideStatus\n                  icon={{\n                    checkedIcon: <RemoveRedEyeOutlined sx={{ fontSize: 12 }} className=\"cursor-pointer !block text-primary-600 dark:text-primary-400\" />,\n                    uncheckedIcon: <VisibilityOffOutlined sx={{ fontSize: 12 }} className=\"cursor-pointer !block text-neutral-700 dark:text-neutral-300\" />,\n                  }}\n                  withIcon\n                />\n              </div>\n            </div>\n          )}\n          <div className=\"rounded-lg border-0 bg-neutral-100 dark:bg-neutral-800 flex items-center justify-between w-full py-2 px-3\">\n            <div className=\"flex items-center gap-2\">\n              <div className=\"flex items-center justify-center h-8 w-8 bg-white dark:bg-neutral-700 rounded-lg\">\n                <LockOutlined sx={{ height: '16px', width: '16px' }} className=\"text-neutral-800 dark:text-white\" />\n              </div>\n              <div className=\"flex flex-col gap-0\">\n                <Typography size=\"small\" variant=\"medium\" appearance=\"title\">\n                  Lock Order\n                </Typography>\n                <Typography size=\"extra-small\" variant=\"regular\" appearance=\"subtitle\">\n                  Prevent tab reordering\n                </Typography>\n              </div>\n            </div>\n            <div className=\"flex items-center justify-end\">\n              <Toggle\n                isChecked={tabOptionConfig.lockOrder}\n                onChange={(v) => handleConfigChange('lockOrder', v)}\n                hideStatus\n                withIcon\n                icon={{\n                  checkedIcon: <LockOutlined className=\"cursor-pointer !block text-primary-600 dark:text-primary-400 w-2xs h-2xs\" />,\n                  uncheckedIcon: <LockOpenRounded className=\"cursor-pointer !block text-neutral-700 w-2xs h-2xs\" />,\n                }}\n              />\n            </div>\n          </div>\n        </div>\n      </div>\n      <div className=\"grid grid-cols-2 gap-2 border-t border-neutral-200 dark:border-neutral-800 p-5\">\n        <Button id=\"btn-tab-options-reset\" appearance=\"outline\" status=\"cancel\" className=\"w-full\" onClick={handleReset}>\n          Reset\n        </Button>\n        <Button\n          id=\"btn-tab-options-apply\"\n          appearance=\"filled\"\n          status=\"primary\"\n          className=\"w-full\"\n          onClick={applyFilter}\n          disabled={JSON.stringify(savedConfig) === JSON.stringify(tabOptionConfig) && filterValue === ''}\n        >\n          Apply\n        </Button>\n      </div>\n    </div>\n  );\n\n  return (\n    <Popover\n      classNames={{\n        body: 'rounded-md w-[348px] !p-0',\n      }}\n      placement=\"bottomLeft\"\n      content={content}\n      trigger={['click']}\n      arrow={false}\n      open={isTabOptionsVisible}\n      onOpenChange={setIsTabOptionsVisible}\n    >\n      <div className=\"border-l border-neutral-200 dark:border-neutral-800 pl-2\">\n        <IconButton\n          tooltip=\"Manage Tabs\"\n          variant=\"ghost\"\n          className=\"!text-neutral-400 hover:!text-primary-600 dark:hover:!bg-primary-900 relative\"\n          onClick={() => setIsTabOptionsVisible(true)}\n        >\n          <Tune sx={{ height: '20px', width: '20px' }} />\n          {JSON.stringify(tabOptionConfig) !== JSON.stringify(INITIAL_TAB_OPTION_CONFIG) && <Indicator className=\"text-primary-600\" />}\n        </IconButton>\n      </div>\n    </Popover>\n  );\n};\n\nexport const Indicator = ({ className }: { className?: string }) => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"5\"\n      height=\"5\"\n      viewBox=\"0 0 4 4\"\n      fill=\"none\"\n      className={classNames('absolute top-0.5 right-0.5', className)}\n    >\n      <circle cx=\"2\" cy=\"2\" r=\"2\" fill=\"currentColor\" />\n    </svg>\n  );\n};\n"],"names":["SortAlphabetDownIcon","fontSize","jsx","SortAlphabetUpIcon","SORT_OPTIONS","FormatListBulletedOutlined","TabOptions","savedConfig","onApplyFilter","setUnsavedChanges","handleTabSort","onSearchChange","hasSuffixRecord","isTabOptionsVisible","setIsTabOptionsVisible","useState","tabOptionConfig","setTabOptionConfig","INITIAL_TAB_OPTION_CONFIG","filterValue","setFilterValue","handleConfigChange","key","value","prev","handleReset","applyFilter","useEffect","content","jsxs","Typography","Search","SelectField","BaseInputField","SwapVertOutlined","option","isActive","Button","VisibilityOutlined","TagOutlined","Toggle","v","RemoveRedEyeOutlined","VisibilityOffOutlined","LockOutlined","LockOpenRounded","Popover","IconButton","Tune","Indicator","className","classNames"],"mappings":"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"}

package/dist/components/navigation/tabs/TabSwitch.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("../../../_virtual/index.cjs.js"),u=require("./Children.cjs.js"),P=require("react-i18next"),T=({showCounts:g=!0,title:e,icon:p,suffixRecord:x,classValue:j,isSelected:n,selectedClassValue:v,textClassValue:N,selectedId:f,iconsOnly:h,draggingTab:m,disableAnimation:w,tabOptions:y,color:c="light",href:s,onClick:d,role:C,ariaSelected:q,tabIndex:$,onKeyDown:I})=>{const{t:K}=P.useTranslation(),l={selectedId:f,isSelected:n,selectedClassValue:v,textClassValue:N,disableAnimation:w},o={role:C,"aria-selected":q,tabIndex:$,onKeyDown:I},i=r.jsxs("div",{className:a("flex items-center text-center","opacity-100",h?"":"gap-1.5"),children:[p?r.jsx("div",{className:n?"opacity-100":`opacity-40 ${c==="dark"?"dark:opacity-100 dark:text-black-100":""}`,children:p}):null,r.jsx("div",{className:n?"opacity-100":"opacity-80",children:h?null:K(e||"")}),e!=="More..."&&x?.[e||""]!==void 0&&g?r.jsx("span",{className:a("ml-2 text-xs leading-[18px] font-normal border rounded-full pr-2 pl-2 border-1",n?a("text-primary-700 border-primary-200 dark:!border-primary-600 border-1",c==="dark"?"text-white bg-primary-700":"bg-neutral-100 dark:bg-primary-700 dark:text-white"):a("text-neutral-500 dark:text-neutral-400 border-neutral-300 dark:border-neutral-500 border-1",c==="dark"?"bg-neutral-800 dark:bg-neutral-700 dark:border-neutral-800":"bg-neutral-100 dark:bg-transparent")),children:String(x?.[e||""]??"0")}):null]}),b=a(j,m?"opacity-0 cursor-grabbing":"","focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:outline-none"),k=t=>{t.metaKey||t.ctrlKey||t.shiftKey||t.button!==0||(t.preventDefault(),d?.())};return y?r.jsx("div",{id:`btn-tabs-tabswitch-${e}`,className:b,...o,children:r.jsx(u.Children,{...l,children:r.jsxs("div",{className:"flex items-center gap-1",children:[s?r.jsx("a",{href:s,onClick:k,className:"contents uppercase",tabIndex:-1,children:i}):r.jsx("button",{type:"button",onClick:d,className:"contents uppercase",tabIndex:-1,children:i}),y]})})}):s?r.jsx("a",{id:`btn-tabs-tabswitch-${e}`,href:s,className:b,onClick:k,...o,children:r.jsx(u.Children,{...l,children:i})}):r.jsx("button",{id:`btn-tabs-tabswitch-${e}`,className:b,type:"button",onClick:d,...o,children:r.jsx(u.Children,{...l,children:i})})};exports.TabSwitch=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("../../../_virtual/index.cjs.js"),u=require("./Children.cjs.js"),P=require("react-i18next"),T=({showCounts:g=!0,title:e,icon:p,suffixRecord:x,classValue:j,isSelected:n,selectedClassValue:v,textClassValue:N,selectedId:f,iconsOnly:h,draggingTab:m,disableAnimation:w,tabOptions:y,color:c="light",href:s,onClick:d,role:C,ariaSelected:q,tabIndex:$,onKeyDown:I})=>{const{t:K}=P.useTranslation(),l={selectedId:f,isSelected:n,selectedClassValue:v,textClassValue:N,disableAnimation:w},o={role:C,"aria-selected":q,tabIndex:$,onKeyDown:I},i=r.jsxs("div",{className:a("flex items-center text-center","opacity-100",h?"":"gap-1.5"),children:[p?r.jsx("div",{className:n?"opacity-100":`opacity-40 ${c==="dark"?"dark:opacity-100 dark:text-black-100":""}`,children:p}):null,r.jsx("div",{className:n?"opacity-100":"opacity-80",children:h?null:K(e||"")}),e!=="More..."&&x?.[e||""]!==void 0&&g?r.jsx("span",{className:a("ml-2 text-xs leading-4 font-normal border rounded-full pr-2 pl-2 border-1",n?a("text-primary-700 border-primary-200 dark:!border-primary-600 border-1",c==="dark"?"text-white bg-primary-700":"bg-neutral-100 dark:bg-primary-700 dark:text-white"):a("text-neutral-500 dark:text-neutral-400 border-neutral-300 dark:border-neutral-500 border-1",c==="dark"?"bg-neutral-800 dark:bg-neutral-700 dark:border-neutral-800":"bg-neutral-100 dark:bg-transparent")),children:String(x?.[e||""]??"0")}):null]}),b=a(j,m?"opacity-0 cursor-grabbing":"","focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:outline-none"),k=t=>{t.metaKey||t.ctrlKey||t.shiftKey||t.button!==0||(t.preventDefault(),d?.())};return y?r.jsx("div",{id:`btn-tabs-tabswitch-${e}`,className:b,...o,children:r.jsx(u.Children,{...l,children:r.jsxs("div",{className:"flex items-center gap-1",children:[s?r.jsx("a",{href:s,onClick:k,className:"contents uppercase",tabIndex:-1,children:i}):r.jsx("button",{type:"button",onClick:d,className:"contents uppercase",tabIndex:-1,children:i}),y]})})}):s?r.jsx("a",{id:`btn-tabs-tabswitch-${e}`,href:s,className:b,onClick:k,...o,children:r.jsx(u.Children,{...l,children:i})}):r.jsx("button",{id:`btn-tabs-tabswitch-${e}`,className:b,type:"button",onClick:d,...o,children:r.jsx(u.Children,{...l,children:i})})};exports.TabSwitch=T;
 //# sourceMappingURL=TabSwitch.cjs.js.map

package/dist/components/navigation/tabs/TabSwitch.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabSwitch.cjs.js","sources":["../../../../src/components/navigation/tabs/TabSwitch.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport type { MouseEvent } from 'react';\nimport { Children } from './Children';\nimport { useTranslation } from 'react-i18next'\nimport type { TabSwitchProps } from './types';\n\nexport const TabSwitch = ({\n  showCounts = true,\n  title,\n  icon,\n  suffixRecord,\n  classValue,\n  isSelected,\n  selectedClassValue,\n  textClassValue,\n  selectedId,\n  iconsOnly,\n  draggingTab,\n  disableAnimation,\n  tabOptions,\n  color = 'light',\n  href,\n  onClick,\n  role,\n  ariaSelected,\n  tabIndex,\n  onKeyDown,\n}: TabSwitchProps) => {\n  const { t } = useTranslation();\n  const childrenProps = {\n    selectedId,\n    isSelected,\n    selectedClassValue,\n    textClassValue,\n    disableAnimation,\n  };\n\n  const ariaProps = {\n    role,\n    'aria-selected': ariaSelected,\n    tabIndex,\n    onKeyDown,\n  };\n\n  const text = (\n    <div className={classNames('flex items-center text-center', draggingTab ? 'opacity-100' : 'opacity-100', !iconsOnly ? 'gap-1.5' : '')}>\n      {icon ? (\n        <div className={isSelected ? 'opacity-100' : `opacity-40 ${color === 'dark' ? 'dark:opacity-100 dark:text-black-100' : ''}`}>\n          {icon}\n        </div>\n      ) : null}\n      <div className={isSelected ? 'opacity-100' : 'opacity-80'}>\n        {iconsOnly ? null : t(title || '')}\n      </div>\n      {title !== 'More...' && suffixRecord?.[title || ''] !== undefined && showCounts ? (\n        <span\n          className={classNames(\n            'ml-2 text-xs leading-[18px] font-normal border rounded-full pr-2 pl-2 border-1',\n            isSelected\n              ? classNames(\n                'text-primary-700 border-primary-200 dark:!border-primary-600 border-1',\n                color === 'dark'\n                  ? 'text-white bg-primary-700'\n                  : 'bg-neutral-100 dark:bg-primary-700 dark:text-white',\n              )\n              : classNames(\n                'text-neutral-500 dark:text-neutral-400 border-neutral-300 dark:border-neutral-500 border-1',\n                color === 'dark'\n                  ? 'bg-neutral-800 dark:bg-neutral-700 dark:border-neutral-800'\n                  : 'bg-neutral-100 dark:bg-transparent',\n              ),\n          )}\n        >\n          {String(suffixRecord?.[title || ''] ?? '0')}\n        </span>\n      ) : null}\n    </div>\n  );\n\n  const sharedClassName = classNames(\n    classValue,\n    draggingTab ? 'opacity-0 cursor-grabbing' : '',\n    'focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:outline-none',\n  );\n\n  const handleLinkClick = (e: MouseEvent<HTMLAnchorElement>) => {\n    if (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0) return;\n    e.preventDefault();\n    onClick?.();\n  };\n\n  if (tabOptions) {\n    return (\n      <div id={`btn-tabs-tabswitch-${title}`} className={sharedClassName} {...ariaProps}>\n        <Children {...childrenProps}>\n          <div className=\"flex items-center gap-1\">\n            {href ? (\n              <a href={href} onClick={handleLinkClick} className=\"contents uppercase\" tabIndex={-1}>\n                {text}\n              </a>\n            ) : (\n              <button type=\"button\" onClick={onClick} className=\"contents uppercase\" tabIndex={-1}>\n                {text}\n              </button>\n            )}\n            {tabOptions}\n          </div>\n        </Children>\n      </div>\n    );\n  }\n\n  if (href) {\n    return (\n      <a\n        id={`btn-tabs-tabswitch-${title}`}\n        href={href}\n        className={sharedClassName}\n        onClick={handleLinkClick}\n        {...ariaProps}\n      >\n        <Children {...childrenProps}>{text}</Children>\n      </a>\n    );\n  }\n\n  return (\n    <button\n      id={`btn-tabs-tabswitch-${title}`}\n      className={sharedClassName}\n      type='button'\n      onClick={onClick}\n      {...ariaProps}\n    >\n      <Children {...childrenProps}>{text}</Children>\n    </button>\n  );\n};\n"],"names":["TabSwitch","showCounts","title","icon","suffixRecord","classValue","isSelected","selectedClassValue","textClassValue","selectedId","iconsOnly","draggingTab","disableAnimation","tabOptions","color","href","onClick","role","ariaSelected","tabIndex","onKeyDown","t","useTranslation","childrenProps","ariaProps","text","jsxs","classNames","jsx","sharedClassName","handleLinkClick","e","Children"],"mappings":"2NAMaA,EAAY,CAAC,CACxB,WAAAC,EAAa,GACb,MAAAC,EACA,KAAAC,EACA,aAAAC,EACA,WAAAC,EACA,WAAAC,EACA,mBAAAC,EACA,eAAAC,EACA,WAAAC,EACA,UAAAC,EACA,YAAAC,EACA,iBAAAC,EACA,WAAAC,EACA,MAAAC,EAAQ,QACR,KAAAC,EACA,QAAAC,EACA,KAAAC,EACA,aAAAC,EACA,SAAAC,EACA,UAAAC,CACF,IAAsB,CACpB,KAAM,CAAE,EAAAC,CAAA,EAAMC,iBAAA,EACRC,EAAgB,CACpB,WAAAd,EACA,WAAAH,EACA,mBAAAC,EACA,eAAAC,EACA,iBAAAI,CAAA,EAGIY,EAAY,CAChB,KAAAP,EACA,gBAAiBC,EACjB,SAAAC,EACA,UAAAC,CAAA,EAGIK,EACJC,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAW,gCAA+C,cAAgCjB,EAAwB,GAAZ,SAAc,EACjI,SAAA,CAAAP,EACCyB,EAAAA,IAAC,MAAA,CAAI,UAAWtB,EAAa,cAAgB,cAAcQ,IAAU,OAAS,uCAAyC,EAAE,GACtH,SAAAX,CAAA,CACH,EACE,KACJyB,EAAAA,IAAC,MAAA,CAAI,UAAWtB,EAAa,cAAgB,aAC1C,SAAAI,EAAY,KAAOW,EAAEnB,GAAS,EAAE,CAAA,CACnC,EACCA,IAAU,WAAaE,IAAeF,GAAS,EAAE,IAAM,QAAaD,EACnE2B,EAAAA,IAAC,OAAA,CACC,UAAWD,EACT,iFACArB,EACIqB,EACA,wEACAb,IAAU,OACN,4BACA,oDAAA,EAEJa,EACA,6FACAb,IAAU,OACN,6DACA,oCAAA,CACN,EAGH,SAAA,OAAOV,IAAeF,GAAS,EAAE,GAAK,GAAG,CAAA,CAAA,EAE1C,IAAA,EACN,EAGI2B,EAAkBF,EACtBtB,EACAM,EAAc,4BAA8B,GAC5C,gFAAA,EAGImB,EAAmBC,GAAqC,CACxDA,EAAE,SAAWA,EAAE,SAAWA,EAAE,UAAYA,EAAE,SAAW,IACzDA,EAAE,eAAA,EACFf,IAAA,EACF,EAEA,OAAIH,QAEC,MAAA,CAAI,GAAI,sBAAsBX,CAAK,GAAI,UAAW2B,EAAkB,GAAGL,EACtE,eAACQ,EAAAA,SAAA,CAAU,GAAGT,EACZ,SAAAG,OAAC,MAAA,CAAI,UAAU,0BACZ,SAAA,CAAAX,EACCa,EAAAA,IAAC,KAAE,KAAAb,EAAY,QAASe,EAAiB,UAAU,qBAAqB,SAAU,GAC/E,SAAAL,CAAA,CACH,EAEAG,EAAAA,IAAC,SAAA,CAAO,KAAK,SAAS,QAAAZ,EAAkB,UAAU,qBAAqB,SAAU,GAC9E,SAAAS,CAAA,CACH,EAEDZ,CAAA,CAAA,CACH,EACF,EACF,EAIAE,EAEAa,EAAAA,IAAC,IAAA,CACC,GAAI,sBAAsB1B,CAAK,GAC/B,KAAAa,EACA,UAAWc,EACX,QAASC,EACR,GAAGN,EAEJ,SAAAI,EAAAA,IAACI,EAAAA,SAAA,CAAU,GAAGT,EAAgB,SAAAE,CAAA,CAAK,CAAA,CAAA,EAMvCG,EAAAA,IAAC,SAAA,CACC,GAAI,sBAAsB1B,CAAK,GAC/B,UAAW2B,EACX,KAAK,SACL,QAAAb,EACC,GAAGQ,EAEJ,SAAAI,EAAAA,IAACI,EAAAA,SAAA,CAAU,GAAGT,EAAgB,SAAAE,CAAA,CAAK,CAAA,CAAA,CAGzC"}
+{"version":3,"file":"TabSwitch.cjs.js","sources":["../../../../src/components/navigation/tabs/TabSwitch.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport type { MouseEvent } from 'react';\nimport { Children } from './Children';\nimport { useTranslation } from 'react-i18next'\nimport type { TabSwitchProps } from './types';\n\nexport const TabSwitch = ({\n  showCounts = true,\n  title,\n  icon,\n  suffixRecord,\n  classValue,\n  isSelected,\n  selectedClassValue,\n  textClassValue,\n  selectedId,\n  iconsOnly,\n  draggingTab,\n  disableAnimation,\n  tabOptions,\n  color = 'light',\n  href,\n  onClick,\n  role,\n  ariaSelected,\n  tabIndex,\n  onKeyDown,\n}: TabSwitchProps) => {\n  const { t } = useTranslation();\n  const childrenProps = {\n    selectedId,\n    isSelected,\n    selectedClassValue,\n    textClassValue,\n    disableAnimation,\n  };\n\n  const ariaProps = {\n    role,\n    'aria-selected': ariaSelected,\n    tabIndex,\n    onKeyDown,\n  };\n\n  const text = (\n    <div className={classNames('flex items-center text-center', draggingTab ? 'opacity-100' : 'opacity-100', !iconsOnly ? 'gap-1.5' : '')}>\n      {icon ? (\n        <div className={isSelected ? 'opacity-100' : `opacity-40 ${color === 'dark' ? 'dark:opacity-100 dark:text-black-100' : ''}`}>\n          {icon}\n        </div>\n      ) : null}\n      <div className={isSelected ? 'opacity-100' : 'opacity-80'}>\n        {iconsOnly ? null : t(title || '')}\n      </div>\n      {title !== 'More...' && suffixRecord?.[title || ''] !== undefined && showCounts ? (\n        <span\n          className={classNames(\n            'ml-2 text-xs leading-4 font-normal border rounded-full pr-2 pl-2 border-1',\n            isSelected\n              ? classNames(\n                'text-primary-700 border-primary-200 dark:!border-primary-600 border-1',\n                color === 'dark'\n                  ? 'text-white bg-primary-700'\n                  : 'bg-neutral-100 dark:bg-primary-700 dark:text-white',\n              )\n              : classNames(\n                'text-neutral-500 dark:text-neutral-400 border-neutral-300 dark:border-neutral-500 border-1',\n                color === 'dark'\n                  ? 'bg-neutral-800 dark:bg-neutral-700 dark:border-neutral-800'\n                  : 'bg-neutral-100 dark:bg-transparent',\n              ),\n          )}\n        >\n          {String(suffixRecord?.[title || ''] ?? '0')}\n        </span>\n      ) : null}\n    </div>\n  );\n\n  const sharedClassName = classNames(\n    classValue,\n    draggingTab ? 'opacity-0 cursor-grabbing' : '',\n    'focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:outline-none',\n  );\n\n  const handleLinkClick = (e: MouseEvent<HTMLAnchorElement>) => {\n    if (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0) return;\n    e.preventDefault();\n    onClick?.();\n  };\n\n  if (tabOptions) {\n    return (\n      <div id={`btn-tabs-tabswitch-${title}`} className={sharedClassName} {...ariaProps}>\n        <Children {...childrenProps}>\n          <div className=\"flex items-center gap-1\">\n            {href ? (\n              <a href={href} onClick={handleLinkClick} className=\"contents uppercase\" tabIndex={-1}>\n                {text}\n              </a>\n            ) : (\n              <button type=\"button\" onClick={onClick} className=\"contents uppercase\" tabIndex={-1}>\n                {text}\n              </button>\n            )}\n            {tabOptions}\n          </div>\n        </Children>\n      </div>\n    );\n  }\n\n  if (href) {\n    return (\n      <a\n        id={`btn-tabs-tabswitch-${title}`}\n        href={href}\n        className={sharedClassName}\n        onClick={handleLinkClick}\n        {...ariaProps}\n      >\n        <Children {...childrenProps}>{text}</Children>\n      </a>\n    );\n  }\n\n  return (\n    <button\n      id={`btn-tabs-tabswitch-${title}`}\n      className={sharedClassName}\n      type='button'\n      onClick={onClick}\n      {...ariaProps}\n    >\n      <Children {...childrenProps}>{text}</Children>\n    </button>\n  );\n};\n"],"names":["TabSwitch","showCounts","title","icon","suffixRecord","classValue","isSelected","selectedClassValue","textClassValue","selectedId","iconsOnly","draggingTab","disableAnimation","tabOptions","color","href","onClick","role","ariaSelected","tabIndex","onKeyDown","t","useTranslation","childrenProps","ariaProps","text","jsxs","classNames","jsx","sharedClassName","handleLinkClick","e","Children"],"mappings":"2NAMaA,EAAY,CAAC,CACxB,WAAAC,EAAa,GACb,MAAAC,EACA,KAAAC,EACA,aAAAC,EACA,WAAAC,EACA,WAAAC,EACA,mBAAAC,EACA,eAAAC,EACA,WAAAC,EACA,UAAAC,EACA,YAAAC,EACA,iBAAAC,EACA,WAAAC,EACA,MAAAC,EAAQ,QACR,KAAAC,EACA,QAAAC,EACA,KAAAC,EACA,aAAAC,EACA,SAAAC,EACA,UAAAC,CACF,IAAsB,CACpB,KAAM,CAAE,EAAAC,CAAA,EAAMC,iBAAA,EACRC,EAAgB,CACpB,WAAAd,EACA,WAAAH,EACA,mBAAAC,EACA,eAAAC,EACA,iBAAAI,CAAA,EAGIY,EAAY,CAChB,KAAAP,EACA,gBAAiBC,EACjB,SAAAC,EACA,UAAAC,CAAA,EAGIK,EACJC,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAW,gCAA+C,cAAgCjB,EAAwB,GAAZ,SAAc,EACjI,SAAA,CAAAP,EACCyB,EAAAA,IAAC,MAAA,CAAI,UAAWtB,EAAa,cAAgB,cAAcQ,IAAU,OAAS,uCAAyC,EAAE,GACtH,SAAAX,CAAA,CACH,EACE,KACJyB,EAAAA,IAAC,MAAA,CAAI,UAAWtB,EAAa,cAAgB,aAC1C,SAAAI,EAAY,KAAOW,EAAEnB,GAAS,EAAE,CAAA,CACnC,EACCA,IAAU,WAAaE,IAAeF,GAAS,EAAE,IAAM,QAAaD,EACnE2B,EAAAA,IAAC,OAAA,CACC,UAAWD,EACT,4EACArB,EACIqB,EACA,wEACAb,IAAU,OACN,4BACA,oDAAA,EAEJa,EACA,6FACAb,IAAU,OACN,6DACA,oCAAA,CACN,EAGH,SAAA,OAAOV,IAAeF,GAAS,EAAE,GAAK,GAAG,CAAA,CAAA,EAE1C,IAAA,EACN,EAGI2B,EAAkBF,EACtBtB,EACAM,EAAc,4BAA8B,GAC5C,gFAAA,EAGImB,EAAmBC,GAAqC,CACxDA,EAAE,SAAWA,EAAE,SAAWA,EAAE,UAAYA,EAAE,SAAW,IACzDA,EAAE,eAAA,EACFf,IAAA,EACF,EAEA,OAAIH,QAEC,MAAA,CAAI,GAAI,sBAAsBX,CAAK,GAAI,UAAW2B,EAAkB,GAAGL,EACtE,eAACQ,EAAAA,SAAA,CAAU,GAAGT,EACZ,SAAAG,OAAC,MAAA,CAAI,UAAU,0BACZ,SAAA,CAAAX,EACCa,EAAAA,IAAC,KAAE,KAAAb,EAAY,QAASe,EAAiB,UAAU,qBAAqB,SAAU,GAC/E,SAAAL,CAAA,CACH,EAEAG,EAAAA,IAAC,SAAA,CAAO,KAAK,SAAS,QAAAZ,EAAkB,UAAU,qBAAqB,SAAU,GAC9E,SAAAS,CAAA,CACH,EAEDZ,CAAA,CAAA,CACH,EACF,EACF,EAIAE,EAEAa,EAAAA,IAAC,IAAA,CACC,GAAI,sBAAsB1B,CAAK,GAC/B,KAAAa,EACA,UAAWc,EACX,QAASC,EACR,GAAGN,EAEJ,SAAAI,EAAAA,IAACI,EAAAA,SAAA,CAAU,GAAGT,EAAgB,SAAAE,CAAA,CAAK,CAAA,CAAA,EAMvCG,EAAAA,IAAC,SAAA,CACC,GAAI,sBAAsB1B,CAAK,GAC/B,UAAW2B,EACX,KAAK,SACL,QAAAb,EACC,GAAGQ,EAEJ,SAAAI,EAAAA,IAACI,EAAAA,SAAA,CAAU,GAAGT,EAAgB,SAAAE,CAAA,CAAK,CAAA,CAAA,CAGzC"}

package/dist/components/navigation/tabs/TabSwitch.es.js

@@ -15,7 +15,7 @@ const A = ({
   iconsOnly: h,
   draggingTab: y,
   disableAnimation: C,
-  tabOptions: x,
+  tabOptions: k,
   color: c = "light",
   href: i,
   onClick: d,
@@ -42,7 +42,7 @@ const A = ({
       "span",
       {
         className: e(
-          "ml-2 text-xs leading-[18px] font-normal border rounded-full pr-2 pl-2 border-1",
+          "ml-2 text-xs leading-4 font-normal border rounded-full pr-2 pl-2 border-1",
           n ? e(
             "text-primary-700 border-primary-200 dark:!border-primary-600 border-1",
             c === "dark" ? "text-white bg-primary-700" : "bg-neutral-100 dark:bg-primary-700 dark:text-white"
@@ -58,19 +58,19 @@ const A = ({
     N,
     y ? "opacity-0 cursor-grabbing" : "",
     "focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:outline-none"
-  ), k = (t) => {
+  ), x = (t) => {
     t.metaKey || t.ctrlKey || t.shiftKey || t.button !== 0 || (t.preventDefault(), d?.());
   };
-  return x ? /* @__PURE__ */ r("div", { id: `btn-tabs-tabswitch-${a}`, className: b, ...o, children: /* @__PURE__ */ r(p, { ...l, children: /* @__PURE__ */ g("div", { className: "flex items-center gap-1", children: [
-    i ? /* @__PURE__ */ r("a", { href: i, onClick: k, className: "contents uppercase", tabIndex: -1, children: s }) : /* @__PURE__ */ r("button", { type: "button", onClick: d, className: "contents uppercase", tabIndex: -1, children: s }),
-    x
+  return k ? /* @__PURE__ */ r("div", { id: `btn-tabs-tabswitch-${a}`, className: b, ...o, children: /* @__PURE__ */ r(p, { ...l, children: /* @__PURE__ */ g("div", { className: "flex items-center gap-1", children: [
+    i ? /* @__PURE__ */ r("a", { href: i, onClick: x, className: "contents uppercase", tabIndex: -1, children: s }) : /* @__PURE__ */ r("button", { type: "button", onClick: d, className: "contents uppercase", tabIndex: -1, children: s }),
+    k
   ] }) }) }) : i ? /* @__PURE__ */ r(
     "a",
     {
       id: `btn-tabs-tabswitch-${a}`,
       href: i,
       className: b,
-      onClick: k,
+      onClick: x,
       ...o,
       children: /* @__PURE__ */ r(p, { ...l, children: s })
     }

package/dist/components/navigation/tabs/TabSwitch.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabSwitch.es.js","sources":["../../../../src/components/navigation/tabs/TabSwitch.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport type { MouseEvent } from 'react';\nimport { Children } from './Children';\nimport { useTranslation } from 'react-i18next'\nimport type { TabSwitchProps } from './types';\n\nexport const TabSwitch = ({\n  showCounts = true,\n  title,\n  icon,\n  suffixRecord,\n  classValue,\n  isSelected,\n  selectedClassValue,\n  textClassValue,\n  selectedId,\n  iconsOnly,\n  draggingTab,\n  disableAnimation,\n  tabOptions,\n  color = 'light',\n  href,\n  onClick,\n  role,\n  ariaSelected,\n  tabIndex,\n  onKeyDown,\n}: TabSwitchProps) => {\n  const { t } = useTranslation();\n  const childrenProps = {\n    selectedId,\n    isSelected,\n    selectedClassValue,\n    textClassValue,\n    disableAnimation,\n  };\n\n  const ariaProps = {\n    role,\n    'aria-selected': ariaSelected,\n    tabIndex,\n    onKeyDown,\n  };\n\n  const text = (\n    <div className={classNames('flex items-center text-center', draggingTab ? 'opacity-100' : 'opacity-100', !iconsOnly ? 'gap-1.5' : '')}>\n      {icon ? (\n        <div className={isSelected ? 'opacity-100' : `opacity-40 ${color === 'dark' ? 'dark:opacity-100 dark:text-black-100' : ''}`}>\n          {icon}\n        </div>\n      ) : null}\n      <div className={isSelected ? 'opacity-100' : 'opacity-80'}>\n        {iconsOnly ? null : t(title || '')}\n      </div>\n      {title !== 'More...' && suffixRecord?.[title || ''] !== undefined && showCounts ? (\n        <span\n          className={classNames(\n            'ml-2 text-xs leading-[18px] font-normal border rounded-full pr-2 pl-2 border-1',\n            isSelected\n              ? classNames(\n                'text-primary-700 border-primary-200 dark:!border-primary-600 border-1',\n                color === 'dark'\n                  ? 'text-white bg-primary-700'\n                  : 'bg-neutral-100 dark:bg-primary-700 dark:text-white',\n              )\n              : classNames(\n                'text-neutral-500 dark:text-neutral-400 border-neutral-300 dark:border-neutral-500 border-1',\n                color === 'dark'\n                  ? 'bg-neutral-800 dark:bg-neutral-700 dark:border-neutral-800'\n                  : 'bg-neutral-100 dark:bg-transparent',\n              ),\n          )}\n        >\n          {String(suffixRecord?.[title || ''] ?? '0')}\n        </span>\n      ) : null}\n    </div>\n  );\n\n  const sharedClassName = classNames(\n    classValue,\n    draggingTab ? 'opacity-0 cursor-grabbing' : '',\n    'focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:outline-none',\n  );\n\n  const handleLinkClick = (e: MouseEvent<HTMLAnchorElement>) => {\n    if (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0) return;\n    e.preventDefault();\n    onClick?.();\n  };\n\n  if (tabOptions) {\n    return (\n      <div id={`btn-tabs-tabswitch-${title}`} className={sharedClassName} {...ariaProps}>\n        <Children {...childrenProps}>\n          <div className=\"flex items-center gap-1\">\n            {href ? (\n              <a href={href} onClick={handleLinkClick} className=\"contents uppercase\" tabIndex={-1}>\n                {text}\n              </a>\n            ) : (\n              <button type=\"button\" onClick={onClick} className=\"contents uppercase\" tabIndex={-1}>\n                {text}\n              </button>\n            )}\n            {tabOptions}\n          </div>\n        </Children>\n      </div>\n    );\n  }\n\n  if (href) {\n    return (\n      <a\n        id={`btn-tabs-tabswitch-${title}`}\n        href={href}\n        className={sharedClassName}\n        onClick={handleLinkClick}\n        {...ariaProps}\n      >\n        <Children {...childrenProps}>{text}</Children>\n      </a>\n    );\n  }\n\n  return (\n    <button\n      id={`btn-tabs-tabswitch-${title}`}\n      className={sharedClassName}\n      type='button'\n      onClick={onClick}\n      {...ariaProps}\n    >\n      <Children {...childrenProps}>{text}</Children>\n    </button>\n  );\n};\n"],"names":["TabSwitch","showCounts","title","icon","suffixRecord","classValue","isSelected","selectedClassValue","textClassValue","selectedId","iconsOnly","draggingTab","disableAnimation","tabOptions","color","href","onClick","role","ariaSelected","tabIndex","onKeyDown","t","useTranslation","childrenProps","ariaProps","text","jsxs","classNames","jsx","sharedClassName","handleLinkClick","e","Children"],"mappings":"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"}
+{"version":3,"file":"TabSwitch.es.js","sources":["../../../../src/components/navigation/tabs/TabSwitch.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport type { MouseEvent } from 'react';\nimport { Children } from './Children';\nimport { useTranslation } from 'react-i18next'\nimport type { TabSwitchProps } from './types';\n\nexport const TabSwitch = ({\n  showCounts = true,\n  title,\n  icon,\n  suffixRecord,\n  classValue,\n  isSelected,\n  selectedClassValue,\n  textClassValue,\n  selectedId,\n  iconsOnly,\n  draggingTab,\n  disableAnimation,\n  tabOptions,\n  color = 'light',\n  href,\n  onClick,\n  role,\n  ariaSelected,\n  tabIndex,\n  onKeyDown,\n}: TabSwitchProps) => {\n  const { t } = useTranslation();\n  const childrenProps = {\n    selectedId,\n    isSelected,\n    selectedClassValue,\n    textClassValue,\n    disableAnimation,\n  };\n\n  const ariaProps = {\n    role,\n    'aria-selected': ariaSelected,\n    tabIndex,\n    onKeyDown,\n  };\n\n  const text = (\n    <div className={classNames('flex items-center text-center', draggingTab ? 'opacity-100' : 'opacity-100', !iconsOnly ? 'gap-1.5' : '')}>\n      {icon ? (\n        <div className={isSelected ? 'opacity-100' : `opacity-40 ${color === 'dark' ? 'dark:opacity-100 dark:text-black-100' : ''}`}>\n          {icon}\n        </div>\n      ) : null}\n      <div className={isSelected ? 'opacity-100' : 'opacity-80'}>\n        {iconsOnly ? null : t(title || '')}\n      </div>\n      {title !== 'More...' && suffixRecord?.[title || ''] !== undefined && showCounts ? (\n        <span\n          className={classNames(\n            'ml-2 text-xs leading-4 font-normal border rounded-full pr-2 pl-2 border-1',\n            isSelected\n              ? classNames(\n                'text-primary-700 border-primary-200 dark:!border-primary-600 border-1',\n                color === 'dark'\n                  ? 'text-white bg-primary-700'\n                  : 'bg-neutral-100 dark:bg-primary-700 dark:text-white',\n              )\n              : classNames(\n                'text-neutral-500 dark:text-neutral-400 border-neutral-300 dark:border-neutral-500 border-1',\n                color === 'dark'\n                  ? 'bg-neutral-800 dark:bg-neutral-700 dark:border-neutral-800'\n                  : 'bg-neutral-100 dark:bg-transparent',\n              ),\n          )}\n        >\n          {String(suffixRecord?.[title || ''] ?? '0')}\n        </span>\n      ) : null}\n    </div>\n  );\n\n  const sharedClassName = classNames(\n    classValue,\n    draggingTab ? 'opacity-0 cursor-grabbing' : '',\n    'focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:outline-none',\n  );\n\n  const handleLinkClick = (e: MouseEvent<HTMLAnchorElement>) => {\n    if (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0) return;\n    e.preventDefault();\n    onClick?.();\n  };\n\n  if (tabOptions) {\n    return (\n      <div id={`btn-tabs-tabswitch-${title}`} className={sharedClassName} {...ariaProps}>\n        <Children {...childrenProps}>\n          <div className=\"flex items-center gap-1\">\n            {href ? (\n              <a href={href} onClick={handleLinkClick} className=\"contents uppercase\" tabIndex={-1}>\n                {text}\n              </a>\n            ) : (\n              <button type=\"button\" onClick={onClick} className=\"contents uppercase\" tabIndex={-1}>\n                {text}\n              </button>\n            )}\n            {tabOptions}\n          </div>\n        </Children>\n      </div>\n    );\n  }\n\n  if (href) {\n    return (\n      <a\n        id={`btn-tabs-tabswitch-${title}`}\n        href={href}\n        className={sharedClassName}\n        onClick={handleLinkClick}\n        {...ariaProps}\n      >\n        <Children {...childrenProps}>{text}</Children>\n      </a>\n    );\n  }\n\n  return (\n    <button\n      id={`btn-tabs-tabswitch-${title}`}\n      className={sharedClassName}\n      type='button'\n      onClick={onClick}\n      {...ariaProps}\n    >\n      <Children {...childrenProps}>{text}</Children>\n    </button>\n  );\n};\n"],"names":["TabSwitch","showCounts","title","icon","suffixRecord","classValue","isSelected","selectedClassValue","textClassValue","selectedId","iconsOnly","draggingTab","disableAnimation","tabOptions","color","href","onClick","role","ariaSelected","tabIndex","onKeyDown","t","useTranslation","childrenProps","ariaProps","text","jsxs","classNames","jsx","sharedClassName","handleLinkClick","e","Children"],"mappings":"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"}

package/dist/components/navigation/tabs/Tabs.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),v=require("@dnd-kit/core"),ne=require("@dnd-kit/sortable"),we=require("antd"),c=require("../../../_virtual/index.cjs.js"),a=require("react"),Dt=require("react-i18next"),Je=require("@mui/icons-material/MoreHorizOutlined"),Vt=require("./types.cjs.js"),Mt=require("../../../utils/formatters.cjs.js"),Lt=require("../../../providers/design-system-provider/hooks.cjs.js"),qt=require("../../../hooks/useTextWidth.cjs.js"),Rt=require("../../button/IconButton.cjs.js"),S=require("../../buttons/option-button/OptionButton.cjs.js"),Bt=require("../../forms/search-bar/SearchBar.cjs.js"),ke=require("../../tooltip/Tooltip.cjs.js"),Ht=require("../../icons/EditIcon.cjs.js"),Ut=require("react-toastify"),ye=require("./TabSwitch.cjs.js"),k=require("../../icon/icons.generated.cjs.js"),Qe=require("./SortableTab.cjs.js"),zt=require("./DropableWrapper.cjs.js"),Wt=require("./MoreButton.cjs.js"),Pt=require("./TabOptions.cjs.js"),Ft=require("./TabDragOverlay.cjs.js"),$t=()=>Math.random().toString(16).slice(2,13),se=["[&_.ant-dropdown-menu-item]:!outline-none","[&_.ant-dropdown-menu-submenu-title]:!outline-none","[&_.ant-dropdown-menu-item:focus-visible_.option-button-inner]:ring-2","[&_.ant-dropdown-menu-item:focus-visible_.option-button-inner]:ring-primary-500","[&_.ant-dropdown-menu-item:focus-visible_.option-button-inner]:bg-gray-50","[&_.ant-dropdown-menu-item:focus-visible_.option-button-inner]:dark:bg-black-600","[&_.ant-dropdown-menu-submenu-title:focus-visible_.option-button-inner]:ring-2","[&_.ant-dropdown-menu-submenu-title:focus-visible_.option-button-inner]:ring-primary-500","[&_.ant-dropdown-menu-submenu-title:focus-visible_.option-button-inner]:bg-gray-50","[&_.ant-dropdown-menu-submenu-title:focus-visible_.option-button-inner]:dark:bg-black-600"].join(" ");let Se=null;const Te=T=>{T?(Se=document.activeElement,setTimeout(()=>{document.querySelector(".row-option-cell .ant-dropdown-menu-item:not(.ant-dropdown-menu-item-disabled), .row-option-cell .ant-dropdown-menu-submenu-title")?.focus()},50)):setTimeout(()=>{Se?.focus(),Se=null},0)},d={SELECT:"Select",MOVE_LEFT:"MoveLeft",MOVE_RIGHT:"MoveRight",HIDE:"Hide",UNHIDE:"Unhide",COPY_LINK:"CopyLink",DELETE:"Delete",PIN:"Pin",UNPIN:"Unpin",EDIT:"Edit"},At=({variant:T="default",tabs:O=[],activeTab:i,onTabClick:Xe,suffixRecord:P,isLoading:Ze,size:_="md",className:Ce,draggable:E=!1,showAllItems:F=!1,copyLink:Ke=!1,isDisabled:et=!1,color:ae="light",iconsOnly:tt=!1,tabIcons:oe={},height:nt="h-6",fullWidth:re=!1,fitContentWidth:st=!1,disableAnimation:at=!1,onEdit:je,onDelete:Ie,onCopyLink:Ne,allowPin:C=!1,isFullWidth:$=!1,rightSection:L,initialTabs:ot,tabConfig:rt,onTabConfigChange:ve,onTabsChange:Oe,parentContainer:it=document.body,tabKey:j,linkConfig:x,showTabOptions:lt=!0})=>{const g=Lt.useTabConfig(),_e=j?g?.getTabSettings(j):void 0,ie=ot??_e?.tab_items,A=rt??_e?.tab_options,[le,ct]=a.useState(""),[N,G]=a.useState(!1),[q,dt]=a.useState(0),[u,ce]=a.useState([]),[Y,ut]=a.useState([]),[pt,J]=a.useState(null),[D,Q]=a.useState(null),[xt,Ee]=a.useState(!1),[De,Ve]=a.useState(A??Vt.INITIAL_TAB_OPTION_CONFIG),[de,bt]=a.useState(""),[Me,mt]=a.useState("contains"),{showCounts:y,lockOrder:R,sortOrder:ue}=De,{t:p}=Dt.useTranslation(),X=a.useRef(null),ft=a.useRef(null),Le=a.useRef(q),{measureText:B}=qt.useTextWidth(),H=a.useMemo(()=>$t(),[]),ht=v.useSensors(v.useSensor(v.MouseSensor,{activationConstraint:{distance:5}}),v.useSensor(v.TouchSensor,{activationConstraint:{delay:300,tolerance:5}})),b=a.useMemo(()=>P&&Object.fromEntries(Object.entries(P).map(([e,t])=>[e,Mt.formatCount(t)])),[P]),qe=a.useMemo(()=>Y.filter(({is_hidden:e})=>!e),[Y]),V=a.useMemo(()=>Y.filter(({is_hidden:e})=>e),[Y]),Re=a.useMemo(()=>qe.filter(({name:e})=>{if(!de)return!0;const t=(e??"").toLowerCase(),s=de.toLowerCase();return Me==="contains"?t.includes(s):!t.includes(s)}),[qe,de,Me]),r=a.useMemo(()=>[...Re].sort((e,t)=>e.is_pinned&&!t.is_pinned?-1:!e.is_pinned&&t.is_pinned?1:0),[Re]),gt=q<r.length,Z=F?r.length:gt?q:r.length,Be=r.findIndex(e=>e.name===i)>=Z,He=u.length-Z-(Be?1:0);Le.current=q;const U=a.useCallback(e=>{ce(e),Oe?.(e),j&&g?.persistTabSettings&&g.persistTabSettings({tab_type:j,tab_items:e})},[Oe,j,g]),wt=a.useCallback(e=>{Ve(e),ve?.(e),j&&g?.persistTabSettings&&g.persistTabSettings({tab_type:j,tab_options:e})},[ve,j,g]),Ue=e=>e.is_pinned?32:0,pe=a.useCallback(e=>{if(!e)return;const t=E?30:0,s=y?190:84,l=_==="sm"?4:8,o=32;let m=0,ee=0,w=0;const f=e-(L?.width||0)-t,Fe=Le.current,$e=Fe<r.length,Ae=V.length>0;for(let h=0;h<r.length;h++){const I=r[h],te=b?.[I.name]?String(b?.[I.name]):"",fe=y&&te?B(te,{fontSize:"16px",fontWeight:"500",fontFamily:"Inter, system-ui, -apple-system, sans-serif"})+18+2:0,he=B(I?.name||"",{fontSize:"16px",fontWeight:"600",fontFamily:"Inter, system-ui, -apple-system, sans-serif"}),ge=C?Ue(I):0,Ye=he+fe+o+l+ge;if(I.name===i&&(ee=Ye),m+=Ye,f>m+($e||Ae?s:0)+h*25)w=h+1;else break}const Ge=r.length-w;if(Ge+V.length===1&&V.length===0&&Ge===1&&w<r.length){const h=r[w];if(h){const I=b?.[h.name]?String(b?.[h.name]):"",te=y&&I?B(I,{fontSize:"16px",fontWeight:"500",fontFamily:"Inter, system-ui, -apple-system, sans-serif"})+18+2:0,fe=B(h?.name||"",{fontSize:"16px",fontWeight:"600",fontFamily:"Inter, system-ui, -apple-system, sans-serif"}),he=C?Ue(h):0,ge=fe+te+o+l+he;f>=m+ge&&(w+=1)}}const Et=F?r.length:w;r.findIndex(h=>h.name===i)>=Et&&(m+=ee,f<m+($e||Ae?s:0)&&(w=Math.max(w-1,0))),w!==Fe&&dt(w)},[r,y,F,C,b,L?.width,i,_,E,V.length,B]),xe=a.useCallback(()=>{if(typeof window<"u")return new URLSearchParams(window.location.search);if(x&&g?.getSearchParam){const e=new URLSearchParams,t=g.getSearchParam(x.key);return t&&e.set(x.key,t),e}return new URLSearchParams},[x,g]),be=a.useCallback((e,t)=>(x&&(t===x.defaultLink?e.delete(x.key):e.set(x.key,t),x.onResolve?.(e)),e),[x]),z=a.useCallback(e=>x?`?${be(xe(),e).toString()}`:void 0,[be,xe,x]),kt=Ke||!!x,yt=a.useCallback(async e=>{const t=z(e),s=typeof window<"u"?window.location.origin:"",l=typeof window<"u"?window.location.pathname:"",o=t?`${s}${l}${t}`:`${s}${l}`;await navigator.clipboard.writeText(o),Ut.toast.success(p("Link copied to clipboard"),{toastId:"Link copied to clipboard"}),Ne?.(e,o)},[z,p,Ne]),W=e=>{if(G(!1),Xe?.(e),x&&g?.navigate){const t=be(xe(),e);g.navigate(`?${t.toString()}`)}},ze=e=>{if(r.length<=1)return;const t=u.map(o=>o.name===e?{...o,is_hidden:!0}:o),s=r.findIndex(o=>o.name===e),l=s===0?1:s-1;W(r[l].name),U(t)},St=e=>{const t=u.map(s=>s.name===e?{...s,is_hidden:!1}:s);G(!1),U(t)},K=e=>{if(!C)return;const t=u.map(s=>s.name===e?{...s,is_pinned:!s.is_pinned}:s);U(t)},We=(e,t)=>{const s=u.findIndex(({name:o})=>o===e),l=t==="left"?s-(u[s-1]?.name===i?2:1):s+1;U(ne.arrayMove(u,s,l))},Pe=()=>G(!N),Tt=e=>Q(e.active.id),Ct=e=>{const{active:t,over:s}=e;if(s?.id==="more-tabs"){ze(t.id),Q(null),J(null);return}const l=u.findIndex(({name:m})=>m===t.id),o=u.findIndex(({name:m})=>m===s?.id);U(ne.arrayMove(u,l,o)),Q(null),J(null)},jt=()=>{Q(null),J(null)},It=e=>{J(e.over?.id==="more-tabs"?"more-tabs":null)},Nt=()=>{},vt=(e,t)=>{bt(e),mt(t)},me=(e,t=!1,s=!1)=>{const o=u.find(f=>f.name===e)?.is_pinned,m=[{label:n.jsx(S.OptionButton,{icon:n.jsx(k.ArrowOutwardIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Select Tab"),className:"text-black-900 dark:text-white"}),key:d.SELECT,onClick:()=>W(e)},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.ArrowUpwardIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Move Up"),isDisabled:R,className:"text-black-900 dark:text-white"}),key:d.MOVE_LEFT,disabled:R,onClick:()=>We(e,"left")},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.ArrowDownwardIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Move Down"),isDisabled:R,className:"text-black-900 dark:text-white"}),key:d.MOVE_RIGHT,disabled:R,onClick:()=>We(e,"right")},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.ContentCopyIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Copy Link"),className:"text-black-900 dark:text-white"}),key:d.COPY_LINK,onClick:()=>yt(e)},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.VisibilityOffIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Hide"),className:"text-black-900 dark:text-white"}),key:d.HIDE,onClick:()=>ze(e)},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.VisibilityIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Unhide"),className:"text-black-900 dark:text-white"}),key:d.UNHIDE,onClick:()=>St(e)},{label:n.jsx(S.OptionButton,{icon:o?n.jsx(k.UnpinFilledIcon,{size:20,className:"rotate-12 text-inherit dark:text-inherit"}):n.jsx(k.PinIcon,{size:20,className:"rotate-45 text-inherit dark:text-inherit"}),text:p(o?"Unpin":"Pin"),className:"text-black-900 dark:text-white",notVisible:!C}),key:o?d.UNPIN:d.PIN,onClick:()=>K(e)},{label:n.jsx(S.OptionButton,{className:"text-black-900 dark:text-white",icon:n.jsx(Ht.EditIcon,{}),text:p("Edit"),notVisible:!je}),key:d.EDIT,onClick:()=>je?.(e)},{label:n.jsx(S.OptionButton,{className:"text-error-600 dark:text-error-600",icon:n.jsx(k.DeleteIcon,{size:18,className:"text-error-600 dark:text-error-600"}),text:p("Delete"),notVisible:!Ie}),key:d.DELETE,onClick:()=>Ie?.(e)}],ee=[d.HIDE,d.UNHIDE],w=[d.SELECT,d.MOVE_LEFT,d.MOVE_RIGHT,d.UNHIDE];return m.filter(f=>t?f.key===d.UNHIDE:s?!ee.includes(f.key):!w.includes(f.key)).filter(f=>kt?!0:f.key!==d.COPY_LINK).filter(f=>r.length===1?f.key!==d.HIDE:!0)},M=(e,t)=>({classValue:{default:c("relative inline-flex pt-2 pb-3 px-2 pl-3 sm:px-2 rounded-t-sm group"),secondary:c("flex w-full sm:w-auto relative rounded-lg font-sans font-semibold text-center cursor-pointer uppercase",_==="sm"?"py-1 px-3 text-sm":"py-2 px-4 text-base")},selectedClassValue:{default:c("absolute left-0 bottom-0 w-full h-[3px] bg-primary-600"),secondary:c("absolute inset-0 bg-primary-50 dark:bg-primary-975 rounded-lg")},textClassValue:{default:c("relative uppercase font-sans font-semibold text-sm whitespace-nowrap",t?"text-primary-600 dark:text-primary-500":"text-neutral-400 hover:text-neutral-500 dark:text-neutral-100 dark:hover:text-white"),secondary:c("relative whitespace-nowrap text-sm",t?"text-primary-600 dark:text-primary-500":"text-neutral-400 dark:text-neutral-400")}})[e][T];a.useEffect(()=>{if(!X.current||T==="switch")return;const e=new ResizeObserver(t=>{const s=t[0].contentRect.width;pe(s)});return e.observe(X.current),pe(X.current.clientWidth),()=>e.disconnect()},[pe,T]);const Ot=JSON.stringify(O),_t=JSON.stringify(ie?.map(({name:e})=>e));return a.useEffect(()=>{if(ie?.length){let e=[...ie];O.forEach(t=>{e.find(s=>s.name===t)||e.push({name:t,is_default:!1,is_hidden:!1,is_pinned:!1})}),e=e.filter((t,s,l)=>O.includes(t.name)&&s===l.findIndex(o=>o.name===t.name)),ce(e)}else ce(O.map(e=>({name:e,is_default:!1,is_hidden:!1,is_pinned:!1})).filter((e,t,s)=>t===s.findIndex(l=>l.name===e.name)))},[Ot,_t]),a.useEffect(()=>{A&&Ve(A)},[A]),a.useEffect(()=>{if(!u.length)return;const e=[...u];ue==="asc"?e.sort((t,s)=>t.name.localeCompare(s.name)):ue==="desc"&&e.sort((t,s)=>s.name.localeCompare(t.name)),ut(e)},[u,ue]),a.useEffect(()=>{Te(N)},[N]),T==="switch"?n.jsx("div",{className:c("inline",Ce),children:n.jsx("ul",{role:"tablist","aria-orientation":"horizontal",className:c("inline-flex grow-0 p-1 rounded-lg",ae==="dark"?"border-[1.5px] border-neutral-800 bg-neutral-800 dark:border-black-800":"bg-neutral-100 dark:bg-black-700",re?"w-full":"w-auto"),children:O.map(e=>{const t=i===e,s=oe?.[e],l=u.find(m=>m.name===e),o=C&&l?.is_pinned;return n.jsx("li",{role:"presentation",className:c("inline-flex",re?"w-full":"w-auto"),children:n.jsx(ye.TabSwitch,{title:e,showCounts:y,role:"tab",ariaSelected:t,tabIndex:0,icon:o?n.jsx(ke,{title:"Unpin",children:n.jsx("span",{onClick:()=>K(e),children:n.jsx(k.PinIcon,{size:20,className:"rotate-45 text-inherit dark:text-inherit"})})}):s,iconsOnly:tt,classValue:c("relative py-0.5 border-gray-200",nt,re?"w-full flex items-center justify-center":"px-3"),selectedClassValue:c("absolute inset-0 rounded-md z-0",ae==="dark"?"bg-neutral-900":"bg-white dark:bg-black-800"),textClassValue:c("relative text-xs font-semibold font-sans whitespace-nowrap",t?"text-neutral-900 dark:text-neutral-100":"text-neutral-700 dark:text-neutral-100"),isSelected:t,href:z(e),onClick:et?void 0:()=>W(e),suffixRecord:b,selectedId:H,color:ae,disableAnimation:at})},e)})})}):n.jsx("div",{ref:X,className:c(st?"w-fit":"w-full"),onMouseEnter:()=>Ee(!0),onMouseLeave:()=>Ee(!1),children:n.jsxs(v.DndContext,{sensors:ht,onDragEnd:Ct,onDragStart:Tt,onDragCancel:jt,collisionDetection:v.closestCenter,onDragOver:It,children:[n.jsxs("ul",{role:"tablist","aria-orientation":"horizontal",className:c("flex items-center w-full",Ce,$?"gap-0":_==="sm"?"gap-1":"gap-2"),ref:ft,children:[Ze?n.jsx("div",{className:"skeleton bg-neutral-300 dark:bg-black-700 animate-pulse h-10 min-w-[100px] w-full rounded"}):n.jsxs(ne.SortableContext,{items:r.map(({name:e})=>e),strategy:ne.horizontalListSortingStrategy,id:"sortable",disabled:!E||R,children:[r.slice(0,Z).map(({name:e,is_pinned:t})=>{const s=i===e&&!N,l=C&&t;return n.jsx(Qe.SortableTab,{title:e,isDragging:D===e,className:$?"flex-1 flex justify-center":"",children:n.jsx("li",{role:"presentation",className:c($?"w-full flex":"sm:mr-2"),children:n.jsx(ye.TabSwitch,{showCounts:y,title:e,role:"tab",ariaSelected:s,tabIndex:0,classValue:c(M("classValue",s),$?"w-full justify-center":""),selectedClassValue:M("selectedClassValue",s),textClassValue:M("textClassValue",s),isSelected:s,tabOptions:s&&E?n.jsx(we.Dropdown,{menu:{items:me(e),className:se},trigger:["click"],onOpenChange:Te,overlayClassName:"row-option-cell",rootClassName:"",openClassName:"max-h-[350px] overflow-y-auto",placement:"bottom",children:n.jsx(Rt,{tooltip:p("More"),variant:"ghost",className:"!text-primary-500 hover:!bg-primary-100 dark:hover:!bg-primary-900",children:n.jsx(Je,{sx:{fontSize:20}})})}):null,draggingTab:D===e,href:z(e),onClick:()=>W(e),suffixRecord:b,selectedId:H,icon:l?n.jsx(ke,{title:p("Unpin"),children:n.jsx("span",{onClick:()=>K(e),children:n.jsx(k.PinIcon,{size:20,className:"rotate-45 text-inherit dark:text-inherit"})})}):oe?.[e]??null})},e)},e)}),i&&Be?n.jsx(Qe.SortableTab,{title:i,isDragging:D===i,children:n.jsx("li",{role:"presentation",className:c("sm:mr-2"),children:n.jsx(ye.TabSwitch,{showCounts:y,title:i,role:"tab",ariaSelected:!0,tabIndex:0,classValue:M("classValue",!0),selectedClassValue:M("selectedClassValue",!0),textClassValue:M("textClassValue",!0),isSelected:!0,tabOptions:E?n.jsx(we.Dropdown,{menu:{items:me(i),className:se},trigger:["click"],onOpenChange:Te,overlayClassName:"row-option-cell",rootClassName:"",openClassName:"max-h-[350px] overflow-y-auto",placement:"bottom",children:n.jsx(Je,{sx:{fontSize:20},className:"text-primary-600"})}):null,draggingTab:D===i,href:z(i),suffixRecord:b,selectedId:H,icon:C&&u.find(e=>e.name===i)?.is_pinned?n.jsx(ke,{title:p("Pinned"),children:n.jsx("span",{onClick:()=>K(i),children:n.jsx(k.PinIcon,{size:20,className:"rotate-45 text-inherit dark:text-inherit"})})}):oe?.[i]??null})},i)},i):null,(q<r.length&&!F||V.length>0)&&He>0?n.jsx(zt.DropableWrapper,{id:"more-tabs",children:n.jsx(we.Dropdown,{overlayStyle:{maxHeight:"calc(100vh - 350px)",overflow:"auto",marginTop:"8px",scrollbarWidth:"none",borderRadius:8,boxShadow:"0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05)"},onOpenChange:()=>Pe(),open:N,menu:{items:[{key:"Search",disabled:!0,style:{minWidth:"190px",marginBottom:"8px"},label:n.jsx("div",{className:"px-2 bg-white dark:bg-black-800",children:n.jsx(Bt.SearchBar,{id:"search-bar-more-tabs",value:le,classValues:"!rounded-lg",onChange:e=>ct(e)})})},...r.slice(Z).filter(e=>e.name!==i).concat(V).filter(({name:e})=>typeof e=="string"&&(e??"").toLowerCase().includes(le.toLowerCase())).map(({name:e,is_hidden:t})=>({key:e,label:n.jsx(S.OptionButton,{className:c("uppercase",t?"text-neutral-400 dark:text-neutral-500":"text-black-900 dark:text-black-200"),text:e,suffixRecord:y?b:{},highlight:le,truncateText:!0,isDisabled:t,onClick:t?void 0:()=>{W(e),G(!1)}}),popupClassName:se,children:N?me(e,t,!0):null}))],className:se},openClassName:"max-h-[350px] overflow-y-auto",trigger:["click"],overlayClassName:"row-option-cell",placement:"bottomRight",getPopupContainer:e=>e.parentElement,children:n.jsx(Wt.MoreButton,{title:`${y?He:""} MORE...`,variant:T,size:_,draggingOver:pt,suffixRecord:b,handleShowMoreDropdown:Pe,selectedId:H,showMoreDropdown:N})})}):null]}),L?n.jsx("div",{className:c(L?.className),children:n.jsx("li",{children:L.component})}):null,E&&lt&&n.jsx("li",{className:c(xt?"opacity-100":"opacity-0","transition-opacity duration-300"),children:n.jsx(Pt.TabOptions,{hasSuffixRecord:!!(b&&Object.keys(b).length>0),savedConfig:De,onApplyFilter:e=>wt(e),setUnsavedChanges:()=>{},handleTabSort:Nt,onSearchChange:vt})})]}),D?n.jsx(Ft.TabDragOverlay,{draggingTab:D,suffixRecord:b,size:_,variant:T,selectedId:H,parentContainer:it}):null]})})};exports.Tabs=At;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),v=require("@dnd-kit/core"),ne=require("@dnd-kit/sortable"),we=require("antd"),c=require("../../../_virtual/index.cjs.js"),a=require("react"),Dt=require("react-i18next"),Je=require("@mui/icons-material/MoreHorizOutlined"),Vt=require("./types.cjs.js"),Mt=require("../../../utils/formatters.cjs.js"),Lt=require("../../../providers/design-system-provider/hooks.cjs.js"),qt=require("../../../hooks/useTextWidth.cjs.js"),Rt=require("../../button/IconButton.cjs.js"),S=require("../../buttons/option-button/OptionButton.cjs.js"),Bt=require("../../forms/search-bar/SearchBar.cjs.js"),ke=require("../../tooltip/Tooltip.cjs.js"),Ht=require("../../icons/EditIcon.cjs.js"),Ut=require("react-toastify"),ye=require("./TabSwitch.cjs.js"),k=require("../../icon/icons.generated.cjs.js"),Qe=require("./SortableTab.cjs.js"),zt=require("./DropableWrapper.cjs.js"),Wt=require("./MoreButton.cjs.js"),Pt=require("./TabOptions.cjs.js"),Ft=require("./TabDragOverlay.cjs.js"),$t=()=>Math.random().toString(16).slice(2,13),se=["[&_.ant-dropdown-menu-item]:!outline-none","[&_.ant-dropdown-menu-submenu-title]:!outline-none","[&_.ant-dropdown-menu-item:focus-visible_.option-button-inner]:ring-2","[&_.ant-dropdown-menu-item:focus-visible_.option-button-inner]:ring-primary-500","[&_.ant-dropdown-menu-item:focus-visible_.option-button-inner]:bg-gray-50","[&_.ant-dropdown-menu-item:focus-visible_.option-button-inner]:dark:bg-black-600","[&_.ant-dropdown-menu-submenu-title:focus-visible_.option-button-inner]:ring-2","[&_.ant-dropdown-menu-submenu-title:focus-visible_.option-button-inner]:ring-primary-500","[&_.ant-dropdown-menu-submenu-title:focus-visible_.option-button-inner]:bg-gray-50","[&_.ant-dropdown-menu-submenu-title:focus-visible_.option-button-inner]:dark:bg-black-600"].join(" ");let Se=null;const Te=T=>{T?(Se=document.activeElement,setTimeout(()=>{document.querySelector(".row-option-cell .ant-dropdown-menu-item:not(.ant-dropdown-menu-item-disabled), .row-option-cell .ant-dropdown-menu-submenu-title")?.focus()},50)):setTimeout(()=>{Se?.focus(),Se=null},0)},d={SELECT:"Select",MOVE_LEFT:"MoveLeft",MOVE_RIGHT:"MoveRight",HIDE:"Hide",UNHIDE:"Unhide",COPY_LINK:"CopyLink",DELETE:"Delete",PIN:"Pin",UNPIN:"Unpin",EDIT:"Edit"},At=({variant:T="default",tabs:O=[],activeTab:i,onTabClick:Xe,suffixRecord:P,isLoading:Ze,size:_="md",className:Ce,draggable:E=!1,showAllItems:F=!1,copyLink:Ke=!1,isDisabled:et=!1,color:ae="light",iconsOnly:tt=!1,tabIcons:oe={},height:nt="h-6",fullWidth:re=!1,fitContentWidth:st=!1,disableAnimation:at=!1,onEdit:je,onDelete:Ie,onCopyLink:Ne,allowPin:C=!1,isFullWidth:$=!1,rightSection:L,initialTabs:ot,tabConfig:rt,onTabConfigChange:ve,onTabsChange:Oe,parentContainer:it=document.body,tabKey:j,linkConfig:x,showTabOptions:lt=!0})=>{const g=Lt.useTabConfig(),_e=j?g?.getTabSettings(j):void 0,ie=ot??_e?.tab_items,A=rt??_e?.tab_options,[le,ct]=a.useState(""),[N,G]=a.useState(!1),[q,dt]=a.useState(0),[u,ce]=a.useState([]),[Y,ut]=a.useState([]),[pt,J]=a.useState(null),[D,Q]=a.useState(null),[xt,Ee]=a.useState(!1),[De,Ve]=a.useState(A??Vt.INITIAL_TAB_OPTION_CONFIG),[de,bt]=a.useState(""),[Me,mt]=a.useState("contains"),{showCounts:y,lockOrder:R,sortOrder:ue}=De,{t:p}=Dt.useTranslation(),X=a.useRef(null),ft=a.useRef(null),Le=a.useRef(q),{measureText:B}=qt.useTextWidth(),H=a.useMemo(()=>$t(),[]),ht=v.useSensors(v.useSensor(v.MouseSensor,{activationConstraint:{distance:5}}),v.useSensor(v.TouchSensor,{activationConstraint:{delay:300,tolerance:5}})),b=a.useMemo(()=>P&&Object.fromEntries(Object.entries(P).map(([e,t])=>[e,Mt.formatCount(t)])),[P]),qe=a.useMemo(()=>Y.filter(({is_hidden:e})=>!e),[Y]),V=a.useMemo(()=>Y.filter(({is_hidden:e})=>e),[Y]),Re=a.useMemo(()=>qe.filter(({name:e})=>{if(!de)return!0;const t=(e??"").toLowerCase(),s=de.toLowerCase();return Me==="contains"?t.includes(s):!t.includes(s)}),[qe,de,Me]),r=a.useMemo(()=>[...Re].sort((e,t)=>e.is_pinned&&!t.is_pinned?-1:!e.is_pinned&&t.is_pinned?1:0),[Re]),gt=q<r.length,Z=F?r.length:gt?q:r.length,Be=r.findIndex(e=>e.name===i)>=Z,He=u.length-Z-(Be?1:0);Le.current=q;const U=a.useCallback(e=>{ce(e),Oe?.(e),j&&g?.persistTabSettings&&g.persistTabSettings({tab_type:j,tab_items:e})},[Oe,j,g]),wt=a.useCallback(e=>{Ve(e),ve?.(e),j&&g?.persistTabSettings&&g.persistTabSettings({tab_type:j,tab_options:e})},[ve,j,g]),Ue=e=>e.is_pinned?32:0,pe=a.useCallback(e=>{if(!e)return;const t=E?30:0,s=y?190:84,l=_==="sm"?4:8,o=32;let m=0,ee=0,w=0;const f=e-(L?.width||0)-t,Fe=Le.current,$e=Fe<r.length,Ae=V.length>0;for(let h=0;h<r.length;h++){const I=r[h],te=b?.[I.name]?String(b?.[I.name]):"",fe=y&&te?B(te,{fontSize:"16px",fontWeight:"500",fontFamily:"Inter, system-ui, -apple-system, sans-serif"})+18+2:0,he=B(I?.name||"",{fontSize:"16px",fontWeight:"600",fontFamily:"Inter, system-ui, -apple-system, sans-serif"}),ge=C?Ue(I):0,Ye=he+fe+o+l+ge;if(I.name===i&&(ee=Ye),m+=Ye,f>m+($e||Ae?s:0)+h*25)w=h+1;else break}const Ge=r.length-w;if(Ge+V.length===1&&V.length===0&&Ge===1&&w<r.length){const h=r[w];if(h){const I=b?.[h.name]?String(b?.[h.name]):"",te=y&&I?B(I,{fontSize:"16px",fontWeight:"500",fontFamily:"Inter, system-ui, -apple-system, sans-serif"})+18+2:0,fe=B(h?.name||"",{fontSize:"16px",fontWeight:"600",fontFamily:"Inter, system-ui, -apple-system, sans-serif"}),he=C?Ue(h):0,ge=fe+te+o+l+he;f>=m+ge&&(w+=1)}}const Et=F?r.length:w;r.findIndex(h=>h.name===i)>=Et&&(m+=ee,f<m+($e||Ae?s:0)&&(w=Math.max(w-1,0))),w!==Fe&&dt(w)},[r,y,F,C,b,L?.width,i,_,E,V.length,B]),xe=a.useCallback(()=>{if(typeof window<"u")return new URLSearchParams(window.location.search);if(x&&g?.getSearchParam){const e=new URLSearchParams,t=g.getSearchParam(x.key);return t&&e.set(x.key,t),e}return new URLSearchParams},[x,g]),be=a.useCallback((e,t)=>(x&&(t===x.defaultLink?e.delete(x.key):e.set(x.key,t),x.onResolve?.(e)),e),[x]),z=a.useCallback(e=>x?`?${be(xe(),e).toString()}`:void 0,[be,xe,x]),kt=Ke||!!x,yt=a.useCallback(async e=>{const t=z(e),s=typeof window<"u"?window.location.origin:"",l=typeof window<"u"?window.location.pathname:"",o=t?`${s}${l}${t}`:`${s}${l}`;await navigator.clipboard.writeText(o),Ut.toast.success(p("Link copied to clipboard"),{toastId:"Link copied to clipboard"}),Ne?.(e,o)},[z,p,Ne]),W=e=>{if(G(!1),Xe?.(e),x&&g?.navigate){const t=be(xe(),e);g.navigate(`?${t.toString()}`)}},ze=e=>{if(r.length<=1)return;const t=u.map(o=>o.name===e?{...o,is_hidden:!0}:o),s=r.findIndex(o=>o.name===e),l=s===0?1:s-1;W(r[l].name),U(t)},St=e=>{const t=u.map(s=>s.name===e?{...s,is_hidden:!1}:s);G(!1),U(t)},K=e=>{if(!C)return;const t=u.map(s=>s.name===e?{...s,is_pinned:!s.is_pinned}:s);U(t)},We=(e,t)=>{const s=u.findIndex(({name:o})=>o===e),l=t==="left"?s-(u[s-1]?.name===i?2:1):s+1;U(ne.arrayMove(u,s,l))},Pe=()=>G(!N),Tt=e=>Q(e.active.id),Ct=e=>{const{active:t,over:s}=e;if(s?.id==="more-tabs"){ze(t.id),Q(null),J(null);return}const l=u.findIndex(({name:m})=>m===t.id),o=u.findIndex(({name:m})=>m===s?.id);U(ne.arrayMove(u,l,o)),Q(null),J(null)},jt=()=>{Q(null),J(null)},It=e=>{J(e.over?.id==="more-tabs"?"more-tabs":null)},Nt=()=>{},vt=(e,t)=>{bt(e),mt(t)},me=(e,t=!1,s=!1)=>{const o=u.find(f=>f.name===e)?.is_pinned,m=[{label:n.jsx(S.OptionButton,{icon:n.jsx(k.ArrowOutwardIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Select Tab"),className:"text-black-900 dark:text-white"}),key:d.SELECT,onClick:()=>W(e)},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.ArrowUpwardIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Move Up"),isDisabled:R,className:"text-black-900 dark:text-white"}),key:d.MOVE_LEFT,disabled:R,onClick:()=>We(e,"left")},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.ArrowDownwardIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Move Down"),isDisabled:R,className:"text-black-900 dark:text-white"}),key:d.MOVE_RIGHT,disabled:R,onClick:()=>We(e,"right")},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.ContentCopyIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Copy Link"),className:"text-black-900 dark:text-white"}),key:d.COPY_LINK,onClick:()=>yt(e)},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.VisibilityOffIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Hide"),className:"text-black-900 dark:text-white"}),key:d.HIDE,onClick:()=>ze(e)},{label:n.jsx(S.OptionButton,{icon:n.jsx(k.VisibilityIcon,{size:18,className:"text-inherit dark:text-inherit"}),text:p("Unhide"),className:"text-black-900 dark:text-white"}),key:d.UNHIDE,onClick:()=>St(e)},{label:n.jsx(S.OptionButton,{icon:o?n.jsx(k.UnpinFilledIcon,{size:20,className:"rotate-12 text-inherit dark:text-inherit"}):n.jsx(k.PinIcon,{size:20,className:"rotate-45 text-inherit dark:text-inherit"}),text:p(o?"Unpin":"Pin"),className:"text-black-900 dark:text-white",notVisible:!C}),key:o?d.UNPIN:d.PIN,onClick:()=>K(e)},{label:n.jsx(S.OptionButton,{className:"text-black-900 dark:text-white",icon:n.jsx(Ht.EditIcon,{}),text:p("Edit"),notVisible:!je}),key:d.EDIT,onClick:()=>je?.(e)},{label:n.jsx(S.OptionButton,{className:"text-error-600 dark:text-error-600",icon:n.jsx(k.DeleteIcon,{size:18,className:"text-error-600 dark:text-error-600"}),text:p("Delete"),notVisible:!Ie}),key:d.DELETE,onClick:()=>Ie?.(e)}],ee=[d.HIDE,d.UNHIDE],w=[d.SELECT,d.MOVE_LEFT,d.MOVE_RIGHT,d.UNHIDE];return m.filter(f=>t?f.key===d.UNHIDE:s?!ee.includes(f.key):!w.includes(f.key)).filter(f=>kt?!0:f.key!==d.COPY_LINK).filter(f=>r.length===1?f.key!==d.HIDE:!0)},M=(e,t)=>({classValue:{default:c("relative inline-flex pt-2 pb-3 px-2 pl-3 sm:px-2 rounded-t-sm group"),secondary:c("flex w-full sm:w-auto relative rounded-lg font-sans font-semibold text-center cursor-pointer uppercase",_==="sm"?"py-1 px-3 text-sm":"py-2 px-4 text-base")},selectedClassValue:{default:c("absolute left-0 bottom-0 w-full h-[3px] bg-primary-600"),secondary:c("absolute inset-0 bg-primary-50 dark:bg-primary-975 rounded-lg")},textClassValue:{default:c("relative uppercase font-sans font-semibold text-sm whitespace-nowrap",t?"text-primary-600 dark:text-primary-500":"text-neutral-400 hover:text-neutral-500 dark:text-neutral-100 dark:hover:text-white"),secondary:c("relative whitespace-nowrap text-sm",t?"text-primary-600 dark:text-primary-500":"text-neutral-400 dark:text-neutral-400")}})[e][T];a.useEffect(()=>{if(!X.current||T==="switch")return;const e=new ResizeObserver(t=>{const s=t[0].contentRect.width;pe(s)});return e.observe(X.current),pe(X.current.clientWidth),()=>e.disconnect()},[pe,T]);const Ot=JSON.stringify(O),_t=JSON.stringify(ie?.map(({name:e})=>e));return a.useEffect(()=>{if(ie?.length){let e=[...ie];O.forEach(t=>{e.find(s=>s.name===t)||e.push({name:t,is_default:!1,is_hidden:!1,is_pinned:!1})}),e=e.filter((t,s,l)=>O.includes(t.name)&&s===l.findIndex(o=>o.name===t.name)),ce(e)}else ce(O.map(e=>({name:e,is_default:!1,is_hidden:!1,is_pinned:!1})).filter((e,t,s)=>t===s.findIndex(l=>l.name===e.name)))},[Ot,_t]),a.useEffect(()=>{A&&Ve(A)},[A]),a.useEffect(()=>{if(!u.length)return;const e=[...u];ue==="asc"?e.sort((t,s)=>t.name.localeCompare(s.name)):ue==="desc"&&e.sort((t,s)=>s.name.localeCompare(t.name)),ut(e)},[u,ue]),a.useEffect(()=>{Te(N)},[N]),T==="switch"?n.jsx("div",{className:c("inline",Ce),children:n.jsx("ul",{role:"tablist","aria-orientation":"horizontal",className:c("inline-flex grow-0 p-1 rounded-lg",ae==="dark"?"border-[1.5px] border-neutral-800 bg-neutral-800 dark:border-black-800":"bg-neutral-100 dark:bg-black-700",re?"w-full":"w-auto"),children:O.map(e=>{const t=i===e,s=oe?.[e],l=u.find(m=>m.name===e),o=C&&l?.is_pinned;return n.jsx("li",{role:"presentation",className:c("inline-flex",re?"w-full":"w-auto"),children:n.jsx(ye.TabSwitch,{title:e,showCounts:y,role:"tab",ariaSelected:t,tabIndex:0,icon:o?n.jsx(ke,{title:"Unpin",children:n.jsx("span",{onClick:()=>K(e),children:n.jsx(k.PinIcon,{size:20,className:"rotate-45 text-inherit dark:text-inherit"})})}):s,iconsOnly:tt,classValue:c("relative py-0.5 border-gray-200",nt,re?"w-full flex items-center justify-center":"px-2"),selectedClassValue:c("absolute inset-0 rounded-md z-0",ae==="dark"?"bg-neutral-900":"bg-white dark:bg-black-800"),textClassValue:c("relative text-xs font-semibold font-sans whitespace-nowrap",t?"text-neutral-900 dark:text-neutral-100":"text-neutral-700 dark:text-neutral-100"),isSelected:t,href:z(e),onClick:et?void 0:()=>W(e),suffixRecord:b,selectedId:H,color:ae,disableAnimation:at})},e)})})}):n.jsx("div",{ref:X,className:c(st?"w-fit":"w-full"),onMouseEnter:()=>Ee(!0),onMouseLeave:()=>Ee(!1),children:n.jsxs(v.DndContext,{sensors:ht,onDragEnd:Ct,onDragStart:Tt,onDragCancel:jt,collisionDetection:v.closestCenter,onDragOver:It,children:[n.jsxs("ul",{role:"tablist","aria-orientation":"horizontal",className:c("flex items-center w-full",Ce,$?"gap-0":_==="sm"?"gap-1":"gap-2"),ref:ft,children:[Ze?n.jsx("div",{className:"skeleton bg-neutral-300 dark:bg-black-700 animate-pulse h-10 min-w-[100px] w-full rounded"}):n.jsxs(ne.SortableContext,{items:r.map(({name:e})=>e),strategy:ne.horizontalListSortingStrategy,id:"sortable",disabled:!E||R,children:[r.slice(0,Z).map(({name:e,is_pinned:t})=>{const s=i===e&&!N,l=C&&t;return n.jsx(Qe.SortableTab,{title:e,isDragging:D===e,className:$?"flex-1 flex justify-center":"",children:n.jsx("li",{role:"presentation",className:c($?"w-full flex":"sm:mr-2"),children:n.jsx(ye.TabSwitch,{showCounts:y,title:e,role:"tab",ariaSelected:s,tabIndex:0,classValue:c(M("classValue",s),$?"w-full justify-center":""),selectedClassValue:M("selectedClassValue",s),textClassValue:M("textClassValue",s),isSelected:s,tabOptions:s&&E?n.jsx(we.Dropdown,{menu:{items:me(e),className:se},trigger:["click"],onOpenChange:Te,overlayClassName:"row-option-cell",rootClassName:"",openClassName:"max-h-[350px] overflow-y-auto",placement:"bottom",children:n.jsx(Rt,{tooltip:p("More"),variant:"ghost",className:"!text-primary-500 hover:!bg-primary-100 dark:hover:!bg-primary-900",children:n.jsx(Je,{sx:{fontSize:20}})})}):null,draggingTab:D===e,href:z(e),onClick:()=>W(e),suffixRecord:b,selectedId:H,icon:l?n.jsx(ke,{title:p("Unpin"),children:n.jsx("span",{onClick:()=>K(e),children:n.jsx(k.PinIcon,{size:20,className:"rotate-45 text-inherit dark:text-inherit"})})}):oe?.[e]??null})},e)},e)}),i&&Be?n.jsx(Qe.SortableTab,{title:i,isDragging:D===i,children:n.jsx("li",{role:"presentation",className:c("sm:mr-2"),children:n.jsx(ye.TabSwitch,{showCounts:y,title:i,role:"tab",ariaSelected:!0,tabIndex:0,classValue:M("classValue",!0),selectedClassValue:M("selectedClassValue",!0),textClassValue:M("textClassValue",!0),isSelected:!0,tabOptions:E?n.jsx(we.Dropdown,{menu:{items:me(i),className:se},trigger:["click"],onOpenChange:Te,overlayClassName:"row-option-cell",rootClassName:"",openClassName:"max-h-[350px] overflow-y-auto",placement:"bottom",children:n.jsx(Je,{sx:{fontSize:20},className:"text-primary-600"})}):null,draggingTab:D===i,href:z(i),suffixRecord:b,selectedId:H,icon:C&&u.find(e=>e.name===i)?.is_pinned?n.jsx(ke,{title:p("Pinned"),children:n.jsx("span",{onClick:()=>K(i),children:n.jsx(k.PinIcon,{size:20,className:"rotate-45 text-inherit dark:text-inherit"})})}):oe?.[i]??null})},i)},i):null,(q<r.length&&!F||V.length>0)&&He>0?n.jsx(zt.DropableWrapper,{id:"more-tabs",children:n.jsx(we.Dropdown,{overlayStyle:{maxHeight:"calc(100vh - 350px)",overflow:"auto",marginTop:"8px",scrollbarWidth:"none",borderRadius:8,boxShadow:"0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05)"},onOpenChange:()=>Pe(),open:N,menu:{items:[{key:"Search",disabled:!0,style:{minWidth:"190px",marginBottom:"8px"},label:n.jsx("div",{className:"px-2 bg-white dark:bg-black-800",children:n.jsx(Bt.SearchBar,{id:"search-bar-more-tabs",value:le,classValues:"!rounded-lg",onChange:e=>ct(e)})})},...r.slice(Z).filter(e=>e.name!==i).concat(V).filter(({name:e})=>typeof e=="string"&&(e??"").toLowerCase().includes(le.toLowerCase())).map(({name:e,is_hidden:t})=>({key:e,label:n.jsx(S.OptionButton,{className:c("uppercase",t?"text-neutral-400 dark:text-neutral-500":"text-black-900 dark:text-black-200"),text:e,suffixRecord:y?b:{},highlight:le,truncateText:!0,isDisabled:t,onClick:t?void 0:()=>{W(e),G(!1)}}),popupClassName:se,children:N?me(e,t,!0):null}))],className:se},openClassName:"max-h-[350px] overflow-y-auto",trigger:["click"],overlayClassName:"row-option-cell",placement:"bottomRight",getPopupContainer:e=>e.parentElement,children:n.jsx(Wt.MoreButton,{title:`${y?He:""} MORE...`,variant:T,size:_,draggingOver:pt,suffixRecord:b,handleShowMoreDropdown:Pe,selectedId:H,showMoreDropdown:N})})}):null]}),L?n.jsx("div",{className:c(L?.className),children:n.jsx("li",{children:L.component})}):null,E&&lt&&n.jsx("li",{className:c(xt?"opacity-100":"opacity-0","transition-opacity duration-300"),children:n.jsx(Pt.TabOptions,{hasSuffixRecord:!!(b&&Object.keys(b).length>0),savedConfig:De,onApplyFilter:e=>wt(e),setUnsavedChanges:()=>{},handleTabSort:Nt,onSearchChange:vt})})]}),D?n.jsx(Ft.TabDragOverlay,{draggingTab:D,suffixRecord:b,size:_,variant:T,selectedId:H,parentContainer:it}):null]})})};exports.Tabs=At;
 //# sourceMappingURL=Tabs.cjs.js.map