@economic/taco 0.0.26-alpha.8 → 0.0.26-alpha.9
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.
- package/dist/esm/components/Field/Field.js +3 -2
- package/dist/esm/components/Field/Field.js.map +1 -1
- package/dist/taco.cjs.development.js +3 -2
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -2
|
@@ -18,8 +18,9 @@ var Field = /*#__PURE__*/forwardRef(function Field(props, ref) {
|
|
|
18
18
|
var idRef = useRef((_children$props$id = children === null || children === void 0 ? void 0 : (_children$props = children.props) === null || _children$props === void 0 ? void 0 : _children$props.id) !== null && _children$props$id !== void 0 ? _children$props$id : v4());
|
|
19
19
|
var isInvalid = (_children$props$inval = children === null || children === void 0 ? void 0 : (_children$props2 = children.props) === null || _children$props2 === void 0 ? void 0 : _children$props2.invalid) !== null && _children$props$inval !== void 0 ? _children$props$inval : invalid;
|
|
20
20
|
var isRequired = (_children$props$requi = children === null || children === void 0 ? void 0 : (_children$props3 = children.props) === null || _children$props3 === void 0 ? void 0 : _children$props3.required) !== null && _children$props$requi !== void 0 ? _children$props$requi : required;
|
|
21
|
-
var className = cn('flex flex-col
|
|
22
|
-
'pt-5': !label
|
|
21
|
+
var className = cn('flex flex-col', {
|
|
22
|
+
'pt-5': !label,
|
|
23
|
+
'mb-4': !message
|
|
23
24
|
}, props.className);
|
|
24
25
|
var labelClassName = cn('font-bold text-xs leading-4 h-4 truncate mb-1', {
|
|
25
26
|
'text-grey-dark': disabled
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Field.js","sources":["../../../../src/components/Field/Field.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { v4 as uuid } from 'uuid';\nimport './Field.css';\n\nexport type FieldProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n children: JSX.Element;\n disabled?: boolean;\n invalid?: boolean;\n label?: string | JSX.Element;\n message?: string | JSX.Element;\n required?: boolean;\n};\n\nexport const Field = React.forwardRef(function Field(props: FieldProps, ref: React.Ref<HTMLDivElement>) {\n const { children, disabled, invalid, label, message, required, ...otherProps } = props;\n const idRef = React.useRef(children?.props?.id ?? uuid());\n const isInvalid = children?.props?.invalid ?? invalid;\n const isRequired = children?.props?.required ?? required;\n const className = cn(\n 'flex flex-col
|
|
1
|
+
{"version":3,"file":"Field.js","sources":["../../../../src/components/Field/Field.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { v4 as uuid } from 'uuid';\nimport './Field.css';\n\nexport type FieldProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n children: JSX.Element;\n disabled?: boolean;\n invalid?: boolean;\n label?: string | JSX.Element;\n message?: string | JSX.Element;\n required?: boolean;\n};\n\nexport const Field = React.forwardRef(function Field(props: FieldProps, ref: React.Ref<HTMLDivElement>) {\n const { children, disabled, invalid, label, message, required, ...otherProps } = props;\n const idRef = React.useRef(children?.props?.id ?? uuid());\n const isInvalid = children?.props?.invalid ?? invalid;\n const isRequired = children?.props?.required ?? required;\n const className = cn(\n 'flex flex-col',\n {\n 'pt-5': !label,\n 'mb-4': !message,\n },\n props.className\n );\n\n const labelClassName = cn('font-bold text-xs leading-4 h-4 truncate mb-1', {\n 'text-grey-dark': disabled,\n });\n\n const messageClassName = cn('text-xs leading-normal truncate flex-none', {\n 'text-grey-darkest': !isInvalid,\n 'text-red': isInvalid,\n 'opacity-50': disabled,\n });\n\n if (!label && !children?.props['aria-label']) {\n console.warn(\n 'TACO - You are creating a Field without a `label`, you must pass an `aria-label` to the Field child to provide an accessible experience for our users.'\n );\n }\n\n return (\n <div {...otherProps} className={className} data-taco=\"field\" ref={ref}>\n {label && (\n <label htmlFor={idRef.current} className={labelClassName} data-taco=\"label\">\n {label}\n {isRequired ? '*' : ''}\n </label>\n )}\n {idRef.current !== children?.props?.id ? React.cloneElement(children, { id: idRef.current }) : children}\n {message && (\n <span className={messageClassName} role={isInvalid ? 'alert' : undefined}>\n {message}\n </span>\n )}\n </div>\n );\n});\n"],"names":["Field","React","props","ref","children","disabled","invalid","label","message","required","otherProps","idRef","id","uuid","isInvalid","isRequired","className","cn","labelClassName","messageClassName","console","warn","htmlFor","current","role","undefined"],"mappings":";;;;;;IAcaA,KAAK,gBAAGC,UAAA,CAAiB,SAASD,KAAT,CAAeE,KAAf,EAAkCC,GAAlC;;;AAClC,MAAQC,QAAR,GAAiFF,KAAjF,CAAQE,QAAR;AAAA,MAAkBC,QAAlB,GAAiFH,KAAjF,CAAkBG,QAAlB;AAAA,MAA4BC,OAA5B,GAAiFJ,KAAjF,CAA4BI,OAA5B;AAAA,MAAqCC,KAArC,GAAiFL,KAAjF,CAAqCK,KAArC;AAAA,MAA4CC,OAA5C,GAAiFN,KAAjF,CAA4CM,OAA5C;AAAA,MAAqDC,QAArD,GAAiFP,KAAjF,CAAqDO,QAArD;AAAA,MAAkEC,UAAlE,iCAAiFR,KAAjF;;AACA,MAAMS,KAAK,GAAGV,MAAA,uBAAaG,QAAb,aAAaA,QAAb,0CAAaA,QAAQ,CAAEF,KAAvB,oDAAa,gBAAiBU,EAA9B,mEAAoCC,EAAI,EAAxC,CAAd;AACA,MAAMC,SAAS,4BAAGV,QAAH,aAAGA,QAAH,2CAAGA,QAAQ,CAAEF,KAAb,qDAAG,iBAAiBI,OAApB,yEAA+BA,OAA9C;AACA,MAAMS,UAAU,4BAAGX,QAAH,aAAGA,QAAH,2CAAGA,QAAQ,CAAEF,KAAb,qDAAG,iBAAiBO,QAApB,yEAAgCA,QAAhD;AACA,MAAMO,SAAS,GAAGC,EAAE,CAChB,eADgB,EAEhB;AACI,YAAQ,CAACV,KADb;AAEI,YAAQ,CAACC;AAFb,GAFgB,EAMhBN,KAAK,CAACc,SANU,CAApB;AASA,MAAME,cAAc,GAAGD,EAAE,CAAC,+CAAD,EAAkD;AACvE,sBAAkBZ;AADqD,GAAlD,CAAzB;AAIA,MAAMc,gBAAgB,GAAGF,EAAE,CAAC,2CAAD,EAA8C;AACrE,yBAAqB,CAACH,SAD+C;AAErE,gBAAYA,SAFyD;AAGrE,kBAAcT;AAHuD,GAA9C,CAA3B;;AAMA,MAAI,CAACE,KAAD,IAAU,EAACH,QAAD,aAACA,QAAD,eAACA,QAAQ,CAAEF,KAAV,CAAgB,YAAhB,CAAD,CAAd,EAA8C;AAC1CkB,IAAAA,OAAO,CAACC,IAAR,CACI,wJADJ;AAGH;;AAED,SACIpB,aAAA,MAAA,oBAASS;AAAYM,IAAAA,SAAS,EAAEA;iBAAqB;AAAQb,IAAAA,GAAG,EAAEA;IAAlE,EACKI,KAAK,IACFN,aAAA,QAAA;AAAOqB,IAAAA,OAAO,EAAEX,KAAK,CAACY;AAASP,IAAAA,SAAS,EAAEE;iBAA0B;GAApE,EACKX,KADL,EAEKQ,UAAU,GAAG,GAAH,GAAS,EAFxB,CAFR,EAOKJ,KAAK,CAACY,OAAN,MAAkBnB,QAAlB,aAAkBA,QAAlB,2CAAkBA,QAAQ,CAAEF,KAA5B,qDAAkB,iBAAiBU,EAAnC,IAAwCX,YAAA,CAAmBG,QAAnB,EAA6B;AAAEQ,IAAAA,EAAE,EAAED,KAAK,CAACY;AAAZ,GAA7B,CAAxC,GAA8FnB,QAPnG,EAQKI,OAAO,IACJP,aAAA,OAAA;AAAMe,IAAAA,SAAS,EAAEG;AAAkBK,IAAAA,IAAI,EAAEV,SAAS,GAAG,OAAH,GAAaW;GAA/D,EACKjB,OADL,CATR,CADJ;AAgBH,CA9CoB;;;;"}
|
|
@@ -5955,8 +5955,9 @@ var Field = /*#__PURE__*/React.forwardRef(function Field(props, ref) {
|
|
|
5955
5955
|
var idRef = React.useRef((_children$props$id = children === null || children === void 0 ? void 0 : (_children$props = children.props) === null || _children$props === void 0 ? void 0 : _children$props.id) !== null && _children$props$id !== void 0 ? _children$props$id : uuid.v4());
|
|
5956
5956
|
var isInvalid = (_children$props$inval = children === null || children === void 0 ? void 0 : (_children$props2 = children.props) === null || _children$props2 === void 0 ? void 0 : _children$props2.invalid) !== null && _children$props$inval !== void 0 ? _children$props$inval : invalid;
|
|
5957
5957
|
var isRequired = (_children$props$requi = children === null || children === void 0 ? void 0 : (_children$props3 = children.props) === null || _children$props3 === void 0 ? void 0 : _children$props3.required) !== null && _children$props$requi !== void 0 ? _children$props$requi : required;
|
|
5958
|
-
var className = cn('flex flex-col
|
|
5959
|
-
'pt-5': !label
|
|
5958
|
+
var className = cn('flex flex-col', {
|
|
5959
|
+
'pt-5': !label,
|
|
5960
|
+
'mb-4': !message
|
|
5960
5961
|
}, props.className);
|
|
5961
5962
|
var labelClassName = cn('font-bold text-xs leading-4 h-4 truncate mb-1', {
|
|
5962
5963
|
'text-grey-dark': disabled
|