npm - @carbon/web-components - Versions diffs - 2.52.0 → 2.53.0-rc.0 - Mend

@carbon/web-components 2.52.0 → 2.53.0-rc.0

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 (1760) hide show

package/es-custom/components/dropdown/dropdown.scss.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown.scss.js","names":[],"sources":["../../../src/components/dropdown/dropdown.scss?lit"],"sourcesContent":["//\n// Copyright IBM Corp. 2019, 2025\n//\n// This source code is licensed under the Apache-2.0 license found in the\n// LICENSE file in the root directory of this source tree.\n//\n\n$css--plex: true !default;\n\n@use '@carbon/styles/scss/config' as ;\n@use '@carbon/styles/scss/spacing' as ;\n@use '@carbon/styles/scss/theme' as ;\n@use '@carbon/styles/scss/utilities' as ;\n@use '@carbon/styles/scss/components/list-box/list-box' as ;\n@use '@carbon/styles/scss/components/dropdown' as ;\n@use '@carbon/styles/scss/components/form';\n@use '@carbon/styles/scss/components/checkbox';\n@use '@carbon/styles/scss/components/tag';\n@use '@carbon/styles/scss/utilities/ai-gradient' as ;\n@use '@carbon/styles/scss/utilities/convert' as convert;\n\n// https://github.com/carbon-design-system/carbon/issues/11408\n@include list-box;\n\n:host(#{$prefix}-dropdown) {\n outline: none;\n\n .#{$prefix}--list-box {\n box-sizing: border-box;\n }\n\n .#{$prefix}--list-box--expanded {\n border-block-end-color: $border-subtle;\n }\n\n .#{$prefix}--assistive-text {\n inset-block-start: -100%;\n // Hides screen reader cursor\n inset-inline-start: -100%;\n }\n\n .#{$prefix}--label[hidden] {\n display: none;\n }\n\n .#{$prefix}--list-box__menu {\n inset-block-start: 100%;\n margin-block-start: 1px;\n outline: none;\n }\n}\n\n:host(#{$prefix}-dropdown[ai-label]) .#{$prefix}--list-box__wrapper--decorator {\n @include ai-gradient;\n}\n\n:host(#{$prefix}-dropdown[invalid]:not([disabled]):not([read-only])) {\n .#{$prefix}--form__helper-text {\n color: $text-error !important; / stylelint-disable-line declaration-no-important */\n }\n}\n\n:host(#{$prefix}-dropdown[read-only]) {\n @extend .#{$prefix}--dropdown--readonly;\n\n .#{$prefix}--list-box {\n background-color: transparent;\n border-block-end-color: $border-subtle;\n }\n}\n\n:host(#{$prefix}-dropdown[ai-label][read-only]),\n:host(#{$prefix}-dropdown[ai-label][disabled]) {\n .#{$prefix}--list-box {\n border-block-end-color: $ai-border-strong;\n }\n\n .#{$prefix}--list-box__field {\n border-block-end: 1px solid $ai-border-strong;\n }\n\n ::slotted(#{$prefix}-ai-label)::before {\n display: none;\n }\n}\n\n:host(#{$prefix}-combo-box[direction='top']),\n:host(#{$prefix}-dropdown[direction='top']) {\n @extend .#{$prefix}--list-box--up;\n\n .#{$prefix}--list-box__menu {\n inset-block-start: auto;\n }\n}\n\n:host(#{$prefix}-dropdown[type='inline']) {\n @extend .#{$prefix}--list-box__wrapper--inline;\n\n grid-gap: 0 $spacing-06;\n\n .#{$prefix}--list-box__menu {\n margin-block-start: 0;\n }\n}\n\n:host(#{$prefix}-dropdown[type='inline']) {\n .#{$prefix}--list-box.#{$prefix}--list-box--inline\n .#{$prefix}--list-box__field {\n padding-block: 0;\n padding-inline-end: $spacing-09;\n padding-inline-start: $spacing-05;\n }\n}\n\n:host(\n #{$prefix}-dropdown[type='inline'][warn]:not([disabled]):not([read-only])\n ),\n:host(\n #{$prefix}-dropdown[type='inline'][invalid]:not([disabled]):not([read-only])\n ) {\n .#{$prefix}--list-box.#{$prefix}--list-box--inline\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-10;\n }\n}\n\n:host(#{$prefix}-dropdown[ai-label][type='inline'])\n .#{$prefix}--list-box__expanded {\n border-block-end: 1px solid $ai-border-strong;\n}\n\n:host(#{$prefix}-dropdown[ai-label][type='inline']:not([invalid]):not([warn]))\n .#{$prefix}--list-box.#{$prefix}--list-box--inline\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-10;\n}\n\n:host(#{$prefix}-dropdown[ai-label][type='inline']:not([invalid])),\n:host(#{$prefix}-dropdown[ai-label][type='inline'][read-only]),\n:host(#{$prefix}-dropdown[ai-label][type='inline'][disabled])\n .#{$prefix}--list-box__field {\n border-block-end: 1px solid $ai-border-strong;\n}\n\n:host(#{$prefix}-dropdown[ai-label][type='inline'][warn]),\n:host(#{$prefix}-dropdown[ai-label][type='inline'][invalid]) {\n .#{$prefix}--list-box.#{$prefix}--list-box--inline\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-12;\n }\n}\n\n:host(#{$prefix}-dropdown[type='inline']) .#{$prefix}--list-box__menu-icon {\n inset-inline-end: $spacing-04;\n}\n\n:host(#{$prefix}-dropdown[warn]:not([disabled]):not([read-only])) {\n .#{$prefix}--form__helper-text {\n color: $text-primary;\n }\n}\n\n:host(#{$prefix}-dropdown[warn]),\n:host(#{$prefix}-dropdown[invalid]) {\n .#{$prefix}--form__helper-text {\n grid-column: 2;\n }\n\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-10;\n }\n\n .#{$prefix}--list-box__invalid-icon,\n .#{$prefix}--list-box__invalid-icon--warning {\n inset-inline-end: $spacing-08;\n }\n}\n\n:host(#{$prefix}-dropdown-item) {\n @extend .#{$prefix}--list-box__menu-item;\n\n display: block;\n\n .#{$prefix}--list-box__menu-item__option {\n block-size: auto;\n }\n}\n\n:host(#{$prefix}-dropdown-item:first-of-type) {\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n }\n}\n\n:host(#{$prefix}-dropdown-item:not([disabled]):hover) {\n background-color: $layer-hover;\n}\n\n:host(#{$prefix}-dropdown-item[highlighted]) {\n @extend .#{$prefix}--list-box__menu-item--highlighted;\n}\n\n:host(#{$prefix}-dropdown-item[highlighted-next-sibling])\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n}\n\n:host(#{$prefix}-dropdown-item[hovered-next-sibling])\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n}\n\n:host(#{$prefix}-dropdown-item[disabled])\n .#{$prefix}--list-box__menu-item__option {\n color: $text-disabled;\n cursor: not-allowed;\n text-decoration: none;\n}\n\n:host(#{$prefix}-dropdown[disabled][warn]),\n:host(#{$prefix}-dropdown[disabled][invalid]) {\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-10;\n }\n}\n\n:host(#{$prefix}-dropdown-item[disabled][highlighted-next-sibling]:hover)\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: $border-subtle;\n}\n\n:host(#{$prefix}-dropdown-item[disabled]:hover)\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: $border-subtle-01;\n}\n\n:host(#{$prefix}-dropdown-item[selected]) {\n @extend .#{$prefix}--list-box__menu-item--active;\n\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n color: $text-primary;\n }\n\n .#{$prefix}--list-box__menu-item__selected-icon {\n display: block;\n }\n}\n\n:host(#{$prefix}-dropdown-item[selected-next-sibling])\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n}\n\n:host(#{$prefix}-dropdown-item[disabled][selected-next-sibling]:hover)\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: $border-subtle;\n}\n\n:host(#{$prefix}-dropdown-item[selected][highlighted]) {\n @extend .#{$prefix}--list-box__menu-item--highlighted;\n}\n\n:host(#{$prefix}-dropdown-item[size='sm']) {\n block-size: $spacing-07;\n\n .#{$prefix}--list-box__menu-item__option {\n padding-block: rem(7px);\n }\n}\n\n:host(#{$prefix}-dropdown-item[size='lg']) {\n block-size: $spacing-09;\n\n .#{$prefix}--list-box__menu-item__option {\n padding-block: rem(15px);\n }\n}\n\n:host(#{$prefix}-dropdown-skeleton) {\n @extend .#{$prefix}--form-item;\n\n .#{$prefix}--skeleton {\n @include skeleton;\n }\n}\n// AILabel styles\n$divider-width: 1px;\n\n:host(#{$prefix}-dropdown[ai-label]) {\n @extend .#{$prefix}--list-box__wrapper--slug;\n\n ::slotted(#{$prefix}-ai-label),\n ::slotted(#{$prefix}-slug) {\n position: absolute;\n inset-block-start: 50%;\n inset-inline-end: $spacing-08;\n }\n\n ::slotted(#{$prefix}-ai-label) {\n display: inline-flex;\n align-items: center;\n margin-inline-end: convert.to-rem(9px);\n }\n\n ::slotted(#{$prefix}-ai-label)::after {\n position: absolute;\n display: block;\n background-color: $border-subtle-01;\n block-size: $spacing-05;\n content: '';\n inline-size: convert.to-rem(1px);\n inset-block-start: convert.to-rem(1px);\n inset-inline-end: calc(-#{$spacing-03} - #{$divider-width});\n }\n\n ::slotted(#{$prefix}-ai-label:not([revert-active])),\n ::slotted(#{$prefix}-slug:not([revert-active])) {\n transform: translateY(-50%);\n }\n\n .#{$prefix}--list-box__invalid-icon,\n .#{$prefix}--list-box__invalid-icon--warning {\n inset-inline-end: convert.to-rem(81px);\n }\n}\n\n:host(#{$prefix}-dropdown[ai-label][warn]:not([disabled]):not([read-only])),\n:host(#{$prefix}-dropdown[ai-label][invalid]:not([disabled]):not([read-only])) {\n .#{$prefix}--list-box {\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-12;\n }\n }\n\n ::slotted(#{$prefix}-ai-label)::before {\n position: absolute;\n display: block;\n background-color: $border-subtle-01;\n block-size: $spacing-05;\n content: '';\n inline-size: convert.to-rem(1px);\n inset-block-start: convert.to-rem(1px);\n inset-inline-start: calc(-#{$spacing-03} - #{$divider-width});\n }\n\n ::slotted(#{$prefix}-ai-label),\n ::slotted(#{$prefix}-slug) {\n inset-inline-end: $spacing-08;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"dropdown.scss.js","names":[],"sources":["../../../src/components/dropdown/dropdown.scss?lit"],"sourcesContent":["//\n// Copyright IBM Corp. 2019, 2025\n//\n// This source code is licensed under the Apache-2.0 license found in the\n// LICENSE file in the root directory of this source tree.\n//\n\n$css--plex: true !default;\n\n@use '@carbon/styles/scss/config' as ;\n@use '@carbon/styles/scss/spacing' as ;\n@use '@carbon/styles/scss/theme' as ;\n@use '@carbon/styles/scss/utilities' as ;\n@use '@carbon/styles/scss/components/list-box/list-box' as ;\n@use '@carbon/styles/scss/components/dropdown' as ;\n@use '@carbon/styles/scss/components/form';\n@use '@carbon/styles/scss/components/checkbox';\n@use '@carbon/styles/scss/components/tag';\n@use '@carbon/styles/scss/utilities/ai-gradient' as ;\n@use '@carbon/styles/scss/utilities/convert' as convert;\n\n// https://github.com/carbon-design-system/carbon/issues/11408\n@include list-box;\n\n:host(#{$prefix}-dropdown) {\n outline: none;\n\n .#{$prefix}--list-box {\n box-sizing: border-box;\n }\n\n .#{$prefix}--list-box--expanded {\n border-block-end-color: $border-subtle;\n }\n\n .#{$prefix}--assistive-text {\n inset-block-start: -100%;\n // Hides screen reader cursor\n inset-inline-start: -100%;\n }\n\n .#{$prefix}--label[hidden] {\n display: none;\n }\n\n .#{$prefix}--list-box__menu {\n inset-block-start: 100%;\n margin-block-start: 1px;\n outline: none;\n }\n}\n\n:host(#{$prefix}-dropdown[ai-label]) .#{$prefix}--list-box__wrapper--decorator {\n @include ai-gradient;\n}\n\n:host(#{$prefix}-dropdown[invalid]:not([disabled]):not([read-only])) {\n .#{$prefix}--form__helper-text {\n color: $text-error !important; / stylelint-disable-line declaration-no-important */\n }\n}\n\n:host(#{$prefix}-dropdown[read-only]) {\n @extend .#{$prefix}--dropdown--readonly;\n\n .#{$prefix}--list-box {\n background-color: transparent;\n border-block-end-color: $border-subtle;\n }\n}\n\n:host(#{$prefix}-dropdown[ai-label][read-only]),\n:host(#{$prefix}-dropdown[ai-label][disabled]) {\n .#{$prefix}--list-box {\n border-block-end-color: $ai-border-strong;\n }\n\n .#{$prefix}--list-box__field {\n border-block-end: 1px solid $ai-border-strong;\n }\n\n ::slotted(#{$prefix}-ai-label)::before {\n display: none;\n }\n}\n\n:host(#{$prefix}-combo-box[direction='top']),\n:host(#{$prefix}-dropdown[direction='top']) {\n @extend .#{$prefix}--list-box--up;\n\n .#{$prefix}--list-box__menu {\n inset-block-start: auto;\n }\n}\n\n:host(#{$prefix}-dropdown[type='inline']) {\n @extend .#{$prefix}--list-box__wrapper--inline;\n\n grid-gap: 0 $spacing-03;\n\n .#{$prefix}--list-box__menu {\n margin-block-start: 0;\n }\n}\n\n:host(#{$prefix}-dropdown[type='inline']) {\n .#{$prefix}--list-box.#{$prefix}--list-box--inline\n .#{$prefix}--list-box__field {\n padding-block: 0;\n padding-inline-end: $spacing-09;\n padding-inline-start: $spacing-05;\n }\n}\n\n:host(\n #{$prefix}-dropdown[type='inline'][warn]:not([disabled]):not([read-only])\n ),\n:host(\n #{$prefix}-dropdown[type='inline'][invalid]:not([disabled]):not([read-only])\n ) {\n .#{$prefix}--list-box.#{$prefix}--list-box--inline\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-10;\n }\n}\n\n:host(\n #{$prefix}-dropdown[type='inline'][warn]:not([disabled]):not([read-only])\n ),\n:host(\n #{$prefix}-dropdown[type='inline'][invalid]:not([disabled]):not([read-only])\n ) {\n grid-template: auto / auto min-content auto;\n\n .#{$prefix}--form__helper-text {\n grid-column: 3;\n }\n}\n\n:host(#{$prefix}-dropdown[ai-label][type='inline'])\n .#{$prefix}--list-box__expanded {\n border-block-end: 1px solid $ai-border-strong;\n}\n\n:host(#{$prefix}-dropdown[ai-label][type='inline']:not([invalid]):not([warn]))\n .#{$prefix}--list-box.#{$prefix}--list-box--inline\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-10;\n}\n\n:host(#{$prefix}-dropdown[ai-label][type='inline']:not([invalid])),\n:host(#{$prefix}-dropdown[ai-label][type='inline'][read-only]),\n:host(#{$prefix}-dropdown[ai-label][type='inline'][disabled])\n .#{$prefix}--list-box__field {\n border-block-end: 1px solid $ai-border-strong;\n}\n\n:host(#{$prefix}-dropdown[ai-label][type='inline'][warn]),\n:host(#{$prefix}-dropdown[ai-label][type='inline'][invalid]) {\n .#{$prefix}--list-box.#{$prefix}--list-box--inline\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-12;\n }\n}\n\n:host(#{$prefix}-dropdown[type='inline']) .#{$prefix}--list-box__menu-icon {\n inset-inline-end: $spacing-04;\n}\n\n:host(#{$prefix}-dropdown[warn]:not([disabled]):not([read-only])) {\n .#{$prefix}--form__helper-text {\n color: $text-primary;\n }\n}\n\n:host(#{$prefix}-dropdown[warn]),\n:host(#{$prefix}-dropdown[invalid]) {\n .#{$prefix}--form__helper-text {\n grid-column: 2;\n }\n\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-10;\n }\n\n .#{$prefix}--list-box__invalid-icon,\n .#{$prefix}--list-box__invalid-icon--warning {\n inset-inline-end: $spacing-08;\n }\n}\n\n:host(#{$prefix}-dropdown-item) {\n @extend .#{$prefix}--list-box__menu-item;\n\n display: block;\n\n .#{$prefix}--list-box__menu-item__option {\n block-size: auto;\n }\n}\n\n:host(#{$prefix}-dropdown-item:first-of-type) {\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n }\n}\n\n:host(#{$prefix}-dropdown-item:not([disabled]):hover) {\n background-color: $layer-hover;\n}\n\n:host(#{$prefix}-dropdown-item[highlighted]) {\n @extend .#{$prefix}--list-box__menu-item--highlighted;\n}\n\n:host(#{$prefix}-dropdown-item[highlighted-next-sibling])\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n}\n\n:host(#{$prefix}-dropdown-item[hovered-next-sibling])\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n}\n\n:host(#{$prefix}-dropdown-item[disabled])\n .#{$prefix}--list-box__menu-item__option {\n color: $text-disabled;\n cursor: not-allowed;\n text-decoration: none;\n}\n\n:host(#{$prefix}-dropdown[disabled][warn]),\n:host(#{$prefix}-dropdown[disabled][invalid]) {\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-10;\n }\n}\n\n:host(#{$prefix}-dropdown-item[disabled][highlighted-next-sibling]:hover)\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: $border-subtle;\n}\n\n:host(#{$prefix}-dropdown-item[disabled]:hover)\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: $border-subtle-01;\n}\n\n:host(#{$prefix}-dropdown-item[selected]) {\n @extend .#{$prefix}--list-box__menu-item--active;\n\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n color: $text-primary;\n }\n\n .#{$prefix}--list-box__menu-item__selected-icon {\n display: block;\n }\n}\n\n:host(#{$prefix}-dropdown-item[selected-next-sibling])\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: transparent;\n}\n\n:host(#{$prefix}-dropdown-item[disabled][selected-next-sibling]:hover)\n .#{$prefix}--list-box__menu-item__option {\n border-block-start-color: $border-subtle;\n}\n\n:host(#{$prefix}-dropdown-item[selected][highlighted]) {\n @extend .#{$prefix}--list-box__menu-item--highlighted;\n}\n\n:host(#{$prefix}-dropdown-item[size='sm']) {\n block-size: $spacing-07;\n\n .#{$prefix}--list-box__menu-item__option {\n padding-block: rem(7px);\n }\n}\n\n:host(#{$prefix}-dropdown-item[size='lg']) {\n block-size: $spacing-09;\n\n .#{$prefix}--list-box__menu-item__option {\n padding-block: rem(15px);\n }\n}\n\n:host(#{$prefix}-dropdown-skeleton) {\n @extend .#{$prefix}--form-item;\n\n .#{$prefix}--skeleton {\n @include skeleton;\n }\n}\n// AILabel styles\n$divider-width: 1px;\n\n:host(#{$prefix}-dropdown[ai-label]) {\n @extend .#{$prefix}--list-box__wrapper--slug;\n\n ::slotted(#{$prefix}-ai-label),\n ::slotted(#{$prefix}-slug) {\n position: absolute;\n inset-block-start: 50%;\n inset-inline-end: $spacing-08;\n }\n\n ::slotted(#{$prefix}-ai-label) {\n display: inline-flex;\n align-items: center;\n margin-inline-end: convert.to-rem(9px);\n }\n\n ::slotted(#{$prefix}-ai-label)::after {\n position: absolute;\n display: block;\n background-color: $border-subtle-01;\n block-size: $spacing-05;\n content: '';\n inline-size: convert.to-rem(1px);\n inset-block-start: convert.to-rem(1px);\n inset-inline-end: calc(-#{$spacing-03} - #{$divider-width});\n }\n\n ::slotted(#{$prefix}-ai-label:not([revert-active])),\n ::slotted(#{$prefix}-slug:not([revert-active])) {\n transform: translateY(-50%);\n }\n\n .#{$prefix}--list-box__invalid-icon,\n .#{$prefix}--list-box__invalid-icon--warning {\n inset-inline-end: convert.to-rem(81px);\n }\n}\n\n:host(#{$prefix}-dropdown[ai-label][warn]:not([disabled]):not([read-only])),\n:host(#{$prefix}-dropdown[ai-label][invalid]:not([disabled]):not([read-only])) {\n .#{$prefix}--list-box {\n .#{$prefix}--list-box__field {\n padding-inline-end: $spacing-12;\n }\n }\n\n ::slotted(#{$prefix}-ai-label)::before {\n position: absolute;\n display: block;\n background-color: $border-subtle-01;\n block-size: $spacing-05;\n content: '';\n inline-size: convert.to-rem(1px);\n inset-block-start: convert.to-rem(1px);\n inset-inline-start: calc(-#{$spacing-03} - #{$divider-width});\n }\n\n ::slotted(#{$prefix}-ai-label),\n ::slotted(#{$prefix}-slug) {\n inset-inline-end: $spacing-08;\n }\n}\n"],"mappings":""}

package/es-custom/components/feature-flags/index.js CHANGED Viewed

@@ -6,10 +6,9 @@
  */
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import { FeatureFlags, createScope } from "../../feature-flags/es/index.js";
 import { LitElement, html } from "lit";
 //#region src/components/feature-flags/index.ts
 /**
 * Copyright IBM Corp. 2025, 2026
@@ -112,7 +111,7 @@ function findParentFeatureFlags(el) {
 function isFeatureFlagEnabled(flag, context) {
 	return findParentFeatureFlags(context)?.isFeatureFlagEnabled(flag) ?? false;
 }
 //#endregion
 export { feature_flags_default as default, findParentFeatureFlags, isFeatureFlagEnabled };
 //# sourceMappingURL=index.js.map

package/es-custom/components/feature-flags/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["GlobalFeatureFlags","customElement"],"sources":["../../../src/components/feature-flags/index.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2025, 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n/\n <feature-flags> provides scoped feature flags to child components.\n \n Usage:\n * Wrap any child components inside <feature-flags> to provide scoped feature flags like this:\n * <feature-flags enable-dialog-element=\"true\">\n * <component></component>\n * </feature-flags>\n \n Available flags:\n * - enable-dialog-element\n * - enable-treeview-controllable\n * - ... (and others listed in observedAttributes)\n \n How to check a Flag in your component:\n * import { isFeatureFlagEnabled } from './feature-flags';\n * isFeatureFlagEnabled('enable-dialog-element', this)\n * Returns true if the flag is enabled in the nearest <feature-flags> ancestor\n /\n\nimport {\n FeatureFlags as GlobalFeatureFlags,\n createScope,\n} from '@carbon/feature-flags';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { LitElement, html } from 'lit';\n\n/\n Feature Flags\n \n @element feature-flags\n /\ntype FeatureFlags = Record<string, boolean>;\n\nconst hasOwn = <T extends object>(obj: T, key: PropertyKey): key is keyof T =>\n Object.prototype.hasOwnProperty.call(obj, key);\n\n@customElement('feature-flags')\nclass FeatureFlagsElement extends LitElement {\n private scope = GlobalFeatureFlags;\n private flags: FeatureFlags = {};\n\n /\n Mapping of feature flag attributes to their related component names.\n */\n private static readonly flagComponentMap = {\n 'enable-v12-tile-default-icons': 'CDS-TILE',\n 'enable-v12-tile-radio-icons': 'CDS-TILE',\n 'enable-v12-overflowmenu': 'CDS-OVERFLOW-MENU',\n 'enable-treeview-controllable': 'CDS-TREEVIEW',\n 'enable-experimental-focus-wrap-without-sentinels': 'CDS-FOCUS-WRAP',\n 'enable-focus-wrap-without-sentinels': 'CDS-FOCUS-WRAP',\n 'enable-dialog-element': 'CDS-DIALOG',\n 'enable-v12-dynamic-floating-styles': 'CDS-FLOATING',\n 'enable-v12-toggle-reduced-label-spacing': 'CDS-TOGGLE',\n } as const;\n\n static get observedAttributes() {\n return Object.keys(FeatureFlagsElement.flagComponentMap);\n }\n\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.updateScope();\n }\n\n attributeChangedCallback(\n name: string,\n _oldVal: string \| null,\n newVal: string \| null\n ) {\n const value = newVal === 'true';\n this.flags[name] = value;\n\n // Set feature flag to top component level\n const relatedComponent = hasOwn(FeatureFlagsElement.flagComponentMap, name)\n ? FeatureFlagsElement.flagComponentMap[name]\n : 'unknown';\n if (this.firstElementChild?.tagName === relatedComponent) {\n this.firstElementChild.setAttribute(name, '');\n }\n\n this.updateScope();\n }\n\n private getParentScope() {\n let parent = this.parentNode;\n while (parent) {\n if (parent instanceof FeatureFlagsElement) {\n return parent.getScope();\n }\n parent = parent.parentNode;\n }\n return null;\n }\n\n private updateScope() {\n const newScope = createScope(this.flags);\n const parentScope = this.getParentScope() \|\| GlobalFeatureFlags;\n if (parentScope) {\n newScope.mergeWithScope(parentScope);\n }\n this.scope = newScope;\n }\n\n render() {\n return html` <slot></slot> `;\n }\n\n public isFeatureFlagEnabled(flag: string) {\n return this.scope.enabled(flag);\n }\n\n private getScope() {\n return this.scope;\n }\n}\n\nexport default FeatureFlagsElement;\n\n// Utility functions\n\n// Function to find the nearest parent FeatureFlagsElement\nexport function findParentFeatureFlags(\n el: HTMLElement\n): FeatureFlagsElement \| null {\n let parent = el.parentNode;\n while (parent) {\n if (parent instanceof FeatureFlagsElement) {\n return parent;\n }\n parent = (parent as HTMLElement).parentNode;\n }\n return null;\n}\n\n// function to check if a feature flag is enabled in components\nexport function isFeatureFlagEnabled(\n flag: string,\n context: HTMLElement\n): boolean {\n const instance = findParentFeatureFlags(context);\n return instance?.isFeatureFlagEnabled(flag) ?? false;\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAwCA,MAAM,UAA4B,KAAQ,QACxC,OAAO,UAAU,eAAe,KAAK,KAAK,IAAI;AAEhD,~~gCACM~~,4BAA4B,WAAW;;;;;0BAOA;GACzC,iCAAiC;GACjC,+BAA+B;GAC/B,2BAA2B;GAC3B,gCAAgC;GAChC,oDAAoD;GACpD,uCAAuC;GACvC,yBAAyB;GACzB,sCAAsC;GACtC,2CAA2C;GAC5C;;CAED,WAAW,qBAAqB;AAC9B,SAAO,OAAO,~~0BAAyB~~,iBAAiB;;CAG1D,cAAc;AACZ,SAAO;eAvBOA;eACc,EAAE;AAuB9B,OAAK,aAAa,EAAE,MAAM,QAAQ,CAAC;;CAGrC,oBAAoB;AAClB,QAAM,mBAAmB;AACzB,OAAK,aAAa;;CAGpB,yBACE,MACA,SACA,QACA;EACA,MAAM,QAAQ,WAAW;AACzB,OAAK,MAAM,QAAQ;EAGnB,MAAM,mBAAmB,~~4BAA2B~~,kBAAkB,KAAK,~~wBACnD~~,iBAAiB,QACrC;AACJ,MAAI,KAAK,mBAAmB,YAAY,iBACtC,MAAK,kBAAkB,aAAa,MAAM,GAAG;AAG/C,OAAK,aAAa;;CAGpB,~~AAAQ,iBAAiB~~;EACvB,IAAI,SAAS,KAAK;AAClB,SAAO,QAAQ;AACb,OAAI,~~uCACF~~,QAAO,OAAO,UAAU;AAE1B,YAAS,OAAO;;AAElB,SAAO;;CAGT,~~AAAQ,cAAc~~;EACpB,MAAM,WAAW,YAAY,KAAK,MAAM;EACxC,MAAM,cAAc,KAAK,gBAAgB,IAAIA;AAC7C,MAAI,YACF,UAAS,eAAe,YAAY;AAEtC,OAAK,QAAQ;;CAGf,SAAS;AACP,SAAO,IAAI;;CAGb,~~AAAO~~,~~qBAAqB,~~MAAc;AACxC,SAAO,KAAK,MAAM,QAAQ,KAAK;;CAGjC,~~AAAQ,WAAW~~;AACjB,SAAO,KAAK;;;yDAlFfC,cAAc,gBAAgB;AAsF/B,~~4BAAe~~;AAKf,SAAgB,uBACd,IAC4B;CAC5B,IAAI,SAAS,GAAG;AAChB,QAAO,QAAQ;AACb,MAAI,kBAAkB,oBACpB,QAAO;AAET,WAAU,OAAuB;;AAEnC,QAAO;;AAIT,SAAgB,qBACd,MACA,SACS;AAET,QADiB,uBAAuB,QAAQ,EAC/B,qBAAqB,KAAK,IAAI"}
1	+ {"version":3,"file":"index.js","names":["GlobalFeatureFlags","customElement"],"sources":["../../../src/components/feature-flags/index.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2025, 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n/\n <feature-flags> provides scoped feature flags to child components.\n \n Usage:\n * Wrap any child components inside <feature-flags> to provide scoped feature flags like this:\n * <feature-flags enable-dialog-element=\"true\">\n * <component></component>\n * </feature-flags>\n \n Available flags:\n * - enable-dialog-element\n * - enable-treeview-controllable\n * - ... (and others listed in observedAttributes)\n \n How to check a Flag in your component:\n * import { isFeatureFlagEnabled } from './feature-flags';\n * isFeatureFlagEnabled('enable-dialog-element', this)\n * Returns true if the flag is enabled in the nearest <feature-flags> ancestor\n /\n\nimport {\n FeatureFlags as GlobalFeatureFlags,\n createScope,\n} from '@carbon/feature-flags';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { LitElement, html } from 'lit';\n\n/\n Feature Flags\n \n @element feature-flags\n /\ntype FeatureFlags = Record<string, boolean>;\n\nconst hasOwn = <T extends object>(obj: T, key: PropertyKey): key is keyof T =>\n Object.prototype.hasOwnProperty.call(obj, key);\n\n@customElement('feature-flags')\nclass FeatureFlagsElement extends LitElement {\n private scope = GlobalFeatureFlags;\n private flags: FeatureFlags = {};\n\n /\n Mapping of feature flag attributes to their related component names.\n */\n private static readonly flagComponentMap = {\n 'enable-v12-tile-default-icons': 'CDS-TILE',\n 'enable-v12-tile-radio-icons': 'CDS-TILE',\n 'enable-v12-overflowmenu': 'CDS-OVERFLOW-MENU',\n 'enable-treeview-controllable': 'CDS-TREEVIEW',\n 'enable-experimental-focus-wrap-without-sentinels': 'CDS-FOCUS-WRAP',\n 'enable-focus-wrap-without-sentinels': 'CDS-FOCUS-WRAP',\n 'enable-dialog-element': 'CDS-DIALOG',\n 'enable-v12-dynamic-floating-styles': 'CDS-FLOATING',\n 'enable-v12-toggle-reduced-label-spacing': 'CDS-TOGGLE',\n } as const;\n\n static get observedAttributes() {\n return Object.keys(FeatureFlagsElement.flagComponentMap);\n }\n\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.updateScope();\n }\n\n attributeChangedCallback(\n name: string,\n _oldVal: string \| null,\n newVal: string \| null\n ) {\n const value = newVal === 'true';\n this.flags[name] = value;\n\n // Set feature flag to top component level\n const relatedComponent = hasOwn(FeatureFlagsElement.flagComponentMap, name)\n ? FeatureFlagsElement.flagComponentMap[name]\n : 'unknown';\n if (this.firstElementChild?.tagName === relatedComponent) {\n this.firstElementChild.setAttribute(name, '');\n }\n\n this.updateScope();\n }\n\n private getParentScope() {\n let parent = this.parentNode;\n while (parent) {\n if (parent instanceof FeatureFlagsElement) {\n return parent.getScope();\n }\n parent = parent.parentNode;\n }\n return null;\n }\n\n private updateScope() {\n const newScope = createScope(this.flags);\n const parentScope = this.getParentScope() \|\| GlobalFeatureFlags;\n if (parentScope) {\n newScope.mergeWithScope(parentScope);\n }\n this.scope = newScope;\n }\n\n render() {\n return html` <slot></slot> `;\n }\n\n public isFeatureFlagEnabled(flag: string) {\n return this.scope.enabled(flag);\n }\n\n private getScope() {\n return this.scope;\n }\n}\n\nexport default FeatureFlagsElement;\n\n// Utility functions\n\n// Function to find the nearest parent FeatureFlagsElement\nexport function findParentFeatureFlags(\n el: HTMLElement\n): FeatureFlagsElement \| null {\n let parent = el.parentNode;\n while (parent) {\n if (parent instanceof FeatureFlagsElement) {\n return parent;\n }\n parent = (parent as HTMLElement).parentNode;\n }\n return null;\n}\n\n// function to check if a feature flag is enabled in components\nexport function isFeatureFlagEnabled(\n flag: string,\n context: HTMLElement\n): boolean {\n const instance = findParentFeatureFlags(context);\n return instance?.isFeatureFlagEnabled(flag) ?? false;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA,MAAM,UAA4B,KAAQ,QACxC,OAAO,UAAU,eAAe,KAAK,KAAK,IAAI;AAEhD,IAAA,sBAAA,MACM,4BAA4B,WAAW;;;;;0BAOA;GACzC,iCAAiC;GACjC,+BAA+B;GAC/B,2BAA2B;GAC3B,gCAAgC;GAChC,oDAAoD;GACpD,uCAAuC;GACvC,yBAAyB;GACzB,sCAAsC;GACtC,2CAA2C;GAC5C;;CAED,WAAW,qBAAqB;AAC9B,SAAO,OAAO,KAAA,qBAAyB,iBAAiB;;CAG1D,cAAc;AACZ,SAAO;eAvBOA;eACc,EAAE;AAuB9B,OAAK,aAAa,EAAE,MAAM,QAAQ,CAAC;;CAGrC,oBAAoB;AAClB,QAAM,mBAAmB;AACzB,OAAK,aAAa;;CAGpB,yBACE,MACA,SACA,QACA;EACA,MAAM,QAAQ,WAAW;AACzB,OAAK,MAAM,QAAQ;EAGnB,MAAM,mBAAmB,OAAA,qBAA2B,kBAAkB,KAAK,GAAA,qBACnD,iBAAiB,QACrC;AACJ,MAAI,KAAK,mBAAmB,YAAY,iBACtC,MAAK,kBAAkB,aAAa,MAAM,GAAG;AAG/C,OAAK,aAAa;;CAGpB,iBAAyB;EACvB,IAAI,SAAS,KAAK;AAClB,SAAO,QAAQ;AACb,OAAI,kBAAA,qBACF,QAAO,OAAO,UAAU;AAE1B,YAAS,OAAO;;AAElB,SAAO;;CAGT,cAAsB;EACpB,MAAM,WAAW,YAAY,KAAK,MAAM;EACxC,MAAM,cAAc,KAAK,gBAAgB,IAAIA;AAC7C,MAAI,YACF,UAAS,eAAe,YAAY;AAEtC,OAAK,QAAQ;;CAGf,SAAS;AACP,SAAO,IAAI;;CAGb,qBAA4B,MAAc;AACxC,SAAO,KAAK,MAAM,QAAQ,KAAK;;CAGjC,WAAmB;AACjB,SAAO,KAAK;;;yDAlFfC,cAAc,gBAAgB,CAAA,EAAA,oBAAA;AAsF/B,IAAA,wBAAe;AAKf,SAAgB,uBACd,IAC4B;CAC5B,IAAI,SAAS,GAAG;AAChB,QAAO,QAAQ;AACb,MAAI,kBAAkB,oBACpB,QAAO;AAET,WAAU,OAAuB;;AAEnC,QAAO;;AAIT,SAAgB,qBACd,MACA,SACS;AAET,QADiB,uBAAuB,QAAQ,EAC/B,qBAAqB,KAAK,IAAI"}

package/es-custom/components/file-uploader/defs.js CHANGED Viewed

@@ -48,7 +48,7 @@ let FILE_UPLOADER_ITEM_SIZE = /* @__PURE__ */ function(FILE_UPLOADER_ITEM_SIZE)
 	FILE_UPLOADER_ITEM_SIZE["LARGE"] = "lg";
 	return FILE_UPLOADER_ITEM_SIZE;
 }({});
 //#endregion
 export { FILE_UPLOADER_ITEM_SIZE, FILE_UPLOADER_ITEM_STATE };
 //# sourceMappingURL=defs.js.map

package/es-custom/components/file-uploader/defs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/file-uploader/defs.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2020, 2022, 2023\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\n/\n The state of `<cds-custom-file-uploader-item>`.\n /\nexport enum FILE_UPLOADER_ITEM_STATE {\n /\n Upload in progress.\n /\n UPLOADING = 'uploading',\n\n /\n Upload complete.\n /\n COMPLETE = 'complete',\n\n /\n Editing.\n /\n EDIT = 'edit',\n}\n\n/\n File uploader item size.\n /\nexport enum FILE_UPLOADER_ITEM_SIZE {\n /\n Small size.\n /\n SMALL = 'sm',\n\n /\n Medium size.\n /\n MEDIUM = 'md',\n\n /\n Large size.\n */\n LARGE = 'lg',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,~~8EAAL~~;;;;AAIL;;;;AAKA;;;;AAKA~~;;;;;;AAMF~~,IAAY,~~4EAAL~~;;;;AAIL;;;;AAKA;;;;AAKA"}
1	+ {"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/file-uploader/defs.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2020, 2022, 2023\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\n/\n The state of `<cds-custom-file-uploader-item>`.\n /\nexport enum FILE_UPLOADER_ITEM_STATE {\n /\n Upload in progress.\n /\n UPLOADING = 'uploading',\n\n /\n Upload complete.\n /\n COMPLETE = 'complete',\n\n /\n Editing.\n /\n EDIT = 'edit',\n}\n\n/\n File uploader item size.\n /\nexport enum FILE_UPLOADER_ITEM_SIZE {\n /\n Small size.\n /\n SMALL = 'sm',\n\n /\n Medium size.\n /\n MEDIUM = 'md',\n\n /\n Large size.\n */\n LARGE = 'lg',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,2BAAL,yBAAA,0BAAA;;;;AAIL,0BAAA,eAAA;;;;AAKA,0BAAA,cAAA;;;;AAKA,0BAAA,UAAA;;KACD;;;;AAKD,IAAY,0BAAL,yBAAA,yBAAA;;;;AAIL,yBAAA,WAAA;;;;AAKA,yBAAA,YAAA;;;;AAKA,yBAAA,WAAA;;KACD"}

package/es-custom/components/file-uploader/demo-file-uploader.js CHANGED Viewed

@@ -5,18 +5,17 @@
  * LICENSE file in the root directory of this source tree.
  */
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
-import { BUTTON_SIZE } from "../button/defs.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import "../button/defs.js";
 import "../button/button.js";
-import { FILE_UPLOADER_ITEM_STATE } from "./defs.js";
+import "./defs.js";
 import "./file-uploader-item.js";
 import "./index.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 //#region src/components/file-uploader/demo-file-uploader.ts
 /**
 * Copyright IBM Corp. 2019, 2024
@@ -38,7 +37,7 @@ let CDSCEDemoFileUploader = class CDSCEDemoFileUploader extends LitElement {
 		this.labelDescription = "";
 		this.labelTitle = "";
 		this.multiple = false;
-		this.size = BUTTON_SIZE.MEDIUM;
+		this.size = "md";
 		this.inputState = "";
 	}
 	/**
@@ -51,7 +50,7 @@ let CDSCEDemoFileUploader = class CDSCEDemoFileUploader extends LitElement {
 		const newFiles = addedFiles.map((item) => ({
 			id: Math.random().toString(36).slice(2),
 			file: item,
-			state: FILE_UPLOADER_ITEM_STATE.UPLOADING
+			state: "uploading"
 		}));
 		const { multiple, _files: files, _simulateUpload: simulateUpload } = this;
 		if (multiple) {
@@ -84,7 +83,7 @@ let CDSCEDemoFileUploader = class CDSCEDemoFileUploader extends LitElement {
 		if (file.size > 524288) {
 			this._files = this._files.map((item) => id !== item.id ? item : {
 				...item,
-				state: FILE_UPLOADER_ITEM_STATE.EDIT,
+				state: "edit",
 				invalid: true,
 				errorSubject: "File size exceeds limit",
 				errorBody: "500kb max file size. Select a new file and try again."
@@ -95,13 +94,13 @@ let CDSCEDemoFileUploader = class CDSCEDemoFileUploader extends LitElement {
 			await new Promise((t) => setTimeout(t, rand));
 			this._files = this._files.map((item) => id !== item.id ? item : {
 				...item,
-				state: FILE_UPLOADER_ITEM_STATE.COMPLETE
+				state: "complete"
 			});
 			this.requestUpdate();
 			await new Promise((t) => setTimeout(t, 1e3));
 			this._files = this._files.map((item) => id !== item.id ? item : {
 				...item,
-				state: FILE_UPLOADER_ITEM_STATE.EDIT
+				state: "edit"
 			});
 			this.requestUpdate();
 		}
@@ -168,9 +167,9 @@ __decorate([property({
 	reflect: true,
 	attribute: "input-state"
 })], CDSCEDemoFileUploader.prototype, "inputState", void 0);
-CDSCEDemoFileUploader = __decorate([carbonElement(`${prefix}-ce-demo-file-uploader`)], CDSCEDemoFileUploader);
+CDSCEDemoFileUploader = __decorate([carbonElement(`cds-custom-ce-demo-file-uploader`)], CDSCEDemoFileUploader);
 var demo_file_uploader_default = CDSCEDemoFileUploader;
 //#endregion
 export { demo_file_uploader_default as default };
 //# sourceMappingURL=demo-file-uploader.js.map

package/es-custom/components/file-uploader/demo-file-uploader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"demo-file-uploader.js","names":["customElement"],"sources":["../../../src/components/file-uploader/demo-file-uploader.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2019, 2024\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nimport { prefix } from '../../globals/settings';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport './index';\nimport { FILE_UPLOADER_ITEM_STATE } from './file-uploader-item';\nimport { BUTTON_SIZE } from '../button/button';\nimport { FileData } from './stories/types';\n\n/\n A class to manage file uploading states, like sending file contents to server.\n * DEMONSTRATION-PURPOSE ONLY.\n * Data/state handling in file uploading tends to involve lots of application-specific logics\n * and thus abstracting everything in a library won't be a good return on investment\n * vs. letting users copy code here and implement features that fit their needs.\n /\n@customElement(`${prefix}-ce-demo-file-uploader`)\nexport default class CDSCEDemoFileUploader extends LitElement {\n /\n The files being uploaded.\n /\n private _files: FileData[] = [];\n\n /\n Handles `cds-custom-drop-container-changed` on `<cds-custom-file-drop-container>`.\n \n @param event The event.\n /\n private _handleChange(event: CustomEvent) {\n const { addedFiles } = event.detail;\n const newFiles: FileData[] = addedFiles.map(\n (item) =>\n ({\n id: Math.random().toString(36).slice(2),\n file: item,\n state: FILE_UPLOADER_ITEM_STATE.UPLOADING,\n }) as FileData\n );\n const { multiple, _files: files, _simulateUpload: simulateUpload } = this;\n if (multiple) {\n this._files = files.concat(newFiles);\n this.requestUpdate();\n newFiles.forEach(simulateUpload, this);\n } else if (addedFiles.length > 0) {\n this._files = files.concat(newFiles[0]);\n this.requestUpdate();\n this._simulateUpload(newFiles[0]);\n }\n }\n\n /\n Handles `cds-custom-file-uploader-item-deleted` on `<cds-custom-file-uploader-item>`.\n \n @param event The event.\n /\n private _handleDelete(event: CustomEvent) {\n const { fileId: idToDelete } = (event.target as HTMLElement).dataset;\n this._files = this._files.filter(({ id }) => idToDelete !== id);\n this.requestUpdate();\n }\n\n /\n Simulates updating file.\n \n @param data The data of the file being uploaded.\n /\n private async _simulateUpload(data: FileData) {\n const { id, file } = data;\n if (file.size > 524288) {\n this._files = this._files.map((item) =>\n id !== item.id\n ? item\n : {\n ...item,\n state: FILE_UPLOADER_ITEM_STATE.EDIT,\n invalid: true,\n errorSubject: 'File size exceeds limit',\n errorBody:\n '500kb max file size. Select a new file and try again.',\n }\n );\n this.requestUpdate();\n } else {\n // Simulates network request time\n const rand = Math.random() 1000;\n await new Promise((t) => setTimeout(t, rand));\n this._files = this._files.map((item) =>\n id !== item.id\n ? item\n : {\n ...item,\n state: FILE_UPLOADER_ITEM_STATE.COMPLETE,\n }\n );\n this.requestUpdate();\n // Shows x icon after 1 second\n await new Promise((t) => setTimeout(t, 1000));\n this._files = this._files.map((item) =>\n id !== item.id\n ? item\n : {\n ...item,\n state: FILE_UPLOADER_ITEM_STATE.EDIT,\n }\n );\n this.requestUpdate();\n }\n }\n\n /*\n The file types the file input should accept, separated by space.\n /\n @property()\n accept = '';\n\n /\n `true` if the drop container should be disabled.\n /\n @property({ type: Boolean, reflect: true })\n button = false;\n\n /\n Button kind.\n /\n @property({ attribute: 'button-kind' })\n buttonKind = 'primary';\n\n /\n Button label.\n /\n @property({ attribute: 'button-label' })\n buttonLabel = 'Add file';\n\n /\n `true` if the drop container should be disabled.\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /\n Icon description.\n /\n @property({ attribute: 'icon-description' })\n iconDescription = '';\n\n /\n The input name.\n /\n @property({ attribute: 'input-name' })\n inputName = '';\n\n /\n The label description text.\n /\n @property({ attribute: 'label-description' })\n labelDescription = '';\n\n /\n The label title.\n /\n @property({ attribute: 'label-title' })\n labelTitle = '';\n\n /\n `true` if the drop container should accept more than one files at once.\n * Note that even with `false` set here, user _can_ select multiple files one by one.\n /\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /\n The size of the button item.\n /\n @property({ reflect: true })\n size = BUTTON_SIZE.MEDIUM;\n\n /\n The state of this file uploader item.\n */\n @property({ reflect: true, attribute: 'input-state' })\n inputState = '';\n\n render() {\n const {\n accept,\n button,\n buttonKind,\n buttonLabel,\n disabled,\n labelDescription,\n labelTitle,\n multiple,\n size,\n inputState,\n iconDescription,\n _files: files,\n _handleChange: handleChange,\n _handleDelete: handleDelete,\n } = this;\n return html`\n <cds-custom-file-uploader\n label-description=\"${ifDefined(labelDescription)}\"\n label-title=\"${ifDefined(labelTitle)}\"\n ?disabled=\"${disabled}\">\n ${!button\n ? html` <cds-custom-file-uploader-drop-container\n accept=\"${ifDefined(accept)}\"\n ?multiple=\"${multiple}\"\n name=\"${ifDefined(this.inputName)}\"\n @cds-custom-file-uploader-drop-container-changed=\"${handleChange}\">\n Drag and drop files here or click to upload\n </cds-custom-file-uploader-drop-container>`\n : html` <cds-custom-file-uploader-button\n size=\"${ifDefined(size)}\"\n button-kind=\"${buttonKind}\"\n accept=\"${ifDefined(accept)}\"\n name=\"${ifDefined(this.inputName)}\"\n ?multiple=\"${multiple}\"\n @cds-custom-file-uploader-button-changed=\"${handleChange}\">\n ${buttonLabel}\n </cds-custom-file-uploader-button>`}\n ${files.map(\n ({ id, invalid, file, state, errorSubject, errorBody }) => html`\n <cds-custom-file-uploader-item\n data-file-id=\"${id}\"\n ?invalid=\"${invalid}\"\n state=\"${inputState \|\| ifDefined(state)}\"\n icon-description=\"${ifDefined(iconDescription)}\"\n error-subject=\"${ifDefined(errorSubject)}\"\n error-body=\"${ifDefined(errorBody)}\"\n @cds-custom-file-uploader-item-deleted=\"${handleDelete}\">\n ${file.name}\n </cds-custom-file-uploader-item>\n `\n )}\n </cds-custom-file-uploader>\n `;\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"demo-file-uploader.js","names":["customElement"],"sources":["../../../src/components/file-uploader/demo-file-uploader.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2019, 2024\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nimport { prefix } from '../../globals/settings';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport './index';\nimport { FILE_UPLOADER_ITEM_STATE } from './file-uploader-item';\nimport { BUTTON_SIZE } from '../button/button';\nimport { FileData } from './stories/types';\n\n/\n A class to manage file uploading states, like sending file contents to server.\n * DEMONSTRATION-PURPOSE ONLY.\n * Data/state handling in file uploading tends to involve lots of application-specific logics\n * and thus abstracting everything in a library won't be a good return on investment\n * vs. letting users copy code here and implement features that fit their needs.\n /\n@customElement(`${prefix}-ce-demo-file-uploader`)\nexport default class CDSCEDemoFileUploader extends LitElement {\n /\n The files being uploaded.\n /\n private _files: FileData[] = [];\n\n /\n Handles `cds-custom-drop-container-changed` on `<cds-custom-file-drop-container>`.\n \n @param event The event.\n /\n private _handleChange(event: CustomEvent) {\n const { addedFiles } = event.detail;\n const newFiles: FileData[] = addedFiles.map(\n (item) =>\n ({\n id: Math.random().toString(36).slice(2),\n file: item,\n state: FILE_UPLOADER_ITEM_STATE.UPLOADING,\n }) as FileData\n );\n const { multiple, _files: files, _simulateUpload: simulateUpload } = this;\n if (multiple) {\n this._files = files.concat(newFiles);\n this.requestUpdate();\n newFiles.forEach(simulateUpload, this);\n } else if (addedFiles.length > 0) {\n this._files = files.concat(newFiles[0]);\n this.requestUpdate();\n this._simulateUpload(newFiles[0]);\n }\n }\n\n /\n Handles `cds-custom-file-uploader-item-deleted` on `<cds-custom-file-uploader-item>`.\n \n @param event The event.\n /\n private _handleDelete(event: CustomEvent) {\n const { fileId: idToDelete } = (event.target as HTMLElement).dataset;\n this._files = this._files.filter(({ id }) => idToDelete !== id);\n this.requestUpdate();\n }\n\n /\n Simulates updating file.\n \n @param data The data of the file being uploaded.\n /\n private async _simulateUpload(data: FileData) {\n const { id, file } = data;\n if (file.size > 524288) {\n this._files = this._files.map((item) =>\n id !== item.id\n ? item\n : {\n ...item,\n state: FILE_UPLOADER_ITEM_STATE.EDIT,\n invalid: true,\n errorSubject: 'File size exceeds limit',\n errorBody:\n '500kb max file size. Select a new file and try again.',\n }\n );\n this.requestUpdate();\n } else {\n // Simulates network request time\n const rand = Math.random() 1000;\n await new Promise((t) => setTimeout(t, rand));\n this._files = this._files.map((item) =>\n id !== item.id\n ? item\n : {\n ...item,\n state: FILE_UPLOADER_ITEM_STATE.COMPLETE,\n }\n );\n this.requestUpdate();\n // Shows x icon after 1 second\n await new Promise((t) => setTimeout(t, 1000));\n this._files = this._files.map((item) =>\n id !== item.id\n ? item\n : {\n ...item,\n state: FILE_UPLOADER_ITEM_STATE.EDIT,\n }\n );\n this.requestUpdate();\n }\n }\n\n /*\n The file types the file input should accept, separated by space.\n /\n @property()\n accept = '';\n\n /\n `true` if the drop container should be disabled.\n /\n @property({ type: Boolean, reflect: true })\n button = false;\n\n /\n Button kind.\n /\n @property({ attribute: 'button-kind' })\n buttonKind = 'primary';\n\n /\n Button label.\n /\n @property({ attribute: 'button-label' })\n buttonLabel = 'Add file';\n\n /\n `true` if the drop container should be disabled.\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /\n Icon description.\n /\n @property({ attribute: 'icon-description' })\n iconDescription = '';\n\n /\n The input name.\n /\n @property({ attribute: 'input-name' })\n inputName = '';\n\n /\n The label description text.\n /\n @property({ attribute: 'label-description' })\n labelDescription = '';\n\n /\n The label title.\n /\n @property({ attribute: 'label-title' })\n labelTitle = '';\n\n /\n `true` if the drop container should accept more than one files at once.\n * Note that even with `false` set here, user _can_ select multiple files one by one.\n /\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /\n The size of the button item.\n /\n @property({ reflect: true })\n size = BUTTON_SIZE.MEDIUM;\n\n /\n The state of this file uploader item.\n */\n @property({ reflect: true, attribute: 'input-state' })\n inputState = '';\n\n render() {\n const {\n accept,\n button,\n buttonKind,\n buttonLabel,\n disabled,\n labelDescription,\n labelTitle,\n multiple,\n size,\n inputState,\n iconDescription,\n _files: files,\n _handleChange: handleChange,\n _handleDelete: handleDelete,\n } = this;\n return html`\n <cds-custom-file-uploader\n label-description=\"${ifDefined(labelDescription)}\"\n label-title=\"${ifDefined(labelTitle)}\"\n ?disabled=\"${disabled}\">\n ${!button\n ? html` <cds-custom-file-uploader-drop-container\n accept=\"${ifDefined(accept)}\"\n ?multiple=\"${multiple}\"\n name=\"${ifDefined(this.inputName)}\"\n @cds-custom-file-uploader-drop-container-changed=\"${handleChange}\">\n Drag and drop files here or click to upload\n </cds-custom-file-uploader-drop-container>`\n : html` <cds-custom-file-uploader-button\n size=\"${ifDefined(size)}\"\n button-kind=\"${buttonKind}\"\n accept=\"${ifDefined(accept)}\"\n name=\"${ifDefined(this.inputName)}\"\n ?multiple=\"${multiple}\"\n @cds-custom-file-uploader-button-changed=\"${handleChange}\">\n ${buttonLabel}\n </cds-custom-file-uploader-button>`}\n ${files.map(\n ({ id, invalid, file, state, errorSubject, errorBody }) => html`\n <cds-custom-file-uploader-item\n data-file-id=\"${id}\"\n ?invalid=\"${invalid}\"\n state=\"${inputState \|\| ifDefined(state)}\"\n icon-description=\"${ifDefined(iconDescription)}\"\n error-subject=\"${ifDefined(errorSubject)}\"\n error-body=\"${ifDefined(errorBody)}\"\n @cds-custom-file-uploader-item-deleted=\"${handleDelete}\">\n ${file.name}\n </cds-custom-file-uploader-item>\n `\n )}\n </cds-custom-file-uploader>\n `;\n }\n}\n"],"mappings":"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"}

package/es-custom/components/file-uploader/file-uploader-button.js CHANGED Viewed

@@ -5,18 +5,17 @@
  * LICENSE file in the root directory of this source tree.
  */
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";
-import { BUTTON_KIND, BUTTON_SIZE } from "../button/defs.js";
+import "../button/defs.js";
 import { FORM_ELEMENT_COLOR_SCHEME } from "../../globals/shared-enums.js";
 import if_non_empty_default from "../../globals/directives/if-non-empty.js";
 import file_uploader_default from "./file-uploader.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
 //#region src/components/file-uploader/file-uploader-button.ts
 /**
 * Copyright IBM Corp. 2020, 2024
@@ -33,8 +32,8 @@ import { classMap } from "lit/directives/class-map.js";
 let CDSFileUploaderButton = class CDSFileUploaderButton extends HostListenerMixin(LitElement) {
 	constructor(..._args) {
 		super(..._args);
-		this.buttonKind = BUTTON_KIND.PRIMARY;
-		this.size = BUTTON_SIZE.MEDIUM;
+		this.buttonKind = "primary";
+		this.size = "md";
 		this.accept = "";
 		this.disabled = false;
 		this.multiple = false;
@@ -94,18 +93,18 @@ let CDSFileUploaderButton = class CDSFileUploaderButton extends HostListenerMixi
 	render() {
 		const { accept, disabled, multiple, name, buttonKind, size, _handleChange: handleChange } = this;
 		const labelClasses = classMap({
-			[`${prefix}--file-browse-btn`]: true,
-			[`${prefix}--file-browse-btn--disabled`]: disabled
+			[`cds-custom--file-browse-btn`]: true,
+			[`cds-custom--file-browse-btn--disabled`]: disabled
 		});
 		return html`
       <button
         type="button"
         class="${classMap({
-			[`${prefix}--btn`]: true,
-			[`${prefix}--btn--${buttonKind}`]: buttonKind,
-			[`${prefix}--layout--size-${size}`]: size,
-			[`${prefix}--btn--disabled`]: disabled,
-			[`${prefix}--btn--${size}`]: size
+			[`cds-custom--btn`]: true,
+			[`cds-custom--btn--${buttonKind}`]: buttonKind,
+			[`cds-custom--layout--size-${size}`]: size,
+			[`cds-custom--btn--disabled`]: disabled,
+			[`cds-custom--btn--${size}`]: size
 		})}"
         @click="${this._handleClick}"
         @keydown="${this._handleKeyDown}">
@@ -115,7 +114,7 @@ let CDSFileUploaderButton = class CDSFileUploaderButton extends HostListenerMixi
       <input
         id="file"
         type="file"
-        class="${prefix}--file-input"
+        class="${"cds-custom"}--file-input"
         tabindex="-1"
         accept="${if_non_empty_default(accept)}"
         ?disabled="${disabled}"
@@ -128,13 +127,13 @@ let CDSFileUploaderButton = class CDSFileUploaderButton extends HostListenerMixi
 	* The name of the custom event fired when there is a user gesture to select files to upload.
 	*/
 	static get eventChange() {
-		return `${prefix}-file-uploader-button-changed`;
+		return `cds-custom-file-uploader-button-changed`;
 	}
 	/**
 	* A selector that will return the file `input`.
 	*/
 	static get selectorInput() {
-		return `.${prefix}--file-input`;
+		return `.cds-custom--file-input`;
 	}
 	static {
 		this.styles = file_uploader_default;
@@ -156,9 +155,9 @@ __decorate([property({
 })], CDSFileUploaderButton.prototype, "multiple", void 0);
 __decorate([property({ reflect: true })], CDSFileUploaderButton.prototype, "name", void 0);
 __decorate([property({ reflect: true })], CDSFileUploaderButton.prototype, "slot", void 0);
-CDSFileUploaderButton = __decorate([carbonElement(`${prefix}-file-uploader-button`)], CDSFileUploaderButton);
+CDSFileUploaderButton = __decorate([carbonElement(`cds-custom-file-uploader-button`)], CDSFileUploaderButton);
 var file_uploader_button_default = CDSFileUploaderButton;
 //#endregion
 export { FORM_ELEMENT_COLOR_SCHEME as TILE_COLOR_SCHEME, file_uploader_button_default as default };
 //# sourceMappingURL=file-uploader-button.js.map

package/es-custom/components/file-uploader/file-uploader-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"file-uploader-button.js","names":["ifNonEmpty","styles","customElement"],"sources":["../../../src/components/file-uploader/file-uploader-button.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2020, 2024\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport styles from './file-uploader.scss?lit';\nimport { BUTTON_KIND, BUTTON_SIZE } from '../button/defs';\n\nexport { FORM_ELEMENT_COLOR_SCHEME as TILE_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/\n File uploader button .\n \n @element cds-custom-file-uploader-button\n * @fires cds-custom-file-uploader-button-changed The custom event fired when there is a user gesture to select files to upload.\n /\n@customElement(`${prefix}-file-uploader-button`)\nclass CDSFileUploaderButton extends HostListenerMixin(LitElement) {\n /\n Handles `click` event on the button.\n /\n private _handleClick(event) {\n event.target.value = null;\n const { selectorInput } = this.constructor as typeof CDSFileUploaderButton;\n this?.shadowRoot?.querySelector(selectorInput)?.setAttribute('value', '');\n (this?.shadowRoot?.querySelector(selectorInput) as HTMLElement).click();\n }\n\n /\n Handles `keydown` event on the button.\n /\n private _handleKeyDown(event) {\n const { selectorInput } = this.constructor as typeof CDSFileUploaderButton;\n if (event.key === 'Enter' \|\| event.key === 'Space') {\n this?.shadowRoot?.querySelector(selectorInput)?.setAttribute('value', '');\n (this?.shadowRoot?.querySelector(selectorInput) as HTMLElement).click();\n }\n }\n\n /\n Handles user gesture to select files to upload.\n \n @param event The event.\n /\n private _handleChange(event: Event \| DragEvent) {\n const addedFiles = this._getFiles(event);\n const { eventChange, selectorInput } = this\n .constructor as typeof CDSFileUploaderButton;\n this.dispatchEvent(\n new CustomEvent(eventChange, {\n bubbles: true,\n composed: true,\n detail: {\n addedFiles,\n },\n })\n );\n\n const fileInput = this?.shadowRoot?.querySelector(selectorInput);\n if (fileInput) {\n (fileInput as HTMLInputElement).value = '';\n }\n }\n\n /\n @param event The event.\n * @returns The list of files user chose to upload.\n /\n private _getFiles(event: Event \| DragEvent) {\n const { files } =\n (event.type === 'drop'\n ? (event as DragEvent).dataTransfer\n : (event.target as HTMLInputElement)) ?? {};\n const { accept } = this;\n if (!accept \|\| !/^(change\|drop)$/.test(event.type)) {\n return Array.from(files ?? []);\n }\n const acceptedTypes = new Set(accept.split(' '));\n return Array.prototype.filter.call(\n files,\n ({ name, type: mimeType = '' }) => {\n const fileExtensionRegExp = /\\.[^.]+$/;\n const hasFileExtension = fileExtensionRegExp.test(name);\n const [fileExtension] = !hasFileExtension\n ? [undefined]\n : (fileExtensionRegExp.exec(name) ?? []);\n\n return (\n acceptedTypes.has(mimeType) \|\|\n (fileExtension && acceptedTypes.has(fileExtension))\n );\n }\n ) as File[];\n }\n\n /\n Button kind.\n /\n @property({ reflect: true, attribute: 'button-kind' })\n buttonKind = BUTTON_KIND.PRIMARY;\n\n /\n Button size.\n /\n @property({ reflect: true })\n size = BUTTON_SIZE.MEDIUM;\n\n /\n The file types the file input should accept, separated by space.\n /\n @property()\n accept = '';\n\n /\n `true` if this drop container should be disabled.\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /\n `true` if this drop container should accept more than one files at once.\n * Note that even with `false` set here, user _can_ select multiple files one by one.\n /\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /\n The name of the input.\n /\n @property({ reflect: true })\n name = '';\n\n /\n The shadow DOM slot to put this drop container in.\n /\n @property({ reflect: true })\n slot = 'drop-container';\n\n render() {\n const {\n accept,\n disabled,\n multiple,\n name,\n buttonKind,\n size,\n _handleChange: handleChange,\n } = this;\n\n const labelClasses = classMap({\n [`${prefix}--file-browse-btn`]: true,\n [`${prefix}--file-browse-btn--disabled`]: disabled,\n });\n const buttonClasses = classMap({\n [`${prefix}--btn`]: true,\n [`${prefix}--btn--${buttonKind}`]: buttonKind,\n [`${prefix}--layout--size-${size}`]: size,\n [`${prefix}--btn--disabled`]: disabled,\n [`${prefix}--btn--${size}`]: size,\n });\n return html`\n <button\n type=\"button\"\n class=\"${buttonClasses}\"\n @click=\"${this._handleClick}\"\n @keydown=\"${this._handleKeyDown}\">\n <slot></slot>\n </button>\n <label class=\"${labelClasses}\" for=\"file\"> </label>\n <input\n id=\"file\"\n type=\"file\"\n class=\"${prefix}--file-input\"\n tabindex=\"-1\"\n accept=\"${ifNonEmpty(accept)}\"\n ?disabled=\"${disabled}\"\n ?multiple=\"${multiple}\"\n name=\"${ifNonEmpty(name)}\"\n @change=\"${handleChange}\" />\n `;\n }\n\n /\n The name of the custom event fired when there is a user gesture to select files to upload.\n /\n static get eventChange() {\n return `${prefix}-file-uploader-button-changed`;\n }\n\n /\n A selector that will return the file `input`.\n */\n static get selectorInput() {\n return `.${prefix}--file-input`;\n }\n\n static styles = styles;\n}\n\nexport default CDSFileUploaderButton;\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAyBA,~~kCACM~~,8BAA8B,kBAAkB,WAAW,CAAC~~;;;oBAkFnD,YAAY~~;~~cAMlB,YAAY;gBAMV;~~kBAME;kBAOA;cAMJ;cAMA;;;;;CAnHP,~~AAAQ~~,~~aAAa,~~OAAO;AAC1B,QAAM,OAAO,QAAQ;EACrB,MAAM,EAAE,kBAAkB,KAAK;AAC/B,QAAM,YAAY,cAAc,cAAc,EAAE,aAAa,SAAS,GAAG;AACzE,GAAC,MAAM,YAAY,cAAc,cAAc,EAAiB,OAAO;;;;;CAMzE,~~AAAQ~~,~~eAAe,~~OAAO;EAC5B,MAAM,EAAE,kBAAkB,KAAK;AAC/B,MAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,SAAS;AAClD,SAAM,YAAY,cAAc,cAAc,EAAE,aAAa,SAAS,GAAG;AACzE,IAAC,MAAM,YAAY,cAAc,cAAc,EAAiB,OAAO;;;;;;;;CAS3E,~~AAAQ~~,~~cAAc,~~OAA0B;EAC9C,MAAM,aAAa,KAAK,UAAU,MAAM;EACxC,MAAM,EAAE,aAAa,kBAAkB,KACpC;AACH,OAAK,cACH,IAAI,YAAY,aAAa;GAC3B,SAAS;GACT,UAAU;GACV,QAAQ,EACN,YACD;GACF,CAAC,CACH;EAED,MAAM,YAAY,MAAM,YAAY,cAAc,cAAc;AAChE,MAAI,~~UACF~~,~~CAAC,UAA~~+B,QAAQ;;;;;;CAQ5C,~~AAAQ~~,~~UAAU,~~OAA0B;EAC1C,MAAM,EAAE,WACL,MAAM,SAAS,SACX,MAAoB,eACpB,MAAM,WAAgC,EAAE;EAC/C,MAAM,EAAE,WAAW;AACnB,MAAI,CAAC,UAAU,CAAC,kBAAkB,KAAK,MAAM,KAAK,CAChD,QAAO,MAAM,KAAK,SAAS,EAAE,CAAC;EAEhC,MAAM,gBAAgB,IAAI,IAAI,OAAO,MAAM,IAAI,CAAC;AAChD,SAAO,MAAM,UAAU,OAAO,KAC5B,QACC,EAAE,MAAM,MAAM,WAAW,SAAS;GACjC,MAAM,sBAAsB;GAE5B,MAAM,CAAC,iBAAiB,CADC,oBAAoB,KAAK,KAAK,GAEnD,CAAC,~~OAAU~~,GACV,oBAAoB,KAAK,KAAK,IAAI,EAAE;AAEzC,UACE,cAAc,IAAI,SAAS,IAC1B,iBAAiB,cAAc,IAAI,cAAc;IAGvD;;CA8CH,SAAS;EACP,MAAM,EACJ,QACA,UACA,UACA,MACA,YACA,MACA,eAAe,iBACb;EAEJ,MAAM,eAAe,SAAS;IAC3B,~~GAAG,OAAO,qBAAqB~~;IAC/B,~~GAAG,OAAO,+BAA+B~~;GAC3C,CAAC;AAQF,SAAO,IAAI;;;iBAPW,SAAS;IAC5B,~~GAAG,OAAO,SAAS~~;IACnB,~~GAAG~~,~~OAAO,SAAS,~~eAAe;IAClC,~~GAAG~~,~~OAAO,iBAAiB,~~SAAS;IACpC,~~GAAG,OAAO,mBAAmB~~;IAC7B,~~GAAG~~,~~OAAO,~~SAAS~~,SAAS~~;GAC9B,CAAC,CAIyB;kBACb,KAAK,aAAa;oBAChB,KAAK,eAAe;;;sBAGlB,aAAa;;;;~~iBAIlB,OAAO~~;;kBAENA,qBAAW,OAAO,CAAC;qBAChB,SAAS;qBACT,SAAS;gBACdA,qBAAW,KAAK,CAAC;mBACd,aAAa;;;;;;CAO9B,WAAW,cAAc;AACvB,SAAO~~,GAAG,OAAO~~;;;;;~~CAMnB~~,WAAW,gBAAgB;AACzB,SAAO~~,IAAI,OAAO~~;;;~~gBAGJC~~;;;YAlGf,SAAS;CAAE,SAAS;CAAM,WAAW;CAAe,CAAC;YAMrD,SAAS,EAAE,SAAS,MAAM,CAAC;YAM3B,UAAU;YAMV,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;YAO1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;YAM1C,SAAS,EAAE,SAAS,MAAM,CAAC;YAM3B,SAAS,EAAE,SAAS,MAAM,CAAC;oCAvH7BC,cAAc,~~GAAG~~,~~OAAO~~,~~uBAAuB~~;AAuLhD,~~mCAAe~~"}
1	+ {"version":3,"file":"file-uploader-button.js","names":["ifNonEmpty","styles","customElement"],"sources":["../../../src/components/file-uploader/file-uploader-button.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2020, 2024\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport styles from './file-uploader.scss?lit';\nimport { BUTTON_KIND, BUTTON_SIZE } from '../button/defs';\n\nexport { FORM_ELEMENT_COLOR_SCHEME as TILE_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/\n File uploader button .\n \n @element cds-custom-file-uploader-button\n * @fires cds-custom-file-uploader-button-changed The custom event fired when there is a user gesture to select files to upload.\n /\n@customElement(`${prefix}-file-uploader-button`)\nclass CDSFileUploaderButton extends HostListenerMixin(LitElement) {\n /\n Handles `click` event on the button.\n /\n private _handleClick(event) {\n event.target.value = null;\n const { selectorInput } = this.constructor as typeof CDSFileUploaderButton;\n this?.shadowRoot?.querySelector(selectorInput)?.setAttribute('value', '');\n (this?.shadowRoot?.querySelector(selectorInput) as HTMLElement).click();\n }\n\n /\n Handles `keydown` event on the button.\n /\n private _handleKeyDown(event) {\n const { selectorInput } = this.constructor as typeof CDSFileUploaderButton;\n if (event.key === 'Enter' \|\| event.key === 'Space') {\n this?.shadowRoot?.querySelector(selectorInput)?.setAttribute('value', '');\n (this?.shadowRoot?.querySelector(selectorInput) as HTMLElement).click();\n }\n }\n\n /\n Handles user gesture to select files to upload.\n \n @param event The event.\n /\n private _handleChange(event: Event \| DragEvent) {\n const addedFiles = this._getFiles(event);\n const { eventChange, selectorInput } = this\n .constructor as typeof CDSFileUploaderButton;\n this.dispatchEvent(\n new CustomEvent(eventChange, {\n bubbles: true,\n composed: true,\n detail: {\n addedFiles,\n },\n })\n );\n\n const fileInput = this?.shadowRoot?.querySelector(selectorInput);\n if (fileInput) {\n (fileInput as HTMLInputElement).value = '';\n }\n }\n\n /\n @param event The event.\n * @returns The list of files user chose to upload.\n /\n private _getFiles(event: Event \| DragEvent) {\n const { files } =\n (event.type === 'drop'\n ? (event as DragEvent).dataTransfer\n : (event.target as HTMLInputElement)) ?? {};\n const { accept } = this;\n if (!accept \|\| !/^(change\|drop)$/.test(event.type)) {\n return Array.from(files ?? []);\n }\n const acceptedTypes = new Set(accept.split(' '));\n return Array.prototype.filter.call(\n files,\n ({ name, type: mimeType = '' }) => {\n const fileExtensionRegExp = /\\.[^.]+$/;\n const hasFileExtension = fileExtensionRegExp.test(name);\n const [fileExtension] = !hasFileExtension\n ? [undefined]\n : (fileExtensionRegExp.exec(name) ?? []);\n\n return (\n acceptedTypes.has(mimeType) \|\|\n (fileExtension && acceptedTypes.has(fileExtension))\n );\n }\n ) as File[];\n }\n\n /\n Button kind.\n /\n @property({ reflect: true, attribute: 'button-kind' })\n buttonKind = BUTTON_KIND.PRIMARY;\n\n /\n Button size.\n /\n @property({ reflect: true })\n size = BUTTON_SIZE.MEDIUM;\n\n /\n The file types the file input should accept, separated by space.\n /\n @property()\n accept = '';\n\n /\n `true` if this drop container should be disabled.\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /\n `true` if this drop container should accept more than one files at once.\n * Note that even with `false` set here, user _can_ select multiple files one by one.\n /\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /\n The name of the input.\n /\n @property({ reflect: true })\n name = '';\n\n /\n The shadow DOM slot to put this drop container in.\n /\n @property({ reflect: true })\n slot = 'drop-container';\n\n render() {\n const {\n accept,\n disabled,\n multiple,\n name,\n buttonKind,\n size,\n _handleChange: handleChange,\n } = this;\n\n const labelClasses = classMap({\n [`${prefix}--file-browse-btn`]: true,\n [`${prefix}--file-browse-btn--disabled`]: disabled,\n });\n const buttonClasses = classMap({\n [`${prefix}--btn`]: true,\n [`${prefix}--btn--${buttonKind}`]: buttonKind,\n [`${prefix}--layout--size-${size}`]: size,\n [`${prefix}--btn--disabled`]: disabled,\n [`${prefix}--btn--${size}`]: size,\n });\n return html`\n <button\n type=\"button\"\n class=\"${buttonClasses}\"\n @click=\"${this._handleClick}\"\n @keydown=\"${this._handleKeyDown}\">\n <slot></slot>\n </button>\n <label class=\"${labelClasses}\" for=\"file\"> </label>\n <input\n id=\"file\"\n type=\"file\"\n class=\"${prefix}--file-input\"\n tabindex=\"-1\"\n accept=\"${ifNonEmpty(accept)}\"\n ?disabled=\"${disabled}\"\n ?multiple=\"${multiple}\"\n name=\"${ifNonEmpty(name)}\"\n @change=\"${handleChange}\" />\n `;\n }\n\n /\n The name of the custom event fired when there is a user gesture to select files to upload.\n /\n static get eventChange() {\n return `${prefix}-file-uploader-button-changed`;\n }\n\n /\n A selector that will return the file `input`.\n */\n static get selectorInput() {\n return `.${prefix}--file-input`;\n }\n\n static styles = styles;\n}\n\nexport default CDSFileUploaderButton;\n"],"mappings":"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"}

package/es-custom/components/file-uploader/file-uploader-drop-container.js CHANGED Viewed

@@ -5,9 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  */
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import HostListener from "../../globals/decorators/host-listener.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";
 import { FORM_ELEMENT_COLOR_SCHEME } from "../../globals/shared-enums.js";
@@ -16,7 +16,6 @@ import file_uploader_default from "./file-uploader.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
 //#region src/components/file-uploader/file-uploader-drop-container.ts
 /**
 * Copyright IBM Corp. 2020, 2024
@@ -97,19 +96,19 @@ let CDSFileUploaderDropContainer = class CDSFileUploaderDropContainer extends Ho
 		const { accept, disabled, multiple, name, _active: active, _handleChange: handleChange } = this;
 		return html`
       <label class="${classMap({
-			[`${prefix}--file-browse-btn`]: true,
-			[`${prefix}--file-browse-btn--disabled`]: disabled
+			[`cds-custom--file-browse-btn`]: true,
+			[`cds-custom--file-browse-btn--disabled`]: disabled
 		})}" for="file" tabindex="0">
         <div class="${classMap({
-			[`${prefix}--file__drop-container`]: true,
-			[`${prefix}--file__drop-container--drag-over`]: active
+			[`cds-custom--file__drop-container`]: true,
+			[`cds-custom--file__drop-container--drag-over`]: active
 		})}" role="button">
           <slot></slot>
           <input
             id="file"
             type="file"
             name="${if_non_empty_default(name)}"
-            class="${prefix}--file-input"
+            class="${"cds-custom"}--file-input"
             tabindex="-1"
             accept="${if_non_empty_default(accept)}"
             ?disabled="${disabled}"
@@ -123,13 +122,13 @@ let CDSFileUploaderDropContainer = class CDSFileUploaderDropContainer extends Ho
 	* The name of the custom event fired when there is a user gesture to select files to upload.
 	*/
 	static get eventChange() {
-		return `${prefix}-file-uploader-drop-container-changed`;
+		return `cds-custom-file-uploader-drop-container-changed`;
 	}
 	/**
 	* A selector that will return the file `input`.
 	*/
 	static get selectorInput() {
-		return `.${prefix}--file-input`;
+		return `.cds-custom--file-input`;
 	}
 	static {
 		this.styles = file_uploader_default;
@@ -151,9 +150,9 @@ __decorate([property({
 })], CDSFileUploaderDropContainer.prototype, "multiple", void 0);
 __decorate([property({ reflect: true })], CDSFileUploaderDropContainer.prototype, "name", void 0);
 __decorate([property({ reflect: true })], CDSFileUploaderDropContainer.prototype, "slot", void 0);
-CDSFileUploaderDropContainer = __decorate([carbonElement(`${prefix}-file-uploader-drop-container`)], CDSFileUploaderDropContainer);
+CDSFileUploaderDropContainer = __decorate([carbonElement(`cds-custom-file-uploader-drop-container`)], CDSFileUploaderDropContainer);
 var file_uploader_drop_container_default = CDSFileUploaderDropContainer;
 //#endregion
 export { FORM_ELEMENT_COLOR_SCHEME as TILE_COLOR_SCHEME, file_uploader_drop_container_default as default };
 //# sourceMappingURL=file-uploader-drop-container.js.map

package/es-custom/components/file-uploader/file-uploader-drop-container.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"file-uploader-drop-container.js","names":["ifNonEmpty","styles","customElement"],"sources":["../../../src/components/file-uploader/file-uploader-drop-container.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2020, 2024\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport styles from './file-uploader.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { FORM_ELEMENT_COLOR_SCHEME as TILE_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/\n The value to set to `event.dataTransfer.dropEffect`, keyed by the event nane.\n /\nconst dropEffects = {\n dragover: 'copy',\n dragleave: 'move',\n};\n\n/\n File uploader drop container.\n \n @element cds-custom-file-uploader-drop-container\n * @fires cds-custom-file-uploader-drop-container-changed The custom event fired when there is a user gesture to select files to upload.\n /\n@customElement(`${prefix}-file-uploader-drop-container`)\nclass CDSFileUploaderDropContainer extends HostListenerMixin(LitElement) {\n /\n `true` to show the active state of this UI.\n /\n private _active = false;\n\n /\n Handles user gesture to select files to upload.\n \n @param event The event.\n /\n private _handleChange(event: Event \| DragEvent) {\n const { eventChange, selectorInput } = this\n .constructor as typeof CDSFileUploaderDropContainer;\n const { files } =\n (event.type === 'drop'\n ? (event as DragEvent).dataTransfer\n : (event.target as HTMLInputElement)) ?? {};\n const addedFiles = this._getFiles(event, files);\n\n this.dispatchEvent(\n new CustomEvent(eventChange, {\n bubbles: true,\n composed: true,\n detail: {\n addedFiles,\n },\n })\n );\n\n const fileInput = this?.shadowRoot?.querySelector(selectorInput);\n if (fileInput) {\n (fileInput as HTMLInputElement).value = ''; // carbon-web-components#904\n }\n }\n\n /\n Handles `dragover`, `dragleave` and `drop` events.\n \n @param event The event.\n /\n @HostListener('dragover')\n @HostListener('dragleave')\n @HostListener('drop')\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n private _handleDrag(event: DragEvent) {\n event.preventDefault(); // Prevents page navigation upon dropping\n if (this.disabled) {\n return;\n }\n const { dataTransfer, type } = event;\n const dropEffect = dropEffects[type];\n if (dataTransfer && dropEffect) {\n dataTransfer.dropEffect = dropEffect;\n }\n this._active = type === 'dragover';\n if (type === 'drop') {\n this._handleChange(event);\n }\n this.requestUpdate();\n }\n\n /\n @param event The event.\n * @returns The list of files user chose to upload.\n /\n private _getFiles(event, files) {\n const { accept } = this;\n if (!accept \|\| !/^(change\|drop)$/.test(event.type)) {\n return Array.from(files ?? []);\n }\n const acceptedTypes = new Set(accept.split(' '));\n return Array.prototype.filter.call(\n files,\n ({ name, type: mimeType = '' }) => {\n const fileExtensionRegExp = /\\.[^.]+$/;\n const hasFileExtension = fileExtensionRegExp.test(name);\n const [fileExtension] = !hasFileExtension\n ? [undefined]\n : (fileExtensionRegExp.exec(name) ?? []);\n\n return (\n acceptedTypes.has(mimeType) \|\|\n (fileExtension && acceptedTypes.has(fileExtension))\n );\n }\n ) as File[];\n }\n\n /\n The file types the file input should accept, separated by space.\n /\n @property()\n accept = '';\n\n /\n `true` if this drop container should be disabled.\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /\n `true` if this drop container should accept more than one files at once.\n * Note that even with `false` set here, user _can_ select multiple files one by one.\n /\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /\n The name of the input.\n /\n @property({ reflect: true })\n name = '';\n\n /\n The shadow DOM slot to put this drop container in.\n /\n @property({ reflect: true })\n slot = 'drop-container';\n\n render() {\n const {\n accept,\n disabled,\n multiple,\n name,\n _active: active,\n _handleChange: handleChange,\n } = this;\n const labelClasses = classMap({\n [`${prefix}--file-browse-btn`]: true,\n [`${prefix}--file-browse-btn--disabled`]: disabled,\n });\n const dropareaClasses = classMap({\n [`${prefix}--file__drop-container`]: true,\n [`${prefix}--file__drop-container--drag-over`]: active,\n });\n return html`\n <label class=\"${labelClasses}\" for=\"file\" tabindex=\"0\">\n <div class=\"${dropareaClasses}\" role=\"button\">\n <slot></slot>\n <input\n id=\"file\"\n type=\"file\"\n name=\"${ifNonEmpty(name)}\"\n class=\"${prefix}--file-input\"\n tabindex=\"-1\"\n accept=\"${ifNonEmpty(accept)}\"\n ?disabled=\"${disabled}\"\n ?multiple=\"${multiple}\"\n @change=\"${handleChange}\" />\n </div>\n </label>\n `;\n }\n\n /\n The name of the custom event fired when there is a user gesture to select files to upload.\n /\n static get eventChange() {\n return `${prefix}-file-uploader-drop-container-changed`;\n }\n\n /\n A selector that will return the file `input`.\n */\n static get selectorInput() {\n return `.${prefix}--file-input`;\n }\n\n static styles = styles;\n}\n\nexport default CDSFileUploaderDropContainer;\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAsBA,MAAM,cAAc;CAClB,UAAU;CACV,WAAW;CACZ;;;;;;;AAQD,~~yCACM~~,qCAAqC,kBAAkB,WAAW,CAAC;;;iBAIrD;gBA0FT;kBAME;kBAOA;cAMJ;cAMA;;;;;;;CA5GP,~~AAAQ~~,~~cAAc,~~OAA0B;EAC9C,MAAM,EAAE,aAAa,kBAAkB,KACpC;EACH,MAAM,EAAE,WACL,MAAM,SAAS,SACX,MAAoB,eACpB,MAAM,WAAgC,EAAE;EAC/C,MAAM,aAAa,KAAK,UAAU,OAAO,MAAM;AAE/C,OAAK,cACH,IAAI,YAAY,aAAa;GAC3B,SAAS;GACT,UAAU;GACV,QAAQ,EACN,YACD;GACF,CAAC,CACH;EAED,MAAM,YAAY,MAAM,YAAY,cAAc,cAAc;AAChE,MAAI,~~UACF~~,~~CAAC,UAA~~+B,QAAQ;;;;;;;CAS5C,~~AAKQ~~,~~YAAY,~~OAAkB;AACpC,QAAM,gBAAgB;AACtB,MAAI,KAAK,SACP;EAEF,MAAM,EAAE,cAAc,SAAS;EAC/B,MAAM,aAAa,YAAY;AAC/B,MAAI,gBAAgB,WAClB,cAAa,aAAa;AAE5B,OAAK,UAAU,SAAS;AACxB,MAAI,SAAS,OACX,MAAK,cAAc,MAAM;AAE3B,OAAK,eAAe;;;;;;CAOtB,~~AAAQ~~,~~UAAU,~~OAAO,OAAO;EAC9B,MAAM,EAAE,WAAW;AACnB,MAAI,CAAC,UAAU,CAAC,kBAAkB,KAAK,MAAM,KAAK,CAChD,QAAO,MAAM,KAAK,SAAS,EAAE,CAAC;EAEhC,MAAM,gBAAgB,IAAI,IAAI,OAAO,MAAM,IAAI,CAAC;AAChD,SAAO,MAAM,UAAU,OAAO,KAC5B,QACC,EAAE,MAAM,MAAM,WAAW,SAAS;GACjC,MAAM,sBAAsB;GAE5B,MAAM,CAAC,iBAAiB,CADC,oBAAoB,KAAK,KAAK,GAEnD,CAAC,~~OAAU~~,GACV,oBAAoB,KAAK,KAAK,IAAI,EAAE;AAEzC,UACE,cAAc,IAAI,SAAS,IAC1B,iBAAiB,cAAc,IAAI,cAAc;IAGvD;;CAkCH,SAAS;EACP,MAAM,EACJ,QACA,UACA,UACA,MACA,SAAS,QACT,eAAe,iBACb;AASJ,SAAO,IAAI;sBARU,SAAS;IAC3B,~~GAAG,OAAO,qBAAqB~~;IAC/B,~~GAAG,OAAO,+BAA+B~~;GAC3C,CAAC,CAM6B;sBALP,SAAS;IAC9B,~~GAAG,OAAO,0BAA0B~~;IACpC,~~GAAG,OAAO,qCAAqC~~;GACjD,CAAC,CAGgC;;;;;oBAKlBA,qBAAW,KAAK,CAAC;~~qBAChB,OAAO~~;;sBAENA,qBAAW,OAAO,CAAC;yBAChB,SAAS;yBACT,SAAS;uBACX,aAAa;;;;;;;;CASlC,WAAW,cAAc;AACvB,SAAO~~,GAAG,OAAO~~;;;;;~~CAMnB~~,WAAW,gBAAgB;AACzB,SAAO~~,IAAI,OAAO~~;;;~~gBAGJC~~;;;;CAlIf,aAAa,WAAW;CACxB,aAAa,YAAY;CACzB,aAAa,OAAO;;YAkDpB,UAAU;YAMV,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;YAO1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;YAM1C,SAAS,EAAE,SAAS,MAAM,CAAC;YAM3B,SAAS,EAAE,SAAS,MAAM,CAAC;2CAvH7BC,cAAc,~~GAAG~~,~~OAAO,+BAA+B~~;AA+KxD,~~2CAAe~~"}
1	+ {"version":3,"file":"file-uploader-drop-container.js","names":["ifNonEmpty","styles","customElement"],"sources":["../../../src/components/file-uploader/file-uploader-drop-container.ts"],"sourcesContent":["/*\n Copyright IBM Corp. 2020, 2024\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport styles from './file-uploader.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { FORM_ELEMENT_COLOR_SCHEME as TILE_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/\n The value to set to `event.dataTransfer.dropEffect`, keyed by the event nane.\n /\nconst dropEffects = {\n dragover: 'copy',\n dragleave: 'move',\n};\n\n/\n File uploader drop container.\n \n @element cds-custom-file-uploader-drop-container\n * @fires cds-custom-file-uploader-drop-container-changed The custom event fired when there is a user gesture to select files to upload.\n /\n@customElement(`${prefix}-file-uploader-drop-container`)\nclass CDSFileUploaderDropContainer extends HostListenerMixin(LitElement) {\n /\n `true` to show the active state of this UI.\n /\n private _active = false;\n\n /\n Handles user gesture to select files to upload.\n \n @param event The event.\n /\n private _handleChange(event: Event \| DragEvent) {\n const { eventChange, selectorInput } = this\n .constructor as typeof CDSFileUploaderDropContainer;\n const { files } =\n (event.type === 'drop'\n ? (event as DragEvent).dataTransfer\n : (event.target as HTMLInputElement)) ?? {};\n const addedFiles = this._getFiles(event, files);\n\n this.dispatchEvent(\n new CustomEvent(eventChange, {\n bubbles: true,\n composed: true,\n detail: {\n addedFiles,\n },\n })\n );\n\n const fileInput = this?.shadowRoot?.querySelector(selectorInput);\n if (fileInput) {\n (fileInput as HTMLInputElement).value = ''; // carbon-web-components#904\n }\n }\n\n /\n Handles `dragover`, `dragleave` and `drop` events.\n \n @param event The event.\n /\n @HostListener('dragover')\n @HostListener('dragleave')\n @HostListener('drop')\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n private _handleDrag(event: DragEvent) {\n event.preventDefault(); // Prevents page navigation upon dropping\n if (this.disabled) {\n return;\n }\n const { dataTransfer, type } = event;\n const dropEffect = dropEffects[type];\n if (dataTransfer && dropEffect) {\n dataTransfer.dropEffect = dropEffect;\n }\n this._active = type === 'dragover';\n if (type === 'drop') {\n this._handleChange(event);\n }\n this.requestUpdate();\n }\n\n /\n @param event The event.\n * @returns The list of files user chose to upload.\n /\n private _getFiles(event, files) {\n const { accept } = this;\n if (!accept \|\| !/^(change\|drop)$/.test(event.type)) {\n return Array.from(files ?? []);\n }\n const acceptedTypes = new Set(accept.split(' '));\n return Array.prototype.filter.call(\n files,\n ({ name, type: mimeType = '' }) => {\n const fileExtensionRegExp = /\\.[^.]+$/;\n const hasFileExtension = fileExtensionRegExp.test(name);\n const [fileExtension] = !hasFileExtension\n ? [undefined]\n : (fileExtensionRegExp.exec(name) ?? []);\n\n return (\n acceptedTypes.has(mimeType) \|\|\n (fileExtension && acceptedTypes.has(fileExtension))\n );\n }\n ) as File[];\n }\n\n /\n The file types the file input should accept, separated by space.\n /\n @property()\n accept = '';\n\n /\n `true` if this drop container should be disabled.\n /\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /\n `true` if this drop container should accept more than one files at once.\n * Note that even with `false` set here, user _can_ select multiple files one by one.\n /\n @property({ type: Boolean, reflect: true })\n multiple = false;\n\n /\n The name of the input.\n /\n @property({ reflect: true })\n name = '';\n\n /\n The shadow DOM slot to put this drop container in.\n /\n @property({ reflect: true })\n slot = 'drop-container';\n\n render() {\n const {\n accept,\n disabled,\n multiple,\n name,\n _active: active,\n _handleChange: handleChange,\n } = this;\n const labelClasses = classMap({\n [`${prefix}--file-browse-btn`]: true,\n [`${prefix}--file-browse-btn--disabled`]: disabled,\n });\n const dropareaClasses = classMap({\n [`${prefix}--file__drop-container`]: true,\n [`${prefix}--file__drop-container--drag-over`]: active,\n });\n return html`\n <label class=\"${labelClasses}\" for=\"file\" tabindex=\"0\">\n <div class=\"${dropareaClasses}\" role=\"button\">\n <slot></slot>\n <input\n id=\"file\"\n type=\"file\"\n name=\"${ifNonEmpty(name)}\"\n class=\"${prefix}--file-input\"\n tabindex=\"-1\"\n accept=\"${ifNonEmpty(accept)}\"\n ?disabled=\"${disabled}\"\n ?multiple=\"${multiple}\"\n @change=\"${handleChange}\" />\n </div>\n </label>\n `;\n }\n\n /\n The name of the custom event fired when there is a user gesture to select files to upload.\n /\n static get eventChange() {\n return `${prefix}-file-uploader-drop-container-changed`;\n }\n\n /\n A selector that will return the file `input`.\n */\n static get selectorInput() {\n return `.${prefix}--file-input`;\n }\n\n static styles = styles;\n}\n\nexport default CDSFileUploaderDropContainer;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAM,cAAc;CAClB,UAAU;CACV,WAAW;CACZ;;;;;;;AAQD,IAAA,+BAAA,MACM,qCAAqC,kBAAkB,WAAW,CAAC;;;iBAIrD;gBA0FT;kBAME;kBAOA;cAMJ;cAMA;;;;;;;CA5GP,cAAsB,OAA0B;EAC9C,MAAM,EAAE,aAAa,kBAAkB,KACpC;EACH,MAAM,EAAE,WACL,MAAM,SAAS,SACX,MAAoB,eACpB,MAAM,WAAgC,EAAE;EAC/C,MAAM,aAAa,KAAK,UAAU,OAAO,MAAM;AAE/C,OAAK,cACH,IAAI,YAAY,aAAa;GAC3B,SAAS;GACT,UAAU;GACV,QAAQ,EACN,YACD;GACF,CAAC,CACH;EAED,MAAM,YAAY,MAAM,YAAY,cAAc,cAAc;AAChE,MAAI,UACD,WAA+B,QAAQ;;;;;;;CAS5C,YAKoB,OAAkB;AACpC,QAAM,gBAAgB;AACtB,MAAI,KAAK,SACP;EAEF,MAAM,EAAE,cAAc,SAAS;EAC/B,MAAM,aAAa,YAAY;AAC/B,MAAI,gBAAgB,WAClB,cAAa,aAAa;AAE5B,OAAK,UAAU,SAAS;AACxB,MAAI,SAAS,OACX,MAAK,cAAc,MAAM;AAE3B,OAAK,eAAe;;;;;;CAOtB,UAAkB,OAAO,OAAO;EAC9B,MAAM,EAAE,WAAW;AACnB,MAAI,CAAC,UAAU,CAAC,kBAAkB,KAAK,MAAM,KAAK,CAChD,QAAO,MAAM,KAAK,SAAS,EAAE,CAAC;EAEhC,MAAM,gBAAgB,IAAI,IAAI,OAAO,MAAM,IAAI,CAAC;AAChD,SAAO,MAAM,UAAU,OAAO,KAC5B,QACC,EAAE,MAAM,MAAM,WAAW,SAAS;GACjC,MAAM,sBAAsB;GAE5B,MAAM,CAAC,iBAAiB,CADC,oBAAoB,KAAK,KAAK,GAEnD,CAAC,KAAA,EAAU,GACV,oBAAoB,KAAK,KAAK,IAAI,EAAE;AAEzC,UACE,cAAc,IAAI,SAAS,IAC1B,iBAAiB,cAAc,IAAI,cAAc;IAGvD;;CAkCH,SAAS;EACP,MAAM,EACJ,QACA,UACA,UACA,MACA,SAAS,QACT,eAAe,iBACb;AASJ,SAAO,IAAI;sBARU,SAAS;IAC3B,yBAA+B;IAC/B,mCAAyC;GAC3C,CAAC,CAM6B;sBALP,SAAS;IAC9B,8BAAoC;IACpC,yCAA+C;GACjD,CAAC,CAGgC;;;;;oBAKlBA,qBAAW,KAAK,CAAC;2BACT;;sBAENA,qBAAW,OAAO,CAAC;yBAChB,SAAS;yBACT,SAAS;uBACX,aAAa;;;;;;;;CASlC,WAAW,cAAc;AACvB,SAAO;;;;;CAMT,WAAW,gBAAgB;AACzB,SAAO;;;gBAGOC;;;;CAlIf,aAAa,WAAW;CACxB,aAAa,YAAY;CACzB,aAAa,OAAO;;YAkDpB,UAAU,CAAA,EAAA,6BAAA,WAAA,UAAA,KAAA,EAAA;YAMV,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,6BAAA,WAAA,YAAA,KAAA,EAAA;YAO1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,6BAAA,WAAA,YAAA,KAAA,EAAA;YAM1C,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,6BAAA,WAAA,QAAA,KAAA,EAAA;YAM3B,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,6BAAA,WAAA,QAAA,KAAA,EAAA;2CAvH7BC,cAAc,mCAAyC,CAAA,EAAA,6BAAA;AA+KxD,IAAA,uCAAe"}