@flipdish/portal-library 5.8.0 → 5.9.0

package/dist/components/molecules/ButtonGroup/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material/styles"),l=require("../../atoms/Button/index.cjs.js");const i=t.styled("div",{shouldForwardProp:e=>!["align","gap","layout","order"].includes(e)})((({theme:e,align:r="right",gap:t=2,layout:l="horizontal",order:i="default"})=>{const n="vertical"===l,a="reverse"===i;return{display:"flex",flexDirection:n?a?"column-reverse":"column":a?"row-reverse":"row",justifyContent:n||"left"===r?a?"flex-end":"flex-start":"center"===r?"center":a?"flex-start":"flex-end",alignItems:n?"stretch":"center",gap:e.spacing(t),width:"100%",...n?{"&& > *":{width:"100%",maxWidth:"100%"}}:{}}}));module.exports=({children:t,align:n="right",layout:a="horizontal",size:o="medium",order:s="default",fullWidthChildren:d,gap:u,fdKey:c,className:h,...m})=>{const f=u??("small"===o?1:"large"===o?3:2),p="vertical"===a||!!d,g=e=>{if(!r.isValidElement(e))return e;if(e.type===r.Fragment){const t=e,l=r.Children.map(t.props.children,g);return r.cloneElement(t,{children:l})}if(e.type!==l.Button)return e;const t=e.props,i={};return void 0===t.size&&(i.size=o),p&&void 0===t.fullWidth&&(i.fullWidth=!0),Object.keys(i).length>0?r.cloneElement(e,i):e},y=r.Children.map(t,g);return e.jsx(i,{...m,align:n,className:h,"data-fd":c,gap:f,layout:a,order:s,role:m.role??"group",children:y})};
+//# sourceMappingURL=index.cjs.js.map

package/dist/components/molecules/ButtonGroup/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/ButtonGroup/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Button from '../../atoms/Button';\n\nexport interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n  align?: 'center' | 'left' | 'right';\n  layout?: 'horizontal' | 'vertical';\n  size?: 'large' | 'medium' | 'small';\n  order?: 'default' | 'reverse';\n  fullWidthChildren?: boolean;\n  gap?: number;\n  fdKey?: string;\n}\n\ntype StyledProps = Pick<ButtonGroupProps, 'align' | 'gap' | 'layout' | 'order'>;\n\nconst StyledContainer = styled('div', {\n  shouldForwardProp: (prop) => !['align', 'gap', 'layout', 'order'].includes(prop as string),\n})<StyledProps>(({ theme, align = 'right', gap = 2, layout = 'horizontal', order = 'default' }) => {\n  const isVertical = layout === 'vertical';\n  const isReverse = order === 'reverse';\n\n  const flexDirection = isVertical\n    ? isReverse\n      ? 'column-reverse'\n      : 'column'\n    : isReverse\n      ? 'row-reverse'\n      : 'row';\n\n  const justifyContent = isVertical\n    ? // keep items visually at the top whether reversed or not\n    isReverse\n      ? 'flex-end'\n      : 'flex-start'\n    : align === 'left'\n      ? isReverse\n        ? 'flex-end'\n        : 'flex-start'\n      : align === 'center'\n        ? 'center'\n        : // align === 'right'\n        isReverse\n          ? 'flex-start'\n          : 'flex-end';\n\n  return {\n    display: 'flex',\n    flexDirection,\n    justifyContent,\n    alignItems: isVertical ? 'stretch' : 'center',\n    gap: theme.spacing(gap),\n    width: '100%',\n    ...(isVertical\n      ? {\n        // Ensure full-width children in vertical layout as a fallback\n        // Increase specificity so it overrides any child width styles\n        '&& > *': {\n          width: '100%',\n          maxWidth: '100%',\n        },\n      }\n      : {}),\n  };\n});\n\nconst ButtonGroup = ({\n  children,\n  align = 'right',\n  layout = 'horizontal',\n  size = 'medium',\n  order = 'default',\n  fullWidthChildren,\n  gap,\n  fdKey,\n  className,\n  ...rest\n}: ButtonGroupProps): JSX.Element => {\n  const resolvedGap = gap ?? (size === 'small' ? 1 : size === 'large' ? 3 : 2);\n  const resolvedFullWidthChildren = layout === 'vertical' ? true : !!fullWidthChildren;\n\n  interface ButtonLikeProps { size?: 'large' | 'medium' | 'small'; fullWidth?: boolean }\n\n  const enhanceChild = (node: React.ReactNode): React.ReactNode => {\n    if (!React.isValidElement(node)) return node;\n\n    if (node.type === React.Fragment) {\n      const fragment = node as React.ReactElement<{ children?: React.ReactNode }>;\n      const mappedChildren = React.Children.map(fragment.props.children, enhanceChild);\n      return React.cloneElement(fragment, { children: mappedChildren });\n    }\n\n    if (node.type !== Button) return node;\n\n    const childProps = node.props as ButtonLikeProps;\n    const newProps: Partial<ButtonLikeProps> = {};\n\n    if (childProps.size === undefined) newProps.size = size;\n    if (resolvedFullWidthChildren && childProps.fullWidth === undefined) newProps.fullWidth = true;\n\n    return Object.keys(newProps).length > 0 ? React.cloneElement(node, newProps) : node;\n  };\n\n  const enhancedChildren = React.Children.map(children, enhanceChild);\n\n  return (\n    <StyledContainer\n      {...rest}\n      align={align}\n      className={className}\n      data-fd={fdKey}\n      gap={resolvedGap}\n      layout={layout}\n      order={order}\n      role={rest.role ?? 'group'}\n    >\n      {enhancedChildren}\n    </StyledContainer>\n  );\n};\n\nexport default ButtonGroup;\n"],"names":["StyledContainer","styled","shouldForwardProp","prop","includes","theme","align","gap","layout","order","isVertical","isReverse","display","flexDirection","justifyContent","alignItems","spacing","width","maxWidth","children","size","fullWidthChildren","fdKey","className","rest","resolvedGap","resolvedFullWidthChildren","enhanceChild","node","React","isValidElement","type","Fragment","fragment","mappedChildren","Children","map","props","cloneElement","Button","childProps","newProps","undefined","fullWidth","Object","keys","length","enhancedChildren","_jsx","role"],"mappings":"kJAmBA,MAAMA,EAAkBC,EAAAA,OAAO,MAAO,CACpCC,kBAAoBC,IAAU,CAAC,QAAS,MAAO,SAAU,SAASC,SAASD,IADrDF,EAER,EAAGI,QAAOC,QAAQ,QAASC,MAAM,EAAGC,SAAS,aAAcC,QAAQ,cACjF,MAAMC,EAAwB,aAAXF,EACbG,EAAsB,YAAVF,EA0BlB,MAAO,CACLG,QAAS,OACTC,cA1BoBH,EAClBC,EACE,iBACA,SACFA,EACE,cACA,MAqBJG,eAnBqBJ,GAKT,SAAVJ,EAHFK,EACI,WACA,aAKU,WAAVL,EACE,SAEFK,EACI,aACA,WAMRI,WAAYL,EAAa,UAAY,SACrCH,IAAKF,EAAMW,QAAQT,GACnBU,MAAO,UACHP,EACA,CAGA,SAAU,CACRO,MAAO,OACPC,SAAU,SAGZ,sBAIY,EAClBC,WACAb,QAAQ,QACRE,SAAS,aACTY,OAAO,SACPX,QAAQ,UACRY,oBACAd,MACAe,QACAC,eACGC,MAEH,MAAMC,EAAclB,IAAiB,UAATa,EAAmB,EAAa,UAATA,EAAmB,EAAI,GACpEM,EAAuC,aAAXlB,KAAiCa,EAI7DM,EAAgBC,IACpB,IAAKC,EAAMC,eAAeF,GAAO,OAAOA,EAExC,GAAIA,EAAKG,OAASF,EAAMG,SAAU,CAChC,MAAMC,EAAWL,EACXM,EAAiBL,EAAMM,SAASC,IAAIH,EAASI,MAAMlB,SAAUQ,GACnE,OAAOE,EAAMS,aAAaL,EAAU,CAAEd,SAAUe,GAClD,CAEA,GAAIN,EAAKG,OAASQ,EAAAA,OAAQ,OAAOX,EAEjC,MAAMY,EAAaZ,EAAKS,MAClBI,EAAqC,CAAA,EAK3C,YAHwBC,IAApBF,EAAWpB,OAAoBqB,EAASrB,KAAOA,GAC/CM,QAAsDgB,IAAzBF,EAAWG,YAAyBF,EAASE,WAAY,GAEnFC,OAAOC,KAAKJ,GAAUK,OAAS,EAAIjB,EAAMS,aAAaV,EAAMa,GAAYb,GAG3EmB,EAAmBlB,EAAMM,SAASC,IAAIjB,EAAUQ,GAEtD,OACEqB,MAAChD,EAAe,IACVwB,EACJlB,MAAOA,EACPiB,UAAWA,YACFD,EACTf,IAAKkB,EACLjB,OAAQA,EACRC,MAAOA,EACPwC,KAAMzB,EAAKyB,MAAQ,iBAElBF"}

package/dist/components/molecules/ButtonGroup/index.d.ts

@@ -0,0 +1,16 @@
+import react__default from 'react';
+
+interface ButtonGroupProps extends react__default.HTMLAttributes<HTMLDivElement> {
+    children: react__default.ReactNode;
+    align?: 'center' | 'left' | 'right';
+    layout?: 'horizontal' | 'vertical';
+    size?: 'large' | 'medium' | 'small';
+    order?: 'default' | 'reverse';
+    fullWidthChildren?: boolean;
+    gap?: number;
+    fdKey?: string;
+}
+declare const ButtonGroup: ({ children, align, layout, size, order, fullWidthChildren, gap, fdKey, className, ...rest }: ButtonGroupProps) => JSX.Element;
+
+export { ButtonGroup as default };
+export type { ButtonGroupProps };

package/dist/components/molecules/ButtonGroup/index.js

@@ -0,0 +1,2 @@
+import{jsx as e}from"react/jsx-runtime";import r from"react";import{styled as t}from"@mui/material/styles";import{Button as l}from"../../atoms/Button/index.js";const i=t("div",{shouldForwardProp:e=>!["align","gap","layout","order"].includes(e)})((({theme:e,align:r="right",gap:t=2,layout:l="horizontal",order:i="default"})=>{const n="vertical"===l,o="reverse"===i;return{display:"flex",flexDirection:n?o?"column-reverse":"column":o?"row-reverse":"row",justifyContent:n||"left"===r?o?"flex-end":"flex-start":"center"===r?"center":o?"flex-start":"flex-end",alignItems:n?"stretch":"center",gap:e.spacing(t),width:"100%",...n?{"&& > *":{width:"100%",maxWidth:"100%"}}:{}}})),n=({children:t,align:n="right",layout:o="horizontal",size:a="medium",order:d="default",fullWidthChildren:s,gap:m,fdKey:c,className:u,...f})=>{const p=m??("small"===a?1:"large"===a?3:2),h="vertical"===o||!!s,g=e=>{if(!r.isValidElement(e))return e;if(e.type===r.Fragment){const t=e,l=r.Children.map(t.props.children,g);return r.cloneElement(t,{children:l})}if(e.type!==l)return e;const t=e.props,i={};return void 0===t.size&&(i.size=a),h&&void 0===t.fullWidth&&(i.fullWidth=!0),Object.keys(i).length>0?r.cloneElement(e,i):e},y=r.Children.map(t,g);return e(i,{...f,align:n,className:u,"data-fd":c,gap:p,layout:o,order:d,role:f.role??"group",children:y})};export{n as default};
+//# sourceMappingURL=index.js.map

package/dist/components/molecules/ButtonGroup/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/ButtonGroup/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled } from '@mui/material/styles';\n\nimport Button from '../../atoms/Button';\n\nexport interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n  align?: 'center' | 'left' | 'right';\n  layout?: 'horizontal' | 'vertical';\n  size?: 'large' | 'medium' | 'small';\n  order?: 'default' | 'reverse';\n  fullWidthChildren?: boolean;\n  gap?: number;\n  fdKey?: string;\n}\n\ntype StyledProps = Pick<ButtonGroupProps, 'align' | 'gap' | 'layout' | 'order'>;\n\nconst StyledContainer = styled('div', {\n  shouldForwardProp: (prop) => !['align', 'gap', 'layout', 'order'].includes(prop as string),\n})<StyledProps>(({ theme, align = 'right', gap = 2, layout = 'horizontal', order = 'default' }) => {\n  const isVertical = layout === 'vertical';\n  const isReverse = order === 'reverse';\n\n  const flexDirection = isVertical\n    ? isReverse\n      ? 'column-reverse'\n      : 'column'\n    : isReverse\n      ? 'row-reverse'\n      : 'row';\n\n  const justifyContent = isVertical\n    ? // keep items visually at the top whether reversed or not\n    isReverse\n      ? 'flex-end'\n      : 'flex-start'\n    : align === 'left'\n      ? isReverse\n        ? 'flex-end'\n        : 'flex-start'\n      : align === 'center'\n        ? 'center'\n        : // align === 'right'\n        isReverse\n          ? 'flex-start'\n          : 'flex-end';\n\n  return {\n    display: 'flex',\n    flexDirection,\n    justifyContent,\n    alignItems: isVertical ? 'stretch' : 'center',\n    gap: theme.spacing(gap),\n    width: '100%',\n    ...(isVertical\n      ? {\n        // Ensure full-width children in vertical layout as a fallback\n        // Increase specificity so it overrides any child width styles\n        '&& > *': {\n          width: '100%',\n          maxWidth: '100%',\n        },\n      }\n      : {}),\n  };\n});\n\nconst ButtonGroup = ({\n  children,\n  align = 'right',\n  layout = 'horizontal',\n  size = 'medium',\n  order = 'default',\n  fullWidthChildren,\n  gap,\n  fdKey,\n  className,\n  ...rest\n}: ButtonGroupProps): JSX.Element => {\n  const resolvedGap = gap ?? (size === 'small' ? 1 : size === 'large' ? 3 : 2);\n  const resolvedFullWidthChildren = layout === 'vertical' ? true : !!fullWidthChildren;\n\n  interface ButtonLikeProps { size?: 'large' | 'medium' | 'small'; fullWidth?: boolean }\n\n  const enhanceChild = (node: React.ReactNode): React.ReactNode => {\n    if (!React.isValidElement(node)) return node;\n\n    if (node.type === React.Fragment) {\n      const fragment = node as React.ReactElement<{ children?: React.ReactNode }>;\n      const mappedChildren = React.Children.map(fragment.props.children, enhanceChild);\n      return React.cloneElement(fragment, { children: mappedChildren });\n    }\n\n    if (node.type !== Button) return node;\n\n    const childProps = node.props as ButtonLikeProps;\n    const newProps: Partial<ButtonLikeProps> = {};\n\n    if (childProps.size === undefined) newProps.size = size;\n    if (resolvedFullWidthChildren && childProps.fullWidth === undefined) newProps.fullWidth = true;\n\n    return Object.keys(newProps).length > 0 ? React.cloneElement(node, newProps) : node;\n  };\n\n  const enhancedChildren = React.Children.map(children, enhanceChild);\n\n  return (\n    <StyledContainer\n      {...rest}\n      align={align}\n      className={className}\n      data-fd={fdKey}\n      gap={resolvedGap}\n      layout={layout}\n      order={order}\n      role={rest.role ?? 'group'}\n    >\n      {enhancedChildren}\n    </StyledContainer>\n  );\n};\n\nexport default ButtonGroup;\n"],"names":["StyledContainer","styled","shouldForwardProp","prop","includes","theme","align","gap","layout","order","isVertical","isReverse","display","flexDirection","justifyContent","alignItems","spacing","width","maxWidth","ButtonGroup","children","size","fullWidthChildren","fdKey","className","rest","resolvedGap","resolvedFullWidthChildren","enhanceChild","node","React","isValidElement","type","Fragment","fragment","mappedChildren","Children","map","props","cloneElement","Button","childProps","newProps","undefined","fullWidth","Object","keys","length","enhancedChildren","_jsx","role"],"mappings":"gKAmBA,MAAMA,EAAkBC,EAAO,MAAO,CACpCC,kBAAoBC,IAAU,CAAC,QAAS,MAAO,SAAU,SAASC,SAASD,IADrDF,EAER,EAAGI,QAAOC,QAAQ,QAASC,MAAM,EAAGC,SAAS,aAAcC,QAAQ,cACjF,MAAMC,EAAwB,aAAXF,EACbG,EAAsB,YAAVF,EA0BlB,MAAO,CACLG,QAAS,OACTC,cA1BoBH,EAClBC,EACE,iBACA,SACFA,EACE,cACA,MAqBJG,eAnBqBJ,GAKT,SAAVJ,EAHFK,EACI,WACA,aAKU,WAAVL,EACE,SAEFK,EACI,aACA,WAMRI,WAAYL,EAAa,UAAY,SACrCH,IAAKF,EAAMW,QAAQT,GACnBU,MAAO,UACHP,EACA,CAGA,SAAU,CACRO,MAAO,OACPC,SAAU,SAGZ,OAIFC,EAAc,EAClBC,WACAd,QAAQ,QACRE,SAAS,aACTa,OAAO,SACPZ,QAAQ,UACRa,oBACAf,MACAgB,QACAC,eACGC,MAEH,MAAMC,EAAcnB,IAAiB,UAATc,EAAmB,EAAa,UAATA,EAAmB,EAAI,GACpEM,EAAuC,aAAXnB,KAAiCc,EAI7DM,EAAgBC,IACpB,IAAKC,EAAMC,eAAeF,GAAO,OAAOA,EAExC,GAAIA,EAAKG,OAASF,EAAMG,SAAU,CAChC,MAAMC,EAAWL,EACXM,EAAiBL,EAAMM,SAASC,IAAIH,EAASI,MAAMlB,SAAUQ,GACnE,OAAOE,EAAMS,aAAaL,EAAU,CAAEd,SAAUe,GAClD,CAEA,GAAIN,EAAKG,OAASQ,EAAQ,OAAOX,EAEjC,MAAMY,EAAaZ,EAAKS,MAClBI,EAAqC,CAAA,EAK3C,YAHwBC,IAApBF,EAAWpB,OAAoBqB,EAASrB,KAAOA,GAC/CM,QAAsDgB,IAAzBF,EAAWG,YAAyBF,EAASE,WAAY,GAEnFC,OAAOC,KAAKJ,GAAUK,OAAS,EAAIjB,EAAMS,aAAaV,EAAMa,GAAYb,GAG3EmB,EAAmBlB,EAAMM,SAASC,IAAIjB,EAAUQ,GAEtD,OACEqB,EAACjD,EAAe,IACVyB,EACJnB,MAAOA,EACPkB,UAAWA,YACFD,EACThB,IAAKmB,EACLlB,OAAQA,EACRC,MAAOA,EACPyC,KAAMzB,EAAKyB,MAAQ,iBAElBF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flipdish/portal-library",
-  "version": "5.8.0",
+  "version": "5.9.0",
   "files": [
     "dist"
   ],