@economic/taco 8.1.3-EC-82626-test-release.0 → 8.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -33,8 +33,7 @@ const Field = React__namespace.forwardRef(function Field2(props, ref) {
33
33
  );
34
34
  const messageClassName = cn("h-4 text-xs text-left leading-normal font-normal truncate -mb-4", {
35
35
  "text-gray-700": !invalid && !warning,
36
- "text-red-500": invalid,
37
- "text-yellow-500": warning && !invalid,
36
+ "text-red-700": invalid,
38
37
  "opacity-50": disabled
39
38
  });
40
39
  return /* @__PURE__ */ React__namespace.createElement("label", { ...otherProps, className, "data-taco": "label", ref }, children, message && /* @__PURE__ */ React__namespace.createElement(Truncate.Truncate, { tooltip: message }, /* @__PURE__ */ React__namespace.createElement(
@@ -1 +1 @@
1
- {"version":3,"file":"Field.cjs","sources":["../../../src/components/Field/Field.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport './Field.css';\nimport { Truncate } from '../Truncate/Truncate';\n\nexport type FieldProps = React.LabelHTMLAttributes<HTMLLabelElement> & {\n /** Content of the field */\n children: React.ReactNode;\n /**\tChanges the style to indicate the element is disabled */\n disabled?: boolean;\n /* Whether the input is in an invalid state */\n invalid?: boolean;\n /* Whether the input is in a warning state */\n warning?: boolean;\n /**\n * Text displayed below the children of Field.\n * Should be a short text that indicates feedback for user.\n */\n message?: string;\n};\n\nexport const Field = React.forwardRef(function Field(props: FieldProps, ref: React.Ref<HTMLLabelElement>) {\n const messageRef = React.useRef<HTMLSpanElement>(null);\n\n const { disabled, children, invalid = false, warning = false, message, ...otherProps } = props;\n const className = cn(\n 'flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]',\n {\n 'text-gray-300': disabled,\n },\n props.className\n );\n const messageClassName = cn('h-4 text-xs text-left leading-normal font-normal truncate -mb-4', {\n 'text-gray-700': !invalid && !warning,\n 'text-red-500': invalid,\n 'text-yellow-500': warning && !invalid,\n 'opacity-50': disabled,\n });\n\n return (\n <label {...otherProps} className={className} data-taco=\"label\" ref={ref}>\n {children}\n {message && (\n <Truncate tooltip={message}>\n <span\n className={messageClassName}\n data-taco=\"label-message\"\n ref={messageRef}\n role={invalid ? 'alert' : undefined}>\n {message}\n </span>\n </Truncate>\n )}\n </label>\n );\n});\n"],"names":["React","Field","Truncate"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAqBO,MAAM,QAAQA,iBAAM,WAAW,SAASC,OAAM,OAAmB,KAAkC;AAChG,QAAA,aAAaD,iBAAM,OAAwB,IAAI;AAE/C,QAAA,EAAE,UAAU,UAAU,UAAU,OAAO,UAAU,OAAO,SAAS,GAAG,WAAA,IAAe;AACzF,QAAM,YAAY;AAAA,IACd;AAAA,IACA;AAAA,MACI,iBAAiB;AAAA,IACrB;AAAA,IACA,MAAM;AAAA,EACV;AACM,QAAA,mBAAmB,GAAG,mEAAmE;AAAA,IAC3F,iBAAiB,CAAC,WAAW,CAAC;AAAA,IAC9B,gBAAgB;AAAA,IAChB,mBAAmB,WAAW,CAAC;AAAA,IAC/B,cAAc;AAAA,EAAA,CACjB;AAED,SACKA,iCAAA,cAAA,SAAA,EAAO,GAAG,YAAY,WAAsB,aAAU,SAAQ,IAAA,GAC1D,UACA,WACIA,iCAAA,cAAAE,SAAAA,UAAA,EAAS,SAAS,WACfF,iCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW;AAAA,MACX,aAAU;AAAA,MACV,KAAK;AAAA,MACL,MAAM,UAAU,UAAU;AAAA,IAAA;AAAA,IACzB;AAAA,EAAA,CAET,CAER;AAER,CAAC;;"}
1
+ {"version":3,"file":"Field.cjs","sources":["../../../src/components/Field/Field.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport './Field.css';\nimport { Truncate } from '../Truncate/Truncate';\n\nexport type FieldProps = React.LabelHTMLAttributes<HTMLLabelElement> & {\n /** Content of the field */\n children: React.ReactNode;\n /**\tChanges the style to indicate the element is disabled */\n disabled?: boolean;\n /* Whether the input is in an invalid state */\n invalid?: boolean;\n /* Whether the input is in a warning state */\n warning?: boolean;\n /**\n * Text displayed below the children of Field.\n * Should be a short text that indicates feedback for user.\n */\n message?: string;\n};\n\nexport const Field = React.forwardRef(function Field(props: FieldProps, ref: React.Ref<HTMLLabelElement>) {\n const messageRef = React.useRef<HTMLSpanElement>(null);\n\n const { disabled, children, invalid = false, warning = false, message, ...otherProps } = props;\n const className = cn(\n 'flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]',\n {\n 'text-gray-300': disabled,\n },\n props.className\n );\n const messageClassName = cn('h-4 text-xs text-left leading-normal font-normal truncate -mb-4', {\n 'text-gray-700': !invalid && !warning,\n 'text-red-700': invalid,\n 'opacity-50': disabled,\n });\n\n return (\n <label {...otherProps} className={className} data-taco=\"label\" ref={ref}>\n {children}\n {message && (\n <Truncate tooltip={message}>\n <span\n className={messageClassName}\n data-taco=\"label-message\"\n ref={messageRef}\n role={invalid ? 'alert' : undefined}>\n {message}\n </span>\n </Truncate>\n )}\n </label>\n );\n});\n"],"names":["React","Field","Truncate"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAqBO,MAAM,QAAQA,iBAAM,WAAW,SAASC,OAAM,OAAmB,KAAkC;AAChG,QAAA,aAAaD,iBAAM,OAAwB,IAAI;AAE/C,QAAA,EAAE,UAAU,UAAU,UAAU,OAAO,UAAU,OAAO,SAAS,GAAG,WAAA,IAAe;AACzF,QAAM,YAAY;AAAA,IACd;AAAA,IACA;AAAA,MACI,iBAAiB;AAAA,IACrB;AAAA,IACA,MAAM;AAAA,EACV;AACM,QAAA,mBAAmB,GAAG,mEAAmE;AAAA,IAC3F,iBAAiB,CAAC,WAAW,CAAC;AAAA,IAC9B,gBAAgB;AAAA,IAChB,cAAc;AAAA,EAAA,CACjB;AAED,SACKA,iCAAA,cAAA,SAAA,EAAO,GAAG,YAAY,WAAsB,aAAU,SAAQ,IAAA,GAC1D,UACA,WACIA,iCAAA,cAAAE,SAAAA,UAAA,EAAS,SAAS,WACfF,iCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW;AAAA,MACX,aAAU;AAAA,MACV,KAAK;AAAA,MACL,MAAM,UAAU,UAAU;AAAA,IAAA;AAAA,IACzB;AAAA,EAAA,CAET,CAER;AAER,CAAC;;"}
@@ -14,8 +14,7 @@ const Field = React.forwardRef(function Field2(props, ref) {
14
14
  );
15
15
  const messageClassName = cn("h-4 text-xs text-left leading-normal font-normal truncate -mb-4", {
16
16
  "text-gray-700": !invalid && !warning,
17
- "text-red-500": invalid,
18
- "text-yellow-500": warning && !invalid,
17
+ "text-red-700": invalid,
19
18
  "opacity-50": disabled
20
19
  });
21
20
  return /* @__PURE__ */ React.createElement("label", { ...otherProps, className, "data-taco": "label", ref }, children, message && /* @__PURE__ */ React.createElement(Truncate, { tooltip: message }, /* @__PURE__ */ React.createElement(
@@ -1 +1 @@
1
- {"version":3,"file":"Field.js","sources":["../../../src/components/Field/Field.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport './Field.css';\nimport { Truncate } from '../Truncate/Truncate';\n\nexport type FieldProps = React.LabelHTMLAttributes<HTMLLabelElement> & {\n /** Content of the field */\n children: React.ReactNode;\n /**\tChanges the style to indicate the element is disabled */\n disabled?: boolean;\n /* Whether the input is in an invalid state */\n invalid?: boolean;\n /* Whether the input is in a warning state */\n warning?: boolean;\n /**\n * Text displayed below the children of Field.\n * Should be a short text that indicates feedback for user.\n */\n message?: string;\n};\n\nexport const Field = React.forwardRef(function Field(props: FieldProps, ref: React.Ref<HTMLLabelElement>) {\n const messageRef = React.useRef<HTMLSpanElement>(null);\n\n const { disabled, children, invalid = false, warning = false, message, ...otherProps } = props;\n const className = cn(\n 'flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]',\n {\n 'text-gray-300': disabled,\n },\n props.className\n );\n const messageClassName = cn('h-4 text-xs text-left leading-normal font-normal truncate -mb-4', {\n 'text-gray-700': !invalid && !warning,\n 'text-red-500': invalid,\n 'text-yellow-500': warning && !invalid,\n 'opacity-50': disabled,\n });\n\n return (\n <label {...otherProps} className={className} data-taco=\"label\" ref={ref}>\n {children}\n {message && (\n <Truncate tooltip={message}>\n <span\n className={messageClassName}\n data-taco=\"label-message\"\n ref={messageRef}\n role={invalid ? 'alert' : undefined}>\n {message}\n </span>\n </Truncate>\n )}\n </label>\n );\n});\n"],"names":["Field"],"mappings":";;;;AAqBO,MAAM,QAAQ,MAAM,WAAW,SAASA,OAAM,OAAmB,KAAkC;AAChG,QAAA,aAAa,MAAM,OAAwB,IAAI;AAE/C,QAAA,EAAE,UAAU,UAAU,UAAU,OAAO,UAAU,OAAO,SAAS,GAAG,WAAA,IAAe;AACzF,QAAM,YAAY;AAAA,IACd;AAAA,IACA;AAAA,MACI,iBAAiB;AAAA,IACrB;AAAA,IACA,MAAM;AAAA,EACV;AACM,QAAA,mBAAmB,GAAG,mEAAmE;AAAA,IAC3F,iBAAiB,CAAC,WAAW,CAAC;AAAA,IAC9B,gBAAgB;AAAA,IAChB,mBAAmB,WAAW,CAAC;AAAA,IAC/B,cAAc;AAAA,EAAA,CACjB;AAED,SACK,sBAAA,cAAA,SAAA,EAAO,GAAG,YAAY,WAAsB,aAAU,SAAQ,IAAA,GAC1D,UACA,WACI,sBAAA,cAAA,UAAA,EAAS,SAAS,WACf,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW;AAAA,MACX,aAAU;AAAA,MACV,KAAK;AAAA,MACL,MAAM,UAAU,UAAU;AAAA,IAAA;AAAA,IACzB;AAAA,EAAA,CAET,CAER;AAER,CAAC;"}
1
+ {"version":3,"file":"Field.js","sources":["../../../src/components/Field/Field.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport './Field.css';\nimport { Truncate } from '../Truncate/Truncate';\n\nexport type FieldProps = React.LabelHTMLAttributes<HTMLLabelElement> & {\n /** Content of the field */\n children: React.ReactNode;\n /**\tChanges the style to indicate the element is disabled */\n disabled?: boolean;\n /* Whether the input is in an invalid state */\n invalid?: boolean;\n /* Whether the input is in a warning state */\n warning?: boolean;\n /**\n * Text displayed below the children of Field.\n * Should be a short text that indicates feedback for user.\n */\n message?: string;\n};\n\nexport const Field = React.forwardRef(function Field(props: FieldProps, ref: React.Ref<HTMLLabelElement>) {\n const messageRef = React.useRef<HTMLSpanElement>(null);\n\n const { disabled, children, invalid = false, warning = false, message, ...otherProps } = props;\n const className = cn(\n 'flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]',\n {\n 'text-gray-300': disabled,\n },\n props.className\n );\n const messageClassName = cn('h-4 text-xs text-left leading-normal font-normal truncate -mb-4', {\n 'text-gray-700': !invalid && !warning,\n 'text-red-700': invalid,\n 'opacity-50': disabled,\n });\n\n return (\n <label {...otherProps} className={className} data-taco=\"label\" ref={ref}>\n {children}\n {message && (\n <Truncate tooltip={message}>\n <span\n className={messageClassName}\n data-taco=\"label-message\"\n ref={messageRef}\n role={invalid ? 'alert' : undefined}>\n {message}\n </span>\n </Truncate>\n )}\n </label>\n );\n});\n"],"names":["Field"],"mappings":";;;;AAqBO,MAAM,QAAQ,MAAM,WAAW,SAASA,OAAM,OAAmB,KAAkC;AAChG,QAAA,aAAa,MAAM,OAAwB,IAAI;AAE/C,QAAA,EAAE,UAAU,UAAU,UAAU,OAAO,UAAU,OAAO,SAAS,GAAG,WAAA,IAAe;AACzF,QAAM,YAAY;AAAA,IACd;AAAA,IACA;AAAA,MACI,iBAAiB;AAAA,IACrB;AAAA,IACA,MAAM;AAAA,EACV;AACM,QAAA,mBAAmB,GAAG,mEAAmE;AAAA,IAC3F,iBAAiB,CAAC,WAAW,CAAC;AAAA,IAC9B,gBAAgB;AAAA,IAChB,cAAc;AAAA,EAAA,CACjB;AAED,SACK,sBAAA,cAAA,SAAA,EAAO,GAAG,YAAY,WAAsB,aAAU,SAAQ,IAAA,GAC1D,UACA,WACI,sBAAA,cAAA,UAAA,EAAS,SAAS,WACf,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW;AAAA,MACX,aAAU;AAAA,MACV,KAAK;AAAA,MACL,MAAM,UAAU,UAAU;AAAA,IAAA;AAAA,IACzB;AAAA,EAAA,CAET,CAER;AAER,CAAC;"}
@@ -16,8 +16,8 @@ const getInputClasses = (props) => {
16
16
  // disabled
17
17
  "text-opacity-25 cursor-not-allowed placeholder:text-gray-500": disabled,
18
18
  // highlighted
19
- "bg-yellow-50/25": props.highlighted && disabled,
20
- "bg-yellow-50/50": props.highlighted && !disabled,
19
+ "bg-yellow-50 placeholder:text-yellow-300": props.highlighted && disabled,
20
+ "bg-yellow-100 placeholder:text-yellow-500": props.highlighted && !disabled,
21
21
  // invalid
22
22
  "border-red-500 enabled:hover:border-red-500 disabled:border-red-300/50": invalid,
23
23
  // readOnly
@@ -1 +1 @@
1
- {"version":3,"file":"util.cjs","sources":["../../../src/components/Input/util.ts"],"sourcesContent":["import cn from 'clsx';\n\ntype InputClassesProps = Pick<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'aria-disabled' | 'aria-readonly' | 'aria-invalid' | 'readOnly' | 'disabled'\n> & {\n invalid?: boolean;\n highlighted?: boolean;\n};\n\nexport const getInputClasses = (props: InputClassesProps) => {\n const disabled = props.disabled || !!props['aria-disabled'];\n const readOnly = props.readOnly || !!props['aria-readonly'];\n const invalid = props.invalid || !!props['aria-invalid'];\n\n return cn(\n 'peer text-black text-sm border font-normal not-italic no-underline rounded flex items-center leading-6 px-2 relative w-full text-ellipsis transition-colors transition-opacity ease-in min-h-[theme(spacing.8)] focus:yt-focus',\n // hide the arrow controls on input[type=number]\n '[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none',\n {\n 'bg-white': !props.highlighted && !readOnly,\n // default\n 'border-gray-200 enabled:hover:border-gray-300 disabled:border-gray-100': !invalid,\n // disabled\n 'text-opacity-25 cursor-not-allowed placeholder:text-gray-500': disabled,\n // highlighted\n 'bg-yellow-50/25': props.highlighted && disabled,\n 'bg-yellow-50/50': props.highlighted && !disabled,\n // invalid\n 'border-red-500 enabled:hover:border-red-500 disabled:border-red-300/50': invalid,\n // readOnly\n 'cursor-not-allowed text-black bg-gray-50': readOnly,\n }\n );\n};\n\nexport const getButtonStateClasses = (invalid: boolean | undefined, disabled = false): string => {\n if (invalid) {\n return cn('border border-red-500 group-peer-hover:enabled:border-red-700 transition-colors ease-in', {\n 'border-red-500/30': disabled,\n });\n }\n\n return 'border border-gray-200 group-peer-hover:enabled:border-gray-300 transition-colors transition-opacity ease-in';\n};\n"],"names":[],"mappings":";;;AAUa,MAAA,kBAAkB,CAAC,UAA6B;AACzD,QAAM,WAAW,MAAM,YAAY,CAAC,CAAC,MAAM,eAAe;AAC1D,QAAM,WAAW,MAAM,YAAY,CAAC,CAAC,MAAM,eAAe;AAC1D,QAAM,UAAU,MAAM,WAAW,CAAC,CAAC,MAAM,cAAc;AAEhD,SAAA;AAAA,IACH;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,MACI,YAAY,CAAC,MAAM,eAAe,CAAC;AAAA;AAAA,MAEnC,0EAA0E,CAAC;AAAA;AAAA,MAE3E,gEAAgE;AAAA;AAAA,MAEhE,mBAAmB,MAAM,eAAe;AAAA,MACxC,mBAAmB,MAAM,eAAe,CAAC;AAAA;AAAA,MAEzC,0EAA0E;AAAA;AAAA,MAE1E,4CAA4C;AAAA,IAAA;AAAA,EAEpD;AACJ;AAEO,MAAM,wBAAwB,CAAC,SAA8B,WAAW,UAAkB;AAC7F,MAAI,SAAS;AACT,WAAO,GAAG,2FAA2F;AAAA,MACjG,qBAAqB;AAAA,IAAA,CACxB;AAAA,EAAA;AAGE,SAAA;AACX;;;"}
1
+ {"version":3,"file":"util.cjs","sources":["../../../src/components/Input/util.ts"],"sourcesContent":["import cn from 'clsx';\n\ntype InputClassesProps = Pick<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'aria-disabled' | 'aria-readonly' | 'aria-invalid' | 'readOnly' | 'disabled'\n> & {\n invalid?: boolean;\n highlighted?: boolean;\n};\n\nexport const getInputClasses = (props: InputClassesProps) => {\n const disabled = props.disabled || !!props['aria-disabled'];\n const readOnly = props.readOnly || !!props['aria-readonly'];\n const invalid = props.invalid || !!props['aria-invalid'];\n\n return cn(\n 'peer text-black text-sm border font-normal not-italic no-underline rounded flex items-center leading-6 px-2 relative w-full text-ellipsis transition-colors transition-opacity ease-in min-h-[theme(spacing.8)] focus:yt-focus',\n // hide the arrow controls on input[type=number]\n '[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none',\n {\n 'bg-white': !props.highlighted && !readOnly,\n // default\n 'border-gray-200 enabled:hover:border-gray-300 disabled:border-gray-100': !invalid,\n // disabled\n 'text-opacity-25 cursor-not-allowed placeholder:text-gray-500': disabled,\n // highlighted\n 'bg-yellow-50 placeholder:text-yellow-300': props.highlighted && disabled,\n 'bg-yellow-100 placeholder:text-yellow-500': props.highlighted && !disabled,\n // invalid\n 'border-red-500 enabled:hover:border-red-500 disabled:border-red-300/50': invalid,\n // readOnly\n 'cursor-not-allowed text-black bg-gray-50': readOnly,\n }\n );\n};\n\nexport const getButtonStateClasses = (invalid: boolean | undefined, disabled = false): string => {\n if (invalid) {\n return cn('border border-red-500 group-peer-hover:enabled:border-red-700 transition-colors ease-in', {\n 'border-red-500/30': disabled,\n });\n }\n\n return 'border border-gray-200 group-peer-hover:enabled:border-gray-300 transition-colors transition-opacity ease-in';\n};\n"],"names":[],"mappings":";;;AAUa,MAAA,kBAAkB,CAAC,UAA6B;AACzD,QAAM,WAAW,MAAM,YAAY,CAAC,CAAC,MAAM,eAAe;AAC1D,QAAM,WAAW,MAAM,YAAY,CAAC,CAAC,MAAM,eAAe;AAC1D,QAAM,UAAU,MAAM,WAAW,CAAC,CAAC,MAAM,cAAc;AAEhD,SAAA;AAAA,IACH;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,MACI,YAAY,CAAC,MAAM,eAAe,CAAC;AAAA;AAAA,MAEnC,0EAA0E,CAAC;AAAA;AAAA,MAE3E,gEAAgE;AAAA;AAAA,MAEhE,4CAA4C,MAAM,eAAe;AAAA,MACjE,6CAA6C,MAAM,eAAe,CAAC;AAAA;AAAA,MAEnE,0EAA0E;AAAA;AAAA,MAE1E,4CAA4C;AAAA,IAAA;AAAA,EAEpD;AACJ;AAEO,MAAM,wBAAwB,CAAC,SAA8B,WAAW,UAAkB;AAC7F,MAAI,SAAS;AACT,WAAO,GAAG,2FAA2F;AAAA,MACjG,qBAAqB;AAAA,IAAA,CACxB;AAAA,EAAA;AAGE,SAAA;AACX;;;"}
@@ -14,8 +14,8 @@ const getInputClasses = (props) => {
14
14
  // disabled
15
15
  "text-opacity-25 cursor-not-allowed placeholder:text-gray-500": disabled,
16
16
  // highlighted
17
- "bg-yellow-50/25": props.highlighted && disabled,
18
- "bg-yellow-50/50": props.highlighted && !disabled,
17
+ "bg-yellow-50 placeholder:text-yellow-300": props.highlighted && disabled,
18
+ "bg-yellow-100 placeholder:text-yellow-500": props.highlighted && !disabled,
19
19
  // invalid
20
20
  "border-red-500 enabled:hover:border-red-500 disabled:border-red-300/50": invalid,
21
21
  // readOnly
@@ -1 +1 @@
1
- {"version":3,"file":"util.js","sources":["../../../src/components/Input/util.ts"],"sourcesContent":["import cn from 'clsx';\n\ntype InputClassesProps = Pick<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'aria-disabled' | 'aria-readonly' | 'aria-invalid' | 'readOnly' | 'disabled'\n> & {\n invalid?: boolean;\n highlighted?: boolean;\n};\n\nexport const getInputClasses = (props: InputClassesProps) => {\n const disabled = props.disabled || !!props['aria-disabled'];\n const readOnly = props.readOnly || !!props['aria-readonly'];\n const invalid = props.invalid || !!props['aria-invalid'];\n\n return cn(\n 'peer text-black text-sm border font-normal not-italic no-underline rounded flex items-center leading-6 px-2 relative w-full text-ellipsis transition-colors transition-opacity ease-in min-h-[theme(spacing.8)] focus:yt-focus',\n // hide the arrow controls on input[type=number]\n '[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none',\n {\n 'bg-white': !props.highlighted && !readOnly,\n // default\n 'border-gray-200 enabled:hover:border-gray-300 disabled:border-gray-100': !invalid,\n // disabled\n 'text-opacity-25 cursor-not-allowed placeholder:text-gray-500': disabled,\n // highlighted\n 'bg-yellow-50/25': props.highlighted && disabled,\n 'bg-yellow-50/50': props.highlighted && !disabled,\n // invalid\n 'border-red-500 enabled:hover:border-red-500 disabled:border-red-300/50': invalid,\n // readOnly\n 'cursor-not-allowed text-black bg-gray-50': readOnly,\n }\n );\n};\n\nexport const getButtonStateClasses = (invalid: boolean | undefined, disabled = false): string => {\n if (invalid) {\n return cn('border border-red-500 group-peer-hover:enabled:border-red-700 transition-colors ease-in', {\n 'border-red-500/30': disabled,\n });\n }\n\n return 'border border-gray-200 group-peer-hover:enabled:border-gray-300 transition-colors transition-opacity ease-in';\n};\n"],"names":[],"mappings":";AAUa,MAAA,kBAAkB,CAAC,UAA6B;AACzD,QAAM,WAAW,MAAM,YAAY,CAAC,CAAC,MAAM,eAAe;AAC1D,QAAM,WAAW,MAAM,YAAY,CAAC,CAAC,MAAM,eAAe;AAC1D,QAAM,UAAU,MAAM,WAAW,CAAC,CAAC,MAAM,cAAc;AAEhD,SAAA;AAAA,IACH;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,MACI,YAAY,CAAC,MAAM,eAAe,CAAC;AAAA;AAAA,MAEnC,0EAA0E,CAAC;AAAA;AAAA,MAE3E,gEAAgE;AAAA;AAAA,MAEhE,mBAAmB,MAAM,eAAe;AAAA,MACxC,mBAAmB,MAAM,eAAe,CAAC;AAAA;AAAA,MAEzC,0EAA0E;AAAA;AAAA,MAE1E,4CAA4C;AAAA,IAAA;AAAA,EAEpD;AACJ;AAEO,MAAM,wBAAwB,CAAC,SAA8B,WAAW,UAAkB;AAC7F,MAAI,SAAS;AACT,WAAO,GAAG,2FAA2F;AAAA,MACjG,qBAAqB;AAAA,IAAA,CACxB;AAAA,EAAA;AAGE,SAAA;AACX;"}
1
+ {"version":3,"file":"util.js","sources":["../../../src/components/Input/util.ts"],"sourcesContent":["import cn from 'clsx';\n\ntype InputClassesProps = Pick<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'aria-disabled' | 'aria-readonly' | 'aria-invalid' | 'readOnly' | 'disabled'\n> & {\n invalid?: boolean;\n highlighted?: boolean;\n};\n\nexport const getInputClasses = (props: InputClassesProps) => {\n const disabled = props.disabled || !!props['aria-disabled'];\n const readOnly = props.readOnly || !!props['aria-readonly'];\n const invalid = props.invalid || !!props['aria-invalid'];\n\n return cn(\n 'peer text-black text-sm border font-normal not-italic no-underline rounded flex items-center leading-6 px-2 relative w-full text-ellipsis transition-colors transition-opacity ease-in min-h-[theme(spacing.8)] focus:yt-focus',\n // hide the arrow controls on input[type=number]\n '[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none',\n {\n 'bg-white': !props.highlighted && !readOnly,\n // default\n 'border-gray-200 enabled:hover:border-gray-300 disabled:border-gray-100': !invalid,\n // disabled\n 'text-opacity-25 cursor-not-allowed placeholder:text-gray-500': disabled,\n // highlighted\n 'bg-yellow-50 placeholder:text-yellow-300': props.highlighted && disabled,\n 'bg-yellow-100 placeholder:text-yellow-500': props.highlighted && !disabled,\n // invalid\n 'border-red-500 enabled:hover:border-red-500 disabled:border-red-300/50': invalid,\n // readOnly\n 'cursor-not-allowed text-black bg-gray-50': readOnly,\n }\n );\n};\n\nexport const getButtonStateClasses = (invalid: boolean | undefined, disabled = false): string => {\n if (invalid) {\n return cn('border border-red-500 group-peer-hover:enabled:border-red-700 transition-colors ease-in', {\n 'border-red-500/30': disabled,\n });\n }\n\n return 'border border-gray-200 group-peer-hover:enabled:border-gray-300 transition-colors transition-opacity ease-in';\n};\n"],"names":[],"mappings":";AAUa,MAAA,kBAAkB,CAAC,UAA6B;AACzD,QAAM,WAAW,MAAM,YAAY,CAAC,CAAC,MAAM,eAAe;AAC1D,QAAM,WAAW,MAAM,YAAY,CAAC,CAAC,MAAM,eAAe;AAC1D,QAAM,UAAU,MAAM,WAAW,CAAC,CAAC,MAAM,cAAc;AAEhD,SAAA;AAAA,IACH;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,MACI,YAAY,CAAC,MAAM,eAAe,CAAC;AAAA;AAAA,MAEnC,0EAA0E,CAAC;AAAA;AAAA,MAE3E,gEAAgE;AAAA;AAAA,MAEhE,4CAA4C,MAAM,eAAe;AAAA,MACjE,6CAA6C,MAAM,eAAe,CAAC;AAAA;AAAA,MAEnE,0EAA0E;AAAA;AAAA,MAE1E,4CAA4C;AAAA,IAAA;AAAA,EAEpD;AACJ;AAEO,MAAM,wBAAwB,CAAC,SAA8B,WAAW,UAAkB;AAC7F,MAAI,SAAS;AACT,WAAO,GAAG,2FAA2F;AAAA,MACjG,qBAAqB;AAAA,IAAA,CACxB;AAAA,EAAA;AAGE,SAAA;AACX;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@economic/taco",
3
- "version": "8.1.3-EC-82626-test-release.0",
3
+ "version": "8.1.3",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",
@@ -46,7 +46,7 @@
46
46
  "@dnd-kit/modifiers": "^7.0.0",
47
47
  "@dnd-kit/sortable": "^7.0.2",
48
48
  "@dnd-kit/utilities": "^3.2.2",
49
- "@economic/taco-tokens": "^2.2.5-EC-82626-test-release.0",
49
+ "@economic/taco-tokens": "^2.2.5",
50
50
  "@radix-ui/react-popover": "1.0.2",
51
51
  "@radix-ui/react-scroll-area": "1.2.10",
52
52
  "@react-aria/focus": "^3.19.0",
@@ -102,5 +102,5 @@
102
102
  "optionalDependencies": {
103
103
  "@rollup/rollup-linux-x64-gnu": "^4.62.0"
104
104
  },
105
- "gitHead": "a0b09caea77b51063aef06ebbea567e324244a9a"
105
+ "gitHead": "9fa6d89e7c0ea019696302097431be360635b217"
106
106
  }