npm - udp-stencil-component-library - Versions diffs - 1.0.2 → 1.0.3 - Mend

udp-stencil-component-library 1.0.2 → 1.0.3

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

package/dist/components/p-BYsLvu6g.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-BYsLvu6g.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/inputs/text-field/text-field.css?tag=text-field&encapsulation=shadow","src/components/my-component/UI/inputs/text-field/text-field.tsx"],"sourcesContent":["@import '../inputs.css';","import {\n Component,\n Prop,\n h,\n Host,\n State,\n Watch,\n Event,\n EventEmitter,\n} from '@stencil/core';\nimport { InputSize, InputMargin } from '../input-types';\n\n/**\n * A standardized text input field component with error handling, validation, and custom styling.\n * Supports both controlled and uncontrolled modes with proper event emission for integration\n * with form libraries and custom event handlers.\n *\n * @example\n * ```tsx\n * // Uncontrolled component with initial value\n * <text-field\n * placeholder=\"Enter your name\"\n * initialValue=\"John Doe\"\n * onChange={(e) => console.log('Final value:', e.detail)}\n * />\n *\n * // Controlled component\n * <text-field\n * placeholder=\"Enter your name\"\n * value={nameValue}\n * onChange={(e) => setNameValue(e.detail)}\n * />\n *\n * // With validation and error handling\n * <text-field\n * label=\"Email Address\"\n * placeholder=\"user@example.com\"\n * required={true}\n * error={emailError}\n * value={email}\n * onChange={handleEmailChange}\n * />\n * ```\n */\n@Component({\n tag: 'text-field',\n styleUrl: 'text-field.css',\n shadow: true,\n})\nexport class TextField {\n /**\n * Unique identifier for the input element. Used for form association and accessibility.\n */\n @Prop() id: string;\n\n /**\n * Label text displayed above the input field. Used for accessibility and user guidance.\n */\n @Prop() label: string;\n\n /**\n * Placeholder text shown when the input is empty. Provides hints about expected input format.\n */\n @Prop() placeholder: string;\n\n /**\n * Whether the field is required for form submission. Adds visual indicator (*) and validation.\n */\n @Prop() required: boolean;\n\n /**\n * Whether the field is read-only. Users can see the value but cannot modify it.\n */\n @Prop() readonly: boolean;\n\n /**\n * Whether the field is disabled. Users cannot interact with the field.\n */\n @Prop() disabled: boolean;\n\n /**\n * Maximum number of characters allowed in the input. Enforces character limits.\n */\n @Prop() maxCharacter: number;\n\n /**\n * Current value of the input field. When provided, makes this a controlled component.\n * The component will use this value and update it through events.\n */\n @Prop({ mutable: true }) value: string;\n\n /**\n * Initial value for the input field. Used for uncontrolled components to set the default value.\n * Only used when `value` prop is not provided.\n */\n @Prop() initialValue: string;\n\n /**\n * Whether the field should be hidden from display while maintaining form functionality.\n */\n @Prop() hidden: boolean;\n\n /**\n * Error message to display below the input field. Shows validation errors or other issues.\n */\n @Prop() error: string = '';\n\n /**\n * Input mode hint for mobile keyboards. Optimizes keyboard layout for specific input types.\n * Common values: 'text', 'email', 'tel', 'url', 'numeric', 'decimal', 'search'\n */\n @Prop() inputMode: string;\n\n /**\n * Size variant controlling the padding and spacing of the input.\n * - 'small': Compact spacing for data-heavy interfaces\n * - 'normal': Standard spacing (default)\n * - 'large': Generous spacing for accessibility\n */\n @Prop() size: InputSize = 'normal';\n\n /**\n * Margin variant for the input spacing.\n * - 'none': No margin\n * - 'dense': Minimal margin spacing\n * - 'normal': Standard margin spacing (default)\n */\n @Prop() margin: InputMargin = 'normal';\n\n /**\n * Internal error message state. Manages display of validation errors.\n * @internal\n */\n @State() errorMessage: string;\n\n /**\n * Internal value state. Manages the current input value independently of props.\n * @internal\n */\n @State() internalValue: string;\n\n /**\n * Emitted when the text field value changes (on blur, enter, etc.).\n * Provides the final committed value when user finishes editing.\n *\n * @event change\n * @param {string} value - The current value of the text field\n *\n * @example\n * ```tsx\n * <text-field onChange={(e) => handleValueChange(e.detail)} />\n * ```\n */\n @Event() change: EventEmitter<string>;\n\n /**\n * Updates the error message when the error prop changes.\n * @internal\n */\n @Watch('error')\n updateError() {\n this.errorMessage = this.error;\n }\n\n /**\n * Updates the internal value when initialValue prop changes.\n * Only updates if current value is empty to avoid overriding user input.\n * @internal\n */\n @Watch('initialValue')\n updateInitialValue() {\n // Only update if we don't have a value yet or if explicitly resetting\n if (this.internalValue === '' || this.internalValue === undefined) {\n this.internalValue = this.initialValue || '';\n }\n }\n\n /**\n * Updates the internal value when value prop changes.\n * For controlled components, the value prop takes precedence.\n * @internal\n */\n @Watch('value')\n updateValue() {\n // If value prop is provided, this is a controlled component\n if (this.value !== undefined) {\n this.internalValue = this.value;\n }\n }\n\n /**\n * Component lifecycle method. Initializes error message and internal value.\n * @internal\n */\n componentWillLoad() {\n // Initialize error message\n if (this.error) {\n this.errorMessage = this.error;\n }\n // Initialize value: use value prop if provided (controlled), otherwise use initialValue (uncontrolled)\n this.internalValue = this.value !== undefined ? this.value : (this.initialValue || '');\n }\n\n /**\n * Handles input events (real-time typing). Updates internal state and emits input event.\n * For controlled components, also updates the value prop.\n * @param event - The native input event\n * @internal\n */\n private onInput = (event: InputEvent) => {\n if (this.readonly) {\n // Prevent typing if the field is read-only\n const input = event.target as HTMLInputElement;\n input.value = this.internalValue;\n return;\n }\n const newValue = (event.target as HTMLInputElement).value;\n this.internalValue = newValue; // Update internal state\n\n // If this is a controlled component (value prop provided), update the value prop\n if (this.value !== undefined) {\n this.value = newValue;\n }\n }\n\n /**\n * Handles change events (committed changes on blur/enter). Emits change event.\n * @param event - The native change event\n * @internal\n */\n private onChange = (event: Event) => {\n if (this.readonly) {\n return;\n }\n const newValue = (event.target as HTMLInputElement).value;\n // Emit change event when user finishes editing (blur, enter, etc.)\n this.change.emit(newValue);\n }\n\n render() {\n const isError = !!this.errorMessage;\n\n const inputClass = {\n 'bx--text-input': true,\n 'bx--text-input--error': isError,\n 'bx--text-input:user-invalid': isError,\n 'text-field--disabled': this.disabled,\n };\n return (\n <Host\n class={{\n 'udp-input': true,\n 'udp-input--error': isError,\n 'udp-input--disabled': this.disabled,\n 'udp-input--readonly': this.readonly,\n 'udp-input--required': this.required,\n [`udp-input--size-${this.size}`]: true,\n [`udp-input--margin-${this.margin}`]: true,\n }}\n aria-invalid={isError ? 'true' : 'false'}\n aria-required={this.required ? 'true' : 'false'}\n >\n <div class=\"bx--form-item\">\n <unity-typography variant=\"caption-text\">\n <label htmlFor={this.id} class=\"bx--label\">\n {this.label}\n {this.required ? '*' : ''}\n </label>\n </unity-typography>\n {this.hidden ? (\n <input id={this.id} type=\"hidden\" value={this.internalValue} />\n ) : (\n <input\n id={this.id}\n type=\"text\"\n class={{ ...inputClass }}\n placeholder={this.placeholder}\n value={this.internalValue}\n required={this.required}\n disabled={this.disabled}\n readonly={this.readonly}\n maxLength={this.maxCharacter}\n inputMode={this.inputMode}\n onInput={this.onInput}\n onChange={this.onChange}\n //@ts-ignore\n udprecordid={'udpRecord-text-field-' + this.id}\n />\n )}\n {isError && (\n <div class=\"error-message\">\n <unity-typography variant=\"caption-text\" color=\"error\">{this.errorMessage}</unity-typography>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/p-BdWgc1UD.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-BdWgc1UD.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/forms/udp-forms/udp-forms-builder/udp-forms-builder-item/question_type_renderers/list-options-renderer.css?tag=list-options-renderer&encapsulation=shadow","src/components/my-component/UI/forms/udp-forms/udp-forms-builder/udp-forms-builder-item/question_type_renderers/list-options-renderer.tsx"],"sourcesContent":["/* Styles for list-options-renderer */\n\n:host {\n padding: 0;\n display: block;\n\n\n .question-item-options-list-container {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-04, 16px);\n padding: var(--spacing-04, 16px) 0;\n /* background-color: var(--primary-color-alpha-15); */\n }\n\n .question-item-options-item {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--spacing-04, 16px);\n padding: var(--spacing-03, 16px);\n width: 100%;\n border-radius: var(--border-radius);\n border: 1px solid var(--gray-03);\n box-sizing: border-box;\n box-shadow: var(--elevation-01);\n background-color: var(--card-background-color, #fff);\n margin: 0.3em 0;\n }\n\n .question-item-options-item-fields {\n display: flex;\n flex-direction: row;\n gap: var(--spacing-04, 16px);\n flex-grow: 1;\n }\n\n .list-options-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n}\n\n/* \n.question-item-options-list-container {\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-radius: var(--border-radius);\n gap: var(--spacing-03);\n}\n\n.question-item-options-list-single-item-container {\n}\n\n.question-item-options-text-field-list-item {\n display: flex;\n gap: var(--spacing-03);\n} */","import { Component, h, Prop, Host } from '@stencil/core';\nimport { UdpFormQuestion } from 'src/components/my-component/UI/forms/udp-forms/types'; // Using path that worked previously\n// We will need to import any components used like udp-icon, text-field, unity-typography etc.\n// This will require knowing their correct import paths or ensuring they are globally available.\nimport { getIconFromName } from '../../../../../data-display/icons/iconUtils';\n\n@Component({\n tag: 'list-options-renderer',\n styleUrl: 'list-options-renderer.css',\n shadow: true,\n})\nexport class ListOptionsRenderer {\n @Prop() question: UdpFormQuestion;\n @Prop() isViewOnly: boolean;\n @Prop() formSectionsDraft: any[][];\n @Prop() sIndex: number;\n @Prop() qIndex: number;\n @Prop() lookupOptions: any[];\n @Prop() onFormSectionsDraftChange: (updatedSections: any[][]) => void;\n @Prop() getHandler: (fieldTypeId: number, handlerName: string) => any;\n\n render() {\n return (\n <Host>\n <div class=\"question-item-options-list-container\">\n <stencil-toggle\n label=\"Use Lookup Options\"\n disabled={this.isViewOnly}\n checked={'lookupId' in this.question.fieldProperties}\n labelPosition=\"right\"\n onToggledChange={() => {\n const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyToggleManualOrLookupOptions');\n const updated = handler(this.formSectionsDraft, this.sIndex, this.qIndex);\n this.onFormSectionsDraftChange(updated);\n console.log(this.lookupOptions);\n }}\n ></stencil-toggle>\n\n {/* Display lookup components if question is configured for lookup */}\n {'lookupId' in this.question.fieldProperties && (\n <div>\n <udp-selector\n label=\"Lookup Source\"\n key=\"lookup-selector\"\n initialValue={this.question.fieldProperties?.lookupId || ''}\n options={this.lookupOptions}\n disabled={this.isViewOnly}\n required={true}\n onChange={(e: CustomEvent) => {\n const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyLookupChange');\n const updated = handler(e.detail, this.formSectionsDraft, this.sIndex, this.qIndex);\n this.onFormSectionsDraftChange(updated);\n }}\n ></udp-selector>\n </div>\n )}\n\n {/* Display lookup components if question is configured for manual options */}\n {'items' in this.question.fieldProperties && (\n <div>\n <div class=\"list-options-header\">\n <unity-typography variant=\"h6\">Configure Select Options</unity-typography>\n {!this.isViewOnly && 'items' in this.question.fieldProperties && (\n <udp-button\n variant=\"text\"\n onClick={() => {\n const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyAddListItem');\n const updated = handler(this.formSectionsDraft, this.sIndex, this.qIndex, '', '');\n this.onFormSectionsDraftChange(updated);\n }}\n startIcon={<udp-icon iconName={'add'} darkIcon={true} />}\n title=\"Add an Option\"\n >\n Add an Option\n </udp-button>\n )}\n </div>\n {this.question.fieldProperties?.items?.map((item, idx) => (\n <div key={idx} class=\"question-item-options-item\">\n {/* <unity-typography variant={'h4'}>Option {idx + 1}.</unity-typography> */}\n <div class=\"question-item-options-item-fields\">\n <text-field\n label=\"Display Text\"\n value={item.display}\n disabled={this.isViewOnly}\n placeholder=\"Display Text\"\n required={true}\n onInput={e => {\n const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyListItemChange');\n const updated = handler(e, this.formSectionsDraft, this.sIndex, this.qIndex, idx, 'display');\n this.onFormSectionsDraftChange(updated);\n }}\n ></text-field>\n\n <text-field\n label=\"Option Value\"\n value={item.value}\n disabled={this.isViewOnly}\n placeholder=\"Option Value\"\n required={true}\n onInput={e => {\n const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyListItemChange');\n const updated = handler(e, this.formSectionsDraft, this.sIndex, this.qIndex, idx, 'value');\n this.onFormSectionsDraftChange(updated);\n }}\n ></text-field>\n </div>\n {this.question.fieldProperties.items.length > 1 && !this.isViewOnly && (\n <stencil-icon-button\n icon={getIconFromName('trashCan')}\n onClick={() => {\n const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyRemoveListItem');\n const updated = handler(this.formSectionsDraft, this.sIndex, this.qIndex, idx);\n this.onFormSectionsDraftChange(updated);\n }}\n />\n )}\n </div>\n ))}\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/p-Bdt-oOnd.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-Bdt-oOnd.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/inputs/time-selector/udp-time-selector.css?tag=udp-time-selector&encapsulation=shadow","src/components/my-component/UI/inputs/time-selector/udp-time-selector.tsx"],"sourcesContent":["@import '../inputs.css';\n","import { Component, h, Host, State, Event, EventEmitter, Prop, Watch } from '@stencil/core';\nimport { InputSize, InputMargin } from '../input-types';\n\n/**\n * A standardized time input component with validation, min/max constraints, and precise time selection.\n * Supports both controlled and uncontrolled modes with proper event emission for integration\n * with form libraries and custom event handlers.\n *\n * **Time Handling:**\n * - Uses HTML5 `time` input for consistent browser behavior and native time picker\n * - Supports HH:mm format (24-hour time) as per HTML5 specification\n * - Provides min/max time constraints for validation\n *\n * @example\n * ```tsx\n * // Uncontrolled component with initial value\n * <udp-time-selector\n * label=\"Meeting Time\"\n * initialValue=\"14:30\"\n * onChange={(e) => console.log('Selected:', e.detail)}\n * />\n *\n * // Controlled component\n * <udp-time-selector\n * label=\"Appointment Time\"\n * value={appointmentTime}\n * onChange={(e) => setAppointmentTime(e.detail)}\n * />\n *\n * // With validation and constraints\n * <udp-time-selector\n * label=\"Business Hours\"\n * value={businessTime}\n * min=\"09:00\"\n * max=\"17:00\"\n * required={true}\n * error={timeError}\n * onChange={handleTimeChange}\n * />\n * ```\n */\n@Component({\n tag: 'udp-time-selector',\n styleUrl: 'udp-time-selector.css',\n shadow: true,\n})\nexport class UdpTimeSelector {\n /**\n * Unique identifier for the input element. Used for form association and accessibility.\n */\n @Prop() id: string;\n\n /**\n * Name attribute for the input element. Used for form submission.\n */\n @Prop() name: string;\n\n /**\n * Label text displayed above the input field. Used for accessibility and user guidance.\n */\n @Prop() label: string;\n\n /**\n * Minimum time value allowed. Uses HH:mm format (e.g., \"09:00\").\n * Enforces lower bounds validation for time selection.\n */\n @Prop() min: string;\n\n /**\n * Maximum time value allowed. Uses HH:mm format (e.g., \"17:00\").\n * Enforces upper bounds validation for time selection.\n */\n @Prop() max: string;\n\n /**\n * Whether the field is required for form submission. Adds visual indicator (*) and validation.\n */\n @Prop() required: boolean;\n\n /**\n * Error message to display below the input field. Shows validation errors or other issues.\n */\n @Prop() error: string;\n\n /**\n * Initial value for the time selector. Used for uncontrolled components to set the default value.\n * Uses HH:mm format (e.g., \"14:30\"). Only used when `value` prop is not provided.\n */\n @Prop() initialValue: string;\n\n /**\n * Current value of the time selector. When provided, makes this a controlled component.\n * Uses HH:mm format (e.g., \"14:30\"). The component will use this value and update it through events.\n */\n @Prop({ mutable: true }) value: string = '';\n\n /**\n * Whether the field is disabled. Users cannot interact with the field when disabled.\n */\n @Prop() disabled: boolean;\n\n /**\n * Whether the input is readonly.\n */\n @Prop() readonly: boolean = false;\n\n /**\n * Whether the input should take the full width of its container.\n */\n @Prop() fullWidth: boolean = false;\n\n /**\n * Size variant controlling the padding and spacing of the input.\n * - 'small': Compact spacing for data-heavy interfaces\n * - 'normal': Standard spacing (default)\n * - 'large': Generous spacing for accessibility\n */\n @Prop() size: InputSize = 'normal';\n\n /**\n * Margin variant for the input spacing.\n * - 'none': No margin\n * - 'dense': Minimal margin spacing\n * - 'normal': Standard margin spacing (default)\n */\n @Prop() margin: InputMargin = 'normal';\n\n @State() internalValue: string = ''; // Internal state for value management\n @State() errorMessage: string;\n\n /**\n * Emitted when the time value changes through user interaction or programmatic update.\n * Contains the new time value in HH:mm format.\n */\n @Event() change: EventEmitter<string>;\n\n /**\n * Emitted when the user types in the time input field.\n * Contains the current input value (may be incomplete during typing).\n */\n @Event() input: EventEmitter<string>;\n\n /**\n * Component lifecycle method called when the component is about to load.\n * Initializes the internal value from either the value prop or initialValue prop.\n */\n componentWillLoad() {\n // Initialize from controlled value or initial value\n this.internalValue = this.value || this.initialValue || '';\n this.errorMessage = this.error;\n }\n\n /**\n * Watcher for the error prop. Updates the internal error message when the error prop changes.\n */\n @Watch('error')\n updateError() {\n this.errorMessage = this.error;\n }\n\n /**\n * Watcher for the initialValue prop. Updates the internal value when initialValue changes\n * (useful for form resets, dynamic initial values, etc.).\n * @param newValue - The new initial value\n */\n @Watch('initialValue')\n initialValueChanged(newValue: string) {\n if (newValue !== undefined) {\n this.internalValue = newValue;\n }\n }\n\n /**\n * Watcher for the value prop. Updates the internal value when the value prop changes\n * (controlled component behavior).\n * @param newValue - The new controlled value\n */\n @Watch('value')\n valueChanged(newValue: string) {\n if (newValue !== undefined) {\n this.internalValue = newValue;\n }\n }\n\n /**\n * Handles the blur event on the time input. Standard focus events bubble naturally.\n */\n handleBlur() {\n // Standard focus events bubble naturally - no custom emission needed\n }\n\n /**\n * Handles the focus event on the time input. Standard focus events bubble naturally.\n */\n handleFocus() {\n // Standard focus events bubble naturally - no custom emission needed\n }\n\n /**\n * Handles changes to the time input value. Updates internal state and emits standard events.\n * @param event - The input event from the time input\n */\n handleTimeChange = (event: Event) => {\n const target = event.target as HTMLInputElement;\n const newValue = target.value;\n\n // Update internal value\n this.internalValue = newValue;\n\n // Update controlled value if this is a controlled component\n if (this.value !== undefined) {\n this.value = newValue;\n }\n\n // Emit standard events for integration with form libraries and custom handlers\n this.change.emit(newValue);\n this.input.emit(newValue);\n }\n\n render() {\n const isError: boolean = !!this.errorMessage;\n const classNames = ['bx--text-input'];\n if (isError) {\n classNames.push('bx--text-input--error');\n }\n if (this.disabled) {\n classNames.push('time-selector--disabled');\n }\n if (this.fullWidth) {\n classNames.push('bx--text-input--full-width');\n }\n const inputClass = classNames.join(' ');\n\n return (\n <Host\n class={{\n 'udp-input': true,\n 'udp-input--error': isError,\n 'udp-input--disabled': this.disabled,\n 'udp-input--readonly': this.readonly,\n 'udp-input--full-width': this.fullWidth,\n 'udp-input--required': this.required,\n [`udp-input--size-${this.size}`]: true,\n [`udp-input--margin-${this.margin}`]: true,\n }}\n aria-invalid={isError ? 'true' : 'false'}\n aria-required={this.required ? 'true' : 'false'}\n >\n <div class=\"bx--form-item\">\n <unity-typography variant=\"caption-text\">\n <label htmlFor={this.id} class=\"bx--label\">\n {this.label}\n {this.required ? '*' : ''}\n </label>\n </unity-typography>\n <input\n type=\"time\"\n id={this.id}\n name={this.name}\n class={inputClass}\n value={this.internalValue}\n min={this.min}\n max={this.max}\n onInput={this.handleTimeChange}\n onChange={this.handleTimeChange}\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n disabled={this.disabled}\n readonly={this.readonly}\n required={this.required}\n //@ts-ignore\n udprecordid={'udpRecord-udp-time-selector-' + this.id}\n />\n <unity-typography class=\"error-message\" variant=\"caption-text\" color=\"error\">\n {this.errorMessage}\n </unity-typography>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/p-Bv1MGbhE.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-Bv1MGbhE.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/inputs/file-upload/udp-drive-utils.ts","src/components/my-component/UI/inputs/signature-input/signature-input.css?tag=signature-input&encapsulation=shadow","src/components/my-component/UI/inputs/signature-input/signature-input.tsx"],"sourcesContent":["import { UdpDriveFile } from '../../../../../global/types';\nimport { ConfigService } from '../../../../../udp-utilities/api-config';\nimport axios from 'axios';\n\nexport function isUdpDriveFile(file: any): file is UdpDriveFile {\n return file && typeof file === 'object' && 'driveFileId' in file;\n}\n\nexport function getMimeTypeFromExtension(extension: string): string {\n // Use a static map for common types, fallback to browser's lookup if available\n const mimeTypes: Record<string, string> = {\n pdf: 'application/pdf',\n doc: 'application/msword',\n docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',\n xls: 'application/vnd.ms-excel',\n xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',\n ppt: 'application/vnd.ms-powerpoint',\n pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',\n txt: 'text/plain',\n csv: 'text/csv',\n json: 'application/json',\n xml: 'application/xml',\n html: 'text/html',\n css: 'text/css',\n js: 'application/javascript',\n png: 'image/png',\n jpg: 'image/jpeg',\n jpeg: 'image/jpeg',\n gif: 'image/gif',\n svg: 'image/svg+xml',\n zip: 'application/zip',\n rar: 'application/x-rar-compressed',\n '7z': 'application/x-7z-compressed'\n };\n\n const ext = extension.trim().toLowerCase();\n if (mimeTypes[ext]) return mimeTypes[ext];\n\n // Try browser lookup if available\n if (typeof window !== 'undefined' && window.navigator.mimeTypes) {\n // This is not reliable, but included for completeness\n // Most browsers do not expose a direct lookup\n }\n\n return 'application/octet-stream';\n}\n\nexport function createPlaceholderFileFromUdpDriveFile(udpFile: UdpDriveFile): File {\n const fileName = udpFile.name || `file.${udpFile.extension}`;\n const placeholderBlob = new Blob([''], { type: getMimeTypeFromExtension(udpFile.extension) });\n return new File([placeholderBlob], fileName, {\n type: placeholderBlob.type,\n lastModified: udpFile.lastUpdated ? new Date(udpFile.lastUpdated).getTime() : Date.now()\n });\n}\n\nexport async function downloadFileFromUdpDriveFile(udpFile: UdpDriveFile): Promise<File> {\n try {\n const downloadUrl = `${ConfigService.tenantV1ApiUrl}/UdpDrive/${udpFile.driveFileId}/stream`;\n const response = await axios({\n method: 'GET',\n url: downloadUrl,\n responseType: 'blob',\n timeout: 300000,\n headers: {}\n });\n const blob = response.data;\n const fileName = udpFile.name || `file.${udpFile.extension}`;\n return new File([blob], fileName, {\n type: blob.type || getMimeTypeFromExtension(udpFile.extension),\n lastModified: udpFile.lastUpdated ? new Date(udpFile.lastUpdated).getTime() : Date.now()\n });\n } catch (error) {\n console.error('Error creating file from UdpDriveFile:', error);\n const fileName = udpFile.name || `file.${udpFile.extension}`;\n return new File([''], fileName, { type: 'application/octet-stream' });\n }\n}\n","@import '../inputs.css';\n\n/* Size variants for canvas sizing */\n:host(.udp-input--size-small) .signature-canvas {\n height: 150px;\n}\n\n:host(.udp-input--size-normal) .signature-canvas {\n height: 200px;\n}\n\n:host(.udp-input--size-large) .signature-canvas {\n height: 250px;\n}\n\n/* Size variants for clear button */\n:host(.udp-input--size-small) .clear-button {\n padding: var(--spacing-01) var(--spacing-02);\n font-size: var(--caption-font-size, 0.875rem);\n top: var(--spacing-02);\n right: var(--spacing-02);\n}\n\n:host(.udp-input--size-normal) .clear-button {\n padding: var(--spacing-02) var(--spacing-03);\n font-size: var(--body-font-size);\n top: var(--spacing-02);\n right: var(--spacing-02);\n}\n\n:host(.udp-input--size-large) .clear-button {\n padding: var(--spacing-03) var(--spacing-04);\n font-size: var(--body-font-size);\n top: var(--spacing-03);\n right: var(--spacing-03);\n}\n\n.signature-pad-container {\n position: relative;\n border: 1px solid var(--udp-mid-gray-color);\n border-radius: 4px;\n background-color: var(--udp-light-gray-color);\n}\n\n.signature-canvas {\n display: block;\n width: 100%;\n height: 200px; /* Default height, overridden by density variants */\n}\n\n.signature-pad-container.readonly {\n background-color: var(--udp-disabled-gray-color);\n}\n\n.signature-canvas.readonly {\n cursor: not-allowed;\n}\n\n.clear-button {\n position: absolute;\n top: var(--spacing-02); /* Default, overridden by density variants */\n right: var(--spacing-02); /* Default, overridden by density variants */\n background-color: var(--udp-light-gray-color);\n border: 1px solid var(--udp-mid-gray-color);\n color: var(--udp-primary-color);\n cursor: pointer;\n border-radius: 4px;\n padding: var(--spacing-02) var(--spacing-03); /* Default, overridden by density variants */\n}\n\n.clear-button:hover {\n background-color: var(--udp-mid-gray-color);\n}\n\n.clear-button:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n","import { Component, Prop, h, State, Watch, Event, EventEmitter, Element, Host } from '@stencil/core';\nimport type SignaturePad from 'signature_pad';\nimport { UdpDriveFile } from '../../../../../global/types';\nimport { InputSize, InputMargin } from '../input-types';\nimport {\n isUdpDriveFile,\n downloadFileFromUdpDriveFile\n} from '../file-upload/udp-drive-utils';\n\n@Component({\n tag: 'signature-input',\n styleUrl: 'signature-input.css',\n shadow: true,\n})\nexport class SignatureInput {\n @Element() el: HTMLElement;\n\n /**\n * Label for the input field.\n */\n @Prop() label: string;\n\n /**\n * Unique identifier for the input.\n */\n @Prop() id: string;\n\n /**\n * Whether the field is required.\n */\n @Prop() required: boolean;\n\n /**\n * Whether the field is disabled.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Whether the field is read-only.\n */\n @Prop() readonly: boolean = false;\n\n /**\n * Error message to display.\n */\n @Prop() error: string;\n\n /**\n * Size variant for the signature input.\n * - 'small': Compact signature area\n * - 'normal': Standard signature area (default)\n * - 'large': Generous signature area\n */\n @Prop() size: InputSize = 'normal';\n\n /**\n * Margin variant for the input spacing.\n * - 'none': No margin\n * - 'dense': Minimal margin spacing\n * - 'normal': Standard margin spacing (default)\n */\n @Prop() margin: InputMargin = 'normal';\n\n /**\n * The current value of the signature, can be a File or UdpDriveFile.\n */\n @Prop({ mutable: true }) value: File | UdpDriveFile;\n\n /**\n * The initial value, used if `value` is not provided.\n */\n @Prop() initialValue: File | UdpDriveFile | string;\n\n /**\n * Emitted when the signature changes.\n */\n @Event() change: EventEmitter<File | null>;\n\n @State() private internalError: string;\n @State() private signaturePad: SignaturePad;\n\n private canvasEl: HTMLCanvasElement;\n private SignaturePadLib: typeof SignaturePad;\n\n private lastCanvasRect: DOMRect;\n private resizeTimeout: any;\n\n @Watch('error')\n onErrorChange(newValue: string) {\n this.internalError = newValue;\n }\n\n @Watch('value')\n async onValueChange(newValue: File | UdpDriveFile) {\n await this.loadSignaturePad();\n if (this.signaturePad) {\n this.signaturePad.clear();\n if (newValue) {\n this.loadSignature(newValue);\n }\n }\n }\n\n @Watch('initialValue')\n async onInitialValueChange(newValue: File | UdpDriveFile | string) {\n let file = newValue;\n if (file) {\n if(Array.isArray(file)) {\n file = file[0]; // Handle case where initialValue is an array\n }\n if (isUdpDriveFile(file)) {\n try {\n const loadedFile = await downloadFileFromUdpDriveFile(file as UdpDriveFile);\n this.value = loadedFile;\n this.readonly = false;\n } catch (err) {\n console.error('Failed to fetch UdpDriveFile for signature:', err);\n return;\n }\n } else if (typeof newValue === 'string') {\n this.value = await this.urlToFile(newValue as string, 'initial_signature.png');\n } else {\n this.value = newValue;\n }\n this.resizeCanvasForDPR();\n this.initializeSignaturePad();\n }\n }\n\n async componentWillLoad() {\n this.internalError = this.error;\n await this.loadSignaturePad();\n }\n\n async componentDidLoad() {\n let file = this.initialValue;\n if (file) {\n if(Array.isArray(file)) {\n file = file[0]; // Handle case where initialValue is an array\n }\n if (isUdpDriveFile(this.initialValue)) {\n // Try to fetch the file from UdpDriveFile\n console.log('Loading signature from UdpDriveFile:', this.initialValue);\n try {\n const file = await downloadFileFromUdpDriveFile(this.initialValue as UdpDriveFile);\n this.value = file;\n this.readonly = false; // Try editable first\n } catch (err) {\n console.error('Failed to fetch UdpDriveFile for signature:', err);\n this.value = this.initialValue;\n this.readonly = true; // Fallback to readonly if not editable\n }\n } else {\n this.value = await this.urlToFile(this.initialValue as string, 'initial_signature.png');\n }\n }\n this.resizeCanvasForDPR();\n this.initializeSignaturePad();\n this.lastCanvasRect = this.canvasEl.getBoundingClientRect();\n window.addEventListener('resize', this.handleResize);\n }\n\n disconnectedCallback() {\n window.removeEventListener('resize', this.handleResize);\n if (this.resizeTimeout) clearTimeout(this.resizeTimeout);\n }\n\n private handleResize = () => {\n if (this.resizeTimeout) clearTimeout(this.resizeTimeout);\n this.resizeTimeout = setTimeout(() => {\n const rect = this.canvasEl.getBoundingClientRect();\n if (!this.lastCanvasRect || rect.width !== this.lastCanvasRect.width || rect.height !== this.lastCanvasRect.height) {\n // Save current signature as dataURL\n let dataURL = this.signaturePad && !this.signaturePad.isEmpty() ? this.signaturePad.toDataURL() : null;\n this.resizeCanvasForDPR();\n this.initializeSignaturePad();\n this.lastCanvasRect = rect;\n // Restore signature if it existed\n if (dataURL && this.signaturePad) {\n this.signaturePad.fromDataURL(dataURL);\n }\n }\n }, 200);\n }\n\n private resizeCanvasForDPR() {\n if (!this.canvasEl) return;\n const ratio = window.devicePixelRatio || 1;\n // Get the CSS size\n const rect = this.canvasEl.getBoundingClientRect();\n this.canvasEl.width = rect.width * ratio;\n this.canvasEl.height = rect.height * ratio;\n this.canvasEl.getContext('2d').scale(ratio, ratio);\n }\n\n private async loadSignaturePad() {\n if (!this.SignaturePadLib) {\n try {\n const module = await import('signature_pad');\n this.SignaturePadLib = module.default;\n } catch (e) {\n console.error('Failed to load signature_pad library', e);\n }\n }\n }\n\n private initializeSignaturePad() {\n this.resizeCanvasForDPR();\n if (this.SignaturePadLib && this.canvasEl) {\n this.signaturePad = new this.SignaturePadLib(this.canvasEl);\n this.signaturePad.addEventListener(\"endStroke\", this.handleSignatureEnd);\n this.handleStateChange();\n if (this.value) {\n this.loadSignature(this.value);\n }\n }\n }\n\n @Watch('disabled')\n @Watch('readonly')\n handleStateChange() {\n if (this.signaturePad) {\n if (this.disabled || this.readonly) {\n this.signaturePad.off();\n } else {\n this.signaturePad.on();\n }\n }\n }\n\n private handleSignatureEnd = async () => {\n if (this.signaturePad.isEmpty()) {\n this.value = null;\n this.change.emit(null);\n } else {\n const dataURL = this.signaturePad.toDataURL();\n const signatureFile = await this.urlToFile(dataURL, 'signature.png');\n this.value = signatureFile;\n this.change.emit(signatureFile);\n }\n };\n\n private async loadSignature(signatureValue: File | UdpDriveFile | string) {\n let imageUrl: string;\n if (typeof signatureValue === 'string') {\n imageUrl = signatureValue;\n } else if (isUdpDriveFile(signatureValue)) {\n try {\n const file = await downloadFileFromUdpDriveFile(signatureValue as UdpDriveFile);\n imageUrl = URL.createObjectURL(file);\n } catch (error) {\n console.error('Error loading signature image from UdpDriveFile:', error);\n return;\n }\n } else if (signatureValue instanceof File) {\n imageUrl = URL.createObjectURL(signatureValue);\n }\n\n if (imageUrl && this.signaturePad) {\n this.signaturePad.fromDataURL(imageUrl, {\n ratio: window.devicePixelRatio,\n width: this.canvasEl.width,\n height: this.canvasEl.height,\n });\n }\n }\n\n private async urlToFile(url: string, filename: string): Promise<File> {\n const res = await fetch(url);\n const blob = await res.blob();\n return new File([blob], filename, { type: blob.type });\n }\n\n private clearSignature = () => {\n if (this.signaturePad) {\n this.signaturePad.clear();\n this.handleSignatureEnd(); // to emit the change\n }\n };\n\n render() {\n const isError = !!this.internalError;\n const containerClasses = {\n 'signature-pad-container': true,\n 'readonly': this.readonly,\n 'disabled': this.disabled,\n };\n\n return (\n <Host\n class={{\n 'udp-input': true,\n 'udp-input--error': isError,\n 'udp-input--disabled': this.disabled,\n 'udp-input--required': this.required,\n 'udp-input--readonly': this.readonly,\n [`udp-input--size-${this.size}`]: true,\n [`udp-input--margin-${this.margin}`]: true,\n }}\n >\n <div class=\"bx--form-item\">\n {this.label && (\n <unity-typography variant=\"caption-text\">\n <label htmlFor={this.id} class=\"bx--label\">\n {this.label}\n {this.required && '*'}\n </label>\n </unity-typography>\n )}\n <div class={containerClasses}>\n <canvas\n ref={el => (this.canvasEl = el as HTMLCanvasElement)}\n class={{ 'signature-canvas': true, 'readonly': this.readonly || this.disabled }}\n id={this.id}\n ></canvas>\n {!this.readonly && !this.disabled && (\n <button\n type=\"button\"\n class=\"clear-button\"\n onClick={this.clearSignature}\n disabled={this.disabled}\n >\n Clear\n </button>\n )}\n </div>\n {isError && (\n <div class=\"error-message\">\n <unity-typography variant=\"caption-text\" color=\"error\">{this.internalError}</unity-typography>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/p-C8cWVxBF.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-C8cWVxBF.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/forms/form/stencil-form.tsx"],"sourcesContent":["import { Component, h, Prop, Event as StencilEvent, EventEmitter, State, Element, Method } from '@stencil/core';\nimport { createForm, FormApi } from 'final-form';\nimport debounce from 'lodash.debounce';\n\n@Component({\n tag: 'stencil-form',\n shadow: true,\n})\nexport class StencilForm {\n @Element() el: HTMLElement;\n @Prop() handleSubmit: (values: Object) => void;\n @Prop() initialValues: Object;\n @Prop() validate: (values: Object, errors: Object) => Object;\n @Prop() validateOnBlur: boolean = true;\n @Prop() handleFormChange: (values: Object) => void;\n @StencilEvent() stencilFormInvalidEvent: EventEmitter<Object>;\n\n @State() api: FormApi;\n @State() registeredFields: { [key: string]: { required: boolean } } = {};\n\n constructor() {\n this.submitWithValidation = this.submitWithValidation.bind(this);\n this.defaultValidation = this.defaultValidation.bind(this);\n this.submit = this.submit.bind(this);\n this.onFormChange = this.onFormChange.bind(this);\n }\n\n /**\n * Connects a field to the form API.\n */\n private connectField(field: HTMLStencilFieldElement) {\n field.setFormApi({\n api: this.api,\n registeredFields: this.registeredFields,\n });\n }\n\n /**\n * Asynchronously and recursively traverses a node and all of its light DOM\n * and shadow DOM descendants, connecting any stencil-fields it finds.\n */\n private async processNodeRecursively(node: Node) {\n // 1. Skip anything that isn't an element\n if (node.nodeType !== Node.ELEMENT_NODE) {\n return;\n }\n const element = node as Element;\n\n // 2. If the element is a custom component, wait for it to be defined.\n // This ensures its shadowRoot is available if it has one.\n if (element.localName.includes('-')) {\n await customElements.whenDefined(element.localName);\n }\n\n // 3. Process the element itself\n if (element.matches('stencil-field')) {\n this.connectField(element as HTMLStencilFieldElement);\n }\n\n // 4. Connect submit buttons\n this.connectSubmitButtons(element);\n\n // 5. If the element has a shadowRoot, recursively process its children\n if (element.shadowRoot) {\n for (const child of Array.from(element.shadowRoot.childNodes)) {\n await this.processNodeRecursively(child);\n }\n }\n\n // 6. Recursively process all light DOM children\n for (const child of Array.from(element.childNodes)) {\n await this.processNodeRecursively(child);\n }\n }\n\n /**\n * The event handler for slot changes. It kicks off the recursive processing.\n */\n private handleSlotChange = () => {\n const slot = this.el.shadowRoot.querySelector('slot');\n if (!slot) return;\n\n // Process every node assigned to the slot\n slot.assignedNodes().forEach(node => this.processNodeRecursively(node));\n };\n\n /**\n * Connect submit buttons in slotted content to this form\n */\n private connectSubmitButtons(node: Node) {\n if (node.nodeType !== Node.ELEMENT_NODE) {\n return;\n }\n const element = node as Element;\n\n // Check if the element itself is a submit button\n if (element.matches('input[type=\"submit\"], button[type=\"submit\"]')) {\n const htmlElement = element as HTMLElement;\n // Avoid duplicate event listeners\n if (!htmlElement.dataset.stencilFormConnected) {\n htmlElement.dataset.stencilFormConnected = 'true';\n element.addEventListener('click', (e) => {\n e.preventDefault();\n console.log('Submit button clicked, triggering form submit');\n this.submit(e);\n });\n }\n }\n\n // Find submit buttons in descendants and connect them\n const submitButtons = element.querySelectorAll('input[type=\"submit\"], button[type=\"submit\"]');\n submitButtons.forEach((button: Element) => {\n const htmlButton = button as HTMLElement;\n // Avoid duplicate event listeners\n if (!htmlButton.dataset.stencilFormConnected) {\n htmlButton.dataset.stencilFormConnected = 'true';\n button.addEventListener('click', (e) => {\n e.preventDefault();\n console.log('Submit button clicked, triggering form submit');\n this.submit(e);\n });\n }\n });\n }\n\n componentWillLoad() {\n this.api = createForm({\n onSubmit: this.submitWithValidation,\n initialValues: this.initialValues,\n validate: this.defaultValidation,\n validateOnBlur: this.validateOnBlur,\n });\n\n if (this.handleFormChange) {\n this.api.subscribe(this.onFormChange, { values: true });\n }\n }\n\n componentDidLoad() {\n const slot = this.el.shadowRoot.querySelector('slot');\n if (slot) {\n this.handleSlotChange(); // Run once for initial content\n slot.addEventListener('slotchange', this.handleSlotChange);\n }\n }\n\n disconnectedCallback() {\n this.api = null;\n this.registeredFields = {};\n\n const slot = this.el.shadowRoot?.querySelector('slot');\n if (slot) {\n slot.removeEventListener('slotchange', this.handleSlotChange);\n }\n }\n\n onFormChange(formState: any): void {\n if (this.handleFormChange && formState.values) {\n this.handleFormChange(formState.values);\n }\n }\n\n async submitWithValidation(values: { [key: string]: any }): Promise<void> {\n console.log('Submitting form with values:', values);\n const errors = this.defaultValidation(values);\n if (Object.keys(errors).length === 0) {\n this.handleSubmit(values);\n } else {\n this.stencilFormInvalidEvent.emit(errors);\n }\n }\n\n defaultValidation(values: Object): Object {\n const { registeredFields } = this;\n const errors = {};\n console.log(registeredFields);\n\n Object.keys(registeredFields).forEach(field => {\n if (registeredFields[field].required && (!values[field] || values[field]?.length === 0)) {\n errors[field] = 'Required';\n }\n });\n if (this?.validate) return this.validate?.(values, errors);\n\n return errors;\n }\n\n getValues() {\n const values = {};\n this.api.getRegisteredFields().forEach((fieldName: string) => {\n values[fieldName] = this.api.getFieldState(fieldName).value;\n });\n return values;\n }\n @Method()\n async getApi(): Promise<FormApi> {\n if (!this.api) {\n console.error('❌ Form API not initialized yet.');\n return null;\n }\n return this.api;\n }\n submit(e) {\n console.log('Submitting form');\n e?.preventDefault?.();\n const submitFunction = () => {\n const errors = this.defaultValidation(this.getValues());\n if (Object.keys(errors).length) {\n this.stencilFormInvalidEvent.emit(errors);\n return;\n }\n this.api?.submit();\n };\n debounce(submitFunction, 1000, { leading: true, trailing: false })();\n }\n\n render() {\n return (\n <form onSubmit={this.submit}>\n <slot />\n </form>\n );\n }\n}\n"],"version":3}

package/dist/components/p-C9cEH65u.js DELETED Viewed

@@ -1,307 +0,0 @@
-import { p as proxyCustomElement, H, h } from './p-DPon6DDX.js';
-import { U as UdpFormsFieldTypeEnum, f as fontOverrideMapping, o as overrideFont, d as defineCustomElement$4 } from './p-PqypuW_Q.js';
-import { d as defineCustomElement$m } from './p-DpLtIIwx.js';
-import { d as defineCustomElement$l } from './p-B3-pcvgV.js';
-import { d as defineCustomElement$k } from './p-BvSuY3tY.js';
-import { d as defineCustomElement$j } from './p-BU3lEg0a.js';
-import { d as defineCustomElement$i } from './p-Bv1MGbhE.js';
-import { d as defineCustomElement$h } from './p-CA-v1fbV.js';
-import { d as defineCustomElement$g } from './p-C8cWVxBF.js';
-import { d as defineCustomElement$f } from './p-hRee3qYx.js';
-import { d as defineCustomElement$e } from './p-CNC3rtXm.js';
-import { d as defineCustomElement$d } from './p-CRiQA7Cy.js';
-import { d as defineCustomElement$c } from './p-BYsLvu6g.js';
-import { d as defineCustomElement$b } from './p-BGjVmQGN.js';
-import { d as defineCustomElement$a } from './p-DeS7YSzc.js';
-import { d as defineCustomElement$9 } from './p-ZeWoGdjP.js';
-import { d as defineCustomElement$8 } from './p-C-wDzVCk.js';
-import { d as defineCustomElement$7 } from './p-CDnOrzs3.js';
-import { d as defineCustomElement$6 } from './p-DzaN4l_Y.js';
-import { d as defineCustomElement$5 } from './p-DMcaGgHq.js';
-import { d as defineCustomElement$3 } from './p-BTIWOttf.js';
-import { d as defineCustomElement$2 } from './p-Bdt-oOnd.js';
-import { d as defineCustomElement$1 } from './p-DkppmXNM.js';
-const udpFormsRendererCss = ".background{background-color:var(--gray-01)}.item{padding-bottom:var(--spacing-02);}.items{display:flex;flex-direction:column;gap:var(--spacing-05);padding-top:var(--spacing-02);padding-bottom:var(--spacing-02)}.footer{display:flex;flex-direction:row-reverse}.submit{background-color:var(--primary-color);box-sizing:border-box;border:none;color:white;padding:8px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:background-color 0.3s ease;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-width:48px;min-height:24px;}.submit:disabled{background-color:var(--gray-05);cursor:default}.submit-card{display:flex;flex-direction:row;justify-content:space-between}.form-content{margin-bottom:var(--spacing-05);background-color:white;padding:16px;display:flex;flex-direction:column;gap:var(--spacing-05)}.form-container{padding-top:var(--spacing-05);padding-bottom:var(--spacing-05)}.center-div{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.finish-button{display:flex;flex-direction:column;justify-content:center}.header{background-color:var(--secondary-color);padding:var(--spacing-05) var(--spacing-05);color:var(--primary-color-contrast, #fff)}.auto-save-status{margin-top:var(--spacing-02);padding:var(--spacing-01) 0;font-size:12px;opacity:0.8}";
-// Helper function to determine if a value is empty, considering various types.
-const isEmpty = (value) => {
-    if (value === null || value === undefined)
-        return true;
-    if (typeof value === 'string' && value.trim() === '')
-        return true;
-    if (Array.isArray(value) && value.length === 0)
-        return true;
-    if (typeof value === 'object' && value !== null && !Array.isArray(value)) {
-        // A UdpDriveFile object is considered not empty.
-        if (value.driveId && value.fileId) {
-            return false;
-        }
-        // A File object from a file input or signature pad
-        if (value instanceof File) {
-            return value.size === 0;
-        }
-        // A plain object with no keys is empty
-        return Object.keys(value).length === 0;
-    }
-    return false;
-};
-const UdpFormsUi = /*@__PURE__*/ proxyCustomElement(class UdpFormsUi extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.initialValues = {};
-        this.submitSuccessful = false;
-        this.loading = false;
-        this.isSaving = false;
-        this.saveError = null;
-        this.showAutoSaveStatus = false;
-        this.disabled = false;
-        this.readonly = false;
-        this.titleId = 'udp-forms-title';
-        this.descriptionId = 'udp-forms-description';
-        this.validate = (values) => {
-            var _a;
-            console.log('Validation called with values:', values);
-            const errors = {};
-            // Validate required fields
-            for (const question of ((_a = this.form) === null || _a === void 0 ? void 0 : _a.formQuestions) || []) {
-                if (question.required && question.fieldTypeId !== UdpFormsFieldTypeEnum.Tally) {
-                    const value = values[question.name];
-                    if (isEmpty(value)) {
-                        errors[question.name] = 'This field is required';
-                        console.log(`Validation error for ${question.name}: required field is empty`);
-                    }
-                }
-            }
-            console.log('Validation errors:', errors);
-            return errors;
-        };
-        this.handleSubmit = async (values) => {
-            console.log('Form submit handler called with values:', values);
-            try {
-                if (this.onSubmit) {
-                    console.log('Calling onSubmit prop...');
-                    await this.onSubmit(values);
-                    console.log('onSubmit completed successfully');
-                }
-                else {
-                    console.error('onSubmit prop is not defined!');
-                }
-            }
-            catch (error) {
-                console.error('Error in onSubmit:', error);
-            }
-        };
-        this.handleFormInvalid = (errors) => {
-            console.log('Form validation failed with errors:', errors);
-        };
-    }
-    componentDidLoad() {
-        this.overrideStyles();
-    }
-    componentDidUpdate() {
-        this.overrideStyles();
-    }
-    overrideStyles() {
-        var _a;
-        const shadowRoot = (_a = this.el) === null || _a === void 0 ? void 0 : _a.shadowRoot;
-        shadowRoot === null || shadowRoot === void 0 ? void 0 : shadowRoot.querySelectorAll('unity-typography').forEach(element => {
-            var _a, _b, _c, _d;
-            const styleOverride = element.id === this.titleId ? (_b = (_a = this.form) === null || _a === void 0 ? void 0 : _a.styleOverrides) === null || _b === void 0 ? void 0 : _b.titleText :
-                element.id === this.descriptionId ? (_d = (_c = this.form) === null || _c === void 0 ? void 0 : _c.styleOverrides) === null || _d === void 0 ? void 0 : _d.paragraphText :
-                    {};
-            if ((styleOverride === null || styleOverride === void 0 ? void 0 : styleOverride.fontFamily) && fontOverrideMapping[styleOverride.fontFamily]) {
-                overrideFont(element, fontOverrideMapping[styleOverride.fontFamily]);
-            }
-            if (styleOverride === null || styleOverride === void 0 ? void 0 : styleOverride.variant) {
-                element.setAttribute('variant', styleOverride.variant);
-            }
-        });
-    }
-    render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-        if (!this.form) {
-            return h("div", null, "Loading...");
-        }
-        let questionNumber = 1;
-        const sectionSet = new Set();
-        this.form.formQuestions.forEach(fq => sectionSet.add(fq.section));
-        const orderedSectionNumbers = [...sectionSet].sort((a, b) => a - b);
-        const hiddenQuestionTypes = [UdpFormsFieldTypeEnum.Hidden, UdpFormsFieldTypeEnum.Paragraph];
-        const backgroundOverrides = {};
-        if ((_c = (_b = (_a = this.form) === null || _a === void 0 ? void 0 : _a.styleOverrides) === null || _b === void 0 ? void 0 : _b.background) === null || _c === void 0 ? void 0 : _c.backgroundImage) ;
-        else if ((_f = (_e = (_d = this.form) === null || _d === void 0 ? void 0 : _d.styleOverrides) === null || _e === void 0 ? void 0 : _e.background) === null || _f === void 0 ? void 0 : _f.backgroundColor) {
-            backgroundOverrides.backgroundColor = (_j = (_h = (_g = this.form) === null || _g === void 0 ? void 0 : _g.styleOverrides) === null || _h === void 0 ? void 0 : _h.background) === null || _j === void 0 ? void 0 : _j.backgroundColor;
-        }
-        return (h("div", { class: 'background', style: backgroundOverrides }, h("udp-container", { maxWidth: "md" }, h("div", { class: "form-container" }, !this.submitSuccessful ? (h("stencil-form", { handleSubmit: this.handleSubmit, initialValues: this.initialValues, validate: this.validate, handleFormChange: this.onChange, onStencilFormInvalidEvent: this.handleFormInvalid }, orderedSectionNumbers.map((sectionNumber, i) => {
-            var _a, _b, _c, _d, _e, _f, _g, _h;
-            return (h("div", null, sectionNumber === orderedSectionNumbers[0] && (
-            // @ts-ignore
-            h("div", { class: "header", style: ((_b = (_a = this.form) === null || _a === void 0 ? void 0 : _a.styleOverrides) === null || _b === void 0 ? void 0 : _b.headerBackgroundColor) ? { backgroundColor: (_d = (_c = this.form) === null || _c === void 0 ? void 0 : _c.styleOverrides) === null || _d === void 0 ? void 0 : _d.headerBackgroundColor } : '' }, h("unity-typography", { id: this.titleId, variant: 'h6', color: "inherit" }, this.form.name), h("unity-typography", { id: this.descriptionId, variant: (_h = (_g = (_f = (_e = this.form) === null || _e === void 0 ? void 0 : _e.styleOverrides) === null || _f === void 0 ? void 0 : _f.paragraphText) === null || _g === void 0 ? void 0 : _g.variant) !== null && _h !== void 0 ? _h : 'body', color: "inherit" }, this.form.description), this.showAutoSaveStatus && (h("div", { class: "auto-save-status" }, this.saveError && (h("unity-typography", { variant: "body", color: "secondary" }, this.saveError)))))), h("div", { class: "form-content" }, h("div", { class: "items" }, this.form.formQuestions
-                .filter(fq => fq.section === sectionNumber)
-                .sort((a, b) => a.questionOrder - b.questionOrder)
-                .map((question) => {
-                var _a, _b, _c;
-                const isHidden = hiddenQuestionTypes.includes(question.fieldTypeId);
-                const num = questionNumber;
-                if (!isHidden)
-                    questionNumber++;
-                return (h("div", { class: "item" }, h("udp-question", { styleOverrides: {
-                        helperText: (_a = this.form.styleOverrides) === null || _a === void 0 ? void 0 : _a.helperText,
-                        paragraphText: (_b = this.form.styleOverrides) === null || _b === void 0 ? void 0 : _b.paragraphText,
-                        questionText: (_c = this.form.styleOverrides) === null || _c === void 0 ? void 0 : _c.questionText,
-                    }, question: question, questionNumber: num, value: this.initialValues[question.name], disabled: this.disabled, readonly: this.readonly })));
-            })), i === orderedSectionNumbers.length - 1 && (h("div", { class: "footer" }, h("input", { disabled: this.loading || this.disabled || this.readonly, type: "submit", value: "Submit", class: "submit", id: "udpRecord-udp-forms-renderer-Submit", onClick: () => {
-                    console.log('Submit button clicked');
-                    // Let the form handle the submit naturally
-                } }))))));
-        }))) : (
-        //if the form has been submit, display success message with a button to trigger the action associated to the form
-        h("div", { class: "center-div" }, h("udp-ambient-card", null, h("div", { class: "submit-card" }, h("unity-typography", null, "Thank you for your submission!"), h("div", { class: "finish-button" }, h("custom-button", { onClick: this.onFinish }, "Finish"))))))))));
-    }
-    static get style() { return udpFormsRendererCss; }
-}, [1, "udp-forms-ui", {
-        "form": [16],
-        "initialValues": [16, "initial-values"],
-        "submitSuccessful": [4, "submit-successful"],
-        "loading": [4],
-        "isSaving": [4, "is-saving"],
-        "saveError": [1, "save-error"],
-        "showAutoSaveStatus": [4, "show-auto-save-status"],
-        "disabled": [4],
-        "readonly": [4],
-        "onSubmit": [16, "on-submit"],
-        "onChange": [16, "on-change"],
-        "onAction": [16, "on-action"],
-        "onFinish": [16, "on-finish"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["udp-forms-ui", "custom-button", "file-upload", "numeric-field", "selectable-list", "signature-input", "stencil-field", "stencil-form", "stencil-icon-button", "tally-display", "text-area", "text-field", "udp-adornment", "udp-ambient-card", "udp-ambient-tool-tip", "udp-badge", "udp-container", "udp-date-selector", "udp-datetime-selector", "udp-question", "udp-selector", "udp-time-selector", "unity-typography"];
-    components.forEach(tagName => { switch (tagName) {
-        case "udp-forms-ui":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, UdpFormsUi);
-            }
-            break;
-        case "custom-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$m();
-            }
-            break;
-        case "file-upload":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$l();
-            }
-            break;
-        case "numeric-field":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$k();
-            }
-            break;
-        case "selectable-list":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$j();
-            }
-            break;
-        case "signature-input":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$i();
-            }
-            break;
-        case "stencil-field":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$h();
-            }
-            break;
-        case "stencil-form":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$g();
-            }
-            break;
-        case "stencil-icon-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$f();
-            }
-            break;
-        case "tally-display":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$e();
-            }
-            break;
-        case "text-area":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$d();
-            }
-            break;
-        case "text-field":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$c();
-            }
-            break;
-        case "udp-adornment":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$b();
-            }
-            break;
-        case "udp-ambient-card":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$a();
-            }
-            break;
-        case "udp-ambient-tool-tip":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$9();
-            }
-            break;
-        case "udp-badge":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "udp-container":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "udp-date-selector":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "udp-datetime-selector":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "udp-question":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "udp-selector":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "udp-time-selector":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "unity-typography":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-export { UdpFormsUi as U, defineCustomElement as d };
-//# sourceMappingURL=p-C9cEH65u.js.map
-//# sourceMappingURL=p-C9cEH65u.js.map

package/dist/components/p-C9cEH65u.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-C9cEH65u.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,MAAM,mBAAmB,GAAG,kyCAAkyC;;ACK9zC;AACA,MAAM,OAAO,GAAG,CAAC,KAAU,KAAa;AACtC,IAAA,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,SAAS;AAAE,QAAA,OAAO,IAAI;IACtD,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE;AAAE,QAAA,OAAO,IAAI;IACjE,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;AAAE,QAAA,OAAO,IAAI;AAC3D,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;;QAExE,IAAI,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,MAAM,EAAE;AACjC,YAAA,OAAO,KAAK;;;AAGd,QAAA,IAAI,KAAK,YAAY,IAAI,EAAE;AACzB,YAAA,OAAO,KAAK,CAAC,IAAI,KAAK,CAAC;;;QAGzB,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC;;AAExC,IAAA,OAAO,KAAK;AACd,CAAC;MAOY,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;AALvB,IAAA,WAAA,GAAA;;;;AAOU,QAAA,IAAa,CAAA,aAAA,GAA4B,EAAE;AAC3C,QAAA,IAAgB,CAAA,gBAAA,GAAY,KAAK;AACjC,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;AACxB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AACzB,QAAA,IAAS,CAAA,SAAA,GAAkB,IAAI;AAC/B,QAAA,IAAkB,CAAA,kBAAA,GAAY,KAAK;AACnC,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AACzB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAMzB,QAAA,IAAO,CAAA,OAAA,GAAW,iBAAiB;AACnC,QAAA,IAAa,CAAA,aAAA,GAAW,uBAAuB;AA2B/C,QAAA,IAAA,CAAA,QAAQ,GAAG,CAAC,MAAc,KAAI;;AACpC,YAAA,OAAO,CAAC,GAAG,CAAC,gCAAgC,EAAE,MAAM,CAAC;YACrD,MAAM,MAAM,GAAG,EAAE;;AAEjB,YAAA,KAAK,MAAM,QAAQ,IAAI,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,KAAI,EAAE,EAAE;AACrD,gBAAA,IAAI,QAAQ,CAAC,QAAQ,IAAI,QAAQ,CAAC,WAAW,KAAK,qBAAqB,CAAC,KAAK,EAAE;oBAC7E,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC;AACnC,oBAAA,IAAI,OAAO,CAAC,KAAK,CAAC,EAAE;AAClB,wBAAA,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,wBAAwB;wBAChD,OAAO,CAAC,GAAG,CAAC,CAAA,qBAAA,EAAwB,QAAQ,CAAC,IAAI,CAA2B,yBAAA,CAAA,CAAC;;;;AAInF,YAAA,OAAO,CAAC,GAAG,CAAC,oBAAoB,EAAE,MAAM,CAAC;AACzC,YAAA,OAAO,MAAM;AACf,SAAC;AAEO,QAAA,IAAA,CAAA,YAAY,GAAG,OAAO,MAAW,KAAI;AAC3C,YAAA,OAAO,CAAC,GAAG,CAAC,yCAAyC,EAAE,MAAM,CAAC;AAC9D,YAAA,IAAI;AACF,gBAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,oBAAA,OAAO,CAAC,GAAG,CAAC,0BAA0B,CAAC;AACvC,oBAAA,MAAM,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;AAC3B,oBAAA,OAAO,CAAC,GAAG,CAAC,iCAAiC,CAAC;;qBACzC;AACL,oBAAA,OAAO,CAAC,KAAK,CAAC,+BAA+B,CAAC;;;YAEhD,OAAO,KAAK,EAAE;AACd,gBAAA,OAAO,CAAC,KAAK,CAAC,oBAAoB,EAAE,KAAK,CAAC;;AAE9C,SAAC;AAEO,QAAA,IAAA,CAAA,iBAAiB,GAAG,CAAC,MAAW,KAAI;AAC1C,YAAA,OAAO,CAAC,GAAG,CAAC,qCAAqC,EAAE,MAAM,CAAC;AAC5D,SAAC;AAqIF;IAhMC,gBAAgB,GAAA;QACd,IAAI,CAAC,cAAc,EAAE;;IAGvB,kBAAkB,GAAA;QAChB,IAAI,CAAC,cAAc,EAAE;;IAGvB,cAAc,GAAA;;QACZ,MAAM,UAAU,GAAG,CAAC,EAAA,GAAA,IAAY,CAAC,EAAE,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,UAAU;QAC/C,UAAU,KAAV,IAAA,IAAA,UAAU,KAAV,MAAA,GAAA,MAAA,GAAA,UAAU,CAAE,gBAAgB,CAAC,kBAAkB,CAAE,CAAA,OAAO,CAAC,OAAO,IAAG;;AACjE,YAAA,MAAM,aAAa,GACjB,OAAO,CAAC,EAAE,KAAK,IAAI,CAAC,OAAO,GAAG,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,0CAAE,cAAc,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS;gBAClE,OAAO,CAAC,EAAE,KAAK,IAAI,CAAC,aAAa,GAAG,MAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,cAAc,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa;AAC3E,oBAAA,EAAU;AAEb,YAAA,IAAI,CAAA,aAAa,KAAA,IAAA,IAAb,aAAa,KAAA,MAAA,GAAA,MAAA,GAAb,aAAa,CAAE,UAAU,KAAI,mBAAmB,CAAC,aAAa,CAAC,UAAU,CAAC,EAAE;gBAC9E,YAAY,CAAC,OAAO,EAAE,mBAAmB,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;;YAEtE,IAAI,aAAa,aAAb,aAAa,KAAA,MAAA,GAAA,MAAA,GAAb,aAAa,CAAE,OAAO,EAAE;gBAC1B,OAAO,CAAC,YAAY,CAAC,SAAS,EAAE,aAAa,CAAC,OAAO,CAAC;;AAE1D,SAAC,CAAC;;IAuCJ,MAAM,GAAA;;AACJ,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd,OAAO,4BAAqB;;QAG9B,IAAI,cAAc,GAAG,CAAC;AAEtB,QAAA,MAAM,UAAU,GAAG,IAAI,GAAG,EAAE;QAC5B,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,IAAI,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;QACjE,MAAM,qBAAqB,GAAG,CAAC,GAAG,UAAU,CAAC,CAAC,IAAI,CAAC,CAAC,CAAS,EAAE,CAAS,KAAK,CAAC,GAAG,CAAC,CAAC;QAEnF,MAAM,mBAAmB,GAAG,CAAC,qBAAqB,CAAC,MAAM,EAAE,qBAAqB,CAAC,SAAS,CAAC;QAE3F,MAAM,mBAAmB,GAAyE,EAAE;AACpG,QAAA,IAAI,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,cAAc,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,eAAe,EAAE;AAGrD,aAAA,IAAI,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,cAAc,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,eAAe,EAAE;AACjE,YAAA,mBAAmB,CAAC,eAAe,GAAG,CAAA,EAAA,GAAA,MAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,0CAAE,cAAc,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,eAAe;;AAG9F,QAAA,QACE,WAAK,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,mBAAmB,EAAA,EAClD,CAAe,CAAA,eAAA,EAAA,EAAA,QAAQ,EAAC,IAAI,EAAA,EAC1B,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,gBAAgB,EACxB,EAAA,CAAC,IAAI,CAAC,gBAAgB,IACrB,oBACE,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,gBAAgB,EAAE,IAAI,CAAC,QAAQ,EAC/B,yBAAyB,EAAE,IAAI,CAAC,iBAAiB,EAAA,EAGhD,qBAAqB,CAAC,GAAG,CAAC,CAAC,aAAa,EAAE,CAAC,KAAI;;AAAC,YAAA,QAC/C,CAAA,CAAA,KAAA,EAAA,IAAA,EACG,aAAa,KAAK,qBAAqB,CAAC,CAAC,CAAC;;AAEzC,YAAA,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,QAAQ,EAAC,KAAK,EAAE,CAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,cAAc,0CAAE,qBAAqB,IAAG,EAAE,eAAe,EAAE,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,cAAc,0CAAE,qBAAqB,EAAE,GAAG,EAAE,EAAA,EACtJ,CAAA,CAAA,kBAAA,EAAA,EAAkB,EAAE,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAC,SAAS,EAC/D,EAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CACE,EACnB,CAAA,CAAA,kBAAA,EAAA,EACE,EAAE,EAAE,IAAI,CAAC,aAAa,EACtB,OAAO,EAAE,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,cAAc,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,aAAa,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,MAAM,EACpE,KAAK,EAAC,SAAS,IAEd,IAAI,CAAC,IAAI,CAAC,WAAW,CACL,EAGlB,IAAI,CAAC,kBAAkB,KACtB,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,kBAAkB,EAM1B,EAAA,IAAI,CAAC,SAAS,KACb,CAAA,CAAA,kBAAA,EAAA,EAAkB,OAAO,EAAC,MAAM,EAAC,KAAK,EAAC,WAAW,EAC/C,EAAA,IAAI,CAAC,SAAS,CACE,CACpB,CACG,CACP,CACG,CACP,EACD,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACvB,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,OAAO,EAAA,EACf,IAAI,CAAC,IAAI,CAAC;iBACR,MAAM,CAAC,EAAE,IAAI,EAAE,CAAC,OAAO,KAAK,aAAa;AACzC,iBAAA,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,aAAa,GAAG,CAAC,CAAC,aAAa;AAChD,iBAAA,GAAG,CAAC,CAAC,QAAyB,KAAI;;gBACjC,MAAM,QAAQ,GAAG,mBAAmB,CAAC,QAAQ,CAAC,QAAQ,CAAC,WAAW,CAAC;gBACnE,MAAM,GAAG,GAAW,cAAc;AAClC,gBAAA,IAAI,CAAC,QAAQ;AAAE,oBAAA,cAAc,EAAE;AAC/B,gBAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,MAAM,EAAA,EACf,CAAA,CAAA,cAAA,EAAA,EACE,cAAc,EAAE;wBACd,UAAU,EAAE,MAAA,IAAI,CAAC,IAAI,CAAC,cAAc,0CAAE,UAAU;wBAChD,aAAa,EAAE,MAAA,IAAI,CAAC,IAAI,CAAC,cAAc,0CAAE,aAAa;wBACtD,YAAY,EAAE,MAAA,IAAI,CAAC,IAAI,CAAC,cAAc,0CAAE,YAAY;AACrD,qBAAA,EACD,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,GAAG,EACnB,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,EACxC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,CAAA,CACE;AAEV,aAAC,CAAC,CACA,EACL,CAAC,KAAK,qBAAqB,CAAC,MAAM,GAAG,CAAC,KACrC,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,QAAQ,EAAA,EACjB,CAAA,CAAA,OAAA,EAAA,EACE,QAAQ,EAAE,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EACxD,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,QAAQ,EACd,KAAK,EAAC,QAAQ,EACd,EAAE,EAAC,qCAAqC,EACxC,OAAO,EAAE,MAAK;AACZ,oBAAA,OAAO,CAAC,GAAG,CAAC,uBAAuB,CAAC;;AAEtC,iBAAC,GACD,CACE,CACP,CACG,CACF;AACP,SAAA,CAAC,CACW;;AAGf,QAAA,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,kBAAA,EAAA,IAAA,EACE,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACtB,CAAmE,CAAA,kBAAA,EAAA,IAAA,EAAA,gCAAA,CAAA,EACnE,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EACxB,CAAA,CAAA,eAAA,EAAA,EAAe,OAAO,EAAE,IAAI,CAAC,QAAQ,EAAwB,EAAA,QAAA,CAAA,CACzD,CACF,CACW,CACf,CACP,CACG,CACQ,CACZ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/forms/udp-forms/udp-forms-renderer/udp-forms-renderer.css?tag=udp-forms-ui&encapsulation=shadow","src/components/my-component/UI/forms/udp-forms/udp-forms-renderer/udp-forms-ui.tsx"],"sourcesContent":[".background {\n background-color: var(--gray-01);\n}\n\n.item {\n padding-bottom: var(--spacing-02);\n /* margin-bottom: var(--spacing-05); */\n}\n.items {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-05);\n padding-top: var(--spacing-02);\n padding-bottom: var(--spacing-02);\n}\n\n.footer {\n display: flex;\n flex-direction: row-reverse;\n}\n\n.submit {\n background-color: var(--primary-color);\n box-sizing: border-box;\n border: none;\n color: white;\n padding: 8px 24px;\n font-size: 14px;\n font-weight: 600;\n cursor: pointer;\n transition: background-color 0.3s ease;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-decoration: none;\n min-width: 48px;\n min-height: 24px; /* Default size */\n}\n\n.submit:disabled {\n background-color: var(--gray-05);\n cursor:default;\n}\n\n.submit-card {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n}\n\n.form-content {\n margin-bottom: var(--spacing-05);\n background-color: white;\n padding: 16px;\n display: flex;\n flex-direction: column;\n gap: var(--spacing-05);\n}\n\n.form-container {\n padding-top: var(--spacing-05);\n padding-bottom: var(--spacing-05);\n}\n\n.center-div {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n\n.finish-button {\n display: flex;\n flex-direction: column;\n justify-content: center;\n}\n\n.header {\n background-color: var(--secondary-color);\n padding: var(--spacing-05) var(--spacing-05);\n color: var(--primary-color-contrast, #fff);\n}\n\n.auto-save-status {\n margin-top: var(--spacing-02);\n padding: var(--spacing-01) 0;\n font-size: 12px;\n opacity: 0.8;\n}\n","import { Component, h, Prop } from '@stencil/core';\nimport { Guid, UdpForm, UdpFormQuestion } from '../types';\nimport { UdpFormsFieldTypeEnum } from '../enums';\nimport { fontOverrideMapping, overrideFont } from '../utils';\n\n// Helper function to determine if a value is empty, considering various types.\nconst isEmpty = (value: any): boolean => {\n if (value === null || value === undefined) return true;\n if (typeof value === 'string' && value.trim() === '') return true;\n if (Array.isArray(value) && value.length === 0) return true;\n if (typeof value === 'object' && value !== null && !Array.isArray(value)) {\n // A UdpDriveFile object is considered not empty.\n if (value.driveId && value.fileId) {\n return false;\n }\n // A File object from a file input or signature pad\n if (value instanceof File) {\n return value.size === 0;\n }\n // A plain object with no keys is empty\n return Object.keys(value).length === 0;\n }\n return false;\n};\n\n@Component({\n tag: 'udp-forms-ui',\n styleUrl: 'udp-forms-renderer.css', // Reuse the same styles\n shadow: true,\n})\nexport class UdpFormsUi {\n @Prop() form: UdpForm;\n @Prop() initialValues: { [name: string]: any } = {};\n @Prop() submitSuccessful: boolean = false;\n @Prop() loading: boolean = false;\n @Prop() isSaving: boolean = false;\n @Prop() saveError: string | null = null;\n @Prop() showAutoSaveStatus: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() readonly: boolean = false;\n @Prop() onSubmit: (values: any) => Promise<void>;\n @Prop() onChange: (values: { [name: string]: any }) => void;\n @Prop() onAction: (actionId: Guid, params: Object) => void;\n @Prop() onFinish: () => void;\n\n private titleId: string = 'udp-forms-title';\n private descriptionId: string = 'udp-forms-description';\n\n componentDidLoad() {\n this.overrideStyles();\n }\n\n componentDidUpdate() {\n this.overrideStyles();\n }\n\n overrideStyles() {\n const shadowRoot = (this as any).el?.shadowRoot;\n shadowRoot?.querySelectorAll('unity-typography').forEach(element => {\n const styleOverride =\n element.id === this.titleId ? this.form?.styleOverrides?.titleText :\n element.id === this.descriptionId ? this.form?.styleOverrides?.paragraphText :\n ({} as any);\n\n if (styleOverride?.fontFamily && fontOverrideMapping[styleOverride.fontFamily]) {\n overrideFont(element, fontOverrideMapping[styleOverride.fontFamily]);\n }\n if (styleOverride?.variant) {\n element.setAttribute('variant', styleOverride.variant);\n }\n });\n }\n\n private validate = (values: Object) => {\n console.log('Validation called with values:', values);\n const errors = {};\n // Validate required fields\n for (const question of this.form?.formQuestions || []) {\n if (question.required && question.fieldTypeId !== UdpFormsFieldTypeEnum.Tally) {\n const value = values[question.name];\n if (isEmpty(value)) {\n errors[question.name] = 'This field is required';\n console.log(`Validation error for ${question.name}: required field is empty`);\n }\n }\n }\n console.log('Validation errors:', errors);\n return errors;\n };\n\n private handleSubmit = async (values: any) => {\n console.log('Form submit handler called with values:', values);\n try {\n if (this.onSubmit) {\n console.log('Calling onSubmit prop...');\n await this.onSubmit(values);\n console.log('onSubmit completed successfully');\n } else {\n console.error('onSubmit prop is not defined!');\n }\n } catch (error) {\n console.error('Error in onSubmit:', error);\n }\n };\n\n private handleFormInvalid = (errors: any) => {\n console.log('Form validation failed with errors:', errors);\n };\n\n render() {\n if (!this.form) {\n return <div>Loading...</div>;\n }\n\n let questionNumber = 1;\n\n const sectionSet = new Set();\n this.form.formQuestions.forEach(fq => sectionSet.add(fq.section));\n const orderedSectionNumbers = [...sectionSet].sort((a: number, b: number) => a - b);\n\n const hiddenQuestionTypes = [UdpFormsFieldTypeEnum.Hidden, UdpFormsFieldTypeEnum.Paragraph];\n\n const backgroundOverrides: { backgroundImage?: string | null; backgroundColor?: string | null } = {};\n if (this.form?.styleOverrides?.background?.backgroundImage) {\n // uncomment when we want to allow background images\n //backgroundOverrides.backgroundImage = `url(${this.form?.styleOverrides?.background?.backgroundImage})`;\n } else if (this.form?.styleOverrides?.background?.backgroundColor) {\n backgroundOverrides.backgroundColor = this.form?.styleOverrides?.background?.backgroundColor;\n }\n\n return (\n <div class={'background'} style={backgroundOverrides}>\n <udp-container maxWidth=\"md\">\n <div class=\"form-container\">\n {!this.submitSuccessful ? (\n <stencil-form\n handleSubmit={this.handleSubmit}\n initialValues={this.initialValues}\n validate={this.validate}\n handleFormChange={this.onChange}\n onStencilFormInvalidEvent={this.handleFormInvalid}\n >\n {/********** QUESTIONS *********/}\n {orderedSectionNumbers.map((sectionNumber, i) => (\n <div>\n {sectionNumber === orderedSectionNumbers[0] && (\n // @ts-ignore\n <div class=\"header\" style={this.form?.styleOverrides?.headerBackgroundColor ? { backgroundColor: this.form?.styleOverrides?.headerBackgroundColor } : ''}>\n <unity-typography id={this.titleId} variant={'h6'} color=\"inherit\">\n {this.form.name}\n </unity-typography>\n <unity-typography\n id={this.descriptionId}\n variant={this.form?.styleOverrides?.paragraphText?.variant ?? 'body'}\n color=\"inherit\"\n >\n {this.form.description}\n </unity-typography>\n\n {/* Auto-save status indicator for authenticated users */}\n {this.showAutoSaveStatus && (\n <div class=\"auto-save-status\">\n {/* {this.isSaving && (\n <unity-typography variant=\"body\" color=\"primary\">\n Saving...\n </unity-typography>\n )} */}\n {this.saveError && (\n <unity-typography variant=\"body\" color=\"secondary\">\n {this.saveError}\n </unity-typography>\n )}\n </div>\n )}\n </div>\n )}\n <div class=\"form-content\">\n <div class=\"items\">\n {this.form.formQuestions\n .filter(fq => fq.section === sectionNumber)\n .sort((a, b) => a.questionOrder - b.questionOrder)\n .map((question: UdpFormQuestion) => {\n const isHidden = hiddenQuestionTypes.includes(question.fieldTypeId);\n const num: number = questionNumber;\n if (!isHidden) questionNumber++;\n return (\n <div class=\"item\">\n <udp-question\n styleOverrides={{\n helperText: this.form.styleOverrides?.helperText,\n paragraphText: this.form.styleOverrides?.paragraphText,\n questionText: this.form.styleOverrides?.questionText,\n }}\n question={question}\n questionNumber={num}\n value={this.initialValues[question.name]}\n disabled={this.disabled}\n readonly={this.readonly}\n />\n </div>\n );\n })}\n </div>\n {i === orderedSectionNumbers.length - 1 && (\n <div class=\"footer\">\n <input\n disabled={this.loading || this.disabled || this.readonly}\n type=\"submit\"\n value=\"Submit\"\n class=\"submit\"\n id=\"udpRecord-udp-forms-renderer-Submit\"\n onClick={() => {\n console.log('Submit button clicked');\n // Let the form handle the submit naturally\n }}\n />\n </div>\n )}\n </div>\n </div>\n ))}\n </stencil-form>\n ) : (\n //if the form has been submit, display success message with a button to trigger the action associated to the form\n <div class=\"center-div\">\n <udp-ambient-card>\n <div class=\"submit-card\">\n <unity-typography>Thank you for your submission!</unity-typography>\n <div class=\"finish-button\">\n <custom-button onClick={this.onFinish}>Finish</custom-button>\n </div>\n </div>\n </udp-ambient-card>\n </div>\n )}\n </div>\n </udp-container>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/p-CA-v1fbV.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-CA-v1fbV.js","mappings":";;AAAA,MAAM,eAAe,GAAG,kgCAAkgC;;MCwG7gC,YAAY,iBAAAA,kBAAA,CAAA,MAAA,YAAA,SAAAC,CAAA,CAAA;AALzB,IAAA,WAAA,GAAA;;;AAWU,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAGxB,QAAA,IAAU,CAAA,UAAA,GAAY,KAAK;AAC3B,QAAA,IAAA,CAAA,aAAa,GAAuB,MAAK,GAAG;AAC5C,QAAA,IAAA,CAAA,eAAe,GAAyB,MAAK,GAAG;AAChD,QAAA,IAAA,CAAA,cAAc,GAAuB,MAAK,GAAG;AAqMvD;IAhMC,MAAM,UAAU,CAAC,OAAY,EAAA;AAC3B,QAAA,IAAI,CAAC,KAAK,GAAG,OAAO;AACpB,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,aAAa,CAC1B,IAAI,CAAC,IAAI,EACT,UAAU,IAAG;YACX,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,UAAU;AACjD,YAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AAC3C,gBAAA,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE;;AAGpE,gBAAA,IAAI,CAAC,aAAa,GAAG,MAAK;;AACxB,oBAAA,IAAI,EAAE;AACN,oBAAA,IAAI,CAAC,YAAY,GAAG,MAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,KAAK;AACpE,iBAAC;AACD,gBAAA,IAAI,CAAC,eAAe,GAAG,KAAK,IAAG;oBAC7B,MAAM,CAAC,KAAK,CAAC;;AAEb,oBAAA,IAAI,CAAC,YAAY,GAAG,EAAE;;oBAEtB,IAAI,CAAC,8BAA8B,EAAE;AACvC,iBAAC;AACD,gBAAA,IAAI,CAAC,cAAc,GAAG,KAAK;AAC3B,gBAAA,IAAI,CAAC,UAAU,GAAG,IAAI;;;AAKxB,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;AACpB,SAAC,EACD;AACE,YAAA,KAAK,EAAE,IAAI;AACX,YAAA,KAAK,EAAE,KAAK;AACZ,YAAA,OAAO,EAAE,KAAK;AACf,SAAA,CACF;;IAGH,kBAAkB,GAAA;QAChB,IAAI,CAAC,8BAA8B,EAAE;;IAGvC,kBAAkB,GAAA;QAChB,IAAI,CAAC,8BAA8B,EAAE;;IAG/B,8BAA8B,GAAA;QACpC,MAAM,iBAAiB,GAAG,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC;QAErD,IAAI,iBAAiB,EAAE;AACrB,YAAA,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,OAAY,KAAI;;;AAGpD,gBAAA,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,wBAAwB,CAAC,EAAE;AAC/E,oBAAA,OAAO,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK;AACjC,oBAAA,OAAO,CAAC,YAAY,CAAC,wBAAwB,EAAE,MAAM,CAAC;;;gBAIxD,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,IAAI,EAAE;gBAEvC,IAAI,IAAI,CAAC,IAAI;AAAE,oBAAA,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI;gBACvC,IAAI,IAAI,CAAC,EAAE;AAAE,oBAAA,OAAO,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE;gBACjC,IAAI,IAAI,CAAC,KAAK;AAAE,oBAAA,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK;;gBAG1C,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,yBAAyB,CAAC,EAAE;AACpD,oBAAA,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC9D,oBAAA,OAAO,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAChE,oBAAA,OAAO,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC5D,oBAAA,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC9D,oBAAA,OAAO,CAAC,YAAY,CAAC,yBAAyB,EAAE,MAAM,CAAC;;AAE3D,aAAC,CAAC;;;IAIN,oBAAoB,GAAA;;;AAElB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd;;QAEF,IAAI,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;YAC1C,OAAO,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC;;;;AAK/C,QAAA,IAAI;AACF,YAAA,IAAI,CAAA,EAAA,GAAA,IAAI,CAAC,KAAK,CAAC,GAAG,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,MAAM,EAAE;AAC1B,gBAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,CAAC;;;QAE7C,OAAO,KAAK,EAAE;;AAEd,YAAA,OAAO,CAAC,KAAK,CAAC,wBAAwB,EAAE,KAAK,CAAC;;;AAIhD,QAAA,IAAI,CAAC,UAAU,GAAG,KAAK;;AAIzB,IAAA,WAAW,CAAC,CAAQ,EAAA;;AAClB,QAAA,IAAI,KAAK;;QAGT,IAAI,CAAC,YAAY,WAAW,IAAI,CAAC,CAAC,MAAM,KAAK,SAAS,EAAE;AACtD,YAAA,KAAK,GAAG,CAAC,CAAC,MAAM;;aACX;;AAEL,YAAA,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB;;AAGtC,YAAA,IAAI,MAAM,CAAC,UAAU,EAAE;gBACrB,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC,yBAAyB,CAA+D;gBACtI,IAAI,KAAK,EAAE;AACT,oBAAA,KAAK,GAAG,KAAK,CAAC,KAAK;;;;AAIlB,iBAAA,IAAI,MAAM,CAAC,OAAO,KAAK,OAAO,IAAI,MAAM,CAAC,OAAO,KAAK,UAAU,IAAI,MAAM,CAAC,OAAO,KAAK,QAAQ,EAAE;AACnG,gBAAA,KAAK,GAAI,MAAqE,CAAC,KAAK;;;AAGjF,iBAAA,IAAI,OAAO,IAAI,MAAM,EAAE;AAC1B,gBAAA,KAAK,GAAI,MAAc,CAAC,KAAK;;;AAIjC,QAAA,IAAI,KAAK,KAAK,SAAS,EAAE;AACvB,YAAA,CAAA,EAAA,GAAA,IAAI,CAAC,eAAe,MAAG,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,EAAA,KAAK,CAAC;;;AAKjC,IAAA,YAAY,CAAC,CAAQ,EAAA;;AACnB,QAAA,IAAI,KAAK;;QAGT,IAAI,CAAC,YAAY,WAAW,IAAI,CAAC,CAAC,MAAM,KAAK,SAAS,EAAE;AACtD,YAAA,KAAK,GAAG,CAAC,CAAC,MAAM;;aACX;;AAEL,YAAA,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB;;AAGtC,YAAA,IAAI,MAAM,CAAC,UAAU,EAAE;gBACrB,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC,yBAAyB,CAA+D;gBACtI,IAAI,KAAK,EAAE;AACT,oBAAA,KAAK,GAAG,KAAK,CAAC,KAAK;;;;AAIlB,iBAAA,IAAI,MAAM,CAAC,OAAO,KAAK,OAAO,IAAI,MAAM,CAAC,OAAO,KAAK,UAAU,IAAI,MAAM,CAAC,OAAO,KAAK,QAAQ,EAAE;AACnG,gBAAA,KAAK,GAAI,MAAqE,CAAC,KAAK;;;AAGjF,iBAAA,IAAI,OAAO,IAAI,MAAM,EAAE;AAC1B,gBAAA,KAAK,GAAI,MAAc,CAAC,KAAK;;;AAIjC,QAAA,IAAI,KAAK,KAAK,SAAS,EAAE;AACvB,YAAA,CAAA,EAAA,GAAA,IAAI,CAAC,eAAe,MAAG,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,EAAA,KAAK,CAAC;;AAE7B,YAAA,IAAI,CAAC,YAAY,WAAW,EAAE;AAC5B,gBAAA,CAAA,EAAA,GAAA,IAAI,CAAC,aAAa,MAAG,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,EAAA,CAAC,CAAC;;;;AAM7B,IAAA,WAAW,CAAC,CAAa,EAAA;;AACvB,QAAA,CAAA,EAAA,GAAA,IAAI,CAAC,cAAc,MAAG,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,EAAA,CAAC,CAAC;;AAI1B,IAAA,UAAU,CAAC,CAAa,EAAA;;AACtB,QAAA,CAAA,EAAA,GAAA,IAAI,CAAC,aAAa,MAAG,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,EAAA,CAAC,CAAC;;AAIzB,IAAA,cAAc,CAAC,CAAC,EAAA;AACd,QAAA,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;;IAEvB,MAAM,GAAA;AACJ,QAAA,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;AACpB,YAAA,OAAO,IAAI;;;AAIb,QAAA,OAAO,eAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/forms/form/stencil-field.css?tag=stencil-field","src/components/my-component/UI/forms/form/stencil-field.tsx"],"sourcesContent":["stencil-field.css\n:host {\n display: block;\n padding: 16px;\n background-color: #f4f4f4; /* A lighter gray typical of Carbon backgrounds */\n }\n \n input[type=\"checkbox\"], input[type=\"radio\"] {\n appearance: none;\n background-color: #fff;\n border: 2px solid #8d8d8d; /* Carbon's default border color */\n width: 20px; /* Typical size for touch targets */\n height: 20px; /* Square dimension for checkbox, circular for radio */\n border-radius: 50%; /* Full circle for radios, adjust for checkbox if needed */\n position: relative;\n cursor: pointer; /* Pointer to indicate clickable */\n transition: all 0.3s ease; /* Smooth transition for visual feedback */\n }\n \n input[type=\"checkbox\"] {\n border-radius: 2px; /* Slightly rounded corners for checkboxes */\n }\n \n input[type=\"radio\"]:checked, input[type=\"checkbox\"]:checked {\n background-color: var(--primary-color);\n border-color: var(--primary-color);\n }\n \n input[type=\"radio\"]:checked::before, input[type=\"radio\"]:checked::before {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 12px;\n height: 12px;\n background-color: white;\n border-radius: 50%; /* Circle inside radio or checkbox */\n }\n\n input[type=\"checkbox\"]:checked::before {\n content: '\\2714'; /* Unicode character for checkmark */\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n font-size: 14px; /* Adjust size as needed */\n color: white; /* Make sure the color is white */\n}\n\n \n\n .checkbox-container, .radio-container {\n display: flex;\n align-items: center; /* Vertical alignment */\n cursor: pointer;\n}\n\ninput[type=\"checkbox\"], input[type=\"radio\"] {\n margin-right: 8px; /* Space between the checkbox and the label */\n}\n\nlabel {\n margin: 0; /* Remove default margin */\n display: block; /* Optional: ensures the label uses the full height */\n line-height: 1; /* Aligns text properly within the flex container */\n display: flex;\n align-items: center;\n}\n\n","/**\n * StencilField - Form field wrapper component that integrates with Final Form\n *\n * This component acts as a bridge between form input components and Final Form state management.\n * It uses slot-based rendering and property injection to work with any child input component.\n *\n * REQUIREMENTS FOR CHILD COMPONENTS:\n *\n * 1. VALUE HANDLING:\n * - SIMPLE INPUTS: Manage own value state, receive initialValue prop from stencil-field\n * - COMPLEX INPUTS: Same approach - internal value management with initialValue\n * - stencil-field reads values from DOM events or custom events, never directly modifies component value\n *\n * 2. ERROR HANDLING:\n * - Child component should have an @Prop() error: string\n * - Use @Watch('error') to react to validation errors\n *\n * 3. EVENT HANDLERS:\n * - Child component must emit standard DOM events (input, change, blur, focus)\n * - SIMPLE INPUTS: Standard HTML input/textarea that emits native events\n * - COMPLEX INPUTS: Emit CustomEvent with detail containing the value\n *\n * 4. STANDARD FORM PROPS:\n * - @Prop() name: string (for form field identification)\n * - @Prop() id: string (for accessibility)\n * - @Prop() label: string (for field labeling)\n * - @Prop() initialValue: string (for setting initial/default values)\n *\n * EXAMPLE SIMPLE INPUT:\n * ```tsx\n * @Component({ tag: 'simple-input' })\n * export class SimpleInput {\n * @Prop() error: string;\n * @Prop() name: string;\n * @Prop() id: string;\n * @Prop() label: string;\n * @Prop() initialValue: string;\n * @State() value: string;\n *\n * componentWillLoad() {\n * this.value = this.initialValue || '';\n * }\n *\n * private onChange = (e: Event) => {\n * this.value = (e.target as HTMLInputElement).value;\n * }\n *\n * render() {\n * return <input name={this.name} id={this.id} value={this.value} onInput={this.onChange} />;\n * }\n * }\n * ```\n *\n * EXAMPLE COMPLEX INPUT:\n * ```tsx\n * @Component({ tag: 'complex-input' })\n * export class ComplexInput {\n * @Prop() error: string;\n * @Prop() name: string;\n * @Prop() id: string;\n * @Prop() label: string;\n * @Prop() initialValue: string;\n * @State() value: string;\n *\n * componentWillLoad() {\n * this.value = this.initialValue || '';\n * }\n *\n * @Watch('error')\n * updateError() {\n * // Handle error display\n * }\n *\n * private onChange = (newValue: string) => {\n * this.value = newValue; // Update internal state\n * // Emit custom event for stencil-field\n * this.el.dispatchEvent(new CustomEvent('input', {\n * detail: newValue,\n * bubbles: true\n * }));\n * }\n * }\n * ```\n *\n * USAGE:\n * ```tsx\n * \n * <stencil-field name=\"email\" label=\"Email\" required>\n * <simple-input />\n * </stencil-field>\n *\n * \n * <stencil-field name=\"tags\" label=\"Tags\" required>\n * <tag-selector />\n * </stencil-field>\n * ```\n */\nimport { Component, Prop, h, State, Listen, Element, Method } from '@stencil/core';\n\n@Component({\n tag: 'stencil-field',\n styleUrl: 'stencil-field.css',\n shadow: false,\n})\nexport class StencilField {\n @Element() el: HTMLElement;\n @Prop() id: string;\n @Prop() defaultValue: string;\n @Prop() name: string;\n @Prop() label: string;\n @Prop() required: boolean = false;\n @Prop({ mutable: true }) value: string;\n @State() errorMessage: string;\n @State() registered: boolean = false;\n @State() finalFormBlur: (e: Event) => void = () => {};\n @State() finalFormChange: (value: any) => void = () => {};\n @State() finalFormFocus: (e: Event) => void = () => {};\n\n private state: any;\n\n @Method()\n async setFormApi(formApi: any) {\n this.state = formApi;\n this.state.api.registerField(\n this.name,\n fieldState => {\n const { blur, change, focus, value } = fieldState;\n if (!this.state.registeredFields[this.name]) {\n this.state.registeredFields[this.name] = { required: this.required };\n // first time, register event listeners\n\n this.finalFormBlur = () => {\n blur();\n this.errorMessage = this.state.api.getFieldState(this.name)?.error;\n };\n this.finalFormChange = event => {\n change(event);\n // reset the error on change, error state will be re-evaluated when the blur event is triggered\n this.errorMessage = '';\n // Force re-render to inject cleared error into child components\n this.injectPropsIntoSlottedElements();\n };\n this.finalFormFocus = focus;\n this.registered = true;\n }\n\n // update value\n\n this.value = value;\n },\n {\n value: true,\n error: false,\n touched: false,\n },\n );\n }\n\n componentDidRender() {\n this.injectPropsIntoSlottedElements();\n }\n\n componentDidUpdate() {\n this.injectPropsIntoSlottedElements();\n }\n\n private injectPropsIntoSlottedElements() {\n const hasSlottedContent = this.el.children.length > 0;\n\n if (hasSlottedContent) {\n Array.from(this.el.children).forEach((element: any) => {\n // Inject form field props\n // Pass initial value only, don't control the component's value directly\n if (this.value !== undefined && !element.hasAttribute('data-initial-value-set')) {\n element.initialValue = this.value;\n element.setAttribute('data-initial-value-set', 'true');\n }\n\n // Always update error state (including clearing it)\n element.error = this.errorMessage || '';\n\n if (this.name) element.name = this.name;\n if (this.id) element.id = this.id;\n if (this.label) element.label = this.label;\n\n // Set up event handlers if not already bound\n if (!element.hasAttribute('data-field-events-bound')) {\n element.addEventListener('input', this.handleInput.bind(this));\n element.addEventListener('change', this.handleChange.bind(this));\n element.addEventListener('blur', this.handleBlur.bind(this));\n element.addEventListener('focus', this.handleFocus.bind(this));\n element.setAttribute('data-field-events-bound', 'true');\n }\n });\n }\n }\n\n disconnectedCallback() {\n // Clean up the field from the registry when component is unmounted\n if (!this.name) {\n return;\n }\n if (this.state.registeredFields[this.name]) {\n delete this.state.registeredFields[this.name];\n }\n\n // Final Form automatically handles field cleanup when no longer subscribed,\n // but we can also explicitly remove the field value if needed\n try {\n if (this.state.api?.change) {\n this.state.api.change(this.name, undefined);\n }\n } catch (error) {\n // Silently handle any errors during cleanup\n console.debug('Field cleanup warning:', error);\n }\n\n // Reset registration state\n this.registered = false;\n }\n\n @Listen('input')\n handleInput(e: Event) {\n let value;\n\n // Handle custom events from complex components\n if (e instanceof CustomEvent && e.detail !== undefined) {\n value = e.detail;\n } else {\n // Handle standard DOM events - need to find the actual input element\n const target = e.target as HTMLElement;\n\n // If target is a custom component, look for the actual input in its shadow DOM\n if (target.shadowRoot) {\n const input = target.shadowRoot.querySelector('input, textarea, select') as HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;\n if (input) {\n value = input.value;\n }\n }\n // If target is the actual input element\n else if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.tagName === 'SELECT') {\n value = (target as HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement).value;\n }\n // Fallback: check if the custom component has a value property\n else if ('value' in target) {\n value = (target as any).value;\n }\n }\n\n if (value !== undefined) {\n this.finalFormChange?.(value);\n }\n }\n\n @Listen('change')\n handleChange(e: Event) {\n let value;\n\n // Handle custom events from complex components\n if (e instanceof CustomEvent && e.detail !== undefined) {\n value = e.detail;\n } else {\n // Handle standard DOM events - need to find the actual input element\n const target = e.target as HTMLElement;\n\n // If target is a custom component, look for the actual input in its shadow DOM\n if (target.shadowRoot) {\n const input = target.shadowRoot.querySelector('input, textarea, select') as HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;\n if (input) {\n value = input.value;\n }\n }\n // If target is the actual input element\n else if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.tagName === 'SELECT') {\n value = (target as HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement).value;\n }\n // Fallback: check if the custom component has a value property\n else if ('value' in target) {\n value = (target as any).value;\n }\n }\n\n if (value !== undefined) {\n this.finalFormChange?.(value);\n // For complex components that emit custom events, also trigger blur validation\n if (e instanceof CustomEvent) {\n this.finalFormBlur?.(e);\n }\n }\n }\n\n @Listen('focus')\n handleFocus(e: FocusEvent) {\n this.finalFormFocus?.(e);\n }\n\n @Listen('blur')\n handleBlur(e: FocusEvent) {\n this.finalFormBlur?.(e);\n }\n\n @Listen('stencilFormInvalidEvent', {target: 'body'})\n stencilInvalid(e){\n this.finalFormBlur(e);\n }\n render() {\n if (!this.registered) {\n return null;\n }\n\n // Always use slot-based rendering\n return <slot />;\n }\n}\n"],"version":3}