udp-stencil-component-library 1.0.2 → 1.0.3

package/dist/components/{p-DMcaGgHq.js → p-DnMRLbBX.js}

@@ -156,7 +156,7 @@ const UdpDateTimeSelector = /*@__PURE__*/ proxyCustomElement(class UdpDateTimeSe
             classNames.push('bx--text-input--full-width');
         }
         const inputClass = classNames.join(' ');
-        return (h(Host, { key: 'a4a4b1da1767b52e7c08025dcaab6f0d3e3f86d0', class: {
+        return (h(Host, { key: '85d5946dfe58a154c64b36e4b8049ad87b58fa4f', class: {
                 'udp-input': true,
                 'udp-input--error': isError,
                 'udp-input--disabled': this.disabled,
@@ -165,9 +165,9 @@ const UdpDateTimeSelector = /*@__PURE__*/ proxyCustomElement(class UdpDateTimeSe
                 'udp-input--required': this.required,
                 [`udp-input--size-${this.size}`]: true,
                 [`udp-input--margin-${this.margin}`]: true,
-            }, "aria-invalid": isError ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false' }, h("div", { key: 'c4a2172e002e541172ceae2438300f8f11dd5c05', class: "bx--form-item" }, h("unity-typography", { key: '27f68ecbcd8b373f2d3debf44bcc664665cb2002', variant: "caption-text" }, h("label", { key: '03f99e2992c441089b55fba119d8ceced7bc9cd0', htmlFor: this.id, class: "bx--label" }, this.label, this.required ? '*' : '')), h("input", { key: 'f5e5ce56fbb883392c36c7c697426d6cc5aa02e4', type: "datetime-local", id: this.id, name: this.name, class: inputClass, value: this.internalValue, min: this.min ? this.formatDateForHtml(this.min) : null, max: this.max ? this.formatDateForHtml(this.max) : null, onInput: this.handleDateChange, onBlur: this.handleBlur, onFocus: this.handleFocus, disabled: this.disabled, readonly: this.readonly, required: this.required,
+            }, "aria-invalid": isError ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false' }, h("div", { key: '0acd3b73f117d23bf72a31e579989b91c4d65bd6', class: "bx--form-item" }, h("unity-typography", { key: '96800ba12c04caf023ec598a4e4b5d49d38110dc', variant: "caption-text" }, h("label", { key: '6bf6800633644e6ccf71626fefcc5909cd82f00f', htmlFor: this.id, class: "bx--label" }, this.label, this.required ? '*' : '')), h("input", { key: '85aaa396c446593ffb7555af6bde6dd68bddcca0', type: "datetime-local", id: this.id, name: this.name, class: inputClass, value: this.internalValue, min: this.min ? this.formatDateForHtml(this.min) : null, max: this.max ? this.formatDateForHtml(this.max) : null, onInput: this.handleDateChange, onBlur: this.handleBlur, onFocus: this.handleFocus, disabled: this.disabled, readonly: this.readonly, required: this.required,
             //@ts-ignore
-            udprecordid: 'udpRecord-udp-datetime-selector-' + this.id }), h("unity-typography", { key: '04b8079259437699ecdac7699772c455b1a9d1e3', class: "error-message", variant: "caption-text", color: "error" }, this.errorMessage))));
+            udprecordid: 'udpRecord-udp-datetime-selector-' + this.id }), h("unity-typography", { key: '2fb0c1e5470610240c608fbdda2076ed8144aaff', class: "error-message", variant: "caption-text", color: "error" }, this.errorMessage))));
     }
     static get watchers() { return {
         "error": ["updateError"],
@@ -217,6 +217,6 @@ function defineCustomElement() {
 }
 
 export { UdpDateTimeSelector as U, defineCustomElement as d };
-//# sourceMappingURL=p-DMcaGgHq.js.map
+//# sourceMappingURL=p-DnMRLbBX.js.map
 
-//# sourceMappingURL=p-DMcaGgHq.js.map
+//# sourceMappingURL=p-DnMRLbBX.js.map

package/dist/components/{p-DMcaGgHq.js.map → p-DnMRLbBX.js.map}

@@ -1 +1 @@
-{"file":"p-DMcaGgHq.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/inputs/date-time-selector/udp-datetime-selector.css?tag=udp-datetime-selector&encapsulation=shadow","src/components/my-component/UI/inputs/date-time-selector/udp-datetime-selector.tsx"],"sourcesContent":["@import '../inputs.css';\n\n:host(.full-width-host) {\n  width: 100%;\n}","import { Component, h, Host, State, EventEmitter, Prop, Event, Watch } from '@stencil/core';\nimport { InputSize, InputMargin } from '../input-types';\n\n/**\n * A standardized date-time input component with validation, min/max constraints, and timezone handling.\n * Supports both controlled and uncontrolled modes.\n *\n * This component emits a custom `change` event with the committed value and also\n * propagates standard DOM events like `input`, `focus`, and `blur` from the\n * underlying input element.\n *\n * **Date Handling:**\n * - Uses HTML5 `datetime-local` input for consistent browser behavior\n * - Handles timezone compensation for accurate date storage\n * - Supports ISO date strings and JavaScript Date constructor formats\n *\n * @example\n * ```tsx\n * // Uncontrolled component with initial value\n * <udp-datetime-selector\n *   label=\"Meeting Time\"\n *   initialValue=\"2024-12-25T14:30\"\n *   onChange={(e) => console.log('Selected:', e.detail)}\n * />\n *\n * // Controlled component\n * <udp-datetime-selector\n *   label=\"Appointment\"\n *   value={appointmentTime}\n *   onChange={(e) => setAppointmentTime(e.detail)}\n * />\n *\n * // With validation and constraints\n * <udp-datetime-selector\n *   label=\"Event Date\"\n *   value={eventDate}\n *   min=\"2024-01-01T00:00\"\n *   max=\"2024-12-31T23:59\"\n *   required={true}\n *   error={dateError}\n *   onChange={handleDateChange}\n * />\n * ```\n */\n@Component({\n  tag: 'udp-datetime-selector',\n  styleUrl: 'udp-datetime-selector.css',\n  shadow: true,\n})\nexport class UdpDateTimeSelector {\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 date-time value allowed. Supports any date format supported by the JavaScript Date constructor.\n   * Recommended format: ISO 8601 (YYYY-MM-DDTHH:mm) for consistency.\n   */\n  @Prop() min: string;\n\n  /**\n   * Maximum date-time value allowed. Supports any date format supported by the JavaScript Date constructor.\n   * Recommended format: ISO 8601 (YYYY-MM-DDTHH:mm) for consistency.\n   */\n  @Prop() max: string;\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   * Whether the field is required for form submission. Adds visual indicator (*) and validation.\n   */\n  @Prop() required: boolean;\n\n  /**\n   * Initial value for the date-time selector. 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   * Current value of the date-time selector. 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   * 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  /**\n   * Internal value state. Manages the current date-time value independently of props.\n   * @internal\n   */\n  @State() internalValue: string = '';\n\n  /**\n   * Internal error message state. Manages display of validation errors.\n   * @internal\n   */\n  @State() errorMessage: string;\n\n  /**\n   * Emitted when the date-time 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 date-time selector in ISO format\n   *\n   * @example\n   * ```tsx\n   * <udp-datetime-selector onChange={(e) => handleDateChange(e.detail)} />\n   * ```\n   */\n  @Event() change: EventEmitter<string>;\n\n\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 or if this is an uncontrolled component.\n   * @internal\n   */\n  @Watch('initialValue')\n  initialValueChanged(newValue: string) {\n    // Only update if we don't have a value yet or if this is uncontrolled (no value prop)\n    if ((this.internalValue === '' || this.internalValue === undefined) || this.value === undefined) {\n      if (newValue !== undefined) {\n        this.internalValue = newValue;\n      }\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  valueChanged() {\n    // If value prop is provided, this is a controlled component\n    if (this.value !== undefined && this.value !== this.internalValue) {\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 value: use value prop if provided (controlled), otherwise use initialValue (uncontrolled)\n    this.internalValue = this.value !== undefined ? this.value : (this.initialValue || '');\n\n    if (this.error) {\n      this.errorMessage = this.error;\n    }\n  }\n\n  /**\n   * Handles input events (date-time changes). Updates internal state and emits events.\n   * For controlled components, also updates the value prop.\n   * @param event - The native input event\n   * @internal\n   */\n  private handleDateChange = (event: Event) => {\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    // Emit events for real-time and committed updates\n    this.change.emit(newValue);\n  }\n\n  /**\n   * Handles blur events. Event bubbles up to stencil-field automatically.\n   * @param event - The focus event\n   * @internal\n   */\n  private handleBlur = () => {\n    // Event will bubble up to stencil-field automatically\n  }\n\n  /**\n   * Handles focus events. Event bubbles up to stencil-field automatically.\n   * @param event - The focus event\n   * @internal\n   */\n  private handleFocus = () => {\n    // Event will bubble up to stencil-field automatically\n  }\n\n  /**\n   * Formats a date string for HTML datetime-local input.\n   * Handles timezone compensation to prevent JavaScript's automatic timezone adjustment.\n   * @param dateString - Date string to format\n   * @returns Formatted date string (YYYY-MM-DDTHH:mm) or null if invalid\n   * @internal\n   */\n  formatDateForHtml(dateString: string) {\n    // convert to date\n    const date = new Date(dateString);\n\n    if (isNaN(new Date(date)?.getTime())) return null;\n\n    // when converting to ISO string, javascript will edit the date to compensate for the timezone, we dont want that here so we manually subtract the offset that it will add\n\n    date?.setTime(date?.getTime() - date?.getTimezoneOffset() * 60 * 1000);\n\n    const isoString = date?.toISOString();\n    if (!isoString) return null;\n    // html wants the format YYYY-MM-DDThh:mm, ISO strings have YYYY-MM-DDTHH:MM:SS.mmmZ, so split it on ':' and take the first 2 sections\n    const splitISO = isoString.split(':');\n\n    return `${splitISO[0]}:${splitISO[1]}`;\n  }\n\n  /**\n   * Renders the date-time selector component.\n   * @returns JSX element\n   * @internal\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('datetime-selector--disabled');\n    }\n    if (this.fullWidth) {\n      classNames.push('bx--text-input--full-width');\n    }\n    const inputClass = classNames.join(' ');\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=\"datetime-local\"\n            id={this.id}\n            name={this.name}\n            class={inputClass}\n            value={this.internalValue}\n            min={this.min ? this.formatDateForHtml(this.min) : null}\n            max={this.max ? this.formatDateForHtml(this.max) : null}\n            onInput={this.handleDateChange}\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-datetime-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}
+{"file":"p-DnMRLbBX.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/inputs/date-time-selector/udp-datetime-selector.css?tag=udp-datetime-selector&encapsulation=shadow","src/components/my-component/UI/inputs/date-time-selector/udp-datetime-selector.tsx"],"sourcesContent":["@import '../inputs.css';\n\n:host(.full-width-host) {\n  width: 100%;\n}","import { Component, h, Host, State, EventEmitter, Prop, Event, Watch } from '@stencil/core';\nimport { InputSize, InputMargin } from '../input-types';\n\n/**\n * A standardized date-time input component with validation, min/max constraints, and timezone handling.\n * Supports both controlled and uncontrolled modes.\n *\n * This component emits a custom `change` event with the committed value and also\n * propagates standard DOM events like `input`, `focus`, and `blur` from the\n * underlying input element.\n *\n * **Date Handling:**\n * - Uses HTML5 `datetime-local` input for consistent browser behavior\n * - Handles timezone compensation for accurate date storage\n * - Supports ISO date strings and JavaScript Date constructor formats\n *\n * @example\n * ```tsx\n * // Uncontrolled component with initial value\n * <udp-datetime-selector\n *   label=\"Meeting Time\"\n *   initialValue=\"2024-12-25T14:30\"\n *   onChange={(e) => console.log('Selected:', e.detail)}\n * />\n *\n * // Controlled component\n * <udp-datetime-selector\n *   label=\"Appointment\"\n *   value={appointmentTime}\n *   onChange={(e) => setAppointmentTime(e.detail)}\n * />\n *\n * // With validation and constraints\n * <udp-datetime-selector\n *   label=\"Event Date\"\n *   value={eventDate}\n *   min=\"2024-01-01T00:00\"\n *   max=\"2024-12-31T23:59\"\n *   required={true}\n *   error={dateError}\n *   onChange={handleDateChange}\n * />\n * ```\n */\n@Component({\n  tag: 'udp-datetime-selector',\n  styleUrl: 'udp-datetime-selector.css',\n  shadow: true,\n})\nexport class UdpDateTimeSelector {\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 date-time value allowed. Supports any date format supported by the JavaScript Date constructor.\n   * Recommended format: ISO 8601 (YYYY-MM-DDTHH:mm) for consistency.\n   */\n  @Prop() min: string;\n\n  /**\n   * Maximum date-time value allowed. Supports any date format supported by the JavaScript Date constructor.\n   * Recommended format: ISO 8601 (YYYY-MM-DDTHH:mm) for consistency.\n   */\n  @Prop() max: string;\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   * Whether the field is required for form submission. Adds visual indicator (*) and validation.\n   */\n  @Prop() required: boolean;\n\n  /**\n   * Initial value for the date-time selector. 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   * Current value of the date-time selector. 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   * 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  /**\n   * Internal value state. Manages the current date-time value independently of props.\n   * @internal\n   */\n  @State() internalValue: string = '';\n\n  /**\n   * Internal error message state. Manages display of validation errors.\n   * @internal\n   */\n  @State() errorMessage: string;\n\n  /**\n   * Emitted when the date-time 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 date-time selector in ISO format\n   *\n   * @example\n   * ```tsx\n   * <udp-datetime-selector onChange={(e) => handleDateChange(e.detail)} />\n   * ```\n   */\n  @Event() change: EventEmitter<string>;\n\n\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 or if this is an uncontrolled component.\n   * @internal\n   */\n  @Watch('initialValue')\n  initialValueChanged(newValue: string) {\n    // Only update if we don't have a value yet or if this is uncontrolled (no value prop)\n    if ((this.internalValue === '' || this.internalValue === undefined) || this.value === undefined) {\n      if (newValue !== undefined) {\n        this.internalValue = newValue;\n      }\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  valueChanged() {\n    // If value prop is provided, this is a controlled component\n    if (this.value !== undefined && this.value !== this.internalValue) {\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 value: use value prop if provided (controlled), otherwise use initialValue (uncontrolled)\n    this.internalValue = this.value !== undefined ? this.value : (this.initialValue || '');\n\n    if (this.error) {\n      this.errorMessage = this.error;\n    }\n  }\n\n  /**\n   * Handles input events (date-time changes). Updates internal state and emits events.\n   * For controlled components, also updates the value prop.\n   * @param event - The native input event\n   * @internal\n   */\n  private handleDateChange = (event: Event) => {\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    // Emit events for real-time and committed updates\n    this.change.emit(newValue);\n  }\n\n  /**\n   * Handles blur events. Event bubbles up to stencil-field automatically.\n   * @param event - The focus event\n   * @internal\n   */\n  private handleBlur = () => {\n    // Event will bubble up to stencil-field automatically\n  }\n\n  /**\n   * Handles focus events. Event bubbles up to stencil-field automatically.\n   * @param event - The focus event\n   * @internal\n   */\n  private handleFocus = () => {\n    // Event will bubble up to stencil-field automatically\n  }\n\n  /**\n   * Formats a date string for HTML datetime-local input.\n   * Handles timezone compensation to prevent JavaScript's automatic timezone adjustment.\n   * @param dateString - Date string to format\n   * @returns Formatted date string (YYYY-MM-DDTHH:mm) or null if invalid\n   * @internal\n   */\n  formatDateForHtml(dateString: string) {\n    // convert to date\n    const date = new Date(dateString);\n\n    if (isNaN(new Date(date)?.getTime())) return null;\n\n    // when converting to ISO string, javascript will edit the date to compensate for the timezone, we dont want that here so we manually subtract the offset that it will add\n\n    date?.setTime(date?.getTime() - date?.getTimezoneOffset() * 60 * 1000);\n\n    const isoString = date?.toISOString();\n    if (!isoString) return null;\n    // html wants the format YYYY-MM-DDThh:mm, ISO strings have YYYY-MM-DDTHH:MM:SS.mmmZ, so split it on ':' and take the first 2 sections\n    const splitISO = isoString.split(':');\n\n    return `${splitISO[0]}:${splitISO[1]}`;\n  }\n\n  /**\n   * Renders the date-time selector component.\n   * @returns JSX element\n   * @internal\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('datetime-selector--disabled');\n    }\n    if (this.fullWidth) {\n      classNames.push('bx--text-input--full-width');\n    }\n    const inputClass = classNames.join(' ');\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=\"datetime-local\"\n            id={this.id}\n            name={this.name}\n            class={inputClass}\n            value={this.internalValue}\n            min={this.min ? this.formatDateForHtml(this.min) : null}\n            max={this.max ? this.formatDateForHtml(this.max) : null}\n            onInput={this.handleDateChange}\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-datetime-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-ChdtzL8Z.js → p-Dpvhge5H.js}

@@ -1,8 +1,9 @@
 import { p as proxyCustomElement, H, h, F as Fragment } from './p-DPon6DDX.js';
-import { d as defineCustomElement$5 } from './p-HrsHnWeG.js';
-import { d as defineCustomElement$4 } from './p-DzaN4l_Y.js';
-import { d as defineCustomElement$3 } from './p-DMcaGgHq.js';
-import { d as defineCustomElement$2 } from './p-Bdt-oOnd.js';
+import { U as UdpFormsFieldTypeEnum } from './p-DtiAfg0X.js';
+import { d as defineCustomElement$5 } from './p-6EzLtNtq.js';
+import { d as defineCustomElement$4 } from './p-Cp1kbBGM.js';
+import { d as defineCustomElement$3 } from './p-DnMRLbBX.js';
+import { d as defineCustomElement$2 } from './p-Oil5iqFm.js';
 import { d as defineCustomElement$1 } from './p-DkppmXNM.js';
 
 const dateTimeRendererCss = ":host{display:block}.question-item-date-inputs-container,.question-item-time-inputs-container,.question-item-date-time-inputs-container{display:flex;flex-direction:column;gap:var(--spacing-04, 16px)}.question-item-date-inputs-container-date-range,.question-item-date-inputs-container-time-range,.question-item-date-inputs-container-datetime-range{display:flex;flex-direction:row;gap:var(--spacing-04, 16px)}";
@@ -16,7 +17,7 @@ const DateTimeRenderer = /*@__PURE__*/ proxyCustomElement(class DateTimeRenderer
     renderSwitch() {
         var _a;
         switch (this.question.fieldTypeId) {
-            case 9: // Date Selector
+            case UdpFormsFieldTypeEnum.DateSelector: // Date Selector
                 return (h("div", { class: "question-item-date-inputs-container" }, h("div", { class: "question-item-date-inputs-container-date-range" }, h("udp-date-selector", { label: "Min Date", value: this.question.fieldProperties.minDate, fullWidth: true, onChange: e => {
                         if (this.isViewOnly)
                             return;
@@ -36,7 +37,7 @@ const DateTimeRenderer = /*@__PURE__*/ proxyCustomElement(class DateTimeRenderer
                         const updated = handler(this.formSectionsDraft, this.sIndex, this.qIndex, 'allowFutureDate');
                         this.onFormSectionsDraftChange(updated);
                     }, labelPosition: "right" })));
-            case 10: // Time Selector
+            case UdpFormsFieldTypeEnum.TimeSelector: // Time Selector
                 return (h("div", { class: "question-item-time-inputs-container" }, h("div", { class: "question-item-date-inputs-container-time-range" }, h("udp-time-selector", { label: "Min Time", value: this.question.fieldProperties.minTime, fullWidth: true, onChange: e => {
                         if (this.isViewOnly)
                             return;
@@ -50,7 +51,7 @@ const DateTimeRenderer = /*@__PURE__*/ proxyCustomElement(class DateTimeRenderer
                         const updated = handler(e, this.formSectionsDraft, this.sIndex, this.qIndex, 'maxTime');
                         this.onFormSectionsDraftChange(updated);
                     } }))));
-            case 11: // DateTime Selector
+            case UdpFormsFieldTypeEnum.DateTimeSelector: // DateTime Selector
                 return (h(Fragment, null, h("div", { class: "question-item-date-time-inputs-container" }, h("div", { class: "question-item-date-inputs-container-datetime-range" }, h("udp-datetime-selector", { label: "Min Datetime", value: this.question.fieldProperties.minDateTime, fullWidth: true, onChange: e => {
                         if (this.isViewOnly)
                             return;
@@ -127,6 +128,6 @@ function defineCustomElement() {
 }
 
 export { DateTimeRenderer as D, defineCustomElement as d };
-//# sourceMappingURL=p-ChdtzL8Z.js.map
+//# sourceMappingURL=p-Dpvhge5H.js.map
 
-//# sourceMappingURL=p-ChdtzL8Z.js.map
+//# sourceMappingURL=p-Dpvhge5H.js.map

package/dist/components/p-Dpvhge5H.js.map

@@ -0,0 +1 @@
+{"file":"p-Dpvhge5H.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/date-time-renderer.css?tag=date-time-renderer&encapsulation=shadow","src/components/my-component/UI/forms/udp-forms/udp-forms-builder/udp-forms-builder-item/question_type_renderers/date-time-renderer.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.question-item-date-inputs-container,\n.question-item-time-inputs-container,\n.question-item-date-time-inputs-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-04, 16px);\n}\n\n.question-item-date-inputs-container-date-range,\n.question-item-date-inputs-container-time-range,\n.question-item-date-inputs-container-datetime-range {\n  display: flex;\n  flex-direction: row;\n  gap: var(--spacing-04, 16px);\n}\n","import { Component, Fragment, h, Prop } from '@stencil/core';\nimport { UdpFormQuestion } from 'src/components/my-component/UI/forms/udp-forms/types'; // Using path that worked previously\nimport { UdpFormsFieldTypeEnum } from '../../../enums';\n\n// We will need to import any components used like udp-date-selector, udp-time-selector, udp-datetime-selector, stencil-toggle, unity-typography etc.\n// This will require knowing their correct import paths or ensuring they are globally available.\n\n@Component({\n  tag: 'date-time-renderer',\n  styleUrl: 'date-time-renderer.css',\n  shadow: true,\n})\nexport class DateTimeRenderer {\n  @Prop() question: UdpFormQuestion;\n  @Prop() isViewOnly: boolean;\n  @Prop() formSectionsDraft: any[][];\n  @Prop() sIndex: number;\n  @Prop() qIndex: number;\n  @Prop() onFormSectionsDraftChange: (updatedSections: any[][]) => void;\n  @Prop() getHandler: (fieldTypeId: number, handlerName: string) => any;\n\n  renderSwitch() {\n    switch (this.question.fieldTypeId) {\n      case UdpFormsFieldTypeEnum.DateSelector: // Date Selector\n        return (\n          <div class=\"question-item-date-inputs-container\">\n            <div class=\"question-item-date-inputs-container-date-range\">\n              <udp-date-selector\n                label=\"Min Date\"\n                value={this.question.fieldProperties.minDate}\n                fullWidth={true}\n                onChange={e => {\n                  if (this.isViewOnly) return;\n                  const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyDateTime');\n                  const updated = handler(e, this.formSectionsDraft, this.sIndex, this.qIndex, 'minDate');\n                  this.onFormSectionsDraftChange(updated);\n                }}\n              ></udp-date-selector>\n              <udp-date-selector\n                label=\"Max Date\"\n                value={this.question.fieldProperties.maxDate}\n                fullWidth={true}\n                onChange={e => {\n                  if (this.isViewOnly) return;\n                  const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyDateTime');\n                  const updated = handler(e, this.formSectionsDraft, this.sIndex, this.qIndex, 'maxDate');\n                  this.onFormSectionsDraftChange(updated);\n                }}\n              ></udp-date-selector>\n            </div>\n            <stencil-toggle\n              label=\"Allow Future Date\"\n              disabled={this.isViewOnly}\n              checked={this.question.fieldProperties.allowFutureDate === true}\n              onToggledChange={() => {\n                if (this.isViewOnly) return;\n                const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyBooleanToggle');\n                const updated = handler(this.formSectionsDraft, this.sIndex, this.qIndex, 'allowFutureDate');\n                this.onFormSectionsDraftChange(updated);\n              }}\n              labelPosition=\"right\"\n            ></stencil-toggle>\n          </div>\n        );\n      case UdpFormsFieldTypeEnum.TimeSelector: // Time Selector\n        return (\n          <div class=\"question-item-time-inputs-container\">\n            <div class=\"question-item-date-inputs-container-time-range\">\n              <udp-time-selector\n                label=\"Min Time\"\n                value={this.question.fieldProperties.minTime}\n                fullWidth={true}\n                onChange={e => {\n                  if (this.isViewOnly) return;\n                  const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyDateTime');\n                  const updated = handler(e, this.formSectionsDraft, this.sIndex, this.qIndex, 'minTime');\n                  this.onFormSectionsDraftChange(updated);\n                }}\n              ></udp-time-selector>\n              <udp-time-selector\n                label=\"Max Time\"\n                value={this.question.fieldProperties.maxTime}\n                fullWidth={true}\n                onChange={e => {\n                  if (this.isViewOnly) return;\n                  const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyDateTime');\n                  const updated = handler(e, this.formSectionsDraft, this.sIndex, this.qIndex, 'maxTime');\n                  this.onFormSectionsDraftChange(updated);\n                }}\n              ></udp-time-selector>\n            </div>\n          </div>\n        );\n      case UdpFormsFieldTypeEnum.DateTimeSelector: // DateTime Selector\n        return (\n          <Fragment>\n            <div class=\"question-item-date-time-inputs-container\">\n              <div class=\"question-item-date-inputs-container-datetime-range\">\n                <udp-datetime-selector\n                  label=\"Min Datetime\"\n                  value={this.question.fieldProperties.minDateTime}\n                  fullWidth={true}\n                  onChange={e => {\n                    if (this.isViewOnly) return;\n                    const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyDateTime');\n                    const updated = handler(e, this.formSectionsDraft, this.sIndex, this.qIndex, 'minDateTime');\n                    this.onFormSectionsDraftChange(updated);\n                  }}\n                ></udp-datetime-selector>\n                <udp-datetime-selector\n                  label=\"Max Datetime\"\n                  value={this.question.fieldProperties.maxDateTime}\n                  fullWidth={true}\n                  onChange={e => {\n                    if (this.isViewOnly) return;\n                    const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyDateTime');\n                    const updated = handler(e, this.formSectionsDraft, this.sIndex, this.qIndex, 'maxDateTime');\n                    this.onFormSectionsDraftChange(updated);\n                  }}\n                ></udp-datetime-selector>\n              </div>\n              <div class=\"question-item-future-date-container\">\n                <stencil-toggle\n                  label=\"Allow Future Date\"\n                  disabled={this.isViewOnly}\n                  checked={!!this.question.fieldProperties?.allowFutureDate}\n                  onToggledChange={() => {\n                    if (this.isViewOnly) return;\n                    const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyBooleanToggle');\n                    const updated = handler(this.formSectionsDraft, this.sIndex, this.qIndex, 'allowFutureDate');\n                    this.onFormSectionsDraftChange(updated);\n                  }}\n                  labelPosition=\"right\"\n                ></stencil-toggle>\n              </div>\n            </div>\n          </Fragment>\n        );\n      default:\n        return null;\n    }\n  }\n\n  render() {\n    return this.renderSwitch();\n  }\n}\n"],"version":3}

package/dist/components/p-DtiAfg0X.js

@@ -0,0 +1,25 @@
+var UdpFormsFieldTypeEnum;
+(function (UdpFormsFieldTypeEnum) {
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["Hidden"] = 1] = "Hidden";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["SingleLineText"] = 2] = "SingleLineText";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["MultiLineText"] = 3] = "MultiLineText";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["Checkbox"] = 4] = "Checkbox";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["RadioButton"] = 5] = "RadioButton";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["DropdownSingleSelect"] = 6] = "DropdownSingleSelect";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["DropdownMultipleSelect"] = 7] = "DropdownMultipleSelect";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["ListMultiSelect"] = 8] = "ListMultiSelect";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["DateSelector"] = 9] = "DateSelector";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["TimeSelector"] = 10] = "TimeSelector";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["DateTimeSelector"] = 11] = "DateTimeSelector";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["FileUpload"] = 12] = "FileUpload";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["YesNo"] = 13] = "YesNo";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["Signature"] = 14] = "Signature";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["Tally"] = 15] = "Tally";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["Number"] = 16] = "Number";
+    UdpFormsFieldTypeEnum[UdpFormsFieldTypeEnum["Paragraph"] = 17] = "Paragraph";
+})(UdpFormsFieldTypeEnum || (UdpFormsFieldTypeEnum = {}));
+
+export { UdpFormsFieldTypeEnum as U };
+//# sourceMappingURL=p-DtiAfg0X.js.map
+
+//# sourceMappingURL=p-DtiAfg0X.js.map

package/dist/components/p-DtiAfg0X.js.map

@@ -0,0 +1 @@
+{"file":"p-DtiAfg0X.js","mappings":"IAAY;AAAZ,CAAA,UAAY,qBAAqB,EAAA;AAC7B,IAAA,qBAAA,CAAA,qBAAA,CAAA,QAAA,CAAA,GAAA,CAAA,CAAA,GAAA,QAAU;AACV,IAAA,qBAAA,CAAA,qBAAA,CAAA,gBAAA,CAAA,GAAA,CAAA,CAAA,GAAA,gBAAkB;AAClB,IAAA,qBAAA,CAAA,qBAAA,CAAA,eAAA,CAAA,GAAA,CAAA,CAAA,GAAA,eAAiB;AACjB,IAAA,qBAAA,CAAA,qBAAA,CAAA,UAAA,CAAA,GAAA,CAAA,CAAA,GAAA,UAAY;AACZ,IAAA,qBAAA,CAAA,qBAAA,CAAA,aAAA,CAAA,GAAA,CAAA,CAAA,GAAA,aAAe;AACf,IAAA,qBAAA,CAAA,qBAAA,CAAA,sBAAA,CAAA,GAAA,CAAA,CAAA,GAAA,sBAAwB;AACxB,IAAA,qBAAA,CAAA,qBAAA,CAAA,wBAAA,CAAA,GAAA,CAAA,CAAA,GAAA,wBAA0B;AAC1B,IAAA,qBAAA,CAAA,qBAAA,CAAA,iBAAA,CAAA,GAAA,CAAA,CAAA,GAAA,iBAAmB;AACnB,IAAA,qBAAA,CAAA,qBAAA,CAAA,cAAA,CAAA,GAAA,CAAA,CAAA,GAAA,cAAgB;AAChB,IAAA,qBAAA,CAAA,qBAAA,CAAA,cAAA,CAAA,GAAA,EAAA,CAAA,GAAA,cAAiB;AACjB,IAAA,qBAAA,CAAA,qBAAA,CAAA,kBAAA,CAAA,GAAA,EAAA,CAAA,GAAA,kBAAqB;AACrB,IAAA,qBAAA,CAAA,qBAAA,CAAA,YAAA,CAAA,GAAA,EAAA,CAAA,GAAA,YAAe;AACf,IAAA,qBAAA,CAAA,qBAAA,CAAA,OAAA,CAAA,GAAA,EAAA,CAAA,GAAA,OAAU;AACV,IAAA,qBAAA,CAAA,qBAAA,CAAA,WAAA,CAAA,GAAA,EAAA,CAAA,GAAA,WAAc;AACd,IAAA,qBAAA,CAAA,qBAAA,CAAA,OAAA,CAAA,GAAA,EAAA,CAAA,GAAA,OAAU;AACV,IAAA,qBAAA,CAAA,qBAAA,CAAA,QAAA,CAAA,GAAA,EAAA,CAAA,GAAA,QAAW;AACX,IAAA,qBAAA,CAAA,qBAAA,CAAA,WAAA,CAAA,GAAA,EAAA,CAAA,GAAA,WAAc;AAChB,CAAC,EAlBS,qBAAqB,KAArB,qBAAqB,GAkB9B,EAAA,CAAA,CAAA;;;;","names":[],"sources":["src/components/my-component/UI/forms/udp-forms/enums.ts"],"sourcesContent":["export enum UdpFormsFieldTypeEnum {\n    Hidden = 1,\n    SingleLineText = 2,\n    MultiLineText = 3,\n    Checkbox = 4,\n    RadioButton = 5,\n    DropdownSingleSelect = 6,\n    DropdownMultipleSelect = 7,\n    ListMultiSelect = 8,\n    DateSelector = 9,\n    TimeSelector = 10,\n    DateTimeSelector = 11,\n    FileUpload = 12,\n    YesNo = 13,\n    Signature = 14,\n    Tally = 15,\n    Number = 16,\n    Paragraph = 17\n  }\n"],"version":3}

package/dist/components/{p-XoXMxeuq.js → p-Dwnxv7WO.js}

@@ -10,7 +10,7 @@ const AmbientDemoContainer = /*@__PURE__*/ proxyCustomElement(class AmbientDemoC
         this.__attachShadow();
     }
     render() {
-        return (h("div", { key: '1ae64499422d23a16bf1119a8d9f06f3502adc7e', class: "container" }, h("div", { key: '1d0feef16ae20855b25c8ac7120c444f5c0d8988', class: "title-container" }, " ", h("unity-typography", { key: '6539e873263b38ffa32caf26fb7eb25e4f8d5f93', variant: "button" }, " ", this.title, " "), " "), h("slot", { key: '7b367238cde374b88c6637908788f23ea4fc8f40' })));
+        return (h("div", { key: '35d81b468e19b8871ec965188504b71ae4922054', class: "container" }, h("div", { key: 'ac57303ecd758ef8b94aa303831ef31cdc7b204f', class: "title-container" }, " ", h("unity-typography", { key: 'c5e7bde5ea06c4f71d2130a9732ff9adf93305c9', variant: "button" }, " ", this.title, " "), " "), h("slot", { key: '9c69947927da837896e20a35a401af20fd14ae4c' })));
     }
     static get style() { return ambientDemoContainerCss; }
 }, [1, "ambient-demo-container", {
@@ -36,6 +36,6 @@ function defineCustomElement() {
 }
 
 export { AmbientDemoContainer as A, defineCustomElement as d };
-//# sourceMappingURL=p-XoXMxeuq.js.map
+//# sourceMappingURL=p-Dwnxv7WO.js.map
 
-//# sourceMappingURL=p-XoXMxeuq.js.map
+//# sourceMappingURL=p-Dwnxv7WO.js.map

package/dist/components/{p-XoXMxeuq.js.map → p-Dwnxv7WO.js.map}

@@ -1 +1 @@
-{"file":"p-XoXMxeuq.js","mappings":";;;AAAA,MAAM,uBAAuB,GAAG,4NAA4N;;MCO/O,oBAAoB,iBAAAA,kBAAA,CAAA,MAAA,oBAAA,SAAAC,CAAA,CAAA;;;;;;IAG/B,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EACpB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,OAAG,CAAkB,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAC,QAAQ,EAAA,OAAG,IAAI,CAAC,KAAK,EAAqB,GAAA,CAAA,EAAO,GAAA,CAAA,EAE1G,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/demo/ambient-demo-container.css?tag=ambient-demo-container&encapsulation=shadow","src/components/my-component/demo/ambient-demo-container.tsx"],"sourcesContent":[".container {\n    background-color: white;\n    padding: 20px;\n    border-radius: 8px;\n    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n    margin-top: 40px;\n    margin-bottom: 40px;\n  }\n  \n  .title {\n    font-size: 1.2em;\n    margin-bottom: 16px;\n  }\n  \n  .title-container {\n    margin-bottom: 16px;\n  }","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'ambient-demo-container',\n  styleUrl: 'ambient-demo-container.css',\n  shadow: true,\n})\nexport class AmbientDemoContainer {\n  @Prop() title: string;\n\n  render() {\n    return (\n      <div class=\"container\">\n        <div class=\"title-container\" > <unity-typography variant=\"button\"> {this.title} </unity-typography> </div>\n        \n        <slot></slot>\n      </div>\n    );\n  }\n}\n "],"version":3}
+{"file":"p-Dwnxv7WO.js","mappings":";;;AAAA,MAAM,uBAAuB,GAAG,4NAA4N;;MCO/O,oBAAoB,iBAAAA,kBAAA,CAAA,MAAA,oBAAA,SAAAC,CAAA,CAAA;;;;;;IAG/B,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EACpB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,OAAG,CAAkB,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAC,QAAQ,EAAA,OAAG,IAAI,CAAC,KAAK,EAAqB,GAAA,CAAA,EAAO,GAAA,CAAA,EAE1G,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/demo/ambient-demo-container.css?tag=ambient-demo-container&encapsulation=shadow","src/components/my-component/demo/ambient-demo-container.tsx"],"sourcesContent":[".container {\n    background-color: white;\n    padding: 20px;\n    border-radius: 8px;\n    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n    margin-top: 40px;\n    margin-bottom: 40px;\n  }\n  \n  .title {\n    font-size: 1.2em;\n    margin-bottom: 16px;\n  }\n  \n  .title-container {\n    margin-bottom: 16px;\n  }","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'ambient-demo-container',\n  styleUrl: 'ambient-demo-container.css',\n  shadow: true,\n})\nexport class AmbientDemoContainer {\n  @Prop() title: string;\n\n  render() {\n    return (\n      <div class=\"container\">\n        <div class=\"title-container\" > <unity-typography variant=\"button\"> {this.title} </unity-typography> </div>\n        \n        <slot></slot>\n      </div>\n    );\n  }\n}\n "],"version":3}

package/dist/components/{p-BvSuY3tY.js → p-Dx5ehH3t.js}

@@ -125,18 +125,18 @@ const NumericField = /*@__PURE__*/ proxyCustomElement(class NumericField extends
             'bx--text-input--error': isError,
             'text-field--disabled': this.disabled,
         };
-        return (h(Host, { key: '7d776c36ad5501bb3f374e944ffe45e9eeec6c23', class: {
+        return (h(Host, { key: '32ef2570f39039046ca11f41eca52febeae693ec', class: {
                 'udp-input': true,
                 'udp-input--error': isError,
                 'udp-input--disabled': this.disabled,
                 'udp-input--hidden': this.hidden,
                 'udp-input--required': this.required,
-                'udp-input--readonly': this.readOnly,
+                'udp-input--readonly': this.readonly,
                 [`udp-input--size-${this.size}`]: true,
                 [`udp-input--margin-${this.margin}`]: true,
-            }, "aria-invalid": isError ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false' }, h("div", { key: 'be538a9c56bd08eab7223fef6ee9da24403c718b', class: "bx--form-item" }, h("unity-typography", { key: '46d18c808bbe451b4190acc8ee311e3bfbffd730', variant: "caption-text" }, h("label", { key: '263cf55793ddfa48b0673f56e21e0f1b0baaae32', htmlFor: this.id, class: "bx--label" }, this.label, this.required ? '*' : '')), this.hidden ? (h("input", { id: this.id, type: "hidden", value: this.internalValue, name: this.name })) : (h("input", { id: this.id, name: this.name, type: "number", class: Object.assign({}, inputClass), placeholder: this.placeholder, value: this.internalValue, required: this.required, disabled: this.disabled, readOnly: this.readOnly, onFocus: this.onFocus, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, inputMode: this.inputMode, min: this.min, max: this.max, step: this.step,
+            }, "aria-invalid": isError ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false' }, h("div", { key: '0e7a7e10a09c8f9884eca3156897cacb6e0dde56', class: "bx--form-item" }, h("unity-typography", { key: 'e277cf047ef5a7ecf0a886406ad6043b0a0f6112', variant: "caption-text" }, h("label", { key: '522fb1b279e0a6bbb1370ce3fe8f3862222af545', htmlFor: this.id, class: "bx--label" }, this.label, this.required ? '*' : '')), this.hidden ? (h("input", { id: this.id, type: "hidden", value: this.internalValue, name: this.name })) : (h("input", { id: this.id, name: this.name, type: "number", class: Object.assign({}, inputClass), placeholder: this.placeholder, value: this.internalValue, required: this.required, disabled: this.disabled, readOnly: this.readonly, onFocus: this.onFocus, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, inputMode: this.inputMode, min: this.min, max: this.max, step: this.step,
             //@ts-ignore
-            udprecordid: 'udpRecord-number-field-' + this.id })), isError && (h("div", { key: '9a374f9fe28eded7695ddf789ef1228aff14e493', class: "error-message" }, h("unity-typography", { key: '1cdcd1f2fb2cf057c6b3b39fedc7daa79534cfb4', variant: "caption-text", color: "error" }, this.errorMessage))))));
+            udprecordid: 'udpRecord-number-field-' + this.id })), isError && (h("div", { key: 'fcd472c0b004963ec052c3d9a00d52aaf008fbd2', class: "error-message" }, h("unity-typography", { key: 'e864b6079624297f1bd9e837579e24132a3390d9', variant: "caption-text", color: "error" }, this.errorMessage))))));
     }
     static get watchers() { return {
         "error": ["updateError"],
@@ -150,7 +150,7 @@ const NumericField = /*@__PURE__*/ proxyCustomElement(class NumericField extends
         "label": [1],
         "placeholder": [1],
         "required": [4],
-        "readOnly": [4, "read-only"],
+        "readonly": [4],
         "disabled": [4],
         "maxCharacter": [2, "max-character"],
         "initialValue": [1, "initial-value"],
@@ -190,6 +190,6 @@ function defineCustomElement() {
 }
 
 export { NumericField as N, defineCustomElement as d };
-//# sourceMappingURL=p-BvSuY3tY.js.map
+//# sourceMappingURL=p-Dx5ehH3t.js.map
 
-//# sourceMappingURL=p-BvSuY3tY.js.map
+//# sourceMappingURL=p-Dx5ehH3t.js.map

package/dist/components/{p-BvSuY3tY.js.map → p-Dx5ehH3t.js.map}

@@ -1 +1 @@
-{"file":"p-BvSuY3tY.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/inputs/numeric-field/numeric-field.css?tag=numeric-field&encapsulation=shadow","src/components/my-component/UI/inputs/numeric-field/numeric-field.tsx"],"sourcesContent":["@import '../inputs.css';","import {\n  Component,\n  Prop,\n  h,\n  Host,\n  State,\n  Event,\n  EventEmitter,\n  Watch,\n} from '@stencil/core';\nimport { InputSize, InputMargin } from '../input-types';\n\n/**\n * A standardized numeric input field component with validation, error handling, and number constraints.\n * Supports both controlled and uncontrolled modes.\n *\n * This component emits a custom `change` event with the committed value and also\n * propagates standard DOM events like `input`, `focus`, and `blur` from the\n * underlying input element.\n *\n * @example\n * ```tsx\n * // Uncontrolled component with initial value\n * <numeric-field\n *   placeholder=\"Enter age\"\n *   initialValue=\"25\"\n *   min=\"0\"\n *   max=\"120\"\n *   onChange={(e) => console.log('Age:', e.detail)}\n * />\n *\n * // Controlled component\n * <numeric-field\n *   placeholder=\"Enter price\"\n *   value={priceValue}\n *   step=\"0.01\"\n *   min=\"0\"\n *   onChange={(e) => setPriceValue(e.detail)}\n * />\n *\n * // With validation and constraints\n * <numeric-field\n *   label=\"Quantity\"\n *   placeholder=\"Enter quantity\"\n *   required={true}\n *   error={quantityError}\n *   value={quantity}\n *   min=\"1\"\n *   max=\"999\"\n *   step=\"1\"\n *   onChange={handleQuantityChange}\n * />\n * ```\n */\n@Component({\n  tag: 'numeric-field',\n  styleUrl: 'numeric-field.css',\n  shadow: true,\n})\nexport class NumericField {\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   * 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   * Initial value for the numeric 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   * Current value of the numeric 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   * 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 numeric input.\n   * Common values: 'numeric', 'decimal'\n   */\n  @Prop() inputMode: string;\n\n  /**\n   * Minimum value allowed for the numeric input. Enforces lower bounds validation.\n   */\n  @Prop() min: string;\n\n  /**\n   * Maximum value allowed for the numeric input. Enforces upper bounds validation.\n   */\n  @Prop() max: string;\n\n  /**\n   * Step value for numeric input increments. Defines the granularity of allowed values.\n   * For example, \"0.01\" for currency, \"1\" for integers.\n   */\n  @Prop() step: 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 value state. Manages the current input value independently of props.\n   * @internal\n   */\n  @State() internalValue: string = '';\n\n  /**\n   * Internal error message state. Manages display of validation errors.\n   * @internal\n   */\n  @State() errorMessage: string;\n\n  /**\n   * Emitted when the numeric 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 numeric field\n   *\n   * @example\n   * ```tsx\n   * <numeric-field onChange={(e) => handleValueChange(e.detail)} />\n   * ```\n   */\n  @Event() change: EventEmitter<string>;\n\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 or if this is an uncontrolled component.\n   * @internal\n   */\n  @Watch('initialValue')\n  initialValueChanged(newValue: string) {\n    // Only update if we don't have a value yet or if this is uncontrolled (no value prop)\n    if ((this.internalValue === '' || this.internalValue === undefined) || this.value === undefined) {\n      if (newValue !== undefined) {\n        this.internalValue = newValue;\n      }\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  valueChanged() {\n    // If value prop is provided, this is a controlled component\n    if (this.value !== undefined && this.value !== this.internalValue) {\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 value: use value prop if provided (controlled), otherwise use initialValue (uncontrolled)\n    this.internalValue = this.value !== undefined ? this.value : (this.initialValue || '');\n\n    if (this.error) {\n      this.errorMessage = this.error;\n    }\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    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    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  /**\n   * Handles focus events. Event bubbles up to stencil-field automatically.\n   * @internal\n   */\n  private onFocus = () => {\n    // Event will bubble up to stencil-field automatically\n  }\n\n  /**\n   * Handles blur events. Event bubbles up to stencil-field automatically.\n   * @internal\n   */\n  private onBlur = () => {\n    // Event will bubble up to stencil-field automatically\n  }\n\n  /**\n   * Renders the numeric field component.\n   * @returns JSX element\n   * @internal\n   */\n  render() {\n    const isError = !!this.errorMessage;\n\n    const inputClass = {\n      'bx--text-input': true,\n      'bx--text-input--error': 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--hidden': this.hidden,\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        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} name={this.name} />\n          ) : (\n            <input\n              id={this.id}\n              name={this.name}\n              type=\"number\"\n              class={{ ...inputClass }}\n              placeholder={this.placeholder}\n              value={this.internalValue}\n              required={this.required}\n              disabled={this.disabled}\n              readOnly={this.readOnly}\n              onFocus={this.onFocus}\n              onInput={this.onInput}\n              onChange={this.onChange}\n              onBlur={this.onBlur}\n              inputMode={this.inputMode}\n              min={this.min}\n              max={this.max}\n              step={this.step}\n              //@ts-ignore\n              udprecordid={'udpRecord-number-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}
+{"file":"p-Dx5ehH3t.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,6pNAA6pN;;MC2DxqN,YAAY,iBAAAA,kBAAA,CAAA,MAAA,YAAA,SAAAC,CAAA,CAAA;AALzB,IAAA,WAAA,GAAA;;;;;AA+DE;;AAEG;AACK,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE;AAwB1B;;;;;AAKG;AACK,QAAA,IAAI,CAAA,IAAA,GAAc,QAAQ;AAElC;;;;;AAKG;AACK,QAAA,IAAM,CAAA,MAAA,GAAgB,QAAQ;AAEtC;;;AAGG;AACM,QAAA,IAAa,CAAA,aAAA,GAAW,EAAE;AAyEnC;;;;;AAKG;AACK,QAAA,IAAA,CAAA,OAAO,GAAG,CAAC,KAAiB,KAAI;AACtC,YAAA,MAAM,QAAQ,GAAI,KAAK,CAAC,MAA2B,CAAC,KAAK;AACzD,YAAA,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC;;AAG9B,YAAA,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;AAC5B,gBAAA,IAAI,CAAC,KAAK,GAAG,QAAQ;;AAEzB,SAAC;AAED;;;;AAIG;AACK,QAAA,IAAA,CAAA,QAAQ,GAAG,CAAC,KAAY,KAAI;AAClC,YAAA,MAAM,QAAQ,GAAI,KAAK,CAAC,MAA2B,CAAC,KAAK;;AAEzD,YAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;AAC5B,SAAC;AAED;;;AAGG;AACK,QAAA,IAAO,CAAA,OAAA,GAAG,MAAK;;AAEvB,SAAC;AAED;;;AAGG;AACK,QAAA,IAAM,CAAA,MAAA,GAAG,MAAK;;AAEtB,SAAC;AAuEF;AAlKC;;;AAGG;IAEH,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK;;AAGhC;;;;AAIG;AAEH,IAAA,mBAAmB,CAAC,QAAgB,EAAA;;QAElC,IAAI,CAAC,IAAI,CAAC,aAAa,KAAK,EAAE,IAAI,IAAI,CAAC,aAAa,KAAK,SAAS,KAAK,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;AAC/F,YAAA,IAAI,QAAQ,KAAK,SAAS,EAAE;AAC1B,gBAAA,IAAI,CAAC,aAAa,GAAG,QAAQ;;;;AAKnC;;;;AAIG;IAEH,YAAY,GAAA;;AAEV,QAAA,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,aAAa,EAAE;AACjE,YAAA,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK;;;AAInC;;;AAGG;IACH,iBAAiB,GAAA;;QAEf,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,KAAK,SAAS,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,YAAY,IAAI,EAAE,CAAC;AAEtF,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK;;;AA+ClC;;;;AAIG;IACH,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,YAAY;AAEnC,QAAA,MAAM,UAAU,GAAG;AACjB,YAAA,gBAAgB,EAAE,IAAI;AACtB,YAAA,uBAAuB,EAAE,OAAO;YAChC,sBAAsB,EAAE,IAAI,CAAC,QAAQ;SACtC;QACD,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE;AACL,gBAAA,WAAW,EAAE,IAAI;AACjB,gBAAA,kBAAkB,EAAE,OAAO;gBAC3B,qBAAqB,EAAE,IAAI,CAAC,QAAQ;gBACpC,mBAAmB,EAAE,IAAI,CAAC,MAAM;gBAChC,qBAAqB,EAAE,IAAI,CAAC,QAAQ;gBACpC,qBAAqB,EAAE,IAAI,CAAC,QAAQ;AACpC,gBAAA,CAAC,mBAAmB,IAAI,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;AACtC,gBAAA,CAAC,qBAAqB,IAAI,CAAC,MAAM,CAAE,CAAA,GAAG,IAAI;aAC3C,EACa,cAAA,EAAA,OAAO,GAAG,MAAM,GAAG,OAAO,EAAA,eAAA,EACzB,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAA,EAE/C,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EACxB,CAAkB,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAC,cAAc,EAAA,EACtC,CAAO,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,KAAK,EAAC,WAAW,EAAA,EACvC,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,QAAQ,GAAG,GAAG,GAAG,EAAE,CACnB,CACS,EAClB,IAAI,CAAC,MAAM,IACV,CAAO,CAAA,OAAA,EAAA,EAAA,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,IAAI,CAAC,aAAa,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,KAEhF,CAAA,CAAA,OAAA,EAAA,EACE,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAC,QAAQ,EACb,KAAK,EAAO,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,UAAU,CACtB,EAAA,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,KAAK,EAAE,IAAI,CAAC,aAAa,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,IAAI,EAAE,IAAI,CAAC,IAAI;;YAEf,WAAW,EAAE,yBAAyB,GAAG,IAAI,CAAC,EAAE,GAChD,CACH,EACA,OAAO,KACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EACxB,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAkB,OAAO,EAAC,cAAc,EAAC,KAAK,EAAC,OAAO,EAAA,EAAE,IAAI,CAAC,YAAY,CAAoB,CACzF,CACP,CACG,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/my-component/UI/inputs/numeric-field/numeric-field.css?tag=numeric-field&encapsulation=shadow","src/components/my-component/UI/inputs/numeric-field/numeric-field.tsx"],"sourcesContent":["@import '../inputs.css';","import {\n  Component,\n  Prop,\n  h,\n  Host,\n  State,\n  Event,\n  EventEmitter,\n  Watch,\n} from '@stencil/core';\nimport { InputSize, InputMargin } from '../input-types';\n\n/**\n * A standardized numeric input field component with validation, error handling, and number constraints.\n * Supports both controlled and uncontrolled modes.\n *\n * This component emits a custom `change` event with the committed value and also\n * propagates standard DOM events like `input`, `focus`, and `blur` from the\n * underlying input element.\n *\n * @example\n * ```tsx\n * // Uncontrolled component with initial value\n * <numeric-field\n *   placeholder=\"Enter age\"\n *   initialValue=\"25\"\n *   min=\"0\"\n *   max=\"120\"\n *   onChange={(e) => console.log('Age:', e.detail)}\n * />\n *\n * // Controlled component\n * <numeric-field\n *   placeholder=\"Enter price\"\n *   value={priceValue}\n *   step=\"0.01\"\n *   min=\"0\"\n *   onChange={(e) => setPriceValue(e.detail)}\n * />\n *\n * // With validation and constraints\n * <numeric-field\n *   label=\"Quantity\"\n *   placeholder=\"Enter quantity\"\n *   required={true}\n *   error={quantityError}\n *   value={quantity}\n *   min=\"1\"\n *   max=\"999\"\n *   step=\"1\"\n *   onChange={handleQuantityChange}\n * />\n * ```\n */\n@Component({\n  tag: 'numeric-field',\n  styleUrl: 'numeric-field.css',\n  shadow: true,\n})\nexport class NumericField {\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   * 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   * Initial value for the numeric 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   * Current value of the numeric 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   * 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 numeric input.\n   * Common values: 'numeric', 'decimal'\n   */\n  @Prop() inputMode: string;\n\n  /**\n   * Minimum value allowed for the numeric input. Enforces lower bounds validation.\n   */\n  @Prop() min: string;\n\n  /**\n   * Maximum value allowed for the numeric input. Enforces upper bounds validation.\n   */\n  @Prop() max: string;\n\n  /**\n   * Step value for numeric input increments. Defines the granularity of allowed values.\n   * For example, \"0.01\" for currency, \"1\" for integers.\n   */\n  @Prop() step: 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 value state. Manages the current input value independently of props.\n   * @internal\n   */\n  @State() internalValue: string = '';\n\n  /**\n   * Internal error message state. Manages display of validation errors.\n   * @internal\n   */\n  @State() errorMessage: string;\n\n  /**\n   * Emitted when the numeric 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 numeric field\n   *\n   * @example\n   * ```tsx\n   * <numeric-field onChange={(e) => handleValueChange(e.detail)} />\n   * ```\n   */\n  @Event() change: EventEmitter<string>;\n\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 or if this is an uncontrolled component.\n   * @internal\n   */\n  @Watch('initialValue')\n  initialValueChanged(newValue: string) {\n    // Only update if we don't have a value yet or if this is uncontrolled (no value prop)\n    if ((this.internalValue === '' || this.internalValue === undefined) || this.value === undefined) {\n      if (newValue !== undefined) {\n        this.internalValue = newValue;\n      }\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  valueChanged() {\n    // If value prop is provided, this is a controlled component\n    if (this.value !== undefined && this.value !== this.internalValue) {\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 value: use value prop if provided (controlled), otherwise use initialValue (uncontrolled)\n    this.internalValue = this.value !== undefined ? this.value : (this.initialValue || '');\n\n    if (this.error) {\n      this.errorMessage = this.error;\n    }\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    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    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  /**\n   * Handles focus events. Event bubbles up to stencil-field automatically.\n   * @internal\n   */\n  private onFocus = () => {\n    // Event will bubble up to stencil-field automatically\n  }\n\n  /**\n   * Handles blur events. Event bubbles up to stencil-field automatically.\n   * @internal\n   */\n  private onBlur = () => {\n    // Event will bubble up to stencil-field automatically\n  }\n\n  /**\n   * Renders the numeric field component.\n   * @returns JSX element\n   * @internal\n   */\n  render() {\n    const isError = !!this.errorMessage;\n\n    const inputClass = {\n      'bx--text-input': true,\n      'bx--text-input--error': 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--hidden': this.hidden,\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        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} name={this.name} />\n          ) : (\n            <input\n              id={this.id}\n              name={this.name}\n              type=\"number\"\n              class={{ ...inputClass }}\n              placeholder={this.placeholder}\n              value={this.internalValue}\n              required={this.required}\n              disabled={this.disabled}\n              readOnly={this.readonly}\n              onFocus={this.onFocus}\n              onInput={this.onInput}\n              onChange={this.onChange}\n              onBlur={this.onBlur}\n              inputMode={this.inputMode}\n              min={this.min}\n              max={this.max}\n              step={this.step}\n              //@ts-ignore\n              udprecordid={'udpRecord-number-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-DueJnVH4.js → p-DyC6jVV8.js}

@@ -1,13 +1,14 @@
 import { p as proxyCustomElement, H, h } from './p-DPon6DDX.js';
 import Close24 from '@carbon/icons/es/close/24';
 import OverflowMenuVertical24 from '@carbon/icons/es/overflow-menu--vertical/16';
-import { g as getIconFromName, d as defineCustomElement$4 } from './p-IlXn87Ki.js';
+import { g as getIconFromName } from './p-BY5RQ-T1.js';
 import { a as splitActionList } from './p-DUK_9dnF.js';
-import { d as defineCustomElement$8 } from './p-hRee3qYx.js';
+import { d as defineCustomElement$8 } from './p-D6Wo7quX.js';
 import { d as defineCustomElement$7 } from './p-BGjVmQGN.js';
 import { d as defineCustomElement$6 } from './p-ZeWoGdjP.js';
 import { d as defineCustomElement$5 } from './p-C-wDzVCk.js';
-import { d as defineCustomElement$3 } from './p-DWJbhjYR.js';
+import { d as defineCustomElement$4 } from './p-1Cv4cku0.js';
+import { d as defineCustomElement$3 } from './p-C1K2NBql.js';
 import { d as defineCustomElement$2 } from './p-CpGuVcRn.js';
 import { d as defineCustomElement$1 } from './p-DkppmXNM.js';
 
@@ -101,16 +102,16 @@ const FeatureDetailsCard = /*@__PURE__*/ proxyCustomElement(class FeatureDetails
     render() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
         const currentMessageIcon = (_a = this.messageIcon) !== null && _a !== void 0 ? _a : this.getDefaultMessageIcon();
-        return (h("div", { key: '93aedcfdab35c63524119ebf5083d8e62004187d', class: "card-wrapper", style: { width: (_b = this.width) !== null && _b !== void 0 ? _b : '100%' } }, this.showAdornment && this.status && (h("div", { key: 'f3e3824f46d588d67b16e115c96578e7bb9d0b24', class: "adornment" }, h("udp-adornment", { key: '569bee74ed9f06e0a1544844f66f5d86f5643aa0', status: (_c = this.status) !== null && _c !== void 0 ? _c : 'info' }))), h("div", { key: '32723956990e1ebf8899b98fd7330866231a0903', class: "content-wrapper" }, h("div", { key: '90f3cc1fe6932b926a337cd1cfd944f305943ec4', class: "header-wrapper", style: { backgroundColor: this.getHeaderBackgroundColor() } }, h("div", { key: '1409d8a3a41d7881d0b4040d2cc816cc4a765990', class: "title-wrapper" }, h("stencil-icon-button", { key: '5719590baca5ce60bf2265b64b4f5182fbe6e753', onClick: this.onClose, icon: Close24, tooltip: "Close", noBackground: true }), h("unity-typography", { key: '2c38b4101e8545ff4f4ae77a7cf2b3b080451d5f', variant: 'h6' }, this.title)), ((_d = this.moreIconActions) === null || _d === void 0 ? void 0 : _d.length) > 0 && (h("div", { key: '81d9fa2190770187dbd90eb8d776e16d480babf4' }, h("div", { key: '0b9647731906a6701ab15ceeadc2786c22d4d258', id: "moreHeaderIconButton1" }, h("stencil-icon-button", { key: 'f0b116ffd246a208f379df3ab4e39113d7f7c96b', onClick: this.handleOnClickMoreIcon, icon: OverflowMenuVertical24, tooltip: "More", noBackground: true, buttonId: "moreHeaderIconButton" })), h("udp-pop-over", { key: 'd0da8a9100347027bd1b8dcd696b1abdea9cfda8', anchorElement: this.moreIconAnchor, isOpen: this.showMoreHeaderPopover, popoverWidth: '200', popoverMaxHeight: '50', handleOnClose: this.handleClosePopover, popoverPlacement: 'bottom' }, h("div", { key: 'f7dc8df5107c794797a9c5c31a0d03f76b36c965', class: "menu" }, (_e = this.moreIconActions) === null || _e === void 0 ? void 0 : _e.map(action => (h("udp-menu-item", { label: action === null || action === void 0 ? void 0 : action.name, iconName: action === null || action === void 0 ? void 0 : action.iconName, handleOnClick: () => {
+        return (h("div", { key: 'ab3cae4515b88f98a5e853060bf29032cd3821c3', class: "card-wrapper", style: { width: (_b = this.width) !== null && _b !== void 0 ? _b : '100%' } }, this.showAdornment && this.status && (h("div", { key: '233bb655177b47c3be71de0bbb6a85c6dc8c8522', class: "adornment" }, h("udp-adornment", { key: '2c0e06acf499afca92d6031248b94290cfe24c0a', status: (_c = this.status) !== null && _c !== void 0 ? _c : 'info' }))), h("div", { key: '1a94ab2d7645d3b5bfcde0e2221bba2ff8452903', class: "content-wrapper" }, h("div", { key: 'aafd16f6f1acfed1f5231a27284f99fb942e154d', class: "header-wrapper", style: { backgroundColor: this.getHeaderBackgroundColor() } }, h("div", { key: 'a1c9f468f0743b818a1cbc39b3d02624fd305e41', class: "title-wrapper" }, h("stencil-icon-button", { key: '5a9330fb6600e26cc4de0df72b664af630e058f2', onClick: this.onClose, icon: Close24, tooltip: "Close", noBackground: true }), h("unity-typography", { key: '27b11552a33cd3ec3f67552b5ea59050993207a7', variant: 'h6' }, this.title)), ((_d = this.moreIconActions) === null || _d === void 0 ? void 0 : _d.length) > 0 && (h("div", { key: '6210fb07d242392fd560fac2ee1361500b5d6415' }, h("div", { key: 'e5e69755fac7918925a328ca5795024cf55ecf16', id: "moreHeaderIconButton1" }, h("stencil-icon-button", { key: 'c44197f9ea3ece6ced82048b48fd99906914b5c1', onClick: this.handleOnClickMoreIcon, icon: OverflowMenuVertical24, tooltip: "More", noBackground: true, buttonId: "moreHeaderIconButton" })), h("udp-pop-over", { key: '21cd04ef4afbcb3c3ec2042b8d2c509b6e29d27d', anchorElement: this.moreIconAnchor, isOpen: this.showMoreHeaderPopover, popoverWidth: '200', popoverMaxHeight: '50', handleOnClose: this.handleClosePopover, popoverPlacement: 'bottom' }, h("div", { key: '000e0e9fcce33962f8f51ada1829dbd5807073e6', class: "menu" }, (_e = this.moreIconActions) === null || _e === void 0 ? void 0 : _e.map(action => (h("udp-menu-item", { label: action === null || action === void 0 ? void 0 : action.name, iconName: action === null || action === void 0 ? void 0 : action.iconName, handleOnClick: () => {
                 action.onClick(this.data);
-            } })))))))), this.message && (h("div", { key: '2b3bc282402005d542314ac356044ba15542035e', class: "message-wrapper", style: { backgroundColor: this.getMessageBackgroundColor() } }, !this.hideMessageIcon && (h("div", { key: 'e136b7208ea210e1658468b0092d05f4c5e8aefb', class: "icon-message" }, h("udp-icon", { key: '70b9e2962193742260c12954c108977e54cd16d8', iconName: currentMessageIcon }))), h("div", { key: 'b141a3f78c3948aa8e3f8cb33e36e000dbe2d24b', class: "message" }, h("unity-typography", { key: '5edaa172a367eed0307a023d70140a42caa3282b' }, this.message)))), h("div", { key: 'a43d9a6a99a433181e15bcbd1aeee06442710172', class: "data-section" }, (_f = this.listData) === null || _f === void 0 ? void 0 : _f.map(({ subject, value }) => (h("div", { class: "data-row" }, h("div", { class: "key" }, h("unity-typography", { variant: 'data-display-three' }, `${subject}: `)), h("div", { class: "value" }, h("unity-typography", { variant: 'data-display-three' }, value)))))), h("div", { key: '58dee8b89fd27d8fcbcc10a2d834bedac983bd73', class: "options" }, this.enableViewFeature && this.data && (h("div", { key: 'b336fb1f684bc7a0c2faf298bca0c2146a813f38', id: "viewFeatureOption" }, h("stencil-icon-button", { key: 'b9a366a0a02d21281634b62f23b4dcb880f20d87', tooltip: 'View', icon: getIconFromName('view'), buttonId: 'viewFeatureButton', onClick: () => this.handleViewFeature({
+            } })))))))), this.message && (h("div", { key: 'd76cfbd478adfc6936e946efc78899512081706a', class: "message-wrapper", style: { backgroundColor: this.getMessageBackgroundColor() } }, !this.hideMessageIcon && (h("div", { key: 'fb201c62d5d2c522b3d9f2728967bd802650cf47', class: "icon-message" }, h("udp-icon", { key: 'bcbed77cc7f6f11bee1ff2c9f03c78ad50122699', iconName: currentMessageIcon }))), h("div", { key: '46d5885a727ca6c8c245840582cb7d29d0c0f3cf', class: "message" }, h("unity-typography", { key: '7fd9be613557e57a1e6afceba7f1998d32e52a63' }, this.message)))), h("div", { key: 'c0a22edd31202bc3c8e13e236056c4e1cbd2e4cf', class: "data-section" }, (_f = this.listData) === null || _f === void 0 ? void 0 : _f.map(({ subject, value }) => (h("div", { class: "data-row" }, h("div", { class: "key" }, h("unity-typography", { variant: 'data-display-three' }, `${subject}: `)), h("div", { class: "value" }, h("unity-typography", { variant: 'data-display-three' }, value)))))), h("div", { key: '7d2418695b75774fc3b3cf9d13619718ead6d553', class: "options" }, this.enableViewFeature && this.data && (h("div", { key: '6f8b90c1018219fd5bc0d37c834e3af08d607734', id: "viewFeatureOption" }, h("stencil-icon-button", { key: '05c9d502fa818402ac238b16ae447871a006400e', tooltip: 'View', icon: getIconFromName('view'), buttonId: 'viewFeatureButton', onClick: () => this.handleViewFeature({
                 selectedFeature: this.data,
                 formattedSelectedFeature: this.listData,
-            }) }))), ((_g = this.primaryActions) === null || _g === void 0 ? void 0 : _g.length) > 0 && (h("div", { key: '748378e9d6e8df9521c8793bfb4e38eceae17e8a' }, h("div", { key: '156ba965afbc47d9b1c5cde023ee276658efba8b', class: "options" }, (_h = this.visiblePrimaryActions) === null || _h === void 0 ? void 0 :
+            }) }))), ((_g = this.primaryActions) === null || _g === void 0 ? void 0 : _g.length) > 0 && (h("div", { key: '083fa67d179679bcb4b98e2da72595c0bbd0d250' }, h("div", { key: 'd1a8a86b795729faa0a916e6d86d5076bb75bfeb', class: "options" }, (_h = this.visiblePrimaryActions) === null || _h === void 0 ? void 0 :
             _h.map((action, index) => {
                 var _a;
                 return (h("stencil-icon-button", { tooltip: action === null || action === void 0 ? void 0 : action.name, icon: getIconFromName(action === null || action === void 0 ? void 0 : action.iconName), buttonId: (_a = action === null || action === void 0 ? void 0 : action.id) !== null && _a !== void 0 ? _a : `primary-icon-action-${index}`, onClick: () => action.onClick(this.data) }));
-            }), ((_j = this.overflowPrimaryActions) === null || _j === void 0 ? void 0 : _j.length) > 0 && (h("stencil-icon-button", { key: '43a695b3208080e95bf99c028e132a6ab45fdd60', onClick: this.handleOnClickPrimaryAction, icon: OverflowMenuVertical24, tooltip: "More", noBackground: true, buttonId: "morePrimaryIconButton" }))), h("udp-pop-over", { key: '0cd2de3a22e153ef82c1dafd86eef460df267c77', anchorElement: this.primaryActionAnchor, isOpen: this.showPrimaryPopover, popoverWidth: '200', popoverMaxHeight: '50', handleOnClose: this.handleClosePopover, popoverPlacement: 'bottom' }, h("div", { key: 'ef230e448589973a9c7799549e0199b3ca339a5a', class: "menu" }, (_k = this.overflowPrimaryActions) === null || _k === void 0 ? void 0 : _k.map(action => (h("udp-menu-item", { label: action === null || action === void 0 ? void 0 : action.name, iconName: action === null || action === void 0 ? void 0 : action.iconName, handleOnClick: () => {
+            }), ((_j = this.overflowPrimaryActions) === null || _j === void 0 ? void 0 : _j.length) > 0 && (h("stencil-icon-button", { key: 'ee909672380846e00770d9707f96eb5df4c84271', onClick: this.handleOnClickPrimaryAction, icon: OverflowMenuVertical24, tooltip: "More", noBackground: true, buttonId: "morePrimaryIconButton" }))), h("udp-pop-over", { key: '9860060be0145c4c9d0c1f15f3fb323af196680f', anchorElement: this.primaryActionAnchor, isOpen: this.showPrimaryPopover, popoverWidth: '200', popoverMaxHeight: '50', handleOnClose: this.handleClosePopover, popoverPlacement: 'bottom' }, h("div", { key: 'aa50274cd5e0c51ef4d9f51ed8ca441d7686a86a', class: "menu" }, (_k = this.overflowPrimaryActions) === null || _k === void 0 ? void 0 : _k.map(action => (h("udp-menu-item", { label: action === null || action === void 0 ? void 0 : action.name, iconName: action === null || action === void 0 ? void 0 : action.iconName, handleOnClick: () => {
                 action.onClick(this.data);
             } })))))))))));
     }
@@ -193,6 +194,6 @@ function defineCustomElement() {
 }
 
 export { FeatureDetailsCard as F, defineCustomElement as d };
-//# sourceMappingURL=p-DueJnVH4.js.map
+//# sourceMappingURL=p-DyC6jVV8.js.map
 
-//# sourceMappingURL=p-DueJnVH4.js.map
+//# sourceMappingURL=p-DyC6jVV8.js.map

package/dist/components/p-DyC6jVV8.js.map

@@ -0,0 +1 @@
+{"file":"p-DyC6jVV8.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","CloseIcon24"],"sources":["src/components/my-component/UI/map/udp-map/popups/feature-details-card/feature-details-card.css?tag=feature-details-card&encapsulation=shadow","src/components/my-component/UI/map/udp-map/popups/feature-details-card/feature-details-card.tsx"],"sourcesContent":[".card-wrapper {\n  display: flex;\n}\n\n.content-wrapper {\n  flex: 1;\n}\n\n.header-wrapper {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  gap: var(--spacing-01);\n}\n\n.title-wrapper {\n  display: flex;\n  gap: var(--spacing-03);\n  align-items: center;\n}\n\n.message-wrapper {\n  display: flex;\n  gap: var(--spacing-03);\n  align-items: center;\n  padding: var(--spacing-03);\n}\n\n.data-row {\n  display: flex;\n  gap: var(--spacing-03);\n  align-items: center;\n  width: 100%;\n  flex-wrap: wrap;\n  border-bottom: solid 1px var(--gray-03);\n}\n.options {\n  display: flex;\n  gap: var(--spacing-03);\n  justify-content: flex-end;\n  align-items: center;\n  width: 100%;\n}\n.data-section {\n  padding: var(--spacing-03);\n}\n","import { Component, Prop, State, h, Element } from '@stencil/core';\nimport CloseIcon24 from '@carbon/icons/es/close/24';\nimport OverflowMenuVertical24 from '@carbon/icons/es/overflow-menu--vertical/16';\nimport { getIconFromName } from 'src/components/my-component/UI/data-display/icons/iconUtils';\nimport { splitActionList } from 'src/udp-utilities/grid/action-renderers/action-column-util';\n\n@Component({\n  tag: 'feature-details-card',\n  styleUrl: 'feature-details-card.css',\n  shadow: true,\n})\nexport class FeatureDetailsCard {\n  @Element() el: HTMLElement;\n  @Prop() data: any;\n  @Prop() title: string;\n  @Prop() listData: any[];\n  @Prop() showAdornment: boolean = true;\n  @Prop() status: 'success' | 'warning' | 'error' | 'info' = 'info';\n  @Prop() enableViewFeature: boolean = true;\n  @Prop() handleViewFeature: (value: {}) => void;\n  @Prop() primaryActions: any[] = [];\n  @Prop() moreIconActions: any[];\n  @Prop() message: string;\n  @Prop() messageIcon: any;\n  @Prop() hideMessageIcon: boolean = false;\n  @Prop() onClose: (event: any) => void;\n  @Prop() width: string;\n\n  @State() moreIconAnchor: any = null;\n  @State() showMoreHeaderPopover: boolean = false;\n  @State() primaryActionAnchor: any = null;\n  @State() showPrimaryPopover: boolean = false;\n  @State() visiblePrimaryActions: any[] = [];\n  @State() overflowPrimaryActions: any[] = [];\n\n  private maximumVisibleListItems = 4;\n\n  handleOnClickMoreIcon(event: any) {\n    event.stopPropagation();\n\n    this.moreIconAnchor = event?.currentTarget;\n    this.showMoreHeaderPopover = true;\n  }\n\n  handleOnClickPrimaryAction(event: any) {\n    event.stopPropagation();\n\n    this.primaryActionAnchor = event?.currentTarget;\n    this.showPrimaryPopover = true;\n  }\n  handleClosePopover() {\n    this.showMoreHeaderPopover = false;\n    this.showPrimaryPopover = false;\n  }\n\n  getHeaderBackgroundColor() {\n    switch (this.status) {\n      case 'success':\n        return 'rgba(122, 220, 181, 0.75)';\n      case 'warning':\n        return 'rgba(255, 131, 43, 0.75)';\n      case 'error':\n        return 'rgba(142, 30, 36, 0.75)';\n      default:\n        return 'rgba(52, 120, 176, 0.75)';\n    }\n  }\n\n  getMessageBackgroundColor() {\n    switch (this.status) {\n      case 'success':\n        return 'rgba(122, 220, 181, 0.45)';\n      case 'warning':\n        return 'rgba(255, 131, 43, 0.45)';\n      case 'error':\n        return 'rgba(142, 30, 36, 0.45)';\n      default:\n        return 'rgba(52, 120, 176, 0.45)';\n    }\n  }\n\n  getDefaultMessageIcon() {\n    switch (this.status) {\n      case 'success':\n        return 'checkmark';\n      case 'error':\n        return 'warning';\n      case 'warning':\n        return 'warningAlt';\n      default:\n        return 'information';\n    }\n  }\n\n  updatePrimaryActionOverflow() {\n    let maxVisible = this.maximumVisibleListItems - (this.enableViewFeature ? 1 : 0);\n\n    if (this.primaryActions?.length <= maxVisible) {\n      this.visiblePrimaryActions = this.primaryActions;\n      this.overflowPrimaryActions = [];\n    } else {\n      maxVisible -= 1; //minus the more icon\n      const { visibleActions, overflowActions } = splitActionList(this.primaryActions, maxVisible);\n      this.visiblePrimaryActions = visibleActions;\n      this.overflowPrimaryActions = overflowActions;\n    }\n  }\n\n  componentWillLoad() {\n    this.updatePrimaryActionOverflow();\n  }\n  render() {\n    const currentMessageIcon = this.messageIcon ?? this.getDefaultMessageIcon();\n\n    return (\n      <div class=\"card-wrapper\" style={{ width: this.width ?? '100%' }}>\n        {this.showAdornment && this.status && (\n          <div class=\"adornment\">\n            <udp-adornment status={this.status ?? 'info'}></udp-adornment>\n          </div>\n        )}\n        <div class=\"content-wrapper\">\n          <div class=\"header-wrapper\" style={{ backgroundColor: this.getHeaderBackgroundColor() }}>\n            <div class=\"title-wrapper\">\n              <stencil-icon-button onClick={this.onClose} icon={CloseIcon24} tooltip=\"Close\" noBackground />\n              <unity-typography variant={'h6'}>{this.title}</unity-typography>\n            </div>\n\n            {this.moreIconActions?.length > 0 && (\n              <div>\n                <div id=\"moreHeaderIconButton1\">\n                  <stencil-icon-button onClick={this.handleOnClickMoreIcon} icon={OverflowMenuVertical24} tooltip=\"More\" noBackground buttonId=\"moreHeaderIconButton\" />\n                </div>\n\n                <udp-pop-over\n                  anchorElement={this.moreIconAnchor}\n                  isOpen={this.showMoreHeaderPopover}\n                  popoverWidth={'200'}\n                  popoverMaxHeight={'50'}\n                  handleOnClose={this.handleClosePopover}\n                  popoverPlacement={'bottom'}\n                >\n                  <div class=\"menu\">\n                    {this.moreIconActions?.map(action => (\n                      <udp-menu-item\n                        label={action?.name}\n                        iconName={action?.iconName}\n                        handleOnClick={() => {\n                          action.onClick(this.data);\n                        }}\n                      />\n                    ))}\n                  </div>\n                </udp-pop-over>\n              </div>\n            )}\n          </div>\n          {this.message && (\n            <div class=\"message-wrapper\" style={{ backgroundColor: this.getMessageBackgroundColor() }}>\n              {!this.hideMessageIcon && (\n                <div class=\"icon-message\">\n                  <udp-icon iconName={currentMessageIcon} />\n                </div>\n              )}\n              <div class=\"message\">\n                <unity-typography>{this.message}</unity-typography>\n              </div>\n            </div>\n          )}\n          <div class=\"data-section\">\n            {this.listData?.map(({ subject, value }: any) => (\n              <div class=\"data-row\">\n                <div class=\"key\">\n                  <unity-typography variant={'data-display-three'}>{`${subject}: `}</unity-typography>\n                </div>\n                <div class=\"value\">\n                  <unity-typography variant={'data-display-three'}>{value}</unity-typography>\n                </div>\n              </div>\n            ))}\n          </div>\n\n          <div class=\"options\">\n            {this.enableViewFeature && this.data && (\n              <div id=\"viewFeatureOption\">\n                <stencil-icon-button\n                  tooltip={'View'}\n                  icon={getIconFromName('view')}\n                  buttonId={'viewFeatureButton'}\n                  onClick={() =>\n                    this.handleViewFeature({\n                      selectedFeature: this.data,\n                      formattedSelectedFeature: this.listData,\n                    })\n                  }\n                />\n              </div>\n            )}\n\n            {this.primaryActions?.length > 0 && (\n              <div>\n                <div class=\"options\">\n                  {this.visiblePrimaryActions?.map((action, index) => (\n                    <stencil-icon-button\n                      tooltip={action?.name}\n                      icon={getIconFromName(action?.iconName)}\n                      buttonId={action?.id ?? `primary-icon-action-${index}`}\n                      onClick={() => action.onClick(this.data)}\n                    />\n                  ))}\n                  {this.overflowPrimaryActions?.length > 0 && (\n                    <stencil-icon-button onClick={this.handleOnClickPrimaryAction} icon={OverflowMenuVertical24} tooltip=\"More\" noBackground buttonId=\"morePrimaryIconButton\" />\n                  )}\n                </div>\n\n                <udp-pop-over\n                  anchorElement={this.primaryActionAnchor}\n                  isOpen={this.showPrimaryPopover}\n                  popoverWidth={'200'}\n                  popoverMaxHeight={'50'}\n                  handleOnClose={this.handleClosePopover}\n                  popoverPlacement={'bottom'}\n                >\n                  <div class=\"menu\">\n                    {this.overflowPrimaryActions?.map(action => (\n                      <udp-menu-item\n                        label={action?.name}\n                        iconName={action?.iconName}\n                        handleOnClick={() => {\n                          action.onClick(this.data);\n                        }}\n                      />\n                    ))}\n                  </div>\n                </udp-pop-over>\n              </div>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"],"version":3}