npm - @lax-wp/design-system - Versions diffs - 0.13.41 → 0.13.42 - Mend

@lax-wp/design-system 0.13.41 → 0.13.42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (17) hide show

package/dist/components/floating-bar/FloatingBar.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FloatingBar.cjs.js","sources":["../../../src/components/floating-bar/FloatingBar.tsx"],"sourcesContent":["import { Dropdown } from \"antd\";\nimport cn from \"classnames\";\nimport { motion } from \"framer-motion\";\nimport { useEffect, useRef, useState, type FC, type ReactNode } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Typography } from \"../data-display/typography/Typography\";\nimport { OptionButton } from \"../buttons/option-button/OptionButton\";\nimport IconButton from \"../button/IconButton\";\nimport Tooltip from \"../tooltip/Tooltip\";\nimport { DeleteIcon } from \"../icon\";\n\n/*\n Close icon component\n /\nconst CloseIcon: FC<{ size?: number; fill?: string; className?: string }> = ({\n size = 24,\n fill = \"currentColor\",\n className,\n}) => (\n <svg\n className={className}\n width={size}\n height={size}\n viewBox=\"0 0 20 20\"\n fill={fill}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M10.0002 11.1666L5.91683 15.2499C5.76405 15.4027 5.56961 15.4791 5.3335 15.4791C5.09739 15.4791 4.90294 15.4027 4.75016 15.2499C4.59738 15.0971 4.521 14.9027 4.521 14.6666C4.521 14.4305 4.59738 14.236 4.75016 14.0833L8.8335 9.99992L4.75016 5.91659C4.59738 5.76381 4.521 5.56936 4.521 5.33325C4.521 5.09714 4.59738 4.9027 4.75016 4.74992C4.90294 4.59714 5.09739 4.52075 5.3335 4.52075C5.56961 4.52075 5.76405 4.59714 5.91683 4.74992L10.0002 8.83325L14.0835 4.74992C14.2363 4.59714 14.4307 4.52075 14.6668 4.52075C14.9029 4.52075 15.0974 4.59714 15.2502 4.74992C15.4029 4.9027 15.4793 5.09714 15.4793 5.33325C15.4793 5.56936 15.4029 5.76381 15.2502 5.91659L11.1668 9.99992L15.2502 14.0833C15.4029 14.236 15.4793 14.4305 15.4793 14.6666C15.4793 14.9027 15.4029 15.0971 15.2502 15.2499C15.0974 15.4027 14.9029 15.4791 14.6668 15.4791C14.4307 15.4791 14.2363 15.4027 14.0835 15.2499L10.0002 11.1666Z\" />\n </svg>\n);\n\n/\n Dropdown arrow icon component\n /\nconst DropdownArrowIcon: FC<{ fill?: string; className?: string }> = ({\n fill = \"#cccccc\",\n className,\n}) => (\n <svg\n height=\"20\"\n width=\"20\"\n viewBox=\"0 0 20 20\"\n focusable=\"false\"\n className={className}\n >\n <path\n fill={fill}\n d=\"M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z\"\n />\n </svg>\n);\n\n/\n Configuration for action buttons in the floating bar\n /\nexport type ButtonConfig = {\n /* Button label text /\n label?: string;\n /* Icon element to display /\n icon: ReactNode;\n /* Click handler for the action /\n onClick?: () => void;\n /* Icon for dropdown mode /\n dropdownIcon?: ReactNode;\n /* Whether the action is visible /\n visible?: boolean;\n /* Whether the action is disabled /\n disabled?: boolean;\n /* Tooltip text /\n tooltip?: string;\n /* Whether to hide the label text /\n hideLabel?: boolean;\n /* Action type /\n type?: \"button\" \| \"dropdown\";\n /* Dropdown trigger mode /\n dropdownTrigger?: \"click\" \| \"hover\";\n /* Dropdown menu items /\n dropdownItems?: Array<{\n label: ReactNode;\n key: string;\n disabled?: boolean;\n }>;\n};\n\n/\n Props for the FloatingBar component\n /\nexport type TFloatingBar = {\n /* Whether the floating bar is visible /\n show?: boolean;\n /* Close handler /\n onClose: () => void;\n /* Whether this is used in flow dashboard layout /\n isFlowDashboard?: boolean;\n /* Array of action configurations /\n actionItems: ButtonConfig[];\n /* Number of selected items /\n selectedItemsCount?: number;\n /* Delete action configuration /\n deleteConfig?: {\n label?: string;\n disabled?: boolean;\n onClick?: () => void;\n };\n /* Whether to show action background /\n showActionBg?: boolean;\n};\n\n/\n FloatingBar component provides a floating action bar for bulk operations.\n * Drop-in replacement matching the lax-web-portal implementation.\n \n @example\n * ```tsx\n * <FloatingBar\n * show={selectedItems.length > 0}\n * onClose={() => setSelectedItems([])}\n * selectedItemsCount={selectedItems.length}\n * actionItems={[\n * {\n * label: \"Edit\",\n * icon: <EditIcon size={16} />,\n * onClick: handleEdit,\n * },\n * {\n * label: \"Archive\",\n * icon: <ArchiveIcon size={16} />,\n * onClick: handleArchive,\n * },\n * ]}\n * deleteConfig={{\n * label: \"Delete\",\n * onClick: handleDelete,\n * }}\n * />\n * ```\n /\nexport const FloatingBar: FC<TFloatingBar> = (props) => {\n const {\n show,\n isFlowDashboard,\n onClose,\n actionItems,\n selectedItemsCount,\n deleteConfig,\n showActionBg,\n } = props;\n\n const { t } = useTranslation();\n const [showDropdown, setShowDropdown] = useState<boolean>(false);\n const [showButtons, setShowButtons] = useState<boolean>(true);\n\n const containerRef = useRef<HTMLDivElement>(null);\n const actionContainerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n if (containerRef.current && actionContainerRef.current) {\n const containerWidth = containerRef.current.scrollWidth - 100;\n const totalActionItemsWidth = actionItems.length 180 + 100;\n if (totalActionItemsWidth > containerWidth) {\n setShowButtons(false);\n } else {\n setShowButtons(true);\n }\n }\n });\n\n if (containerRef.current) {\n observer.observe(containerRef.current);\n }\n\n return () => {\n if (containerRef.current) {\n observer.unobserve(containerRef.current);\n }\n };\n });\n\n const deleteButtonConfig = {\n label: t(\"Delete\"),\n icon: <DeleteIcon size={16} className=\"text-error-500\" />,\n color: \"text-error-500 dark:text-error-500\",\n onClick: deleteConfig?.onClick,\n ...deleteConfig,\n };\n\n const dropDownItems = actionItems\n .filter((button) => button.visible !== false)\n .map((button, index) => ({\n key: index,\n label: (\n <OptionButton\n icon={button.dropdownIcon}\n text={button?.label \|\| \"\"}\n onClick={button.onClick}\n className=\"font-inter text-base font-medium text-black-900 dark:text-black-200 gap-1.5\"\n />\n ),\n children: button.dropdownItems,\n disabled: false,\n }));\n\n return !show ? null : (\n <motion.div\n initial={{ y: 20, opacity: 0 }}\n animate={{ y: 0, opacity: 1 }}\n exit={{ y: 20, opacity: 0 }}\n transition={{\n duration: 0.2,\n ease: [0.4, 0, 0.2, 1],\n opacity: { duration: 0.15 },\n }}\n ref={containerRef}\n className={cn(\"h-[40px]\", isFlowDashboard ? \"ml-60 w-1/2\" : \"w-full\")}\n >\n <div\n className={cn(\n \"h-[40px] border py-1.5 px-2 text-white bg-primary-800 dark:bg-black-700 flex justify-between items-center\"\n )}\n >\n <div className=\"flex items-center\">\n <IconButton\n tooltip=\"Close\"\n variant=\"ghost\"\n onClick={onClose}\n className=\"!p-0 text-white hover:opacity-80 hover:rotate-90 transition-all duration-200\"\n >\n <CloseIcon size={20} />\n </IconButton>\n <div className=\"flex items-center gap-1.5 ml-2\">\n <span className=\"text-primary-600 dark:text-black-100 bg-primary-50 dark:bg-black-800 border-primary-200 dark:border-black-800 text-xs leading-4 font-normal border rounded-full pr-2 pl-2\">\n {selectedItemsCount \|\| 0}\n </span>\n <Typography\n size=\"extra-small\"\n appearance=\"custom\"\n className=\"text-white\"\n >\n {t(\"Selected\")}\n </Typography>\n </div>\n </div>\n <div\n ref={actionContainerRef}\n className={cn(\n \"h-[36px] flex items-center rounded-full font-inter\",\n showActionBg\n ? \"bg-primary-900 dark:bg-black-800 px-[10px] rounded-[43px]\"\n : \"\"\n )}\n >\n {showButtons ? (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"flex bg-primary-800 dark:bg-black-800 px-4 rounded-full\"\n >\n {actionItems.map(\n (button, index) =>\n button.visible !== false && (\n <div key={index}>\n {button.type === \"dropdown\" ? (\n <Dropdown\n menu={{\n items: button.dropdownItems,\n }}\n trigger={[button.dropdownTrigger \|\| \"click\"]}\n overlayClassName=\"!min-w-[148px]\"\n placement=\"bottomRight\"\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n open={showDropdown}\n onOpenChange={setShowDropdown}\n >\n <button\n key={index}\n id={`btn-floating-bar-${button.label}`}\n onClick={button.onClick}\n disabled={button.disabled}\n className={cn(\n !button?.label\n ? \"bg-transparent p-1.5 rounded-xl transition-all duration-200 hover:scale-105 hover:opacity-80\"\n : \"flex items-center mx-1 gap-1.5 py-1 pr-3 pl-2 rounded-md text-white hover:text-primary-50 hover:scale-105 transition-all duration-200 bg-transparent\",\n button?.hideLabel && \"!p-1.5\",\n (button.label === \"Delete\" \|\|\n button.label === \"Remove\" \|\|\n button.label === \"Delete user\" \|\|\n button.label === \"Delete Permanently\") &&\n \"!text-error-500\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center\"\n >\n {button.icon}\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit ml-1.5\"}\n appearance=\"custom\"\n >\n {button.label}\n </Typography>\n )}\n </Tooltip>\n </button>\n </Dropdown>\n ) : (\n <button\n id={`btn-floating-bar-${button.label}`}\n onClick={button.onClick}\n disabled={button.disabled}\n className={cn(\n !button?.label\n ? \"bg-transparent p-1.5 rounded-xl transition-all duration-200 hover:scale-105 hover:opacity-80\"\n : \"flex items-center mx-1 gap-1.5 py-1 pr-3 pl-2 rounded-md text-white hover:text-primary-50 hover:scale-105 transition-all duration-200 bg-transparent\",\n button?.hideLabel && \"!p-1.5\",\n (button.label === \"Delete\" \|\|\n button.label === \"Remove\" \|\|\n button.label === \"Delete Permanently\") &&\n \"!text-error-500\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center\"\n >\n {button.icon}\n\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit ml-1.5\"}\n appearance=\"custom\"\n >\n {button.label}\n </Typography>\n )}\n </Tooltip>\n </button>\n )}\n </div>\n )\n )}\n {deleteConfig ? (\n <button\n id={`btn-floating-bar-${deleteButtonConfig.label}`}\n onClick={deleteButtonConfig.onClick}\n disabled={deleteButtonConfig.disabled}\n className={cn(\n \"flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200\",\n deleteButtonConfig.disabled && \"opacity-70\"\n )}\n >\n {deleteButtonConfig.icon}\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-error-500\"\n appearance=\"custom\"\n >\n {deleteButtonConfig.label}\n </Typography>\n </button>\n ) : null}\n </motion.div>\n ) : (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"minw-[150px] p-1.5 flex items-center\"\n >\n <Dropdown\n menu={{\n items: dropDownItems,\n }}\n trigger={[\"click\"]}\n overlayClassName=\"!min-w-[148px]\"\n placement=\"bottomRight\"\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n open={showDropdown}\n onOpenChange={setShowDropdown}\n >\n <button\n id={`btn-floating-bar-actions`}\n disabled={dropDownItems.length === 0}\n className={cn(\n \"flex items-center gap-1.5 px-2 py-1 w-22 h-7 rounded-full bg-primary-700 hover:scale-105 hover:opacity-80 transition-all duration-200\",\n dropDownItems.length === 0 &&\n \"opacity-60 hover:scale-100 hover:opacity-60\"\n )}\n type=\"button\"\n >\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-white\"\n >\n {t(\"Actions\")}\n </Typography>\n <DropdownArrowIcon\n fill=\"#FFFFFF\"\n className=\"w-[16px] h-[16px]\"\n />\n </button>\n </Dropdown>\n {deleteConfig ? (\n <button\n id={`btn-floating-bar-${deleteButtonConfig.label}`}\n onClick={deleteButtonConfig.onClick}\n disabled={deleteButtonConfig.disabled}\n className={cn(\n \"flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200\",\n deleteButtonConfig.disabled && \"opacity-70\"\n )}\n type=\"button\"\n >\n {deleteButtonConfig.icon}\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-error-500\"\n appearance=\"custom\"\n >\n {deleteButtonConfig.label}\n </Typography>\n </button>\n ) : null}\n </motion.div>\n )}\n </div>\n </div>\n </motion.div>\n );\n};\n\nFloatingBar.displayName = \"FloatingBar\";\n\n// Re-export types for convenience\nexport type { ButtonConfig as FloatingBarActionConfig };\nexport type FloatingBarDeleteConfig = TFloatingBar[\"deleteConfig\"];\nexport type FloatingBarProps = TFloatingBar;\n\n// Legacy type exports for backwards compatibility\nexport type FloatingBarSize = \"small\" \| \"medium\" \| \"large\";\nexport type FloatingBarPosition = \"top\" \| \"bottom\";\nexport type FloatingBarTheme = \"primary\" \| \"dark\" \| \"light\";\n"],"names":["CloseIcon","size","fill","className","jsx","DropdownArrowIcon","FloatingBar","props","show","isFlowDashboard","onClose","actionItems","selectedItemsCount","deleteConfig","showActionBg","t","useTranslation","showDropdown","setShowDropdown","useState","showButtons","setShowButtons","containerRef","useRef","actionContainerRef","useEffect","observer","containerWidth","deleteButtonConfig","DeleteIcon","dropDownItems","button","index","OptionButton","motion","cn","jsxs","IconButton","Typography","Dropdown","trigger","Tooltip"],"mappings":"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"}
1	+ {"version":3,"file":"FloatingBar.cjs.js","sources":["../../../src/components/floating-bar/FloatingBar.tsx"],"sourcesContent":["import { Dropdown } from \"antd\";\nimport cn from \"classnames\";\nimport { motion } from \"framer-motion\";\nimport { useEffect, useRef, useState, type FC, type ReactNode } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Typography } from \"../data-display/typography/Typography\";\nimport { OptionButton } from \"../buttons/option-button/OptionButton\";\nimport IconButton from \"../button/IconButton\";\nimport Tooltip from \"../tooltip/Tooltip\";\nimport { DeleteIcon } from \"../icon\";\n\n/*\n Close icon component\n /\nconst CloseIcon: FC<{ size?: number; fill?: string; className?: string }> = ({\n size = 24,\n fill = \"currentColor\",\n className,\n}) => (\n <svg\n className={className}\n width={size}\n height={size}\n viewBox=\"0 0 20 20\"\n fill={fill}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M10.0002 11.1666L5.91683 15.2499C5.76405 15.4027 5.56961 15.4791 5.3335 15.4791C5.09739 15.4791 4.90294 15.4027 4.75016 15.2499C4.59738 15.0971 4.521 14.9027 4.521 14.6666C4.521 14.4305 4.59738 14.236 4.75016 14.0833L8.8335 9.99992L4.75016 5.91659C4.59738 5.76381 4.521 5.56936 4.521 5.33325C4.521 5.09714 4.59738 4.9027 4.75016 4.74992C4.90294 4.59714 5.09739 4.52075 5.3335 4.52075C5.56961 4.52075 5.76405 4.59714 5.91683 4.74992L10.0002 8.83325L14.0835 4.74992C14.2363 4.59714 14.4307 4.52075 14.6668 4.52075C14.9029 4.52075 15.0974 4.59714 15.2502 4.74992C15.4029 4.9027 15.4793 5.09714 15.4793 5.33325C15.4793 5.56936 15.4029 5.76381 15.2502 5.91659L11.1668 9.99992L15.2502 14.0833C15.4029 14.236 15.4793 14.4305 15.4793 14.6666C15.4793 14.9027 15.4029 15.0971 15.2502 15.2499C15.0974 15.4027 14.9029 15.4791 14.6668 15.4791C14.4307 15.4791 14.2363 15.4027 14.0835 15.2499L10.0002 11.1666Z\" />\n </svg>\n);\n\n/\n Dropdown arrow icon component\n /\nconst DropdownArrowIcon: FC<{ fill?: string; className?: string }> = ({\n fill = \"#cccccc\",\n className,\n}) => (\n <svg\n height=\"20\"\n width=\"20\"\n viewBox=\"0 0 20 20\"\n focusable=\"false\"\n className={className}\n >\n <path\n fill={fill}\n d=\"M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z\"\n />\n </svg>\n);\n\n/\n Configuration for action buttons in the floating bar\n /\nexport type ButtonConfig = {\n /* Button label text /\n label?: string;\n /* Icon element to display /\n icon: ReactNode;\n /* Click handler for the action /\n onClick?: () => void;\n /* Icon for dropdown mode /\n dropdownIcon?: ReactNode;\n /* Whether the action is visible /\n visible?: boolean;\n /* Whether the action is disabled /\n disabled?: boolean;\n /* Tooltip text /\n tooltip?: string;\n /* Whether to hide the label text /\n hideLabel?: boolean;\n /* Action type /\n type?: \"button\" \| \"dropdown\";\n /* Dropdown trigger mode /\n dropdownTrigger?: \"click\" \| \"hover\";\n /* Dropdown menu items /\n dropdownItems?: Array<{\n label: ReactNode;\n key: string;\n disabled?: boolean;\n }>;\n};\n\n/\n Props for the FloatingBar component\n /\nexport type TFloatingBar = {\n /* Whether the floating bar is visible /\n show?: boolean;\n /* Close handler /\n onClose: () => void;\n /* Whether this is used in flow dashboard layout /\n isFlowDashboard?: boolean;\n /* Array of action configurations /\n actionItems: ButtonConfig[];\n /* Number of selected items /\n selectedItemsCount?: number;\n /* Delete action configuration /\n deleteConfig?: {\n label?: string;\n disabled?: boolean;\n onClick?: () => void;\n };\n /* Whether to show action background /\n showActionBg?: boolean;\n};\n\n/\n FloatingBar component provides a floating action bar for bulk operations.\n * Drop-in replacement matching the lax-web-portal implementation.\n \n @example\n * ```tsx\n * <FloatingBar\n * show={selectedItems.length > 0}\n * onClose={() => setSelectedItems([])}\n * selectedItemsCount={selectedItems.length}\n * actionItems={[\n * {\n * label: \"Edit\",\n * icon: <EditIcon size={16} />,\n * onClick: handleEdit,\n * },\n * {\n * label: \"Archive\",\n * icon: <ArchiveIcon size={16} />,\n * onClick: handleArchive,\n * },\n * ]}\n * deleteConfig={{\n * label: \"Delete\",\n * onClick: handleDelete,\n * }}\n * />\n * ```\n /\nexport const FloatingBar: FC<TFloatingBar> = (props) => {\n const {\n show,\n isFlowDashboard,\n onClose,\n actionItems,\n selectedItemsCount,\n deleteConfig,\n showActionBg,\n } = props;\n\n const { t } = useTranslation();\n const [showDropdown, setShowDropdown] = useState<boolean>(false);\n const [showButtons, setShowButtons] = useState<boolean>(true);\n\n const containerRef = useRef<HTMLDivElement>(null);\n const actionContainerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n if (containerRef.current && actionContainerRef.current) {\n const containerWidth = containerRef.current.scrollWidth - 100;\n const totalActionItemsWidth = actionItems.length 180 + 100;\n if (totalActionItemsWidth > containerWidth) {\n setShowButtons(false);\n } else {\n setShowButtons(true);\n }\n }\n });\n\n if (containerRef.current) {\n observer.observe(containerRef.current);\n }\n\n return () => {\n if (containerRef.current) {\n observer.unobserve(containerRef.current);\n }\n };\n });\n\n const deleteButtonConfig = {\n label: t(\"Delete\"),\n icon: <DeleteIcon size={16} className=\"text-error-500\" />,\n color: \"text-error-500 dark:text-error-500\",\n onClick: deleteConfig?.onClick,\n ...deleteConfig,\n };\n\n const dropDownItems = actionItems\n .filter((button) => button.visible !== false)\n .map((button, index) => ({\n key: index,\n label: (\n <OptionButton\n icon={button.dropdownIcon}\n text={button?.label \|\| \"\"}\n onClick={button.onClick}\n className=\"font-inter text-base font-medium text-black-900 dark:text-black-200 gap-1.5\"\n />\n ),\n children: button.dropdownItems,\n disabled: false,\n }));\n\n return !show ? null : (\n <motion.div\n initial={{ y: 20, opacity: 0 }}\n animate={{ y: 0, opacity: 1 }}\n exit={{ y: 20, opacity: 0 }}\n transition={{\n duration: 0.2,\n ease: [0.4, 0, 0.2, 1],\n opacity: { duration: 0.15 },\n }}\n ref={containerRef}\n className={cn(\"h-[40px]\", isFlowDashboard ? \"ml-60 w-1/2\" : \"w-full\")}\n >\n <div\n className={cn(\n \"h-[40px] border py-1.5 px-2 text-white bg-primary-800 dark:bg-black-700 flex justify-between items-center\"\n )}\n >\n <div className=\"flex items-center\">\n <IconButton\n tooltip=\"Close\"\n variant=\"ghost\"\n onClick={onClose}\n className=\"!p-0 text-white hover:opacity-80 hover:rotate-90 transition-all duration-200\"\n >\n <CloseIcon size={20} />\n </IconButton>\n <div className=\"flex items-center gap-1.5 ml-2\">\n <span className=\"text-primary-600 dark:text-black-100 bg-primary-50 dark:bg-black-800 border-primary-200 dark:border-black-800 text-xs leading-4 font-normal border rounded-full pr-2 pl-2\">\n {selectedItemsCount \|\| 0}\n </span>\n <Typography\n size=\"extra-small\"\n appearance=\"custom\"\n className=\"text-white\"\n >\n {t(\"Selected\")}\n </Typography>\n </div>\n </div>\n <div\n ref={actionContainerRef}\n className={cn(\n \"h-[36px] flex items-center rounded-full font-inter\",\n showActionBg\n ? \"bg-primary-900 dark:bg-black-800 px-[10px] rounded-[43px]\"\n : \"\"\n )}\n >\n {showButtons ? (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"flex bg-primary-800 dark:bg-black-800 px-4 rounded-full\"\n >\n {actionItems.map(\n (button, index) =>\n button.visible !== false && (\n <div key={index}>\n {button.type === \"dropdown\" ? (\n <Dropdown\n menu={{\n items: button.dropdownItems,\n }}\n trigger={[button.dropdownTrigger \|\| \"click\"]}\n overlayClassName=\"!min-w-[148px]\"\n placement=\"bottomRight\"\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n open={showDropdown}\n onOpenChange={setShowDropdown}\n >\n <button\n key={index}\n id={`btn-floating-bar-${button.label}`}\n onClick={button.onClick}\n disabled={button.disabled}\n className={cn(\n !button?.label\n ? \"bg-transparent p-1.5 rounded-xl transition-all duration-200 hover:scale-105 hover:opacity-80\"\n : \"flex items-center mx-1 gap-1.5 py-1 pr-3 pl-2 rounded-md text-white hover:text-primary-50 hover:scale-105 transition-all duration-200 bg-transparent\",\n button?.hideLabel && \"!p-1.5\",\n (button.label === \"Delete\" \|\|\n button.label === \"Remove\" \|\|\n button.label === \"Delete user\" \|\|\n button.label === \"Move to trash\" \|\|\n button.label === \"Delete Permanently\") &&\n \"!text-error-500\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center\"\n >\n {button.icon}\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit ml-1.5\"}\n appearance=\"custom\"\n >\n {button.label}\n </Typography>\n )}\n </Tooltip>\n </button>\n </Dropdown>\n ) : (\n <button\n id={`btn-floating-bar-${button.label}`}\n onClick={button.onClick}\n disabled={button.disabled}\n className={cn(\n !button?.label\n ? \"bg-transparent p-1.5 rounded-xl transition-all duration-200 hover:scale-105 hover:opacity-80\"\n : \"flex items-center mx-1 gap-1.5 py-1 pr-3 pl-2 rounded-md text-white hover:text-primary-50 hover:scale-105 transition-all duration-200 bg-transparent\",\n button?.hideLabel && \"!p-1.5\",\n (button.label === \"Delete\" \|\|\n button.label === \"Remove\" \|\|\n button.label === \"Delete Permanently\") &&\n \"!text-error-500\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center\"\n >\n {button.icon}\n\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit ml-1.5\"}\n appearance=\"custom\"\n >\n {button.label}\n </Typography>\n )}\n </Tooltip>\n </button>\n )}\n </div>\n )\n )}\n {deleteConfig ? (\n <button\n id={`btn-floating-bar-${deleteButtonConfig.label}`}\n onClick={deleteButtonConfig.onClick}\n disabled={deleteButtonConfig.disabled}\n className={cn(\n \"flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200\",\n deleteButtonConfig.disabled && \"opacity-70\"\n )}\n >\n {deleteButtonConfig.icon}\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-error-500\"\n appearance=\"custom\"\n >\n {deleteButtonConfig.label}\n </Typography>\n </button>\n ) : null}\n </motion.div>\n ) : (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"minw-[150px] p-1.5 flex items-center\"\n >\n <Dropdown\n menu={{\n items: dropDownItems,\n }}\n trigger={[\"click\"]}\n overlayClassName=\"!min-w-[148px]\"\n placement=\"bottomRight\"\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n open={showDropdown}\n onOpenChange={setShowDropdown}\n >\n <button\n id={`btn-floating-bar-actions`}\n disabled={dropDownItems.length === 0}\n className={cn(\n \"flex items-center gap-1.5 px-2 py-1 w-22 h-7 rounded-full bg-primary-700 hover:scale-105 hover:opacity-80 transition-all duration-200\",\n dropDownItems.length === 0 &&\n \"opacity-60 hover:scale-100 hover:opacity-60\"\n )}\n type=\"button\"\n >\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-white\"\n >\n {t(\"Actions\")}\n </Typography>\n <DropdownArrowIcon\n fill=\"#FFFFFF\"\n className=\"w-[16px] h-[16px]\"\n />\n </button>\n </Dropdown>\n {deleteConfig ? (\n <button\n id={`btn-floating-bar-${deleteButtonConfig.label}`}\n onClick={deleteButtonConfig.onClick}\n disabled={deleteButtonConfig.disabled}\n className={cn(\n \"flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200\",\n deleteButtonConfig.disabled && \"opacity-70\"\n )}\n type=\"button\"\n >\n {deleteButtonConfig.icon}\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-error-500\"\n appearance=\"custom\"\n >\n {deleteButtonConfig.label}\n </Typography>\n </button>\n ) : null}\n </motion.div>\n )}\n </div>\n </div>\n </motion.div>\n );\n};\n\nFloatingBar.displayName = \"FloatingBar\";\n\n// Re-export types for convenience\nexport type { ButtonConfig as FloatingBarActionConfig };\nexport type FloatingBarDeleteConfig = TFloatingBar[\"deleteConfig\"];\nexport type FloatingBarProps = TFloatingBar;\n\n// Legacy type exports for backwards compatibility\nexport type FloatingBarSize = \"small\" \| \"medium\" \| \"large\";\nexport type FloatingBarPosition = \"top\" \| \"bottom\";\nexport type FloatingBarTheme = \"primary\" \| \"dark\" \| \"light\";\n"],"names":["CloseIcon","size","fill","className","jsx","DropdownArrowIcon","FloatingBar","props","show","isFlowDashboard","onClose","actionItems","selectedItemsCount","deleteConfig","showActionBg","t","useTranslation","showDropdown","setShowDropdown","useState","showButtons","setShowButtons","containerRef","useRef","actionContainerRef","useEffect","observer","containerWidth","deleteButtonConfig","DeleteIcon","dropDownItems","button","index","OptionButton","motion","cn","jsxs","IconButton","Typography","Dropdown","trigger","Tooltip"],"mappings":"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"}

package/dist/components/floating-bar/FloatingBar.es.js CHANGED Viewed

@@ -165,7 +165,7 @@ const O = ({
                                 className: r(
                                   e?.label ? "flex items-center mx-1 gap-1.5 py-1 pr-3 pl-2 rounded-md text-white hover:text-primary-50 hover:scale-105 transition-all duration-200 bg-transparent" : "bg-transparent p-1.5 rounded-xl transition-all duration-200 hover:scale-105 hover:opacity-80",
                                   e?.hideLabel && "!p-1.5",
-                                  (e.label === "Delete" || e.label === "Remove" || e.label === "Delete user" || e.label === "Delete Permanently") && "!text-error-500",
+                                  (e.label === "Delete" || e.label === "Remove" || e.label === "Delete user" || e.label === "Move to trash" || e.label === "Delete Permanently") && "!text-error-500",
                                   e.disabled && "opacity-70"
                                 ),
                                 children: /* @__PURE__ */ i(

package/dist/components/floating-bar/FloatingBar.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FloatingBar.es.js","sources":["../../../src/components/floating-bar/FloatingBar.tsx"],"sourcesContent":["import { Dropdown } from \"antd\";\nimport cn from \"classnames\";\nimport { motion } from \"framer-motion\";\nimport { useEffect, useRef, useState, type FC, type ReactNode } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Typography } from \"../data-display/typography/Typography\";\nimport { OptionButton } from \"../buttons/option-button/OptionButton\";\nimport IconButton from \"../button/IconButton\";\nimport Tooltip from \"../tooltip/Tooltip\";\nimport { DeleteIcon } from \"../icon\";\n\n/*\n Close icon component\n /\nconst CloseIcon: FC<{ size?: number; fill?: string; className?: string }> = ({\n size = 24,\n fill = \"currentColor\",\n className,\n}) => (\n <svg\n className={className}\n width={size}\n height={size}\n viewBox=\"0 0 20 20\"\n fill={fill}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M10.0002 11.1666L5.91683 15.2499C5.76405 15.4027 5.56961 15.4791 5.3335 15.4791C5.09739 15.4791 4.90294 15.4027 4.75016 15.2499C4.59738 15.0971 4.521 14.9027 4.521 14.6666C4.521 14.4305 4.59738 14.236 4.75016 14.0833L8.8335 9.99992L4.75016 5.91659C4.59738 5.76381 4.521 5.56936 4.521 5.33325C4.521 5.09714 4.59738 4.9027 4.75016 4.74992C4.90294 4.59714 5.09739 4.52075 5.3335 4.52075C5.56961 4.52075 5.76405 4.59714 5.91683 4.74992L10.0002 8.83325L14.0835 4.74992C14.2363 4.59714 14.4307 4.52075 14.6668 4.52075C14.9029 4.52075 15.0974 4.59714 15.2502 4.74992C15.4029 4.9027 15.4793 5.09714 15.4793 5.33325C15.4793 5.56936 15.4029 5.76381 15.2502 5.91659L11.1668 9.99992L15.2502 14.0833C15.4029 14.236 15.4793 14.4305 15.4793 14.6666C15.4793 14.9027 15.4029 15.0971 15.2502 15.2499C15.0974 15.4027 14.9029 15.4791 14.6668 15.4791C14.4307 15.4791 14.2363 15.4027 14.0835 15.2499L10.0002 11.1666Z\" />\n </svg>\n);\n\n/\n Dropdown arrow icon component\n /\nconst DropdownArrowIcon: FC<{ fill?: string; className?: string }> = ({\n fill = \"#cccccc\",\n className,\n}) => (\n <svg\n height=\"20\"\n width=\"20\"\n viewBox=\"0 0 20 20\"\n focusable=\"false\"\n className={className}\n >\n <path\n fill={fill}\n d=\"M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z\"\n />\n </svg>\n);\n\n/\n Configuration for action buttons in the floating bar\n /\nexport type ButtonConfig = {\n /* Button label text /\n label?: string;\n /* Icon element to display /\n icon: ReactNode;\n /* Click handler for the action /\n onClick?: () => void;\n /* Icon for dropdown mode /\n dropdownIcon?: ReactNode;\n /* Whether the action is visible /\n visible?: boolean;\n /* Whether the action is disabled /\n disabled?: boolean;\n /* Tooltip text /\n tooltip?: string;\n /* Whether to hide the label text /\n hideLabel?: boolean;\n /* Action type /\n type?: \"button\" \| \"dropdown\";\n /* Dropdown trigger mode /\n dropdownTrigger?: \"click\" \| \"hover\";\n /* Dropdown menu items /\n dropdownItems?: Array<{\n label: ReactNode;\n key: string;\n disabled?: boolean;\n }>;\n};\n\n/\n Props for the FloatingBar component\n /\nexport type TFloatingBar = {\n /* Whether the floating bar is visible /\n show?: boolean;\n /* Close handler /\n onClose: () => void;\n /* Whether this is used in flow dashboard layout /\n isFlowDashboard?: boolean;\n /* Array of action configurations /\n actionItems: ButtonConfig[];\n /* Number of selected items /\n selectedItemsCount?: number;\n /* Delete action configuration /\n deleteConfig?: {\n label?: string;\n disabled?: boolean;\n onClick?: () => void;\n };\n /* Whether to show action background /\n showActionBg?: boolean;\n};\n\n/\n FloatingBar component provides a floating action bar for bulk operations.\n * Drop-in replacement matching the lax-web-portal implementation.\n \n @example\n * ```tsx\n * <FloatingBar\n * show={selectedItems.length > 0}\n * onClose={() => setSelectedItems([])}\n * selectedItemsCount={selectedItems.length}\n * actionItems={[\n * {\n * label: \"Edit\",\n * icon: <EditIcon size={16} />,\n * onClick: handleEdit,\n * },\n * {\n * label: \"Archive\",\n * icon: <ArchiveIcon size={16} />,\n * onClick: handleArchive,\n * },\n * ]}\n * deleteConfig={{\n * label: \"Delete\",\n * onClick: handleDelete,\n * }}\n * />\n * ```\n /\nexport const FloatingBar: FC<TFloatingBar> = (props) => {\n const {\n show,\n isFlowDashboard,\n onClose,\n actionItems,\n selectedItemsCount,\n deleteConfig,\n showActionBg,\n } = props;\n\n const { t } = useTranslation();\n const [showDropdown, setShowDropdown] = useState<boolean>(false);\n const [showButtons, setShowButtons] = useState<boolean>(true);\n\n const containerRef = useRef<HTMLDivElement>(null);\n const actionContainerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n if (containerRef.current && actionContainerRef.current) {\n const containerWidth = containerRef.current.scrollWidth - 100;\n const totalActionItemsWidth = actionItems.length 180 + 100;\n if (totalActionItemsWidth > containerWidth) {\n setShowButtons(false);\n } else {\n setShowButtons(true);\n }\n }\n });\n\n if (containerRef.current) {\n observer.observe(containerRef.current);\n }\n\n return () => {\n if (containerRef.current) {\n observer.unobserve(containerRef.current);\n }\n };\n });\n\n const deleteButtonConfig = {\n label: t(\"Delete\"),\n icon: <DeleteIcon size={16} className=\"text-error-500\" />,\n color: \"text-error-500 dark:text-error-500\",\n onClick: deleteConfig?.onClick,\n ...deleteConfig,\n };\n\n const dropDownItems = actionItems\n .filter((button) => button.visible !== false)\n .map((button, index) => ({\n key: index,\n label: (\n <OptionButton\n icon={button.dropdownIcon}\n text={button?.label \|\| \"\"}\n onClick={button.onClick}\n className=\"font-inter text-base font-medium text-black-900 dark:text-black-200 gap-1.5\"\n />\n ),\n children: button.dropdownItems,\n disabled: false,\n }));\n\n return !show ? null : (\n <motion.div\n initial={{ y: 20, opacity: 0 }}\n animate={{ y: 0, opacity: 1 }}\n exit={{ y: 20, opacity: 0 }}\n transition={{\n duration: 0.2,\n ease: [0.4, 0, 0.2, 1],\n opacity: { duration: 0.15 },\n }}\n ref={containerRef}\n className={cn(\"h-[40px]\", isFlowDashboard ? \"ml-60 w-1/2\" : \"w-full\")}\n >\n <div\n className={cn(\n \"h-[40px] border py-1.5 px-2 text-white bg-primary-800 dark:bg-black-700 flex justify-between items-center\"\n )}\n >\n <div className=\"flex items-center\">\n <IconButton\n tooltip=\"Close\"\n variant=\"ghost\"\n onClick={onClose}\n className=\"!p-0 text-white hover:opacity-80 hover:rotate-90 transition-all duration-200\"\n >\n <CloseIcon size={20} />\n </IconButton>\n <div className=\"flex items-center gap-1.5 ml-2\">\n <span className=\"text-primary-600 dark:text-black-100 bg-primary-50 dark:bg-black-800 border-primary-200 dark:border-black-800 text-xs leading-4 font-normal border rounded-full pr-2 pl-2\">\n {selectedItemsCount \|\| 0}\n </span>\n <Typography\n size=\"extra-small\"\n appearance=\"custom\"\n className=\"text-white\"\n >\n {t(\"Selected\")}\n </Typography>\n </div>\n </div>\n <div\n ref={actionContainerRef}\n className={cn(\n \"h-[36px] flex items-center rounded-full font-inter\",\n showActionBg\n ? \"bg-primary-900 dark:bg-black-800 px-[10px] rounded-[43px]\"\n : \"\"\n )}\n >\n {showButtons ? (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"flex bg-primary-800 dark:bg-black-800 px-4 rounded-full\"\n >\n {actionItems.map(\n (button, index) =>\n button.visible !== false && (\n <div key={index}>\n {button.type === \"dropdown\" ? (\n <Dropdown\n menu={{\n items: button.dropdownItems,\n }}\n trigger={[button.dropdownTrigger \|\| \"click\"]}\n overlayClassName=\"!min-w-[148px]\"\n placement=\"bottomRight\"\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n open={showDropdown}\n onOpenChange={setShowDropdown}\n >\n <button\n key={index}\n id={`btn-floating-bar-${button.label}`}\n onClick={button.onClick}\n disabled={button.disabled}\n className={cn(\n !button?.label\n ? \"bg-transparent p-1.5 rounded-xl transition-all duration-200 hover:scale-105 hover:opacity-80\"\n : \"flex items-center mx-1 gap-1.5 py-1 pr-3 pl-2 rounded-md text-white hover:text-primary-50 hover:scale-105 transition-all duration-200 bg-transparent\",\n button?.hideLabel && \"!p-1.5\",\n (button.label === \"Delete\" \|\|\n button.label === \"Remove\" \|\|\n button.label === \"Delete user\" \|\|\n button.label === \"Delete Permanently\") &&\n \"!text-error-500\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center\"\n >\n {button.icon}\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit ml-1.5\"}\n appearance=\"custom\"\n >\n {button.label}\n </Typography>\n )}\n </Tooltip>\n </button>\n </Dropdown>\n ) : (\n <button\n id={`btn-floating-bar-${button.label}`}\n onClick={button.onClick}\n disabled={button.disabled}\n className={cn(\n !button?.label\n ? \"bg-transparent p-1.5 rounded-xl transition-all duration-200 hover:scale-105 hover:opacity-80\"\n : \"flex items-center mx-1 gap-1.5 py-1 pr-3 pl-2 rounded-md text-white hover:text-primary-50 hover:scale-105 transition-all duration-200 bg-transparent\",\n button?.hideLabel && \"!p-1.5\",\n (button.label === \"Delete\" \|\|\n button.label === \"Remove\" \|\|\n button.label === \"Delete Permanently\") &&\n \"!text-error-500\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center\"\n >\n {button.icon}\n\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit ml-1.5\"}\n appearance=\"custom\"\n >\n {button.label}\n </Typography>\n )}\n </Tooltip>\n </button>\n )}\n </div>\n )\n )}\n {deleteConfig ? (\n <button\n id={`btn-floating-bar-${deleteButtonConfig.label}`}\n onClick={deleteButtonConfig.onClick}\n disabled={deleteButtonConfig.disabled}\n className={cn(\n \"flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200\",\n deleteButtonConfig.disabled && \"opacity-70\"\n )}\n >\n {deleteButtonConfig.icon}\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-error-500\"\n appearance=\"custom\"\n >\n {deleteButtonConfig.label}\n </Typography>\n </button>\n ) : null}\n </motion.div>\n ) : (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"minw-[150px] p-1.5 flex items-center\"\n >\n <Dropdown\n menu={{\n items: dropDownItems,\n }}\n trigger={[\"click\"]}\n overlayClassName=\"!min-w-[148px]\"\n placement=\"bottomRight\"\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n open={showDropdown}\n onOpenChange={setShowDropdown}\n >\n <button\n id={`btn-floating-bar-actions`}\n disabled={dropDownItems.length === 0}\n className={cn(\n \"flex items-center gap-1.5 px-2 py-1 w-22 h-7 rounded-full bg-primary-700 hover:scale-105 hover:opacity-80 transition-all duration-200\",\n dropDownItems.length === 0 &&\n \"opacity-60 hover:scale-100 hover:opacity-60\"\n )}\n type=\"button\"\n >\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-white\"\n >\n {t(\"Actions\")}\n </Typography>\n <DropdownArrowIcon\n fill=\"#FFFFFF\"\n className=\"w-[16px] h-[16px]\"\n />\n </button>\n </Dropdown>\n {deleteConfig ? (\n <button\n id={`btn-floating-bar-${deleteButtonConfig.label}`}\n onClick={deleteButtonConfig.onClick}\n disabled={deleteButtonConfig.disabled}\n className={cn(\n \"flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200\",\n deleteButtonConfig.disabled && \"opacity-70\"\n )}\n type=\"button\"\n >\n {deleteButtonConfig.icon}\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-error-500\"\n appearance=\"custom\"\n >\n {deleteButtonConfig.label}\n </Typography>\n </button>\n ) : null}\n </motion.div>\n )}\n </div>\n </div>\n </motion.div>\n );\n};\n\nFloatingBar.displayName = \"FloatingBar\";\n\n// Re-export types for convenience\nexport type { ButtonConfig as FloatingBarActionConfig };\nexport type FloatingBarDeleteConfig = TFloatingBar[\"deleteConfig\"];\nexport type FloatingBarProps = TFloatingBar;\n\n// Legacy type exports for backwards compatibility\nexport type FloatingBarSize = \"small\" \| \"medium\" \| \"large\";\nexport type FloatingBarPosition = \"top\" \| \"bottom\";\nexport type FloatingBarTheme = \"primary\" \| \"dark\" \| \"light\";\n"],"names":["CloseIcon","size","fill","className","jsx","DropdownArrowIcon","FloatingBar","props","show","isFlowDashboard","onClose","actionItems","selectedItemsCount","deleteConfig","showActionBg","t","useTranslation","showDropdown","setShowDropdown","useState","showButtons","setShowButtons","containerRef","useRef","actionContainerRef","useEffect","observer","containerWidth","deleteButtonConfig","DeleteIcon","dropDownItems","button","index","OptionButton","motion","cn","jsxs","IconButton","Typography","Dropdown","trigger","Tooltip"],"mappings":"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"}
1	+ {"version":3,"file":"FloatingBar.es.js","sources":["../../../src/components/floating-bar/FloatingBar.tsx"],"sourcesContent":["import { Dropdown } from \"antd\";\nimport cn from \"classnames\";\nimport { motion } from \"framer-motion\";\nimport { useEffect, useRef, useState, type FC, type ReactNode } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Typography } from \"../data-display/typography/Typography\";\nimport { OptionButton } from \"../buttons/option-button/OptionButton\";\nimport IconButton from \"../button/IconButton\";\nimport Tooltip from \"../tooltip/Tooltip\";\nimport { DeleteIcon } from \"../icon\";\n\n/*\n Close icon component\n /\nconst CloseIcon: FC<{ size?: number; fill?: string; className?: string }> = ({\n size = 24,\n fill = \"currentColor\",\n className,\n}) => (\n <svg\n className={className}\n width={size}\n height={size}\n viewBox=\"0 0 20 20\"\n fill={fill}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M10.0002 11.1666L5.91683 15.2499C5.76405 15.4027 5.56961 15.4791 5.3335 15.4791C5.09739 15.4791 4.90294 15.4027 4.75016 15.2499C4.59738 15.0971 4.521 14.9027 4.521 14.6666C4.521 14.4305 4.59738 14.236 4.75016 14.0833L8.8335 9.99992L4.75016 5.91659C4.59738 5.76381 4.521 5.56936 4.521 5.33325C4.521 5.09714 4.59738 4.9027 4.75016 4.74992C4.90294 4.59714 5.09739 4.52075 5.3335 4.52075C5.56961 4.52075 5.76405 4.59714 5.91683 4.74992L10.0002 8.83325L14.0835 4.74992C14.2363 4.59714 14.4307 4.52075 14.6668 4.52075C14.9029 4.52075 15.0974 4.59714 15.2502 4.74992C15.4029 4.9027 15.4793 5.09714 15.4793 5.33325C15.4793 5.56936 15.4029 5.76381 15.2502 5.91659L11.1668 9.99992L15.2502 14.0833C15.4029 14.236 15.4793 14.4305 15.4793 14.6666C15.4793 14.9027 15.4029 15.0971 15.2502 15.2499C15.0974 15.4027 14.9029 15.4791 14.6668 15.4791C14.4307 15.4791 14.2363 15.4027 14.0835 15.2499L10.0002 11.1666Z\" />\n </svg>\n);\n\n/\n Dropdown arrow icon component\n /\nconst DropdownArrowIcon: FC<{ fill?: string; className?: string }> = ({\n fill = \"#cccccc\",\n className,\n}) => (\n <svg\n height=\"20\"\n width=\"20\"\n viewBox=\"0 0 20 20\"\n focusable=\"false\"\n className={className}\n >\n <path\n fill={fill}\n d=\"M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z\"\n />\n </svg>\n);\n\n/\n Configuration for action buttons in the floating bar\n /\nexport type ButtonConfig = {\n /* Button label text /\n label?: string;\n /* Icon element to display /\n icon: ReactNode;\n /* Click handler for the action /\n onClick?: () => void;\n /* Icon for dropdown mode /\n dropdownIcon?: ReactNode;\n /* Whether the action is visible /\n visible?: boolean;\n /* Whether the action is disabled /\n disabled?: boolean;\n /* Tooltip text /\n tooltip?: string;\n /* Whether to hide the label text /\n hideLabel?: boolean;\n /* Action type /\n type?: \"button\" \| \"dropdown\";\n /* Dropdown trigger mode /\n dropdownTrigger?: \"click\" \| \"hover\";\n /* Dropdown menu items /\n dropdownItems?: Array<{\n label: ReactNode;\n key: string;\n disabled?: boolean;\n }>;\n};\n\n/\n Props for the FloatingBar component\n /\nexport type TFloatingBar = {\n /* Whether the floating bar is visible /\n show?: boolean;\n /* Close handler /\n onClose: () => void;\n /* Whether this is used in flow dashboard layout /\n isFlowDashboard?: boolean;\n /* Array of action configurations /\n actionItems: ButtonConfig[];\n /* Number of selected items /\n selectedItemsCount?: number;\n /* Delete action configuration /\n deleteConfig?: {\n label?: string;\n disabled?: boolean;\n onClick?: () => void;\n };\n /* Whether to show action background /\n showActionBg?: boolean;\n};\n\n/\n FloatingBar component provides a floating action bar for bulk operations.\n * Drop-in replacement matching the lax-web-portal implementation.\n \n @example\n * ```tsx\n * <FloatingBar\n * show={selectedItems.length > 0}\n * onClose={() => setSelectedItems([])}\n * selectedItemsCount={selectedItems.length}\n * actionItems={[\n * {\n * label: \"Edit\",\n * icon: <EditIcon size={16} />,\n * onClick: handleEdit,\n * },\n * {\n * label: \"Archive\",\n * icon: <ArchiveIcon size={16} />,\n * onClick: handleArchive,\n * },\n * ]}\n * deleteConfig={{\n * label: \"Delete\",\n * onClick: handleDelete,\n * }}\n * />\n * ```\n /\nexport const FloatingBar: FC<TFloatingBar> = (props) => {\n const {\n show,\n isFlowDashboard,\n onClose,\n actionItems,\n selectedItemsCount,\n deleteConfig,\n showActionBg,\n } = props;\n\n const { t } = useTranslation();\n const [showDropdown, setShowDropdown] = useState<boolean>(false);\n const [showButtons, setShowButtons] = useState<boolean>(true);\n\n const containerRef = useRef<HTMLDivElement>(null);\n const actionContainerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n if (containerRef.current && actionContainerRef.current) {\n const containerWidth = containerRef.current.scrollWidth - 100;\n const totalActionItemsWidth = actionItems.length 180 + 100;\n if (totalActionItemsWidth > containerWidth) {\n setShowButtons(false);\n } else {\n setShowButtons(true);\n }\n }\n });\n\n if (containerRef.current) {\n observer.observe(containerRef.current);\n }\n\n return () => {\n if (containerRef.current) {\n observer.unobserve(containerRef.current);\n }\n };\n });\n\n const deleteButtonConfig = {\n label: t(\"Delete\"),\n icon: <DeleteIcon size={16} className=\"text-error-500\" />,\n color: \"text-error-500 dark:text-error-500\",\n onClick: deleteConfig?.onClick,\n ...deleteConfig,\n };\n\n const dropDownItems = actionItems\n .filter((button) => button.visible !== false)\n .map((button, index) => ({\n key: index,\n label: (\n <OptionButton\n icon={button.dropdownIcon}\n text={button?.label \|\| \"\"}\n onClick={button.onClick}\n className=\"font-inter text-base font-medium text-black-900 dark:text-black-200 gap-1.5\"\n />\n ),\n children: button.dropdownItems,\n disabled: false,\n }));\n\n return !show ? null : (\n <motion.div\n initial={{ y: 20, opacity: 0 }}\n animate={{ y: 0, opacity: 1 }}\n exit={{ y: 20, opacity: 0 }}\n transition={{\n duration: 0.2,\n ease: [0.4, 0, 0.2, 1],\n opacity: { duration: 0.15 },\n }}\n ref={containerRef}\n className={cn(\"h-[40px]\", isFlowDashboard ? \"ml-60 w-1/2\" : \"w-full\")}\n >\n <div\n className={cn(\n \"h-[40px] border py-1.5 px-2 text-white bg-primary-800 dark:bg-black-700 flex justify-between items-center\"\n )}\n >\n <div className=\"flex items-center\">\n <IconButton\n tooltip=\"Close\"\n variant=\"ghost\"\n onClick={onClose}\n className=\"!p-0 text-white hover:opacity-80 hover:rotate-90 transition-all duration-200\"\n >\n <CloseIcon size={20} />\n </IconButton>\n <div className=\"flex items-center gap-1.5 ml-2\">\n <span className=\"text-primary-600 dark:text-black-100 bg-primary-50 dark:bg-black-800 border-primary-200 dark:border-black-800 text-xs leading-4 font-normal border rounded-full pr-2 pl-2\">\n {selectedItemsCount \|\| 0}\n </span>\n <Typography\n size=\"extra-small\"\n appearance=\"custom\"\n className=\"text-white\"\n >\n {t(\"Selected\")}\n </Typography>\n </div>\n </div>\n <div\n ref={actionContainerRef}\n className={cn(\n \"h-[36px] flex items-center rounded-full font-inter\",\n showActionBg\n ? \"bg-primary-900 dark:bg-black-800 px-[10px] rounded-[43px]\"\n : \"\"\n )}\n >\n {showButtons ? (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"flex bg-primary-800 dark:bg-black-800 px-4 rounded-full\"\n >\n {actionItems.map(\n (button, index) =>\n button.visible !== false && (\n <div key={index}>\n {button.type === \"dropdown\" ? (\n <Dropdown\n menu={{\n items: button.dropdownItems,\n }}\n trigger={[button.dropdownTrigger \|\| \"click\"]}\n overlayClassName=\"!min-w-[148px]\"\n placement=\"bottomRight\"\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n open={showDropdown}\n onOpenChange={setShowDropdown}\n >\n <button\n key={index}\n id={`btn-floating-bar-${button.label}`}\n onClick={button.onClick}\n disabled={button.disabled}\n className={cn(\n !button?.label\n ? \"bg-transparent p-1.5 rounded-xl transition-all duration-200 hover:scale-105 hover:opacity-80\"\n : \"flex items-center mx-1 gap-1.5 py-1 pr-3 pl-2 rounded-md text-white hover:text-primary-50 hover:scale-105 transition-all duration-200 bg-transparent\",\n button?.hideLabel && \"!p-1.5\",\n (button.label === \"Delete\" \|\|\n button.label === \"Remove\" \|\|\n button.label === \"Delete user\" \|\|\n button.label === \"Move to trash\" \|\|\n button.label === \"Delete Permanently\") &&\n \"!text-error-500\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center\"\n >\n {button.icon}\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit ml-1.5\"}\n appearance=\"custom\"\n >\n {button.label}\n </Typography>\n )}\n </Tooltip>\n </button>\n </Dropdown>\n ) : (\n <button\n id={`btn-floating-bar-${button.label}`}\n onClick={button.onClick}\n disabled={button.disabled}\n className={cn(\n !button?.label\n ? \"bg-transparent p-1.5 rounded-xl transition-all duration-200 hover:scale-105 hover:opacity-80\"\n : \"flex items-center mx-1 gap-1.5 py-1 pr-3 pl-2 rounded-md text-white hover:text-primary-50 hover:scale-105 transition-all duration-200 bg-transparent\",\n button?.hideLabel && \"!p-1.5\",\n (button.label === \"Delete\" \|\|\n button.label === \"Remove\" \|\|\n button.label === \"Delete Permanently\") &&\n \"!text-error-500\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center\"\n >\n {button.icon}\n\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit ml-1.5\"}\n appearance=\"custom\"\n >\n {button.label}\n </Typography>\n )}\n </Tooltip>\n </button>\n )}\n </div>\n )\n )}\n {deleteConfig ? (\n <button\n id={`btn-floating-bar-${deleteButtonConfig.label}`}\n onClick={deleteButtonConfig.onClick}\n disabled={deleteButtonConfig.disabled}\n className={cn(\n \"flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200\",\n deleteButtonConfig.disabled && \"opacity-70\"\n )}\n >\n {deleteButtonConfig.icon}\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-error-500\"\n appearance=\"custom\"\n >\n {deleteButtonConfig.label}\n </Typography>\n </button>\n ) : null}\n </motion.div>\n ) : (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"minw-[150px] p-1.5 flex items-center\"\n >\n <Dropdown\n menu={{\n items: dropDownItems,\n }}\n trigger={[\"click\"]}\n overlayClassName=\"!min-w-[148px]\"\n placement=\"bottomRight\"\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n open={showDropdown}\n onOpenChange={setShowDropdown}\n >\n <button\n id={`btn-floating-bar-actions`}\n disabled={dropDownItems.length === 0}\n className={cn(\n \"flex items-center gap-1.5 px-2 py-1 w-22 h-7 rounded-full bg-primary-700 hover:scale-105 hover:opacity-80 transition-all duration-200\",\n dropDownItems.length === 0 &&\n \"opacity-60 hover:scale-100 hover:opacity-60\"\n )}\n type=\"button\"\n >\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-white\"\n >\n {t(\"Actions\")}\n </Typography>\n <DropdownArrowIcon\n fill=\"#FFFFFF\"\n className=\"w-[16px] h-[16px]\"\n />\n </button>\n </Dropdown>\n {deleteConfig ? (\n <button\n id={`btn-floating-bar-${deleteButtonConfig.label}`}\n onClick={deleteButtonConfig.onClick}\n disabled={deleteButtonConfig.disabled}\n className={cn(\n \"flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200\",\n deleteButtonConfig.disabled && \"opacity-70\"\n )}\n type=\"button\"\n >\n {deleteButtonConfig.icon}\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"text-error-500\"\n appearance=\"custom\"\n >\n {deleteButtonConfig.label}\n </Typography>\n </button>\n ) : null}\n </motion.div>\n )}\n </div>\n </div>\n </motion.div>\n );\n};\n\nFloatingBar.displayName = \"FloatingBar\";\n\n// Re-export types for convenience\nexport type { ButtonConfig as FloatingBarActionConfig };\nexport type FloatingBarDeleteConfig = TFloatingBar[\"deleteConfig\"];\nexport type FloatingBarProps = TFloatingBar;\n\n// Legacy type exports for backwards compatibility\nexport type FloatingBarSize = \"small\" \| \"medium\" \| \"large\";\nexport type FloatingBarPosition = \"top\" \| \"bottom\";\nexport type FloatingBarTheme = \"primary\" \| \"dark\" \| \"light\";\n"],"names":["CloseIcon","size","fill","className","jsx","DropdownArrowIcon","FloatingBar","props","show","isFlowDashboard","onClose","actionItems","selectedItemsCount","deleteConfig","showActionBg","t","useTranslation","showDropdown","setShowDropdown","useState","showButtons","setShowButtons","containerRef","useRef","actionContainerRef","useEffect","observer","containerWidth","deleteButtonConfig","DeleteIcon","dropDownItems","button","index","OptionButton","motion","cn","jsxs","IconButton","Typography","Dropdown","trigger","Tooltip"],"mappings":"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"}

package/dist/components/forms/search-bar/SearchBar.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("react"),D=require("react-debounce-input"),E=require("react-i18next"),L=require("antd"),u=require("../../../_virtual/index.cjs.js"),t=require("../../data-display/typography/Typography.cjs.js"),M=require("../../icons/CloseRounded.cjs.js"),O=require("../../icons/SearchIcon.cjs.js"),W=r=>{const{value:s,placeholder:w,onChange:m,id:T,debounceTimeout:S=0,classValues:h,handleKeyDown:p,isClearable:c,onFocusText:C,autoComplete:B="false",searchRef:f,hasNavigation:g=!1,autoFocus:R=!1,searchConfig:F,hideSearchIcon:y,allowAStarSearch:j=!1,...q}=r,{t:n}=E.useTranslation(),[b,l]=x.useState(!1),[A,k]=x.useState("search"),N=x.useRef(null),{searchCount:i,searchPointer:d,setSearchPointer:o}=F||{},I=()=>{const a=c&&!!s,v=g&&!!s;return a&&v?"pr-28":v?"pr-12":a?"pr-8":"pr-7"},P=()=>{l(!0),k(C||w||n("Search"));const a=f||N;a.current&&a.current.focus()},z=()=>{l(!1),k("")};return e.jsxs("label",{className:u("relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8",h),children:[!y&&e.jsx("div",{className:"flex items-center h-6 w-6 pointer-events-none",children:e.jsx(O.SearchIcon,{width:"16",height:"16"})}),e.jsx(D.DebounceInput,{...q,spellCheck:"false",debounceTimeout:S,id:T,inputRef:f||N,type:"text",className:u(`absolute inset-0 dark:text-[#98A2B3] text-neutral-900  ${y?"pl-2":"pl-10"} pl-10 ${I()} w-full text-sm  dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,"border border-solid","dark:border-neutral-800 border-neutral-200","dark:caret-white",h),onKeyDown:a=>{a.key==="Enter"&&a.preventDefault(),p&&p(a)},value:s||"",placeholder:b?A:j?"":`${n("Search")}`,onChange:a=>m?.(a.target.value),autoComplete:B,onFocus:a=>{l(!0),P(),r.onFocus&&r.onFocus(a)},onBlur:a=>{l(!1),z(),r.onBlur&&r.onBlur(a)},autoFocus:R}),g&&s&&e.jsxs("div",{className:u("absolute mr-2 focus:outline-none flex gap-1",c?"right-6":"right-0"),children:[!!i&&(i||0)>0&&e.jsxs("span",{className:"text-xs border-r pr-2 border-gray-200",children:[(d||0)+1,"/",i]}),e.jsxs("div",{className:"flex gap-1 items-center",children:[e.jsx("button",{id:"btn-search-bar-set-search-pointer-forward",onClick:()=>{o&&o(a=>(a||0)-1)},disabled:d===0,children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M15 18l-6-6 6-6",stroke:"#98A2B3",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}),e.jsx("button",{id:"btn-search-bar-set-search-pointer-backward",onClick:()=>{o&&o(a=>(a||0)+1)},disabled:d===(i||0)-1,children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M9 18l6-6-6-6",stroke:"#98A2B3",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]})]}),j&&!(c&&s)&&!b&&!s?e.jsxs("div",{className:"absolute flex ml-6 items-center justify-center  focus:outline-none gap-1 flex-wrap-none",children:[e.jsxs(t.Typography,{className:"text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5",children:[n("Search")," (use"]}),e.jsx("button",{className:" bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5",children:e.jsx(L.Tooltip,{placement:"bottomRight",color:"#141414",classNames:{root:"custom-tooltip dark:!bg-black-800"},title:e.jsxs("div",{className:"flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit",children:[e.jsx(t.Typography,{variant:"semibold",size:"extra-small",className:"text-white",children:n("Normal Search")}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-primary-400 dark:text-primary-400",appearance:"custom",children:n("Examples")}),e.jsxs("div",{className:"flex flex-col items-start justify-center ",children:[e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"data"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "data", "Data".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"text"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "text", "context", "plaintext".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"base"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "database", "baseball", "basename".'})]})]}),e.jsx("div",{className:"h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2"}),e.jsx(t.Typography,{variant:"semibold",size:"extra-small",className:"text-white",children:"Wildcard Search"}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-white dark:text-black-200",appearance:"custom",children:"Use * as a wildcard to refine your search."}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-primary-400 dark:text-primary-400",appearance:"custom",children:"Examples:"}),e.jsxs("div",{className:"flex flex-col items-start justify-center ",children:[e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ",appearance:"custom",children:"contract*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ "contracts", "contractor", "CONTRACTOR".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ",appearance:"custom",children:"*agreement"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "service agreement", "legal agreement".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"*clause*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "clause", "subclause", "clauses".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"*l*s*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "clause", "clauses".'})]})]})]}),children:e.jsx("div",{className:"text-[#475467] dark:text-black-300 dark:bg-black-600",children:"*"})})}),e.jsx(t.Typography,{className:"text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5",children:"as a wildcard)"})]}):c&&s&&e.jsx("button",{id:"btn-search-bar-close",className:"absolute right-0 mr-2 focus:outline-none",onClick:()=>m?.(""),children:e.jsx(M.CloseRounded,{classValue:"text-neutral-200 dark:text-black-500",size:16})})]})};exports.SearchBar=W;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("react"),D=require("react-debounce-input"),E=require("react-i18next"),L=require("antd"),u=require("../../../_virtual/index.cjs.js"),t=require("../../data-display/typography/Typography.cjs.js"),M=require("../../icons/CloseRounded.cjs.js"),O=require("../../icons/SearchIcon.cjs.js"),W=r=>{const{value:s,placeholder:w,onChange:m,id:T,debounceTimeout:S=0,classValues:h,handleKeyDown:p,isClearable:c,onFocusText:C,autoComplete:B="false",searchRef:f,hasNavigation:g=!1,autoFocus:R=!1,searchConfig:F,hideSearchIcon:y,allowAStarSearch:j=!1,...q}=r,{t:n}=E.useTranslation(),[b,l]=x.useState(!1),[A,k]=x.useState("search"),N=x.useRef(null),{searchCount:i,searchPointer:d,setSearchPointer:o}=F||{},I=()=>{const a=c&&!!s,v=g&&!!s;return a&&v?"pr-28":v?"pr-12":a?"pr-8":"pr-7"},P=()=>{l(!0),k(C||w||n("Search"));const a=f||N;a.current&&a.current.focus()},z=()=>{l(!1),k("")};return e.jsxs("label",{className:u("relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8",h),children:[!y&&e.jsx("div",{className:"flex items-center h-6 w-6 pointer-events-none",children:e.jsx(O.SearchIcon,{width:"16",height:"16"})}),e.jsx(D.DebounceInput,{...q,spellCheck:"false",debounceTimeout:S,id:T,inputRef:f||N,type:"text",className:u(`absolute inset-0 dark:text-[#98A2B3] text-neutral-900  ${y?"pl-2":"pl-10"} pl-10 ${I()} w-full text-sm  dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,"border border-solid","dark:border-neutral-800 border-neutral-200","dark:caret-white",h),onKeyDown:a=>{a.key==="Enter"&&a.preventDefault(),p&&p(a)},value:s||"",placeholder:b?A:j?"":`${n("Search")}`,onChange:a=>m?.(a.target.value),autoComplete:B,onFocus:a=>{l(!0),P(),r.onFocus&&r.onFocus(a)},onBlur:a=>{l(!1),z(),r.onBlur&&r.onBlur(a)},autoFocus:R}),g&&s&&e.jsxs("div",{className:u("absolute mr-2 focus:outline-none flex items-center gap-1",c?"right-6":"right-0"),children:[!!i&&(i||0)>0&&e.jsxs("span",{className:"text-xs border-r pr-2 border-gray-200",children:[(d||0)+1,"/",i]}),e.jsxs("div",{className:"flex gap-1 items-center",children:[e.jsx("button",{id:"btn-search-bar-set-search-pointer-forward",onClick:()=>{o&&o(a=>(a||0)-1)},disabled:d===0,children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M15 18l-6-6 6-6",stroke:"#98A2B3",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}),e.jsx("button",{id:"btn-search-bar-set-search-pointer-backward",onClick:()=>{o&&o(a=>(a||0)+1)},disabled:d===(i||0)-1,children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M9 18l6-6-6-6",stroke:"#98A2B3",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]})]}),j&&!(c&&s)&&!b&&!s?e.jsxs("div",{className:"absolute flex ml-6 items-center justify-center  focus:outline-none gap-1 flex-wrap-none",children:[e.jsxs(t.Typography,{className:"text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5",children:[n("Search")," (use"]}),e.jsx("button",{className:" bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5",children:e.jsx(L.Tooltip,{placement:"bottomRight",color:"#141414",classNames:{root:"custom-tooltip dark:!bg-black-800"},title:e.jsxs("div",{className:"flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit",children:[e.jsx(t.Typography,{variant:"semibold",size:"extra-small",className:"text-white",children:n("Normal Search")}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-primary-400 dark:text-primary-400",appearance:"custom",children:n("Examples")}),e.jsxs("div",{className:"flex flex-col items-start justify-center ",children:[e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"data"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "data", "Data".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"text"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "text", "context", "plaintext".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"base"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "database", "baseball", "basename".'})]})]}),e.jsx("div",{className:"h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2"}),e.jsx(t.Typography,{variant:"semibold",size:"extra-small",className:"text-white",children:"Wildcard Search"}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-white dark:text-black-200",appearance:"custom",children:"Use * as a wildcard to refine your search."}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-primary-400 dark:text-primary-400",appearance:"custom",children:"Examples:"}),e.jsxs("div",{className:"flex flex-col items-start justify-center ",children:[e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ",appearance:"custom",children:"contract*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ "contracts", "contractor", "CONTRACTOR".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ",appearance:"custom",children:"*agreement"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "service agreement", "legal agreement".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"*clause*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "clause", "subclause", "clauses".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"*l*s*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "clause", "clauses".'})]})]})]}),children:e.jsx("div",{className:"text-[#475467] dark:text-black-300 dark:bg-black-600",children:"*"})})}),e.jsx(t.Typography,{className:"text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5",children:"as a wildcard)"})]}):c&&s&&e.jsx("button",{id:"btn-search-bar-close",className:"absolute right-0 mr-2 focus:outline-none",onClick:()=>m?.(""),children:e.jsx(M.CloseRounded,{classValue:"text-neutral-200 dark:text-black-500",size:16})})]})};exports.SearchBar=W;
 //# sourceMappingURL=SearchBar.cjs.js.map

package/dist/components/forms/search-bar/SearchBar.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchBar.cjs.js","sources":["../../../../src/components/forms/search-bar/SearchBar.tsx"],"sourcesContent":["import {type FC, type HTMLAttributes, useRef, useState } from 'react';\nimport { DebounceInput } from 'react-debounce-input';\nimport { useTranslation } from 'react-i18next';\nimport { Tooltip } from 'antd';\nimport cn from 'classnames';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { CloseRounded } from '../../icons/CloseRounded';\nimport { SearchIcon } from '../../icons/SearchIcon';\n\nexport type TSearchConfig = {\n searchCount?: number;\n searchPointer?: number;\n setSearchPointer?: React.Dispatch<React.SetStateAction<number \| undefined>>;\n};\n\nexport type TSearchBarProps = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'> & {\n value?: string;\n onChange?(value: string): void;\n debounceTimeout?: number;\n classValues?: string;\n handleKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n isClearable?: boolean;\n id: string;\n onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n isAnimated?: boolean;\n onFocusText?: string;\n autoComplete?: string;\n searchRef?: React.RefObject<HTMLInputElement>;\n placeholder?: string;\n autoFocus?: boolean;\n hasNavigation?: boolean;\n searchConfig?: TSearchConfig;\n hideSearchIcon?: boolean;\n allowAStarSearch?: boolean;\n};\n\nexport const SearchBar: FC<TSearchBarProps> = (props) => {\n const {\n value,\n placeholder,\n onChange,\n id,\n debounceTimeout = 0,\n classValues,\n handleKeyDown,\n isClearable,\n onFocusText,\n autoComplete = 'false',\n searchRef,\n hasNavigation = false,\n autoFocus = false,\n searchConfig,\n hideSearchIcon,\n allowAStarSearch = false,\n ...inputProps\n } = props;\n\n const { t } = useTranslation();\n const [isFocused, setIsFocused] = useState(false);\n const [focusedPlaceHolder, setFocusedPlaceHolder] = useState('search');\n const inputRef = useRef<HTMLInputElement>(null);\n const { searchCount, searchPointer, setSearchPointer } = searchConfig \|\| {};\n\n const getRightPadding = () => {\n const hasClearButton = isClearable && !!value;\n const hasNav = hasNavigation && !!value;\n if (hasClearButton && hasNav) return 'pr-28';\n if (hasNav) return 'pr-12';\n if (hasClearButton) return 'pr-8';\n return 'pr-7';\n };\n\n const handleFocus = () => {\n setIsFocused(true);\n setFocusedPlaceHolder(onFocusText \|\| placeholder \|\| t('Search'));\n const ref = searchRef \|\| inputRef;\n if (ref.current) {\n ref.current.focus();\n }\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n setFocusedPlaceHolder('');\n };\n\n return (\n <label\n className={cn(\n `relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8`,\n classValues,\n )}\n >\n {!hideSearchIcon && (\n <div className='flex items-center h-6 w-6 pointer-events-none'>\n <SearchIcon width=\"16\" height=\"16\" />\n </div>\n )}\n\n <DebounceInput\n {...inputProps}\n spellCheck='false'\n debounceTimeout={debounceTimeout}\n id={id}\n inputRef={searchRef \|\| inputRef}\n type='text'\n className={cn(\n `absolute inset-0 dark:text-[#98A2B3] text-neutral-900 ${hideSearchIcon ? 'pl-2' : 'pl-10'} pl-10 ${getRightPadding()} w-full text-sm dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,\n 'border border-solid',\n 'dark:border-neutral-800 border-neutral-200',\n 'dark:caret-white',\n classValues,\n )}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n }\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n handleKeyDown && handleKeyDown(e);\n }}\n value={value \|\| ''}\n placeholder={isFocused ? focusedPlaceHolder : allowAStarSearch ? '' : `${t('Search')}`}\n onChange={(e) => onChange?.(e.target.value)}\n autoComplete={autoComplete}\n onFocus={(e: React.FocusEvent<HTMLInputElement>) => {\n setIsFocused(true);\n handleFocus();\n if (props.onFocus) props.onFocus(e);\n }}\n onBlur={(e) => {\n setIsFocused(false);\n handleBlur();\n if (props.onBlur) props.onBlur(e);\n }}\n autoFocus={autoFocus}\n />\n\n {hasNavigation && value && (\n <div className={cn('absolute mr-2 focus:outline-none flex gap-1', isClearable ? 'right-6' : 'right-0')}>\n {Boolean(searchCount) && (searchCount \|\| 0) > 0 && (\n <span className='text-xs border-r pr-2 border-gray-200'>\n {(searchPointer \|\| 0) + 1}/{searchCount}\n </span>\n )}\n <div className='flex gap-1 items-center'>\n <button\n id={`btn-search-bar-set-search-pointer-forward`}\n onClick={() => {\n if (setSearchPointer) setSearchPointer((state) => (state \|\| 0) - 1);\n }}\n disabled={searchPointer === 0}\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M15 18l-6-6 6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n </svg>\n </button>\n <button\n id={`btn-search-bar-set-search-pointer-backward`}\n onClick={() => {\n if (setSearchPointer) setSearchPointer((state) => (state \|\| 0) + 1);\n }}\n disabled={searchPointer === (searchCount \|\| 0) - 1}\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9 18l6-6-6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n </svg>\n </button>\n </div>\n </div>\n )}\n\n {allowAStarSearch && !(isClearable && value) && !isFocused && !value ? (\n <div className='absolute flex ml-6 items-center justify-center focus:outline-none gap-1 flex-wrap-none'>\n <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>{t('Search')} (use</Typography>\n\n <button className=' bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5'>\n <Tooltip\n placement='bottomRight'\n color='#141414'\n classNames={{\n root: 'custom-tooltip dark:!bg-black-800',\n }}\n title={\n <div className='flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit'>\n <Typography variant='semibold' size='extra-small' className='text-white'>{t('Normal Search')}</Typography>\n <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n {t('Examples')}\n </Typography>\n <div className='flex flex-col items-start justify-center '>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>data</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"data\", \"Data\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>text</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"text\", \"context\", \"plaintext\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>base</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"database\", \"baseball\", \"basename\".\n </Typography>\n </div>\n </div>\n <div className='h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2'></div>\n <Typography variant='semibold' size='extra-small' className='text-white'>Wildcard Search</Typography>\n <Typography variant='medium' size='extra-small' className='text-white dark:text-black-200' appearance='custom'>\n Use * as a wildcard to refine your search.\n </Typography>\n <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n Examples:\n </Typography>\n <div className='flex flex-col items-start justify-center '>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n contract\n </Typography>\n </div>\n\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → \"contracts\", \"contractor\", \"CONTRACTOR\".\n </Typography>\n </div>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n agreement\n </Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"service agreement\", \"legal agreement\".\n </Typography>\n </div>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>\n clause\n </Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"clause\", \"subclause\", \"clauses\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>ls</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"clause\", \"clauses\".\n </Typography>\n </div>\n </div>\n </div>\n }\n >\n <div className='text-[#475467] dark:text-black-300 dark:bg-black-600'></div>\n </Tooltip>\n </button>\n <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>as a wildcard)</Typography>\n </div>\n ) : (\n isClearable &&\n value && (\n <button id={`btn-search-bar-close`} className='absolute right-0 mr-2 focus:outline-none' onClick={() => onChange?.('')}>\n <CloseRounded classValue='text-neutral-200 dark:text-black-500' size={16} />\n </button>\n )\n )}\n </label>\n );\n};\n\n"],"names":["SearchBar","props","value","placeholder","onChange","id","debounceTimeout","classValues","handleKeyDown","isClearable","onFocusText","autoComplete","searchRef","hasNavigation","autoFocus","searchConfig","hideSearchIcon","allowAStarSearch","inputProps","t","useTranslation","isFocused","setIsFocused","useState","focusedPlaceHolder","setFocusedPlaceHolder","inputRef","useRef","searchCount","searchPointer","setSearchPointer","getRightPadding","hasClearButton","hasNav","handleFocus","ref","handleBlur","jsxs","cn","jsx","SearchIcon","DebounceInput","e","state","Typography","Tooltip","CloseRounded"],"mappings":"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"}
1	+ {"version":3,"file":"SearchBar.cjs.js","sources":["../../../../src/components/forms/search-bar/SearchBar.tsx"],"sourcesContent":["import {type FC, type HTMLAttributes, useRef, useState } from 'react';\nimport { DebounceInput } from 'react-debounce-input';\nimport { useTranslation } from 'react-i18next';\nimport { Tooltip } from 'antd';\nimport cn from 'classnames';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { CloseRounded } from '../../icons/CloseRounded';\nimport { SearchIcon } from '../../icons/SearchIcon';\n\nexport type TSearchConfig = {\n searchCount?: number;\n searchPointer?: number;\n setSearchPointer?: React.Dispatch<React.SetStateAction<number \| undefined>>;\n};\n\nexport type TSearchBarProps = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'> & {\n value?: string;\n onChange?(value: string): void;\n debounceTimeout?: number;\n classValues?: string;\n handleKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n isClearable?: boolean;\n id: string;\n onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n isAnimated?: boolean;\n onFocusText?: string;\n autoComplete?: string;\n searchRef?: React.RefObject<HTMLInputElement>;\n placeholder?: string;\n autoFocus?: boolean;\n hasNavigation?: boolean;\n searchConfig?: TSearchConfig;\n hideSearchIcon?: boolean;\n allowAStarSearch?: boolean;\n};\n\nexport const SearchBar: FC<TSearchBarProps> = (props) => {\n const {\n value,\n placeholder,\n onChange,\n id,\n debounceTimeout = 0,\n classValues,\n handleKeyDown,\n isClearable,\n onFocusText,\n autoComplete = 'false',\n searchRef,\n hasNavigation = false,\n autoFocus = false,\n searchConfig,\n hideSearchIcon,\n allowAStarSearch = false,\n ...inputProps\n } = props;\n\n const { t } = useTranslation();\n const [isFocused, setIsFocused] = useState(false);\n const [focusedPlaceHolder, setFocusedPlaceHolder] = useState('search');\n const inputRef = useRef<HTMLInputElement>(null);\n const { searchCount, searchPointer, setSearchPointer } = searchConfig \|\| {};\n\n const getRightPadding = () => {\n const hasClearButton = isClearable && !!value;\n const hasNav = hasNavigation && !!value;\n if (hasClearButton && hasNav) return 'pr-28';\n if (hasNav) return 'pr-12';\n if (hasClearButton) return 'pr-8';\n return 'pr-7';\n };\n\n const handleFocus = () => {\n setIsFocused(true);\n setFocusedPlaceHolder(onFocusText \|\| placeholder \|\| t('Search'));\n const ref = searchRef \|\| inputRef;\n if (ref.current) {\n ref.current.focus();\n }\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n setFocusedPlaceHolder('');\n };\n\n return (\n <label\n className={cn(\n `relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8`,\n classValues,\n )}\n >\n {!hideSearchIcon && (\n <div className='flex items-center h-6 w-6 pointer-events-none'>\n <SearchIcon width=\"16\" height=\"16\" />\n </div>\n )}\n\n <DebounceInput\n {...inputProps}\n spellCheck='false'\n debounceTimeout={debounceTimeout}\n id={id}\n inputRef={searchRef \|\| inputRef}\n type='text'\n className={cn(\n `absolute inset-0 dark:text-[#98A2B3] text-neutral-900 ${hideSearchIcon ? 'pl-2' : 'pl-10'} pl-10 ${getRightPadding()} w-full text-sm dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,\n 'border border-solid',\n 'dark:border-neutral-800 border-neutral-200',\n 'dark:caret-white',\n classValues,\n )}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n }\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n handleKeyDown && handleKeyDown(e);\n }}\n value={value \|\| ''}\n placeholder={isFocused ? focusedPlaceHolder : allowAStarSearch ? '' : `${t('Search')}`}\n onChange={(e) => onChange?.(e.target.value)}\n autoComplete={autoComplete}\n onFocus={(e: React.FocusEvent<HTMLInputElement>) => {\n setIsFocused(true);\n handleFocus();\n if (props.onFocus) props.onFocus(e);\n }}\n onBlur={(e) => {\n setIsFocused(false);\n handleBlur();\n if (props.onBlur) props.onBlur(e);\n }}\n autoFocus={autoFocus}\n />\n\n {hasNavigation && value && (\n <div className={cn('absolute mr-2 focus:outline-none flex items-center gap-1', isClearable ? 'right-6' : 'right-0')}>\n {Boolean(searchCount) && (searchCount \|\| 0) > 0 && (\n <span className='text-xs border-r pr-2 border-gray-200'>\n {(searchPointer \|\| 0) + 1}/{searchCount}\n </span>\n )}\n <div className='flex gap-1 items-center'>\n <button\n id={`btn-search-bar-set-search-pointer-forward`}\n onClick={() => {\n if (setSearchPointer) setSearchPointer((state) => (state \|\| 0) - 1);\n }}\n disabled={searchPointer === 0}\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M15 18l-6-6 6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n </svg>\n </button>\n <button\n id={`btn-search-bar-set-search-pointer-backward`}\n onClick={() => {\n if (setSearchPointer) setSearchPointer((state) => (state \|\| 0) + 1);\n }}\n disabled={searchPointer === (searchCount \|\| 0) - 1}\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9 18l6-6-6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n </svg>\n </button>\n </div>\n </div>\n )}\n\n {allowAStarSearch && !(isClearable && value) && !isFocused && !value ? (\n <div className='absolute flex ml-6 items-center justify-center focus:outline-none gap-1 flex-wrap-none'>\n <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>{t('Search')} (use</Typography>\n\n <button className=' bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5'>\n <Tooltip\n placement='bottomRight'\n color='#141414'\n classNames={{\n root: 'custom-tooltip dark:!bg-black-800',\n }}\n title={\n <div className='flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit'>\n <Typography variant='semibold' size='extra-small' className='text-white'>{t('Normal Search')}</Typography>\n <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n {t('Examples')}\n </Typography>\n <div className='flex flex-col items-start justify-center '>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>data</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"data\", \"Data\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>text</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"text\", \"context\", \"plaintext\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>base</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"database\", \"baseball\", \"basename\".\n </Typography>\n </div>\n </div>\n <div className='h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2'></div>\n <Typography variant='semibold' size='extra-small' className='text-white'>Wildcard Search</Typography>\n <Typography variant='medium' size='extra-small' className='text-white dark:text-black-200' appearance='custom'>\n Use * as a wildcard to refine your search.\n </Typography>\n <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n Examples:\n </Typography>\n <div className='flex flex-col items-start justify-center '>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n contract\n </Typography>\n </div>\n\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → \"contracts\", \"contractor\", \"CONTRACTOR\".\n </Typography>\n </div>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n agreement\n </Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"service agreement\", \"legal agreement\".\n </Typography>\n </div>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>\n clause\n </Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"clause\", \"subclause\", \"clauses\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>ls</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"clause\", \"clauses\".\n </Typography>\n </div>\n </div>\n </div>\n }\n >\n <div className='text-[#475467] dark:text-black-300 dark:bg-black-600'></div>\n </Tooltip>\n </button>\n <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>as a wildcard)</Typography>\n </div>\n ) : (\n isClearable &&\n value && (\n <button id={`btn-search-bar-close`} className='absolute right-0 mr-2 focus:outline-none' onClick={() => onChange?.('')}>\n <CloseRounded classValue='text-neutral-200 dark:text-black-500' size={16} />\n </button>\n )\n )}\n </label>\n );\n};\n\n"],"names":["SearchBar","props","value","placeholder","onChange","id","debounceTimeout","classValues","handleKeyDown","isClearable","onFocusText","autoComplete","searchRef","hasNavigation","autoFocus","searchConfig","hideSearchIcon","allowAStarSearch","inputProps","t","useTranslation","isFocused","setIsFocused","useState","focusedPlaceHolder","setFocusedPlaceHolder","inputRef","useRef","searchCount","searchPointer","setSearchPointer","getRightPadding","hasClearButton","hasNav","handleFocus","ref","handleBlur","jsxs","cn","jsx","SearchIcon","DebounceInput","e","state","Typography","Tooltip","CloseRounded"],"mappings":"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"}

package/dist/components/forms/search-bar/SearchBar.es.js CHANGED Viewed

@@ -77,7 +77,7 @@ const Z = (n) => {
             autoFocus: A
           }
         ),
-        b && s && /* @__PURE__ */ r("div", { className: u("absolute mr-2 focus:outline-none flex gap-1", c ? "right-6" : "right-0"), children: [
+        b && s && /* @__PURE__ */ r("div", { className: u("absolute mr-2 focus:outline-none flex items-center gap-1", c ? "right-6" : "right-0"), children: [
           !!d && (d || 0) > 0 && /* @__PURE__ */ r("span", { className: "text-xs border-r pr-2 border-gray-200", children: [
             (m || 0) + 1,
             "/",

package/dist/components/forms/search-bar/SearchBar.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchBar.es.js","sources":["../../../../src/components/forms/search-bar/SearchBar.tsx"],"sourcesContent":["import {type FC, type HTMLAttributes, useRef, useState } from 'react';\nimport { DebounceInput } from 'react-debounce-input';\nimport { useTranslation } from 'react-i18next';\nimport { Tooltip } from 'antd';\nimport cn from 'classnames';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { CloseRounded } from '../../icons/CloseRounded';\nimport { SearchIcon } from '../../icons/SearchIcon';\n\nexport type TSearchConfig = {\n searchCount?: number;\n searchPointer?: number;\n setSearchPointer?: React.Dispatch<React.SetStateAction<number \| undefined>>;\n};\n\nexport type TSearchBarProps = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'> & {\n value?: string;\n onChange?(value: string): void;\n debounceTimeout?: number;\n classValues?: string;\n handleKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n isClearable?: boolean;\n id: string;\n onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n isAnimated?: boolean;\n onFocusText?: string;\n autoComplete?: string;\n searchRef?: React.RefObject<HTMLInputElement>;\n placeholder?: string;\n autoFocus?: boolean;\n hasNavigation?: boolean;\n searchConfig?: TSearchConfig;\n hideSearchIcon?: boolean;\n allowAStarSearch?: boolean;\n};\n\nexport const SearchBar: FC<TSearchBarProps> = (props) => {\n const {\n value,\n placeholder,\n onChange,\n id,\n debounceTimeout = 0,\n classValues,\n handleKeyDown,\n isClearable,\n onFocusText,\n autoComplete = 'false',\n searchRef,\n hasNavigation = false,\n autoFocus = false,\n searchConfig,\n hideSearchIcon,\n allowAStarSearch = false,\n ...inputProps\n } = props;\n\n const { t } = useTranslation();\n const [isFocused, setIsFocused] = useState(false);\n const [focusedPlaceHolder, setFocusedPlaceHolder] = useState('search');\n const inputRef = useRef<HTMLInputElement>(null);\n const { searchCount, searchPointer, setSearchPointer } = searchConfig \|\| {};\n\n const getRightPadding = () => {\n const hasClearButton = isClearable && !!value;\n const hasNav = hasNavigation && !!value;\n if (hasClearButton && hasNav) return 'pr-28';\n if (hasNav) return 'pr-12';\n if (hasClearButton) return 'pr-8';\n return 'pr-7';\n };\n\n const handleFocus = () => {\n setIsFocused(true);\n setFocusedPlaceHolder(onFocusText \|\| placeholder \|\| t('Search'));\n const ref = searchRef \|\| inputRef;\n if (ref.current) {\n ref.current.focus();\n }\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n setFocusedPlaceHolder('');\n };\n\n return (\n <label\n className={cn(\n `relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8`,\n classValues,\n )}\n >\n {!hideSearchIcon && (\n <div className='flex items-center h-6 w-6 pointer-events-none'>\n <SearchIcon width=\"16\" height=\"16\" />\n </div>\n )}\n\n <DebounceInput\n {...inputProps}\n spellCheck='false'\n debounceTimeout={debounceTimeout}\n id={id}\n inputRef={searchRef \|\| inputRef}\n type='text'\n className={cn(\n `absolute inset-0 dark:text-[#98A2B3] text-neutral-900 ${hideSearchIcon ? 'pl-2' : 'pl-10'} pl-10 ${getRightPadding()} w-full text-sm dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,\n 'border border-solid',\n 'dark:border-neutral-800 border-neutral-200',\n 'dark:caret-white',\n classValues,\n )}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n }\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n handleKeyDown && handleKeyDown(e);\n }}\n value={value \|\| ''}\n placeholder={isFocused ? focusedPlaceHolder : allowAStarSearch ? '' : `${t('Search')}`}\n onChange={(e) => onChange?.(e.target.value)}\n autoComplete={autoComplete}\n onFocus={(e: React.FocusEvent<HTMLInputElement>) => {\n setIsFocused(true);\n handleFocus();\n if (props.onFocus) props.onFocus(e);\n }}\n onBlur={(e) => {\n setIsFocused(false);\n handleBlur();\n if (props.onBlur) props.onBlur(e);\n }}\n autoFocus={autoFocus}\n />\n\n {hasNavigation && value && (\n <div className={cn('absolute mr-2 focus:outline-none flex gap-1', isClearable ? 'right-6' : 'right-0')}>\n {Boolean(searchCount) && (searchCount \|\| 0) > 0 && (\n <span className='text-xs border-r pr-2 border-gray-200'>\n {(searchPointer \|\| 0) + 1}/{searchCount}\n </span>\n )}\n <div className='flex gap-1 items-center'>\n <button\n id={`btn-search-bar-set-search-pointer-forward`}\n onClick={() => {\n if (setSearchPointer) setSearchPointer((state) => (state \|\| 0) - 1);\n }}\n disabled={searchPointer === 0}\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M15 18l-6-6 6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n </svg>\n </button>\n <button\n id={`btn-search-bar-set-search-pointer-backward`}\n onClick={() => {\n if (setSearchPointer) setSearchPointer((state) => (state \|\| 0) + 1);\n }}\n disabled={searchPointer === (searchCount \|\| 0) - 1}\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9 18l6-6-6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n </svg>\n </button>\n </div>\n </div>\n )}\n\n {allowAStarSearch && !(isClearable && value) && !isFocused && !value ? (\n <div className='absolute flex ml-6 items-center justify-center focus:outline-none gap-1 flex-wrap-none'>\n <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>{t('Search')} (use</Typography>\n\n <button className=' bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5'>\n <Tooltip\n placement='bottomRight'\n color='#141414'\n classNames={{\n root: 'custom-tooltip dark:!bg-black-800',\n }}\n title={\n <div className='flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit'>\n <Typography variant='semibold' size='extra-small' className='text-white'>{t('Normal Search')}</Typography>\n <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n {t('Examples')}\n </Typography>\n <div className='flex flex-col items-start justify-center '>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>data</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"data\", \"Data\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>text</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"text\", \"context\", \"plaintext\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>base</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"database\", \"baseball\", \"basename\".\n </Typography>\n </div>\n </div>\n <div className='h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2'></div>\n <Typography variant='semibold' size='extra-small' className='text-white'>Wildcard Search</Typography>\n <Typography variant='medium' size='extra-small' className='text-white dark:text-black-200' appearance='custom'>\n Use * as a wildcard to refine your search.\n </Typography>\n <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n Examples:\n </Typography>\n <div className='flex flex-col items-start justify-center '>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n contract\n </Typography>\n </div>\n\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → \"contracts\", \"contractor\", \"CONTRACTOR\".\n </Typography>\n </div>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n agreement\n </Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"service agreement\", \"legal agreement\".\n </Typography>\n </div>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>\n clause\n </Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"clause\", \"subclause\", \"clauses\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>ls</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"clause\", \"clauses\".\n </Typography>\n </div>\n </div>\n </div>\n }\n >\n <div className='text-[#475467] dark:text-black-300 dark:bg-black-600'></div>\n </Tooltip>\n </button>\n <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>as a wildcard)</Typography>\n </div>\n ) : (\n isClearable &&\n value && (\n <button id={`btn-search-bar-close`} className='absolute right-0 mr-2 focus:outline-none' onClick={() => onChange?.('')}>\n <CloseRounded classValue='text-neutral-200 dark:text-black-500' size={16} />\n </button>\n )\n )}\n </label>\n );\n};\n\n"],"names":["SearchBar","props","value","placeholder","onChange","id","debounceTimeout","classValues","handleKeyDown","isClearable","onFocusText","autoComplete","searchRef","hasNavigation","autoFocus","searchConfig","hideSearchIcon","allowAStarSearch","inputProps","t","useTranslation","isFocused","setIsFocused","useState","focusedPlaceHolder","setFocusedPlaceHolder","inputRef","useRef","searchCount","searchPointer","setSearchPointer","getRightPadding","hasClearButton","hasNav","handleFocus","ref","handleBlur","jsxs","cn","jsx","SearchIcon","DebounceInput","e","state","Typography","Tooltip","CloseRounded"],"mappings":"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"}
1	+ {"version":3,"file":"SearchBar.es.js","sources":["../../../../src/components/forms/search-bar/SearchBar.tsx"],"sourcesContent":["import {type FC, type HTMLAttributes, useRef, useState } from 'react';\nimport { DebounceInput } from 'react-debounce-input';\nimport { useTranslation } from 'react-i18next';\nimport { Tooltip } from 'antd';\nimport cn from 'classnames';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { CloseRounded } from '../../icons/CloseRounded';\nimport { SearchIcon } from '../../icons/SearchIcon';\n\nexport type TSearchConfig = {\n searchCount?: number;\n searchPointer?: number;\n setSearchPointer?: React.Dispatch<React.SetStateAction<number \| undefined>>;\n};\n\nexport type TSearchBarProps = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'> & {\n value?: string;\n onChange?(value: string): void;\n debounceTimeout?: number;\n classValues?: string;\n handleKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n isClearable?: boolean;\n id: string;\n onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n isAnimated?: boolean;\n onFocusText?: string;\n autoComplete?: string;\n searchRef?: React.RefObject<HTMLInputElement>;\n placeholder?: string;\n autoFocus?: boolean;\n hasNavigation?: boolean;\n searchConfig?: TSearchConfig;\n hideSearchIcon?: boolean;\n allowAStarSearch?: boolean;\n};\n\nexport const SearchBar: FC<TSearchBarProps> = (props) => {\n const {\n value,\n placeholder,\n onChange,\n id,\n debounceTimeout = 0,\n classValues,\n handleKeyDown,\n isClearable,\n onFocusText,\n autoComplete = 'false',\n searchRef,\n hasNavigation = false,\n autoFocus = false,\n searchConfig,\n hideSearchIcon,\n allowAStarSearch = false,\n ...inputProps\n } = props;\n\n const { t } = useTranslation();\n const [isFocused, setIsFocused] = useState(false);\n const [focusedPlaceHolder, setFocusedPlaceHolder] = useState('search');\n const inputRef = useRef<HTMLInputElement>(null);\n const { searchCount, searchPointer, setSearchPointer } = searchConfig \|\| {};\n\n const getRightPadding = () => {\n const hasClearButton = isClearable && !!value;\n const hasNav = hasNavigation && !!value;\n if (hasClearButton && hasNav) return 'pr-28';\n if (hasNav) return 'pr-12';\n if (hasClearButton) return 'pr-8';\n return 'pr-7';\n };\n\n const handleFocus = () => {\n setIsFocused(true);\n setFocusedPlaceHolder(onFocusText \|\| placeholder \|\| t('Search'));\n const ref = searchRef \|\| inputRef;\n if (ref.current) {\n ref.current.focus();\n }\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n setFocusedPlaceHolder('');\n };\n\n return (\n <label\n className={cn(\n `relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8`,\n classValues,\n )}\n >\n {!hideSearchIcon && (\n <div className='flex items-center h-6 w-6 pointer-events-none'>\n <SearchIcon width=\"16\" height=\"16\" />\n </div>\n )}\n\n <DebounceInput\n {...inputProps}\n spellCheck='false'\n debounceTimeout={debounceTimeout}\n id={id}\n inputRef={searchRef \|\| inputRef}\n type='text'\n className={cn(\n `absolute inset-0 dark:text-[#98A2B3] text-neutral-900 ${hideSearchIcon ? 'pl-2' : 'pl-10'} pl-10 ${getRightPadding()} w-full text-sm dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,\n 'border border-solid',\n 'dark:border-neutral-800 border-neutral-200',\n 'dark:caret-white',\n classValues,\n )}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n }\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n handleKeyDown && handleKeyDown(e);\n }}\n value={value \|\| ''}\n placeholder={isFocused ? focusedPlaceHolder : allowAStarSearch ? '' : `${t('Search')}`}\n onChange={(e) => onChange?.(e.target.value)}\n autoComplete={autoComplete}\n onFocus={(e: React.FocusEvent<HTMLInputElement>) => {\n setIsFocused(true);\n handleFocus();\n if (props.onFocus) props.onFocus(e);\n }}\n onBlur={(e) => {\n setIsFocused(false);\n handleBlur();\n if (props.onBlur) props.onBlur(e);\n }}\n autoFocus={autoFocus}\n />\n\n {hasNavigation && value && (\n <div className={cn('absolute mr-2 focus:outline-none flex items-center gap-1', isClearable ? 'right-6' : 'right-0')}>\n {Boolean(searchCount) && (searchCount \|\| 0) > 0 && (\n <span className='text-xs border-r pr-2 border-gray-200'>\n {(searchPointer \|\| 0) + 1}/{searchCount}\n </span>\n )}\n <div className='flex gap-1 items-center'>\n <button\n id={`btn-search-bar-set-search-pointer-forward`}\n onClick={() => {\n if (setSearchPointer) setSearchPointer((state) => (state \|\| 0) - 1);\n }}\n disabled={searchPointer === 0}\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M15 18l-6-6 6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n </svg>\n </button>\n <button\n id={`btn-search-bar-set-search-pointer-backward`}\n onClick={() => {\n if (setSearchPointer) setSearchPointer((state) => (state \|\| 0) + 1);\n }}\n disabled={searchPointer === (searchCount \|\| 0) - 1}\n >\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9 18l6-6-6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n </svg>\n </button>\n </div>\n </div>\n )}\n\n {allowAStarSearch && !(isClearable && value) && !isFocused && !value ? (\n <div className='absolute flex ml-6 items-center justify-center focus:outline-none gap-1 flex-wrap-none'>\n <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>{t('Search')} (use</Typography>\n\n <button className=' bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5'>\n <Tooltip\n placement='bottomRight'\n color='#141414'\n classNames={{\n root: 'custom-tooltip dark:!bg-black-800',\n }}\n title={\n <div className='flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit'>\n <Typography variant='semibold' size='extra-small' className='text-white'>{t('Normal Search')}</Typography>\n <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n {t('Examples')}\n </Typography>\n <div className='flex flex-col items-start justify-center '>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>data</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"data\", \"Data\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>text</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"text\", \"context\", \"plaintext\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>base</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"database\", \"baseball\", \"basename\".\n </Typography>\n </div>\n </div>\n <div className='h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2'></div>\n <Typography variant='semibold' size='extra-small' className='text-white'>Wildcard Search</Typography>\n <Typography variant='medium' size='extra-small' className='text-white dark:text-black-200' appearance='custom'>\n Use * as a wildcard to refine your search.\n </Typography>\n <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n Examples:\n </Typography>\n <div className='flex flex-col items-start justify-center '>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n contract\n </Typography>\n </div>\n\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → \"contracts\", \"contractor\", \"CONTRACTOR\".\n </Typography>\n </div>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n agreement\n </Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"service agreement\", \"legal agreement\".\n </Typography>\n </div>\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>\n clause\n </Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"clause\", \"subclause\", \"clauses\".\n </Typography>\n </div>\n\n <div className='flex items-center justify-center gap-1'>\n <Typography className='flex-shrink-0' appearance='custom'>\n •\n </Typography>\n <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>ls</Typography>\n </div>\n <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n → finds \"clause\", \"clauses\".\n </Typography>\n </div>\n </div>\n </div>\n }\n >\n <div className='text-[#475467] dark:text-black-300 dark:bg-black-600'></div>\n </Tooltip>\n </button>\n <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>as a wildcard)</Typography>\n </div>\n ) : (\n isClearable &&\n value && (\n <button id={`btn-search-bar-close`} className='absolute right-0 mr-2 focus:outline-none' onClick={() => onChange?.('')}>\n <CloseRounded classValue='text-neutral-200 dark:text-black-500' size={16} />\n </button>\n )\n )}\n </label>\n );\n};\n\n"],"names":["SearchBar","props","value","placeholder","onChange","id","debounceTimeout","classValues","handleKeyDown","isClearable","onFocusText","autoComplete","searchRef","hasNavigation","autoFocus","searchConfig","hideSearchIcon","allowAStarSearch","inputProps","t","useTranslation","isFocused","setIsFocused","useState","focusedPlaceHolder","setFocusedPlaceHolder","inputRef","useRef","searchCount","searchPointer","setSearchPointer","getRightPadding","hasClearButton","hasNav","handleFocus","ref","handleBlur","jsxs","cn","jsx","SearchIcon","DebounceInput","e","state","Typography","Tooltip","CloseRounded"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@lax-wp/design-system",
   "private": false,
-  "version": "0.13.41",
+  "version": "0.13.42",
   "type": "module",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",