@economic/taco 1.4.2 → 1.5.0

package/dist/esm/components/Switch/Switch.js

@@ -8,7 +8,7 @@ const Switch = /*#__PURE__*/forwardRef(function Switch(props, ref) {
     onChange,
     ...otherProps
   } = props;
-  const className = cn('group h-5 w-9 flex rounded-full inline-flex', {
+  const className = cn('group h-5 w-9 flex flex-shrink-0 rounded-full inline-flex', {
     'mr-2': !!label,
     'bg-grey-darker hover:bg-grey-dark aria-checked:bg-blue aria-checked:hover:bg-blue-light focus:yt-focus': !props.disabled,
     'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled
@@ -22,7 +22,7 @@ const Switch = /*#__PURE__*/forwardRef(function Switch(props, ref) {
   }));
 
   if (label) {
-    const labelClassName = cn('flex items-center cursor-pointer', {
+    const labelClassName = cn('flex self-start cursor-pointer', {
       'cursor-not-allowed text-grey-dark': props.disabled
     });
     return createElement("label", {

package/dist/esm/components/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PrimitiveSwitch from '@radix-ui/react-switch';\n\ntype SwitchBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\n    /** Label for the switch */\n    label?: React.ReactNode;\n    /* Whether user input is required */\n    required?: boolean;\n};\n\ninterface UncontrolledSwitchProps extends SwitchBaseProps {\n    checked?: never;\n    onChange?: never;\n    /* The default checked state (uncontrolled) */\n    defaultChecked?: boolean;\n}\n\ninterface ControlledSwitchProps extends SwitchBaseProps {\n    defaultChecked?: never;\n    /* The current checked state (controlled) */\n    checked: boolean;\n    /* Handler called when the checked state changes */\n    onChange: (checked: boolean) => void;\n}\n\nexport type SwitchProps = UncontrolledSwitchProps | ControlledSwitchProps;\n\nexport const Switch = React.forwardRef(function Switch(props: SwitchProps, ref: React.Ref<HTMLButtonElement>) {\n    const { label, onChange, ...otherProps } = props;\n\n    const className = cn(\n        'group h-5 w-9 flex rounded-full inline-flex',\n        {\n            'mr-2': !!label,\n            'bg-grey-darker hover:bg-grey-dark aria-checked:bg-blue aria-checked:hover:bg-blue-light focus:yt-focus':\n                !props.disabled,\n            'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled,\n        },\n        props.className\n    );\n\n    const element = (\n        <PrimitiveSwitch.Root {...otherProps} className={className} onCheckedChange={onChange} ref={ref}>\n            <PrimitiveSwitch.Thumb className=\"'will-change-transform group-aria-checked:translate-x-[1.1rem] mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform group-disabled:opacity-50\" />\n        </PrimitiveSwitch.Root>\n    );\n\n    if (label) {\n        const labelClassName = cn('flex items-center cursor-pointer', {\n            'cursor-not-allowed text-grey-dark': props.disabled,\n        });\n\n        return (\n            <label className={labelClassName}>\n                {element}\n                {label}\n            </label>\n        );\n    }\n\n    return element;\n});\n"],"names":["Switch","React","props","ref","label","onChange","otherProps","className","cn","disabled","element","PrimitiveSwitch","onCheckedChange","labelClassName"],"mappings":";;;;MA4BaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CAAgBE,KAAhB,EAAoCC,GAApC;EACnC,MAAM;IAAEC,KAAF;IAASC,QAAT;IAAmB,GAAGC;MAAeJ,KAA3C;EAEA,MAAMK,SAAS,GAAGC,EAAE,CAChB,6CADgB,EAEhB;IACI,QAAQ,CAAC,CAACJ,KADd;IAEI,0GACI,CAACF,KAAK,CAACO,QAHf;IAII,+DAA+DP,KAAK,CAACO;GANzD,EAQhBP,KAAK,CAACK,SARU,CAApB;EAWA,MAAMG,OAAO,GACTT,aAAA,CAACU,IAAD,oBAA0BL;IAAYC,SAAS,EAAEA;IAAWK,eAAe,EAAEP;IAAUF,GAAG,EAAEA;IAA5F,EACIF,aAAA,CAACU,KAAD;IAAuBJ,SAAS,EAAC;GAAjC,CADJ,CADJ;;EAMA,IAAIH,KAAJ,EAAW;IACP,MAAMS,cAAc,GAAGL,EAAE,CAAC,kCAAD,EAAqC;MAC1D,qCAAqCN,KAAK,CAACO;KADtB,CAAzB;IAIA,OACIR,aAAA,QAAA;MAAOM,SAAS,EAAEM;KAAlB,EACKH,OADL,EAEKN,KAFL,CADJ;;;EAQJ,OAAOM,OAAP;AACH,CAlCqB;;;;"}
+{"version":3,"file":"Switch.js","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PrimitiveSwitch from '@radix-ui/react-switch';\n\ntype SwitchBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\n    /** Label for the switch */\n    label?: React.ReactNode;\n    /* Whether user input is required */\n    required?: boolean;\n};\n\ninterface UncontrolledSwitchProps extends SwitchBaseProps {\n    checked?: never;\n    onChange?: never;\n    /* The default checked state (uncontrolled) */\n    defaultChecked?: boolean;\n}\n\ninterface ControlledSwitchProps extends SwitchBaseProps {\n    defaultChecked?: never;\n    /* The current checked state (controlled) */\n    checked: boolean;\n    /* Handler called when the checked state changes */\n    onChange: (checked: boolean) => void;\n}\n\nexport type SwitchProps = UncontrolledSwitchProps | ControlledSwitchProps;\n\nexport const Switch = React.forwardRef(function Switch(props: SwitchProps, ref: React.Ref<HTMLButtonElement>) {\n    const { label, onChange, ...otherProps } = props;\n\n    const className = cn(\n        'group h-5 w-9 flex flex-shrink-0 rounded-full inline-flex',\n        {\n            'mr-2': !!label,\n            'bg-grey-darker hover:bg-grey-dark aria-checked:bg-blue aria-checked:hover:bg-blue-light focus:yt-focus':\n                !props.disabled,\n            'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled,\n        },\n        props.className\n    );\n\n    const element = (\n        <PrimitiveSwitch.Root {...otherProps} className={className} onCheckedChange={onChange} ref={ref}>\n            <PrimitiveSwitch.Thumb className=\"'will-change-transform group-aria-checked:translate-x-[1.1rem] mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform group-disabled:opacity-50\" />\n        </PrimitiveSwitch.Root>\n    );\n\n    if (label) {\n        const labelClassName = cn('flex self-start cursor-pointer', {\n            'cursor-not-allowed text-grey-dark': props.disabled,\n        });\n\n        return (\n            <label className={labelClassName}>\n                {element}\n                {label}\n            </label>\n        );\n    }\n\n    return element;\n});\n"],"names":["Switch","React","props","ref","label","onChange","otherProps","className","cn","disabled","element","PrimitiveSwitch","onCheckedChange","labelClassName"],"mappings":";;;;MA4BaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CAAgBE,KAAhB,EAAoCC,GAApC;EACnC,MAAM;IAAEC,KAAF;IAASC,QAAT;IAAmB,GAAGC;MAAeJ,KAA3C;EAEA,MAAMK,SAAS,GAAGC,EAAE,CAChB,2DADgB,EAEhB;IACI,QAAQ,CAAC,CAACJ,KADd;IAEI,0GACI,CAACF,KAAK,CAACO,QAHf;IAII,+DAA+DP,KAAK,CAACO;GANzD,EAQhBP,KAAK,CAACK,SARU,CAApB;EAWA,MAAMG,OAAO,GACTT,aAAA,CAACU,IAAD,oBAA0BL;IAAYC,SAAS,EAAEA;IAAWK,eAAe,EAAEP;IAAUF,GAAG,EAAEA;IAA5F,EACIF,aAAA,CAACU,KAAD;IAAuBJ,SAAS,EAAC;GAAjC,CADJ,CADJ;;EAMA,IAAIH,KAAJ,EAAW;IACP,MAAMS,cAAc,GAAGL,EAAE,CAAC,gCAAD,EAAmC;MACxD,qCAAqCN,KAAK,CAACO;KADtB,CAAzB;IAIA,OACIR,aAAA,QAAA;MAAOM,SAAS,EAAEM;KAAlB,EACKH,OADL,EAEKN,KAFL,CADJ;;;EAQJ,OAAOM,OAAP;AACH,CAlCqB;;;;"}

package/dist/taco.cjs.development.js

@@ -9258,7 +9258,7 @@ const Switch = /*#__PURE__*/React.forwardRef(function Switch(props, ref) {
     onChange,
     ...otherProps
   } = props;
-  const className = cn('group h-5 w-9 flex rounded-full inline-flex', {
+  const className = cn('group h-5 w-9 flex flex-shrink-0 rounded-full inline-flex', {
     'mr-2': !!label,
     'bg-grey-darker hover:bg-grey-dark aria-checked:bg-blue aria-checked:hover:bg-blue-light focus:yt-focus': !props.disabled,
     'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled
@@ -9272,7 +9272,7 @@ const Switch = /*#__PURE__*/React.forwardRef(function Switch(props, ref) {
   }));
 
   if (label) {
-    const labelClassName = cn('flex items-center cursor-pointer', {
+    const labelClassName = cn('flex self-start cursor-pointer', {
       'cursor-not-allowed text-grey-dark': props.disabled
     });
     return React.createElement("label", {