@cloudscape-design/components 3.0.824 → 3.0.825

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.
Files changed (76) hide show
  1. package/file-upload/interfaces.d.ts +5 -0
  2. package/file-upload/interfaces.d.ts.map +1 -1
  3. package/file-upload/interfaces.js.map +1 -1
  4. package/file-upload/internal.d.ts.map +1 -1
  5. package/file-upload/internal.js +7 -13
  6. package/file-upload/internal.js.map +1 -1
  7. package/internal/components/file-token-group/default-formatters.d.ts.map +1 -0
  8. package/{file-upload → internal/components/file-token-group}/default-formatters.js +1 -1
  9. package/internal/components/file-token-group/default-formatters.js.map +1 -0
  10. package/internal/components/file-token-group/file-token.d.ts +32 -0
  11. package/internal/components/file-token-group/file-token.d.ts.map +1 -0
  12. package/internal/components/file-token-group/file-token.js +71 -0
  13. package/internal/components/file-token-group/file-token.js.map +1 -0
  14. package/internal/components/file-token-group/index.d.ts +8 -0
  15. package/internal/components/file-token-group/index.d.ts.map +1 -0
  16. package/internal/components/file-token-group/index.js +41 -0
  17. package/internal/components/file-token-group/index.js.map +1 -0
  18. package/internal/components/file-token-group/interfaces.d.ts +85 -0
  19. package/internal/components/file-token-group/interfaces.d.ts.map +1 -0
  20. package/internal/components/file-token-group/interfaces.js +2 -0
  21. package/internal/components/file-token-group/interfaces.js.map +1 -0
  22. package/internal/components/file-token-group/styles.css.js +27 -0
  23. package/internal/components/file-token-group/styles.scoped.css +375 -0
  24. package/internal/components/file-token-group/styles.selectors.js +28 -0
  25. package/internal/components/file-token-group/test-classes/styles.css.js +11 -0
  26. package/internal/components/file-token-group/test-classes/styles.scoped.css +12 -0
  27. package/internal/components/file-token-group/test-classes/styles.selectors.js +12 -0
  28. package/internal/components/file-token-group/thumbnail.d.ts.map +1 -0
  29. package/internal/components/file-token-group/thumbnail.js.map +1 -0
  30. package/internal/components/token-list/index.d.ts.map +1 -1
  31. package/internal/components/token-list/index.js +5 -1
  32. package/internal/components/token-list/index.js.map +1 -1
  33. package/internal/components/token-list/interfaces.d.ts +1 -1
  34. package/internal/components/token-list/interfaces.d.ts.map +1 -1
  35. package/internal/components/token-list/interfaces.js.map +1 -1
  36. package/internal/components/token-list/styles.css.js +10 -9
  37. package/internal/components/token-list/styles.scoped.css +41 -21
  38. package/internal/components/token-list/styles.selectors.js +10 -9
  39. package/internal/environment.js +1 -1
  40. package/internal/environment.json +1 -1
  41. package/internal/manifest.json +1 -1
  42. package/package.json +1 -1
  43. package/test-utils/dom/file-upload/index.d.ts +1 -10
  44. package/test-utils/dom/file-upload/index.js +13 -36
  45. package/test-utils/dom/file-upload/index.js.map +1 -1
  46. package/test-utils/dom/internal/file-token-group.d.ts +21 -0
  47. package/test-utils/dom/internal/file-token-group.js +51 -0
  48. package/test-utils/dom/internal/file-token-group.js.map +1 -0
  49. package/test-utils/selectors/file-upload/index.d.ts +1 -10
  50. package/test-utils/selectors/file-upload/index.js +13 -36
  51. package/test-utils/selectors/file-upload/index.js.map +1 -1
  52. package/test-utils/selectors/internal/file-token-group.d.ts +21 -0
  53. package/test-utils/selectors/internal/file-token-group.js +51 -0
  54. package/test-utils/selectors/internal/file-token-group.js.map +1 -0
  55. package/test-utils/tsconfig.tsbuildinfo +1 -1
  56. package/token-group/styles.css.js +8 -10
  57. package/token-group/styles.scoped.css +25 -38
  58. package/token-group/styles.selectors.js +8 -10
  59. package/token-group/token.d.ts +1 -5
  60. package/token-group/token.d.ts.map +1 -1
  61. package/token-group/token.js +4 -11
  62. package/token-group/token.js.map +1 -1
  63. package/file-upload/default-formatters.d.ts.map +0 -1
  64. package/file-upload/default-formatters.js.map +0 -1
  65. package/file-upload/file-option/index.d.ts +0 -10
  66. package/file-upload/file-option/index.d.ts.map +0 -1
  67. package/file-upload/file-option/index.js +0 -22
  68. package/file-upload/file-option/index.js.map +0 -1
  69. package/file-upload/file-option/styles.css.js +0 -12
  70. package/file-upload/file-option/styles.scoped.css +0 -35
  71. package/file-upload/file-option/styles.selectors.js +0 -13
  72. package/file-upload/file-option/thumbnail.d.ts.map +0 -1
  73. package/file-upload/file-option/thumbnail.js.map +0 -1
  74. /package/{file-upload → internal/components/file-token-group}/default-formatters.d.ts +0 -0
  75. /package/{file-upload/file-option → internal/components/file-token-group}/thumbnail.d.ts +0 -0
  76. /package/{file-upload/file-option → internal/components/file-token-group}/thumbnail.js +0 -0
@@ -61,6 +61,10 @@ export interface FileUploadProps extends BaseComponentProps, FormFieldCommonVali
61
61
  * An array of file warnings corresponding to the files in the `value`.
62
62
  */
63
63
  fileWarnings?: ReadonlyArray<null | string>;
64
+ /**
65
+ * Alignment of the file tokens. Defaults to "vertical".
66
+ */
67
+ fileTokenAlignment?: FileUploadProps.FileTokenAlignment;
64
68
  /**
65
69
  * An object containing all the localized strings required by the component:
66
70
  * * `uploadButtonText` (function): A function to render the text of the file upload button. It takes `multiple` attribute to define plurality.
@@ -83,6 +87,7 @@ export declare namespace FileUploadProps {
83
87
  index: number;
84
88
  file: File;
85
89
  }
90
+ type FileTokenAlignment = 'vertical' | 'horizontal';
86
91
  interface I18nStrings {
87
92
  uploadButtonText: (multiple: boolean) => string;
88
93
  dropzoneText: (multiple: boolean) => string;
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/file-upload/interfaces.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,qCAAqC,EAAE,MAAM,wCAAwC,CAAC;AAC/F,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,eAAgB,SAAQ,kBAAkB,EAAE,qCAAqC;IAChG;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;IACnE;;;OAGG;IACH,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IAC1C;;OAEG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IAC5C;;;;;;;;;;;OAWG;IACH,WAAW,EAAE,eAAe,CAAC,WAAW,CAAC;CAC1C;AAED,yBAAiB,eAAe,CAAC;IAC/B,UAAiB,YAAY;QAC3B,KAAK,EAAE,IAAI,EAAE,CAAC;KACf;IAED,UAAiB,aAAa;QAC5B,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,IAAI,CAAC;KACZ;IAED,UAAiB,WAAW;QAC1B,gBAAgB,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,MAAM,CAAC;QAChD,YAAY,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,MAAM,CAAC;QAC5C,mBAAmB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;QACnD,cAAc,EAAE,MAAM,CAAC;QACvB,aAAa,EAAE,MAAM,CAAC;QACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,cAAc,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,MAAM,CAAC;QACjD,sBAAsB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC;KACjD;IAED,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;KACf;CACF;AAED,MAAM,WAAW,YAAY;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B"}
1
+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/file-upload/interfaces.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,qCAAqC,EAAE,MAAM,wCAAwC,CAAC;AAC/F,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,eAAgB,SAAQ,kBAAkB,EAAE,qCAAqC;IAChG;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;IACnE;;;OAGG;IACH,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IAC1C;;OAEG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IAC5C;;OAEG;IACH,kBAAkB,CAAC,EAAE,eAAe,CAAC,kBAAkB,CAAC;IACxD;;;;;;;;;;;OAWG;IACH,WAAW,EAAE,eAAe,CAAC,WAAW,CAAC;CAC1C;AAED,yBAAiB,eAAe,CAAC;IAC/B,UAAiB,YAAY;QAC3B,KAAK,EAAE,IAAI,EAAE,CAAC;KACf;IAED,UAAiB,aAAa;QAC5B,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,IAAI,CAAC;KACZ;IAED,KAAY,kBAAkB,GAAG,UAAU,GAAG,YAAY,CAAC;IAE3D,UAAiB,WAAW;QAC1B,gBAAgB,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,MAAM,CAAC;QAChD,YAAY,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,MAAM,CAAC;QAC5C,mBAAmB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;QACnD,cAAc,EAAE,MAAM,CAAC;QACvB,aAAa,EAAE,MAAM,CAAC;QACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,cAAc,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,MAAM,CAAC;QACjD,sBAAsB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC;KACjD;IAED,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;KACf;CACF;AAED,MAAM,WAAW,YAAY;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B"}
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/file-upload/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldCommonValidationControlProps } from '../internal/context/form-field-context';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface FileUploadProps extends BaseComponentProps, FormFieldCommonValidationControlProps {\n /**\n * Specifies the native file input `accept` attribute to describe the allow-list of file types.\n */\n accept?: string;\n /**\n * Specifies whether to add aria-required to the file upload control.\n */\n ariaRequired?: boolean;\n /**\n * Show file size in the token. Use `i18nStrings.formatFileSize` to customize it.\n */\n showFileSize?: boolean;\n /**\n * Show file last modified timestamp in the token. Use `i18nStrings.formatFileLastModified` to customize it.\n */\n showFileLastModified?: boolean;\n /**\n * Show file thumbnail in the token. Only supported for images.\n */\n showFileThumbnail?: boolean;\n /**\n * Specifies the native file input `multiple` attribute to allow users entering more than one file.\n */\n multiple?: boolean;\n /**\n * Called when the user selects new file(s), or removes a file.\n * The event `detail` contains the current value of the component.\n */\n onChange?: NonCancelableEventHandler<FileUploadProps.ChangeDetail>;\n /**\n * Specifies the currently selected file(s).\n * If you want to clear the selection, use empty array.\n */\n value: ReadonlyArray<File>;\n /**\n * Specifies the maximum number of displayed file tokens. If the property isn't set, all of the tokens are displayed.\n */\n tokenLimit?: number;\n /**\n * Constraint text that is displayed below the control. Use this to provide additional information about file size limit, etc.\n */\n constraintText?: React.ReactNode;\n /**\n * Text that displays as a validation error message.\n */\n errorText?: React.ReactNode;\n /**\n * Text that displays as a validation warning message.\n */\n warningText?: React.ReactNode;\n /**\n * An array of file errors corresponding to the files in the `value`.\n */\n fileErrors?: ReadonlyArray<null | string>;\n /**\n * An array of file warnings corresponding to the files in the `value`.\n */\n fileWarnings?: ReadonlyArray<null | string>;\n /**\n * An object containing all the localized strings required by the component:\n * * `uploadButtonText` (function): A function to render the text of the file upload button. It takes `multiple` attribute to define plurality.\n * * `dropzoneText` (function): A function to render the text shown in the dropzone. It takes `multiple` attribute to define plurality.\n * * `removeFileAriaLabel` (function): A function to render the ARIA label for file token remove button.\n * * `limitShowFewer` (string): The text of the show more tokens button.\n * * `limitShowMore` (string): The text of the show fewer tokens button.\n * * `errorIconAriaLabel` (string): The ARIA label to be shown on the error file icon.\n * * `warningIconAriaLabel` (string): The ARIA label to be shown on the warning file icon.\n * * `formatFileSize` (function): (Optional) A function that takes file size in bytes, and produces a formatted string.\n * * `formatFileLastModified` (function): (Optional) A function that takes the files last modified date, and produces a formatted string.\n */\n i18nStrings: FileUploadProps.I18nStrings;\n}\n\nexport namespace FileUploadProps {\n export interface ChangeDetail {\n value: File[];\n }\n\n export interface DismissDetail {\n index: number;\n file: File;\n }\n\n export interface I18nStrings {\n uploadButtonText: (multiple: boolean) => string;\n dropzoneText: (multiple: boolean) => string;\n removeFileAriaLabel: (fileIndex: number) => string;\n limitShowFewer: string;\n limitShowMore: string;\n errorIconAriaLabel?: string;\n warningIconAriaLabel?: string;\n formatFileSize?: (sizeInBytes: number) => string;\n formatFileLastModified?: (date: Date) => string;\n }\n\n export interface Ref {\n /**\n * Sets focus on the file upload button.\n */\n focus(): void;\n }\n}\n\nexport interface FileMetadata {\n showFileSize?: boolean;\n showFileLastModified?: boolean;\n showFileThumbnail?: boolean;\n}\n"]}
1
+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/file-upload/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldCommonValidationControlProps } from '../internal/context/form-field-context';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface FileUploadProps extends BaseComponentProps, FormFieldCommonValidationControlProps {\n /**\n * Specifies the native file input `accept` attribute to describe the allow-list of file types.\n */\n accept?: string;\n /**\n * Specifies whether to add aria-required to the file upload control.\n */\n ariaRequired?: boolean;\n /**\n * Show file size in the token. Use `i18nStrings.formatFileSize` to customize it.\n */\n showFileSize?: boolean;\n /**\n * Show file last modified timestamp in the token. Use `i18nStrings.formatFileLastModified` to customize it.\n */\n showFileLastModified?: boolean;\n /**\n * Show file thumbnail in the token. Only supported for images.\n */\n showFileThumbnail?: boolean;\n /**\n * Specifies the native file input `multiple` attribute to allow users entering more than one file.\n */\n multiple?: boolean;\n /**\n * Called when the user selects new file(s), or removes a file.\n * The event `detail` contains the current value of the component.\n */\n onChange?: NonCancelableEventHandler<FileUploadProps.ChangeDetail>;\n /**\n * Specifies the currently selected file(s).\n * If you want to clear the selection, use empty array.\n */\n value: ReadonlyArray<File>;\n /**\n * Specifies the maximum number of displayed file tokens. If the property isn't set, all of the tokens are displayed.\n */\n tokenLimit?: number;\n /**\n * Constraint text that is displayed below the control. Use this to provide additional information about file size limit, etc.\n */\n constraintText?: React.ReactNode;\n /**\n * Text that displays as a validation error message.\n */\n errorText?: React.ReactNode;\n /**\n * Text that displays as a validation warning message.\n */\n warningText?: React.ReactNode;\n /**\n * An array of file errors corresponding to the files in the `value`.\n */\n fileErrors?: ReadonlyArray<null | string>;\n /**\n * An array of file warnings corresponding to the files in the `value`.\n */\n fileWarnings?: ReadonlyArray<null | string>;\n /**\n * Alignment of the file tokens. Defaults to \"vertical\".\n */\n fileTokenAlignment?: FileUploadProps.FileTokenAlignment;\n /**\n * An object containing all the localized strings required by the component:\n * * `uploadButtonText` (function): A function to render the text of the file upload button. It takes `multiple` attribute to define plurality.\n * * `dropzoneText` (function): A function to render the text shown in the dropzone. It takes `multiple` attribute to define plurality.\n * * `removeFileAriaLabel` (function): A function to render the ARIA label for file token remove button.\n * * `limitShowFewer` (string): The text of the show more tokens button.\n * * `limitShowMore` (string): The text of the show fewer tokens button.\n * * `errorIconAriaLabel` (string): The ARIA label to be shown on the error file icon.\n * * `warningIconAriaLabel` (string): The ARIA label to be shown on the warning file icon.\n * * `formatFileSize` (function): (Optional) A function that takes file size in bytes, and produces a formatted string.\n * * `formatFileLastModified` (function): (Optional) A function that takes the files last modified date, and produces a formatted string.\n */\n i18nStrings: FileUploadProps.I18nStrings;\n}\n\nexport namespace FileUploadProps {\n export interface ChangeDetail {\n value: File[];\n }\n\n export interface DismissDetail {\n index: number;\n file: File;\n }\n\n export type FileTokenAlignment = 'vertical' | 'horizontal';\n\n export interface I18nStrings {\n uploadButtonText: (multiple: boolean) => string;\n dropzoneText: (multiple: boolean) => string;\n removeFileAriaLabel: (fileIndex: number) => string;\n limitShowFewer: string;\n limitShowMore: string;\n errorIconAriaLabel?: string;\n warningIconAriaLabel?: string;\n formatFileSize?: (sizeInBytes: number) => string;\n formatFileLastModified?: (date: Date) => string;\n }\n\n export interface Ref {\n /**\n * Sets focus on the file upload button.\n */\n focus(): void;\n }\n}\n\nexport interface FileMetadata {\n showFileSize?: boolean;\n showFileLastModified?: boolean;\n showFileThumbnail?: boolean;\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/file-upload/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAM9D,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AASnD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAQlF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;;AAQ/C,wBAAoD"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/file-upload/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAM9D,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AASnD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAMlF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;;AAQ/C,wBAAoD"}
@@ -10,7 +10,7 @@ import { ConstraintText, FormFieldError, FormFieldWarning } from '../form-field/
10
10
  import { getBaseProps } from '../internal/base-component';
11
11
  import InternalFileDropzone, { useFilesDragging } from '../internal/components/file-dropzone';
12
12
  import InternalFileInput from '../internal/components/file-input';
13
- import TokenList from '../internal/components/token-list';
13
+ import InternalFileTokenGroup from '../internal/components/file-token-group';
14
14
  import { fireNonCancelableEvent } from '../internal/events';
15
15
  import checkControlled from '../internal/hooks/check-controlled';
16
16
  import { useListFocusController } from '../internal/hooks/use-list-focus-controller';
@@ -18,15 +18,13 @@ import { useMergeRefs } from '../internal/hooks/use-merge-refs';
18
18
  import { useUniqueId } from '../internal/hooks/use-unique-id';
19
19
  import { joinStrings } from '../internal/utils/strings';
20
20
  import InternalSpaceBetween from '../space-between/internal';
21
- import { Token } from '../token-group/token';
22
- import { FileOption } from './file-option';
23
21
  import fileInputStyles from '../internal/components/file-input/styles.css.js';
24
22
  import tokenListStyles from '../internal/components/token-list/styles.css.js';
25
23
  import styles from './styles.css.js';
26
24
  export default React.forwardRef(InternalFileUpload);
27
25
  function InternalFileUpload(_a, externalRef) {
28
26
  var _b;
29
- var { accept, ariaRequired, multiple = false, onChange, value, tokenLimit, showFileSize, showFileLastModified, showFileThumbnail, i18nStrings, __internalRootRef = null, constraintText, errorText, warningText, fileErrors, fileWarnings } = _a, restProps = __rest(_a, ["accept", "ariaRequired", "multiple", "onChange", "value", "tokenLimit", "showFileSize", "showFileLastModified", "showFileThumbnail", "i18nStrings", "__internalRootRef", "constraintText", "errorText", "warningText", "fileErrors", "fileWarnings"]);
27
+ var { accept, ariaRequired, multiple = false, onChange, value, tokenLimit, showFileSize, showFileLastModified, showFileThumbnail, i18nStrings, __internalRootRef = null, constraintText, errorText, warningText, fileErrors, fileWarnings, fileTokenAlignment = 'vertical' } = _a, restProps = __rest(_a, ["accept", "ariaRequired", "multiple", "onChange", "value", "tokenLimit", "showFileSize", "showFileLastModified", "showFileThumbnail", "i18nStrings", "__internalRootRef", "constraintText", "errorText", "warningText", "fileErrors", "fileWarnings", "fileTokenAlignment"]);
30
28
  const [nextFocusIndex, setNextFocusIndex] = useState(null);
31
29
  const tokenListRef = useListFocusController({
32
30
  nextFocusIndex,
@@ -74,14 +72,10 @@ function InternalFileUpload(_a, externalRef) {
74
72
  errorText && (React.createElement(FormFieldError, { id: errorId, errorIconAriaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.errorIconAriaLabel }, errorText)),
75
73
  showWarning && (React.createElement(FormFieldWarning, { id: warningId, warningIconAriaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.warningIconAriaLabel }, warningText)),
76
74
  constraintText && (React.createElement(ConstraintText, { id: constraintTextId, hasValidationText: !!errorText || !!warningText }, constraintText))))),
77
- !multiple && value.length > 0 ? (React.createElement(InternalBox, null,
78
- React.createElement(Token, { ariaLabel: value[0].name, dismissLabel: i18nStrings.removeFileAriaLabel(0), onDismiss: () => onFileRemove(0), errorText: fileErrors === null || fileErrors === void 0 ? void 0 : fileErrors[0], warningText: fileWarnings === null || fileWarnings === void 0 ? void 0 : fileWarnings[0], errorIconAriaLabel: i18nStrings.errorIconAriaLabel, warningIconAriaLabel: i18nStrings.warningIconAriaLabel, "data-index": 0 },
79
- React.createElement(FileOption, { file: value[0], metadata: metadata, i18nStrings: i18nStrings })))) : null,
80
- multiple && value.length > 0 ? (React.createElement(InternalBox, null,
81
- React.createElement(TokenList, { alignment: "vertical", items: value, renderItem: (file, fileIndex) => (React.createElement(Token, { ariaLabel: file.name, dismissLabel: i18nStrings.removeFileAriaLabel(fileIndex), onDismiss: () => onFileRemove(fileIndex), errorText: fileErrors === null || fileErrors === void 0 ? void 0 : fileErrors[fileIndex], warningText: fileWarnings === null || fileWarnings === void 0 ? void 0 : fileWarnings[fileIndex], errorIconAriaLabel: i18nStrings.errorIconAriaLabel, warningIconAriaLabel: i18nStrings.warningIconAriaLabel, "data-index": fileIndex },
82
- React.createElement(FileOption, { file: file, metadata: metadata, i18nStrings: i18nStrings }))), limit: tokenLimit, i18nStrings: {
83
- limitShowFewer: i18nStrings.limitShowFewer,
84
- limitShowMore: i18nStrings.limitShowMore,
85
- } }))) : null));
75
+ value.length > 0 ? (React.createElement(InternalFileTokenGroup, { limit: tokenLimit, alignment: fileTokenAlignment, items: value.map((file, fileIndex) => ({
76
+ file,
77
+ errorText: fileErrors === null || fileErrors === void 0 ? void 0 : fileErrors[fileIndex],
78
+ warningText: fileWarnings === null || fileWarnings === void 0 ? void 0 : fileWarnings[fileIndex],
79
+ })), showFileLastModified: metadata.showFileLastModified, showFileSize: metadata.showFileSize, showFileThumbnail: metadata.showFileThumbnail, i18nStrings: i18nStrings, onDismiss: event => onFileRemove(event.detail.fileIndex) })) : null));
86
80
  }
87
81
  //# sourceMappingURL=internal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/file-upload/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { ForwardedRef, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { useFormFieldContext } from '../contexts/form-field';\nimport { ConstraintText, FormFieldError, FormFieldWarning } from '../form-field/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport InternalFileDropzone, { useFilesDragging } from '../internal/components/file-dropzone';\nimport InternalFileInput from '../internal/components/file-input';\nimport TokenList from '../internal/components/token-list';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useListFocusController } from '../internal/hooks/use-list-focus-controller';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { joinStrings } from '../internal/utils/strings';\nimport InternalSpaceBetween from '../space-between/internal';\nimport { Token } from '../token-group/token';\nimport { FileOption } from './file-option';\nimport { FileUploadProps } from './interfaces';\n\nimport fileInputStyles from '../internal/components/file-input/styles.css.js';\nimport tokenListStyles from '../internal/components/token-list/styles.css.js';\nimport styles from './styles.css.js';\n\ntype InternalFileUploadProps = FileUploadProps & InternalBaseComponentProps;\n\nexport default React.forwardRef(InternalFileUpload);\n\nfunction InternalFileUpload(\n {\n accept,\n ariaRequired,\n multiple = false,\n onChange,\n value,\n tokenLimit,\n showFileSize,\n showFileLastModified,\n showFileThumbnail,\n i18nStrings,\n __internalRootRef = null,\n constraintText,\n errorText,\n warningText,\n fileErrors,\n fileWarnings,\n ...restProps\n }: InternalFileUploadProps,\n externalRef: ForwardedRef<ButtonProps.Ref>\n) {\n const [nextFocusIndex, setNextFocusIndex] = useState<null | number>(null);\n const tokenListRef = useListFocusController({\n nextFocusIndex,\n onFocusMoved: target => {\n target.focus();\n setNextFocusIndex(null);\n },\n listItemSelector: `.${tokenListStyles['list-item']}`,\n showMoreSelector: `.${tokenListStyles.toggle}`,\n fallbackSelector: `.${fileInputStyles['file-input']}`,\n });\n\n const baseProps = getBaseProps(restProps);\n const metadata = { showFileSize, showFileLastModified, showFileThumbnail };\n\n const errorId = useUniqueId('error-');\n const warningId = useUniqueId('warning-');\n const constraintTextId = useUniqueId('constraint-text-');\n\n const fileInputRef = useRef<ButtonProps.Ref>(null);\n const ref = useMergeRefs(fileInputRef, externalRef);\n\n checkControlled('FileUpload', 'value', value, 'onChange', onChange);\n\n if (!multiple && value.length > 1) {\n warnOnce('FileUpload', 'Value must be an array of size 0 or 1 when `multiple=false`.');\n }\n\n const handleFilesChange = (newFiles: File[]) => {\n const newValue = multiple ? [...value, ...newFiles] : newFiles[0] ? newFiles.slice(0, 1) : [...value];\n fireNonCancelableEvent(onChange, { value: newValue });\n };\n\n const onFileRemove = (removeFileIndex: number) => {\n const newValue = value.filter((_, fileIndex) => fileIndex !== removeFileIndex);\n fireNonCancelableEvent(onChange, { value: newValue });\n setNextFocusIndex(removeFileIndex);\n };\n\n const { areFilesDragging } = useFilesDragging();\n\n const showWarning = warningText && !errorText;\n\n if (warningText && errorText) {\n warnOnce('FileUpload', 'Both `errorText` and `warningText` exist. `warningText` will not be shown.');\n }\n\n const formFieldContext = useFormFieldContext(restProps);\n const ariaDescribedBy = joinStrings(\n restProps.ariaDescribedby ?? formFieldContext.ariaDescribedby,\n errorText ? errorId : undefined,\n showWarning ? warningId : undefined,\n constraintText ? constraintTextId : undefined\n );\n\n const hasError = Boolean(errorText || fileErrors?.filter(Boolean).length);\n const invalid = restProps.invalid || formFieldContext.invalid || hasError;\n\n return (\n <InternalSpaceBetween\n {...baseProps}\n size=\"xs\"\n className={clsx(baseProps.className, styles.root)}\n __internalRootRef={__internalRootRef}\n ref={tokenListRef}\n >\n <InternalBox>\n {areFilesDragging ? (\n <InternalFileDropzone onChange={event => handleFilesChange(event.detail.value)}>\n {i18nStrings.dropzoneText(multiple)}\n </InternalFileDropzone>\n ) : (\n <InternalFileInput\n ref={ref}\n accept={accept}\n ariaRequired={ariaRequired}\n multiple={multiple}\n onChange={event => handleFilesChange(event.detail.value)}\n value={value}\n {...restProps}\n ariaDescribedby={ariaDescribedBy}\n invalid={invalid}\n >\n {i18nStrings.uploadButtonText(multiple)}\n </InternalFileInput>\n )}\n\n {(constraintText || errorText || warningText) && (\n <div className={styles.hints}>\n {errorText && (\n <FormFieldError id={errorId} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n {errorText}\n </FormFieldError>\n )}\n {showWarning && (\n <FormFieldWarning id={warningId} warningIconAriaLabel={i18nStrings?.warningIconAriaLabel}>\n {warningText}\n </FormFieldWarning>\n )}\n {constraintText && (\n <ConstraintText id={constraintTextId} hasValidationText={!!errorText || !!warningText}>\n {constraintText}\n </ConstraintText>\n )}\n </div>\n )}\n </InternalBox>\n\n {!multiple && value.length > 0 ? (\n <InternalBox>\n <Token\n ariaLabel={value[0].name}\n dismissLabel={i18nStrings.removeFileAriaLabel(0)}\n onDismiss={() => onFileRemove(0)}\n errorText={fileErrors?.[0]}\n warningText={fileWarnings?.[0]}\n errorIconAriaLabel={i18nStrings.errorIconAriaLabel}\n warningIconAriaLabel={i18nStrings.warningIconAriaLabel}\n data-index={0}\n >\n <FileOption file={value[0]} metadata={metadata} i18nStrings={i18nStrings} />\n </Token>\n </InternalBox>\n ) : null}\n\n {multiple && value.length > 0 ? (\n <InternalBox>\n <TokenList\n alignment=\"vertical\"\n items={value}\n renderItem={(file, fileIndex) => (\n <Token\n ariaLabel={file.name}\n dismissLabel={i18nStrings.removeFileAriaLabel(fileIndex)}\n onDismiss={() => onFileRemove(fileIndex)}\n errorText={fileErrors?.[fileIndex]}\n warningText={fileWarnings?.[fileIndex]}\n errorIconAriaLabel={i18nStrings.errorIconAriaLabel}\n warningIconAriaLabel={i18nStrings.warningIconAriaLabel}\n data-index={fileIndex}\n >\n <FileOption file={file} metadata={metadata} i18nStrings={i18nStrings} />\n </Token>\n )}\n limit={tokenLimit}\n i18nStrings={{\n limitShowFewer: i18nStrings.limitShowFewer,\n limitShowMore: i18nStrings.limitShowMore,\n }}\n />\n </InternalBox>\n ) : null}\n </InternalSpaceBetween>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/file-upload/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { ForwardedRef, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { useFormFieldContext } from '../contexts/form-field';\nimport { ConstraintText, FormFieldError, FormFieldWarning } from '../form-field/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport InternalFileDropzone, { useFilesDragging } from '../internal/components/file-dropzone';\nimport InternalFileInput from '../internal/components/file-input';\nimport InternalFileTokenGroup from '../internal/components/file-token-group';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useListFocusController } from '../internal/hooks/use-list-focus-controller';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { joinStrings } from '../internal/utils/strings';\nimport InternalSpaceBetween from '../space-between/internal';\nimport { FileUploadProps } from './interfaces';\n\nimport fileInputStyles from '../internal/components/file-input/styles.css.js';\nimport tokenListStyles from '../internal/components/token-list/styles.css.js';\nimport styles from './styles.css.js';\n\ntype InternalFileUploadProps = FileUploadProps & InternalBaseComponentProps;\n\nexport default React.forwardRef(InternalFileUpload);\n\nfunction InternalFileUpload(\n {\n accept,\n ariaRequired,\n multiple = false,\n onChange,\n value,\n tokenLimit,\n showFileSize,\n showFileLastModified,\n showFileThumbnail,\n i18nStrings,\n __internalRootRef = null,\n constraintText,\n errorText,\n warningText,\n fileErrors,\n fileWarnings,\n fileTokenAlignment = 'vertical',\n ...restProps\n }: InternalFileUploadProps,\n externalRef: ForwardedRef<ButtonProps.Ref>\n) {\n const [nextFocusIndex, setNextFocusIndex] = useState<null | number>(null);\n const tokenListRef = useListFocusController({\n nextFocusIndex,\n onFocusMoved: target => {\n target.focus();\n setNextFocusIndex(null);\n },\n listItemSelector: `.${tokenListStyles['list-item']}`,\n showMoreSelector: `.${tokenListStyles.toggle}`,\n fallbackSelector: `.${fileInputStyles['file-input']}`,\n });\n\n const baseProps = getBaseProps(restProps);\n const metadata = { showFileSize, showFileLastModified, showFileThumbnail };\n\n const errorId = useUniqueId('error-');\n const warningId = useUniqueId('warning-');\n const constraintTextId = useUniqueId('constraint-text-');\n\n const fileInputRef = useRef<ButtonProps.Ref>(null);\n const ref = useMergeRefs(fileInputRef, externalRef);\n\n checkControlled('FileUpload', 'value', value, 'onChange', onChange);\n\n if (!multiple && value.length > 1) {\n warnOnce('FileUpload', 'Value must be an array of size 0 or 1 when `multiple=false`.');\n }\n\n const handleFilesChange = (newFiles: File[]) => {\n const newValue = multiple ? [...value, ...newFiles] : newFiles[0] ? newFiles.slice(0, 1) : [...value];\n fireNonCancelableEvent(onChange, { value: newValue });\n };\n\n const onFileRemove = (removeFileIndex: number) => {\n const newValue = value.filter((_, fileIndex) => fileIndex !== removeFileIndex);\n fireNonCancelableEvent(onChange, { value: newValue });\n setNextFocusIndex(removeFileIndex);\n };\n\n const { areFilesDragging } = useFilesDragging();\n\n const showWarning = warningText && !errorText;\n\n if (warningText && errorText) {\n warnOnce('FileUpload', 'Both `errorText` and `warningText` exist. `warningText` will not be shown.');\n }\n\n const formFieldContext = useFormFieldContext(restProps);\n const ariaDescribedBy = joinStrings(\n restProps.ariaDescribedby ?? formFieldContext.ariaDescribedby,\n errorText ? errorId : undefined,\n showWarning ? warningId : undefined,\n constraintText ? constraintTextId : undefined\n );\n\n const hasError = Boolean(errorText || fileErrors?.filter(Boolean).length);\n const invalid = restProps.invalid || formFieldContext.invalid || hasError;\n\n return (\n <InternalSpaceBetween\n {...baseProps}\n size=\"xs\"\n className={clsx(baseProps.className, styles.root)}\n __internalRootRef={__internalRootRef}\n ref={tokenListRef}\n >\n <InternalBox>\n {areFilesDragging ? (\n <InternalFileDropzone onChange={event => handleFilesChange(event.detail.value)}>\n {i18nStrings.dropzoneText(multiple)}\n </InternalFileDropzone>\n ) : (\n <InternalFileInput\n ref={ref}\n accept={accept}\n ariaRequired={ariaRequired}\n multiple={multiple}\n onChange={event => handleFilesChange(event.detail.value)}\n value={value}\n {...restProps}\n ariaDescribedby={ariaDescribedBy}\n invalid={invalid}\n >\n {i18nStrings.uploadButtonText(multiple)}\n </InternalFileInput>\n )}\n\n {(constraintText || errorText || warningText) && (\n <div className={styles.hints}>\n {errorText && (\n <FormFieldError id={errorId} errorIconAriaLabel={i18nStrings?.errorIconAriaLabel}>\n {errorText}\n </FormFieldError>\n )}\n {showWarning && (\n <FormFieldWarning id={warningId} warningIconAriaLabel={i18nStrings?.warningIconAriaLabel}>\n {warningText}\n </FormFieldWarning>\n )}\n {constraintText && (\n <ConstraintText id={constraintTextId} hasValidationText={!!errorText || !!warningText}>\n {constraintText}\n </ConstraintText>\n )}\n </div>\n )}\n </InternalBox>\n\n {value.length > 0 ? (\n <InternalFileTokenGroup\n limit={tokenLimit}\n alignment={fileTokenAlignment}\n items={value.map((file, fileIndex) => ({\n file,\n errorText: fileErrors?.[fileIndex],\n warningText: fileWarnings?.[fileIndex],\n }))}\n showFileLastModified={metadata.showFileLastModified}\n showFileSize={metadata.showFileSize}\n showFileThumbnail={metadata.showFileThumbnail}\n i18nStrings={i18nStrings}\n onDismiss={event => onFileRemove(event.detail.fileIndex)}\n />\n ) : null}\n </InternalSpaceBetween>\n );\n}\n"]}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"default-formatters.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/file-token-group/default-formatters.ts"],"names":[],"mappings":"AAUA,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAWnD;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM,CAEzD"}
@@ -1,6 +1,6 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
- import { formatDateTime } from '../internal/utils/date-time';
3
+ import { formatDateTime } from '../../utils/date-time';
4
4
  const KB = 1000;
5
5
  const MB = Math.pow(1000, 2);
6
6
  const GB = Math.pow(1000, 3);
@@ -0,0 +1 @@
1
+ {"version":3,"file":"default-formatters.js","sourceRoot":"","sources":["../../../../../src/internal/components/file-token-group/default-formatters.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,MAAM,EAAE,GAAG,IAAI,CAAC;AAChB,MAAM,EAAE,GAAG,SAAA,IAAI,EAAI,CAAC,CAAA,CAAC;AACrB,MAAM,EAAE,GAAG,SAAA,IAAI,EAAI,CAAC,CAAA,CAAC;AACrB,MAAM,EAAE,GAAG,SAAA,IAAI,EAAI,CAAC,CAAA,CAAC;AAErB,MAAM,UAAU,cAAc,CAAC,IAAY;IACzC,IAAI,IAAI,GAAG,EAAE,EAAE;QACb,OAAO,GAAG,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;KACvC;IACD,IAAI,IAAI,GAAG,EAAE,EAAE;QACb,OAAO,GAAG,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;KACvC;IACD,IAAI,IAAI,GAAG,EAAE,EAAE;QACb,OAAO,GAAG,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;KACvC;IACD,OAAO,GAAG,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;AACxC,CAAC;AAED,MAAM,UAAU,sBAAsB,CAAC,IAAU;IAC/C,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC;AAC9B,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { formatDateTime } from '../../utils/date-time';\n\nconst KB = 1000;\nconst MB = 1000 ** 2;\nconst GB = 1000 ** 3;\nconst TB = 1000 ** 4;\n\nexport function formatFileSize(size: number): string {\n if (size < MB) {\n return `${(size / KB).toFixed(2)} KB`;\n }\n if (size < GB) {\n return `${(size / MB).toFixed(2)} MB`;\n }\n if (size < TB) {\n return `${(size / GB).toFixed(2)} GB`;\n }\n return `${(size / TB).toFixed(2)} TB`;\n}\n\nexport function formatFileLastModified(date: Date): string {\n return formatDateTime(date);\n}\n"]}
@@ -0,0 +1,32 @@
1
+ import React from 'react';
2
+ import { TokenGroupProps } from '../../../token-group/interfaces.js';
3
+ import { BaseComponentProps } from '../../base-component/index.js';
4
+ export declare namespace FileTokenProps {
5
+ interface I18nStrings {
6
+ removeFileAriaLabel: (fileIndex: number) => string;
7
+ errorIconAriaLabel?: string;
8
+ warningIconAriaLabel?: string;
9
+ formatFileSize?: (sizeInBytes: number) => string;
10
+ formatFileLastModified?: (date: Date) => string;
11
+ }
12
+ }
13
+ export interface FileTokenProps extends BaseComponentProps {
14
+ file: File;
15
+ onDismiss: () => void;
16
+ showFileSize?: boolean;
17
+ showFileLastModified?: boolean;
18
+ showFileThumbnail?: boolean;
19
+ errorText?: React.ReactNode;
20
+ warningText?: React.ReactNode;
21
+ loading?: boolean;
22
+ readOnly?: boolean;
23
+ i18nStrings: FileTokenProps.I18nStrings;
24
+ dismissLabel?: string;
25
+ alignment?: TokenGroupProps.Alignment;
26
+ groupContainsImage?: boolean;
27
+ isImage: boolean;
28
+ index: number;
29
+ }
30
+ declare function InternalFileToken({ file, showFileLastModified, showFileSize, showFileThumbnail, i18nStrings, onDismiss, errorText, warningText, readOnly, loading, alignment, groupContainsImage, isImage, index, }: FileTokenProps): JSX.Element;
31
+ export default InternalFileToken;
32
+ //# sourceMappingURL=file-token.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"file-token.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/file-token-group/file-token.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAQhD,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AACrE,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AASnE,yBAAiB,cAAc,CAAC;IAC9B,UAAiB,WAAW;QAC1B,mBAAmB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;QACnD,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,cAAc,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,MAAM,CAAC;QACjD,sBAAsB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC;KACjD;CACF;AAED,MAAM,WAAW,cAAe,SAAQ,kBAAkB;IACxD,IAAI,EAAE,IAAI,CAAC;IACX,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,cAAc,CAAC,WAAW,CAAC;IACxC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC;IACtC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,iBAAS,iBAAiB,CAAC,EACzB,IAAI,EACJ,oBAAoB,EACpB,YAAY,EACZ,iBAAiB,EACjB,WAAW,EACX,SAAS,EACT,SAAS,EACT,WAAW,EACX,QAAQ,EACR,OAAO,EACP,SAAS,EACT,kBAAkB,EAClB,OAAO,EACP,KAAK,GACN,EAAE,cAAc,eA+HhB;AAED,eAAe,iBAAiB,CAAC"}
@@ -0,0 +1,71 @@
1
+ // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
+ // SPDX-License-Identifier: Apache-2.0
3
+ import React, { useRef, useState } from 'react';
4
+ import clsx from 'clsx';
5
+ import InternalBox from '../../../box/internal.js';
6
+ import { FormFieldError, FormFieldWarning } from '../../../form-field/internal';
7
+ import InternalSpaceBetween from '../../../space-between/internal.js';
8
+ import InternalSpinner from '../../../spinner/internal.js';
9
+ import DismissButton from '../../../token-group/dismiss-button';
10
+ import { useUniqueId } from '../../hooks/use-unique-id';
11
+ import Tooltip from '../tooltip/index';
12
+ import * as defaultFormatters from './default-formatters.js';
13
+ import { FileOptionThumbnail } from './thumbnail.js';
14
+ import styles from './styles.css.js';
15
+ import testUtilStyles from './test-classes/styles.css.js';
16
+ function InternalFileToken({ file, showFileLastModified, showFileSize, showFileThumbnail, i18nStrings, onDismiss, errorText, warningText, readOnly, loading, alignment, groupContainsImage, isImage, index, }) {
17
+ var _a, _b;
18
+ const formatFileSize = (_a = i18nStrings.formatFileSize) !== null && _a !== void 0 ? _a : defaultFormatters.formatFileSize;
19
+ const formatFileLastModified = (_b = i18nStrings.formatFileLastModified) !== null && _b !== void 0 ? _b : defaultFormatters.formatFileLastModified;
20
+ const errorId = useUniqueId('error');
21
+ const warningId = useUniqueId('warning');
22
+ const showWarning = warningText && !errorText;
23
+ const containerRef = useRef(null);
24
+ const fileNameRef = useRef(null);
25
+ const fileNameContainerRef = useRef(null);
26
+ const [showTooltip, setShowTooltip] = useState(false);
27
+ function isEllipsisActive() {
28
+ const span = fileNameRef.current;
29
+ const container = fileNameContainerRef.current;
30
+ if (span && container) {
31
+ return span.offsetWidth >= container.offsetWidth;
32
+ }
33
+ return false;
34
+ }
35
+ const fileIsSingleRow = !showFileLastModified && !showFileSize && (!groupContainsImage || (groupContainsImage && !showFileThumbnail));
36
+ return (React.createElement("div", { ref: containerRef, className: clsx(styles.token, {
37
+ [styles['token-grid']]: alignment === 'horizontal',
38
+ [styles['token-contains-image']]: groupContainsImage,
39
+ }), role: "group", "aria-label": file.name, "aria-describedby": errorText ? errorId : warningText ? warningId : undefined, "aria-disabled": loading, "data-index": index },
40
+ React.createElement("div", { className: clsx(styles['token-box'], {
41
+ [styles.loading]: loading,
42
+ [styles.error]: errorText,
43
+ [styles.warning]: showWarning,
44
+ [styles.horizontal]: alignment === 'horizontal',
45
+ [styles['read-only']]: readOnly,
46
+ }) },
47
+ loading && (React.createElement("div", { className: clsx(styles['file-loading-overlay'], {
48
+ [styles['file-loading-overlay-single-row']]: loading && fileIsSingleRow,
49
+ }) },
50
+ React.createElement(InternalSpinner, { variant: "disabled", size: "normal" }))),
51
+ React.createElement(InternalBox, { className: styles['file-option'] },
52
+ showFileThumbnail && isImage && React.createElement(FileOptionThumbnail, { file: file }),
53
+ React.createElement("div", { className: clsx(styles['file-option-metadata'], {
54
+ [styles['with-image']]: showFileThumbnail && isImage,
55
+ [styles['single-row-loading']]: loading && fileIsSingleRow,
56
+ }) },
57
+ React.createElement(InternalSpaceBetween, { direction: "vertical", size: "xxxs" },
58
+ React.createElement("div", { onMouseOver: () => setShowTooltip(true), onMouseOut: () => setShowTooltip(false), ref: fileNameContainerRef },
59
+ React.createElement(InternalBox, { fontWeight: "normal", className: clsx(styles['file-option-name'], testUtilStyles['file-option-name'], {
60
+ [testUtilStyles['ellipsis-active']]: isEllipsisActive(),
61
+ }) },
62
+ React.createElement("span", { ref: fileNameRef }, file.name))),
63
+ showFileSize && file.size ? (React.createElement(InternalBox, { fontSize: "body-s", color: 'text-body-secondary', className: clsx(styles['file-option-size'], testUtilStyles['file-option-size']) }, formatFileSize(file.size))) : null,
64
+ showFileLastModified && file.lastModified ? (React.createElement(InternalBox, { fontSize: "body-s", color: 'text-body-secondary', className: clsx(styles['file-option-last-modified'], testUtilStyles['file-option-last-modified']) }, formatFileLastModified(new Date(file.lastModified)))) : null))),
65
+ onDismiss && !readOnly && (React.createElement(DismissButton, { dismissLabel: i18nStrings.removeFileAriaLabel(index), onDismiss: onDismiss }))),
66
+ errorText && (React.createElement(FormFieldError, { id: errorId, errorIconAriaLabel: i18nStrings.errorIconAriaLabel }, errorText)),
67
+ showWarning && (React.createElement(FormFieldWarning, { id: warningId, warningIconAriaLabel: i18nStrings.warningIconAriaLabel }, warningText)),
68
+ showTooltip && isEllipsisActive() && (React.createElement(Tooltip, { trackRef: containerRef, trackKey: file.name, value: React.createElement(InternalBox, { fontWeight: "normal" }, file.name) }))));
69
+ }
70
+ export default InternalFileToken;
71
+ //# sourceMappingURL=file-token.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"file-token.js","sourceRoot":"","sources":["../../../../../src/internal/components/file-token-group/file-token.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport InternalBox from '../../../box/internal.js';\nimport { FormFieldError, FormFieldWarning } from '../../../form-field/internal';\nimport InternalSpaceBetween from '../../../space-between/internal.js';\nimport InternalSpinner from '../../../spinner/internal.js';\nimport DismissButton from '../../../token-group/dismiss-button';\nimport { TokenGroupProps } from '../../../token-group/interfaces.js';\nimport { BaseComponentProps } from '../../base-component/index.js';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport Tooltip from '../tooltip/index';\nimport * as defaultFormatters from './default-formatters.js';\nimport { FileOptionThumbnail } from './thumbnail.js';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport namespace FileTokenProps {\n export interface I18nStrings {\n removeFileAriaLabel: (fileIndex: number) => string;\n errorIconAriaLabel?: string;\n warningIconAriaLabel?: string;\n formatFileSize?: (sizeInBytes: number) => string;\n formatFileLastModified?: (date: Date) => string;\n }\n}\n\nexport interface FileTokenProps extends BaseComponentProps {\n file: File;\n onDismiss: () => void;\n showFileSize?: boolean;\n showFileLastModified?: boolean;\n showFileThumbnail?: boolean;\n errorText?: React.ReactNode;\n warningText?: React.ReactNode;\n loading?: boolean;\n readOnly?: boolean;\n i18nStrings: FileTokenProps.I18nStrings;\n dismissLabel?: string;\n alignment?: TokenGroupProps.Alignment;\n groupContainsImage?: boolean;\n isImage: boolean;\n index: number;\n}\n\nfunction InternalFileToken({\n file,\n showFileLastModified,\n showFileSize,\n showFileThumbnail,\n i18nStrings,\n onDismiss,\n errorText,\n warningText,\n readOnly,\n loading,\n alignment,\n groupContainsImage,\n isImage,\n index,\n}: FileTokenProps) {\n const formatFileSize = i18nStrings.formatFileSize ?? defaultFormatters.formatFileSize;\n const formatFileLastModified = i18nStrings.formatFileLastModified ?? defaultFormatters.formatFileLastModified;\n\n const errorId = useUniqueId('error');\n const warningId = useUniqueId('warning');\n\n const showWarning = warningText && !errorText;\n const containerRef = useRef<HTMLDivElement>(null);\n const fileNameRef = useRef<HTMLSpanElement>(null);\n const fileNameContainerRef = useRef<HTMLDivElement>(null);\n const [showTooltip, setShowTooltip] = useState(false);\n\n function isEllipsisActive() {\n const span = fileNameRef.current;\n const container = fileNameContainerRef.current;\n\n if (span && container) {\n return span.offsetWidth >= container.offsetWidth;\n }\n return false;\n }\n\n const fileIsSingleRow =\n !showFileLastModified && !showFileSize && (!groupContainsImage || (groupContainsImage && !showFileThumbnail));\n\n return (\n <div\n ref={containerRef}\n className={clsx(styles.token, {\n [styles['token-grid']]: alignment === 'horizontal',\n [styles['token-contains-image']]: groupContainsImage,\n })}\n role=\"group\"\n aria-label={file.name}\n aria-describedby={errorText ? errorId : warningText ? warningId : undefined}\n aria-disabled={loading}\n data-index={index}\n >\n <div\n className={clsx(styles['token-box'], {\n [styles.loading]: loading,\n [styles.error]: errorText,\n [styles.warning]: showWarning,\n [styles.horizontal]: alignment === 'horizontal',\n [styles['read-only']]: readOnly,\n })}\n >\n {loading && (\n <div\n className={clsx(styles['file-loading-overlay'], {\n [styles['file-loading-overlay-single-row']]: loading && fileIsSingleRow,\n })}\n >\n <InternalSpinner variant=\"disabled\" size=\"normal\" />\n </div>\n )}\n <InternalBox className={styles['file-option']}>\n {showFileThumbnail && isImage && <FileOptionThumbnail file={file} />}\n\n <div\n className={clsx(styles['file-option-metadata'], {\n [styles['with-image']]: showFileThumbnail && isImage,\n [styles['single-row-loading']]: loading && fileIsSingleRow,\n })}\n >\n <InternalSpaceBetween direction=\"vertical\" size=\"xxxs\">\n <div\n onMouseOver={() => setShowTooltip(true)}\n onMouseOut={() => setShowTooltip(false)}\n ref={fileNameContainerRef}\n >\n <InternalBox\n fontWeight=\"normal\"\n className={clsx(styles['file-option-name'], testUtilStyles['file-option-name'], {\n [testUtilStyles['ellipsis-active']]: isEllipsisActive(),\n })}\n >\n <span ref={fileNameRef}>{file.name}</span>\n </InternalBox>\n </div>\n\n {showFileSize && file.size ? (\n <InternalBox\n fontSize=\"body-s\"\n color={'text-body-secondary'}\n className={clsx(styles['file-option-size'], testUtilStyles['file-option-size'])}\n >\n {formatFileSize(file.size)}\n </InternalBox>\n ) : null}\n\n {showFileLastModified && file.lastModified ? (\n <InternalBox\n fontSize=\"body-s\"\n color={'text-body-secondary'}\n className={clsx(styles['file-option-last-modified'], testUtilStyles['file-option-last-modified'])}\n >\n {formatFileLastModified(new Date(file.lastModified))}\n </InternalBox>\n ) : null}\n </InternalSpaceBetween>\n </div>\n </InternalBox>\n {onDismiss && !readOnly && (\n <DismissButton dismissLabel={i18nStrings.removeFileAriaLabel(index)} onDismiss={onDismiss} />\n )}\n </div>\n {errorText && (\n <FormFieldError id={errorId} errorIconAriaLabel={i18nStrings.errorIconAriaLabel}>\n {errorText}\n </FormFieldError>\n )}\n {showWarning && (\n <FormFieldWarning id={warningId} warningIconAriaLabel={i18nStrings.warningIconAriaLabel}>\n {warningText}\n </FormFieldWarning>\n )}\n {showTooltip && isEllipsisActive() && (\n <Tooltip\n trackRef={containerRef}\n trackKey={file.name}\n value={<InternalBox fontWeight=\"normal\">{file.name}</InternalBox>}\n />\n )}\n </div>\n );\n}\n\nexport default InternalFileToken;\n"]}
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ import { InternalBaseComponentProps } from '../../hooks/use-base-component/index.js';
3
+ import { FileTokenGroupProps } from './interfaces.js';
4
+ export { FileTokenGroupProps };
5
+ type InternalFileTokenGroupProps = FileTokenGroupProps & InternalBaseComponentProps;
6
+ declare function InternalFileTokenGroup({ items, showFileLastModified, showFileSize, showFileThumbnail, i18nStrings, onDismiss, limit, readOnly, alignment, __internalRootRef, ...restProps }: InternalFileTokenGroupProps): JSX.Element;
7
+ export default InternalFileTokenGroup;
8
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/file-token-group/index.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AAKrF,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAMtD,OAAO,EAAE,mBAAmB,EAAE,CAAC;AAE/B,KAAK,2BAA2B,GAAG,mBAAmB,GAAG,0BAA0B,CAAC;AAEpF,iBAAS,sBAAsB,CAAC,EAC9B,KAAK,EACL,oBAAoB,EACpB,YAAY,EACZ,iBAAiB,EACjB,WAAW,EACX,SAAS,EACT,KAAK,EACL,QAAQ,EACR,SAAsB,EACtB,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,2BAA2B,eAqD7B;AAED,eAAe,sBAAsB,CAAC"}
@@ -0,0 +1,41 @@
1
+ // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
+ // SPDX-License-Identifier: Apache-2.0
3
+ import { __rest } from "tslib";
4
+ import React, { useState } from 'react';
5
+ import clsx from 'clsx';
6
+ import { getBaseProps } from '../../base-component/index.js';
7
+ import { fireNonCancelableEvent } from '../../events/index.js';
8
+ import { useListFocusController } from '../../hooks/use-list-focus-controller.js';
9
+ import { useMergeRefs } from '../../hooks/use-merge-refs/index.js';
10
+ import TokenList from '../token-list/index.js';
11
+ import InternalFileToken from './file-token.js';
12
+ import tokenListStyles from '../token-list/styles.css.js';
13
+ import styles from './styles.css.js';
14
+ import testStyles from './test-classes/styles.css.js';
15
+ function InternalFileTokenGroup(_a) {
16
+ var { items, showFileLastModified, showFileSize, showFileThumbnail, i18nStrings, onDismiss, limit, readOnly, alignment = 'vertical', __internalRootRef } = _a, restProps = __rest(_a, ["items", "showFileLastModified", "showFileSize", "showFileThumbnail", "i18nStrings", "onDismiss", "limit", "readOnly", "alignment", "__internalRootRef"]);
17
+ const baseProps = getBaseProps(restProps);
18
+ const [nextFocusIndex, setNextFocusIndex] = useState(null);
19
+ const tokenListRef = useListFocusController({
20
+ nextFocusIndex,
21
+ onFocusMoved: target => {
22
+ target.focus();
23
+ setNextFocusIndex(null);
24
+ },
25
+ listItemSelector: `.${tokenListStyles['list-item']}`,
26
+ showMoreSelector: `.${tokenListStyles.toggle}`,
27
+ });
28
+ const mergedRef = useMergeRefs(__internalRootRef, tokenListRef);
29
+ const isImage = (file) => file.type.startsWith('image/');
30
+ const groupContainsImage = items.filter(item => isImage(item.file)).length > 0;
31
+ return (React.createElement("div", Object.assign({}, baseProps, { ref: mergedRef, className: clsx(baseProps.className, styles.root, testStyles.root) }),
32
+ React.createElement(TokenList, { alignment: alignment === 'horizontal' ? 'horizontal-grid' : alignment, items: items, renderItem: (file, fileIndex) => (React.createElement(InternalFileToken, { file: file.file, showFileLastModified: showFileLastModified, showFileSize: showFileSize, showFileThumbnail: showFileThumbnail, onDismiss: () => {
33
+ fireNonCancelableEvent(onDismiss, { fileIndex });
34
+ setNextFocusIndex(fileIndex);
35
+ }, errorText: file.errorText, warningText: file.warningText, i18nStrings: i18nStrings, loading: file.loading, readOnly: readOnly, alignment: alignment, groupContainsImage: groupContainsImage, isImage: isImage(file.file), index: fileIndex })), limit: limit, i18nStrings: {
36
+ limitShowFewer: i18nStrings.limitShowFewer,
37
+ limitShowMore: i18nStrings.limitShowMore,
38
+ } })));
39
+ }
40
+ export default InternalFileTokenGroup;
41
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/file-token-group/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { useState } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../../base-component/index.js';\nimport { fireNonCancelableEvent } from '../../events/index.js';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component/index.js';\nimport { useListFocusController } from '../../hooks/use-list-focus-controller.js';\nimport { useMergeRefs } from '../../hooks/use-merge-refs/index.js';\nimport TokenList from '../token-list/index.js';\nimport InternalFileToken from './file-token.js';\nimport { FileTokenGroupProps } from './interfaces.js';\n\nimport tokenListStyles from '../token-list/styles.css.js';\nimport styles from './styles.css.js';\nimport testStyles from './test-classes/styles.css.js';\n\nexport { FileTokenGroupProps };\n\ntype InternalFileTokenGroupProps = FileTokenGroupProps & InternalBaseComponentProps;\n\nfunction InternalFileTokenGroup({\n items,\n showFileLastModified,\n showFileSize,\n showFileThumbnail,\n i18nStrings,\n onDismiss,\n limit,\n readOnly,\n alignment = 'vertical',\n __internalRootRef,\n ...restProps\n}: InternalFileTokenGroupProps) {\n const baseProps = getBaseProps(restProps);\n\n const [nextFocusIndex, setNextFocusIndex] = useState<null | number>(null);\n const tokenListRef = useListFocusController({\n nextFocusIndex,\n onFocusMoved: target => {\n target.focus();\n setNextFocusIndex(null);\n },\n listItemSelector: `.${tokenListStyles['list-item']}`,\n showMoreSelector: `.${tokenListStyles.toggle}`,\n });\n\n const mergedRef = useMergeRefs(__internalRootRef, tokenListRef);\n\n const isImage = (file: File) => file.type.startsWith('image/');\n const groupContainsImage = items.filter(item => isImage(item.file)).length > 0;\n\n return (\n <div {...baseProps} ref={mergedRef} className={clsx(baseProps.className, styles.root, testStyles.root)}>\n <TokenList\n alignment={alignment === 'horizontal' ? 'horizontal-grid' : alignment}\n items={items}\n renderItem={(file, fileIndex) => (\n <InternalFileToken\n file={file.file}\n showFileLastModified={showFileLastModified}\n showFileSize={showFileSize}\n showFileThumbnail={showFileThumbnail}\n onDismiss={() => {\n fireNonCancelableEvent(onDismiss, { fileIndex });\n setNextFocusIndex(fileIndex);\n }}\n errorText={file.errorText}\n warningText={file.warningText}\n i18nStrings={i18nStrings}\n loading={file.loading}\n readOnly={readOnly}\n alignment={alignment}\n groupContainsImage={groupContainsImage}\n isImage={isImage(file.file)}\n index={fileIndex}\n />\n )}\n limit={limit}\n i18nStrings={{\n limitShowFewer: i18nStrings.limitShowFewer,\n limitShowMore: i18nStrings.limitShowMore,\n }}\n />\n </div>\n );\n}\n\nexport default InternalFileTokenGroup;\n"]}
@@ -0,0 +1,85 @@
1
+ import { BaseComponentProps } from '../../base-component';
2
+ import { NonCancelableEventHandler } from '../../events';
3
+ export interface FileTokenGroupProps extends BaseComponentProps {
4
+ /**
5
+ * Show file size in the token. Use `i18nStrings.formatFileSize` to customize it.
6
+ */
7
+ showFileSize?: boolean;
8
+ /**
9
+ * Show file last modified timestamp in the token. Use `i18nStrings.formatFileLastModified` to customize it.
10
+ */
11
+ showFileLastModified?: boolean;
12
+ /**
13
+ * Show file thumbnail in the token. Only supported for images.
14
+ */
15
+ showFileThumbnail?: boolean;
16
+ /**
17
+ * Called when the user clicks on the dismiss button. The token won't be automatically removed.
18
+ * Make sure that you add a listener to this event to update your application state.
19
+ */
20
+ onDismiss: NonCancelableEventHandler<FileTokenGroupProps.DismissDetail>;
21
+ /**
22
+ * Specifies the maximum number of displayed tokens. If the property isn't set, all of the tokens are displayed.
23
+ */
24
+ limit?: number;
25
+ /**
26
+ * Specifies the direction in which tokens are aligned (`horizontal | vertical`).
27
+ */
28
+ alignment?: FileTokenGroupProps.Alignment;
29
+ /**
30
+ *
31
+ * An array of objects representing token items. Each token has the following properties:
32
+ *
33
+ * - `file` (string) - File value.
34
+ * - `loading` (boolean) - (Optional) Determine whether the token is loading.
35
+ * - `errorText` (string) - (Optional) Text that displays as a validation error message.
36
+ * - `warningText` (string) - (Optional) - Text that displays as a validation warning message.
37
+ */
38
+ items: ReadonlyArray<FileTokenGroupProps.Item>;
39
+ /**
40
+ * Adds an `aria-label` to the "Show fewer" button.
41
+ * Use to assign unique labels when there are multiple file token groups with the same `limitShowFewer` label on one page.
42
+ */
43
+ limitShowFewerAriaLabel?: string;
44
+ /**
45
+ * Adds an `aria-label` to the "Show more" button.
46
+ * Use to assign unique labels when there are multiple file token groups with the same `limitShowMore` label on one page.
47
+ */
48
+ limitShowMoreAriaLabel?: string;
49
+ /**
50
+ * Specifies if the control is read-only, which prevents the
51
+ * user from modifying the value. A read-only control is still focusable.
52
+ */
53
+ readOnly?: boolean;
54
+ /**
55
+ * An object containing all the localized strings required by the component:
56
+ * * `removeFileAriaLabel` (function): A function to render the ARIA label for file token remove button.
57
+ * * `errorIconAriaLabel` (string): The ARIA label to be shown on the error file icon.
58
+ * * `warningIconAriaLabel` (string): The ARIA label to be shown on the warning file icon.
59
+ * * `formatFileSize` (function): (Optional) A function that takes file size in bytes, and produces a formatted string.
60
+ * * `formatFileLastModified` (function): (Optional) A function that takes the files last modified date, and produces a formatted string.
61
+ */
62
+ i18nStrings: FileTokenGroupProps.I18nStrings;
63
+ }
64
+ export declare namespace FileTokenGroupProps {
65
+ interface DismissDetail {
66
+ fileIndex: number;
67
+ }
68
+ interface I18nStrings {
69
+ limitShowFewer?: string;
70
+ limitShowMore?: string;
71
+ removeFileAriaLabel: (fileIndex: number) => string;
72
+ errorIconAriaLabel?: string;
73
+ warningIconAriaLabel?: string;
74
+ formatFileSize?: (sizeInBytes: number) => string;
75
+ formatFileLastModified?: (date: Date) => string;
76
+ }
77
+ type Alignment = 'horizontal' | 'vertical';
78
+ interface Item {
79
+ file: File;
80
+ loading?: boolean;
81
+ errorText?: null | string;
82
+ warningText?: null | string;
83
+ }
84
+ }
85
+ //# sourceMappingURL=interfaces.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/file-token-group/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,cAAc,CAAC;AAEzD,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB;IAC7D;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAE/B;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;OAGG;IACH,SAAS,EAAE,yBAAyB,CAAC,mBAAmB,CAAC,aAAa,CAAC,CAAC;IAExE;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,SAAS,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC;IAE1C;;;;;;;;OAQG;IACH,KAAK,EAAE,aAAa,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC;IAC/C;;;OAGG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;OAGG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;OAOG;IACH,WAAW,EAAE,mBAAmB,CAAC,WAAW,CAAC;CAC9C;AAED,yBAAiB,mBAAmB,CAAC;IACnC,UAAiB,aAAa;QAC5B,SAAS,EAAE,MAAM,CAAC;KACnB;IAED,UAAiB,WAAW;QAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;QACxB,aAAa,CAAC,EAAE,MAAM,CAAC;QAEvB,mBAAmB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;QACnD,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,cAAc,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,MAAM,CAAC;QACjD,sBAAsB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC;KACjD;IAED,KAAY,SAAS,GAAG,YAAY,GAAG,UAAU,CAAC;IAElD,UAAiB,IAAI;QACnB,IAAI,EAAE,IAAI,CAAC;QACX,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;QAC1B,WAAW,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;KAC7B;CACF"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=interfaces.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../src/internal/components/file-token-group/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../../base-component';\nimport { NonCancelableEventHandler } from '../../events';\n\nexport interface FileTokenGroupProps extends BaseComponentProps {\n /**\n * Show file size in the token. Use `i18nStrings.formatFileSize` to customize it.\n */\n showFileSize?: boolean;\n\n /**\n * Show file last modified timestamp in the token. Use `i18nStrings.formatFileLastModified` to customize it.\n */\n showFileLastModified?: boolean;\n\n /**\n * Show file thumbnail in the token. Only supported for images.\n */\n showFileThumbnail?: boolean;\n /**\n * Called when the user clicks on the dismiss button. The token won't be automatically removed.\n * Make sure that you add a listener to this event to update your application state.\n */\n onDismiss: NonCancelableEventHandler<FileTokenGroupProps.DismissDetail>;\n\n /**\n * Specifies the maximum number of displayed tokens. If the property isn't set, all of the tokens are displayed.\n */\n limit?: number;\n /**\n * Specifies the direction in which tokens are aligned (`horizontal | vertical`).\n */\n alignment?: FileTokenGroupProps.Alignment;\n\n /**\n *\n * An array of objects representing token items. Each token has the following properties:\n *\n * - `file` (string) - File value.\n * - `loading` (boolean) - (Optional) Determine whether the token is loading.\n * - `errorText` (string) - (Optional) Text that displays as a validation error message.\n * - `warningText` (string) - (Optional) - Text that displays as a validation warning message.\n */\n items: ReadonlyArray<FileTokenGroupProps.Item>;\n /**\n * Adds an `aria-label` to the \"Show fewer\" button.\n * Use to assign unique labels when there are multiple file token groups with the same `limitShowFewer` label on one page.\n */\n limitShowFewerAriaLabel?: string;\n /**\n * Adds an `aria-label` to the \"Show more\" button.\n * Use to assign unique labels when there are multiple file token groups with the same `limitShowMore` label on one page.\n */\n limitShowMoreAriaLabel?: string;\n /**\n * Specifies if the control is read-only, which prevents the\n * user from modifying the value. A read-only control is still focusable.\n */\n readOnly?: boolean;\n /**\n * An object containing all the localized strings required by the component:\n * * `removeFileAriaLabel` (function): A function to render the ARIA label for file token remove button.\n * * `errorIconAriaLabel` (string): The ARIA label to be shown on the error file icon.\n * * `warningIconAriaLabel` (string): The ARIA label to be shown on the warning file icon.\n * * `formatFileSize` (function): (Optional) A function that takes file size in bytes, and produces a formatted string.\n * * `formatFileLastModified` (function): (Optional) A function that takes the files last modified date, and produces a formatted string.\n */\n i18nStrings: FileTokenGroupProps.I18nStrings;\n}\n\nexport namespace FileTokenGroupProps {\n export interface DismissDetail {\n fileIndex: number;\n }\n\n export interface I18nStrings {\n limitShowFewer?: string;\n limitShowMore?: string;\n\n removeFileAriaLabel: (fileIndex: number) => string;\n errorIconAriaLabel?: string;\n warningIconAriaLabel?: string;\n formatFileSize?: (sizeInBytes: number) => string;\n formatFileLastModified?: (date: Date) => string;\n }\n\n export type Alignment = 'horizontal' | 'vertical';\n\n export interface Item {\n file: File;\n loading?: boolean;\n errorText?: null | string;\n warningText?: null | string;\n }\n}\n"]}
@@ -0,0 +1,27 @@
1
+
2
+ import './styles.scoped.css';
3
+ export default {
4
+ "root": "awsui_root_ofwwb_9obu5_205",
5
+ "file-loading-overlay": "awsui_file-loading-overlay_ofwwb_9obu5_240",
6
+ "file-loading-overlay-single-row": "awsui_file-loading-overlay-single-row_ofwwb_9obu5_245",
7
+ "file-option-name": "awsui_file-option-name_ofwwb_9obu5_249",
8
+ "file-option-size": "awsui_file-option-size_ofwwb_9obu5_250",
9
+ "file-option-last-modified": "awsui_file-option-last-modified_ofwwb_9obu5_251",
10
+ "file-option": "awsui_file-option_ofwwb_9obu5_249",
11
+ "file-option-thumbnail": "awsui_file-option-thumbnail_ofwwb_9obu5_264",
12
+ "file-option-thumbnail-image": "awsui_file-option-thumbnail-image_ofwwb_9obu5_268",
13
+ "file-option-metadata": "awsui_file-option-metadata_ofwwb_9obu5_281",
14
+ "with-image": "awsui_with-image_ofwwb_9obu5_284",
15
+ "single-row-loading": "awsui_single-row-loading_ofwwb_9obu5_287",
16
+ "token": "awsui_token_ofwwb_9obu5_291",
17
+ "token-grid": "awsui_token-grid_ofwwb_9obu5_298",
18
+ "token-contains-image": "awsui_token-contains-image_ofwwb_9obu5_307",
19
+ "token-box": "awsui_token-box_ofwwb_9obu5_311",
20
+ "horizontal": "awsui_horizontal_ofwwb_9obu5_330",
21
+ "error": "awsui_error_ofwwb_9obu5_338",
22
+ "dismiss-button": "awsui_dismiss-button_ofwwb_9obu5_342",
23
+ "warning": "awsui_warning_ofwwb_9obu5_348",
24
+ "read-only": "awsui_read-only_ofwwb_9obu5_358",
25
+ "loading": "awsui_loading_ofwwb_9obu5_371"
26
+ };
27
+