dap-design-system 0.55.0 → 0.55.2

package/dist/components/datepicker/datepicker.component.d.ts

@@ -2,6 +2,80 @@ import { Dayjs } from 'dayjs';
 import { PropertyValueMap } from 'lit';
 import { FloatingStrategy, PopupPlacement } from '../../common/types';
 import { GenericFormElement } from '../../internal/mixin/genericFormElement';
+/**
+ * `dap-ds-datepicker`
+ * @summary A datepicker is a graphical user interface widget that allows the user to select a date from a calendar and/or time from a time range.
+ * @element dap-ds-datepicker
+ * @title - Datepicker
+ *
+ * @property {Dayjs} value - The value of the datepicker.
+ * @property {string} label - The label of the datepicker.
+ * @property {string} description - The description of the datepicker.
+ * @property {'xs' | 'sm' | 'sm'} size - The size of the datepicker.
+ * @property {boolean} disabled - The disabled state of the datepicker.
+ * @property {boolean} required - The required state of the datepicker.
+ * @property {boolean} readonly - The readonly state of the datepicker.
+ * @property {boolean} autofocus - The autofocus state of the datepicker.
+ * @property {string} tooltip - The tooltip of the datepicker.
+ * @property {'top' | 'right' | 'bottom' | 'left'} tooltipPlacement - The tooltip placement of the datepicker.
+ * @property {string} feedback - The feedback of the datepicker.
+ * @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type of the datepicker.
+ * @property {boolean} optional - The optional state of the datepicker.
+ * @property {string} optionalLabel - The optional label of the datepicker.
+ * @property {boolean} subtle - The weight of the label. Default is `false`
+ * @property {string} autocomplete - The autocomplete of the datepicker.
+ * @property {boolean} autofocus - The autofocus of the datepicker.
+ *
+ * @event {{ value: string }} dds-change - Fired when the datepicker value changes.
+ * @event {{ value: string }} dds-input - Fired when the datepicker input value changes.
+ * @event {{ value: string }} dds-valid-date - Fired when the datepicker input value is valid. Happens on manual input typing.
+ * @event {{ value: string, type: 'invalid' | 'out-of-range' }} dds-invalid-date - Fired when the datepicker input value is invalid. Happens on manual input typing.
+ * @event {{ void }} dds-clear - Fired when the datepicker is cleared.
+ * @event {{ void }} dds-focus - Emitted when the datepicker gains focus.
+ * @event {{ void }} dds-blur - Emitted when the datepicker loses focus.
+ *
+ * @csspart base - The main datepicker container.
+ * @csspart calendar - The calendar of the datepicker.
+ * @csspart trigger - The trigger button of the datepicker.
+ * @csspart label - The label of the datepicker.
+ * @csspart description - The description of the datepicker.
+ * @csspart feedback - The feedback of the datepicker.
+ * @csspart tooltip - The tooltip of the datepicker.
+ * @csspart input - The input of the datepicker.
+ * @csspart clear-button - The clear button of the datepicker.
+ * @csspart calendar-grid-cell-base - The base of the calendar grid cell.
+ * @csspart calendar-grid-cell - The cell of the calendar grid.
+ * @csspart calendar-grid-header-cell-base - The base of the calendar grid header cell.
+ * @csspart calendar-grid-header-cell - The header cell of the calendar grid.
+ * @csspart calendar-grid-cell-today-mark - The today mark of the calendar grid cell.
+ *
+ * @cssproperty --dds-combobox-background - The background color of the combobox. (default: var(--dds-fields-background-default))
+ * @cssproperty --dds-combobox-border-color - The border color of the combobox. (default: var(--dds-border-neutral-base))
+ * @cssproperty --dds-combobox-border-width - The border width of the combobox. (default: var(--dds-border-width-base, 1px))
+ * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. (default: var(--dds-radius-base))
+ * @cssproperty --dds-combobox-text-color - The text color of the combobox. (default: var(--dds-text-neutral-base))
+ * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))
+ * @cssproperty --dds-combobox-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))
+ * @cssproperty --dds-combobox-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))
+ * @cssproperty --dds-combobox-error-border - The border color for error state. (default: var(--dds-border-negative-base))
+ * @cssproperty --dds-combobox-success-border - The border color for success state. (default: var(--dds-border-positive-base))
+ * @cssproperty --dds-combobox-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))
+ * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))
+ * @cssproperty --dds-combobox-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))
+ * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%))
+ * @cssproperty --dds-combobox-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))
+ * @cssproperty --dds-combobox-padding-sm - The padding for small size. (default: var(--dds-spacing-200))
+ * @cssproperty --dds-combobox-padding-lg - The padding for large size. (default: var(--dds-spacing-300))
+ * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))
+ * @cssproperty --dds-combobox-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))
+ * @cssproperty --dds-combobox-gap - The gap between elements. (default: var(--dds-spacing-100))
+ * @cssproperty --dds-combobox-icon-gap - The gap between icons. (default: var(--dds-spacing-200))
+ * @cssproperty --dds-combobox-action-gap - The gap between action elements. (default: var(--dds-spacing-200))
+ * @cssproperty --dds-combobox-action-padding - The padding for action elements. (default: var(--dds-spacing-300))
+ * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))
+ * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))
+ * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. (default: 7.5rem)
+ */
 export default class DapDSDatePicker extends GenericFormElement {
     private static nextId;
     /**

package/dist/{components-CSqPA5oW.js → components-ChK1mSip.js}

@@ -4551,12 +4551,7 @@ let Ot = class extends pe {
         @click=${this.handleClick}
         @keydown=${this.handleKeyDown}>
         <div part="high-contrast" class="button__highcontrast"></div>
-        ${this.loading ? this._getLoadingSpinner() : b` <span
-                part="content"
-                class="button__text"
-                part="content"
-                class="button__text"
-                aria-hidden="true">
+        ${this.loading ? this._getLoadingSpinner() : b` <span part="content" class="button__text">
                 <slot></slot>
               </span>`}
         ${this.target === "_blank" ? b`<span class="sr-only">
@@ -21504,7 +21499,7 @@ export {
   Ei as A,
   To as B,
   Ea as C,
-  Us as D,
+  Po as D,
   Ir as E,
   W as F,
   tt as G,
@@ -21528,7 +21523,7 @@ export {
   ja as Y,
   Ro as Z,
   ie as _,
-  Po as a,
+  Us as a,
   Ar as a0,
   zt as a1,
   Lr as a2,
@@ -21575,16 +21570,16 @@ export {
   me as ay,
   Er as az,
   Ut as b,
-  Qi as c,
-  Be as d,
+  Be as c,
+  fi as d,
   to as e,
   He as f,
-  fi as g,
-  ii as h,
-  Ot as i,
-  qt as j,
-  Et as k,
-  Xt as l,
+  Qi as g,
+  Ot as h,
+  ii as i,
+  Xt as j,
+  qt as k,
+  Et as l,
   Ia as m,
   $r as n,
   Ai as o,
@@ -21600,4 +21595,4 @@ export {
   Qt as y,
   xi as z
 };
-//# sourceMappingURL=components-CSqPA5oW.js.map
+//# sourceMappingURL=components-ChK1mSip.js.map