@fpkit/acss 6.4.3 → 6.5.0

package/libs/index.js

@@ -1,19 +1,19 @@
 export { a as Textarea } from './chunk-6ADHES7B.js';
 export { a as Field } from './chunk-MAG46S3P.js';
 export { a as Caption, i as TBL, f as Table, c as Tbody, e as Td, b as Thead, d as Tr } from './chunk-FMIM3332.js';
-import { b as b$2 } from './chunk-VQTCTLFN.js';
-export { a as Dialog } from './chunk-VQTCTLFN.js';
+import { a as a$2, c } from './chunk-EARHB4PD.js';
+export { b as Dialog, a as IconButton } from './chunk-EARHB4PD.js';
 export { c as Nav, b as NavItem, a as NavList } from './chunk-3ENBUQIB.js';
 export { c as List } from './chunk-RQSMWB3J.js';
 export { a as Popover } from './chunk-DSQ2TUCR.js';
 export { a as Text } from './chunk-SPESKPUA.js';
 export { b as Heading, a as Title } from './chunk-AQAI6COH.js';
 export { b as Breadcrumb, a as useBreadcrumbSegments } from './chunk-2ZJV6KQ3.js';
-import { b as b$1 } from './chunk-4F6SI5V5.js';
+import { b as b$2 } from './chunk-4F6SI5V5.js';
 export { a as Icon } from './chunk-4F6SI5V5.js';
 export { d as Card, b as CardContent, c as CardFooter, a as CardTitle } from './chunk-MJJKNHVH.js';
 export { a as Modal } from './chunk-6NMLU5FA.js';
-import { b, a as a$2 } from './chunk-34NWHFHP.js';
+import { b as b$1 } from './chunk-34NWHFHP.js';
 export { a as Button } from './chunk-34NWHFHP.js';
 import { a as a$1 } from './chunk-F5EYMVQM.js';
 export { a as Input } from './chunk-F5EYMVQM.js';
@@ -23,22 +23,22 @@ import './chunk-75QHTLFO.js';
 export { d as Link, d as To } from './chunk-M5ES7OWP.js';
 import { a } from './chunk-4KJP3L35.js';
 export { a as UI } from './chunk-4KJP3L35.js';
-import v, { useCallback, useMemo, useState, useRef, useEffect } from 'react';
+import b, { useCallback, useMemo, useState, useRef, useEffect } from 'react';
 
-var L=({icon:e,label:t,variant:o="icon",type:r="button",...s})=>v.createElement(a$2,{variant:o,"data-icon-btn":t?"has-label":"icon",...s,type:r},e,t&&v.createElement("span",{"data-icon-label":!0},t));L.displayName="IconButton";var ze={default:"",info:"Information: ",success:"Success: ",warning:"Warning: ",error:"Error: "},O=({severity:e})=>{let t=ze[e];return t?v.createElement("span",{className:"sr-only"},t):null};var Oe=(e,t)=>({info:v.createElement(b$1.InfoSolid,{...t}),success:v.createElement(b$1.SuccessSolid,{...t}),warning:v.createElement(b$1.WarnSolid,{...t}),error:v.createElement(b$1.AlertSolid,{...t}),default:v.createElement(b$1.AlertSquareSolid,{...t})})[e],_=({severity:e,iconProps:t,hideIcon:o})=>{if(o)return null;let r=Oe(e,t);return v.createElement(a,{"aria-hidden":"true",className:"alert-icon"},r)};var W=({title:e,titleLevel:t})=>{if(!e)return null;let o=t?`h${t}`:"strong";return v.createElement(a,{as:o,className:"alert-title"},e)};var J=({children:e,contentType:t})=>t==="node"?v.createElement(v.Fragment,null,e):v.createElement(a,{as:"p"},e);var K=({actions:e})=>e?v.createElement(a,{as:"div",className:"alert-actions"},e):null;var te=v.memo(({onDismiss:e,iconSize:t=16})=>v.createElement(b,{type:"button",onClick:e,"aria-label":"Close alert",className:"alert-dismiss","data-btn":"icon sm"},v.createElement(b$1,null,v.createElement(b$1.Close,{size:t})))),oe=te;te.displayName="DismissButton";var qe={default:"polite",info:"polite",success:"polite",warning:"polite",error:"assertive"},D=v.forwardRef(({severity:e,variant:t,isVisible:o,dismissible:r,onDismiss:s,onInteractionStart:l,onInteractionEnd:a$1,autoFocus:i,title:p,titleLevel:d,children:m,contentType:c,actions:g,hideIcon:h,iconProps:P,...x},y)=>v.createElement(a,{as:"div",ref:y,role:"alert","aria-live":qe[e],"aria-atomic":"true",className:`alert alert-${e}`,"data-alert":e,"data-visible":o,"data-variant":t,tabIndex:i?-1:void 0,onMouseEnter:l,onMouseLeave:a$1,onFocus:l,onBlur:a$1,...x},v.createElement(O,{severity:e}),v.createElement(_,{severity:e,iconProps:P,hideIcon:h}),v.createElement(a,{as:"div",classes:"alert-message"},v.createElement(W,{title:p,titleLevel:d}),v.createElement(J,{contentType:c},m),v.createElement(K,{actions:g})),r&&v.createElement(oe,{onDismiss:s})));D.displayName="AlertView";var Je=({open:e,onDismiss:t,dismissible:o,autoHideDuration:r,pauseOnHover:s,autoFocus:l,alertRef:a})=>{let[i,p]=v.useState(e),[d,m]=v.useState(e),[c,g]=v.useState(!1),h=v.useCallback(()=>{p(!1),setTimeout(()=>{m(!1),t?.();},300);},[t]);v.useEffect(()=>{e?(m(!0),p(!0)):p(!1);},[e]),v.useEffect(()=>{if(!r||!i||c)return;let y=setTimeout(()=>{h();},r);return ()=>clearTimeout(y)},[r,i,c,h]),v.useEffect(()=>{if(!o||!i)return;let y=I=>{I.key==="Escape"&&h();};return document.addEventListener("keydown",y),()=>document.removeEventListener("keydown",y)},[o,i,h]),v.useEffect(()=>{l&&i&&a.current&&a.current.focus();},[l,i,a]);let P=v.useCallback(()=>{s&&r&&g(!0);},[s,r]),x=v.useCallback(()=>{s&&r&&g(!1);},[s,r]);return {isVisible:i,shouldRender:d,handleDismiss:h,handleInteractionStart:P,handleInteractionEnd:x}},re=({open:e,severity:t="default",children:o,title:r,dismissible:s=!1,onDismiss:l,iconSize:a,iconProps:i,hideIcon:p,autoHideDuration:d,pauseOnHover:m=!0,titleLevel:c=3,actions:g,autoFocus:h=!1,variant:P="outlined",contentType:x="text",...y})=>{let I=v.useRef(null),{isVisible:u,shouldRender:f,handleDismiss:$,handleInteractionStart:b,handleInteractionEnd:w}=Je({open:e,onDismiss:l,dismissible:s,autoHideDuration:d,pauseOnHover:m,autoFocus:h,alertRef:I});if(!f)return null;let M={size:a||16,...i};return v.createElement(D,{ref:I,severity:t,variant:P,isVisible:u,dismissible:s,onDismiss:$,onInteractionStart:b,onInteractionEnd:w,autoFocus:h,title:r,titleLevel:c,contentType:x,actions:g,hideIcon:p,iconProps:M,...y},o)};re.displayName="Alert";var se=v.forwardRef(({id:e,label:t,checked:o,defaultChecked:r,value:s="on",onChange:l,classes:a,inputClasses:i,styles:p,size:d,name:m,disabled:c,required:g,validationState:h,errorMessage:P,hintText:x,onBlur:y,onFocus:I,autoFocus:u,...f},$)=>{let b=v.useCallback(Te=>{l?.(Te.target.checked);},[l]),w=o!==void 0,M=w?{checked:o}:{},Ee=!w&&r!==void 0?{defaultChecked:r}:{},j=v.useRef(w);return v.useEffect(()=>{process.env.NODE_ENV==="development"&&(j.current!==w&&console.warn(`Checkbox with id="${e}" is changing from ${j.current?"controlled":"uncontrolled"} to ${w?"controlled":"uncontrolled"}. This is likely a bug. Decide between using "checked" (controlled) or "defaultChecked" (uncontrolled) and stick with it.`),j.current=w);},[w,e]),v.createElement("div",{className:a,style:p,"data-checkbox-size":d},v.createElement(a$1,{ref:$,type:"checkbox",id:e,name:m,value:s,...M,...Ee,classes:i||"checkbox-input",disabled:c,required:g,validationState:h,errorMessage:P,hintText:x,onChange:b,onBlur:y,onFocus:I,autoFocus:u,...f}),v.createElement("label",{htmlFor:e,className:"checkbox-label"},t,g&&v.createElement("span",{className:"checkbox-required","aria-label":"required"}," *")))});se.displayName="Checkbox";var ne=({src:e="//",alt:t,width:o=480,height:r,styles:s,loading:l="lazy",placeholder:a$1,fetchpriority:i="low",decoding:p="auto",srcSet:d,sizes:m,onError:c,onLoad:g,...h})=>{let P=useMemo(()=>{let u=typeof o=="number"?o:480,f=typeof r=="number"?r:Math.round(u*.75),$=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${u} ${f}">
+var Ve={default:"",info:"Information: ",success:"Success: ",warning:"Warning: ",error:"Error: "},O=({severity:e})=>{let t=Ve[e];return t?b.createElement("span",{className:"sr-only"},t):null};var ze=(e,t)=>({info:b.createElement(b$2.InfoSolid,{...t}),success:b.createElement(b$2.SuccessSolid,{...t}),warning:b.createElement(b$2.WarnSolid,{...t}),error:b.createElement(b$2.AlertSolid,{...t}),default:b.createElement(b$2.AlertSquareSolid,{...t})})[e],_=({severity:e,iconProps:t,hideIcon:o})=>{if(o)return null;let s=ze(e,t);return b.createElement(a,{"aria-hidden":"true",className:"alert-icon"},s)};var q=({title:e,titleLevel:t})=>{if(!e)return null;let o=t?`h${t}`:"strong";return b.createElement(a,{as:o,className:"alert-title"},e)};var K=({children:e,contentType:t})=>t==="node"?b.createElement(b.Fragment,null,e):b.createElement(a,{as:"p"},e);var W=({actions:e})=>e?b.createElement(a,{as:"div",className:"alert-actions"},e):null;var ee=b.memo(({onDismiss:e,iconSize:t=16})=>b.createElement(b$1,{type:"button",onClick:e,"aria-label":"Close alert",className:"alert-dismiss","data-btn":"icon sm"},b.createElement(b$2,null,b.createElement(b$2.Close,{size:t})))),te=ee;ee.displayName="DismissButton";var qe={default:"polite",info:"polite",success:"polite",warning:"polite",error:"assertive"},D=b.forwardRef(({severity:e,variant:t,isVisible:o,dismissible:s,onDismiss:r,onInteractionStart:l,onInteractionEnd:a$1,autoFocus:i,title:p,titleLevel:u,children:m,contentType:c,actions:y,hideIcon:h,iconProps:I,...x},g)=>b.createElement(a,{as:"div",ref:g,role:"alert","aria-live":qe[e],"aria-atomic":"true",className:`alert alert-${e}`,"data-alert":e,"data-visible":o,"data-variant":t,tabIndex:i?-1:void 0,onMouseEnter:l,onMouseLeave:a$1,onFocus:l,onBlur:a$1,...x},b.createElement(O,{severity:e}),b.createElement(_,{severity:e,iconProps:I,hideIcon:h}),b.createElement(a,{as:"div",classes:"alert-message"},b.createElement(q,{title:p,titleLevel:u}),b.createElement(K,{contentType:c},m),b.createElement(W,{actions:y})),s&&b.createElement(te,{onDismiss:r})));D.displayName="AlertView";var Je=({open:e,onDismiss:t,dismissible:o,autoHideDuration:s,pauseOnHover:r,autoFocus:l,alertRef:a})=>{let[i,p]=b.useState(e),[u,m]=b.useState(e),[c,y]=b.useState(!1),h=b.useCallback(()=>{p(!1),setTimeout(()=>{m(!1),t?.();},300);},[t]);b.useEffect(()=>{e?(m(!0),p(!0)):p(!1);},[e]),b.useEffect(()=>{if(!s||!i||c)return;let g=setTimeout(()=>{h();},s);return ()=>clearTimeout(g)},[s,i,c,h]),b.useEffect(()=>{if(!o||!i)return;let g=P=>{P.key==="Escape"&&h();};return document.addEventListener("keydown",g),()=>document.removeEventListener("keydown",g)},[o,i,h]),b.useEffect(()=>{l&&i&&a.current&&a.current.focus();},[l,i,a]);let I=b.useCallback(()=>{r&&s&&y(!0);},[r,s]),x=b.useCallback(()=>{r&&s&&y(!1);},[r,s]);return {isVisible:i,shouldRender:u,handleDismiss:h,handleInteractionStart:I,handleInteractionEnd:x}},oe=({open:e,severity:t="default",children:o,title:s,dismissible:r=!1,onDismiss:l,iconSize:a,iconProps:i,hideIcon:p,autoHideDuration:u,pauseOnHover:m=!0,titleLevel:c=3,actions:y,autoFocus:h=!1,variant:I="outlined",contentType:x="text",...g})=>{let P=b.useRef(null),{isVisible:d,shouldRender:f,handleDismiss:$,handleInteractionStart:v,handleInteractionEnd:C}=Je({open:e,onDismiss:l,dismissible:r,autoHideDuration:u,pauseOnHover:m,autoFocus:h,alertRef:P});if(!f)return null;let S={size:a||16,...i};return b.createElement(D,{ref:P,severity:t,variant:I,isVisible:d,dismissible:r,onDismiss:$,onInteractionStart:v,onInteractionEnd:C,autoFocus:h,title:s,titleLevel:c,contentType:x,actions:y,hideIcon:p,iconProps:S,...g},o)};oe.displayName="Alert";var se=b.forwardRef(({id:e,label:t,checked:o,defaultChecked:s,value:r="on",onChange:l,classes:a,inputClasses:i,styles:p,size:u,name:m,disabled:c,required:y,validationState:h,errorMessage:I,hintText:x,onBlur:g,onFocus:P,autoFocus:d,...f},$)=>{let v=b.useCallback($e=>{l?.($e.target.checked);},[l]),C=o!==void 0,S=C?{checked:o}:{},N=!C&&s!==void 0?{defaultChecked:s}:{},j=b.useRef(C);return b.useEffect(()=>{process.env.NODE_ENV==="development"&&(j.current!==C&&console.warn(`Checkbox with id="${e}" is changing from ${j.current?"controlled":"uncontrolled"} to ${C?"controlled":"uncontrolled"}. This is likely a bug. Decide between using "checked" (controlled) or "defaultChecked" (uncontrolled) and stick with it.`),j.current=C);},[C,e]),b.createElement("div",{className:a,style:p,"data-checkbox-size":u},b.createElement(a$1,{ref:$,type:"checkbox",id:e,name:m,value:r,...S,...N,classes:i||"checkbox-input",disabled:c,required:y,validationState:h,errorMessage:I,hintText:x,onChange:v,onBlur:g,onFocus:P,autoFocus:d,...f}),b.createElement("label",{htmlFor:e,className:"checkbox-label"},t,y&&b.createElement("span",{className:"checkbox-required","aria-label":"required"}," *")))});se.displayName="Checkbox";var re=({src:e="//",alt:t,width:o=480,height:s,styles:r,loading:l="lazy",placeholder:a$1,fetchpriority:i="low",decoding:p="auto",srcSet:u,sizes:m,onError:c,onLoad:y,...h})=>{let I=useMemo(()=>{let d=typeof o=="number"?o:480,f=typeof s=="number"?s:Math.round(d*.75),$=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${d} ${f}">
       <defs>
-        <linearGradient id="grad-${u}-${f}" x1="0%" y1="0%" x2="100%" y2="100%">
+        <linearGradient id="grad-${d}-${f}" x1="0%" y1="0%" x2="100%" y2="100%">
           <stop offset="0%" style="stop-color:#6366f1;stop-opacity:1" />
           <stop offset="50%" style="stop-color:#8b5cf6;stop-opacity:1" />
           <stop offset="100%" style="stop-color:#ec4899;stop-opacity:1" />
         </linearGradient>
       </defs>
-      <rect width="${u}" height="${f}" fill="url(#grad-${u}-${f})"/>
-      <circle cx="${u*.15}" cy="${f*.2}" r="${Math.min(u,f)*.08}" fill="rgba(255,255,255,0.2)"/>
-      <path d="M0,${f*.75} Q${u*.25},${f*.65} ${u*.5},${f*.75} T${u},${f*.75} L${u},${f} L0,${f} Z" fill="rgba(0,0,0,0.15)"/>
-      <text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="system-ui,-apple-system,sans-serif" font-size="${Math.max(16,Math.min(u,f)*.05)}" font-weight="500" fill="rgba(255,255,255,0.9)">${u}\xD7${f}</text>
-    </svg>`;return `data:image/svg+xml,${encodeURIComponent($)}`},[o,r]),x=a$1??P;return v.createElement(a,{as:"img",src:e,alt:t,width:o,height:r||"auto",loading:l,style:s,srcSet:d,sizes:m,onError:u=>{c&&c(u),u.defaultPrevented||u.currentTarget.src!==x&&(u.currentTarget.src=x);},onLoad:u=>{g?.(u);},decoding:p,...h,...i&&{fetchpriority:i}})};ne.displayName="Img";var ae=({isAlertDialog:e=!1,onClose:t,dialogTitle:o,dialogLabel:r,btnLabel:s="Open Dialog",btnSize:l="sm",btnOnClick:a,children:i,onConfirm:p,confirmLabel:d="Confirm",cancelLabel:m="Cancel",className:c,hideFooter:g=!1,btnProps:h,icon:P})=>{let[x,y]=useState(!1),I=useRef(null),u=useCallback(b=>{y(b),!b&&t&&t();},[t]),f=useCallback(()=>{I.current=document.activeElement,y(!0),a&&a();},[a]);useEffect(()=>{if(!x&&I.current){let b=setTimeout(()=>{I.current?.focus();},100);return ()=>clearTimeout(b)}},[x]);let $={type:"button",onClick:f,"aria-haspopup":"dialog",...h};return v.createElement(v.Fragment,null,P?v.createElement(L,{icon:P,"aria-label":s,label:s,size:l,...$}):v.createElement(b,{"data-btn":l,...$},s),v.createElement(b$2,{isOpen:x,onOpenChange:u,dialogTitle:o,dialogLabel:r,className:c,isAlertDialog:e,onConfirm:p,confirmLabel:d,cancelLabel:m,hideFooter:g},i))};ae.displayName="DialogModal";var S=e=>v.createElement(v.Fragment,null,e),et=({id:e,children:t,headerBackground:o,styles:r,classes:s,...l})=>v.createElement(a,{as:"header",id:e,styles:r,className:s,...l},o,v.createElement(a,{as:"section"},t)),tt=({id:e,children:t,styles:o,classes:r,...s})=>v.createElement(a,{as:"main",id:e,styles:o,...s,className:r},t),ot=({id:e,classes:t,children:o,styles:r={},...s})=>v.createElement(a,{as:"footer",id:e,className:t,styles:r,...s},v.createElement(a,{as:"section"},o||"Copyright \xA9 2022")),rt=({id:e,children:t,styles:o={},classes:r,...s})=>v.createElement(a,{as:"aside",id:e,styles:o,className:r,...s},v.createElement(a,{as:"section"},t)),st=({id:e,children:t,styles:o,classes:r,...s})=>v.createElement(a,{as:"section",id:e,styles:o,className:r,...s},t),nt=({id:e,children:t,styles:o,classes:r,...s})=>v.createElement(a,{as:"article",id:e,styles:o,className:r,...s},t),lt=({id:e,children:t,legend:o,description:r,descriptionId:s,styles:l,classes:a$1,...i})=>{let p=s||(r?`${e}-desc`:void 0);return v.createElement(a,{as:"fieldset",id:e,styles:l,className:a$1,"aria-describedby":p,...i},o&&v.createElement(a,{as:"legend"},o),r&&v.createElement("p",{id:p,className:"fieldset-description"},r),t)};S.displayName="Landmarks";S.Header=et;S.Main=tt;S.Footer=ot;S.Aside=rt;S.Section=st;S.Article=nt;S.Fieldset=lt;var pe=v.forwardRef(({padding:e,paddingInline:t,paddingBlock:o,margin:r,marginInline:s,marginBlock:l,width:a$1,maxWidth:i,radius:p,as:d="div",className:m,classes:c,children:g,...h},P)=>{let x=[];e&&x.push(`box-padding-${e}`),t&&x.push(`box-padding-inline-${t}`),o&&x.push(`box-padding-block-${o}`),r&&x.push(`box-margin-${r}`),s&&x.push(`box-margin-inline-${s}`),l&&x.push(`box-margin-block-${l}`),a$1&&x.push(`box-width-${a$1}`),i&&x.push(`box-max-width-${i}`),p&&x.push(`box-radius-${p}`);let y=[...x,m,c].filter(Boolean).join(" ");return v.createElement(a,{as:d,ref:P,classes:y||void 0,...h},g)});pe.displayName="Box";var fe=v.forwardRef(({gap:e,direction:t="vertical",align:o,justify:r,wrap:s,as:l="div",className:a$1,classes:i,children:p,...d},m)=>{let c=["stack"];t==="horizontal"?c.push("stack-horizontal"):c.push("stack-vertical"),e&&c.push(`stack-gap-${e}`),o&&c.push(`stack-align-${o}`),r&&c.push(`stack-justify-${r}`),s&&c.push(`stack-${s}`);let g=[...c,a$1,i].filter(Boolean).join(" ");return v.createElement(a,{as:l,ref:m,classes:g,...d},p)});fe.displayName="Stack";var de=v.forwardRef(({gap:e,justify:t,align:o,as:r="div",className:s,classes:l,children:a$1,...i},p)=>{let d=["cluster"];e&&d.push(`cluster-gap-${e}`),t&&d.push(`cluster-justify-${t}`),o&&d.push(`cluster-align-${o}`);let m=[...d,s,l].filter(Boolean).join(" ");return v.createElement(a,{as:r,ref:p,classes:m,...i},a$1)});de.displayName="Cluster";var ue=v.forwardRef(({columns:e,auto:t,minColumnWidth:o,gap:r,gapX:s,gapY:l,justifyItems:a$1,alignItems:i,as:p="div",className:d,classes:m,children:c,style:g,styles:h,...P},x)=>{let y=["grid"];e&&y.push(`grid-cols-${e}`),t&&y.push(`grid-auto-${t}`),r&&y.push(`grid-gap-${r}`),s&&y.push(`grid-gap-x-${s}`),l&&y.push(`grid-gap-y-${l}`),a$1&&y.push(`grid-justify-items-${a$1}`),i&&y.push(`grid-align-items-${i}`);let I=[...y,d,m].filter(Boolean).join(" "),u={...g||{},...h||{}};return t&&o&&(u.gridTemplateColumns=`repeat(auto-${t}, minmax(${o}, 1fr))`),v.createElement(a,{as:p,ref:x,classes:I,style:Object.keys(u).length>0?u:void 0,...P},c)});ue.displayName="Grid";var X=v.forwardRef(({span:e,rowSpan:t,as:o="div",className:r,classes:s,children:l,...a$1},i)=>{let p=[];e&&p.push(`grid-col-span-${e}`),t&&p.push(`grid-row-span-${t}`);let d=[...p,r,s].filter(Boolean).join(" ");return v.createElement(a,{as:o,ref:i,classes:d,...a$1},l)});X.displayName="GridItem";var xe=ue;xe.Item=X;var at=xe;var ge=v.forwardRef(({gap:e,justify:t,align:o,wrap:r,alwaysProportional:s=!1,as:l="div",className:a$1,classes:i,children:p,...d},m)=>{process.env.NODE_ENV==="development"&&s&&console.warn('[fpkit] Row: alwaysProportional is deprecated and will be removed in v5.0.0. Use responsive column utilities instead: className="col-sm-6 col-md-4"');let c=["col-row"];e&&c.push(`col-row-gap-${e}`),t&&c.push(`col-row-justify-${t}`),o&&c.push(`col-row-align-${o}`),r&&r!=="wrap"&&c.push(`col-row-${r}`),s&&c.push("col-row-proportional");let g=[...c,a$1,i].filter(Boolean).join(" ");return v.createElement(a,{as:l,ref:m,classes:g,...d},p)});ge.displayName="Row";var Ie=v.forwardRef(({span:e,offset:t,order:o,auto:r=!1,as:s="div",className:l,classes:a$1,children:i,...p},d)=>{let m=[];r?m.push("col-auto"):e==="flex"?m.push("col-flex"):e&&m.push(`col-${e}`),t!==void 0&&m.push(`col-offset-${t}`),o!==void 0&&m.push(`col-order-${o}`);let c=[...m,l,a$1].filter(Boolean).join(" ");return v.createElement(a,{as:s,ref:d,classes:c,...p},i)});Ie.displayName="Col";var U=(e,t="")=>{let o=[];if(e.direction){let r={row:"flex-row","row-reverse":"flex-row-reverse",column:"flex-col","column-reverse":"flex-col-reverse"};o.push(`${t}${r[e.direction]}`);}if(e.wrap){let r={wrap:"flex-wrap",nowrap:"flex-nowrap","wrap-reverse":"flex-wrap-reverse"};o.push(`${t}${r[e.wrap]}`);}if(e.gap&&o.push(`${t}gap-${e.gap}`),e.rowGap&&o.push(`${t}row-gap-${e.rowGap}`),e.colGap&&o.push(`${t}col-gap-${e.colGap}`),e.justify){let r={start:"justify-start",end:"justify-end",center:"justify-center",between:"justify-between",around:"justify-around",evenly:"justify-evenly"};o.push(`${t}${r[e.justify]}`);}if(e.align){let r={start:"items-start",end:"items-end",center:"items-center",baseline:"items-baseline",stretch:"items-stretch"};o.push(`${t}${r[e.align]}`);}if(e.alignContent){let r={start:"content-start",end:"content-end",center:"content-center",between:"content-between",around:"content-around",evenly:"content-evenly",stretch:"content-stretch"};o.push(`${t}${r[e.alignContent]}`);}return o},Pe=v.forwardRef((e,t)=>{let{variant:o,inline:r=!1,as:s="div",className:l="",styles:a$1,children:i,sm:p,md:d,lg:m,xl:c,direction:g,wrap:h,gap:P,rowGap:x,colGap:y,justify:I,align:u,alignContent:f,...$}=e,b=[];if(b.push(r?"flex-inline":"flex"),o){let M={center:"flex-center",between:"flex-between",around:"flex-around",stack:"flex-stack",spread:"flex-spread"};b.push(M[o]);}b.push(...U({direction:g,wrap:h,gap:P,rowGap:x,colGap:y,justify:I,align:u,alignContent:f})),p&&b.push(...U(p,"sm:")),d&&b.push(...U(d,"md:")),m&&b.push(...U(m,"lg:")),c&&b.push(...U(c,"xl:"));let w=[...b,l].filter(Boolean).join(" ");return v.createElement(a,{as:s,ref:t,classes:w,styles:a$1,...$},i)});Pe.displayName="Flex";var be=v.forwardRef((e,t)=>{let{grow:o,shrink:r,basis:s,flex:l,alignSelf:a$1,order:i,as:p="div",className:d="",styles:m,children:c,sm:g,md:h,lg:P,xl:x,...y}=e,I=[];if(l){let f={1:"flex-1",auto:"flex-auto",initial:"flex-initial",none:"flex-none"};I.push(f[l]);}if(o!==void 0&&I.push(`flex-grow-${o}`),r!==void 0&&I.push(`flex-shrink-${r}`),s){let f={auto:"flex-basis-auto",0:"flex-basis-0",full:"flex-basis-full"};I.push(f[s]);}if(a$1){let f={auto:"self-auto",start:"self-start",end:"self-end",center:"self-center",baseline:"self-baseline",stretch:"self-stretch"};I.push(f[a$1]);}if(i){let f={first:"order-first",last:"order-last",none:"order-none"};I.push(f[i]);}if(g?.flex){let f={1:"flex-1",auto:"flex-auto",none:"flex-none"};I.push(`sm:${f[g.flex]}`);}if(h?.flex){let f={1:"flex-1",auto:"flex-auto",none:"flex-none"};I.push(`md:${f[h.flex]}`);}if(P?.flex){let f={1:"flex-1",auto:"flex-auto",none:"flex-none"};I.push(`lg:${f[P.flex]}`);}if(x?.flex){let f={1:"flex-1",auto:"flex-auto",none:"flex-none"};I.push(`xl:${f[x.flex]}`);}let u=[...I,d].filter(Boolean).join(" ");return v.createElement(a,{as:p,ref:t,classes:u,styles:m,...y},c)});be.displayName="Flex.Item";var ve=v.forwardRef((e,t)=>{let{as:o="div",className:r="",styles:s,...l}=e,a$1=["flex-1",r].filter(Boolean).join(" ");return v.createElement(a,{as:o,ref:t,classes:a$1,styles:s,...l})});ve.displayName="Flex.Spacer";var Q=Pe;Q.Item=be;Q.Spacer=ve;var it=Q;var we=({id:e,styles:t,classes:o,children:r,variant:s,...l})=>v.createElement(a,{as:"sup",id:e,styles:t,className:o,"data-badge":s||void 0,role:"status",...l},v.createElement(a,{as:"span"},r));we.displayName="Badge";var ct=({elm:e="span",role:t="note",variant:o,children:r,styles:s,...l})=>v.createElement(a,{as:e,role:t,"data-tag":o||void 0,styles:s,...l},r);ct.displayName="Tag";var ft=v.forwardRef(({summary:e,icon:t,styles:o,classes:r,ariaLabel:s,name:l,open:a$1,onPointerDown:i,onToggle:p,children:d,...m},c)=>{let g=useCallback(P=>{i?.(P);},[i]),h=useCallback(P=>{p?.(P);},[p]);return v.createElement(a,{as:"details",styles:o,classes:r,onToggle:h,ref:c,open:a$1,"aria-label":s,name:l,...m},v.createElement(a,{as:"summary",onPointerDown:g},t,e),v.createElement(a,{as:"section"},d))});ft.displayName="Details";
+      <rect width="${d}" height="${f}" fill="url(#grad-${d}-${f})"/>
+      <circle cx="${d*.15}" cy="${f*.2}" r="${Math.min(d,f)*.08}" fill="rgba(255,255,255,0.2)"/>
+      <path d="M0,${f*.75} Q${d*.25},${f*.65} ${d*.5},${f*.75} T${d},${f*.75} L${d},${f} L0,${f} Z" fill="rgba(0,0,0,0.15)"/>
+      <text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle" font-family="system-ui,-apple-system,sans-serif" font-size="${Math.max(16,Math.min(d,f)*.05)}" font-weight="500" fill="rgba(255,255,255,0.9)">${d}\xD7${f}</text>
+    </svg>`;return `data:image/svg+xml,${encodeURIComponent($)}`},[o,s]),x=a$1??I;return b.createElement(a,{as:"img",src:e,alt:t,width:o,height:s||"auto",loading:l,style:r,srcSet:u,sizes:m,onError:d=>{c&&c(d),d.defaultPrevented||d.currentTarget.src!==x&&(d.currentTarget.src=x);},onLoad:d=>{y?.(d);},decoding:p,...h,...i&&{fetchpriority:i}})};re.displayName="Img";var le=({isAlertDialog:e=!1,onClose:t,dialogTitle:o,dialogLabel:s,btnLabel:r="Open Dialog",btnSize:l="sm",btnOnClick:a,children:i,onConfirm:p,confirmLabel:u="Confirm",cancelLabel:m="Cancel",className:c$1,hideFooter:y=!1,btnProps:h,icon:I,size:x,position:g,closeIconSize:P})=>{let[d,f]=useState(!1),$=useRef(null),v=useCallback(N=>{f(N),!N&&t&&t();},[t]),C=useCallback(()=>{$.current=document.activeElement,f(!0),a&&a();},[a]);useEffect(()=>{if(!d&&$.current){let N=setTimeout(()=>{$.current?.focus();},100);return ()=>clearTimeout(N)}},[d]);let S={type:"button",onClick:C,"aria-haspopup":"dialog",...h};return b.createElement(b.Fragment,null,I?b.createElement(a$2,{icon:I,"aria-label":r,label:r,size:l,...S}):b.createElement(b$1,{"data-btn":l,...S},r),b.createElement(c,{isOpen:d,onOpenChange:v,dialogTitle:o,dialogLabel:s,className:c$1,isAlertDialog:e,onConfirm:p,confirmLabel:u,cancelLabel:m,hideFooter:y,size:x,position:g,closeIconSize:P},i))};le.displayName="DialogModal";var k=e=>b.createElement(b.Fragment,null,e),Ze=({id:e,children:t,headerBackground:o,styles:s,classes:r,...l})=>b.createElement(a,{as:"header",id:e,styles:s,className:r,...l},o,b.createElement(a,{as:"section"},t)),et=({id:e,children:t,styles:o,classes:s,...r})=>b.createElement(a,{as:"main",id:e,styles:o,...r,className:s},t),tt=({id:e,classes:t,children:o,styles:s={},...r})=>b.createElement(a,{as:"footer",id:e,className:t,styles:s,...r},b.createElement(a,{as:"section"},o||"Copyright \xA9 2022")),ot=({id:e,children:t,styles:o={},classes:s,...r})=>b.createElement(a,{as:"aside",id:e,styles:o,className:s,...r},b.createElement(a,{as:"section"},t)),st=({id:e,children:t,styles:o,classes:s,...r})=>b.createElement(a,{as:"section",id:e,styles:o,className:s,...r},t),rt=({id:e,children:t,styles:o,classes:s,...r})=>b.createElement(a,{as:"article",id:e,styles:o,className:s,...r},t),nt=({id:e,children:t,legend:o,description:s,descriptionId:r,styles:l,classes:a$1,...i})=>{let p=r||(s?`${e}-desc`:void 0);return b.createElement(a,{as:"fieldset",id:e,styles:l,className:a$1,"aria-describedby":p,...i},o&&b.createElement(a,{as:"legend"},o),s&&b.createElement("p",{id:p,className:"fieldset-description"},s),t)};k.displayName="Landmarks";k.Header=Ze;k.Main=et;k.Footer=tt;k.Aside=ot;k.Section=st;k.Article=rt;k.Fieldset=nt;var ie=b.forwardRef(({padding:e,paddingInline:t,paddingBlock:o,margin:s,marginInline:r,marginBlock:l,width:a$1,maxWidth:i,radius:p,as:u="div",className:m,classes:c,children:y,...h},I)=>{let x=[];e&&x.push(`box-padding-${e}`),t&&x.push(`box-padding-inline-${t}`),o&&x.push(`box-padding-block-${o}`),s&&x.push(`box-margin-${s}`),r&&x.push(`box-margin-inline-${r}`),l&&x.push(`box-margin-block-${l}`),a$1&&x.push(`box-width-${a$1}`),i&&x.push(`box-max-width-${i}`),p&&x.push(`box-radius-${p}`);let g=[...x,m,c].filter(Boolean).join(" ");return b.createElement(a,{as:u,ref:I,classes:g||void 0,...h},y)});ie.displayName="Box";var ce=b.forwardRef(({gap:e,direction:t="vertical",align:o,justify:s,wrap:r,as:l="div",className:a$1,classes:i,children:p,...u},m)=>{let c=["stack"];t==="horizontal"?c.push("stack-horizontal"):c.push("stack-vertical"),e&&c.push(`stack-gap-${e}`),o&&c.push(`stack-align-${o}`),s&&c.push(`stack-justify-${s}`),r&&c.push(`stack-${r}`);let y=[...c,a$1,i].filter(Boolean).join(" ");return b.createElement(a,{as:l,ref:m,classes:y,...u},p)});ce.displayName="Stack";var me=b.forwardRef(({gap:e,justify:t,align:o,as:s="div",className:r,classes:l,children:a$1,...i},p)=>{let u=["cluster"];e&&u.push(`cluster-gap-${e}`),t&&u.push(`cluster-justify-${t}`),o&&u.push(`cluster-align-${o}`);let m=[...u,r,l].filter(Boolean).join(" ");return b.createElement(a,{as:s,ref:p,classes:m,...i},a$1)});me.displayName="Cluster";var de=b.forwardRef(({columns:e,auto:t,minColumnWidth:o,gap:s,gapX:r,gapY:l,justifyItems:a$1,alignItems:i,as:p="div",className:u,classes:m,children:c,style:y,styles:h,...I},x)=>{let g=["grid"];e&&g.push(`grid-cols-${e}`),t&&g.push(`grid-auto-${t}`),s&&g.push(`grid-gap-${s}`),r&&g.push(`grid-gap-x-${r}`),l&&g.push(`grid-gap-y-${l}`),a$1&&g.push(`grid-justify-items-${a$1}`),i&&g.push(`grid-align-items-${i}`);let P=[...g,u,m].filter(Boolean).join(" "),d={...y||{},...h||{}};return t&&o&&(d.gridTemplateColumns=`repeat(auto-${t}, minmax(${o}, 1fr))`),b.createElement(a,{as:p,ref:x,classes:P,style:Object.keys(d).length>0?d:void 0,...I},c)});de.displayName="Grid";var X=b.forwardRef(({span:e,rowSpan:t,as:o="div",className:s,classes:r,children:l,...a$1},i)=>{let p=[];e&&p.push(`grid-col-span-${e}`),t&&p.push(`grid-row-span-${t}`);let u=[...p,s,r].filter(Boolean).join(" ");return b.createElement(a,{as:o,ref:i,classes:u,...a$1},l)});X.displayName="GridItem";var ue=de;ue.Item=X;var lt=ue;var ye=b.forwardRef(({gap:e,justify:t,align:o,wrap:s,alwaysProportional:r=!1,as:l="div",className:a$1,classes:i,children:p,...u},m)=>{process.env.NODE_ENV==="development"&&r&&console.warn('[fpkit] Row: alwaysProportional is deprecated and will be removed in v5.0.0. Use responsive column utilities instead: className="col-sm-6 col-md-4"');let c=["col-row"];e&&c.push(`col-row-gap-${e}`),t&&c.push(`col-row-justify-${t}`),o&&c.push(`col-row-align-${o}`),s&&s!=="wrap"&&c.push(`col-row-${s}`),r&&c.push("col-row-proportional");let y=[...c,a$1,i].filter(Boolean).join(" ");return b.createElement(a,{as:l,ref:m,classes:y,...u},p)});ye.displayName="Row";var he=b.forwardRef(({span:e,offset:t,order:o,auto:s=!1,as:r="div",className:l,classes:a$1,children:i,...p},u)=>{let m=[];s?m.push("col-auto"):e==="flex"?m.push("col-flex"):e&&m.push(`col-${e}`),t!==void 0&&m.push(`col-offset-${t}`),o!==void 0&&m.push(`col-order-${o}`);let c=[...m,l,a$1].filter(Boolean).join(" ");return b.createElement(a,{as:r,ref:u,classes:c,...p},i)});he.displayName="Col";var L=(e,t="")=>{let o=[];if(e.direction){let s={row:"flex-row","row-reverse":"flex-row-reverse",column:"flex-col","column-reverse":"flex-col-reverse"};o.push(`${t}${s[e.direction]}`);}if(e.wrap){let s={wrap:"flex-wrap",nowrap:"flex-nowrap","wrap-reverse":"flex-wrap-reverse"};o.push(`${t}${s[e.wrap]}`);}if(e.gap&&o.push(`${t}gap-${e.gap}`),e.rowGap&&o.push(`${t}row-gap-${e.rowGap}`),e.colGap&&o.push(`${t}col-gap-${e.colGap}`),e.justify){let s={start:"justify-start",end:"justify-end",center:"justify-center",between:"justify-between",around:"justify-around",evenly:"justify-evenly"};o.push(`${t}${s[e.justify]}`);}if(e.align){let s={start:"items-start",end:"items-end",center:"items-center",baseline:"items-baseline",stretch:"items-stretch"};o.push(`${t}${s[e.align]}`);}if(e.alignContent){let s={start:"content-start",end:"content-end",center:"content-center",between:"content-between",around:"content-around",evenly:"content-evenly",stretch:"content-stretch"};o.push(`${t}${s[e.alignContent]}`);}return o},Ie=b.forwardRef((e,t)=>{let{variant:o,inline:s=!1,as:r="div",className:l="",styles:a$1,children:i,sm:p,md:u,lg:m,xl:c,direction:y,wrap:h,gap:I,rowGap:x,colGap:g,justify:P,align:d,alignContent:f,...$}=e,v=[];if(v.push(s?"flex-inline":"flex"),o){let S={center:"flex-center",between:"flex-between",around:"flex-around",stack:"flex-stack",spread:"flex-spread"};v.push(S[o]);}v.push(...L({direction:y,wrap:h,gap:I,rowGap:x,colGap:g,justify:P,align:d,alignContent:f})),p&&v.push(...L(p,"sm:")),u&&v.push(...L(u,"md:")),m&&v.push(...L(m,"lg:")),c&&v.push(...L(c,"xl:"));let C=[...v,l].filter(Boolean).join(" ");return b.createElement(a,{as:r,ref:t,classes:C,styles:a$1,...$},i)});Ie.displayName="Flex";var Pe=b.forwardRef((e,t)=>{let{grow:o,shrink:s,basis:r,flex:l,alignSelf:a$1,order:i,as:p="div",className:u="",styles:m,children:c,sm:y,md:h,lg:I,xl:x,...g}=e,P=[];if(l){let f={1:"flex-1",auto:"flex-auto",initial:"flex-initial",none:"flex-none"};P.push(f[l]);}if(o!==void 0&&P.push(`flex-grow-${o}`),s!==void 0&&P.push(`flex-shrink-${s}`),r){let f={auto:"flex-basis-auto",0:"flex-basis-0",full:"flex-basis-full"};P.push(f[r]);}if(a$1){let f={auto:"self-auto",start:"self-start",end:"self-end",center:"self-center",baseline:"self-baseline",stretch:"self-stretch"};P.push(f[a$1]);}if(i){let f={first:"order-first",last:"order-last",none:"order-none"};P.push(f[i]);}if(y?.flex){let f={1:"flex-1",auto:"flex-auto",none:"flex-none"};P.push(`sm:${f[y.flex]}`);}if(h?.flex){let f={1:"flex-1",auto:"flex-auto",none:"flex-none"};P.push(`md:${f[h.flex]}`);}if(I?.flex){let f={1:"flex-1",auto:"flex-auto",none:"flex-none"};P.push(`lg:${f[I.flex]}`);}if(x?.flex){let f={1:"flex-1",auto:"flex-auto",none:"flex-none"};P.push(`xl:${f[x.flex]}`);}let d=[...P,u].filter(Boolean).join(" ");return b.createElement(a,{as:p,ref:t,classes:d,styles:m,...g},c)});Pe.displayName="Flex.Item";var ve=b.forwardRef((e,t)=>{let{as:o="div",className:s="",styles:r,...l}=e,a$1=["flex-1",s].filter(Boolean).join(" ");return b.createElement(a,{as:o,ref:t,classes:a$1,styles:r,...l})});ve.displayName="Flex.Spacer";var Q=Ie;Q.Item=Pe;Q.Spacer=ve;var at=Q;var Ce=({id:e,styles:t,classes:o,children:s,variant:r,...l})=>b.createElement(a,{as:"sup",id:e,styles:t,className:o,"data-badge":r||void 0,role:"status",...l},b.createElement(a,{as:"span"},s));Ce.displayName="Badge";var pt=({elm:e="span",role:t="note",variant:o,children:s,styles:r,...l})=>b.createElement(a,{as:e,role:t,"data-tag":o||void 0,styles:r,...l},s);pt.displayName="Tag";var ct=b.forwardRef(({summary:e,icon:t,styles:o,classes:s,ariaLabel:r,name:l,open:a$1,onPointerDown:i,onToggle:p,children:u,...m},c)=>{let y=useCallback(I=>{i?.(I);},[i]),h=useCallback(I=>{p?.(I);},[p]);return b.createElement(a,{as:"details",styles:o,classes:s,onToggle:h,ref:c,open:a$1,"aria-label":r,name:l,...m},b.createElement(a,{as:"summary",onPointerDown:y},t,e),b.createElement(a,{as:"section"},u))});ct.displayName="Details";
 
-export { re as Alert, nt as Article, rt as Aside, we as Badge, pe as Box, se as Checkbox, de as Cluster, Ie as Col, ft as Details, ae as DialogModal, lt as Fieldset, it as Flex, ot as Footer, at as Grid, X as GridItem, et as Header, L as IconButton, ne as Img, S as Landmarks, tt as Main, ge as Row, st as Section, fe as Stack, ct as Tag };
+export { oe as Alert, rt as Article, ot as Aside, Ce as Badge, ie as Box, se as Checkbox, me as Cluster, he as Col, ct as Details, le as DialogModal, nt as Fieldset, at as Flex, tt as Footer, lt as Grid, X as GridItem, Ze as Header, re as Img, k as Landmarks, et as Main, ye as Row, st as Section, ce as Stack, pt as Tag };
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.js.map