@x15ventures/x15-ui-library 3.16.1 → 3.18.0

package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitch.css

@@ -0,0 +1,306 @@
+/* Popovers */
+.checkboxSwitchField {
+  --checkboxSwitchHeight: 30px;
+  --checkboxSwitchFontSize: 15px;
+  --checkboxSwitchIconSize: 15px;
+  --checkboxSwitchPaddingInline: 10px;
+  --checkboxSwitchThumbGap: var(--checkboxSwitchThumbGapM, 3px);
+  --checkboxSwitchRadius: calc(var(--checkboxSwitchHeight) / 2);
+}
+.checkboxSwitchField.checkboxSwitch_xs {
+  --checkboxSwitchHeight: 20px;
+  --checkboxSwitchFontSize: 11px;
+  --checkboxSwitchIconSize: 11px;
+  --checkboxSwitchPaddingInline: 5px;
+  --checkboxSwitchThumbGap: var(--checkboxSwitchThumbGapXs, 1px);
+}
+.checkboxSwitchField.checkboxSwitch_s {
+  --checkboxSwitchHeight: 25px;
+  --checkboxSwitchFontSize: 13px;
+  --checkboxSwitchIconSize: 13px;
+  --checkboxSwitchPaddingInline: 5px;
+  --checkboxSwitchThumbGap: var(--checkboxSwitchThumbGapS, 2px);
+}
+.checkboxSwitchField.checkboxSwitch_m {
+  --checkboxSwitchHeight: 30px;
+  --checkboxSwitchFontSize: 15px;
+  --checkboxSwitchIconSize: 15px;
+  --checkboxSwitchPaddingInline: 10px;
+  --checkboxSwitchThumbGap: var(--checkboxSwitchThumbGapM, 3px);
+}
+.checkboxSwitchField.checkboxSwitch_l {
+  --checkboxSwitchHeight: 40px;
+  --checkboxSwitchFontSize: 17px;
+  --checkboxSwitchIconSize: 17px;
+  --checkboxSwitchPaddingInline: 10px;
+  --checkboxSwitchThumbGap: var(--checkboxSwitchThumbGapL, 4px);
+}
+.checkboxSwitchField.checkboxSwitch_xl {
+  --checkboxSwitchHeight: 50px;
+  --checkboxSwitchFontSize: 19px;
+  --checkboxSwitchIconSize: 19px;
+  --checkboxSwitchPaddingInline: 15px;
+  --checkboxSwitchThumbGap: var(--checkboxSwitchThumbGapXl, 5px);
+}
+.checkboxSwitchField.checkboxSwitch_rectangular {
+  --checkboxSwitchRadius: var(--checkboxSwitchRectangularRadius, 5px);
+}
+.checkboxSwitchField .checkboxSwitchLabel {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  cursor: pointer;
+}
+.checkboxSwitchField .checkboxSwitchControl {
+  position: relative;
+  display: inline-flex;
+  flex: none;
+}
+.checkboxSwitchField .checkboxSwitchControl input[type=checkbox] {
+  position: absolute;
+  inset: 0;
+  z-index: 2;
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  opacity: 0.01;
+  cursor: pointer;
+}
+.checkboxSwitchField .checkboxSwitchControl input[type=checkbox]:disabled {
+  cursor: not-allowed;
+}
+.checkboxSwitchField .checkboxSwitchControl input[type=checkbox]:disabled ~ .checkboxSwitchTrack {
+  opacity: var(--checkboxSwitchDisabledOpacity, 0.5);
+}
+.checkboxSwitchField .checkboxSwitchControl input[type=checkbox]:focus-visible ~ .checkboxSwitchTrack {
+  outline: var(--inputFocusOutline, 1px dotted);
+  outline-offset: 2px;
+}
+.checkboxSwitchField .checkboxSwitchControl input[type=checkbox].invalidField ~ .checkboxSwitchTrack {
+  border-color: var(--inputErrorBorderColor, #c00);
+}
+.checkboxSwitchField .checkboxSwitchTrack {
+  position: relative;
+  box-sizing: border-box;
+  display: inline-grid;
+  grid-template-columns: 1fr 1fr;
+  height: var(--checkboxSwitchHeight);
+  border: var(--checkboxSwitchBorder, 1px solid #e5ebef);
+  border-radius: var(--checkboxSwitchRadius);
+  background: var(--checkboxSwitchTrackBg, #e5ebef);
+  color: var(--checkboxSwitchTrackFgColor, #24282b);
+  font-size: var(--checkboxSwitchFontSize);
+  line-height: 1;
+  overflow: hidden;
+  transition: background-color var(--checkboxSwitchTransition, 0.2s ease);
+}
+.checkboxSwitchField .checkboxSwitchState {
+  display: flex;
+  flex-direction: row;
+  column-gap: var(--checkboxSwitchStateGap, 5px);
+  align-items: center;
+  justify-content: center;
+  grid-row: 1;
+  min-width: var(--checkboxSwitchHeight);
+  padding: 0 var(--checkboxSwitchPaddingInline);
+  white-space: nowrap;
+  transition: opacity var(--checkboxSwitchTransition, 0.2s ease), background-color var(--checkboxSwitchTransition, 0.2s ease), transform var(--checkboxSwitchTransition, 0.2s ease);
+}
+.checkboxSwitchField .checkboxSwitchState .icon {
+  font-size: var(--checkboxSwitchIconSize);
+}
+.checkboxSwitchField .checkboxSwitchState .iconSvg {
+  width: var(--checkboxSwitchIconSize);
+  height: var(--checkboxSwitchIconSize);
+}
+.checkboxSwitchField .checkboxSwitchChecked {
+  grid-column: 1;
+}
+.checkboxSwitchField .checkboxSwitchUnchecked {
+  grid-column: 2;
+}
+.checkboxSwitchField.checkboxSwitch_slide .checkboxSwitchThumb {
+  position: absolute;
+  top: var(--checkboxSwitchThumbGap);
+  left: var(--checkboxSwitchThumbGap);
+  z-index: 1;
+  box-sizing: border-box;
+  width: calc(50% - var(--checkboxSwitchThumbGap));
+  height: calc(100% - var(--checkboxSwitchThumbGap) * 2);
+  border-radius: max(0px, var(--checkboxSwitchRadius) - var(--checkboxSwitchThumbGap));
+  background: var(--checkboxSwitchThumbBg, #fff);
+  box-shadow: var(--checkboxSwitchThumbShadow, 0 1px 3px rgba(0, 0, 0, 0.35));
+  transition: left var(--checkboxSwitchTransition, 0.2s ease), transform var(--checkboxSwitchTransition, 0.2s ease);
+}
+.checkboxSwitchField.checkboxSwitch_slide .checkboxSwitchChecked {
+  opacity: 0;
+  color: var(--checkboxSwitchTrackCheckedFgColor, #fff);
+}
+.checkboxSwitchField.checkboxSwitch_slide input[type=checkbox]:checked ~ .checkboxSwitchTrack {
+  background: var(--checkboxSwitchTrackCheckedBg, #516472);
+}
+.checkboxSwitchField.checkboxSwitch_slide input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchThumb {
+  left: calc(100% - var(--checkboxSwitchThumbGap));
+  transform: translateX(-100%);
+}
+.checkboxSwitchField.checkboxSwitch_slide input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchChecked {
+  opacity: 1;
+}
+.checkboxSwitchField.checkboxSwitch_slide input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchUnchecked {
+  opacity: 0;
+}
+.checkboxSwitchField.checkboxSwitch_slide.checkboxSwitch_round .checkboxSwitchTrack {
+  grid-template-columns: 1fr;
+}
+.checkboxSwitchField.checkboxSwitch_slide.checkboxSwitch_round .checkboxSwitchState {
+  grid-column: 1;
+  box-sizing: border-box;
+  min-width: calc(var(--checkboxSwitchHeight) * 2);
+}
+.checkboxSwitchField.checkboxSwitch_slide.checkboxSwitch_round .checkboxSwitchUnchecked {
+  padding-left: calc(var(--checkboxSwitchHeight) + 5px);
+}
+.checkboxSwitchField.checkboxSwitch_slide.checkboxSwitch_round .checkboxSwitchChecked {
+  padding-right: calc(var(--checkboxSwitchHeight) + 5px);
+}
+.checkboxSwitchField.checkboxSwitch_slide.checkboxSwitch_round .checkboxSwitchThumb {
+  width: auto;
+  aspect-ratio: 1;
+  border-radius: 50%;
+}
+.checkboxSwitchField.checkboxSwitch_rocker .checkboxSwitchState:not(.checkboxSwitchButtonState) {
+  background: var(--checkboxSwitchRockerRaisedBg, linear-gradient(to bottom, #fff 0%, #f6f8fa 60%, #e5ebef 100%));
+  color: var(--checkboxSwitchRockerRaisedFgColor, #384147);
+}
+.checkboxSwitchField.checkboxSwitch_rocker .checkboxSwitchChecked {
+  border-right: var(--checkboxSwitchBorder, 1px solid #e5ebef);
+}
+.checkboxSwitchField.checkboxSwitch_rocker input[type=checkbox]:not(:checked) ~ .checkboxSwitchTrack .checkboxSwitchUnchecked:not(.checkboxSwitchButtonState) {
+  background: var(--checkboxSwitchRockerPressedBg, linear-gradient(to bottom, #c2d0d9 0%, #d3dee4 35%, #e5ebef 100%));
+  color: var(--checkboxSwitchRockerPressedFgColor, #181a1b);
+}
+.checkboxSwitchField.checkboxSwitch_rocker input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchChecked:not(.checkboxSwitchButtonState) {
+  background: var(--checkboxSwitchRockerCheckedPressedBg, linear-gradient(to bottom, #24282b 0%, #384147 35%, #516472 100%));
+  color: var(--checkboxSwitchRockerCheckedPressedFgColor, #fff);
+}
+.checkboxSwitchField.checkboxSwitch_rocker.checkboxSwitch_single input[type=checkbox]:not(:checked) ~ .checkboxSwitchTrack .checkboxSwitchUnchecked:not(.checkboxSwitchButtonState) {
+  background: var(--checkboxSwitchRockerRaisedBg, linear-gradient(to bottom, #fff 0%, #f6f8fa 60%, #e5ebef 100%));
+  color: var(--checkboxSwitchRockerRaisedFgColor, #384147);
+}
+.checkboxSwitchField.checkboxSwitch_glow.checkboxSwitch_glowLight {
+  --checkboxSwitchGlowTrackBg: var(--checkboxSwitchGlowLightTrackBg, linear-gradient(to bottom, #fff 0%, #eef2f4 100%));
+  --checkboxSwitchGlowInactiveFgColor: var(--checkboxSwitchGlowLightInactiveFgColor, #7e97a7);
+  --checkboxSwitchGlowOffFgColor: var(--checkboxSwitchGlowLightOffFgColor, #24282b);
+  --checkboxSwitchGlowOnFgColor: var(--checkboxSwitchGlowLightOnFgColor, color-mix(in srgb, var(--checkboxSwitchGlowColor, #2bff88) 55%, #000));
+}
+.checkboxSwitchField.checkboxSwitch_glow.checkboxSwitch_round.checkboxSwitch_hiddenStateLabels .checkboxSwitchTrack {
+  width: var(--checkboxSwitchHeight);
+}
+.checkboxSwitchField.checkboxSwitch_glow.checkboxSwitch_round.checkboxSwitch_hiddenStateLabels .checkboxSwitchState {
+  min-width: 0;
+  padding: 0;
+}
+.checkboxSwitchField.checkboxSwitch_glow.checkboxSwitch_round.checkboxSwitch_hiddenStateLabels.checkboxSwitch_split .checkboxSwitchTrack {
+  width: calc(var(--checkboxSwitchHeight) * 2);
+}
+.checkboxSwitchField.checkboxSwitch_glow .checkboxSwitchTrack {
+  background: var(--checkboxSwitchGlowTrackBg, linear-gradient(to bottom, #384147 0%, #24282b 100%));
+}
+.checkboxSwitchField.checkboxSwitch_glow .checkboxSwitchState {
+  transition: color var(--checkboxSwitchTransition, 0.2s ease), text-shadow var(--checkboxSwitchTransition, 0.2s ease), opacity var(--checkboxSwitchTransition, 0.2s ease);
+}
+.checkboxSwitchField.checkboxSwitch_glow .checkboxSwitchState:not(.checkboxSwitchButtonState) {
+  color: var(--checkboxSwitchGlowInactiveFgColor, #7e97a7);
+}
+.checkboxSwitchField.checkboxSwitch_glow .checkboxSwitchState .iconSvg {
+  transition: filter var(--checkboxSwitchTransition, 0.2s ease);
+}
+.checkboxSwitchField.checkboxSwitch_glow .checkboxSwitchChecked {
+  border-right: var(--checkboxSwitchBorder, 1px solid #e5ebef);
+}
+.checkboxSwitchField.checkboxSwitch_glow input[type=checkbox]:not(:checked) ~ .checkboxSwitchTrack .checkboxSwitchUnchecked:not(.checkboxSwitchButtonState) {
+  color: var(--checkboxSwitchGlowOffFgColor, #e5ebef);
+}
+.checkboxSwitchField.checkboxSwitch_glow input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchChecked:not(.checkboxSwitchButtonState) {
+  color: var(--checkboxSwitchGlowOnFgColor, #e8fff2);
+}
+.checkboxSwitchField.checkboxSwitch_glow input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchChecked {
+  text-shadow: 0 0 var(--checkboxSwitchGlowRadius, 5px) var(--checkboxSwitchGlowColor, #2bff88), 0 0 calc(var(--checkboxSwitchGlowRadius, 5px) * 2) var(--checkboxSwitchGlowColor, #2bff88);
+}
+.checkboxSwitchField.checkboxSwitch_glow input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchChecked .iconSvg {
+  filter: drop-shadow(0 0 calc(var(--checkboxSwitchGlowRadius, 5px) / 2) var(--checkboxSwitchGlowColor, #2bff88)) drop-shadow(0 0 var(--checkboxSwitchGlowRadius, 5px) var(--checkboxSwitchGlowColor, #2bff88));
+}
+.checkboxSwitchField.checkboxSwitch_powerButton .checkboxSwitchTrack {
+  width: var(--checkboxSwitchHeight);
+  border-radius: 50%;
+  background: var(--checkboxSwitchPowerButtonBezelBg, conic-gradient(from -45deg, #fff 0%, #ddd 50%, #fff 100%));
+}
+.checkboxSwitchField.checkboxSwitch_powerButton .checkboxSwitchTrack::after {
+  content: "";
+  position: absolute;
+  z-index: 1;
+  inset: var(--checkboxSwitchPowerButtonCapInset, 15%);
+  box-sizing: border-box;
+  border-radius: 50%;
+  border: var(--checkboxSwitchPowerButtonCapBorder, 1px solid #ddd);
+  background: var(--checkboxSwitchPowerButtonCapBg, radial-gradient(circle at bottom right, #fff 0%, #ddd 50%, #ccc 100%));
+}
+.checkboxSwitchField.checkboxSwitch_powerButton .checkboxSwitchState {
+  position: relative;
+  z-index: 2;
+  min-width: 0;
+  padding: 0;
+  color: var(--checkboxSwitchPowerButtonOffFgColor, #ccc);
+  text-shadow: var(--checkboxSwitchPowerButtonOffShadow, 0 0 1px #888);
+  transition: color var(--checkboxSwitchTransition, 0.2s ease), text-shadow var(--checkboxSwitchTransition, 0.2s ease);
+}
+.checkboxSwitchField.checkboxSwitch_powerButton .checkboxSwitchState .icon {
+  font-size: max(11px, var(--checkboxSwitchHeight) * 0.36);
+}
+.checkboxSwitchField.checkboxSwitch_powerButton .checkboxSwitchState .iconSvg {
+  width: max(11px, var(--checkboxSwitchHeight) * 0.36);
+  height: max(11px, var(--checkboxSwitchHeight) * 0.36);
+}
+.checkboxSwitchField.checkboxSwitch_powerButton input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchChecked {
+  color: var(--checkboxSwitchPowerButtonOnFgColor, #f00);
+  text-shadow: var(--checkboxSwitchPowerButtonOnShadow, 0 0 1px #030);
+}
+.checkboxSwitchField.checkboxSwitch_single:not(.checkboxSwitch_slide) .checkboxSwitchTrack {
+  grid-template-columns: 1fr;
+}
+.checkboxSwitchField.checkboxSwitch_single:not(.checkboxSwitch_slide) .checkboxSwitchState {
+  grid-column: 1;
+}
+.checkboxSwitchField.checkboxSwitch_single:not(.checkboxSwitch_slide) .checkboxSwitchChecked {
+  border-right: 0;
+}
+.checkboxSwitchField.checkboxSwitch_single:not(.checkboxSwitch_slide) input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchUnchecked,
+.checkboxSwitchField.checkboxSwitch_single:not(.checkboxSwitch_slide) input[type=checkbox]:not(:checked) ~ .checkboxSwitchTrack .checkboxSwitchChecked {
+  visibility: hidden;
+}
+.checkboxSwitchField .checkboxSwitchTrack .checkboxSwitchState.checkboxSwitchButtonState {
+  box-sizing: border-box;
+  width: auto;
+  height: auto;
+  min-height: 0;
+  min-width: var(--checkboxSwitchHeight);
+  margin: 0;
+  padding: 0 var(--checkboxSwitchPaddingInline);
+  border-radius: 0;
+  font-size: inherit;
+  line-height: inherit;
+  cursor: inherit;
+}
+.checkboxSwitchField.checkboxSwitch_split:not(.checkboxSwitch_slide) input[type=checkbox]:checked ~ .checkboxSwitchTrack .checkboxSwitchUnchecked.checkboxSwitchButtonState,
+.checkboxSwitchField.checkboxSwitch_split:not(.checkboxSwitch_slide) input[type=checkbox]:not(:checked) ~ .checkboxSwitchTrack .checkboxSwitchChecked.checkboxSwitchButtonState {
+  opacity: var(--checkboxSwitchButtonInactiveOpacity, 0.4);
+}
+@media (prefers-reduced-motion: reduce) {
+  .checkboxSwitchField .checkboxSwitchTrack,
+  .checkboxSwitchField .checkboxSwitchState,
+  .checkboxSwitchField .checkboxSwitchThumb {
+    transition: none;
+  }
+}

package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitchProps.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=checkboxSwitchProps.js.map

package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitchProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkboxSwitchProps.js","names":[],"sources":["../../../../../../../../../src/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitchProps.ts"],"sourcesContent":["import { ReactNode } from 'react';\nimport {\n  CustomContentProps,\n  CustomFieldCssClassesProps,\n  FieldProps,\n  FormFieldProps,\n  LabelProps\n} from '../../../../formFieldWrapper/formFieldProps';\nimport { IconSource } from '../../../../../../../helpers/iconHelpers';\nimport { InputCheckboxValidationProps } from '../inputCheckboxProps';\nimport { ButtonStyles } from '../../../../../buttons/button.interface';\n\nexport type CheckboxSwitchSize = 'xs' | 's' | 'm' | 'l' | 'xl';\n\n/** `slide` moves a thumb across a track; `rocker` presses the active half down like a light switch; `glow` lights up the \"on\" content like a power button; `powerButton` is a circular icon-only button with a raised cap. */\nexport type CheckboxSwitchVariant = 'slide' | 'rocker' | 'glow' | 'powerButton';\n\n/** `round` uses a circular slide thumb; `ellipse` stretches the thumb across half the track. Rocker and glow switches treat both as pill shaped. */\nexport type CheckboxSwitchShape = 'round' | 'ellipse' | 'rectangular';\n\n/** `split` shows both states side by side; `single` shows only the current state as one button. Slide switches always show one state. */\nexport type CheckboxSwitchStateDisplay = 'split' | 'single';\n\n/** Only applies to the `glow` variant. */\nexport type CheckboxSwitchGlowTheme = 'dark' | 'light';\n\nexport type CheckboxSwitchButtonStyle = Omit<ButtonStyles, 'size'>;\n\nexport interface CheckboxSwitchLabelProps extends Omit<LabelProps, 'position'> {\n  position?: 'left' | 'right';\n}\n\nexport interface CheckboxSwitchFieldProps extends Pick<FieldProps, 'id' | 'name' | 'disabled' | 'onChange' | 'onBlur' | 'onTouched'> {\n  /** Submitted when checked. When omitted the form value is a boolean. */\n  value?: string;\n  defaultChecked?: boolean;\n}\n\nexport interface CheckboxSwitchStateProps {\n  /** Visible text for this state. */\n  label?: ReactNode;\n  icon?: IconSource;\n  cssClass?: string;\n  /** Library button appearance for this state. Size and shape come from the switch; ignored by the `slide` variant. */\n  buttonStyle?: CheckboxSwitchButtonStyle;\n}\n\nexport interface CheckboxSwitchStatesProps {\n  checked?: CheckboxSwitchStateProps;\n  unchecked?: CheckboxSwitchStateProps;\n}\n\nexport interface CheckboxSwitchProps extends Omit<FormFieldProps, 'label' | 'field' | 'layout' | 'validation' | 'separateLabelAndField'> {\n  label: CheckboxSwitchLabelProps;\n  field: CheckboxSwitchFieldProps;\n  validation?: InputCheckboxValidationProps;\n  variant?: CheckboxSwitchVariant;\n  shape?: CheckboxSwitchShape;\n  size?: CheckboxSwitchSize;\n  states?: CheckboxSwitchStatesProps;\n  stateDisplay?: CheckboxSwitchStateDisplay;\n  glowTheme?: CheckboxSwitchGlowTheme;\n  /** Visually hides the per-state labels while keeping any state icons. */\n  hideStateLabels?: boolean;\n  showSpinner?: boolean;\n  customCssClasses?: CustomFieldCssClassesProps;\n  customContent?: CustomContentProps;\n}\n"],"mappings":"","ignoreList":[]}

package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"inputCheckboxProps.js","names":[],"sources":["../../../../../../../../src/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.ts"],"sourcesContent":["import { ReactElement, ReactNode } from 'react';\nimport {\n  CustomContentProps,\n  CustomFieldCssClassesProps,\n  FieldProps,\n  FormFieldProps,\n  LabelProps,\n  ValidationProps\n} from '../../../formFieldWrapper/formFieldProps';\n\nexport interface InputCheckboxLabelProps extends Omit<LabelProps, 'hide' | 'position'> {\n  position?: 'left' | 'right';\n}\n\nexport interface InputCheckboxIconsProps {\n  checked: string | ReactNode | ReactElement;\n  unchecked: string | ReactNode | ReactElement;\n}\n\nexport interface InputCheckboxFieldProps extends Omit<FieldProps, 'type' | 'placeholder' | 'value' | 'defaultValue' | 'referenceDate' | 'includeEmptyOption' | 'options'> {\n  value: boolean | string;\n  defaultChecked?: boolean;\n  defaultValue?: boolean | string | number | readonly string[];\n}\n\nexport interface InputCheckboxValidationProps<TFieldValue = unknown, TFormValues = unknown>\n  extends Omit<ValidationProps<TFieldValue, TFormValues>, 'validate'> {\n}\n\nexport interface InputCheckboxProps extends Omit<FormFieldProps, 'label' | 'field' | 'layout' | 'validation'> {\n  label: InputCheckboxLabelProps,\n  field: InputCheckboxFieldProps,\n  validation?: InputCheckboxValidationProps;\n  showSpinner?: boolean;\n  icons?: InputCheckboxIconsProps;\n  customCssClasses?: CustomFieldCssClassesProps;\n  customContent?: CustomContentProps;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"file":"inputCheckboxProps.js","names":[],"sources":["../../../../../../../../src/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.ts"],"sourcesContent":["import { IconSource } from '../../../../../../helpers/iconHelpers';\nimport {\n  CustomContentProps,\n  CustomFieldCssClassesProps,\n  FieldProps,\n  FormFieldProps,\n  LabelProps,\n  ValidationProps\n} from '../../../formFieldWrapper/formFieldProps';\n\nexport interface InputCheckboxLabelProps extends Omit<LabelProps, 'hide' | 'position'> {\n  position?: 'left' | 'right';\n}\n\nexport interface InputCheckboxIconsProps {\n  checked: IconSource;\n  unchecked: IconSource;\n}\n\nexport interface InputCheckboxFieldProps extends Omit<FieldProps, 'type' | 'placeholder' | 'value' | 'defaultValue' | 'referenceDate' | 'includeEmptyOption' | 'options'> {\n  value: boolean | string;\n  defaultChecked?: boolean;\n  defaultValue?: boolean | string | number | readonly string[];\n}\n\nexport interface InputCheckboxValidationProps<TFieldValue = unknown, TFormValues = unknown>\n  extends Omit<ValidationProps<TFieldValue, TFormValues>, 'validate'> {\n}\n\nexport interface InputCheckboxProps extends Omit<FormFieldProps, 'label' | 'field' | 'layout' | 'validation'> {\n  label: InputCheckboxLabelProps,\n  field: InputCheckboxFieldProps,\n  validation?: InputCheckboxValidationProps;\n  showSpinner?: boolean;\n  icons?: InputCheckboxIconsProps;\n  customCssClasses?: CustomFieldCssClassesProps;\n  customContent?: CustomContentProps;\n}\n"],"mappings":"","ignoreList":[]}

package/dist/cjs/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js

@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.DragAndDropFileUpload = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _iconDefinitions = require("@x15ventures/x15-ui-library-icons/iconDefinitions");
-var _SvgIcon = require("@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon");
 var _reactHookForm = require("react-hook-form");
+var _iconHelpers = require("../../../../../../../helpers/iconHelpers");
 var _HookFormWrapper = require("../../../../../hookFormWrapper/HookFormWrapper");
 var _Spinner = require("../../../../../../design/spinner/Spinner");
 var _FormFieldLabel = require("../../../../subComponents/labels/FormFieldLabel");
@@ -38,9 +38,7 @@ const DragAndDropFileUploadField = ({
     color: 'primary',
     variant: 'outline'
   },
-  labelUploadIcon = /*#__PURE__*/_react.default.createElement(_SvgIcon.SvgIcon, {
-    svgDefinition: _iconDefinitions.arrowUpFromBracket
-  }),
+  labelUploadIcon = _iconDefinitions.arrowUpFromBracket,
   multiple = false,
   restrictionsTxt = '',
   validFiles = {
@@ -175,7 +173,7 @@ const DragAndDropFileUploadField = ({
     }
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: "dragAndDropFileUploadLabel"
-  }, labelUploadIcon || null, /*#__PURE__*/_react.default.createElement(_FormFieldLabel.FormFieldLabel, labelProps), restrictionsTxt && /*#__PURE__*/_react.default.createElement("span", {
+  }, (0, _iconHelpers.renderIcon)(labelUploadIcon), /*#__PURE__*/_react.default.createElement(_FormFieldLabel.FormFieldLabel, labelProps), restrictionsTxt && /*#__PURE__*/_react.default.createElement("span", {
     className: "fileRestrictionsText"
   }, restrictionsTxt)), /*#__PURE__*/_react.default.createElement("span", {
     className: "inputContainer"

package/dist/cjs/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js.map

@@ -1 +1 @@
-{"version":3,"file":"DragAndDropFileUpload.js","names":["Object","defineProperty","exports","value","default","DragAndDropFileUpload","_react","_interopRequireWildcard","require","_iconDefinitions","_SvgIcon","_reactHookForm","_HookFormWrapper","_Spinner","_FormFieldLabel","_InputFile","_ValidationMessages","_button","_FileAttachmentsList","_constants","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","props","createElement","HookFormWrapper","formContext","DragAndDropFileUploadField","label","field","showSpinner","fileDisplayStyle","fileListSettings","fileList","validation","customContent","customCssClasses","labelStyle","labelAsButtonStyles","color","variant","labelUploadIcon","SvgIcon","svgDefinition","arrowUpFromBracket","multiple","restrictionsTxt","validFiles","extensions","DEFAULT_UPLOAD_FILE_EXTENSIONS","fileTypes","DEFAULT_UPLOAD_FILE_TYPES","maxFileCount","maxFileSize","onFilesChange","setValue","trigger","useFormContext","activeFileList","setFileList","useState","isTouched","setIsTouched","isDragActive","setIsDragActive","inputId","id","inputElRef","useRef","dialogOpenRef","useEffect","current","document","getElementById","onFocus","noneSelected","files","length","name","window","addEventListener","removeEventListener","supportedFileTypes","useMemo","join","validateAndCommit","useCallback","validated","filter","file","ext","split","pop","toLowerCase","isBlacklisted","BLACKLISTED_FILE_TYPES","includes","isValidExt","isValidSize","size","clipped","slice","shouldValidate","shouldDirty","shouldTouch","handleFileInputChange","event","target","Array","from","handleDrop","dropped","handleFilesEdited","wrapperCssClass","wrapper","position","labelProps","isRequired","required","labelStyleAsButtonClasses","generateButtonClass","cssClass","buttonStyle","hideLabel","hide","labelCssClass","className","onDragOver","preventDefault","onDragLeave","currentTarget","onDrop","dataTransfer","labelId","htmlFor","onClick","FormFieldLabel","InputFile","type","defaultValue","accept","onInput","Spinner","map","index","key","ValidationMessages","FileAttachmentsList","customFileListSettings","onFilesRemoved","onFilesEdited","_default"],"sources":["../../../../../../../../../src/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.tsx"],"sourcesContent":["'use client';\n\nimport React, { FormEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { arrowUpFromBracket } from '@x15ventures/x15-ui-library-icons/iconDefinitions';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { useFormContext } from 'react-hook-form';\nimport { HookFormWrapper } from '../../../../../hookFormWrapper/HookFormWrapper';\nimport { Spinner } from '../../../../../../design/spinner/Spinner';\nimport { FormFieldLabel } from '../../../../subComponents/labels/FormFieldLabel';\nimport { InputFile } from '../../../../subComponents/inputs/file/InputFile';\nimport { ValidationMessages } from '../../../../../validation/ValidationMessages';\nimport { generateButtonClass } from '../../../../../buttons/button.helpers';\nimport { FileAttachmentsList } from '../fileAttachmentList/FileAttachmentsList';\nimport { DragAndDropFileUploadProps } from '../fileInputProps';\nimport {\n  DEFAULT_UPLOAD_FILE_EXTENSIONS,\n  DEFAULT_UPLOAD_FILE_TYPES,\n  BLACKLISTED_FILE_TYPES\n} from '../../../../../../../constants';\n\nimport './dragAndDropFileUpload.scss';\n\nexport const DragAndDropFileUpload: React.FC<DragAndDropFileUploadProps> = (props) => (\n  <HookFormWrapper formContext={ props.formContext }>\n    <DragAndDropFileUploadField { ...props } />\n  </HookFormWrapper>\n);\n\nconst DragAndDropFileUploadField: React.FC<DragAndDropFileUploadProps> = (\n  {\n    label,\n    field,\n    showSpinner,\n    fileDisplayStyle = 'names',\n    fileListSettings,\n    fileList,\n    validation,\n    customContent,\n    customCssClasses,\n    labelStyle = 'dragArea',\n    labelAsButtonStyles = { color: 'primary', variant: 'outline' },\n    labelUploadIcon = <SvgIcon svgDefinition={ arrowUpFromBracket } />,\n    multiple = false,\n    restrictionsTxt = '',\n    validFiles = {\n      extensions: DEFAULT_UPLOAD_FILE_EXTENSIONS,\n      fileTypes: DEFAULT_UPLOAD_FILE_TYPES,\n      maxFileCount: 5,\n      maxFileSize: 52428800 // 50 MB\n    },\n    onFilesChange = () => {}\n  }\n) => {\n  const { setValue, trigger } = useFormContext();\n\n  const [activeFileList, setFileList] = useState<File[]>(fileList || []);\n  const [isTouched, setIsTouched] = useState(false);\n  const [isDragActive, setIsDragActive] = useState(false);\n\n  const inputId = field.id;\n  const inputElRef = useRef<HTMLInputElement | null>(null);\n  const dialogOpenRef = useRef(false);\n\n  useEffect(() => {\n    inputElRef.current = document.getElementById(inputId) as HTMLInputElement | null;\n  }, [inputId]);\n\n  // Detect “Cancel” -> dialog closes, window regains focus, but input had no change.\n  useEffect(() => {\n    const onFocus = () => {\n      if (!dialogOpenRef.current) { return; }\n      dialogOpenRef.current = false;\n      const noneSelected = !inputElRef.current?.files?.length;\n      if (noneSelected) {\n        // Trigger React Hook Form validators (e.g., required)\n        trigger(field.name);\n      }\n    };\n    window.addEventListener('focus', onFocus);\n    return () => window.removeEventListener('focus', onFocus);\n  }, [trigger, field.name]);\n\n  const supportedFileTypes = useMemo(\n    () => validFiles?.fileTypes?.join(', ') || '',\n    [validFiles?.fileTypes]\n  );\n\n  const validateAndCommit = useCallback(\n    (files: File[]) => {\n      // basic validations\n      const validated = files.filter((file) => {\n        const ext = file.name.split('.').pop()?.toLowerCase() || '';\n        const isBlacklisted = BLACKLISTED_FILE_TYPES.includes(ext);\n        const isValidExt = validFiles.extensions ? validFiles.extensions.includes(ext) : true;\n        const isValidSize = validFiles.maxFileSize ? file.size <= validFiles.maxFileSize : true;\n        return !isBlacklisted && isValidExt && isValidSize;\n      });\n\n      const clipped = validFiles.maxFileCount\n        ? validated.slice(0, validFiles.maxFileCount)\n        : validated;\n\n      setFileList(clipped);\n      setIsTouched(true);\n\n      setValue(field.name, clipped.length ? clipped : null, {\n        shouldValidate: true,\n        shouldDirty: true,\n        shouldTouch: true\n      });\n\n      onFilesChange(clipped);\n    },\n    [field.name, onFilesChange, setValue, fileDisplayStyle, validFiles]\n  );\n\n  const handleFileInputChange = useCallback((event: FormEvent<HTMLInputElement>) => {\n    const target = event.target as HTMLInputElement;\n    const files = Array.from(target.files ?? []);\n    validateAndCommit(files);\n    trigger(field.name);\n    dialogOpenRef.current = false;\n  }, [trigger, field.name, validateAndCommit]);\n\n  const handleDrop = useCallback((dropped: File[]) => {\n    validateAndCommit(dropped);\n    trigger(field.name);\n  }, [trigger, field.name, validateAndCommit]);\n\n  const handleFilesEdited = useCallback((files: File[]) => {\n    // No need to validate again as they were already validated\n    // Changes may include renaming or removing files\n    setFileList(files);\n    setValue(field.name, files.length > 0 ? files : null, {\n      shouldValidate: true,\n      shouldDirty: true,\n      shouldTouch: true\n    });\n    onFilesChange(files);\n  }, [field.name, setValue, onFilesChange]);\n\n  const wrapperCssClass = `\n    formField \n    dragAndDropFileUpload \n    ${ fileDisplayStyle === 'list' ? 'withFileList' : '' } \n    ${ labelStyle || '' }Style \n    ${ customCssClasses?.wrapper || '' } \n    ${ isTouched ? 'touched' : '' } \n    ${ typeof validation !== 'undefined' ? 'withValidation' : '' } \n    ${ label?.position === 'inset' ? 'insetLabel' : '' } \n    ${ isDragActive ? 'isDragActive' : '' }\n  `;\n\n  const labelProps = {\n    ...label,\n    inputId: inputId,\n    isRequired: validation && typeof validation.required !== 'undefined',\n    customContent\n  };\n\n  const labelStyleAsButtonClasses = generateButtonClass({\n    cssClass: 'button dragAndDropFileUploadButtonLabel',\n    buttonStyle: labelAsButtonStyles,\n    hideLabel: label.hide\n  });\n\n  const labelCssClass = `\n    ${ labelStyle === 'button' ? labelStyleAsButtonClasses : '' }\n    ${ customCssClasses?.label || '' } \n    ${ showSpinner ? 'withSpinner' : '' } \n    ${ label.hide ? 'hiddenLabel' : '' }\n  `;\n\n  return (\n    <div\n      className={ wrapperCssClass }\n      onDragOver={ (e) => {\n        e.preventDefault();\n        if (!isDragActive) setIsDragActive(true);\n      } }\n      onDragLeave={ (e) => {\n        if (e.currentTarget === e.target) setIsDragActive(false);\n      } }\n      onDrop={ (e) => {\n        e.preventDefault();\n        setIsDragActive(false);\n        const files = Array.from(e.dataTransfer?.files ?? []);\n        handleDrop(files);\n      } }\n    >\n      <label\n        id={ label.labelId || `${ inputId }_label` }\n        className={ labelCssClass }\n        htmlFor={ inputId }\n        onClick={ () => { dialogOpenRef.current = true; } }\n      >\n        <span className=\"dragAndDropFileUploadLabel\">\n          { labelUploadIcon || null }\n          <FormFieldLabel { ...labelProps } />\n          { restrictionsTxt && <span className=\"fileRestrictionsText\">{ restrictionsTxt }</span> }\n        </span>\n\n        <span className=\"inputContainer\">\n          <InputFile\n            {\n              ...{\n                label,\n                field: {\n                  ...field,\n                  type: 'file',\n                  id: inputId,             // ensure we can query it by id\n                  defaultValue: '',\n                  multiple,\n                  accept: supportedFileTypes,\n                  onInput: (event: FormEvent<HTMLInputElement>) => {\n                    handleFileInputChange(event);\n                  }\n                },\n                validation,\n                showSpinner,\n                customCssClasses,\n                customContent\n              }\n            }\n          />\n        </span>\n\n        { showSpinner && <Spinner /> }\n\n        { fileDisplayStyle === 'names' && activeFileList.length > 0 && (\n          <span className=\"uploadedFileNames\">\n            { activeFileList.map((file, index) => (\n              <small key={ index } className=\"uploadedFileName\">\n                { file.name }{ index < activeFileList.length - 1 ? ', ' : '' }\n              </small>\n            )) }\n          </span>\n        ) }\n\n        <ValidationMessages name={ field.name } validation={ validation } />\n      </label>\n\n      { fileDisplayStyle === 'list' && activeFileList.length > 0 && (\n        <FileAttachmentsList\n          customFileListSettings={ fileListSettings }\n          files={ activeFileList }\n          onFilesRemoved={ handleFilesEdited }\n          onFilesEdited={ handleFilesEdited }\n        />\n      ) }\n    </div>\n  );\n};\n\nexport default { DragAndDropFileUpload };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"DragAndDropFileUpload.js","names":["Object","defineProperty","exports","value","default","DragAndDropFileUpload","_react","_interopRequireWildcard","require","_iconDefinitions","_reactHookForm","_iconHelpers","_HookFormWrapper","_Spinner","_FormFieldLabel","_InputFile","_ValidationMessages","_button","_FileAttachmentsList","_constants","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","props","createElement","HookFormWrapper","formContext","DragAndDropFileUploadField","label","field","showSpinner","fileDisplayStyle","fileListSettings","fileList","validation","customContent","customCssClasses","labelStyle","labelAsButtonStyles","color","variant","labelUploadIcon","arrowUpFromBracket","multiple","restrictionsTxt","validFiles","extensions","DEFAULT_UPLOAD_FILE_EXTENSIONS","fileTypes","DEFAULT_UPLOAD_FILE_TYPES","maxFileCount","maxFileSize","onFilesChange","setValue","trigger","useFormContext","activeFileList","setFileList","useState","isTouched","setIsTouched","isDragActive","setIsDragActive","inputId","id","inputElRef","useRef","dialogOpenRef","useEffect","current","document","getElementById","onFocus","noneSelected","files","length","name","window","addEventListener","removeEventListener","supportedFileTypes","useMemo","join","validateAndCommit","useCallback","validated","filter","file","ext","split","pop","toLowerCase","isBlacklisted","BLACKLISTED_FILE_TYPES","includes","isValidExt","isValidSize","size","clipped","slice","shouldValidate","shouldDirty","shouldTouch","handleFileInputChange","event","target","Array","from","handleDrop","dropped","handleFilesEdited","wrapperCssClass","wrapper","position","labelProps","isRequired","required","labelStyleAsButtonClasses","generateButtonClass","cssClass","buttonStyle","hideLabel","hide","labelCssClass","className","onDragOver","preventDefault","onDragLeave","currentTarget","onDrop","dataTransfer","labelId","htmlFor","onClick","renderIcon","FormFieldLabel","InputFile","type","defaultValue","accept","onInput","Spinner","map","index","key","ValidationMessages","FileAttachmentsList","customFileListSettings","onFilesRemoved","onFilesEdited","_default"],"sources":["../../../../../../../../../src/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.tsx"],"sourcesContent":["'use client';\n\nimport React, { FormEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { arrowUpFromBracket } from '@x15ventures/x15-ui-library-icons/iconDefinitions';\nimport { useFormContext } from 'react-hook-form';\nimport { renderIcon } from '../../../../../../../helpers/iconHelpers';\nimport { HookFormWrapper } from '../../../../../hookFormWrapper/HookFormWrapper';\nimport { Spinner } from '../../../../../../design/spinner/Spinner';\nimport { FormFieldLabel } from '../../../../subComponents/labels/FormFieldLabel';\nimport { InputFile } from '../../../../subComponents/inputs/file/InputFile';\nimport { ValidationMessages } from '../../../../../validation/ValidationMessages';\nimport { generateButtonClass } from '../../../../../buttons/button.helpers';\nimport { FileAttachmentsList } from '../fileAttachmentList/FileAttachmentsList';\nimport { DragAndDropFileUploadProps } from '../fileInputProps';\nimport {\n  DEFAULT_UPLOAD_FILE_EXTENSIONS,\n  DEFAULT_UPLOAD_FILE_TYPES,\n  BLACKLISTED_FILE_TYPES\n} from '../../../../../../../constants';\n\nimport './dragAndDropFileUpload.scss';\n\nexport const DragAndDropFileUpload: React.FC<DragAndDropFileUploadProps> = (props) => (\n  <HookFormWrapper formContext={ props.formContext }>\n    <DragAndDropFileUploadField { ...props } />\n  </HookFormWrapper>\n);\n\nconst DragAndDropFileUploadField: React.FC<DragAndDropFileUploadProps> = (\n  {\n    label,\n    field,\n    showSpinner,\n    fileDisplayStyle = 'names',\n    fileListSettings,\n    fileList,\n    validation,\n    customContent,\n    customCssClasses,\n    labelStyle = 'dragArea',\n    labelAsButtonStyles = { color: 'primary', variant: 'outline' },\n    labelUploadIcon = arrowUpFromBracket,\n    multiple = false,\n    restrictionsTxt = '',\n    validFiles = {\n      extensions: DEFAULT_UPLOAD_FILE_EXTENSIONS,\n      fileTypes: DEFAULT_UPLOAD_FILE_TYPES,\n      maxFileCount: 5,\n      maxFileSize: 52428800 // 50 MB\n    },\n    onFilesChange = () => {}\n  }\n) => {\n  const { setValue, trigger } = useFormContext();\n\n  const [activeFileList, setFileList] = useState<File[]>(fileList || []);\n  const [isTouched, setIsTouched] = useState(false);\n  const [isDragActive, setIsDragActive] = useState(false);\n\n  const inputId = field.id;\n  const inputElRef = useRef<HTMLInputElement | null>(null);\n  const dialogOpenRef = useRef(false);\n\n  useEffect(() => {\n    inputElRef.current = document.getElementById(inputId) as HTMLInputElement | null;\n  }, [inputId]);\n\n  // Detect “Cancel” -> dialog closes, window regains focus, but input had no change.\n  useEffect(() => {\n    const onFocus = () => {\n      if (!dialogOpenRef.current) { return; }\n      dialogOpenRef.current = false;\n      const noneSelected = !inputElRef.current?.files?.length;\n      if (noneSelected) {\n        // Trigger React Hook Form validators (e.g., required)\n        trigger(field.name);\n      }\n    };\n    window.addEventListener('focus', onFocus);\n    return () => window.removeEventListener('focus', onFocus);\n  }, [trigger, field.name]);\n\n  const supportedFileTypes = useMemo(\n    () => validFiles?.fileTypes?.join(', ') || '',\n    [validFiles?.fileTypes]\n  );\n\n  const validateAndCommit = useCallback(\n    (files: File[]) => {\n      // basic validations\n      const validated = files.filter((file) => {\n        const ext = file.name.split('.').pop()?.toLowerCase() || '';\n        const isBlacklisted = BLACKLISTED_FILE_TYPES.includes(ext);\n        const isValidExt = validFiles.extensions ? validFiles.extensions.includes(ext) : true;\n        const isValidSize = validFiles.maxFileSize ? file.size <= validFiles.maxFileSize : true;\n        return !isBlacklisted && isValidExt && isValidSize;\n      });\n\n      const clipped = validFiles.maxFileCount\n        ? validated.slice(0, validFiles.maxFileCount)\n        : validated;\n\n      setFileList(clipped);\n      setIsTouched(true);\n\n      setValue(field.name, clipped.length ? clipped : null, {\n        shouldValidate: true,\n        shouldDirty: true,\n        shouldTouch: true\n      });\n\n      onFilesChange(clipped);\n    },\n    [field.name, onFilesChange, setValue, fileDisplayStyle, validFiles]\n  );\n\n  const handleFileInputChange = useCallback((event: FormEvent<HTMLInputElement>) => {\n    const target = event.target as HTMLInputElement;\n    const files = Array.from(target.files ?? []);\n    validateAndCommit(files);\n    trigger(field.name);\n    dialogOpenRef.current = false;\n  }, [trigger, field.name, validateAndCommit]);\n\n  const handleDrop = useCallback((dropped: File[]) => {\n    validateAndCommit(dropped);\n    trigger(field.name);\n  }, [trigger, field.name, validateAndCommit]);\n\n  const handleFilesEdited = useCallback((files: File[]) => {\n    // No need to validate again as they were already validated\n    // Changes may include renaming or removing files\n    setFileList(files);\n    setValue(field.name, files.length > 0 ? files : null, {\n      shouldValidate: true,\n      shouldDirty: true,\n      shouldTouch: true\n    });\n    onFilesChange(files);\n  }, [field.name, setValue, onFilesChange]);\n\n  const wrapperCssClass = `\n    formField \n    dragAndDropFileUpload \n    ${ fileDisplayStyle === 'list' ? 'withFileList' : '' } \n    ${ labelStyle || '' }Style \n    ${ customCssClasses?.wrapper || '' } \n    ${ isTouched ? 'touched' : '' } \n    ${ typeof validation !== 'undefined' ? 'withValidation' : '' } \n    ${ label?.position === 'inset' ? 'insetLabel' : '' } \n    ${ isDragActive ? 'isDragActive' : '' }\n  `;\n\n  const labelProps = {\n    ...label,\n    inputId: inputId,\n    isRequired: validation && typeof validation.required !== 'undefined',\n    customContent\n  };\n\n  const labelStyleAsButtonClasses = generateButtonClass({\n    cssClass: 'button dragAndDropFileUploadButtonLabel',\n    buttonStyle: labelAsButtonStyles,\n    hideLabel: label.hide\n  });\n\n  const labelCssClass = `\n    ${ labelStyle === 'button' ? labelStyleAsButtonClasses : '' }\n    ${ customCssClasses?.label || '' } \n    ${ showSpinner ? 'withSpinner' : '' } \n    ${ label.hide ? 'hiddenLabel' : '' }\n  `;\n\n  return (\n    <div\n      className={ wrapperCssClass }\n      onDragOver={ (e) => {\n        e.preventDefault();\n        if (!isDragActive) setIsDragActive(true);\n      } }\n      onDragLeave={ (e) => {\n        if (e.currentTarget === e.target) setIsDragActive(false);\n      } }\n      onDrop={ (e) => {\n        e.preventDefault();\n        setIsDragActive(false);\n        const files = Array.from(e.dataTransfer?.files ?? []);\n        handleDrop(files);\n      } }\n    >\n      <label\n        id={ label.labelId || `${ inputId }_label` }\n        className={ labelCssClass }\n        htmlFor={ inputId }\n        onClick={ () => { dialogOpenRef.current = true; } }\n      >\n        <span className=\"dragAndDropFileUploadLabel\">\n          { renderIcon(labelUploadIcon) }\n          <FormFieldLabel { ...labelProps } />\n          { restrictionsTxt && <span className=\"fileRestrictionsText\">{ restrictionsTxt }</span> }\n        </span>\n\n        <span className=\"inputContainer\">\n          <InputFile\n            {\n              ...{\n                label,\n                field: {\n                  ...field,\n                  type: 'file',\n                  id: inputId,             // ensure we can query it by id\n                  defaultValue: '',\n                  multiple,\n                  accept: supportedFileTypes,\n                  onInput: (event: FormEvent<HTMLInputElement>) => {\n                    handleFileInputChange(event);\n                  }\n                },\n                validation,\n                showSpinner,\n                customCssClasses,\n                customContent\n              }\n            }\n          />\n        </span>\n\n        { showSpinner && <Spinner /> }\n\n        { fileDisplayStyle === 'names' && activeFileList.length > 0 && (\n          <span className=\"uploadedFileNames\">\n            { activeFileList.map((file, index) => (\n              <small key={ index } className=\"uploadedFileName\">\n                { file.name }{ index < activeFileList.length - 1 ? ', ' : '' }\n              </small>\n            )) }\n          </span>\n        ) }\n\n        <ValidationMessages name={ field.name } validation={ validation } />\n      </label>\n\n      { fileDisplayStyle === 'list' && activeFileList.length > 0 && (\n        <FileAttachmentsList\n          customFileListSettings={ fileListSettings }\n          files={ activeFileList }\n          onFilesRemoved={ handleFilesEdited }\n          onFilesEdited={ handleFilesEdited }\n        />\n      ) }\n    </div>\n  );\n};\n\nexport default { DragAndDropFileUpload };\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/form/formFields/subComponents/inputs/file/fileAttachmentList/FileAttachmentsList.js

@@ -11,6 +11,7 @@ var _SimpleButton = require("../../../../../buttons/SimpleButton");
 var _iconDefinitions = require("@x15ventures/x15-ui-library-icons/iconDefinitions");
 var _SvgIcon = require("@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon");
 var _helpers = require("../../../../../../../helpers");
+var _iconHelpers = require("../../../../../../../helpers/iconHelpers");
 require("./fileAttachmentsList.css");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const DefaultFileListSettings = exports.DefaultFileListSettings = {
@@ -83,18 +84,15 @@ const FileAttachmentsList = ({
     setAdjustedFiles(updatedFiles);
     onFilesRemoved(updatedFiles);
   };
-  const EditIcon = () => fileListSettings.design?.editing?.edit?.icon || /*#__PURE__*/_react.default.createElement(_SvgIcon.SvgIcon, {
-    svgDefinition: _iconDefinitions.pencil
+  const editIcon = (0, _iconHelpers.renderIcon)(fileListSettings.design?.editing?.edit?.icon, {
+    fallback: _iconDefinitions.pencil
   });
-  const DeleteIcon = () => fileListSettings.design?.editing?.delete?.icon || /*#__PURE__*/_react.default.createElement(_SvgIcon.SvgIcon, {
-    svgDefinition: _iconDefinitions.trash
+  const deleteIcon = (0, _iconHelpers.renderIcon)(fileListSettings.design?.editing?.delete?.icon, {
+    fallback: _iconDefinitions.trash
   });
-  const CancelIcon = () => /*#__PURE__*/_react.default.createElement(_SvgIcon.SvgIcon, {
-    svgDefinition: _iconDefinitions.xmark
-  });
-  const SaveIcon = () => /*#__PURE__*/_react.default.createElement(_SvgIcon.SvgIcon, {
-    svgDefinition: _iconDefinitions.check,
-    customCssClass: "saveIcon"
+  const cancelIcon = (0, _iconHelpers.renderIcon)(_iconDefinitions.xmark);
+  const saveIcon = (0, _iconHelpers.renderIcon)(_iconDefinitions.check, {
+    customCssClass: 'saveIcon'
   });
   const isFileNameEditable = fileListSettings.isEditable && !fileListSettings.design?.editing?.edit?.disable;
   const isFileDeletable = fileListSettings.isEditable && !fileListSettings.design?.editing?.delete?.disable;
@@ -132,9 +130,7 @@ const FileAttachmentsList = ({
       variant: 'icon-only',
       size: 'compact'
     },
-    leftIcon: {
-      icon: /*#__PURE__*/_react.default.createElement(CancelIcon, null)
-    },
+    leftIcon: cancelIcon,
     id: `cancelEditFileButton${index}`,
     onClickHandler: () => setEditingIndex(null)
   }), /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, {
@@ -145,9 +141,7 @@ const FileAttachmentsList = ({
       size: 'compact',
       color: 'primary'
     },
-    leftIcon: {
-      icon: /*#__PURE__*/_react.default.createElement(SaveIcon, null)
-    },
+    leftIcon: saveIcon,
     id: `saveEditFileButton${index}`,
     onClickHandler: () => handleFileNameEdit(index)
   })) : /*#__PURE__*/_react.default.createElement("span", {
@@ -156,18 +150,14 @@ const FileAttachmentsList = ({
     label: "Edit file name",
     hideLabel: true,
     buttonStyle: fileListSettings.design?.editing?.edit?.buttonStyle,
-    leftIcon: {
-      icon: /*#__PURE__*/_react.default.createElement(EditIcon, null)
-    },
+    leftIcon: editIcon,
     id: `editFileButton${index}`,
     onClickHandler: () => setEditingIndex(index)
   }), isFileDeletable && /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, {
     label: "Remove file",
     hideLabel: true,
     buttonStyle: fileListSettings.design?.editing?.delete?.buttonStyle,
-    leftIcon: {
-      icon: /*#__PURE__*/_react.default.createElement(DeleteIcon, null)
-    },
+    leftIcon: deleteIcon,
     id: `removeFileButton${index}`,
     onClickHandler: () => handleFileRemoved(index)
   }))))));

package/dist/cjs/components/form/formFields/subComponents/inputs/file/fileAttachmentList/FileAttachmentsList.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileAttachmentsList.js","names":["Object","defineProperty","exports","value","default","FileAttachmentsList","DefaultFileListSettings","_react","_interopRequireWildcard","require","_SimpleButton","_iconDefinitions","_SvgIcon","_helpers","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","isEditable","design","animation","editing","delete","icon","createElement","SvgIcon","svgDefinition","trash","label","disable","buttonStyle","variant","size","edit","pencil","heading","isVisible","prefix","includeFileCount","customFileListSettings","onFilesRemoved","onFilesEdited","files","adjustedFiles","setAdjustedFiles","useState","editingIndex","setEditingIndex","filesList","React","createRef","fileListSettings","deepMergeObjects","baseObject","overrideObject","useEffect","handleFileNameEdit","index","newName","adjustedName","current","children","querySelector","trim","updatedFiles","map","file","File","type","handleFileRemoved","filter","_","EditIcon","DeleteIcon","CancelIcon","xmark","SaveIcon","check","customCssClass","isFileNameEditable","isFileDeletable","className","length","ref","key","name","defaultValue","onKeyDown","target","autoFocus","SimpleButton","hideLabel","leftIcon","id","onClickHandler","color","_default"],"sources":["../../../../../../../../../src/components/form/formFields/subComponents/inputs/file/fileAttachmentList/FileAttachmentsList.tsx"],"sourcesContent":["/* eslint-disable no-unused-vars */\n'use client';\nimport React, { FC, useEffect, useState } from 'react';\nimport { SimpleButton } from '../../../../../buttons/SimpleButton';\nimport { pencil, trash, xmark, check } from '@x15ventures/x15-ui-library-icons/iconDefinitions';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { FileAttachmentListSettingsProps } from '../fileInputProps';\nimport { deepMergeObjects } from '../../../../../../../helpers';\n\nimport './fileAttachmentsList.scss';\n\ninterface FileAttachmentsProps {\n  customFileListSettings?: FileAttachmentListSettingsProps;\n  onFilesRemoved: (files: File[]) => void;\n  onFilesEdited: (files: File[]) => void;\n  files: File[];\n}\n\nexport const DefaultFileListSettings: FileAttachmentListSettingsProps = {\n  isEditable: true,\n  design: {\n    animation: 'reveal',\n    editing: {\n      delete: {\n        icon: <SvgIcon svgDefinition={ trash }/>,\n        label: 'Remove file',\n        disable: false,\n        buttonStyle: {\n          variant: 'icon-only',\n          size: 'compact',\n        }\n      },\n      edit: {\n        icon: <SvgIcon svgDefinition={ pencil }/>,\n        label: 'Edit file name',\n        disable: false,\n        buttonStyle: {\n          variant: 'icon-only',\n          size: 'compact',\n        }\n      }\n    },\n    heading: {\n      isVisible: false,\n      prefix: 'Attached files',\n      includeFileCount: true\n    }\n  }\n};\n\nexport const FileAttachmentsList: FC<FileAttachmentsProps> = (\n  {\n    customFileListSettings,\n    onFilesRemoved = () => {},\n    onFilesEdited = () => {},\n    files\n  }\n) => {\n  const [adjustedFiles, setAdjustedFiles] = useState<File[]>(files);\n  const [editingIndex, setEditingIndex] = useState<number | null>(null);\n  const filesList = React.createRef<HTMLUListElement>();\n\n  const fileListSettings: FileAttachmentListSettingsProps = deepMergeObjects({\n    baseObject: DefaultFileListSettings,\n    overrideObject: customFileListSettings || {}\n  });\n\n  useEffect(() => {\n    setAdjustedFiles(files);\n  }, [files]);\n\n  const handleFileNameEdit = (index: number, newName?: string) => {\n    const adjustedName = newName || (filesList.current?.children[index].querySelector('input') as HTMLInputElement)?.value.trim();\n\n    const updatedFiles = adjustedFiles.map((file, i) => {\n      if (i === index) {\n        return new File([file], adjustedName, { type: file.type });\n      }\n      return file;\n    });\n    setAdjustedFiles(updatedFiles);\n    setEditingIndex(null);\n    onFilesEdited(updatedFiles);\n  };\n\n  const handleFileRemoved = (index: number) => {\n    const updatedFiles = adjustedFiles.filter((_, i) => i !== index);\n    setAdjustedFiles(updatedFiles);\n    onFilesRemoved(updatedFiles);\n  };\n\n  const EditIcon: FC = () => fileListSettings.design?.editing?.edit?.icon || <SvgIcon svgDefinition={ pencil } />;\n  const DeleteIcon: FC = () => fileListSettings.design?.editing?.delete?.icon || <SvgIcon svgDefinition={ trash } />;\n  const CancelIcon: FC = () => <SvgIcon svgDefinition={ xmark } />;\n  const SaveIcon: FC = () => <SvgIcon svgDefinition={ check } customCssClass=\"saveIcon\" />;\n\n  const isFileNameEditable = fileListSettings.isEditable && !fileListSettings.design?.editing?.edit?.disable;\n  const isFileDeletable = fileListSettings.isEditable && !fileListSettings.design?.editing?.delete?.disable;\n\n  return (\n    <div className=\"fileAttachmentsList\">\n      {\n        fileListSettings.design?.heading?.isVisible && (\n          <h4>\n            {\n              fileListSettings.design?.heading?.prefix || 'Attached files'\n            }\n            {\n              fileListSettings.design?.heading?.includeFileCount && ` (${ adjustedFiles.length })`\n            }\n          </h4>\n        )\n      }\n      <div className={ `fileUploadList ${ adjustedFiles.length > 0 ? 'withFiles' : 'noFiles' }` }>\n        { adjustedFiles.length > 0 && (\n          <ul className=\"noBullet\" ref={ filesList }>\n            { adjustedFiles.map((file, index) => (\n              <li key={ index }>\n                {\n                  editingIndex === index && isFileNameEditable ? (\n                    <span className=\"editFileNameContainer\">\n                      <input\n                        type=\"text\"\n                        aria-label={ `Edit file name (${ file.name })` }\n                        defaultValue={ file.name }\n                        className=\"fileNameInput\"\n                        onKeyDown={ (e) => {\n                          if (e.key === 'Enter') {\n                            const newName = (e.target as HTMLInputElement).value.trim();\n                            if (newName && newName !== file.name) {\n                              handleFileNameEdit(index, newName);\n                            }\n                          } else if (e.key === 'Escape' || e.key === 'Tab') {\n                            setEditingIndex(null);\n                          }\n                        } }\n                        autoFocus\n                      />\n                      <SimpleButton\n                        label=\"Cancel\"\n                        hideLabel\n                        buttonStyle={ { variant: 'icon-only', size: 'compact' } }\n                        leftIcon={ { icon: <CancelIcon /> } }\n                        id={ `cancelEditFileButton${ index }` }\n                        onClickHandler={ () => setEditingIndex(null) }\n                      />\n                      <SimpleButton\n                        label=\"Save\"\n                        hideLabel\n                        buttonStyle={ { variant: 'icon-only', size: 'compact', color: 'primary' } }\n                        leftIcon={ { icon: <SaveIcon /> } }\n                        id={ `saveEditFileButton${ index }` }\n                        onClickHandler={ () => handleFileNameEdit(index) }\n                      />\n                    </span>\n                  ) :\n                    <span className=\"fileNameDisplay\">{ file.name }</span>\n                }\n\n                {\n                  isFileNameEditable && (\n                    <SimpleButton\n                      label=\"Edit file name\"\n                      hideLabel\n                      buttonStyle={ fileListSettings.design?.editing?.edit?.buttonStyle }\n                      leftIcon={ { icon: <EditIcon /> } }\n                      id={ `editFileButton${ index }` }\n                      onClickHandler={ () => setEditingIndex(index) }\n                    />\n                  )\n                }\n\n                {\n                  isFileDeletable && (\n                    <SimpleButton\n                      label=\"Remove file\"\n                      hideLabel\n                      buttonStyle={ fileListSettings.design?.editing?.delete?.buttonStyle }\n                      leftIcon={ { icon: <DeleteIcon /> } }\n                      id={ `removeFileButton${ index }` }\n                      onClickHandler={ () => handleFileRemoved(index) }\n                    />\n                  )\n                }\n              </li>\n            )) }\n          </ul>\n        ) }\n      </div>\n    </div>\n  );\n};\n\nexport default {\n  FileAttachmentsList\n};\n"],"mappings":";AAAA;AACA,YAAY;;AAACA,MAAA,CAAAC,cAAA,CAAAC,OAAA;EAAAC,KAAA;AAAA;AAAAD,OAAA,CAAAE,OAAA,GAAAF,OAAA,CAAAG,mBAAA,GAAAH,OAAA,CAAAI,uBAAA;AACb,IAAAC,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,gBAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAEA,IAAAI,QAAA,GAAAJ,OAAA;AAEAA,OAAA;AAAoC,SAAAD,wBAAAM,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAR,uBAAA,YAAAA,CAAAM,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAnB,OAAA,EAAAU,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAI,GAAA,CAAAV,CAAA,UAAAM,CAAA,CAAAK,GAAA,CAAAX,CAAA,GAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAY,cAAA,CAAAC,IAAA,CAAAd,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAApB,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAA6B,wBAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAS7B,MAAMT,uBAAwD,GAAAJ,OAAA,CAAAI,uBAAA,GAAG;EACtEwB,UAAU,EAAE,IAAI;EAChBC,MAAM,EAAE;IACNC,SAAS,EAAE,QAAQ;IACnBC,OAAO,EAAE;MACPC,MAAM,EAAE;QACNC,IAAI,eAAE5B,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACxB,QAAA,CAAAyB,OAAO;UAACC,aAAa,EAAGC;QAAO,CAAC,CAAC;QACxCC,KAAK,EAAE,aAAa;QACpBC,OAAO,EAAE,KAAK;QACdC,WAAW,EAAE;UACXC,OAAO,EAAE,WAAW;UACpBC,IAAI,EAAE;QACR;MACF,CAAC;MACDC,IAAI,EAAE;QACJV,IAAI,eAAE5B,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACxB,QAAA,CAAAyB,OAAO;UAACC,aAAa,EAAGQ;QAAQ,CAAC,CAAC;QACzCN,KAAK,EAAE,gBAAgB;QACvBC,OAAO,EAAE,KAAK;QACdC,WAAW,EAAE;UACXC,OAAO,EAAE,WAAW;UACpBC,IAAI,EAAE;QACR;MACF;IACF,CAAC;IACDG,OAAO,EAAE;MACPC,SAAS,EAAE,KAAK;MAChBC,MAAM,EAAE,gBAAgB;MACxBC,gBAAgB,EAAE;IACpB;EACF;AACF,CAAC;AAEM,MAAM7C,mBAA6C,GAAGA,CAC3D;EACE8C,sBAAsB;EACtBC,cAAc,GAAGA,CAAA,KAAM,CAAC,CAAC;EACzBC,aAAa,GAAGA,CAAA,KAAM,CAAC,CAAC;EACxBC;AACF,CAAC,KACE;EACH,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAG,IAAAC,eAAQ,EAASH,KAAK,CAAC;EACjE,MAAM,CAACI,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAF,eAAQ,EAAgB,IAAI,CAAC;EACrE,MAAMG,SAAS,gBAAGC,cAAK,CAACC,SAAS,CAAmB,CAAC;EAErD,MAAMC,gBAAiD,GAAG,IAAAC,yBAAgB,EAAC;IACzEC,UAAU,EAAE3D,uBAAuB;IACnC4D,cAAc,EAAEf,sBAAsB,IAAI,CAAC;EAC7C,CAAC,CAAC;EAEF,IAAAgB,gBAAS,EAAC,MAAM;IACdX,gBAAgB,CAACF,KAAK,CAAC;EACzB,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,MAAMc,kBAAkB,GAAGA,CAACC,KAAa,EAAEC,OAAgB,KAAK;IAC9D,MAAMC,YAAY,GAAGD,OAAO,IAAKV,SAAS,CAACY,OAAO,EAAEC,QAAQ,CAACJ,KAAK,CAAC,CAACK,aAAa,CAAC,OAAO,CAAC,EAAuBvE,KAAK,CAACwE,IAAI,CAAC,CAAC;IAE7H,MAAMC,YAAY,GAAGrB,aAAa,CAACsB,GAAG,CAAC,CAACC,IAAI,EAAEzD,CAAC,KAAK;MAClD,IAAIA,CAAC,KAAKgD,KAAK,EAAE;QACf,OAAO,IAAIU,IAAI,CAAC,CAACD,IAAI,CAAC,EAAEP,YAAY,EAAE;UAAES,IAAI,EAAEF,IAAI,CAACE;QAAK,CAAC,CAAC;MAC5D;MACA,OAAOF,IAAI;IACb,CAAC,CAAC;IACFtB,gBAAgB,CAACoB,YAAY,CAAC;IAC9BjB,eAAe,CAAC,IAAI,CAAC;IACrBN,aAAa,CAACuB,YAAY,CAAC;EAC7B,CAAC;EAED,MAAMK,iBAAiB,GAAIZ,KAAa,IAAK;IAC3C,MAAMO,YAAY,GAAGrB,aAAa,CAAC2B,MAAM,CAAC,CAACC,CAAC,EAAE9D,CAAC,KAAKA,CAAC,KAAKgD,KAAK,CAAC;IAChEb,gBAAgB,CAACoB,YAAY,CAAC;IAC9BxB,cAAc,CAACwB,YAAY,CAAC;EAC9B,CAAC;EAED,MAAMQ,QAAY,GAAGA,CAAA,KAAMrB,gBAAgB,CAAChC,MAAM,EAAEE,OAAO,EAAEY,IAAI,EAAEV,IAAI,iBAAI5B,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACxB,QAAA,CAAAyB,OAAO;IAACC,aAAa,EAAGQ;EAAQ,CAAE,CAAC;EAC/G,MAAMuC,UAAc,GAAGA,CAAA,KAAMtB,gBAAgB,CAAChC,MAAM,EAAEE,OAAO,EAAEC,MAAM,EAAEC,IAAI,iBAAI5B,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACxB,QAAA,CAAAyB,OAAO;IAACC,aAAa,EAAGC;EAAO,CAAE,CAAC;EAClH,MAAM+C,UAAc,GAAGA,CAAA,kBAAM/E,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACxB,QAAA,CAAAyB,OAAO;IAACC,aAAa,EAAGiD;EAAO,CAAE,CAAC;EAChE,MAAMC,QAAY,GAAGA,CAAA,kBAAMjF,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACxB,QAAA,CAAAyB,OAAO;IAACC,aAAa,EAAGmD,sBAAO;IAACC,cAAc,EAAC;EAAU,CAAE,CAAC;EAExF,MAAMC,kBAAkB,GAAG5B,gBAAgB,CAACjC,UAAU,IAAI,CAACiC,gBAAgB,CAAChC,MAAM,EAAEE,OAAO,EAAEY,IAAI,EAAEJ,OAAO;EAC1G,MAAMmD,eAAe,GAAG7B,gBAAgB,CAACjC,UAAU,IAAI,CAACiC,gBAAgB,CAAChC,MAAM,EAAEE,OAAO,EAAEC,MAAM,EAAEO,OAAO;EAEzG,oBACElC,MAAA,CAAAH,OAAA,CAAAgC,aAAA;IAAKyD,SAAS,EAAC;EAAqB,GAEhC9B,gBAAgB,CAAChC,MAAM,EAAEgB,OAAO,EAAEC,SAAS,iBACzCzC,MAAA,CAAAH,OAAA,CAAAgC,aAAA,aAEI2B,gBAAgB,CAAChC,MAAM,EAAEgB,OAAO,EAAEE,MAAM,IAAI,gBAAgB,EAG5Dc,gBAAgB,CAAChC,MAAM,EAAEgB,OAAO,EAAEG,gBAAgB,IAAI,KAAMK,aAAa,CAACuC,MAAM,GAEhF,CACL,eAEHvF,MAAA,CAAAH,OAAA,CAAAgC,aAAA;IAAKyD,SAAS,EAAG,kBAAmBtC,aAAa,CAACuC,MAAM,GAAG,CAAC,GAAG,WAAW,GAAG,SAAS;EAAK,GACvFvC,aAAa,CAACuC,MAAM,GAAG,CAAC,iBACxBvF,MAAA,CAAAH,OAAA,CAAAgC,aAAA;IAAIyD,SAAS,EAAC,UAAU;IAACE,GAAG,EAAGnC;EAAW,GACtCL,aAAa,CAACsB,GAAG,CAAC,CAACC,IAAI,EAAET,KAAK,kBAC9B9D,MAAA,CAAAH,OAAA,CAAAgC,aAAA;IAAI4D,GAAG,EAAG3B;EAAO,GAEbX,YAAY,KAAKW,KAAK,IAAIsB,kBAAkB,gBAC1CpF,MAAA,CAAAH,OAAA,CAAAgC,aAAA;IAAMyD,SAAS,EAAC;EAAuB,gBACrCtF,MAAA,CAAAH,OAAA,CAAAgC,aAAA;IACE4C,IAAI,EAAC,MAAM;IACX,cAAa,mBAAoBF,IAAI,CAACmB,IAAI,GAAM;IAChDC,YAAY,EAAGpB,IAAI,CAACmB,IAAM;IAC1BJ,SAAS,EAAC,eAAe;IACzBM,SAAS,EAAIrF,CAAC,IAAK;MACjB,IAAIA,CAAC,CAACkF,GAAG,KAAK,OAAO,EAAE;QACrB,MAAM1B,OAAO,GAAIxD,CAAC,CAACsF,MAAM,CAAsBjG,KAAK,CAACwE,IAAI,CAAC,CAAC;QAC3D,IAAIL,OAAO,IAAIA,OAAO,KAAKQ,IAAI,CAACmB,IAAI,EAAE;UACpC7B,kBAAkB,CAACC,KAAK,EAAEC,OAAO,CAAC;QACpC;MACF,CAAC,MAAM,IAAIxD,CAAC,CAACkF,GAAG,KAAK,QAAQ,IAAIlF,CAAC,CAACkF,GAAG,KAAK,KAAK,EAAE;QAChDrC,eAAe,CAAC,IAAI,CAAC;MACvB;IACF,CAAG;IACH0C,SAAS;EAAA,CACV,CAAC,eACF9F,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAAC1B,aAAA,CAAA4F,YAAY;IACX9D,KAAK,EAAC,QAAQ;IACd+D,SAAS;IACT7D,WAAW,EAAG;MAAEC,OAAO,EAAE,WAAW;MAAEC,IAAI,EAAE;IAAU,CAAG;IACzD4D,QAAQ,EAAG;MAAErE,IAAI,eAAE5B,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACkD,UAAU,MAAE;IAAE,CAAG;IACrCmB,EAAE,EAAG,uBAAwBpC,KAAK,EAAK;IACvCqC,cAAc,EAAGA,CAAA,KAAM/C,eAAe,CAAC,IAAI;EAAG,CAC/C,CAAC,eACFpD,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAAC1B,aAAA,CAAA4F,YAAY;IACX9D,KAAK,EAAC,MAAM;IACZ+D,SAAS;IACT7D,WAAW,EAAG;MAAEC,OAAO,EAAE,WAAW;MAAEC,IAAI,EAAE,SAAS;MAAE+D,KAAK,EAAE;IAAU,CAAG;IAC3EH,QAAQ,EAAG;MAAErE,IAAI,eAAE5B,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACoD,QAAQ,MAAE;IAAE,CAAG;IACnCiB,EAAE,EAAG,qBAAsBpC,KAAK,EAAK;IACrCqC,cAAc,EAAGA,CAAA,KAAMtC,kBAAkB,CAACC,KAAK;EAAG,CACnD,CACG,CAAC,gBAEP9D,MAAA,CAAAH,OAAA,CAAAgC,aAAA;IAAMyD,SAAS,EAAC;EAAiB,GAAGf,IAAI,CAACmB,IAAY,CAAC,EAIxDN,kBAAkB,iBAChBpF,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAAC1B,aAAA,CAAA4F,YAAY;IACX9D,KAAK,EAAC,gBAAgB;IACtB+D,SAAS;IACT7D,WAAW,EAAGqB,gBAAgB,CAAChC,MAAM,EAAEE,OAAO,EAAEY,IAAI,EAAEH,WAAa;IACnE8D,QAAQ,EAAG;MAAErE,IAAI,eAAE5B,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACgD,QAAQ,MAAE;IAAE,CAAG;IACnCqB,EAAE,EAAG,iBAAkBpC,KAAK,EAAK;IACjCqC,cAAc,EAAGA,CAAA,KAAM/C,eAAe,CAACU,KAAK;EAAG,CAChD,CACF,EAIDuB,eAAe,iBACbrF,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAAC1B,aAAA,CAAA4F,YAAY;IACX9D,KAAK,EAAC,aAAa;IACnB+D,SAAS;IACT7D,WAAW,EAAGqB,gBAAgB,CAAChC,MAAM,EAAEE,OAAO,EAAEC,MAAM,EAAEQ,WAAa;IACrE8D,QAAQ,EAAG;MAAErE,IAAI,eAAE5B,MAAA,CAAAH,OAAA,CAAAgC,aAAA,CAACiD,UAAU,MAAE;IAAE,CAAG;IACrCoB,EAAE,EAAG,mBAAoBpC,KAAK,EAAK;IACnCqC,cAAc,EAAGA,CAAA,KAAMzB,iBAAiB,CAACZ,KAAK;EAAG,CAClD,CAGH,CACL,CACC,CAEH,CACF,CAAC;AAEV,CAAC;AAACnE,OAAA,CAAAG,mBAAA,GAAAA,mBAAA;AAAA,IAAAuG,QAAA,GAAA1G,OAAA,CAAAE,OAAA,GAEa;EACbC;AACF,CAAC","ignoreList":[]}
+{"version":3,"file":"FileAttachmentsList.js","names":["Object","defineProperty","exports","value","default","FileAttachmentsList","DefaultFileListSettings","_react","_interopRequireWildcard","require","_SimpleButton","_iconDefinitions","_SvgIcon","_helpers","_iconHelpers","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","isEditable","design","animation","editing","delete","icon","createElement","SvgIcon","svgDefinition","trash","label","disable","buttonStyle","variant","size","edit","pencil","heading","isVisible","prefix","includeFileCount","customFileListSettings","onFilesRemoved","onFilesEdited","files","adjustedFiles","setAdjustedFiles","useState","editingIndex","setEditingIndex","filesList","React","createRef","fileListSettings","deepMergeObjects","baseObject","overrideObject","useEffect","handleFileNameEdit","index","newName","adjustedName","current","children","querySelector","trim","updatedFiles","map","file","File","type","handleFileRemoved","filter","_","editIcon","renderIcon","fallback","deleteIcon","cancelIcon","xmark","saveIcon","check","customCssClass","isFileNameEditable","isFileDeletable","className","length","ref","key","name","defaultValue","onKeyDown","target","autoFocus","SimpleButton","hideLabel","leftIcon","id","onClickHandler","color","_default"],"sources":["../../../../../../../../../src/components/form/formFields/subComponents/inputs/file/fileAttachmentList/FileAttachmentsList.tsx"],"sourcesContent":["/* eslint-disable no-unused-vars */\n'use client';\nimport React, { FC, useEffect, useState } from 'react';\nimport { SimpleButton } from '../../../../../buttons/SimpleButton';\nimport { pencil, trash, xmark, check } from '@x15ventures/x15-ui-library-icons/iconDefinitions';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { FileAttachmentListSettingsProps } from '../fileInputProps';\nimport { deepMergeObjects } from '../../../../../../../helpers';\nimport { renderIcon } from '../../../../../../../helpers/iconHelpers';\n\nimport './fileAttachmentsList.scss';\n\ninterface FileAttachmentsProps {\n  customFileListSettings?: FileAttachmentListSettingsProps;\n  onFilesRemoved: (files: File[]) => void;\n  onFilesEdited: (files: File[]) => void;\n  files: File[];\n}\n\nexport const DefaultFileListSettings: FileAttachmentListSettingsProps = {\n  isEditable: true,\n  design: {\n    animation: 'reveal',\n    editing: {\n      delete: {\n        icon: <SvgIcon svgDefinition={ trash }/>,\n        label: 'Remove file',\n        disable: false,\n        buttonStyle: {\n          variant: 'icon-only',\n          size: 'compact',\n        }\n      },\n      edit: {\n        icon: <SvgIcon svgDefinition={ pencil }/>,\n        label: 'Edit file name',\n        disable: false,\n        buttonStyle: {\n          variant: 'icon-only',\n          size: 'compact',\n        }\n      }\n    },\n    heading: {\n      isVisible: false,\n      prefix: 'Attached files',\n      includeFileCount: true\n    }\n  }\n};\n\nexport const FileAttachmentsList: FC<FileAttachmentsProps> = (\n  {\n    customFileListSettings,\n    onFilesRemoved = () => {},\n    onFilesEdited = () => {},\n    files\n  }\n) => {\n  const [adjustedFiles, setAdjustedFiles] = useState<File[]>(files);\n  const [editingIndex, setEditingIndex] = useState<number | null>(null);\n  const filesList = React.createRef<HTMLUListElement>();\n\n  const fileListSettings: FileAttachmentListSettingsProps = deepMergeObjects({\n    baseObject: DefaultFileListSettings,\n    overrideObject: customFileListSettings || {}\n  });\n\n  useEffect(() => {\n    setAdjustedFiles(files);\n  }, [files]);\n\n  const handleFileNameEdit = (index: number, newName?: string) => {\n    const adjustedName = newName || (filesList.current?.children[index].querySelector('input') as HTMLInputElement)?.value.trim();\n\n    const updatedFiles = adjustedFiles.map((file, i) => {\n      if (i === index) {\n        return new File([file], adjustedName, { type: file.type });\n      }\n      return file;\n    });\n    setAdjustedFiles(updatedFiles);\n    setEditingIndex(null);\n    onFilesEdited(updatedFiles);\n  };\n\n  const handleFileRemoved = (index: number) => {\n    const updatedFiles = adjustedFiles.filter((_, i) => i !== index);\n    setAdjustedFiles(updatedFiles);\n    onFilesRemoved(updatedFiles);\n  };\n\n  const editIcon = renderIcon(fileListSettings.design?.editing?.edit?.icon, { fallback: pencil });\n  const deleteIcon = renderIcon(fileListSettings.design?.editing?.delete?.icon, { fallback: trash });\n  const cancelIcon = renderIcon(xmark);\n  const saveIcon = renderIcon(check, { customCssClass: 'saveIcon' });\n\n  const isFileNameEditable = fileListSettings.isEditable && !fileListSettings.design?.editing?.edit?.disable;\n  const isFileDeletable = fileListSettings.isEditable && !fileListSettings.design?.editing?.delete?.disable;\n\n  return (\n    <div className=\"fileAttachmentsList\">\n      {\n        fileListSettings.design?.heading?.isVisible && (\n          <h4>\n            {\n              fileListSettings.design?.heading?.prefix || 'Attached files'\n            }\n            {\n              fileListSettings.design?.heading?.includeFileCount && ` (${ adjustedFiles.length })`\n            }\n          </h4>\n        )\n      }\n      <div className={ `fileUploadList ${ adjustedFiles.length > 0 ? 'withFiles' : 'noFiles' }` }>\n        { adjustedFiles.length > 0 && (\n          <ul className=\"noBullet\" ref={ filesList }>\n            { adjustedFiles.map((file, index) => (\n              <li key={ index }>\n                {\n                  editingIndex === index && isFileNameEditable ? (\n                    <span className=\"editFileNameContainer\">\n                      <input\n                        type=\"text\"\n                        aria-label={ `Edit file name (${ file.name })` }\n                        defaultValue={ file.name }\n                        className=\"fileNameInput\"\n                        onKeyDown={ (e) => {\n                          if (e.key === 'Enter') {\n                            const newName = (e.target as HTMLInputElement).value.trim();\n                            if (newName && newName !== file.name) {\n                              handleFileNameEdit(index, newName);\n                            }\n                          } else if (e.key === 'Escape' || e.key === 'Tab') {\n                            setEditingIndex(null);\n                          }\n                        } }\n                        autoFocus\n                      />\n                      <SimpleButton\n                        label=\"Cancel\"\n                        hideLabel\n                        buttonStyle={ { variant: 'icon-only', size: 'compact' } }\n                        leftIcon={ cancelIcon }\n                        id={ `cancelEditFileButton${ index }` }\n                        onClickHandler={ () => setEditingIndex(null) }\n                      />\n                      <SimpleButton\n                        label=\"Save\"\n                        hideLabel\n                        buttonStyle={ { variant: 'icon-only', size: 'compact', color: 'primary' } }\n                        leftIcon={ saveIcon }\n                        id={ `saveEditFileButton${ index }` }\n                        onClickHandler={ () => handleFileNameEdit(index) }\n                      />\n                    </span>\n                  ) :\n                    <span className=\"fileNameDisplay\">{ file.name }</span>\n                }\n\n                {\n                  isFileNameEditable && (\n                    <SimpleButton\n                      label=\"Edit file name\"\n                      hideLabel\n                      buttonStyle={ fileListSettings.design?.editing?.edit?.buttonStyle }\n                      leftIcon={ editIcon }\n                      id={ `editFileButton${ index }` }\n                      onClickHandler={ () => setEditingIndex(index) }\n                    />\n                  )\n                }\n\n                {\n                  isFileDeletable && (\n                    <SimpleButton\n                      label=\"Remove file\"\n                      hideLabel\n                      buttonStyle={ fileListSettings.design?.editing?.delete?.buttonStyle }\n                      leftIcon={ deleteIcon }\n                      id={ `removeFileButton${ index }` }\n                      onClickHandler={ () => handleFileRemoved(index) }\n                    />\n                  )\n                }\n              </li>\n            )) }\n          </ul>\n        ) }\n      </div>\n    </div>\n  );\n};\n\nexport default {\n  FileAttachmentsList\n};\n"],"mappings":"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","ignoreList":[]}