@lax-wp/design-system 0.14.17 → 0.14.19

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 (5) hide show
  1. package/dist/components/floating-bar/FloatingBar.cjs.js +1 -1
  2. package/dist/components/floating-bar/FloatingBar.cjs.js.map +1 -1
  3. package/dist/components/floating-bar/FloatingBar.es.js +96 -94
  4. package/dist/components/floating-bar/FloatingBar.es.js.map +1 -1
  5. package/package.json +1 -1
package/dist/components/floating-bar/FloatingBar.cjs.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),w=require("antd"),i=require("../../_virtual/index.cjs.js"),g=require("framer-motion"),c=require("react"),T=require("react-i18next"),n=require("../data-display/typography/Typography.cjs.js"),B=require("../buttons/option-button/OptionButton.cjs.js"),L=require("../button/IconButton.cjs.js"),C=require("../tooltip/Tooltip.cjs.js"),q=require("../icon/icons.generated.cjs.js"),R=({size:r=24,fill:o="currentColor",className:p})=>a.jsx("svg",{className:p,width:r,height:r,viewBox:"0 0 20 20",fill:o,xmlns:"http://www.w3.org/2000/svg",children:a.jsx("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"})}),F=({fill:r="#cccccc",className:o})=>a.jsx("svg",{height:"20",width:"20",viewBox:"0 0 20 20",focusable:"false",className:o,children:a.jsx("path",{fill:r,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"})}),j=r=>{const{show:o,isFlowDashboard:p,onClose:k,actionItems:m,selectedItemsCount:N,deleteConfig:d,showActionBg:D}=r,{t:h}=T.useTranslation(),[y,u]=c.useState(!1),[I,b]=c.useState(!0),t=c.useRef(null),f=c.useRef(null);c.useEffect(()=>{const e=new ResizeObserver(()=>{if(t.current&&f.current){const s=t.current.scrollWidth-100;m.length*180+100>s?b(!1):b(!0)}});return t.current&&e.observe(t.current),()=>{t.current&&e.unobserve(t.current)}});const l={label:h("Delete"),icon:a.jsx(q.DeleteIcon,{className:"text-error-500 w-icon h-icon"}),onClick:d?.onClick,...d},x=m.filter(e=>e.visible!==!1).map((e,s)=>({key:s,label:a.jsx(B.OptionButton,{icon:e.dropdownIcon,text:e?.label||"",onClick:e.onClick,className:"font-inter text-base font-medium text-black-900 dark:text-black-200 gap-1.5"}),children:e.dropdownItems,disabled:!1}));return o?a.jsx(g.motion.div,{initial:{y:20,opacity:0},animate:{y:0,opacity:1},exit:{y:20,opacity:0},transition:{duration:.2,ease:[.4,0,.2,1],opacity:{duration:.15}},ref:t,className:i("h-[40px]",p?"ml-60 w-1/2":"w-full"),children:a.jsxs("div",{className:i("h-[40px] border py-1.5 px-2 text-white bg-primary-800 dark:bg-black-700 flex justify-between items-center"),children:[a.jsxs("div",{className:"flex items-center",children:[a.jsx(L,{tooltip:"Close",variant:"ghost",onClick:k,className:"!p-0 text-white hover:opacity-80 hover:rotate-90 transition-all duration-200",children:a.jsx(R,{size:20})}),a.jsxs("div",{className:"flex items-center gap-1.5 ml-2",children:[a.jsx("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",children:N||0}),a.jsx(n.Typography,{size:"extra-small",appearance:"custom",className:"text-white",children:h("Selected")})]})]}),a.jsx("div",{ref:f,className:i("h-[36px] flex items-center rounded-full font-inter",D?"bg-primary-900 dark:bg-black-800 px-[10px] rounded-[43px]":""),children:I?a.jsxs(g.motion.div,{initial:{opacity:0},animate:{opacity:1},transition:{duration:.2},className:"flex bg-primary-800 dark:bg-black-800 px-4 rounded-full",children:[m.map((e,s)=>e.visible!==!1&&a.jsx("div",{children:e.type==="dropdown"?a.jsx(w.Dropdown,{menu:{items:e.dropdownItems},trigger:[e.dropdownTrigger||"click"],overlayClassName:"!min-w-[148px]",placement:"bottomRight",getPopupContainer:v=>v.parentElement,open:y,onOpenChange:u,children:a.jsx("button",{id:`btn-floating-bar-${e.label}`,onClick:e.onClick,disabled:e.disabled,className:i(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==="Move to trash"||e.label==="Delete Permanently")&&"!text-error-500",e.disabled&&"opacity-70"),children:a.jsxs(C,{hideTooltip:!e.tooltip,title:e.tooltip,className:"flex items-center",children:[e.icon,!e?.hideLabel&&e.label&&a.jsx(n.Typography,{size:"small",variant:"medium",className:"text-inherit ml-1.5",appearance:"custom",children:e.label})]})},s)}):a.jsx("button",{id:`btn-floating-bar-${e.label}`,onClick:e.onClick,disabled:e.disabled,className:i(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==="Move to trash"||e.label==="Delete Permanently")&&"!text-error-500",e.disabled&&"opacity-70"),children:a.jsxs(C,{hideTooltip:!e.tooltip,title:e.tooltip,className:"flex items-center",children:[e.icon,!e?.hideLabel&&e.label&&a.jsx(n.Typography,{size:"small",variant:"medium",className:"text-inherit ml-1.5",appearance:"custom",children:e.label})]})})},s)),d?a.jsxs("button",{id:`btn-floating-bar-${l.label}`,onClick:l.onClick,disabled:l.disabled,className:i("flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200",l.disabled&&"opacity-70"),children:[l.icon,a.jsx(n.Typography,{size:"small",variant:"medium",className:"text-error-500",appearance:"custom",children:l.label})]}):null]}):a.jsxs(g.motion.div,{initial:{opacity:0},animate:{opacity:1},transition:{duration:.2},className:"minw-[150px] p-1.5 flex items-center",children:[a.jsx(w.Dropdown,{menu:{items:x},trigger:["click"],overlayClassName:"!min-w-[148px]",placement:"bottomRight",getPopupContainer:e=>e.parentElement,open:y,onOpenChange:u,children:a.jsxs("button",{id:"btn-floating-bar-actions",disabled:x.length===0,className:i("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",x.length===0&&"opacity-60 hover:scale-100 hover:opacity-60"),type:"button",children:[a.jsx(n.Typography,{size:"small",variant:"medium",className:"text-white",children:h("Actions")}),a.jsx(F,{fill:"#FFFFFF",className:"w-[16px] h-[16px]"})]})}),d?a.jsxs("button",{id:`btn-floating-bar-${l.label}`,onClick:l.onClick,disabled:l.disabled,className:i("flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200",l.disabled&&"opacity-70"),type:"button",children:[l.icon,a.jsx(n.Typography,{size:"small",variant:"medium",className:"text-error-500",appearance:"custom",children:l.label})]}):null]})})]})}):null};j.displayName="FloatingBar";exports.FloatingBar=j;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),w=require("antd"),i=require("../../_virtual/index.cjs.js"),g=require("framer-motion"),c=require("react"),I=require("react-i18next"),s=require("../data-display/typography/Typography.cjs.js"),T=require("../buttons/option-button/OptionButton.cjs.js"),B=require("../button/IconButton.cjs.js"),C=require("../tooltip/Tooltip.cjs.js"),L=require("../icon/icons.generated.cjs.js"),q=({size:r=24,fill:o="currentColor",className:d})=>a.jsx("svg",{className:d,width:r,height:r,viewBox:"0 0 20 20",fill:o,xmlns:"http://www.w3.org/2000/svg",children:a.jsx("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"})}),R=({fill:r="#cccccc",className:o})=>a.jsx("svg",{height:"20",width:"20",viewBox:"0 0 20 20",focusable:"false",className:o,children:a.jsx("path",{fill:r,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"})}),j=r=>{const{show:o,isFlowDashboard:d,onClose:k,actionItems:x,selectedItemsCount:N,deleteConfig:p,showActionBg:F}=r,{t:m}=I.useTranslation(),[u,b]=c.useState(!1),[D,y]=c.useState(!0),l=c.useRef(null),f=c.useRef(null);c.useEffect(()=>{const e=new ResizeObserver(()=>{if(l.current&&f.current){const n=l.current.scrollWidth-100;x.length*180+100>n?y(!1):y(!0)}});return l.current&&e.observe(l.current),()=>{l.current&&e.unobserve(l.current)}});const t={label:m("Delete"),icon:a.jsx(L.DeleteIcon,{className:"text-error-700 w-icon h-icon"}),onClick:p?.onClick,...p},h=x.filter(e=>e.visible!==!1).map((e,n)=>({key:n,label:a.jsx(T.OptionButton,{icon:e.dropdownIcon,text:e?.label||"",onClick:e.onClick,className:"font-inter text-base font-medium text-black-900 dark:text-black-200 gap-1.5"}),children:e.dropdownItems,disabled:!1}));return o?a.jsx(g.motion.div,{initial:{y:20,opacity:0},animate:{y:0,opacity:1},exit:{y:20,opacity:0},transition:{duration:.2,ease:[.4,0,.2,1],opacity:{duration:.15}},ref:l,className:i("h-[36px] mb-4",d?"ml-60 w-1/2":"w-full"),children:a.jsxs("div",{className:i("border-y border-neutral-900 dark:border-[#0d1014 px-[12px] text-white bg-neutral-900 dark:bg-black-900 flex justify-between items-center"),children:[a.jsxs("div",{className:"flex items-center gap-[12px]",children:[a.jsxs("div",{className:"flex items-center gap-[8px]",children:[a.jsx(B,{tooltip:"Close",variant:"ghost",onClick:k,className:"!p-0 text-white hover:opacity-80 hover:rotate-90 transition-all duration-200",children:a.jsx(q,{size:16})}),a.jsx("div",{className:"w-px h-[14px] rounded-[1px] bg-neutral-700 dark:bg-[#1d242c]"})]}),a.jsxs("div",{className:"flex items-center gap-[6px]",children:[a.jsx("span",{className:"inline-flex items-center justify-center min-w-[20px] h-[16px] px-[8px] rounded-[9px] border text-[12px] leading-[18px] font-normal text-primary-600 dark:text-primary-400 bg-primary-50 dark:bg-[rgba(0,50,95,0.3)] border-primary-200 dark:border-primary-800",children:N||0}),a.jsx(s.Typography,{size:"extra-small",appearance:"custom",className:"text-white dark:text-neutral-50",children:m("Selected")})]})]}),a.jsx("div",{ref:f,className:i("h-[36px] flex items-center font-inter bg-neutral-800 dark:bg-black-800 px-[10px] rounded-[43px]"),children:D?a.jsxs(g.motion.div,{initial:{opacity:0},animate:{opacity:1},transition:{duration:.2},className:"flex items-center h-[36px] bg-neutral-800 dark:bg-black-800 px-[10px] rounded-[43px]",children:[x.map((e,n)=>e.visible!==!1&&a.jsx("div",{children:e.type==="dropdown"?a.jsx(w.Dropdown,{menu:{items:e.dropdownItems},trigger:[e.dropdownTrigger||"click"],overlayClassName:"!min-w-[148px]",placement:"bottomRight",getPopupContainer:v=>v.parentElement,open:u,onOpenChange:b,children:a.jsx("button",{id:`btn-floating-bar-${e.label}`,onClick:e.onClick,disabled:e.disabled,className:i(e?.label?"flex items-center gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] text-white dark:text-neutral-50 hover:opacity-80 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==="Move to trash"||e.label==="Delete Permanently")&&"!text-error-700",e.disabled&&"opacity-70"),children:a.jsxs(C,{hideTooltip:!e.tooltip,title:e.tooltip,className:"flex items-center gap-1.5",children:[e.icon,!e?.hideLabel&&e.label&&a.jsx(s.Typography,{size:"small",variant:"medium",className:"text-inherit",appearance:"custom",children:e.label})]})},n)}):a.jsx("button",{id:`btn-floating-bar-${e.label}`,onClick:e.onClick,disabled:e.disabled,className:i(e?.label?"flex items-center gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] text-white dark:text-neutral-50 hover:opacity-80 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==="Move to trash"||e.label==="Delete Permanently")&&"!text-error-700",e.disabled&&"opacity-70"),children:a.jsxs(C,{hideTooltip:!e.tooltip,title:e.tooltip,className:"flex items-center",children:[e.icon,!e?.hideLabel&&e.label&&a.jsx(s.Typography,{size:"small",variant:"medium",className:"text-inherit",appearance:"custom",children:e.label})]})})},n)),p?a.jsxs("button",{id:`btn-floating-bar-${t.label}`,onClick:t.onClick,disabled:t.disabled,className:i("flex items-center gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] hover:scale-105 hover:opacity-80 transition-all duration-200",t.disabled&&"opacity-70"),children:[t.icon,a.jsx(s.Typography,{size:"small",variant:"medium",className:"text-error-700",appearance:"custom",children:t.label})]}):null]}):a.jsxs(g.motion.div,{initial:{opacity:0},animate:{opacity:1},transition:{duration:.2},className:"minw-[150px] p-1.5 flex items-center",children:[a.jsx(w.Dropdown,{menu:{items:h},trigger:["click"],overlayClassName:"!min-w-[148px]",placement:"bottomRight",getPopupContainer:e=>e.parentElement,open:u,onOpenChange:b,children:a.jsxs("button",{id:"btn-floating-bar-actions",disabled:h.length===0,className:i("flex items-center gap-1.5 px-2 py-1 w-22 h-7 rounded-full bg-[#34405473]/45 dark:bg-black-700 hover:scale-105 hover:opacity-80 transition-all duration-200",h.length===0&&"opacity-60 hover:scale-100 hover:opacity-60"),type:"button",children:[a.jsx(s.Typography,{size:"small",variant:"medium",className:"text-white",children:m("Actions")}),a.jsx(R,{fill:"#FFFFFF",className:"w-[16px] h-[16px]"})]})}),p?a.jsxs("button",{id:`btn-floating-bar-${t.label}`,onClick:t.onClick,disabled:t.disabled,className:i("flex items-center gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] hover:scale-105 hover:opacity-80 transition-all duration-200",t.disabled&&"opacity-70"),type:"button",children:[t.icon,a.jsx(s.Typography,{size:"small",variant:"medium",className:"text-error-700",appearance:"custom",children:t.label})]}):null]})})]})}):null};j.displayName="FloatingBar";exports.FloatingBar=j;
2
2
  //# sourceMappingURL=FloatingBar.cjs.js.map
package/dist/components/floating-bar/FloatingBar.cjs.js.map CHANGED
@@ -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 className=\"text-error-500 w-icon h-icon\" />,\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 === \"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\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 className=\"text-error-700 w-icon h-icon\" />,\n color: \"text-error-700 dark:text-error-700\",\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-[36px] mb-4\", isFlowDashboard ? \"ml-60 w-1/2\" : \"w-full\")}\n >\n <div\n className={cn(\n \"border-y border-neutral-900 dark:border-[#0d1014 px-[12px] text-white bg-neutral-900 dark:bg-black-900 flex justify-between items-center\"\n )}\n >\n <div className=\"flex items-center gap-[12px]\">\n <div className=\"flex items-center gap-[8px]\">\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={16} />\n </IconButton>\n <div className=\"w-px h-[14px] rounded-[1px] bg-neutral-700 dark:bg-[#1d242c]\" />\n </div>\n <div className=\"flex items-center gap-[6px]\">\n <span className=\"inline-flex items-center justify-center min-w-[20px] h-[16px] px-[8px] rounded-[9px] border text-[12px] leading-[18px] font-normal text-primary-600 dark:text-primary-400 bg-primary-50 dark:bg-[rgba(0,50,95,0.3)] border-primary-200 dark:border-primary-800\">\n {selectedItemsCount || 0}\n </span>\n <Typography\n size=\"extra-small\"\n appearance=\"custom\"\n className=\"text-white dark:text-neutral-50\"\n >\n {t(\"Selected\")}\n </Typography>\n </div>\n </div>\n <div\n ref={actionContainerRef}\n className={cn(\n \"h-[36px] flex items-center font-inter bg-neutral-800 dark:bg-black-800 px-[10px] rounded-[43px]\"\n )}\n >\n {showButtons ? (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"flex items-center h-[36px] bg-neutral-800 dark:bg-black-800 px-[10px] rounded-[43px]\"\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 gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] text-white dark:text-neutral-50 hover:opacity-80 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-700\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center gap-1.5\"\n >\n {button.icon}\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit\"}\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 gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] text-white dark:text-neutral-50 hover:opacity-80 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 === \"Move to trash\" ||\n button.label === \"Delete Permanently\") &&\n \"!text-error-700\",\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\"}\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-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] 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-700\"\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-[#34405473]/45 dark:bg-black-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-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] 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-700\"\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
@@ -1,31 +1,31 @@
1
1
  import { jsx as a, jsxs as i } from "react/jsx-runtime";
2
- import { Dropdown as u } from "antd";
3
- import r from "../../_virtual/index.es.js";
4
- import { motion as x } from "framer-motion";
5
- import { useState as w, useRef as k, useEffect as F } from "react";
6
- import { useTranslation as z } from "react-i18next";
2
+ import { Dropdown as w } from "antd";
3
+ import t from "../../_virtual/index.es.js";
4
+ import { motion as b } from "framer-motion";
5
+ import { useState as C, useRef as k, useEffect as B } from "react";
6
+ import { useTranslation as F } from "react-i18next";
7
7
  import { Typography as s } from "../data-display/typography/Typography.es.js";
8
- import { OptionButton as R } from "../buttons/option-button/OptionButton.es.js";
9
- import T from "../button/IconButton.es.js";
8
+ import { OptionButton as z } from "../buttons/option-button/OptionButton.es.js";
9
+ import R from "../button/IconButton.es.js";
10
10
  import N from "../tooltip/Tooltip.es.js";
11
- import { DeleteIcon as A } from "../icon/icons.generated.es.js";
12
- const M = ({
13
- size: o = 24,
11
+ import { DeleteIcon as T } from "../icon/icons.generated.es.js";
12
+ const A = ({
13
+ size: n = 24,
14
14
  fill: c = "currentColor",
15
- className: p
15
+ className: d
16
16
  }) => /* @__PURE__ */ a(
17
17
  "svg",
18
18
  {
19
- className: p,
20
- width: o,
21
- height: o,
19
+ className: d,
20
+ width: n,
21
+ height: n,
22
22
  viewBox: "0 0 20 20",
23
23
  fill: c,
24
24
  xmlns: "http://www.w3.org/2000/svg",
25
25
  children: /* @__PURE__ */ a("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" })
26
26
  }
27
- ), O = ({
28
- fill: o = "#cccccc",
27
+ ), j = ({
28
+ fill: n = "#cccccc",
29
29
  className: c
30
30
  }) => /* @__PURE__ */ a(
31
31
  "svg",
@@ -38,41 +38,41 @@ const M = ({
38
38
  children: /* @__PURE__ */ a(
39
39
  "path",
40
40
  {
41
- fill: o,
41
+ fill: n,
42
42
  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"
43
43
  }
44
44
  )
45
45
  }
46
- ), P = (o) => {
46
+ ), M = (n) => {
47
47
  const {
48
48
  show: c,
49
- isFlowDashboard: p,
49
+ isFlowDashboard: d,
50
50
  onClose: D,
51
51
  actionItems: m,
52
52
  selectedItemsCount: I,
53
- deleteConfig: d,
54
- showActionBg: L
55
- } = o, { t: h } = z(), [b, g] = w(!1), [B, y] = w(!0), t = k(null), v = k(null);
56
- F(() => {
53
+ deleteConfig: p,
54
+ showActionBg: O
55
+ } = n, { t: h } = F(), [f, g] = C(!1), [L, v] = C(!0), r = k(null), y = k(null);
56
+ B(() => {
57
57
  const e = new ResizeObserver(() => {
58
- if (t.current && v.current) {
59
- const n = t.current.scrollWidth - 100;
60
- m.length * 180 + 100 > n ? y(!1) : y(!0);
58
+ if (r.current && y.current) {
59
+ const o = r.current.scrollWidth - 100;
60
+ m.length * 180 + 100 > o ? v(!1) : v(!0);
61
61
  }
62
62
  });
63
- return t.current && e.observe(t.current), () => {
64
- t.current && e.unobserve(t.current);
63
+ return r.current && e.observe(r.current), () => {
64
+ r.current && e.unobserve(r.current);
65
65
  };
66
66
  });
67
67
  const l = {
68
68
  label: h("Delete"),
69
- icon: /* @__PURE__ */ a(A, { className: "text-error-500 w-icon h-icon" }),
70
- onClick: d?.onClick,
71
- ...d
72
- }, f = m.filter((e) => e.visible !== !1).map((e, n) => ({
73
- key: n,
69
+ icon: /* @__PURE__ */ a(T, { className: "text-error-700 w-icon h-icon" }),
70
+ onClick: p?.onClick,
71
+ ...p
72
+ }, x = m.filter((e) => e.visible !== !1).map((e, o) => ({
73
+ key: o,
74
74
  label: /* @__PURE__ */ a(
75
- R,
75
+ z,
76
76
  {
77
77
  icon: e.dropdownIcon,
78
78
  text: e?.label || "",
@@ -84,7 +84,7 @@ const M = ({
84
84
  disabled: !1
85
85
  }));
86
86
  return c ? /* @__PURE__ */ a(
87
- x.div,
87
+ b.div,
88
88
  {
89
89
  initial: { y: 20, opacity: 0 },
90
90
  animate: { y: 0, opacity: 1 },
@@ -94,34 +94,37 @@ const M = ({
94
94
  ease: [0.4, 0, 0.2, 1],
95
95
  opacity: { duration: 0.15 }
96
96
  },
97
- ref: t,
98
- className: r("h-[40px]", p ? "ml-60 w-1/2" : "w-full"),
97
+ ref: r,
98
+ className: t("h-[36px] mb-4", d ? "ml-60 w-1/2" : "w-full"),
99
99
  children: /* @__PURE__ */ i(
100
100
  "div",
101
101
  {
102
- className: r(
103
- "h-[40px] border py-1.5 px-2 text-white bg-primary-800 dark:bg-black-700 flex justify-between items-center"
102
+ className: t(
103
+ "border-y border-neutral-900 dark:border-[#0d1014 px-[12px] text-white bg-neutral-900 dark:bg-black-900 flex justify-between items-center"
104
104
  ),
105
105
  children: [
106
- /* @__PURE__ */ i("div", { className: "flex items-center", children: [
107
- /* @__PURE__ */ a(
108
- T,
109
- {
110
- tooltip: "Close",
111
- variant: "ghost",
112
- onClick: D,
113
- className: "!p-0 text-white hover:opacity-80 hover:rotate-90 transition-all duration-200",
114
- children: /* @__PURE__ */ a(M, { size: 20 })
115
- }
116
- ),
117
- /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 ml-2", children: [
118
- /* @__PURE__ */ a("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", children: I || 0 }),
106
+ /* @__PURE__ */ i("div", { className: "flex items-center gap-[12px]", children: [
107
+ /* @__PURE__ */ i("div", { className: "flex items-center gap-[8px]", children: [
108
+ /* @__PURE__ */ a(
109
+ R,
110
+ {
111
+ tooltip: "Close",
112
+ variant: "ghost",
113
+ onClick: D,
114
+ className: "!p-0 text-white hover:opacity-80 hover:rotate-90 transition-all duration-200",
115
+ children: /* @__PURE__ */ a(A, { size: 16 })
116
+ }
117
+ ),
118
+ /* @__PURE__ */ a("div", { className: "w-px h-[14px] rounded-[1px] bg-neutral-700 dark:bg-[#1d242c]" })
119
+ ] }),
120
+ /* @__PURE__ */ i("div", { className: "flex items-center gap-[6px]", children: [
121
+ /* @__PURE__ */ a("span", { className: "inline-flex items-center justify-center min-w-[20px] h-[16px] px-[8px] rounded-[9px] border text-[12px] leading-[18px] font-normal text-primary-600 dark:text-primary-400 bg-primary-50 dark:bg-[rgba(0,50,95,0.3)] border-primary-200 dark:border-primary-800", children: I || 0 }),
119
122
  /* @__PURE__ */ a(
120
123
  s,
121
124
  {
122
125
  size: "extra-small",
123
126
  appearance: "custom",
124
- className: "text-white",
127
+ className: "text-white dark:text-neutral-50",
125
128
  children: h("Selected")
126
129
  }
127
130
  )
@@ -130,22 +133,21 @@ const M = ({
130
133
  /* @__PURE__ */ a(
131
134
  "div",
132
135
  {
133
- ref: v,
134
- className: r(
135
- "h-[36px] flex items-center rounded-full font-inter",
136
- L ? "bg-primary-900 dark:bg-black-800 px-[10px] rounded-[43px]" : ""
136
+ ref: y,
137
+ className: t(
138
+ "h-[36px] flex items-center font-inter bg-neutral-800 dark:bg-black-800 px-[10px] rounded-[43px]"
137
139
  ),
138
- children: B ? /* @__PURE__ */ i(
139
- x.div,
140
+ children: L ? /* @__PURE__ */ i(
141
+ b.div,
140
142
  {
141
143
  initial: { opacity: 0 },
142
144
  animate: { opacity: 1 },
143
145
  transition: { duration: 0.2 },
144
- className: "flex bg-primary-800 dark:bg-black-800 px-4 rounded-full",
146
+ className: "flex items-center h-[36px] bg-neutral-800 dark:bg-black-800 px-[10px] rounded-[43px]",
145
147
  children: [
146
148
  m.map(
147
- (e, n) => e.visible !== !1 && /* @__PURE__ */ a("div", { children: e.type === "dropdown" ? /* @__PURE__ */ a(
148
- u,
149
+ (e, o) => e.visible !== !1 && /* @__PURE__ */ a("div", { children: e.type === "dropdown" ? /* @__PURE__ */ a(
150
+ w,
149
151
  {
150
152
  menu: {
151
153
  items: e.dropdownItems
@@ -153,8 +155,8 @@ const M = ({
153
155
  trigger: [e.dropdownTrigger || "click"],
154
156
  overlayClassName: "!min-w-[148px]",
155
157
  placement: "bottomRight",
156
- getPopupContainer: (C) => C.parentElement,
157
- open: b,
158
+ getPopupContainer: (u) => u.parentElement,
159
+ open: f,
158
160
  onOpenChange: g,
159
161
  children: /* @__PURE__ */ a(
160
162
  "button",
@@ -162,10 +164,10 @@ const M = ({
162
164
  id: `btn-floating-bar-${e.label}`,
163
165
  onClick: e.onClick,
164
166
  disabled: e.disabled,
165
- className: r(
166
- 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",
167
+ className: t(
168
+ e?.label ? "flex items-center gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] text-white dark:text-neutral-50 hover:opacity-80 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",
167
169
  e?.hideLabel && "!p-1.5",
168
- (e.label === "Delete" || e.label === "Remove" || e.label === "Delete user" || e.label === "Move to trash" || e.label === "Delete Permanently") && "!text-error-500",
170
+ (e.label === "Delete" || e.label === "Remove" || e.label === "Delete user" || e.label === "Move to trash" || e.label === "Delete Permanently") && "!text-error-700",
169
171
  e.disabled && "opacity-70"
170
172
  ),
171
173
  children: /* @__PURE__ */ i(
@@ -173,7 +175,7 @@ const M = ({
173
175
  {
174
176
  hideTooltip: !e.tooltip,
175
177
  title: e.tooltip,
176
- className: "flex items-center",
178
+ className: "flex items-center gap-1.5",
177
179
  children: [
178
180
  e.icon,
179
181
  !e?.hideLabel && e.label && /* @__PURE__ */ a(
@@ -181,7 +183,7 @@ const M = ({
181
183
  {
182
184
  size: "small",
183
185
  variant: "medium",
184
- className: "text-inherit ml-1.5",
186
+ className: "text-inherit",
185
187
  appearance: "custom",
186
188
  children: e.label
187
189
  }
@@ -190,7 +192,7 @@ const M = ({
190
192
  }
191
193
  )
192
194
  },
193
- n
195
+ o
194
196
  )
195
197
  }
196
198
  ) : /* @__PURE__ */ a(
@@ -199,10 +201,10 @@ const M = ({
199
201
  id: `btn-floating-bar-${e.label}`,
200
202
  onClick: e.onClick,
201
203
  disabled: e.disabled,
202
- className: r(
203
- 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",
204
+ className: t(
205
+ e?.label ? "flex items-center gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] text-white dark:text-neutral-50 hover:opacity-80 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",
204
206
  e?.hideLabel && "!p-1.5",
205
- (e.label === "Delete" || e.label === "Remove" || e.label === "Move to trash" || e.label === "Delete Permanently") && "!text-error-500",
207
+ (e.label === "Delete" || e.label === "Remove" || e.label === "Move to trash" || e.label === "Delete Permanently") && "!text-error-700",
206
208
  e.disabled && "opacity-70"
207
209
  ),
208
210
  children: /* @__PURE__ */ i(
@@ -218,7 +220,7 @@ const M = ({
218
220
  {
219
221
  size: "small",
220
222
  variant: "medium",
221
- className: "text-inherit ml-1.5",
223
+ className: "text-inherit",
222
224
  appearance: "custom",
223
225
  children: e.label
224
226
  }
@@ -227,16 +229,16 @@ const M = ({
227
229
  }
228
230
  )
229
231
  }
230
- ) }, n)
232
+ ) }, o)
231
233
  ),
232
- d ? /* @__PURE__ */ i(
234
+ p ? /* @__PURE__ */ i(
233
235
  "button",
234
236
  {
235
237
  id: `btn-floating-bar-${l.label}`,
236
238
  onClick: l.onClick,
237
239
  disabled: l.disabled,
238
- className: r(
239
- "flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200",
240
+ className: t(
241
+ "flex items-center gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] hover:scale-105 hover:opacity-80 transition-all duration-200",
240
242
  l.disabled && "opacity-70"
241
243
  ),
242
244
  children: [
@@ -246,7 +248,7 @@ const M = ({
246
248
  {
247
249
  size: "small",
248
250
  variant: "medium",
249
- className: "text-error-500",
251
+ className: "text-error-700",
250
252
  appearance: "custom",
251
253
  children: l.label
252
254
  }
@@ -257,7 +259,7 @@ const M = ({
257
259
  ]
258
260
  }
259
261
  ) : /* @__PURE__ */ i(
260
- x.div,
262
+ b.div,
261
263
  {
262
264
  initial: { opacity: 0 },
263
265
  animate: { opacity: 1 },
@@ -265,25 +267,25 @@ const M = ({
265
267
  className: "minw-[150px] p-1.5 flex items-center",
266
268
  children: [
267
269
  /* @__PURE__ */ a(
268
- u,
270
+ w,
269
271
  {
270
272
  menu: {
271
- items: f
273
+ items: x
272
274
  },
273
275
  trigger: ["click"],
274
276
  overlayClassName: "!min-w-[148px]",
275
277
  placement: "bottomRight",
276
278
  getPopupContainer: (e) => e.parentElement,
277
- open: b,
279
+ open: f,
278
280
  onOpenChange: g,
279
281
  children: /* @__PURE__ */ i(
280
282
  "button",
281
283
  {
282
284
  id: "btn-floating-bar-actions",
283
- disabled: f.length === 0,
284
- className: r(
285
- "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",
286
- f.length === 0 && "opacity-60 hover:scale-100 hover:opacity-60"
285
+ disabled: x.length === 0,
286
+ className: t(
287
+ "flex items-center gap-1.5 px-2 py-1 w-22 h-7 rounded-full bg-[#34405473]/45 dark:bg-black-700 hover:scale-105 hover:opacity-80 transition-all duration-200",
288
+ x.length === 0 && "opacity-60 hover:scale-100 hover:opacity-60"
287
289
  ),
288
290
  type: "button",
289
291
  children: [
@@ -297,7 +299,7 @@ const M = ({
297
299
  }
298
300
  ),
299
301
  /* @__PURE__ */ a(
300
- O,
302
+ j,
301
303
  {
302
304
  fill: "#FFFFFF",
303
305
  className: "w-[16px] h-[16px]"
@@ -308,14 +310,14 @@ const M = ({
308
310
  )
309
311
  }
310
312
  ),
311
- d ? /* @__PURE__ */ i(
313
+ p ? /* @__PURE__ */ i(
312
314
  "button",
313
315
  {
314
316
  id: `btn-floating-bar-${l.label}`,
315
317
  onClick: l.onClick,
316
318
  disabled: l.disabled,
317
- className: r(
318
- "flex items-center gap-1.5 py-1 pr-3 pl-2 rounded-md hover:scale-105 hover:opacity-80 transition-all duration-200",
319
+ className: t(
320
+ "flex items-center gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] hover:scale-105 hover:opacity-80 transition-all duration-200",
319
321
  l.disabled && "opacity-70"
320
322
  ),
321
323
  type: "button",
@@ -326,7 +328,7 @@ const M = ({
326
328
  {
327
329
  size: "small",
328
330
  variant: "medium",
329
- className: "text-error-500",
331
+ className: "text-error-700",
330
332
  appearance: "custom",
331
333
  children: l.label
332
334
  }
@@ -345,8 +347,8 @@ const M = ({
345
347
  }
346
348
  ) : null;
347
349
  };
348
- P.displayName = "FloatingBar";
350
+ M.displayName = "FloatingBar";
349
351
  export {
350
- P as FloatingBar
352
+ M as FloatingBar
351
353
  };
352
354
  //# sourceMappingURL=FloatingBar.es.js.map
package/dist/components/floating-bar/FloatingBar.es.js.map CHANGED
@@ -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 className=\"text-error-500 w-icon h-icon\" />,\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 === \"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\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 className=\"text-error-700 w-icon h-icon\" />,\n color: \"text-error-700 dark:text-error-700\",\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-[36px] mb-4\", isFlowDashboard ? \"ml-60 w-1/2\" : \"w-full\")}\n >\n <div\n className={cn(\n \"border-y border-neutral-900 dark:border-[#0d1014 px-[12px] text-white bg-neutral-900 dark:bg-black-900 flex justify-between items-center\"\n )}\n >\n <div className=\"flex items-center gap-[12px]\">\n <div className=\"flex items-center gap-[8px]\">\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={16} />\n </IconButton>\n <div className=\"w-px h-[14px] rounded-[1px] bg-neutral-700 dark:bg-[#1d242c]\" />\n </div>\n <div className=\"flex items-center gap-[6px]\">\n <span className=\"inline-flex items-center justify-center min-w-[20px] h-[16px] px-[8px] rounded-[9px] border text-[12px] leading-[18px] font-normal text-primary-600 dark:text-primary-400 bg-primary-50 dark:bg-[rgba(0,50,95,0.3)] border-primary-200 dark:border-primary-800\">\n {selectedItemsCount || 0}\n </span>\n <Typography\n size=\"extra-small\"\n appearance=\"custom\"\n className=\"text-white dark:text-neutral-50\"\n >\n {t(\"Selected\")}\n </Typography>\n </div>\n </div>\n <div\n ref={actionContainerRef}\n className={cn(\n \"h-[36px] flex items-center font-inter bg-neutral-800 dark:bg-black-800 px-[10px] rounded-[43px]\"\n )}\n >\n {showButtons ? (\n <motion.div\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.2 }}\n className=\"flex items-center h-[36px] bg-neutral-800 dark:bg-black-800 px-[10px] rounded-[43px]\"\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 gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] text-white dark:text-neutral-50 hover:opacity-80 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-700\",\n button.disabled && \"opacity-70\"\n )}\n >\n <Tooltip\n hideTooltip={!button.tooltip}\n title={button.tooltip}\n className=\"flex items-center gap-1.5\"\n >\n {button.icon}\n {!button?.hideLabel && button.label && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={\"text-inherit\"}\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 gap-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] text-white dark:text-neutral-50 hover:opacity-80 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 === \"Move to trash\" ||\n button.label === \"Delete Permanently\") &&\n \"!text-error-700\",\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\"}\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-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] 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-700\"\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-[#34405473]/45 dark:bg-black-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-[6px] pl-[8px] pr-[12px] py-[4px] rounded-[6px] 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-700\"\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/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@lax-wp/design-system",
3
3
  "private": false,
4
- "version": "0.14.17",
4
+ "version": "0.14.19",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs.js",
7
7
  "module": "dist/index.es.js",