@cimpress-ui/react 1.7.0 → 1.7.1

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.
@@ -3,7 +3,7 @@ import { type TextAreaProps as RACTextAreaProps, type TextFieldProps as RACTextF
3
3
  import type { CommonProps, FieldWithPlaceholderProps } from '../types.js';
4
4
  export interface TextAreaProps extends CommonProps, FieldWithPlaceholderProps<string>, Pick<RACTextFieldProps, 'value' | 'defaultValue' | 'onChange' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'type' | 'autoFocus' | 'autoComplete' | 'inputMode' | 'minLength' | 'maxLength' | 'onFocus' | 'onBlur' | 'onKeyDown'>, Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {
5
5
  /** A React ref that allows access to the imperative API of this component. */
6
- apiRef?: RefObject<TextAreaApi>;
6
+ apiRef?: RefObject<TextAreaApi | null>;
7
7
  }
8
8
  /** The imperative API exposed by the `TextArea` component. */
9
9
  export interface TextAreaApi {
@@ -1 +1 @@
1
- {"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,SAAS,EAAkD,MAAM,OAAO,CAAC;AACvF,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,cAAc,IAAI,iBAAiB,EAEzC,MAAM,uBAAuB,CAAC;AAK/B,OAAO,KAAK,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG1E,MAAM,WAAW,aACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,QAAQ,GACR,WAAW,CACd,EACD,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,MAAM,CAAC;IAC3F,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;CACjC;AAED,8DAA8D;AAC9D,MAAM,WAAW,WAAW;IAC1B,6BAA6B;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,6CAA6C;IAC7C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAkED;;;;GAIG;AACH,QAAA,MAAM,SAAS,+JAAmD,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC"}
1
+ {"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,SAAS,EAAkD,MAAM,OAAO,CAAC;AACvF,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,cAAc,IAAI,iBAAiB,EAEzC,MAAM,uBAAuB,CAAC;AAK/B,OAAO,KAAK,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG1E,MAAM,WAAW,aACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,QAAQ,GACR,WAAW,CACd,EACD,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,MAAM,CAAC;IAC3F,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACxC;AAED,8DAA8D;AAC9D,MAAM,WAAW,WAAW;IAC1B,6BAA6B;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,6CAA6C;IAC7C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAkED;;;;GAIG;AACH,QAAA,MAAM,SAAS,+JAAmD,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAuF;AACvF,iEAM+B;AAC/B,yDAAkD;AAClD,qFAA6E;AAC7E,mEAA2D;AAC3D,wEAA4G;AAE5G,qDAAmD;AAqCnD,SAAS,QAAQ,CACf,EACE,KAAK,EACL,WAAW,EACX,KAAK,EAAE,YAAY,EACnB,WAAW,EACX,cAAc,EACd,WAAW,EACX,IAAI,EACJ,UAAU,EACV,IAAI,EACJ,gBAAgB,EAChB,YAAY,EACZ,MAAM,EACN,GAAG,KAAK,EACM,EAChB,GAAiC;IAEjC,MAAM,WAAW,GAAG,IAAA,cAAM,EAAsB,IAAI,CAAC,CAAC;IAEtD,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,IAAA,gDAAoB,EAAC,GAAG,EAAE;QACxB,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5C,OAAO,CAAC,IAAI,CAAC,iFAAiF,CAAC,CAAC;QAClG,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,IAAA,2BAAmB,EACjB,MAAM,EACN,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE;QACzC,MAAM,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE;KAC5C,CAAC,EACF,EAAE,CACH,CAAC;IAEF,OAAO,CACL,uBAAC,iCAAY,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,YACvG,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,CAC/B,6DACE,uBAAC,8BAAc,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,YAC3D,KAAK,GACS,EACjB,uBAAC,6BAAQ,IAAC,SAAS,EAAC,2BAA2B,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE,YACzF,uBAAC,gCAAW,IACV,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,IAAA,cAAI,EAAC,qBAAqB,EAAE,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,EACtE,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,GACV,GACO,EACX,uBAAC,8BAAc,cAAE,YAAY,GAAkB,EAC/C,uBAAC,oCAAoB,cAAE,WAAW,GAAwB,IACzD,CACJ,GACY,CAChB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,SAAS,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC;AAE7C,6BAAQ","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { type RefObject, useRef, type ForwardedRef, useImperativeHandle } from 'react';\nimport {\n TextArea as RACTextArea,\n TextField as RACTextField,\n type TextAreaProps as RACTextAreaProps,\n type TextFieldProps as RACTextFieldProps,\n Group as RACGroup,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type { CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextAreaProps\n extends CommonProps,\n FieldWithPlaceholderProps<string>,\n Pick<\n RACTextFieldProps,\n | 'value'\n | 'defaultValue'\n | 'onChange'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'type'\n | 'autoFocus'\n | 'autoComplete'\n | 'inputMode'\n | 'minLength'\n | 'maxLength'\n | 'onFocus'\n | 'onBlur'\n | 'onKeyDown'\n >,\n Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {\n /** A React ref that allows access to the imperative API of this component. */\n apiRef?: RefObject<TextAreaApi>;\n}\n\n/** The imperative API exposed by the `TextArea` component. */\nexport interface TextAreaApi {\n /** Focuses the text area. */\n focus: () => void;\n /** Selects the contents of the text area. */\n select: () => void;\n}\n\nfunction TextArea(\n {\n label,\n description,\n error: errorMessage,\n placeholder,\n autoCapitalize,\n autoCorrect,\n rows,\n spellCheck,\n wrap,\n UNSAFE_className,\n UNSAFE_style,\n apiRef,\n ...props\n }: TextAreaProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('TextArea requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => textAreaRef.current?.focus(),\n select: () => textAreaRef.current?.select(),\n }),\n [],\n );\n\n return (\n <RACTextField {...props} ref={ref} className={clsx('cim-text-area', UNSAFE_className)} style={UNSAFE_style}>\n {({ isDisabled, isRequired }) => (\n <>\n <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-text-area-input-group\" onClick={() => textAreaRef.current?.focus()}>\n <RACTextArea\n ref={textAreaRef}\n className={clsx('cim-text-area-input', textStyle({ variant: 'body' }))}\n placeholder={placeholder}\n autoCapitalize={autoCapitalize}\n autoCorrect={autoCorrect}\n rows={rows}\n spellCheck={spellCheck}\n wrap={wrap}\n />\n </RACGroup>\n <FormFieldError>{errorMessage}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n </>\n )}\n </RACTextField>\n );\n}\n\n/**\n * Allows users to enter multiple lines of text with a keyboard.\n *\n * See [text area usage guidelines](https://ui.cimpress.io/components/text-area/).\n */\nconst _TextArea = withStyleProps(forwardRef(TextArea), 'TextArea');\n\nexport { _TextArea as TextArea };\n"]}
1
+ {"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAuF;AACvF,iEAM+B;AAC/B,yDAAkD;AAClD,qFAA6E;AAC7E,mEAA2D;AAC3D,wEAA4G;AAE5G,qDAAmD;AAqCnD,SAAS,QAAQ,CACf,EACE,KAAK,EACL,WAAW,EACX,KAAK,EAAE,YAAY,EACnB,WAAW,EACX,cAAc,EACd,WAAW,EACX,IAAI,EACJ,UAAU,EACV,IAAI,EACJ,gBAAgB,EAChB,YAAY,EACZ,MAAM,EACN,GAAG,KAAK,EACM,EAChB,GAAiC;IAEjC,MAAM,WAAW,GAAG,IAAA,cAAM,EAAsB,IAAI,CAAC,CAAC;IAEtD,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,IAAA,gDAAoB,EAAC,GAAG,EAAE;QACxB,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5C,OAAO,CAAC,IAAI,CAAC,iFAAiF,CAAC,CAAC;QAClG,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,IAAA,2BAAmB,EACjB,MAAM,EACN,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE;QACzC,MAAM,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE;KAC5C,CAAC,EACF,EAAE,CACH,CAAC;IAEF,OAAO,CACL,uBAAC,iCAAY,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,YACvG,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,CAC/B,6DACE,uBAAC,8BAAc,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,YAC3D,KAAK,GACS,EACjB,uBAAC,6BAAQ,IAAC,SAAS,EAAC,2BAA2B,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE,YACzF,uBAAC,gCAAW,IACV,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,IAAA,cAAI,EAAC,qBAAqB,EAAE,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,EACtE,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,GACV,GACO,EACX,uBAAC,8BAAc,cAAE,YAAY,GAAkB,EAC/C,uBAAC,oCAAoB,cAAE,WAAW,GAAwB,IACzD,CACJ,GACY,CAChB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,SAAS,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC;AAE7C,6BAAQ","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { type RefObject, useRef, type ForwardedRef, useImperativeHandle } from 'react';\nimport {\n TextArea as RACTextArea,\n TextField as RACTextField,\n type TextAreaProps as RACTextAreaProps,\n type TextFieldProps as RACTextFieldProps,\n Group as RACGroup,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type { CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextAreaProps\n extends CommonProps,\n FieldWithPlaceholderProps<string>,\n Pick<\n RACTextFieldProps,\n | 'value'\n | 'defaultValue'\n | 'onChange'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'type'\n | 'autoFocus'\n | 'autoComplete'\n | 'inputMode'\n | 'minLength'\n | 'maxLength'\n | 'onFocus'\n | 'onBlur'\n | 'onKeyDown'\n >,\n Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {\n /** A React ref that allows access to the imperative API of this component. */\n apiRef?: RefObject<TextAreaApi | null>;\n}\n\n/** The imperative API exposed by the `TextArea` component. */\nexport interface TextAreaApi {\n /** Focuses the text area. */\n focus: () => void;\n /** Selects the contents of the text area. */\n select: () => void;\n}\n\nfunction TextArea(\n {\n label,\n description,\n error: errorMessage,\n placeholder,\n autoCapitalize,\n autoCorrect,\n rows,\n spellCheck,\n wrap,\n UNSAFE_className,\n UNSAFE_style,\n apiRef,\n ...props\n }: TextAreaProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('TextArea requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => textAreaRef.current?.focus(),\n select: () => textAreaRef.current?.select(),\n }),\n [],\n );\n\n return (\n <RACTextField {...props} ref={ref} className={clsx('cim-text-area', UNSAFE_className)} style={UNSAFE_style}>\n {({ isDisabled, isRequired }) => (\n <>\n <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-text-area-input-group\" onClick={() => textAreaRef.current?.focus()}>\n <RACTextArea\n ref={textAreaRef}\n className={clsx('cim-text-area-input', textStyle({ variant: 'body' }))}\n placeholder={placeholder}\n autoCapitalize={autoCapitalize}\n autoCorrect={autoCorrect}\n rows={rows}\n spellCheck={spellCheck}\n wrap={wrap}\n />\n </RACGroup>\n <FormFieldError>{errorMessage}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n </>\n )}\n </RACTextField>\n );\n}\n\n/**\n * Allows users to enter multiple lines of text with a keyboard.\n *\n * See [text area usage guidelines](https://ui.cimpress.io/components/text-area/).\n */\nconst _TextArea = withStyleProps(forwardRef(TextArea), 'TextArea');\n\nexport { _TextArea as TextArea };\n"]}
@@ -8,7 +8,7 @@ export interface TextFieldProps extends CommonProps, FieldWithPlaceholderProps<s
8
8
  */
9
9
  isClearable?: boolean;
10
10
  /** A React ref that allows access to the imperative API of this component. */
11
- apiRef?: RefObject<TextFieldApi>;
11
+ apiRef?: RefObject<TextFieldApi | null>;
12
12
  }
13
13
  /** The imperative API exposed by the `TextField` component. */
14
14
  export interface TextFieldApi {
@@ -1 +1 @@
1
- {"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAyC,KAAK,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC3G,OAAO,EACL,KAAK,cAAc,IAAI,iBAAiB,EAIzC,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGtF,MAAM,WAAW,cACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,UAAU,EACV,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,SAAS,GACT,QAAQ,GACR,WAAW,CACd;IACH;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;CAClC;AAED,+DAA+D;AAC/D,MAAM,WAAW,YAAY;IAC3B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,+CAA+C;IAC/C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAmID;;;;GAIG;AACH,QAAA,MAAM,UAAU,gKAAqD,CAAC;AAEtE,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}
1
+ {"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAyC,KAAK,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC3G,OAAO,EACL,KAAK,cAAc,IAAI,iBAAiB,EAIzC,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGtF,MAAM,WAAW,cACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,UAAU,EACV,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,SAAS,GACT,QAAQ,GACR,WAAW,CACd;IACH;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;CACzC;AAED,+DAA+D;AAC/D,MAAM,WAAW,YAAY;IAC3B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,+CAA+C;IAC/C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAmID;;;;GAIG;AACH,QAAA,MAAM,UAAU,gKAAqD,CAAC;AAEtE,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useId } from '@react-aria/utils';\nimport { useControlledState } from '@react-stately/utils';\nimport clsx from 'clsx';\nimport { type ForwardedRef, type KeyboardEvent, type RefObject, useImperativeHandle, useRef } from 'react';\nimport {\n type TextFieldProps as RACTextFieldProps,\n Group as RACGroup,\n Input as RACInput,\n TextField as RACTextField,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/localization-provider.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport type { AffixProps, CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextFieldProps\n extends CommonProps,\n FieldWithPlaceholderProps<string>,\n AffixProps,\n Pick<\n RACTextFieldProps,\n | 'value'\n | 'defaultValue'\n | 'onChange'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'type'\n | 'autoFocus'\n | 'autoComplete'\n | 'inputMode'\n | 'minLength'\n | 'maxLength'\n | 'pattern'\n | 'onFocus'\n | 'onBlur'\n | 'onKeyDown'\n > {\n /**\n * Whether to render a button that can be used to clear the text field.\n * @default false\n */\n isClearable?: boolean;\n /** A React ref that allows access to the imperative API of this component. */\n apiRef?: RefObject<TextFieldApi>;\n}\n\n/** The imperative API exposed by the `TextField` component. */\nexport interface TextFieldApi {\n /** Focuses the input field. */\n focus: () => void;\n /** Selects the contents of the input field. */\n select: () => void;\n}\n\nfunction TextField(\n {\n label,\n description,\n error: errorMessage,\n placeholder,\n prefix,\n suffix,\n UNSAFE_className,\n UNSAFE_style,\n isClearable = false,\n value: consumerValue,\n defaultValue: consumerDefaultValue,\n onChange,\n apiRef,\n ...props\n }: TextFieldProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const { isDisabled, isReadOnly } = props;\n const inputRef = useRef<HTMLInputElement>(null);\n const [value, setValue] = useControlledState(consumerValue, consumerDefaultValue ?? '', onChange);\n const messages = useLocalizedMessages('common');\n const clearDescriptionId = useId();\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => inputRef.current?.focus(),\n select: () => inputRef.current?.select(),\n }),\n [],\n );\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n const isFieldClearable = isClearable && !isDisabled && !isReadOnly;\n\n function onKeyDown(e: KeyboardEvent) {\n if (!isFieldClearable) {\n return;\n }\n\n if (e.key === 'Escape') {\n e.preventDefault();\n\n setValue('');\n }\n }\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('TextField requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n return (\n <RACTextField\n {...props}\n ref={ref}\n className={clsx('cim-text-field', UNSAFE_className)}\n style={UNSAFE_style}\n value={value}\n onChange={setValue}\n aria-describedby={[props['aria-describedby'], isFieldClearable ? clearDescriptionId : undefined]\n .filter(Boolean)\n .join(' ')}\n >\n {({ isDisabled, isRequired }) => (\n <>\n <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-text-field-input-group\" onClick={() => inputRef.current?.focus()}>\n {prefix && (\n <div\n className={clsx(\n 'cim-text-field-affix',\n textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n )}\n aria-hidden\n >\n {prefix}\n </div>\n )}\n\n <RACInput\n ref={inputRef}\n className={clsx('cim-text-field-input', textStyle({ variant: 'body' }))}\n placeholder={placeholder}\n onKeyDown={onKeyDown}\n />\n\n {isFieldClearable && value !== '' && (\n <XButton\n slot={null}\n UNSAFE_className=\"cim-text-field-clear\"\n aria-label={messages.format('clearValue')}\n onPress={() => setValue('')}\n iconType=\"circled\"\n excludeFromTabOrder\n />\n )}\n\n {suffix && (\n <div\n className={clsx(\n 'cim-text-field-affix',\n textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n )}\n aria-hidden\n >\n {suffix}\n </div>\n )}\n </RACGroup>\n <FormFieldError>{errorMessage}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n {isFieldClearable && (\n <p id={clearDescriptionId} className=\"cim-text-field-clear-description\" hidden>\n {messages.format('clearValueDescription')}\n </p>\n )}\n </>\n )}\n </RACTextField>\n );\n}\n\n/**\n * Allows users to enter a single line of text with a keyboard.\n *\n * See [text field usage guidelines](https://ui.cimpress.io/components/text-field/).\n */\nconst _TextField = withStyleProps(forwardRef(TextField), 'TextField');\n\nexport { _TextField as TextField };\n"]}
1
+ {"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useId } from '@react-aria/utils';\nimport { useControlledState } from '@react-stately/utils';\nimport clsx from 'clsx';\nimport { type ForwardedRef, type KeyboardEvent, type RefObject, useImperativeHandle, useRef } from 'react';\nimport {\n type TextFieldProps as RACTextFieldProps,\n Group as RACGroup,\n Input as RACInput,\n TextField as RACTextField,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/localization-provider.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport type { AffixProps, CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextFieldProps\n extends CommonProps,\n FieldWithPlaceholderProps<string>,\n AffixProps,\n Pick<\n RACTextFieldProps,\n | 'value'\n | 'defaultValue'\n | 'onChange'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'type'\n | 'autoFocus'\n | 'autoComplete'\n | 'inputMode'\n | 'minLength'\n | 'maxLength'\n | 'pattern'\n | 'onFocus'\n | 'onBlur'\n | 'onKeyDown'\n > {\n /**\n * Whether to render a button that can be used to clear the text field.\n * @default false\n */\n isClearable?: boolean;\n /** A React ref that allows access to the imperative API of this component. */\n apiRef?: RefObject<TextFieldApi | null>;\n}\n\n/** The imperative API exposed by the `TextField` component. */\nexport interface TextFieldApi {\n /** Focuses the input field. */\n focus: () => void;\n /** Selects the contents of the input field. */\n select: () => void;\n}\n\nfunction TextField(\n {\n label,\n description,\n error: errorMessage,\n placeholder,\n prefix,\n suffix,\n UNSAFE_className,\n UNSAFE_style,\n isClearable = false,\n value: consumerValue,\n defaultValue: consumerDefaultValue,\n onChange,\n apiRef,\n ...props\n }: TextFieldProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const { isDisabled, isReadOnly } = props;\n const inputRef = useRef<HTMLInputElement>(null);\n const [value, setValue] = useControlledState(consumerValue, consumerDefaultValue ?? '', onChange);\n const messages = useLocalizedMessages('common');\n const clearDescriptionId = useId();\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => inputRef.current?.focus(),\n select: () => inputRef.current?.select(),\n }),\n [],\n );\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n const isFieldClearable = isClearable && !isDisabled && !isReadOnly;\n\n function onKeyDown(e: KeyboardEvent) {\n if (!isFieldClearable) {\n return;\n }\n\n if (e.key === 'Escape') {\n e.preventDefault();\n\n setValue('');\n }\n }\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('TextField requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n return (\n <RACTextField\n {...props}\n ref={ref}\n className={clsx('cim-text-field', UNSAFE_className)}\n style={UNSAFE_style}\n value={value}\n onChange={setValue}\n aria-describedby={[props['aria-describedby'], isFieldClearable ? clearDescriptionId : undefined]\n .filter(Boolean)\n .join(' ')}\n >\n {({ isDisabled, isRequired }) => (\n <>\n <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-text-field-input-group\" onClick={() => inputRef.current?.focus()}>\n {prefix && (\n <div\n className={clsx(\n 'cim-text-field-affix',\n textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n )}\n aria-hidden\n >\n {prefix}\n </div>\n )}\n\n <RACInput\n ref={inputRef}\n className={clsx('cim-text-field-input', textStyle({ variant: 'body' }))}\n placeholder={placeholder}\n onKeyDown={onKeyDown}\n />\n\n {isFieldClearable && value !== '' && (\n <XButton\n slot={null}\n UNSAFE_className=\"cim-text-field-clear\"\n aria-label={messages.format('clearValue')}\n onPress={() => setValue('')}\n iconType=\"circled\"\n excludeFromTabOrder\n />\n )}\n\n {suffix && (\n <div\n className={clsx(\n 'cim-text-field-affix',\n textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n )}\n aria-hidden\n >\n {suffix}\n </div>\n )}\n </RACGroup>\n <FormFieldError>{errorMessage}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n {isFieldClearable && (\n <p id={clearDescriptionId} className=\"cim-text-field-clear-description\" hidden>\n {messages.format('clearValueDescription')}\n </p>\n )}\n </>\n )}\n </RACTextField>\n );\n}\n\n/**\n * Allows users to enter a single line of text with a keyboard.\n *\n * See [text field usage guidelines](https://ui.cimpress.io/components/text-field/).\n */\nconst _TextField = withStyleProps(forwardRef(TextField), 'TextField');\n\nexport { _TextField as TextField };\n"]}
@@ -3,7 +3,7 @@ import { type TextAreaProps as RACTextAreaProps, type TextFieldProps as RACTextF
3
3
  import type { CommonProps, FieldWithPlaceholderProps } from '../types.js';
4
4
  export interface TextAreaProps extends CommonProps, FieldWithPlaceholderProps<string>, Pick<RACTextFieldProps, 'value' | 'defaultValue' | 'onChange' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'type' | 'autoFocus' | 'autoComplete' | 'inputMode' | 'minLength' | 'maxLength' | 'onFocus' | 'onBlur' | 'onKeyDown'>, Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {
5
5
  /** A React ref that allows access to the imperative API of this component. */
6
- apiRef?: RefObject<TextAreaApi>;
6
+ apiRef?: RefObject<TextAreaApi | null>;
7
7
  }
8
8
  /** The imperative API exposed by the `TextArea` component. */
9
9
  export interface TextAreaApi {
@@ -1 +1 @@
1
- {"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,SAAS,EAAkD,MAAM,OAAO,CAAC;AACvF,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,cAAc,IAAI,iBAAiB,EAEzC,MAAM,uBAAuB,CAAC;AAK/B,OAAO,KAAK,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG1E,MAAM,WAAW,aACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,QAAQ,GACR,WAAW,CACd,EACD,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,MAAM,CAAC;IAC3F,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;CACjC;AAED,8DAA8D;AAC9D,MAAM,WAAW,WAAW;IAC1B,6BAA6B;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,6CAA6C;IAC7C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAkED;;;;GAIG;AACH,QAAA,MAAM,SAAS,+JAAmD,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC"}
1
+ {"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,SAAS,EAAkD,MAAM,OAAO,CAAC;AACvF,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,cAAc,IAAI,iBAAiB,EAEzC,MAAM,uBAAuB,CAAC;AAK/B,OAAO,KAAK,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG1E,MAAM,WAAW,aACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,QAAQ,GACR,WAAW,CACd,EACD,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,MAAM,CAAC;IAC3F,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACxC;AAED,8DAA8D;AAC9D,MAAM,WAAW,WAAW;IAC1B,6BAA6B;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,6CAA6C;IAC7C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAkED;;;;GAIG;AACH,QAAA,MAAM,SAAS,+JAAmD,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAkB,MAAM,EAAqB,mBAAmB,EAAE,MAAM,OAAO,CAAC;AACvF,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,SAAS,IAAI,YAAY,EAGzB,KAAK,IAAI,QAAQ,GAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AAE5G,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAqCnD,SAAS,QAAQ,CACf,EACE,KAAK,EACL,WAAW,EACX,KAAK,EAAE,YAAY,EACnB,WAAW,EACX,cAAc,EACd,WAAW,EACX,IAAI,EACJ,UAAU,EACV,IAAI,EACJ,gBAAgB,EAChB,YAAY,EACZ,MAAM,EACN,GAAG,KAAK,EACM,EAChB,GAAiC;IAEjC,MAAM,WAAW,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAEtD,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,oBAAoB,CAAC,GAAG,EAAE;QACxB,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5C,OAAO,CAAC,IAAI,CAAC,iFAAiF,CAAC,CAAC;QAClG,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,mBAAmB,CACjB,MAAM,EACN,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE;QACzC,MAAM,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE;KAC5C,CAAC,EACF,EAAE,CACH,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,YACvG,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,CAC/B,8BACE,KAAC,cAAc,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,YAC3D,KAAK,GACS,EACjB,KAAC,QAAQ,IAAC,SAAS,EAAC,2BAA2B,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE,YACzF,KAAC,WAAW,IACV,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,EACtE,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,GACV,GACO,EACX,KAAC,cAAc,cAAE,YAAY,GAAkB,EAC/C,KAAC,oBAAoB,cAAE,WAAW,GAAwB,IACzD,CACJ,GACY,CAChB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,SAAS,GAAG,cAAc,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { type RefObject, useRef, type ForwardedRef, useImperativeHandle } from 'react';\nimport {\n TextArea as RACTextArea,\n TextField as RACTextField,\n type TextAreaProps as RACTextAreaProps,\n type TextFieldProps as RACTextFieldProps,\n Group as RACGroup,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type { CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextAreaProps\n extends CommonProps,\n FieldWithPlaceholderProps<string>,\n Pick<\n RACTextFieldProps,\n | 'value'\n | 'defaultValue'\n | 'onChange'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'type'\n | 'autoFocus'\n | 'autoComplete'\n | 'inputMode'\n | 'minLength'\n | 'maxLength'\n | 'onFocus'\n | 'onBlur'\n | 'onKeyDown'\n >,\n Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {\n /** A React ref that allows access to the imperative API of this component. */\n apiRef?: RefObject<TextAreaApi>;\n}\n\n/** The imperative API exposed by the `TextArea` component. */\nexport interface TextAreaApi {\n /** Focuses the text area. */\n focus: () => void;\n /** Selects the contents of the text area. */\n select: () => void;\n}\n\nfunction TextArea(\n {\n label,\n description,\n error: errorMessage,\n placeholder,\n autoCapitalize,\n autoCorrect,\n rows,\n spellCheck,\n wrap,\n UNSAFE_className,\n UNSAFE_style,\n apiRef,\n ...props\n }: TextAreaProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('TextArea requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => textAreaRef.current?.focus(),\n select: () => textAreaRef.current?.select(),\n }),\n [],\n );\n\n return (\n <RACTextField {...props} ref={ref} className={clsx('cim-text-area', UNSAFE_className)} style={UNSAFE_style}>\n {({ isDisabled, isRequired }) => (\n <>\n <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-text-area-input-group\" onClick={() => textAreaRef.current?.focus()}>\n <RACTextArea\n ref={textAreaRef}\n className={clsx('cim-text-area-input', textStyle({ variant: 'body' }))}\n placeholder={placeholder}\n autoCapitalize={autoCapitalize}\n autoCorrect={autoCorrect}\n rows={rows}\n spellCheck={spellCheck}\n wrap={wrap}\n />\n </RACGroup>\n <FormFieldError>{errorMessage}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n </>\n )}\n </RACTextField>\n );\n}\n\n/**\n * Allows users to enter multiple lines of text with a keyboard.\n *\n * See [text area usage guidelines](https://ui.cimpress.io/components/text-area/).\n */\nconst _TextArea = withStyleProps(forwardRef(TextArea), 'TextArea');\n\nexport { _TextArea as TextArea };\n"]}
1
+ {"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAkB,MAAM,EAAqB,mBAAmB,EAAE,MAAM,OAAO,CAAC;AACvF,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,SAAS,IAAI,YAAY,EAGzB,KAAK,IAAI,QAAQ,GAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AAE5G,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAqCnD,SAAS,QAAQ,CACf,EACE,KAAK,EACL,WAAW,EACX,KAAK,EAAE,YAAY,EACnB,WAAW,EACX,cAAc,EACd,WAAW,EACX,IAAI,EACJ,UAAU,EACV,IAAI,EACJ,gBAAgB,EAChB,YAAY,EACZ,MAAM,EACN,GAAG,KAAK,EACM,EAChB,GAAiC;IAEjC,MAAM,WAAW,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAEtD,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,oBAAoB,CAAC,GAAG,EAAE;QACxB,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5C,OAAO,CAAC,IAAI,CAAC,iFAAiF,CAAC,CAAC;QAClG,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,mBAAmB,CACjB,MAAM,EACN,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE;QACzC,MAAM,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE;KAC5C,CAAC,EACF,EAAE,CACH,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,YACvG,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,CAC/B,8BACE,KAAC,cAAc,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,YAC3D,KAAK,GACS,EACjB,KAAC,QAAQ,IAAC,SAAS,EAAC,2BAA2B,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE,YACzF,KAAC,WAAW,IACV,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,EACtE,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,GACV,GACO,EACX,KAAC,cAAc,cAAE,YAAY,GAAkB,EAC/C,KAAC,oBAAoB,cAAE,WAAW,GAAwB,IACzD,CACJ,GACY,CAChB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,SAAS,GAAG,cAAc,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { type RefObject, useRef, type ForwardedRef, useImperativeHandle } from 'react';\nimport {\n TextArea as RACTextArea,\n TextField as RACTextField,\n type TextAreaProps as RACTextAreaProps,\n type TextFieldProps as RACTextFieldProps,\n Group as RACGroup,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type { CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextAreaProps\n extends CommonProps,\n FieldWithPlaceholderProps<string>,\n Pick<\n RACTextFieldProps,\n | 'value'\n | 'defaultValue'\n | 'onChange'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'type'\n | 'autoFocus'\n | 'autoComplete'\n | 'inputMode'\n | 'minLength'\n | 'maxLength'\n | 'onFocus'\n | 'onBlur'\n | 'onKeyDown'\n >,\n Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {\n /** A React ref that allows access to the imperative API of this component. */\n apiRef?: RefObject<TextAreaApi | null>;\n}\n\n/** The imperative API exposed by the `TextArea` component. */\nexport interface TextAreaApi {\n /** Focuses the text area. */\n focus: () => void;\n /** Selects the contents of the text area. */\n select: () => void;\n}\n\nfunction TextArea(\n {\n label,\n description,\n error: errorMessage,\n placeholder,\n autoCapitalize,\n autoCorrect,\n rows,\n spellCheck,\n wrap,\n UNSAFE_className,\n UNSAFE_style,\n apiRef,\n ...props\n }: TextAreaProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('TextArea requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => textAreaRef.current?.focus(),\n select: () => textAreaRef.current?.select(),\n }),\n [],\n );\n\n return (\n <RACTextField {...props} ref={ref} className={clsx('cim-text-area', UNSAFE_className)} style={UNSAFE_style}>\n {({ isDisabled, isRequired }) => (\n <>\n <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-text-area-input-group\" onClick={() => textAreaRef.current?.focus()}>\n <RACTextArea\n ref={textAreaRef}\n className={clsx('cim-text-area-input', textStyle({ variant: 'body' }))}\n placeholder={placeholder}\n autoCapitalize={autoCapitalize}\n autoCorrect={autoCorrect}\n rows={rows}\n spellCheck={spellCheck}\n wrap={wrap}\n />\n </RACGroup>\n <FormFieldError>{errorMessage}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n </>\n )}\n </RACTextField>\n );\n}\n\n/**\n * Allows users to enter multiple lines of text with a keyboard.\n *\n * See [text area usage guidelines](https://ui.cimpress.io/components/text-area/).\n */\nconst _TextArea = withStyleProps(forwardRef(TextArea), 'TextArea');\n\nexport { _TextArea as TextArea };\n"]}
@@ -8,7 +8,7 @@ export interface TextFieldProps extends CommonProps, FieldWithPlaceholderProps<s
8
8
  */
9
9
  isClearable?: boolean;
10
10
  /** A React ref that allows access to the imperative API of this component. */
11
- apiRef?: RefObject<TextFieldApi>;
11
+ apiRef?: RefObject<TextFieldApi | null>;
12
12
  }
13
13
  /** The imperative API exposed by the `TextField` component. */
14
14
  export interface TextFieldApi {
@@ -1 +1 @@
1
- {"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAyC,KAAK,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC3G,OAAO,EACL,KAAK,cAAc,IAAI,iBAAiB,EAIzC,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGtF,MAAM,WAAW,cACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,UAAU,EACV,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,SAAS,GACT,QAAQ,GACR,WAAW,CACd;IACH;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;CAClC;AAED,+DAA+D;AAC/D,MAAM,WAAW,YAAY;IAC3B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,+CAA+C;IAC/C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAmID;;;;GAIG;AACH,QAAA,MAAM,UAAU,gKAAqD,CAAC;AAEtE,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}
1
+ {"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAyC,KAAK,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC3G,OAAO,EACL,KAAK,cAAc,IAAI,iBAAiB,EAIzC,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGtF,MAAM,WAAW,cACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,UAAU,EACV,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,SAAS,GACT,QAAQ,GACR,WAAW,CACd;IACH;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;CACzC;AAED,+DAA+D;AAC/D,MAAM,WAAW,YAAY;IAC3B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,+CAA+C;IAC/C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAmID;;;;GAIG;AACH,QAAA,MAAM,UAAU,gKAAqD,CAAC;AAEtE,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useId } from '@react-aria/utils';\nimport { useControlledState } from '@react-stately/utils';\nimport clsx from 'clsx';\nimport { type ForwardedRef, type KeyboardEvent, type RefObject, useImperativeHandle, useRef } from 'react';\nimport {\n type TextFieldProps as RACTextFieldProps,\n Group as RACGroup,\n Input as RACInput,\n TextField as RACTextField,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/localization-provider.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport type { AffixProps, CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextFieldProps\n extends CommonProps,\n FieldWithPlaceholderProps<string>,\n AffixProps,\n Pick<\n RACTextFieldProps,\n | 'value'\n | 'defaultValue'\n | 'onChange'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'type'\n | 'autoFocus'\n | 'autoComplete'\n | 'inputMode'\n | 'minLength'\n | 'maxLength'\n | 'pattern'\n | 'onFocus'\n | 'onBlur'\n | 'onKeyDown'\n > {\n /**\n * Whether to render a button that can be used to clear the text field.\n * @default false\n */\n isClearable?: boolean;\n /** A React ref that allows access to the imperative API of this component. */\n apiRef?: RefObject<TextFieldApi>;\n}\n\n/** The imperative API exposed by the `TextField` component. */\nexport interface TextFieldApi {\n /** Focuses the input field. */\n focus: () => void;\n /** Selects the contents of the input field. */\n select: () => void;\n}\n\nfunction TextField(\n {\n label,\n description,\n error: errorMessage,\n placeholder,\n prefix,\n suffix,\n UNSAFE_className,\n UNSAFE_style,\n isClearable = false,\n value: consumerValue,\n defaultValue: consumerDefaultValue,\n onChange,\n apiRef,\n ...props\n }: TextFieldProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const { isDisabled, isReadOnly } = props;\n const inputRef = useRef<HTMLInputElement>(null);\n const [value, setValue] = useControlledState(consumerValue, consumerDefaultValue ?? '', onChange);\n const messages = useLocalizedMessages('common');\n const clearDescriptionId = useId();\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => inputRef.current?.focus(),\n select: () => inputRef.current?.select(),\n }),\n [],\n );\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n const isFieldClearable = isClearable && !isDisabled && !isReadOnly;\n\n function onKeyDown(e: KeyboardEvent) {\n if (!isFieldClearable) {\n return;\n }\n\n if (e.key === 'Escape') {\n e.preventDefault();\n\n setValue('');\n }\n }\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('TextField requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n return (\n <RACTextField\n {...props}\n ref={ref}\n className={clsx('cim-text-field', UNSAFE_className)}\n style={UNSAFE_style}\n value={value}\n onChange={setValue}\n aria-describedby={[props['aria-describedby'], isFieldClearable ? clearDescriptionId : undefined]\n .filter(Boolean)\n .join(' ')}\n >\n {({ isDisabled, isRequired }) => (\n <>\n <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-text-field-input-group\" onClick={() => inputRef.current?.focus()}>\n {prefix && (\n <div\n className={clsx(\n 'cim-text-field-affix',\n textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n )}\n aria-hidden\n >\n {prefix}\n </div>\n )}\n\n <RACInput\n ref={inputRef}\n className={clsx('cim-text-field-input', textStyle({ variant: 'body' }))}\n placeholder={placeholder}\n onKeyDown={onKeyDown}\n />\n\n {isFieldClearable && value !== '' && (\n <XButton\n slot={null}\n UNSAFE_className=\"cim-text-field-clear\"\n aria-label={messages.format('clearValue')}\n onPress={() => setValue('')}\n iconType=\"circled\"\n excludeFromTabOrder\n />\n )}\n\n {suffix && (\n <div\n className={clsx(\n 'cim-text-field-affix',\n textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n )}\n aria-hidden\n >\n {suffix}\n </div>\n )}\n </RACGroup>\n <FormFieldError>{errorMessage}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n {isFieldClearable && (\n <p id={clearDescriptionId} className=\"cim-text-field-clear-description\" hidden>\n {messages.format('clearValueDescription')}\n </p>\n )}\n </>\n )}\n </RACTextField>\n );\n}\n\n/**\n * Allows users to enter a single line of text with a keyboard.\n *\n * See [text field usage guidelines](https://ui.cimpress.io/components/text-field/).\n */\nconst _TextField = withStyleProps(forwardRef(TextField), 'TextField');\n\nexport { _TextField as TextField };\n"]}
1
+ {"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useId } from '@react-aria/utils';\nimport { useControlledState } from '@react-stately/utils';\nimport clsx from 'clsx';\nimport { type ForwardedRef, type KeyboardEvent, type RefObject, useImperativeHandle, useRef } from 'react';\nimport {\n type TextFieldProps as RACTextFieldProps,\n Group as RACGroup,\n Input as RACInput,\n TextField as RACTextField,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/localization-provider.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport type { AffixProps, CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextFieldProps\n extends CommonProps,\n FieldWithPlaceholderProps<string>,\n AffixProps,\n Pick<\n RACTextFieldProps,\n | 'value'\n | 'defaultValue'\n | 'onChange'\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'type'\n | 'autoFocus'\n | 'autoComplete'\n | 'inputMode'\n | 'minLength'\n | 'maxLength'\n | 'pattern'\n | 'onFocus'\n | 'onBlur'\n | 'onKeyDown'\n > {\n /**\n * Whether to render a button that can be used to clear the text field.\n * @default false\n */\n isClearable?: boolean;\n /** A React ref that allows access to the imperative API of this component. */\n apiRef?: RefObject<TextFieldApi | null>;\n}\n\n/** The imperative API exposed by the `TextField` component. */\nexport interface TextFieldApi {\n /** Focuses the input field. */\n focus: () => void;\n /** Selects the contents of the input field. */\n select: () => void;\n}\n\nfunction TextField(\n {\n label,\n description,\n error: errorMessage,\n placeholder,\n prefix,\n suffix,\n UNSAFE_className,\n UNSAFE_style,\n isClearable = false,\n value: consumerValue,\n defaultValue: consumerDefaultValue,\n onChange,\n apiRef,\n ...props\n }: TextFieldProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const { isDisabled, isReadOnly } = props;\n const inputRef = useRef<HTMLInputElement>(null);\n const [value, setValue] = useControlledState(consumerValue, consumerDefaultValue ?? '', onChange);\n const messages = useLocalizedMessages('common');\n const clearDescriptionId = useId();\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => inputRef.current?.focus(),\n select: () => inputRef.current?.select(),\n }),\n [],\n );\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n const isFieldClearable = isClearable && !isDisabled && !isReadOnly;\n\n function onKeyDown(e: KeyboardEvent) {\n if (!isFieldClearable) {\n return;\n }\n\n if (e.key === 'Escape') {\n e.preventDefault();\n\n setValue('');\n }\n }\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('TextField requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n return (\n <RACTextField\n {...props}\n ref={ref}\n className={clsx('cim-text-field', UNSAFE_className)}\n style={UNSAFE_style}\n value={value}\n onChange={setValue}\n aria-describedby={[props['aria-describedby'], isFieldClearable ? clearDescriptionId : undefined]\n .filter(Boolean)\n .join(' ')}\n >\n {({ isDisabled, isRequired }) => (\n <>\n <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-text-field-input-group\" onClick={() => inputRef.current?.focus()}>\n {prefix && (\n <div\n className={clsx(\n 'cim-text-field-affix',\n textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n )}\n aria-hidden\n >\n {prefix}\n </div>\n )}\n\n <RACInput\n ref={inputRef}\n className={clsx('cim-text-field-input', textStyle({ variant: 'body' }))}\n placeholder={placeholder}\n onKeyDown={onKeyDown}\n />\n\n {isFieldClearable && value !== '' && (\n <XButton\n slot={null}\n UNSAFE_className=\"cim-text-field-clear\"\n aria-label={messages.format('clearValue')}\n onPress={() => setValue('')}\n iconType=\"circled\"\n excludeFromTabOrder\n />\n )}\n\n {suffix && (\n <div\n className={clsx(\n 'cim-text-field-affix',\n textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n )}\n aria-hidden\n >\n {suffix}\n </div>\n )}\n </RACGroup>\n <FormFieldError>{errorMessage}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n {isFieldClearable && (\n <p id={clearDescriptionId} className=\"cim-text-field-clear-description\" hidden>\n {messages.format('clearValueDescription')}\n </p>\n )}\n </>\n )}\n </RACTextField>\n );\n}\n\n/**\n * Allows users to enter a single line of text with a keyboard.\n *\n * See [text field usage guidelines](https://ui.cimpress.io/components/text-field/).\n */\nconst _TextField = withStyleProps(forwardRef(TextField), 'TextField');\n\nexport { _TextField as TextField };\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cimpress-ui/react",
3
- "version": "1.7.0",
3
+ "version": "1.7.1",
4
4
  "description": "Library of React components for building Cimpress UI interfaces.",
5
5
  "author": "Cimpress",
6
6
  "license": "Apache-2.0",