@foodpilot/foods 2.12.0 → 2.12.1

package/dist/components/Cards/SelectionCard/SelectionCard.d.ts

@@ -5,6 +5,7 @@ export type SelectionCardProps = {
     icon?: ReactNode;
     selected?: boolean;
     disabled?: boolean;
+    fullWidth?: boolean;
     onClick?: () => void;
     id?: string;
     tabIndex?: number;

package/dist/components/Cards/SelectionCard/SelectionCard.js

@@ -1,4 +1,4 @@
-import{jsxs as o,jsx as e}from"react/jsx-runtime";import{useTheme as r,Stack as i,Box as n,Typography as t}from"@mui/material";import{forwardRef as l}from"react";import{FoodsIcon as a}from"../../Icons/FoodsIcon.js";import{greyTheme as d}from"../../../themes/common/colors.js";const c=l((l,c)=>{const{title:s,description:p,icon:m,selected:x=!1,disabled:b=!1,onClick:h,id:f,tabIndex:u,onKeyDown:g}=l,y=r(),k=y.palette.primary,C=y.palette.grey,w=C[100],I=k[50]??w,j=k[200]??k.main,v=k[600]??k.main,S=C[600],D=b?d[1400]:y.palette.text.primary,F=b?C[300]:x?k[100]??I:I;/* @__PURE__ */
-return o(i,{component:"button",ref:c,id:f,type:"button",role:"radio","aria-checked":x,"aria-disabled":b,disabled:b,tabIndex:u,onClick:()=>{b||h?.()},onKeyDown:g,direction:"row",alignItems:"center",gap:y.spacing(2),sx:{width:"306px",minHeight:"82px",padding:y.spacing(2),border:`1px solid ${b?S:x?v:j}`,borderRadius:"12px",backgroundColor:x?I:w,boxShadow:"0px 2px 8px 0px rgba(42, 43, 39, 0.04)",color:D,cursor:b?"not-allowed":"pointer",font:"inherit",textAlign:"left",transition:"background-color 150ms ease, border-color 150ms ease","&:hover":b?void 0:{backgroundColor:I,borderColor:v},"&:focus-visible":{outline:`2px solid ${v}`,outlineOffset:"2px"}},children:[m&&/* @__PURE__ */e(n,{sx:{display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0,padding:y.spacing(1),borderRadius:"12px",backgroundColor:F,color:D},children:m}),
-/* @__PURE__ */o(i,{flex:1,justifyContent:"center",minWidth:0,children:[
-/* @__PURE__ */e(t,{variant:"body-semibold",color:"inherit",children:s}),p&&/* @__PURE__ */e(t,{variant:"small",color:"inherit",children:p})]}),x&&/* @__PURE__ */e(n,{flexShrink:0,color:v,children:/* @__PURE__ */e(a,{icon:"checkCircleFilled",size:2})})]})});c.displayName="SelectionCard";export{c as SelectionCard};
+import{jsxs as o,jsx as e}from"react/jsx-runtime";import{useTheme as i,Stack as r,Box as t,Typography as n}from"@mui/material";import{forwardRef as l}from"react";import{FoodsIcon as d}from"../../Icons/FoodsIcon.js";import{greyTheme as a}from"../../../themes/common/colors.js";const c=l((l,c)=>{const{title:s,description:p,icon:m,selected:x=!1,disabled:b=!1,fullWidth:h=!1,onClick:f,id:u,tabIndex:g,onKeyDown:y}=l,k=i(),C=k.palette.primary,w=k.palette.grey,I=w[100],j=C[50]??I,v=C[200]??C.main,S=C[600]??C.main,W=w[600],D=b?a[1400]:k.palette.text.primary,F=b?w[300]:x?C[100]??j:j;/* @__PURE__ */
+return o(r,{component:"button",ref:c,id:u,type:"button",role:"radio","aria-checked":x,"aria-disabled":b,disabled:b,tabIndex:g,onClick:()=>{b||f?.()},onKeyDown:y,direction:"row",alignItems:"center",gap:k.spacing(2),sx:{width:h?"100%":"306px",flex:h?1:"0 0 auto",minWidth:0,minHeight:"82px",padding:k.spacing(2),border:`1px solid ${b?W:x?S:v}`,borderRadius:"12px",backgroundColor:x?j:I,boxShadow:"0px 2px 8px 0px rgba(42, 43, 39, 0.04)",color:D,cursor:b?"not-allowed":"pointer",font:"inherit",textAlign:"left",transition:"background-color 150ms ease, border-color 150ms ease","&:hover":b?void 0:{backgroundColor:j,borderColor:S},"&:focus-visible":{outline:`2px solid ${S}`,outlineOffset:"2px"}},children:[m&&/* @__PURE__ */e(t,{sx:{display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0,padding:k.spacing(1),borderRadius:"12px",backgroundColor:F,color:D},children:m}),
+/* @__PURE__ */o(r,{flex:1,justifyContent:"center",minWidth:0,children:[
+/* @__PURE__ */e(n,{variant:"body-semibold",color:"inherit",children:s}),p&&/* @__PURE__ */e(n,{variant:"small",color:"inherit",children:p})]}),x&&/* @__PURE__ */e(t,{flexShrink:0,color:S,children:/* @__PURE__ */e(d,{icon:"checkCircleFilled",size:2})})]})});c.displayName="SelectionCard";export{c as SelectionCard};

package/dist/components/Cards/SelectionCard/SelectionCardGroup.d.ts

@@ -12,5 +12,6 @@ export type SelectionCardGroupProps<T extends string | number = string> = {
     onChange: (id: T) => void;
     direction?: "row" | "column";
     name?: string;
+    fullWidth?: boolean;
 };
 export declare const SelectionCardGroup: <T extends string | number = string>(props: SelectionCardGroupProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Cards/SelectionCard/SelectionCardGroup.js

@@ -1,3 +1,3 @@
-import{jsx as r}from"react/jsx-runtime";import{Stack as e}from"@mui/material";import{useRef as t,useMemo as i}from"react";import{SelectionCard as n}from"./SelectionCard.js";const o=o=>{const{options:d,value:c,onChange:l,direction:s="row",name:a}=o,u=t([]),f=i(()=>d.map((r,e)=>r.disabled?null:e).filter(r=>null!==r),[d]),p=d.findIndex(r=>r.id===c),w=f[0]??-1;/* @__PURE__ */
-return r(e,{role:"radiogroup","aria-label":a,direction:s,gap:2,onKeyDown:r=>{const e="row"===s?["ArrowRight","ArrowDown"]:["ArrowDown","ArrowRight"],t="row"===s?["ArrowLeft","ArrowUp"]:["ArrowUp","ArrowLeft"];if(e.includes(r.key)||t.includes(r.key)){r.preventDefault();const t=(r=>{const e=u.current.findIndex(e=>e===r.target);return-1!==e?e:-1!==p?p:w})(r),i=((r,e)=>{if(0===f.length)return-1;const t=f.indexOf(r),i=((-1===t?0:t)+e+f.length)%f.length;return f[i]})(t,e.includes(r.key)?1:-1);(r=>{const e=d[r];e&&!e.disabled&&(l(e.id),u.current[r]?.focus())})(i)}},sx:{width:"fit-content"},children:d.map((e,t)=>{const i=e.id===c,o=i||-1===p&&t===w;/* @__PURE__ */
-return r(n,{ref:r=>{u.current[t]=r},id:String(e.id),title:e.title,description:e.description,icon:e.icon,selected:i,disabled:e.disabled,tabIndex:e.disabled?void 0:o?0:-1,onClick:()=>l(e.id)},e.id)})})};export{o as SelectionCardGroup};
+import{jsx as r}from"react/jsx-runtime";import{Stack as e}from"@mui/material";import{useRef as t,useMemo as i}from"react";import{SelectionCard as n}from"./SelectionCard.js";const o=o=>{const{options:d,value:l,onChange:c,direction:s="row",name:a,fullWidth:u=!1}=o,f=t([]),w=i(()=>d.map((r,e)=>r.disabled?null:e).filter(r=>null!==r),[d]),m=d.findIndex(r=>r.id===l),p=w[0]??-1;/* @__PURE__ */
+return r(e,{role:"radiogroup","aria-label":a,direction:s,gap:3,onKeyDown:r=>{const e="row"===s?["ArrowRight","ArrowDown"]:["ArrowDown","ArrowRight"],t="row"===s?["ArrowLeft","ArrowUp"]:["ArrowUp","ArrowLeft"];if(e.includes(r.key)||t.includes(r.key)){r.preventDefault();const t=(r=>{const e=f.current.findIndex(e=>e===r.target);return-1!==e?e:-1!==m?m:p})(r),i=((r,e)=>{if(0===w.length)return-1;const t=w.indexOf(r),i=((-1===t?0:t)+e+w.length)%w.length;return w[i]})(t,e.includes(r.key)?1:-1);(r=>{const e=d[r];e&&!e.disabled&&(c(e.id),f.current[r]?.focus())})(i)}},alignItems:u&&"row"===s?"stretch":void 0,sx:{width:u?"100%":"fit-content"},children:d.map((e,t)=>{const i=e.id===l,o=i||-1===m&&t===p;/* @__PURE__ */
+return r(n,{ref:r=>{f.current[t]=r},id:String(e.id),title:e.title,description:e.description,icon:e.icon,selected:i,disabled:e.disabled,fullWidth:u,tabIndex:e.disabled?void 0:o?0:-1,onClick:()=>c(e.id)},e.id)})})};export{o as SelectionCardGroup};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@foodpilot/foods",
   "private": false,
-  "version": "2.12.0",
+  "version": "2.12.1",
   "type": "module",
   "main": "./dist/main.js",
   "module": "./dist/main.js",