@cloudscape-design/components-themeable 3.0.895 → 3.0.896
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/date-range-picker/calendar/grids/styles.scss +52 -44
- package/lib/internal/scss/date-range-picker/relative-range/styles.scss +0 -9
- package/lib/internal/scss/date-range-picker/styles.scss +2 -47
- package/lib/internal/scss/date-range-picker/test-classes/styles.scss +37 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.d.ts.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.js +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.js.map +1 -1
- package/lib/internal/template/breadcrumb-group/item/item.d.ts.map +1 -1
- package/lib/internal/template/breadcrumb-group/item/item.js +1 -1
- package/lib/internal/template/breadcrumb-group/item/item.js.map +1 -1
- package/lib/internal/template/button/internal.d.ts.map +1 -1
- package/lib/internal/template/button/internal.js +1 -1
- package/lib/internal/template/button/internal.js.map +1 -1
- package/lib/internal/template/button-group/file-input-item.d.ts +5 -3
- package/lib/internal/template/button-group/file-input-item.d.ts.map +1 -1
- package/lib/internal/template/button-group/file-input-item.js +2 -2
- package/lib/internal/template/button-group/file-input-item.js.map +1 -1
- package/lib/internal/template/button-group/icon-button-item.d.ts +5 -3
- package/lib/internal/template/button-group/icon-button-item.d.ts.map +1 -1
- package/lib/internal/template/button-group/icon-button-item.js +2 -2
- package/lib/internal/template/button-group/icon-button-item.js.map +1 -1
- package/lib/internal/template/button-group/icon-toggle-button-item.d.ts +5 -3
- package/lib/internal/template/button-group/icon-toggle-button-item.d.ts.map +1 -1
- package/lib/internal/template/button-group/icon-toggle-button-item.js +2 -2
- package/lib/internal/template/button-group/icon-toggle-button-item.js.map +1 -1
- package/lib/internal/template/button-group/item-element.d.ts.map +1 -1
- package/lib/internal/template/button-group/item-element.js +4 -4
- package/lib/internal/template/button-group/item-element.js.map +1 -1
- package/lib/internal/template/button-group/menu-dropdown-item.d.ts +1 -0
- package/lib/internal/template/button-group/menu-dropdown-item.d.ts.map +1 -1
- package/lib/internal/template/button-group/menu-dropdown-item.js +2 -2
- package/lib/internal/template/button-group/menu-dropdown-item.js.map +1 -1
- package/lib/internal/template/calendar/grid/index.d.ts.map +1 -1
- package/lib/internal/template/calendar/grid/index.js +1 -1
- package/lib/internal/template/calendar/grid/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/grid-cell.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/grid-cell.js +2 -2
- package/lib/internal/template/date-range-picker/calendar/grids/grid-cell.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/grid.d.ts +18 -0
- package/lib/internal/template/date-range-picker/calendar/grids/grid.d.ts.map +1 -0
- package/lib/internal/template/date-range-picker/calendar/grids/grid.js +174 -0
- package/lib/internal/template/date-range-picker/calendar/grids/grid.js.map +1 -0
- package/lib/internal/template/date-range-picker/calendar/grids/index.d.ts +3 -20
- package/lib/internal/template/date-range-picker/calendar/grids/index.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/index.js +51 -22
- package/lib/internal/template/date-range-picker/calendar/grids/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/interfaces.d.ts +47 -0
- package/lib/internal/template/date-range-picker/calendar/grids/interfaces.d.ts.map +1 -0
- package/lib/internal/template/date-range-picker/calendar/grids/interfaces.js +2 -0
- package/lib/internal/template/date-range-picker/calendar/grids/interfaces.js.map +1 -0
- package/lib/internal/template/date-range-picker/calendar/grids/intl.d.ts +17 -0
- package/lib/internal/template/date-range-picker/calendar/grids/intl.d.ts.map +1 -0
- package/lib/internal/template/date-range-picker/calendar/grids/intl.js +56 -0
- package/lib/internal/template/date-range-picker/calendar/grids/intl.js.map +1 -0
- package/lib/internal/template/date-range-picker/calendar/grids/styles.css.js +30 -24
- package/lib/internal/template/date-range-picker/calendar/grids/styles.scoped.css +62 -46
- package/lib/internal/template/date-range-picker/calendar/grids/styles.selectors.js +30 -24
- package/lib/internal/template/date-range-picker/calendar/header/header-button.d.ts +5 -4
- package/lib/internal/template/date-range-picker/calendar/header/header-button.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/header/header-button.js +6 -6
- package/lib/internal/template/date-range-picker/calendar/header/header-button.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/header/index.d.ts +6 -4
- package/lib/internal/template/date-range-picker/calendar/header/index.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/header/index.js +18 -13
- package/lib/internal/template/date-range-picker/calendar/header/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/index.d.ts +2 -1
- package/lib/internal/template/date-range-picker/calendar/index.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/index.js +49 -41
- package/lib/internal/template/date-range-picker/calendar/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/range-inputs.d.ts +4 -3
- package/lib/internal/template/date-range-picker/calendar/range-inputs.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/range-inputs.js +23 -10
- package/lib/internal/template/date-range-picker/calendar/range-inputs.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/utils.d.ts +2 -0
- package/lib/internal/template/date-range-picker/calendar/utils.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/utils.js +27 -1
- package/lib/internal/template/date-range-picker/calendar/utils.js.map +1 -1
- package/lib/internal/template/date-range-picker/dropdown.d.ts +3 -2
- package/lib/internal/template/date-range-picker/dropdown.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/dropdown.js +17 -12
- package/lib/internal/template/date-range-picker/dropdown.js.map +1 -1
- package/lib/internal/template/date-range-picker/index.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/index.js +17 -8
- package/lib/internal/template/date-range-picker/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/interfaces.d.ts +89 -14
- package/lib/internal/template/date-range-picker/interfaces.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/interfaces.js.map +1 -1
- package/lib/internal/template/date-range-picker/mode-switcher.js +2 -2
- package/lib/internal/template/date-range-picker/mode-switcher.js.map +1 -1
- package/lib/internal/template/date-range-picker/relative-range/index.d.ts +2 -1
- package/lib/internal/template/date-range-picker/relative-range/index.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/relative-range/index.js +14 -8
- package/lib/internal/template/date-range-picker/relative-range/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/relative-range/styles.css.js +6 -9
- package/lib/internal/template/date-range-picker/relative-range/styles.scoped.css +10 -19
- package/lib/internal/template/date-range-picker/relative-range/styles.selectors.js +6 -9
- package/lib/internal/template/date-range-picker/styles.css.js +23 -38
- package/lib/internal/template/date-range-picker/styles.scoped.css +32 -78
- package/lib/internal/template/date-range-picker/styles.selectors.js +23 -38
- package/lib/internal/template/date-range-picker/test-classes/styles.css.js +36 -2
- package/lib/internal/template/date-range-picker/test-classes/styles.scoped.css +36 -2
- package/lib/internal/template/date-range-picker/test-classes/styles.selectors.js +36 -2
- package/lib/internal/template/date-range-picker/utils.d.ts +9 -11
- package/lib/internal/template/date-range-picker/utils.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/utils.js +43 -32
- package/lib/internal/template/date-range-picker/utils.js.map +1 -1
- package/lib/internal/template/file-token-group/file-token.d.ts.map +1 -1
- package/lib/internal/template/file-token-group/file-token.js +1 -1
- package/lib/internal/template/file-token-group/file-token.js.map +1 -1
- package/lib/internal/template/i18n/messages/all.all.js +1 -1
- package/lib/internal/template/i18n/messages/all.all.json +1 -1
- package/lib/internal/template/i18n/messages/all.en.js +1 -1
- package/lib/internal/template/i18n/messages/all.en.json +1 -1
- package/lib/internal/template/i18n/messages-types.d.ts +9 -0
- package/lib/internal/template/i18n/messages-types.d.ts.map +1 -1
- package/lib/internal/template/i18n/messages-types.js.map +1 -1
- package/lib/internal/template/internal/components/tooltip/index.d.ts +2 -1
- package/lib/internal/template/internal/components/tooltip/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/tooltip/index.js +21 -2
- package/lib/internal/template/internal/components/tooltip/index.js.map +1 -1
- package/lib/internal/template/internal/environment.js +1 -1
- package/lib/internal/template/internal/environment.json +1 -1
- package/lib/internal/template/internal/utils/date-time/calendar.d.ts +22 -6
- package/lib/internal/template/internal/utils/date-time/calendar.d.ts.map +1 -1
- package/lib/internal/template/internal/utils/date-time/calendar.js +62 -6
- package/lib/internal/template/internal/utils/date-time/calendar.js.map +1 -1
- package/lib/internal/template/multiselect/index.d.ts.map +1 -1
- package/lib/internal/template/multiselect/index.js +2 -3
- package/lib/internal/template/multiselect/index.js.map +1 -1
- package/lib/internal/template/progress-bar/index.d.ts.map +1 -1
- package/lib/internal/template/progress-bar/index.js +4 -3
- package/lib/internal/template/progress-bar/index.js.map +1 -1
- package/lib/internal/template/progress-bar/internal.js +2 -2
- package/lib/internal/template/progress-bar/internal.js.map +1 -1
- package/lib/internal/template/segmented-control/segment.d.ts.map +1 -1
- package/lib/internal/template/segmented-control/segment.js +1 -1
- package/lib/internal/template/segmented-control/segment.js.map +1 -1
- package/lib/internal/template/select/parts/item.d.ts.map +1 -1
- package/lib/internal/template/select/parts/item.js +4 -2
- package/lib/internal/template/select/parts/item.js.map +1 -1
- package/lib/internal/template/select/parts/multiselect-item.d.ts.map +1 -1
- package/lib/internal/template/select/parts/multiselect-item.js +4 -2
- package/lib/internal/template/select/parts/multiselect-item.js.map +1 -1
- package/lib/internal/template/slider/internal.d.ts.map +1 -1
- package/lib/internal/template/slider/internal.js +1 -1
- package/lib/internal/template/slider/internal.js.map +1 -1
- package/lib/internal/template/tabs/tab-header-bar.d.ts.map +1 -1
- package/lib/internal/template/tabs/tab-header-bar.js +1 -1
- package/lib/internal/template/tabs/tab-header-bar.js.map +1 -1
- package/lib/internal/template/test-utils/dom/date-range-picker/index.d.ts +26 -0
- package/lib/internal/template/test-utils/dom/date-range-picker/index.js +58 -24
- package/lib/internal/template/test-utils/dom/date-range-picker/index.js.map +1 -1
- package/lib/internal/template/test-utils/selectors/date-range-picker/index.d.ts +26 -0
- package/lib/internal/template/test-utils/selectors/date-range-picker/index.js +58 -24
- package/lib/internal/template/test-utils/selectors/date-range-picker/index.js.map +1 -1
- package/lib/internal/template/test-utils/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/monthly-grid.d.ts +0 -39
- package/lib/internal/template/date-range-picker/calendar/grids/monthly-grid.d.ts.map +0 -1
- package/lib/internal/template/date-range-picker/calendar/grids/monthly-grid.js +0 -97
- package/lib/internal/template/date-range-picker/calendar/grids/monthly-grid.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-token.d.ts","sourceRoot":"","sources":["../../../src/file-token-group/file-token.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAKhD,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAMzE,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAO/D,yBAAiB,cAAc,CAAC;IAC9B,UAAiB,WAAW;QAC1B,mBAAmB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;QACpD,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,UAAU,cAAe,SAAQ,kBAAkB;IACjD,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,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC;IACzC,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,
|
|
1
|
+
{"version":3,"file":"file-token.d.ts","sourceRoot":"","sources":["../../../src/file-token-group/file-token.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAKhD,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAMzE,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAO/D,yBAAiB,cAAc,CAAC;IAC9B,UAAiB,WAAW;QAC1B,mBAAmB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;QACpD,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,UAAU,cAAe,SAAQ,kBAAkB;IACjD,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,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC;IACzC,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,eAkIhB;AAED,eAAe,iBAAiB,CAAC"}
|
|
@@ -69,7 +69,7 @@ function InternalFileToken({ file, showFileLastModified, showFileSize, showFileT
|
|
|
69
69
|
onDismiss && !readOnly && React.createElement(DismissButton, { dismissLabel: getDismissLabel(index), onDismiss: onDismiss })),
|
|
70
70
|
errorText && (React.createElement(FormFieldError, { id: errorId, errorIconAriaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.errorIconAriaLabel }, errorText)),
|
|
71
71
|
showWarning && (React.createElement(FormFieldWarning, { id: warningId, warningIconAriaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.warningIconAriaLabel }, warningText)),
|
|
72
|
-
showTooltip && isEllipsisActive() && (React.createElement(Tooltip, { trackRef: containerRef, trackKey: file.name, value: React.createElement(InternalBox, { fontWeight: "normal" }, file.name) }))));
|
|
72
|
+
showTooltip && isEllipsisActive() && (React.createElement(Tooltip, { trackRef: containerRef, trackKey: file.name, value: React.createElement(InternalBox, { fontWeight: "normal" }, file.name), onDismiss: () => setShowTooltip(false) }))));
|
|
73
73
|
}
|
|
74
74
|
export default InternalFileToken;
|
|
75
75
|
//# sourceMappingURL=file-token.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"file-token.js","sourceRoot":"","sources":["../../../src/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 { BaseComponentProps } from '../internal/base-component/index.js';\nimport Tooltip from '../internal/components/tooltip/index';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\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 * 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\ninterface 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 const getDismissLabel = (fileIndex: number) => {\n return i18nStrings?.removeFileAriaLabel?.(fileIndex);\n };\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 && showFileThumbnail,\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 && <DismissButton dismissLabel={getDismissLabel(index)} onDismiss={onDismiss} />}\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"]}
|
|
1
|
+
{"version":3,"file":"file-token.js","sourceRoot":"","sources":["../../../src/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 { BaseComponentProps } from '../internal/base-component/index.js';\nimport Tooltip from '../internal/components/tooltip/index';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\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 * 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\ninterface 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 const getDismissLabel = (fileIndex: number) => {\n return i18nStrings?.removeFileAriaLabel?.(fileIndex);\n };\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 && showFileThumbnail,\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 && <DismissButton dismissLabel={getDismissLabel(index)} onDismiss={onDismiss} />}\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 onDismiss={() => setShowTooltip(false)}\n />\n )}\n </div>\n );\n}\n\nexport default InternalFileToken;\n"]}
|