@soyfri/shared-library 2.0.0-beta.2 → 2.0.0-beta.21

package/storybook-static/assets/Button.stories-F20dmnjq.js

@@ -0,0 +1,320 @@
+import{j as y}from"./jsx-runtime-D_zvdyIk.js";import{B as v}from"./Button-D9h7OggD.js";import{N as b}from"./Notifications-DY_A-Sho.js";import"./Button-DBpqmVB_.js";import"./iframe-BAJnc_4n.js";import"./preload-helper-PPVm8Dsz.js";import"./DefaultPropsProvider-BGoQxtDa.js";import"./createSimplePaletteValueFilter-bm0fmN_7.js";import"./useId-b4fZxjOL.js";import"./ButtonBase-qyaMEhe4.js";import"./useTimeout-DNjRaOWc.js";import"./emotion-react.browser.esm--g-C9cX9.js";import"./useForkRef-0ANIrxcF.js";import"./isFocusVisible-B8k4qzLc.js";import"./CircularProgress-DC7ZNWwl.js";import"./createSvgIcon-D_Gca4vA.js";const h=`
+<Button variant="text">
+  Button
+</Button>
+`,D=`
+<Button variant="outlined">
+  Button
+</Button>
+`,I=`
+<Button variant="contained">
+  Button
+</Button>
+`,T=`
+<Button
+  data-testid="button"
+  startIcon={<NotificationsIcon/>}
+  variant="contained"
+>
+  Button
+</Button>
+`,x=`
+<Button
+  data-testid="button"
+  endIcon={<NotificationsIcon/>}
+  variant="contained"
+>
+  Button
+</Button>
+`,f=`
+<Button
+  data-testid="button"
+  size="small"
+  variant="contained"
+>
+  Button
+</Button>
+`,S=`
+<Button
+  data-testid="button"
+  size="large"
+  variant="contained"
+>
+  Button
+</Button>
+`,E=`
+<Button
+  data-testid="button"
+  disabled
+  variant="contained"
+>
+  Button
+</Button>`,w=`
+<Button
+  data-testid="button"
+  loading
+  variant="contained"
+>
+  Button
+</Button>
+`,L=`
+<Button
+  data-testid="button"
+  loading
+  loadingPosition="start"
+  variant="contained"
+>
+  Button
+</Button>
+`,W=`
+<Button
+  data-testid="button"
+  loading
+  loadingPosition="end"
+  variant="contained"
+>
+  Button
+</Button>`,{expect:e,within:n}=__STORYBOOK_MODULE_TEST__,G={title:"Components/Button",component:v,parameters:{layout:"centered"},tags:["autodocs"]},i={args:{children:"Button",variant:"text"},parameters:{docs:{description:{story:'Boton con el texto "Button" y el estilo "default".'},source:{code:h.trim()}}}},s={args:{children:"Button",variant:"outlined"},parameters:{docs:{description:{story:'Boton con el texto "Button" y el estilo "outlined".'},source:{code:D.trim()}}}},c={args:{children:"Button",variant:"contained"},parameters:{docs:{description:{story:'Boton con el texto "Button" y el estilo "contained".'},source:{code:I.trim()}}}},r={args:{children:"Button",variant:"contained",startIcon:y.jsx(b,{}),"data-testid":"button"},parameters:{docs:{description:{story:'Boton con el texto "Button", el estilo "contained" y un icono al inicio.'},source:{code:T.trim()}}},play:async({canvasElement:o})=>{const t=n(o).getByTestId("button");e(n(t).getByText("Button")).toBeInTheDocument()}},d={args:{children:"Button",variant:"contained",endIcon:y.jsx(b,{}),"data-testid":"button"},parameters:{docs:{description:{story:'Boton con el texto "Button", el estilo "contained" y un icono al final.'},source:{code:x.trim()}}},play:async({canvasElement:o})=>{const t=n(o).getByTestId("button");e(n(t).getByText("Button")).toBeInTheDocument()}},u={args:{children:"Button",variant:"contained",size:"small","data-testid":"button"},parameters:{docs:{description:{story:'Boton tamaño "small".'},source:{code:f.trim()}}},play:async({canvasElement:o})=>{const t=n(o).getByTestId("button");e(n(t).getByText("Button")).toBeInTheDocument()}},B={args:{children:"Button",variant:"contained",size:"large","data-testid":"button"},parameters:{docs:{description:{story:'Boton tamaño "large".'},source:{code:S.trim()}}},play:async({canvasElement:o})=>{const t=n(o).getByTestId("button");e(n(t).getByText("Button")).toBeInTheDocument()}},l={args:{children:"Button",variant:"contained","data-testid":"button",disabled:!0},parameters:{docs:{description:{story:"Boton deshabilitado."},source:{code:E.trim()}}},play:async({canvasElement:o})=>{const t=n(o).getByTestId("button");e(n(t).getByText("Button")).toBeInTheDocument(),e(t).toBeDisabled()}},m={args:{children:"Button",variant:"contained",loading:!0,"data-testid":"button"},parameters:{docs:{description:{story:"Boton con loader."},source:{code:w.trim()}}},play:async({canvasElement:o})=>{const t=n(o).getByTestId("button");e(n(t).getByText("Button")).toBeInTheDocument(),e(t).toBeDisabled()}},p={args:{children:"Button",variant:"contained",loading:!0,loadingPosition:"start","data-testid":"button"},parameters:{docs:{description:{story:"Boton con al inicio loader."},source:{code:L.trim()}}},play:async({canvasElement:o})=>{const t=n(o).getByTestId("button");e(n(t).getByText("Button")).toBeInTheDocument(),e(t).toBeDisabled()}},g={args:{children:"Button",variant:"contained",loading:!0,loadingPosition:"end","data-testid":"button"},parameters:{docs:{description:{story:"Boton con al inicio loader."},source:{code:W.trim()}}},play:async({canvasElement:o})=>{const t=n(o).getByTestId("button");e(n(t).getByText("Button")).toBeInTheDocument(),e(t).toBeDisabled()}};i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "text"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton con el texto \\"Button\\" y el estilo \\"default\\"."
+      },
+      source: {
+        code: DefaultButtonDefinition.trim()
+      }
+    }
+  }
+}`,...i.parameters?.docs?.source}}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "outlined"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton con el texto \\"Button\\" y el estilo \\"outlined\\"."
+      },
+      source: {
+        code: OutlinedButtonDefinition.trim()
+      }
+    }
+  }
+}`,...s.parameters?.docs?.source}}};c.parameters={...c.parameters,docs:{...c.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "contained"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton con el texto \\"Button\\" y el estilo \\"contained\\"."
+      },
+      source: {
+        code: ContainedButtonDefinition.trim()
+      }
+    }
+  }
+}`,...c.parameters?.docs?.source}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "contained",
+    startIcon: <NotificationsIcon />,
+    "data-testid": "button"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton con el texto \\"Button\\", el estilo \\"contained\\" y un icono al inicio."
+      },
+      source: {
+        code: WithStartIconButtonDefinition.trim()
+      }
+    }
+  },
+  play: async ({
+    canvasElement
+  }) => {
+    const canvas = within(canvasElement);
+    const button = canvas.getByTestId("button");
+    expect(within(button).getByText("Button")).toBeInTheDocument();
+  }
+}`,...r.parameters?.docs?.source}}};d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "contained",
+    endIcon: <NotificationsIcon />,
+    "data-testid": "button"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton con el texto \\"Button\\", el estilo \\"contained\\" y un icono al final."
+      },
+      source: {
+        code: WithEndIconButtonDefinition.trim()
+      }
+    }
+  },
+  play: async ({
+    canvasElement
+  }) => {
+    const canvas = within(canvasElement);
+    const button = canvas.getByTestId("button");
+    expect(within(button).getByText("Button")).toBeInTheDocument();
+  }
+}`,...d.parameters?.docs?.source}}};u.parameters={...u.parameters,docs:{...u.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "contained",
+    size: "small",
+    "data-testid": "button"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton tamaño \\"small\\"."
+      },
+      source: {
+        code: WithSmallSizeButtonDefinition.trim()
+      }
+    }
+  },
+  play: async ({
+    canvasElement
+  }) => {
+    const canvas = within(canvasElement);
+    const button = canvas.getByTestId("button");
+    expect(within(button).getByText("Button")).toBeInTheDocument();
+  }
+}`,...u.parameters?.docs?.source}}};B.parameters={...B.parameters,docs:{...B.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "contained",
+    size: "large",
+    "data-testid": "button"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton tamaño \\"large\\"."
+      },
+      source: {
+        code: WithLargeSizeButtonDefinition.trim()
+      }
+    }
+  },
+  play: async ({
+    canvasElement
+  }) => {
+    const canvas = within(canvasElement);
+    const button = canvas.getByTestId("button");
+    expect(within(button).getByText("Button")).toBeInTheDocument();
+  }
+}`,...B.parameters?.docs?.source}}};l.parameters={...l.parameters,docs:{...l.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "contained",
+    "data-testid": "button",
+    disabled: true
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton deshabilitado."
+      },
+      source: {
+        code: DisabledStateButtonDefinition.trim()
+      }
+    }
+  },
+  play: async ({
+    canvasElement
+  }) => {
+    const canvas = within(canvasElement);
+    const button = canvas.getByTestId("button");
+    expect(within(button).getByText("Button")).toBeInTheDocument();
+    expect(button).toBeDisabled();
+  }
+}`,...l.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "contained",
+    loading: true,
+    "data-testid": "button"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton con loader."
+      },
+      source: {
+        code: LoadingButtonDefinition.trim()
+      }
+    }
+  },
+  play: async ({
+    canvasElement
+  }) => {
+    const canvas = within(canvasElement);
+    const button = canvas.getByTestId("button");
+    expect(within(button).getByText("Button")).toBeInTheDocument();
+    expect(button).toBeDisabled();
+  }
+}`,...m.parameters?.docs?.source}}};p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "contained",
+    loading: true,
+    loadingPosition: "start",
+    "data-testid": "button"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton con al inicio loader."
+      },
+      source: {
+        code: LoadingIndicatorStartButtonDefinition.trim()
+      }
+    }
+  },
+  play: async ({
+    canvasElement
+  }) => {
+    const canvas = within(canvasElement);
+    const button = canvas.getByTestId("button");
+    expect(within(button).getByText("Button")).toBeInTheDocument();
+    expect(button).toBeDisabled();
+  }
+}`,...p.parameters?.docs?.source}}};g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: "Button",
+    variant: "contained",
+    loading: true,
+    loadingPosition: "end",
+    "data-testid": "button"
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Boton con al inicio loader."
+      },
+      source: {
+        code: LoadingIndicatorEndButtonDefinition.trim()
+      }
+    }
+  },
+  play: async ({
+    canvasElement
+  }) => {
+    const canvas = within(canvasElement);
+    const button = canvas.getByTestId("button");
+    expect(within(button).getByText("Button")).toBeInTheDocument();
+    expect(button).toBeDisabled();
+  }
+}`,...g.parameters?.docs?.source}}};const H=["Default","Outlined","Contained","WithStartIcon","WithEndIcon","WithSmallSize","WithLargeSize","Disabled","Loading","LoadingStart","LoadingEnd"];export{c as Contained,i as Default,l as Disabled,m as Loading,g as LoadingEnd,p as LoadingStart,s as Outlined,d as WithEndIcon,B as WithLargeSize,u as WithSmallSize,r as WithStartIcon,H as __namedExportsOrder,G as default};

package/storybook-static/assets/ButtonBase-qyaMEhe4.js

@@ -0,0 +1,74 @@
+import{r as l,R as H}from"./iframe-BAJnc_4n.js";import{_ as Te,c as y,a as re,u as ae,s as Q,g as ve,d as Pe}from"./DefaultPropsProvider-BGoQxtDa.js";import{j as N}from"./jsx-runtime-D_zvdyIk.js";import{b as Ve,_ as Be,d as oe,e as Se,c as we,u as _}from"./useTimeout-DNjRaOWc.js";import{k as Z}from"./emotion-react.browser.esm--g-C9cX9.js";import{u as ie}from"./useForkRef-0ANIrxcF.js";import{i as se}from"./isFocusVisible-B8k4qzLc.js";function De(t){if(t===void 0)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function ee(t,e){var o=function(i){return e&&l.isValidElement(i)?e(i):i},a=Object.create(null);return t&&l.Children.map(t,function(n){return n}).forEach(function(n){a[n.key]=o(n)}),a}function Le(t,e){t=t||{},e=e||{};function o(d){return d in e?e[d]:t[d]}var a=Object.create(null),n=[];for(var i in t)i in e?n.length&&(a[i]=n,n=[]):n.push(i);var s,c={};for(var u in e){if(a[u])for(s=0;s<a[u].length;s++){var p=a[u][s];c[a[u][s]]=o(p)}c[u]=o(u)}for(s=0;s<n.length;s++)c[n[s]]=o(n[s]);return c}function k(t,e,o){return o[e]!=null?o[e]:t.props[e]}function je(t,e){return ee(t.children,function(o){return l.cloneElement(o,{onExited:e.bind(null,o),in:!0,appear:k(o,"appear",t),enter:k(o,"enter",t),exit:k(o,"exit",t)})})}function ke(t,e,o){var a=ee(t.children),n=Le(e,a);return Object.keys(n).forEach(function(i){var s=n[i];if(l.isValidElement(s)){var c=i in e,u=i in a,p=e[i],d=l.isValidElement(p)&&!p.props.in;u&&(!c||d)?n[i]=l.cloneElement(s,{onExited:o.bind(null,s),in:!0,exit:k(s,"exit",t),enter:k(s,"enter",t)}):!u&&c&&!d?n[i]=l.cloneElement(s,{in:!1}):u&&c&&l.isValidElement(p)&&(n[i]=l.cloneElement(s,{onExited:o.bind(null,s),in:p.props.in,exit:k(s,"exit",t),enter:k(s,"enter",t)}))}}),n}var Ne=Object.values||function(t){return Object.keys(t).map(function(e){return t[e]})},$e={component:"div",childFactory:function(e){return e}},te=(function(t){Ve(e,t);function e(a,n){var i;i=t.call(this,a,n)||this;var s=i.handleExited.bind(De(i));return i.state={contextValue:{isMounting:!0},handleExited:s,firstRender:!0},i}var o=e.prototype;return o.componentDidMount=function(){this.mounted=!0,this.setState({contextValue:{isMounting:!1}})},o.componentWillUnmount=function(){this.mounted=!1},e.getDerivedStateFromProps=function(n,i){var s=i.children,c=i.handleExited,u=i.firstRender;return{children:u?je(n,c):ke(n,s,c),firstRender:!1}},o.handleExited=function(n,i){var s=ee(this.props.children);n.key in s||(n.props.onExited&&n.props.onExited(i),this.mounted&&this.setState(function(c){var u=Te({},c.children);return delete u[n.key],{children:u}}))},o.render=function(){var n=this.props,i=n.component,s=n.childFactory,c=Be(n,["component","childFactory"]),u=this.state.contextValue,p=Ne(this.state.children).map(s);return delete c.appear,delete c.enter,delete c.exit,i===null?H.createElement(oe.Provider,{value:u},p):H.createElement(oe.Provider,{value:u},H.createElement(i,c,p))},e})(H.Component);te.propTypes={};te.defaultProps=$e;class G{static create(){return new G}static use(){const e=Se(G.create).current,[o,a]=l.useState(!1);return e.shouldMount=o,e.setShouldMount=a,l.useEffect(e.mountEffect,[o]),e}constructor(){this.ref={current:null},this.mounted=null,this.didMount=!1,this.shouldMount=!1,this.setShouldMount=null}mount(){return this.mounted||(this.mounted=Ie(),this.shouldMount=!0,this.setShouldMount(this.shouldMount)),this.mounted}mountEffect=()=>{this.shouldMount&&!this.didMount&&this.ref.current!==null&&(this.didMount=!0,this.mounted.resolve())};start(...e){this.mount().then(()=>this.ref.current?.start(...e))}stop(...e){this.mount().then(()=>this.ref.current?.stop(...e))}pulsate(...e){this.mount().then(()=>this.ref.current?.pulsate(...e))}}function Fe(){return G.use()}function Ie(){let t,e;const o=new Promise((a,n)=>{t=a,e=n});return o.resolve=t,o.reject=e,o}function Ue(t){const{className:e,classes:o,pulsate:a=!1,rippleX:n,rippleY:i,rippleSize:s,in:c,onExited:u,timeout:p}=t,[d,h]=l.useState(!1),M=y(e,o.ripple,o.rippleVisible,a&&o.ripplePulsate),P={width:s,height:s,top:-(s/2)+i,left:-(s/2)+n},g=y(o.child,d&&o.childLeaving,a&&o.childPulsate);return!c&&!d&&h(!0),l.useEffect(()=>{if(!c&&u!=null){const w=setTimeout(u,p);return()=>{clearTimeout(w)}}},[u,c,p]),N.jsx("span",{className:M,style:P,children:N.jsx("span",{className:g})})}const b=re("MuiTouchRipple",["root","ripple","rippleVisible","ripplePulsate","child","childLeaving","childPulsate"]),J=550,ze=80,Oe=Z`
+  0% {
+    transform: scale(0);
+    opacity: 0.1;
+  }
+
+  100% {
+    transform: scale(1);
+    opacity: 0.3;
+  }
+`,Ae=Z`
+  0% {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+  }
+`,Xe=Z`
+  0% {
+    transform: scale(1);
+  }
+
+  50% {
+    transform: scale(0.92);
+  }
+
+  100% {
+    transform: scale(1);
+  }
+`,Ye=Q("span",{name:"MuiTouchRipple",slot:"Root"})({overflow:"hidden",pointerEvents:"none",position:"absolute",zIndex:0,top:0,right:0,bottom:0,left:0,borderRadius:"inherit"}),Ke=Q(Ue,{name:"MuiTouchRipple",slot:"Ripple"})`
+  opacity: 0;
+  position: absolute;
+
+  &.${b.rippleVisible} {
+    opacity: 0.3;
+    transform: scale(1);
+    animation-name: ${Oe};
+    animation-duration: ${J}ms;
+    animation-timing-function: ${({theme:t})=>t.transitions.easing.easeInOut};
+  }
+
+  &.${b.ripplePulsate} {
+    animation-duration: ${({theme:t})=>t.transitions.duration.shorter}ms;
+  }
+
+  & .${b.child} {
+    opacity: 1;
+    display: block;
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    background-color: currentColor;
+  }
+
+  & .${b.childLeaving} {
+    opacity: 0;
+    animation-name: ${Ae};
+    animation-duration: ${J}ms;
+    animation-timing-function: ${({theme:t})=>t.transitions.easing.easeInOut};
+  }
+
+  & .${b.childPulsate} {
+    position: absolute;
+    /* @noflip */
+    left: 0px;
+    top: 0;
+    animation-name: ${Xe};
+    animation-duration: 2500ms;
+    animation-timing-function: ${({theme:t})=>t.transitions.easing.easeInOut};
+    animation-iteration-count: infinite;
+    animation-delay: 200ms;
+  }
+`,We=l.forwardRef(function(e,o){const a=ae({props:e,name:"MuiTouchRipple"}),{center:n=!1,classes:i={},className:s,...c}=a,[u,p]=l.useState([]),d=l.useRef(0),h=l.useRef(null);l.useEffect(()=>{h.current&&(h.current(),h.current=null)},[u]);const M=l.useRef(!1),P=we(),g=l.useRef(null),w=l.useRef(null),C=l.useCallback(f=>{const{pulsate:E,rippleX:R,rippleY:I,rippleSize:D,cb:U}=f;p(x=>[...x,N.jsx(Ke,{classes:{ripple:y(i.ripple,b.ripple),rippleVisible:y(i.rippleVisible,b.rippleVisible),ripplePulsate:y(i.ripplePulsate,b.ripplePulsate),child:y(i.child,b.child),childLeaving:y(i.childLeaving,b.childLeaving),childPulsate:y(i.childPulsate,b.childPulsate)},timeout:J,pulsate:E,rippleX:R,rippleY:I,rippleSize:D},d.current)]),d.current+=1,h.current=U},[i]),$=l.useCallback((f={},E={},R=()=>{})=>{const{pulsate:I=!1,center:D=n||E.pulsate,fakeElement:U=!1}=E;if(f?.type==="mousedown"&&M.current){M.current=!1;return}f?.type==="touchstart"&&(M.current=!0);const x=U?null:w.current,V=x?x.getBoundingClientRect():{width:0,height:0,left:0,top:0};let B,T,S;if(D||f===void 0||f.clientX===0&&f.clientY===0||!f.clientX&&!f.touches)B=Math.round(V.width/2),T=Math.round(V.height/2);else{const{clientX:z,clientY:L}=f.touches&&f.touches.length>0?f.touches[0]:f;B=Math.round(z-V.left),T=Math.round(L-V.top)}if(D)S=Math.sqrt((2*V.width**2+V.height**2)/3),S%2===0&&(S+=1);else{const z=Math.max(Math.abs((x?x.clientWidth:0)-B),B)*2+2,L=Math.max(Math.abs((x?x.clientHeight:0)-T),T)*2+2;S=Math.sqrt(z**2+L**2)}f?.touches?g.current===null&&(g.current=()=>{C({pulsate:I,rippleX:B,rippleY:T,rippleSize:S,cb:R})},P.start(ze,()=>{g.current&&(g.current(),g.current=null)})):C({pulsate:I,rippleX:B,rippleY:T,rippleSize:S,cb:R})},[n,C,P]),Y=l.useCallback(()=>{$({},{pulsate:!0})},[$]),F=l.useCallback((f,E)=>{if(P.clear(),f?.type==="touchend"&&g.current){g.current(),g.current=null,P.start(0,()=>{F(f,E)});return}g.current=null,p(R=>R.length>0?R.slice(1):R),h.current=E},[P]);return l.useImperativeHandle(o,()=>({pulsate:Y,start:$,stop:F}),[Y,$,F]),N.jsx(Ye,{className:y(b.root,i.root,s),ref:w,...c,children:N.jsx(te,{component:null,exit:!0,children:u})})});function He(t){return ve("MuiButtonBase",t)}const _e=re("MuiButtonBase",["root","disabled","focusVisible"]),Ge=t=>{const{disabled:e,focusVisible:o,focusVisibleClassName:a,classes:n}=t,s=Pe({root:["root",e&&"disabled",o&&"focusVisible"]},He,n);return o&&a&&(s.root+=` ${a}`),s},qe=Q("button",{name:"MuiButtonBase",slot:"Root"})({display:"inline-flex",alignItems:"center",justifyContent:"center",position:"relative",boxSizing:"border-box",WebkitTapHighlightColor:"transparent",backgroundColor:"transparent",outline:0,border:0,margin:0,borderRadius:0,padding:0,cursor:"pointer",userSelect:"none",verticalAlign:"middle",MozAppearance:"none",WebkitAppearance:"none",textDecoration:"none",color:"inherit","&::-moz-focus-inner":{borderStyle:"none"},[`&.${_e.disabled}`]:{pointerEvents:"none",cursor:"default"},"@media print":{colorAdjust:"exact"}}),it=l.forwardRef(function(e,o){const a=ae({props:e,name:"MuiButtonBase"}),{action:n,centerRipple:i=!1,children:s,className:c,component:u="button",disabled:p=!1,disableRipple:d=!1,disableTouchRipple:h=!1,focusRipple:M=!1,focusVisibleClassName:P,LinkComponent:g="a",onBlur:w,onClick:C,onContextMenu:$,onDragLeave:Y,onFocus:F,onFocusVisible:f,onKeyDown:E,onKeyUp:R,onMouseDown:I,onMouseLeave:D,onMouseUp:U,onTouchEnd:x,onTouchMove:V,onTouchStart:B,tabIndex:T=0,TouchRippleProps:S,touchRippleRef:z,type:L,...O}=a,A=l.useRef(null),m=Fe(),le=ie(m.ref,z),[j,K]=l.useState(!1);p&&j&&K(!1),l.useImperativeHandle(n,()=>({focusVisible:()=>{K(!0),A.current.focus()}}),[]);const ue=m.shouldMount&&!d&&!p;l.useEffect(()=>{j&&M&&!d&&m.pulsate()},[d,M,j,m]);const ce=v(m,"start",I,h),pe=v(m,"stop",$,h),fe=v(m,"stop",Y,h),de=v(m,"stop",U,h),he=v(m,"stop",r=>{j&&r.preventDefault(),D&&D(r)},h),me=v(m,"start",B,h),ge=v(m,"stop",x,h),be=v(m,"stop",V,h),Me=v(m,"stop",r=>{se(r.target)||K(!1),w&&w(r)},!1),Re=_(r=>{A.current||(A.current=r.currentTarget),se(r.target)&&(K(!0),f&&f(r)),F&&F(r)}),q=()=>{const r=A.current;return u&&u!=="button"&&!(r.tagName==="A"&&r.href)},Ee=_(r=>{M&&!r.repeat&&j&&r.key===" "&&m.stop(r,()=>{m.start(r)}),r.target===r.currentTarget&&q()&&r.key===" "&&r.preventDefault(),E&&E(r),r.target===r.currentTarget&&q()&&r.key==="Enter"&&!p&&(r.preventDefault(),C&&C(r))}),xe=_(r=>{M&&r.key===" "&&j&&!r.defaultPrevented&&m.stop(r,()=>{m.pulsate(r)}),R&&R(r),C&&r.target===r.currentTarget&&q()&&r.key===" "&&!r.defaultPrevented&&C(r)});let W=u;W==="button"&&(O.href||O.to)&&(W=g);const X={};W==="button"?(X.type=L===void 0?"button":L,X.disabled=p):(!O.href&&!O.to&&(X.role="button"),p&&(X["aria-disabled"]=p));const ye=ie(o,A),ne={...a,centerRipple:i,component:u,disabled:p,disableRipple:d,disableTouchRipple:h,focusRipple:M,tabIndex:T,focusVisible:j},Ce=Ge(ne);return N.jsxs(qe,{as:W,className:y(Ce.root,c),ownerState:ne,onBlur:Me,onClick:C,onContextMenu:pe,onFocus:Re,onKeyDown:Ee,onKeyUp:xe,onMouseDown:ce,onMouseLeave:he,onMouseUp:de,onDragLeave:fe,onTouchEnd:ge,onTouchMove:be,onTouchStart:me,ref:ye,tabIndex:p?-1:T,type:L,...X,...O,children:[s,ue?N.jsx(We,{ref:le,center:i,...S}):null]})});function v(t,e,o,a=!1){return _(n=>(o&&o(n),a||t[e](n),!0))}export{it as B,te as T};

package/storybook-static/assets/Card.stories-B3NpAhO0.js

@@ -0,0 +1,154 @@
+import{j as e}from"./jsx-runtime-D_zvdyIk.js";import{A as _,E as $}from"./ActionMenu-EynP8yU1.js";import{D as Y}from"./Delete-D2SMMmIA.js";import{P as G}from"./Person-CkQl-mpq.js";import{r as J}from"./resolvePreset-CN2aOJJr.js";import{u as K}from"./useTheme-BmOJK7ra.js";import{r as Q}from"./iframe-BAJnc_4n.js";import{g as X,a as Z,u as ee,s as ae,c as oe,d as re}from"./DefaultPropsProvider-BGoQxtDa.js";import{P as te}from"./Paper-SwQBhqI7.js";import{B as s}from"./Box-BnhEcfFm.js";import{T as o}from"./Typography-BgntX2Ep.js";import{S as k}from"./Stack-D01OUIXi.js";import{C as z}from"./Chip-C3vKPpzR.js";import{B as q}from"./Button-DBpqmVB_.js";import"./createSvgIcon-D_Gca4vA.js";import"./MoreVert-BoIVG4gh.js";import"./Tooltip-DbnHUxNj.js";import"./useSlotProps-C0uMfuBt.js";import"./useSlot-b6pXgp5_.js";import"./useForkRef-0ANIrxcF.js";import"./useTimeout-DNjRaOWc.js";import"./useControlled-DsVh1a5j.js";import"./useId-b4fZxjOL.js";import"./getReactElementRef-BQ3ANZdy.js";import"./index-CY7j4a7o.js";import"./index-BF3FAXTk.js";import"./Grow-8y4FglGK.js";import"./Popper-CnCTYXxy.js";import"./ownerDocument-DW-IO8s5.js";import"./Portal-Cj8XF9Lf.js";import"./isFocusVisible-B8k4qzLc.js";import"./IconButton-9OYSTH58.js";import"./createSimplePaletteValueFilter-bm0fmN_7.js";import"./ButtonBase-qyaMEhe4.js";import"./emotion-react.browser.esm--g-C9cX9.js";import"./CircularProgress-DC7ZNWwl.js";import"./Menu-ClzfjLc3.js";import"./ownerWindow-HkKU3E4x.js";import"./debounce-Be36O1Ab.js";import"./mergeSlotProps-B0UBKBMe.js";import"./Modal-3okp9H2i.js";import"./Fade-Ll96CvH8.js";import"./MenuItem-iU6tAqJI.js";import"./listItemTextClasses-CC_rwJam.js";import"./ListItemIcon-hca6xN79.js";import"./ListItemText-BFLAwLdl.js";import"./Divider-BbCj9wT4.js";import"./extendSxProp-CEpa30hT.js";import"./preload-helper-PPVm8Dsz.js";import"./useThemeProps-DYtxXiUU.js";function ne(a){return X("MuiCard",a)}Z("MuiCard",["root"]);const se=a=>{const{classes:t}=a;return re({root:["root"]},ne,t)},ie=ae(te,{name:"MuiCard",slot:"Root"})({overflow:"hidden"}),le=Q.forwardRef(function(t,n){const r=ee({props:t,name:"MuiCard"}),{className:l,raised:d=!1,...j}=r,c={...r,raised:d},S=se(c);return e.jsx(ie,{className:oe(S.root,l),elevation:d?8:void 0,ref:n,ownerState:c,...j})}),de={none:0,dense:1.5,normal:2.5,loose:4};function ce({variant:a,padding:t,clickable:n}){return r=>({borderRadius:2,backgroundColor:"background.paper",boxShadow:a==="elevated"?r.shadows[1]:"none",border:a==="outlined"?`1px solid ${r.palette.divider}`:"none",transition:r.transitions.create(["box-shadow","transform","border-color"],{duration:r.transitions.duration.shorter}),cursor:n?"pointer":"default",...n&&{"&:hover":{boxShadow:a==="elevated"?r.shadows[3]:a==="outlined"?r.shadows[1]:"none",transform:a!=="plain"?"translateY(-1px)":"none"},"&:active":{transform:"translateY(0)"}},p:de[t]})}function I(){return a=>({display:"flex",alignItems:"center",gap:1.5,px:2.5,py:1.75,borderBottom:`1px solid ${a.palette.divider}`,"& .card-header-text":{flex:1,minWidth:0},"& .card-header-actions":{display:"flex",alignItems:"center",gap:.5,flexShrink:0}})}function pe(a){return{px:a==="none"?0:a==="dense"?1.5:a==="loose"?4:2.5,py:a==="none"?0:a==="dense"?1.5:a==="loose"?4:2.5}}function me(){return a=>({display:"flex",alignItems:"center",justifyContent:"flex-end",gap:1,px:2.5,py:1.5,borderTop:`1px solid ${a.palette.divider}`,backgroundColor:a.palette.action.hover})}function R({children:a,title:t,subtitle:n,actions:r,header:l,footer:d,variant:j,padding:c="normal",clickable:S=!1,preset:W,raised:E,sx:p,bodySx:m,headerSx:i,footerSx:u,onClick:B,onBlur:M,className:N,"data-testid":H}){const D=K(),F=E?"elevated":j??"elevated",L=!!(l||t||n||r),w=!!d,A=L||w,V=A?"none":c,P=J("Card",W,D),U=[ce({variant:F,padding:V,clickable:S||!!B}),...P?[P]:[],...Array.isArray(p)?p:p?[p]:[]],O=()=>l?e.jsx(s,{sx:[I(),...Array.isArray(i)?i:i?[i]:[]],children:l}):!t&&!n&&!r?null:e.jsxs(s,{sx:[I(),...Array.isArray(i)?i:i?[i]:[]],children:[e.jsxs(s,{className:"card-header-text",children:[t&&e.jsx(o,{variant:"subtitle1",component:"div",sx:{fontWeight:600,lineHeight:1.3},noWrap:!0,children:t}),n&&e.jsx(o,{variant:"caption",color:"text.secondary",component:"div",noWrap:!0,children:n})]}),r&&e.jsx(s,{className:"card-header-actions",children:r})]});return e.jsxs(le,{sx:U,className:N,"data-testid":H,onClick:B,onBlur:M,elevation:0,children:[O(),A?e.jsx(s,{sx:[pe(c),...Array.isArray(m)?m:m?[m]:[]],children:a}):a,w&&e.jsx(s,{sx:[me(),...Array.isArray(u)?u:u?[u]:[]],children:d})]})}R.__docgenInfo={description:'Card semántico con slots `title` / `subtitle` / `actions` / `footer`.\nReemplaza el patrón `<div class="card"><div class="card-header">...</div>...`\nde Metronic/Bootstrap con composición declarativa.\n\nBackward-compat: si solo se pasa `children`, se comporta como el Card\noriginal (MUI Card + body padding).\n\n```tsx\n<Card\n  title="Datos del cliente"\n  subtitle="Última actualización: hace 2h"\n  actions={<ActionMenu items={menuItems} />}\n  footer={<Button>Guardar</Button>}\n>\n  <CustomerForm />\n</Card>\n```',methods:[],displayName:"Card",props:{children:{required:!1,tsType:{name:"ReactNode"},description:"Contenido principal."},title:{required:!1,tsType:{name:"ReactNode"},description:`Título del Card. Si se provee, renderiza un header con separador. Puede
+ser string o cualquier ReactNode para permitir iconos / chips.`},subtitle:{required:!1,tsType:{name:"ReactNode"},description:"Texto secundario debajo del título."},actions:{required:!1,tsType:{name:"ReactNode"},description:`Acciones del header (botones, ActionMenu, etc). Se renderizan alineadas
+a la derecha.`},header:{required:!1,tsType:{name:"ReactNode"},description:"Header totalmente custom. Si se provee, ignora `title`/`subtitle`/`actions`\ny toma control del slot entero."},footer:{required:!1,tsType:{name:"ReactNode"},description:"Footer custom (botones, mensajes, etc)."},variant:{required:!1,tsType:{name:"union",raw:"'elevated' | 'outlined' | 'plain'",elements:[{name:"literal",value:"'elevated'"},{name:"literal",value:"'outlined'"},{name:"literal",value:"'plain'"}]},description:"Variante visual.\n- `elevated` (default): sombra sutil.\n- `outlined`: borde sin sombra.\n- `plain`: sin borde ni sombra, útil para layouts con nesting."},padding:{required:!1,tsType:{name:"union",raw:"'none' | 'dense' | 'normal' | 'loose'",elements:[{name:"literal",value:"'none'"},{name:"literal",value:"'dense'"},{name:"literal",value:"'normal'"},{name:"literal",value:"'loose'"}]},description:`Densidad del padding interno. Solo aplica al body cuando hay header/footer;
+cuando no hay slots, aplica al root.`,defaultValue:{value:"'normal'",computed:!1}},clickable:{required:!1,tsType:{name:"boolean"},description:"Si `true`, muestra feedback de hover/active (cursor, sombra).",defaultValue:{value:"false",computed:!1}},preset:{required:!1,tsType:{name:"string"},description:'Preset registrado en `theme.styles.Card`. `"default"` usa el estilo\nbuilt-in sin preset extra.'},raised:{required:!1,tsType:{name:"boolean"},description:'MUI `raised` legacy — mantenido por backward-compat. Equivale a\n`variant="elevated"` con sombra mayor. Ignora `variant` si se usa.'},sx:{required:!1,tsType:{name:"SxProps",elements:[{name:"Theme"}],raw:"SxProps<Theme>"},description:"sx del root. Se compone sobre el base + preset."},bodySx:{required:!1,tsType:{name:"SxProps",elements:[{name:"Theme"}],raw:"SxProps<Theme>"},description:"sx custom del slot body."},headerSx:{required:!1,tsType:{name:"SxProps",elements:[{name:"Theme"}],raw:"SxProps<Theme>"},description:"sx custom del slot header."},footerSx:{required:!1,tsType:{name:"SxProps",elements:[{name:"Theme"}],raw:"SxProps<Theme>"},description:"sx custom del slot footer."},onClick:{required:!1,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""},onBlur:{required:!1,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""},className:{required:!1,tsType:{name:"string"},description:""},"data-testid":{required:!1,tsType:{name:"string"},description:""}}};const da={title:"Components/Card",component:R,tags:["autodocs"],parameters:{layout:"padded",docs:{description:{component:"Contenedor semántico con slots `title` / `subtitle` / `actions` / `footer`. Reemplaza el patrón `.card` + `.card-header` + `.card-body` de Metronic con composición declarativa. Backward-compat: si solo se pasa `children`, se comporta como el Card original."}}},argTypes:{variant:{control:"select",options:["elevated","outlined","plain"]},padding:{control:"select",options:["none","dense","normal","loose"]},clickable:{control:"boolean"}}},y={args:{children:"Contenido simple del card — sin header ni footer."},parameters:{docs:{description:{story:"Modo backward-compat: pasando solo `children` el Card se comporta como el original (body con padding, sombra sutil)."}}}},h={args:{title:"Datos del cliente",subtitle:"Última actualización: hace 2 horas",children:e.jsx(o,{variant:"body2",color:"text.secondary",children:"Aquí va el contenido del card, por ejemplo un formulario o una tabla."})}},g={args:{title:"Afiliación #12458",subtitle:"Aprobada el 10 abril 2026",actions:e.jsx(_,{items:[{label:"Editar",icon:e.jsx($,{fontSize:"small"}),onClick:()=>{}},{label:"Eliminar",icon:e.jsx(Y,{fontSize:"small"}),onClick:()=>{},danger:!0,dividerBefore:!0}]}),children:e.jsxs(k,{direction:"row",spacing:2,alignItems:"center",children:[e.jsx(G,{color:"action"}),e.jsxs(s,{children:[e.jsx(o,{variant:"body2",sx:{fontWeight:600},children:"Andrea Pineda"}),e.jsx(o,{variant:"caption",color:"text.secondary",children:"andrea@soyfri.com"})]}),e.jsx(z,{label:"Activo",color:"success",size:"small",sx:{ml:"auto"}})]})}},b={args:{title:"Nueva afiliación",children:e.jsxs(k,{spacing:1,children:[e.jsx(o,{variant:"body2",children:"Confirma los datos antes de enviar la solicitud."}),e.jsx(o,{variant:"caption",color:"text.secondary",children:"Campos marcados con * son obligatorios."})]}),footer:e.jsxs(e.Fragment,{children:[e.jsx(q,{variant:"outlined",color:"secondary",children:"Cancelar"}),e.jsx(q,{variant:"contained",children:"Enviar"})]})}},x={args:{variant:"outlined",title:"Card outlined",subtitle:"Sin sombra, solo borde",children:e.jsx(o,{variant:"body2",children:"Útil cuando el card vive sobre un fondo con elevation mayor, o para evitar stacked shadows en listas densas."})}},v={args:{variant:"plain",title:"Card plain",subtitle:"Sin borde ni sombra",children:e.jsx(o,{variant:"body2",children:"Perfecto para composición interna — por ejemplo, cuando un card va dentro de otro y quieres evitar doble sombra."})}},f={args:{clickable:!0,title:"Haz click en este card",subtitle:"Fíjate en el hover",children:e.jsx(o,{variant:"body2",color:"text.secondary",children:"El cursor cambia y aparece un lift sutil en hover. Se dispara `onClick`."}),onClick:()=>console.log("card clicked")}},C={args:{padding:"dense",title:"Card denso",subtitle:"Padding reducido",children:e.jsxs(k,{spacing:.5,children:[e.jsx(o,{variant:"body2",children:"Línea 1"}),e.jsx(o,{variant:"body2",children:"Línea 2"}),e.jsx(o,{variant:"body2",children:"Línea 3"})]})}},T={args:{header:e.jsxs(s,{sx:{display:"flex",alignItems:"center",gap:1.5,width:"100%"},children:[e.jsx(s,{sx:{width:40,height:40,borderRadius:2,bgcolor:"primary.main",color:"primary.contrastText",display:"flex",alignItems:"center",justifyContent:"center",fontWeight:700},children:"42"}),e.jsxs(s,{sx:{flex:1},children:[e.jsx(o,{variant:"subtitle1",sx:{fontWeight:700},children:"Header totalmente custom"}),e.jsx(o,{variant:"caption",color:"text.secondary",children:"Tomas control del slot entero"})]}),e.jsx(z,{label:"v2",size:"small",variant:"outlined"})]}),children:e.jsx(o,{variant:"body2",children:"Cuando `header` se usa, los props `title`/`subtitle`/`actions` son ignorados."})}};y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
+  args: {
+    children: 'Contenido simple del card — sin header ni footer.'
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: 'Modo backward-compat: pasando solo \`children\` el Card se comporta como el original (body con padding, sombra sutil).'
+      }
+    }
+  }
+}`,...y.parameters?.docs?.source}}};h.parameters={...h.parameters,docs:{...h.parameters?.docs,source:{originalSource:`{
+  args: {
+    title: 'Datos del cliente',
+    subtitle: 'Última actualización: hace 2 horas',
+    children: <Typography variant="body2" color="text.secondary">
+        Aquí va el contenido del card, por ejemplo un formulario o una tabla.
+      </Typography>
+  }
+}`,...h.parameters?.docs?.source}}};g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
+  args: {
+    title: 'Afiliación #12458',
+    subtitle: 'Aprobada el 10 abril 2026',
+    actions: <ActionMenu items={[{
+      label: 'Editar',
+      icon: <EditIcon fontSize="small" />,
+      onClick: () => {}
+    }, {
+      label: 'Eliminar',
+      icon: <DeleteIcon fontSize="small" />,
+      onClick: () => {},
+      danger: true,
+      dividerBefore: true
+    }]} />,
+    children: <Stack direction="row" spacing={2} alignItems="center">
+        <PersonIcon color="action" />
+        <Box>
+          <Typography variant="body2" sx={{
+          fontWeight: 600
+        }}>
+            Andrea Pineda
+          </Typography>
+          <Typography variant="caption" color="text.secondary">
+            andrea@soyfri.com
+          </Typography>
+        </Box>
+        <Chip label="Activo" color="success" size="small" sx={{
+        ml: 'auto'
+      }} />
+      </Stack>
+  }
+}`,...g.parameters?.docs?.source}}};b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
+  args: {
+    title: 'Nueva afiliación',
+    children: <Stack spacing={1}>
+        <Typography variant="body2">
+          Confirma los datos antes de enviar la solicitud.
+        </Typography>
+        <Typography variant="caption" color="text.secondary">
+          Campos marcados con * son obligatorios.
+        </Typography>
+      </Stack>,
+    footer: <>
+        <Button variant="outlined" color="secondary">
+          Cancelar
+        </Button>
+        <Button variant="contained">Enviar</Button>
+      </>
+  }
+}`,...b.parameters?.docs?.source}}};x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
+  args: {
+    variant: 'outlined',
+    title: 'Card outlined',
+    subtitle: 'Sin sombra, solo borde',
+    children: <Typography variant="body2">
+        Útil cuando el card vive sobre un fondo con elevation mayor, o para
+        evitar stacked shadows en listas densas.
+      </Typography>
+  }
+}`,...x.parameters?.docs?.source}}};v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`{
+  args: {
+    variant: 'plain',
+    title: 'Card plain',
+    subtitle: 'Sin borde ni sombra',
+    children: <Typography variant="body2">
+        Perfecto para composición interna — por ejemplo, cuando un card va
+        dentro de otro y quieres evitar doble sombra.
+      </Typography>
+  }
+}`,...v.parameters?.docs?.source}}};f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`{
+  args: {
+    clickable: true,
+    title: 'Haz click en este card',
+    subtitle: 'Fíjate en el hover',
+    children: <Typography variant="body2" color="text.secondary">
+        El cursor cambia y aparece un lift sutil en hover. Se dispara \`onClick\`.
+      </Typography>,
+    onClick: () => console.log('card clicked')
+  }
+}`,...f.parameters?.docs?.source}}};C.parameters={...C.parameters,docs:{...C.parameters?.docs,source:{originalSource:`{
+  args: {
+    padding: 'dense',
+    title: 'Card denso',
+    subtitle: 'Padding reducido',
+    children: <Stack spacing={0.5}>
+        <Typography variant="body2">Línea 1</Typography>
+        <Typography variant="body2">Línea 2</Typography>
+        <Typography variant="body2">Línea 3</Typography>
+      </Stack>
+  }
+}`,...C.parameters?.docs?.source}}};T.parameters={...T.parameters,docs:{...T.parameters?.docs,source:{originalSource:`{
+  args: {
+    header: <Box sx={{
+      display: 'flex',
+      alignItems: 'center',
+      gap: 1.5,
+      width: '100%'
+    }}>
+        <Box sx={{
+        width: 40,
+        height: 40,
+        borderRadius: 2,
+        bgcolor: 'primary.main',
+        color: 'primary.contrastText',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        fontWeight: 700
+      }}>
+          42
+        </Box>
+        <Box sx={{
+        flex: 1
+      }}>
+          <Typography variant="subtitle1" sx={{
+          fontWeight: 700
+        }}>
+            Header totalmente custom
+          </Typography>
+          <Typography variant="caption" color="text.secondary">
+            Tomas control del slot entero
+          </Typography>
+        </Box>
+        <Chip label="v2" size="small" variant="outlined" />
+      </Box>,
+    children: <Typography variant="body2">
+        Cuando \`header\` se usa, los props \`title\`/\`subtitle\`/\`actions\` son
+        ignorados.
+      </Typography>
+  }
+}`,...T.parameters?.docs?.source}}};const ca=["LegacyBodyOnly","WithTitleAndSubtitle","WithActions","WithFooter","OutlinedVariant","PlainVariant","Clickable","DensePadding","CustomHeader"];export{f as Clickable,T as CustomHeader,C as DensePadding,y as LegacyBodyOnly,x as OutlinedVariant,v as PlainVariant,g as WithActions,b as WithFooter,h as WithTitleAndSubtitle,ca as __namedExportsOrder,da as default};

package/storybook-static/assets/CheckCircleOutline-CEj5mDsl.js

@@ -0,0 +1 @@
+import{j as o}from"./jsx-runtime-D_zvdyIk.js";import{c as s}from"./createSvgIcon-D_Gca4vA.js";const r=s(o.jsx("path",{d:"M16.59 7.58 10 14.17l-3.59-3.58L5 12l5 5 8-8zM12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8"}));export{r as C};

package/storybook-static/assets/Chip-C3vKPpzR.js

@@ -0,0 +1 @@
+import{r as p}from"./iframe-BAJnc_4n.js";import{a as aa,g as oa,u as la,c as $,s as M,b as e,d as ra,m as ea}from"./DefaultPropsProvider-BGoQxtDa.js";import{c as ta}from"./createSvgIcon-D_Gca4vA.js";import{j as k}from"./jsx-runtime-D_zvdyIk.js";import{c as y}from"./createSimplePaletteValueFilter-bm0fmN_7.js";import{u as V}from"./useSlot-b6pXgp5_.js";import{u as ia}from"./useForkRef-0ANIrxcF.js";import{B as j}from"./ButtonBase-qyaMEhe4.js";const na=ta(k.jsx("path",{d:"M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"}));function ca(a){return oa("MuiChip",a)}const o=aa("MuiChip",["root","sizeSmall","sizeMedium","colorDefault","colorError","colorInfo","colorPrimary","colorSecondary","colorSuccess","colorWarning","disabled","clickable","clickableColorPrimary","clickableColorSecondary","deletable","deletableColorPrimary","deletableColorSecondary","outlined","filled","outlinedPrimary","outlinedSecondary","filledPrimary","filledSecondary","avatar","avatarSmall","avatarMedium","avatarColorPrimary","avatarColorSecondary","icon","iconSmall","iconMedium","iconColorPrimary","iconColorSecondary","label","labelSmall","labelMedium","deleteIcon","deleteIconSmall","deleteIconMedium","deleteIconColorPrimary","deleteIconColorSecondary","deleteIconOutlinedColorPrimary","deleteIconOutlinedColorSecondary","deleteIconFilledColorPrimary","deleteIconFilledColorSecondary","focusVisible"]),sa=a=>{const{classes:r,disabled:l,size:t,color:n,iconColor:f,onDelete:d,clickable:c,variant:s}=a,g={root:["root",s,l&&"disabled",`size${e(t)}`,`color${e(n)}`,c&&"clickable",c&&`clickableColor${e(n)}`,d&&"deletable",d&&`deletableColor${e(n)}`,`${s}${e(n)}`],label:["label",`label${e(t)}`],avatar:["avatar",`avatar${e(t)}`,`avatarColor${e(n)}`],icon:["icon",`icon${e(t)}`,`iconColor${e(f)}`],deleteIcon:["deleteIcon",`deleteIcon${e(t)}`,`deleteIconColor${e(n)}`,`deleteIcon${e(s)}Color${e(n)}`]};return ra(g,ca,r)},pa=M("div",{name:"MuiChip",slot:"Root",overridesResolver:(a,r)=>{const{ownerState:l}=a,{color:t,iconColor:n,clickable:f,onDelete:d,size:c,variant:s}=l;return[{[`& .${o.avatar}`]:r.avatar},{[`& .${o.avatar}`]:r[`avatar${e(c)}`]},{[`& .${o.avatar}`]:r[`avatarColor${e(t)}`]},{[`& .${o.icon}`]:r.icon},{[`& .${o.icon}`]:r[`icon${e(c)}`]},{[`& .${o.icon}`]:r[`iconColor${e(n)}`]},{[`& .${o.deleteIcon}`]:r.deleteIcon},{[`& .${o.deleteIcon}`]:r[`deleteIcon${e(c)}`]},{[`& .${o.deleteIcon}`]:r[`deleteIconColor${e(t)}`]},{[`& .${o.deleteIcon}`]:r[`deleteIcon${e(s)}Color${e(t)}`]},r.root,r[`size${e(c)}`],r[`color${e(t)}`],f&&r.clickable,f&&t!=="default"&&r[`clickableColor${e(t)})`],d&&r.deletable,d&&t!=="default"&&r[`deletableColor${e(t)}`],r[s],r[`${s}${e(t)}`]]}})(ea(({theme:a})=>{const r=a.palette.mode==="light"?a.palette.grey[700]:a.palette.grey[300];return{maxWidth:"100%",fontFamily:a.typography.fontFamily,fontSize:a.typography.pxToRem(13),display:"inline-flex",alignItems:"center",justifyContent:"center",height:32,lineHeight:1.5,color:(a.vars||a).palette.text.primary,backgroundColor:(a.vars||a).palette.action.selected,borderRadius:32/2,whiteSpace:"nowrap",transition:a.transitions.create(["background-color","box-shadow"]),cursor:"unset",outline:0,textDecoration:"none",border:0,padding:0,verticalAlign:"middle",boxSizing:"border-box",[`&.${o.disabled}`]:{opacity:(a.vars||a).palette.action.disabledOpacity,pointerEvents:"none"},[`& .${o.avatar}`]:{marginLeft:5,marginRight:-6,width:24,height:24,color:a.vars?a.vars.palette.Chip.defaultAvatarColor:r,fontSize:a.typography.pxToRem(12)},[`& .${o.avatarColorPrimary}`]:{color:(a.vars||a).palette.primary.contrastText,backgroundColor:(a.vars||a).palette.primary.dark},[`& .${o.avatarColorSecondary}`]:{color:(a.vars||a).palette.secondary.contrastText,backgroundColor:(a.vars||a).palette.secondary.dark},[`& .${o.avatarSmall}`]:{marginLeft:4,marginRight:-4,width:18,height:18,fontSize:a.typography.pxToRem(10)},[`& .${o.icon}`]:{marginLeft:5,marginRight:-6},[`& .${o.deleteIcon}`]:{WebkitTapHighlightColor:"transparent",color:a.alpha((a.vars||a).palette.text.primary,.26),fontSize:22,cursor:"pointer",margin:"0 5px 0 -6px","&:hover":{color:a.alpha((a.vars||a).palette.text.primary,.4)}},variants:[{props:{size:"small"},style:{height:24,[`& .${o.icon}`]:{fontSize:18,marginLeft:4,marginRight:-4},[`& .${o.deleteIcon}`]:{fontSize:16,marginRight:4,marginLeft:-4}}},...Object.entries(a.palette).filter(y(["contrastText"])).map(([l])=>({props:{color:l},style:{backgroundColor:(a.vars||a).palette[l].main,color:(a.vars||a).palette[l].contrastText,[`& .${o.deleteIcon}`]:{color:a.alpha((a.vars||a).palette[l].contrastText,.7),"&:hover, &:active":{color:(a.vars||a).palette[l].contrastText}}}})),{props:l=>l.iconColor===l.color,style:{[`& .${o.icon}`]:{color:a.vars?a.vars.palette.Chip.defaultIconColor:r}}},{props:l=>l.iconColor===l.color&&l.color!=="default",style:{[`& .${o.icon}`]:{color:"inherit"}}},{props:{onDelete:!0},style:{[`&.${o.focusVisible}`]:{backgroundColor:a.alpha((a.vars||a).palette.action.selected,`${(a.vars||a).palette.action.selectedOpacity} + ${(a.vars||a).palette.action.focusOpacity}`)}}},...Object.entries(a.palette).filter(y(["dark"])).map(([l])=>({props:{color:l,onDelete:!0},style:{[`&.${o.focusVisible}`]:{background:(a.vars||a).palette[l].dark}}})),{props:{clickable:!0},style:{userSelect:"none",WebkitTapHighlightColor:"transparent",cursor:"pointer","&:hover":{backgroundColor:a.alpha((a.vars||a).palette.action.selected,`${(a.vars||a).palette.action.selectedOpacity} + ${(a.vars||a).palette.action.hoverOpacity}`)},[`&.${o.focusVisible}`]:{backgroundColor:a.alpha((a.vars||a).palette.action.selected,`${(a.vars||a).palette.action.selectedOpacity} + ${(a.vars||a).palette.action.focusOpacity}`)},"&:active":{boxShadow:(a.vars||a).shadows[1]}}},...Object.entries(a.palette).filter(y(["dark"])).map(([l])=>({props:{color:l,clickable:!0},style:{[`&:hover, &.${o.focusVisible}`]:{backgroundColor:(a.vars||a).palette[l].dark}}})),{props:{variant:"outlined"},style:{backgroundColor:"transparent",border:a.vars?`1px solid ${a.vars.palette.Chip.defaultBorder}`:`1px solid ${a.palette.mode==="light"?a.palette.grey[400]:a.palette.grey[700]}`,[`&.${o.clickable}:hover`]:{backgroundColor:(a.vars||a).palette.action.hover},[`&.${o.focusVisible}`]:{backgroundColor:(a.vars||a).palette.action.focus},[`& .${o.avatar}`]:{marginLeft:4},[`& .${o.avatarSmall}`]:{marginLeft:2},[`& .${o.icon}`]:{marginLeft:4},[`& .${o.iconSmall}`]:{marginLeft:2},[`& .${o.deleteIcon}`]:{marginRight:5},[`& .${o.deleteIconSmall}`]:{marginRight:3}}},...Object.entries(a.palette).filter(y()).map(([l])=>({props:{variant:"outlined",color:l},style:{color:(a.vars||a).palette[l].main,border:`1px solid ${a.alpha((a.vars||a).palette[l].main,.7)}`,[`&.${o.clickable}:hover`]:{backgroundColor:a.alpha((a.vars||a).palette[l].main,(a.vars||a).palette.action.hoverOpacity)},[`&.${o.focusVisible}`]:{backgroundColor:a.alpha((a.vars||a).palette[l].main,(a.vars||a).palette.action.focusOpacity)},[`& .${o.deleteIcon}`]:{color:a.alpha((a.vars||a).palette[l].main,.7),"&:hover, &:active":{color:(a.vars||a).palette[l].main}}}}))]}})),da=M("span",{name:"MuiChip",slot:"Label",overridesResolver:(a,r)=>{const{ownerState:l}=a,{size:t}=l;return[r.label,r[`label${e(t)}`]]}})({overflow:"hidden",textOverflow:"ellipsis",paddingLeft:12,paddingRight:12,whiteSpace:"nowrap",variants:[{props:{variant:"outlined"},style:{paddingLeft:11,paddingRight:11}},{props:{size:"small"},style:{paddingLeft:8,paddingRight:8}},{props:{size:"small",variant:"outlined"},style:{paddingLeft:7,paddingRight:7}}]});function E(a){return a.key==="Backspace"||a.key==="Delete"}const ka=p.forwardRef(function(r,l){const t=la({props:r,name:"MuiChip"}),{avatar:n,className:f,clickable:d,color:c="default",component:s,deleteIcon:g,disabled:S=!1,icon:C,label:N,onClick:R,onDelete:u,onKeyDown:m,onKeyUp:w,size:F="medium",variant:K="filled",tabIndex:U,skipFocusWhenDisabled:B=!1,slots:W={},slotProps:H={},...A}=t,q=p.useRef(null),G=ia(q,l),z=i=>{i.stopPropagation(),u&&u(i)},J=i=>{i.currentTarget===i.target&&E(i)&&i.preventDefault(),m&&m(i)},Q=i=>{i.currentTarget===i.target&&u&&E(i)&&u(i),w&&w(i)},I=d!==!1&&R?!0:d,x=I||u?j:s||"div",P={...t,component:x,disabled:S,size:F,color:c,iconColor:p.isValidElement(C)&&C.props.color||c,onDelete:!!u,clickable:I,variant:K},b=sa(P),X=x===j?{component:s||"div",focusVisibleClassName:b.focusVisible,...u&&{disableRipple:!0}}:{};let D=null;u&&(D=g&&p.isValidElement(g)?p.cloneElement(g,{className:$(g.props.className,b.deleteIcon),onClick:z}):k.jsx(na,{className:b.deleteIcon,onClick:z}));let L=null;n&&p.isValidElement(n)&&(L=p.cloneElement(n,{className:$(b.avatar,n.props.className)}));let O=null;C&&p.isValidElement(C)&&(O=p.cloneElement(C,{className:$(b.icon,C.props.className)}));const T={slots:W,slotProps:H},[Y,Z]=V("root",{elementType:pa,externalForwardedProps:{...T,...A},ownerState:P,shouldForwardComponentProp:!0,ref:G,className:$(b.root,f),additionalProps:{disabled:I&&S?!0:void 0,tabIndex:B&&S?-1:U,...X},getSlotProps:i=>({...i,onClick:v=>{i.onClick?.(v),R?.(v)},onKeyDown:v=>{i.onKeyDown?.(v),J(v)},onKeyUp:v=>{i.onKeyUp?.(v),Q(v)}})}),[_,h]=V("label",{elementType:da,externalForwardedProps:T,ownerState:P,className:b.label});return k.jsxs(Y,{as:x,...Z,children:[L||O,k.jsx(_,{...h,children:N}),D]})});export{ka as C};