@daikin-oss/design-system-web-components 1.2.0 → 1.3.0-next.2

package/dist/cjs-dev/components/icon/daikin-icon.cjs

@@ -3,11 +3,13 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const classVarianceAuthority = require("class-variance-authority");
 const lit = require("lit");
 const decorators_js = require("lit/decorators.js");
+const unsafeHtml_js = require("lit/directives/unsafe-html.js");
 const ddsElement = require("../../base/dds-element.cjs");
 const decorators = require("../../base/decorators.cjs");
 require("../../base/define.cjs");
+const iconRegistry = require("../../icon-registry.cjs");
 const tailwind = require("../../tailwind.css.cjs");
-const icons = require("./icons.json.cjs");
+const icons$1 = require("./icons.json.cjs");
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __decorateClass = (decorators2, target, key, kind) => {
@@ -18,47 +20,164 @@ var __decorateClass = (decorators2, target, key, kind) => {
   if (kind && result) __defProp(target, key, result);
   return result;
 };
-const iconList = Object.keys(icons.icons);
-const iconClassMap = Object.fromEntries(
-  Object.entries(icons.icons).map(([name, object]) => [name, object.class])
+const { icons } = icons$1.default;
+const iconList = Object.keys(icons).filter(
+  (key) => key !== "logo-positive" && key !== "logo-negative"
 );
-const cvaIcon = classVarianceAuthority.cva(["block"], {
+function svgToDataUrl(svg) {
+  const encoded = encodeURIComponent(svg).replaceAll("'", "%27");
+  return `url("data:image/svg+xml,${encoded}")`;
+}
+const cvaIcon = classVarianceAuthority.cva(["inline-flex size-full"], {
   variants: {
-    icon: iconClassMap,
     color: {
       black: ["text-ddt-color-common-background-overlay"],
       white: ["text-ddt-color-common-text-inverse"],
       default: ["text-[--default-color]"],
       current: []
       // uses `currentColor`
+    },
+    mode: {
+      inline: [],
+      mask: [
+        "bg-current",
+        "[mask-size:100%_100%]",
+        "[-webkit-mask-size:100%_100%]",
+        "[mask-repeat:no-repeat]",
+        "[-webkit-mask-repeat:no-repeat]",
+        "[mask-image:var(--svg)]",
+        "[-webkit-mask-image:var(--svg)]"
+      ],
+      background: [
+        "bg-no-repeat",
+        "bg-[length:100%_100%]",
+        "bg-[image:var(--svg)]"
+      ],
+      static: []
+      // for static icons from icons.json
     }
   }
 });
 exports.DaikinIcon = class DaikinIcon extends ddsElement.DDSElement {
   constructor() {
     super(...arguments);
+    this.registry = iconRegistry.iconRegistry;
     this.icon = null;
     this.color = "default";
     this.size = "current";
+    this._iconData = null;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.loadIcon().catch((error) => {
+      {
+        console.warn(
+          `Error loading icon${this.icon ? ` "${this.icon}"` : ""} in <${this.tagName.toLowerCase()}>:`,
+          error
+        );
+      }
+    });
+  }
+  updated(changedProperties) {
+    if (changedProperties.has("icon")) {
+      this.loadIcon().catch((error) => {
+        {
+          console.warn(
+            `Error loading icon${this.icon ? ` "${this.icon}"` : ""} in <${this.tagName.toLowerCase()}>:`,
+            error
+          );
+        }
+      });
+    }
+  }
+  async loadIcon() {
+    if (!this.icon) {
+      this._iconData = null;
+      return;
+    }
+    const staticIcon = icons[this.icon];
+    if (staticIcon) {
+      this._iconData = {
+        mode: "static",
+        defaultColor: staticIcon.color,
+        class: staticIcon.class
+      };
+      return;
+    }
+    try {
+      const iconData = await this.registry.getIcon(this.icon);
+      if (true) {
+        if (!iconData) {
+          console.warn(`Icon "${this.icon}" not found in registry`);
+        }
+      }
+      this._iconData = iconData;
+    } catch (error) {
+      {
+        console.warn(`Failed to load custom icon "${this.icon}":`, error);
+      }
+      this._iconData = null;
+    }
   }
   render() {
-    var _a;
-    const defaultColor = (_a = icons.icons[this.icon ?? ""]) == null ? void 0 : _a.color;
     {
       if (!this.icon) {
-        console.warn("icon property is not specified");
-      } else if (!(this.icon in icons.icons)) {
-        console.warn(`There is no icon named "${this.icon}".`);
-      } else if (this.color === "default" && !defaultColor) {
+        console.warn("icon property is not specified for daikin-icon");
+      }
+    }
+    if (!this.icon) {
+      return lit.html`<span
+        class=${cvaIcon({
+        color: this.color,
+        mode: "static"
+      })}
+        title="Unknown icon"
+      ></span>`;
+    }
+    if (!this._iconData) {
+      return lit.html`<span
+        class=${cvaIcon({
+        color: this.color,
+        mode: "inline"
+      })}
+        title=${this.icon || "Unknown icon"}
+      ></span>`;
+    }
+    const defaultColor = this._iconData.defaultColor;
+    {
+      if (this.color === "default" && !defaultColor) {
         console.warn(`The icon "${this.icon}" does not have a default color.`);
       }
     }
+    if (this._iconData.mode === "static") {
+      return lit.html`<span
+        class="${cvaIcon({
+        color: this.color,
+        mode: "static"
+      })} ${this._iconData.class}"
+        style=${`--default-color:${defaultColor ?? "#000000"}`}
+        role="presentation"
+      ></span>`;
+    }
+    const mode = this._iconData.mode ?? "mask";
+    if (mode === "inline") {
+      return lit.html`<span
+        class=${cvaIcon({
+        color: this.color,
+        mode
+      })}
+        style=${`--default-color:${defaultColor ?? "#000000"}`}
+        role="presentation"
+        >${unsafeHtml_js.unsafeHTML(this._iconData.svg)}</span
+      >`;
+    }
+    const svgDataUrl = svgToDataUrl(this._iconData.svg);
     return lit.html`<span
       class=${cvaIcon({
-      icon: this.icon,
-      color: this.color
+      color: this.color,
+      mode
     })}
-      style=${`--default-color:${defaultColor ?? "#000000"}`}
+      style=${`--default-color:${defaultColor ?? "#000000"};--svg:${svgDataUrl}`}
       role="presentation"
     ></span>`;
   }
@@ -67,7 +186,7 @@ exports.DaikinIcon.styles = lit.css`
     ${lit.unsafeCSS(tailwind.default)}
 
     :host {
-      display: inline-block;
+      display: inline-flex;
       width: var(--ddc-icon-size, 100%);
       height: var(--ddc-icon-size, 100%);
     }
@@ -88,6 +207,9 @@ exports.DaikinIcon.styles = lit.css`
       --ddc-icon-size: 24px;
     }
   `;
+__decorateClass([
+  decorators_js.property({ attribute: false })
+], exports.DaikinIcon.prototype, "registry", 2);
 __decorateClass([
   decorators_js.property({ type: String, reflect: true })
 ], exports.DaikinIcon.prototype, "icon", 2);
@@ -97,6 +219,9 @@ __decorateClass([
 __decorateClass([
   decorators_js.property({ type: String, reflect: true })
 ], exports.DaikinIcon.prototype, "size", 2);
+__decorateClass([
+  decorators_js.state()
+], exports.DaikinIcon.prototype, "_iconData", 2);
 exports.DaikinIcon = __decorateClass([
   decorators.ddsElement("daikin-icon")
 ], exports.DaikinIcon);

package/dist/cjs-dev/components/icon/daikin-icon.d.cts

@@ -1,23 +1,103 @@
 import { DDSElement } from "../../base/index.cjs";
+import { IconRegistry } from "../../icon-registry.cjs";
 import { MergeVariantProps } from "../../type-utils.cjs";
-import { icons } from "./icons.json.cjs";
+declare const icons: {
+    "logo-positive": {
+        class: string;
+        color: null;
+    };
+    "logo-negative": {
+        class: string;
+        color: null;
+    };
+    alarm: {
+        class: string;
+        color: null;
+    };
+    close: {
+        class: string;
+        color: string;
+    };
+    information: {
+        class: string;
+        color: null;
+    };
+    error: {
+        class: string;
+        color: null;
+    };
+    success: {
+        class: string;
+        color: null;
+    };
+    warning: {
+        class: string;
+        color: null;
+    };
+    "pagination-chevron-left": {
+        class: string;
+        color: string;
+    };
+    "pagination-chevron-right": {
+        class: string;
+        color: string;
+    };
+    profile: {
+        class: string;
+        color: null;
+    };
+    "chevron-up": {
+        class: string;
+        color: null;
+    };
+    "chevron-down": {
+        class: string;
+        color: null;
+    };
+    "chevron-left": {
+        class: string;
+        color: null;
+    };
+    "chevron-right": {
+        class: string;
+        color: null;
+    };
+    sort: {
+        class: string;
+        color: null;
+    };
+};
 export declare const iconList: string[];
 export type IconType = keyof typeof icons;
 declare const cvaIcon: (props?: ({
-    icon?: string | number | null | undefined;
     color?: "current" | "default" | "black" | "white" | null | undefined;
+    mode?: "mask" | "background" | "inline" | "static" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type IconVariantProps = MergeVariantProps<typeof cvaIcon>;
 /**
  * The icon component is a versatile UI element used to display small graphical symbols or images that represent actions, objects, or concepts within an application.
- * The icon set is provided by DDS.
+ * The icon set is provided by DDS, and it also supports custom icons via the icon registry.
  *
- * To use an arbitrary color, specify `"current"` for the `color` property and set the `color` CSS property to the color you want to use.
+ * For static DDS icons, the component uses the predefined icon set.
+ * For custom icons, it can dynamically load icons from various sources using the icon registry.
  *
- * If you try to use an icon that does not exist, a blank space will be displayed.
- * In the development build, warnings will be displayed in the console, so please check there if you encounter any unexpected behavior.
+ * This component supports multiple rendering modes for enhanced security when using custom icons:
  *
- * @cssprop [--ddc-icon-size] - Icon size. If a value other than "current" is set for the `size` property, it will be overwritten automatically. This may be set by the parent component such as `daikin-icon-button`.
+ * - **mask** (default for custom icons): Uses CSS mask-image for secure rendering with color customization
+ * - **background**: Uses CSS background-image for secure rendering without color customization
+ * - **inline**: Traditional SVG rendering using innerHTML (use with caution)
+ * - **static** (for DDS icons): Uses predefined CSS classes from the DDS icon set
+ *
+ * **Security Note**: When using custom icons, especially with `inline` mode, ensure that the SVG content comes from trusted sources only.
+ * Untrusted input may lead to XSS vulnerabilities. Consider using `mask` or `background` modes for better security.
+ *
+ * To use a custom color, set the `color` property to `"current"` and apply the desired color using the CSS `color` property.
+ * This works out-of-the-box for mask and static modes, and can be achieved for inline mode with additional effort. The background mode does not support custom colors.
+ *
+ * If an icon cannot be loaded, a blank space will be displayed.
+ * In development builds, warnings will be shown in the console for debugging.
+ *
+ * @cssprop [--ddc-icon-size] - Icon size. If a value other than "current" is set for the `size` property, it will be automatically overwritten. This may also be set by a parent component such as `daikin-icon-button`.
  *
  * @example
  *
@@ -26,15 +106,51 @@ export type IconVariantProps = MergeVariantProps<typeof cvaIcon>;
  * ```
  *
  * ```html
+ * <!-- Using a DDS static icon -->
  * <daikin-icon icon="information" color="black" size="m"></daikin-icon>
+ *
+ * <!-- Using a custom icon -->
+ * <daikin-icon icon="my-custom-icon" color="black" size="m"></daikin-icon>
+ *
+ * <script>
+ * import { iconRegistry } from "@daikin-oss/design-system-web-components/icon-registry.js";
+ *
+ * // Register with mask mode for secure rendering
+ * iconRegistry.register({
+ *   name: "my-custom-icon",
+ *   svg: {
+ *     svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">...</svg>',
+ *     mode: "mask",
+ *     defaultColor: "#0066cc"
+ *   },
+ * });
+ *
+ * // Register dynamic custom icons
+ * iconRegistry.register({
+ *   match: /^custom-/,
+ *   async fetch: (name) => {
+ *     const response = await fetch(`/path/to/custom/icons/${name}.svg`);
+ *     if (!response.ok) {
+ *       throw new Error(`Failed to load custom icon "${name}"`);
+ *     }
+ *     return response.text();
+ *   },
+ * });
+ * </script>
  * ```
  */
 export declare class DaikinIcon extends DDSElement {
     static readonly styles: import('lit').CSSResult;
     /**
-     * Specify the name of the icon
+     * Specify icon registry instance.
+     * Default is the global icon registry.
+     */
+    registry: IconRegistry;
+    /**
+     * Specify the name of the icon.
+     * Can be a static DDS icon name or a custom icon name registered in the icon registry.
      */
-    icon: IconType | null;
+    icon: string | null;
     /**
      * Specify icon color
      */
@@ -44,6 +160,10 @@ export declare class DaikinIcon extends DDSElement {
      * If "current" is set, `--ddc-icon-size` CSS variable will be used. `--ddc-icon-size` may be set by the parent component such as `daikin-icon-button`.
      */
     size: "s" | "m" | "l" | "xl" | "current";
+    private _iconData;
+    connectedCallback(): void;
+    updated(changedProperties: Map<string, unknown>): void;
+    private loadIcon;
     render(): import('lit-html').TemplateResult<1>;
 }
 declare global {

package/dist/cjs-dev/components/icon/icons.json.cjs

@@ -1,4 +1,8 @@
 "use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const icons = { "logo-positive": { "class": "i-daikin-logo-positive", "color": null }, "logo-negative": { "class": "i-daikin-logo-negative", "color": null }, "alarm": { "class": "i-daikin-alarm", "color": null }, "close": { "class": "i-daikin-close", "color": "#a0a0a0" }, "information": { "class": "i-daikin-information", "color": null }, "error": { "class": "i-daikin-error", "color": null }, "success": { "class": "i-daikin-success", "color": null }, "warning": { "class": "i-daikin-warning", "color": null }, "pagination-chevron-left": { "class": "i-daikin-pagination-chevron-left", "color": "#414141" }, "pagination-chevron-right": { "class": "i-daikin-pagination-chevron-right", "color": "#414141" }, "profile": { "class": "i-daikin-profile", "color": null }, "chevron-up": { "class": "i-daikin-chevron-up", "color": null }, "chevron-down": { "class": "i-daikin-chevron-down", "color": null }, "chevron-left": { "class": "i-daikin-chevron-left", "color": null }, "chevron-right": { "class": "i-daikin-chevron-right", "color": null }, "sort": { "class": "i-daikin-sort", "color": null }, "negative": { "class": "i-daikin-error", "color": null }, "positive": { "class": "i-daikin-success", "color": null }, "cross": { "class": "i-daikin-close", "color": null } };
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const icons = { "logo-positive": { "class": "i-daikin-logo-positive", "color": null }, "logo-negative": { "class": "i-daikin-logo-negative", "color": null }, "alarm": { "class": "i-daikin-alarm", "color": null }, "close": { "class": "i-daikin-close", "color": "#a0a0a0" }, "information": { "class": "i-daikin-information", "color": null }, "error": { "class": "i-daikin-error", "color": null }, "success": { "class": "i-daikin-success", "color": null }, "warning": { "class": "i-daikin-warning", "color": null }, "pagination-chevron-left": { "class": "i-daikin-pagination-chevron-left", "color": "#414141" }, "pagination-chevron-right": { "class": "i-daikin-pagination-chevron-right", "color": "#414141" }, "profile": { "class": "i-daikin-profile", "color": null }, "chevron-up": { "class": "i-daikin-chevron-up", "color": null }, "chevron-down": { "class": "i-daikin-chevron-down", "color": null }, "chevron-left": { "class": "i-daikin-chevron-left", "color": null }, "chevron-right": { "class": "i-daikin-chevron-right", "color": null }, "sort": { "class": "i-daikin-sort", "color": null } };
+const iconsJson = {
+  icons
+};
+exports.default = iconsJson;
 exports.icons = icons;

package/dist/cjs-dev/components/icon/icons.json.d.cts

@@ -63,18 +63,6 @@ declare const _default: {
     "sort": {
       "class": "i-daikin-sort",
       "color": null
-    },
-    "negative": {
-      "class": "i-daikin-error",
-      "color": null
-    },
-    "positive": {
-      "class": "i-daikin-success",
-      "color": null
-    },
-    "cross": {
-      "class": "i-daikin-close",
-      "color": null
     }
   }
 }

package/dist/cjs-dev/components/icon-button/daikin-icon-button.cjs

@@ -89,6 +89,7 @@ exports.DaikinIconButton = class DaikinIconButton extends ddsFormElement.DDSForm
     this.buttonRole = null;
     this.buttonAriaHaspopup = null;
     this.buttonAriaExpanded = null;
+    this.size = "s";
     this.addEventListener("click", (event) => {
       if (this.disabled) {
         event.stopImmediatePropagation();
@@ -146,8 +147,14 @@ exports.DaikinIconButton.styles = lit.css`
 
     :host {
       display: inline-block;
-      width: 2rem;
-      height: 2rem;
+      width: var(--ddc-icon-button-size, 2rem);
+      height: var(--ddc-icon-button-size, 2rem);
+    }
+    :host([size="s"]) {
+      --ddc-icon-button-size: 2rem; /* 32px */
+    }
+    :host([size="m"]) {
+      --ddc-icon-button-size: 3rem; /* 48px */
     }
   `;
 __decorateClass([
@@ -177,6 +184,9 @@ __decorateClass([
 __decorateClass([
   decorators_js.property({ type: Boolean, reflect: true, attribute: "button-aria-expanded" })
 ], exports.DaikinIconButton.prototype, "buttonAriaExpanded", 2);
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true })
+], exports.DaikinIconButton.prototype, "size", 2);
 __decorateClass([
   decorators_js.query("button")
 ], exports.DaikinIconButton.prototype, "_button", 2);

package/dist/cjs-dev/components/icon-button/daikin-icon-button.d.cts

@@ -75,6 +75,14 @@ export declare class DaikinIconButton extends DDSFormSubmitElement {
      * When used within a daikin-menu component, this property will be controlled by daikin-menu, so you don't need to specify it explicitly.
      */
     buttonAriaExpanded: boolean | null;
+    /**
+     * Size of the button.
+     * - `s`: 32px * 32px
+     * - `m`: 48px * 48px
+     *
+     * Default is `s`.
+     */
+    size: "s" | "m";
     private _button;
     constructor();
     render(): import('lit-html').TemplateResult<1>;

package/dist/cjs-dev/components/index.cjs

@@ -14,6 +14,8 @@ const daikinCarousel = require("./carousel/daikin-carousel.cjs");
 const daikinCarouselItem = require("./carousel-item/daikin-carousel-item.cjs");
 const daikinCheckbox = require("./checkbox/daikin-checkbox.cjs");
 const daikinCheckboxGroup = require("./checkbox-group/daikin-checkbox-group.cjs");
+const daikinChip = require("./chip/daikin-chip.cjs");
+const daikinCombobox = require("./combobox/daikin-combobox.cjs");
 const daikinDatePicker = require("./date-picker/daikin-date-picker.cjs");
 const daikinDropdown = require("./dropdown/daikin-dropdown.cjs");
 const daikinDropdownItem = require("./dropdown-item/daikin-dropdown-item.cjs");
@@ -35,6 +37,7 @@ const daikinProgressBar = require("./progress-bar/daikin-progress-bar.cjs");
 const daikinProgressIndicator = require("./progress-indicator/daikin-progress-indicator.cjs");
 const daikinProgressIndicatorItem = require("./progress-indicator-item/daikin-progress-indicator-item.cjs");
 const daikinRadio = require("./radio/daikin-radio.cjs");
+const daikinRadioGroup = require("./radio-group/daikin-radio-group.cjs");
 const daikinSelect = require("./select/daikin-select.cjs");
 const daikinSlider = require("./slider/daikin-slider.cjs");
 const daikinTab = require("./tab/daikin-tab.cjs");
@@ -45,6 +48,8 @@ const daikinTableHeaderCell = require("./table-header-cell/daikin-table-header-c
 const daikinTabs = require("./tabs/daikin-tabs.cjs");
 const daikinTextArea = require("./text-area/daikin-text-area.cjs");
 const daikinTextField = require("./text-field/daikin-text-field.cjs");
+const daikinTextMaskedField = require("./text-masked-field/daikin-text-masked-field.cjs");
+const daikinTimePicker = require("./time-picker/daikin-time-picker.cjs");
 const daikinToastNotification = require("./toast-notification/daikin-toast-notification.cjs");
 const daikinToastNotificationManager = require("./toast-notification-manager/daikin-toast-notification-manager.cjs");
 const daikinToggle = require("./toggle/daikin-toggle.cjs");
@@ -108,6 +113,15 @@ Object.defineProperty(exports, "DaikinCheckboxGroup", {
   enumerable: true,
   get: () => daikinCheckboxGroup.DaikinCheckboxGroup
 });
+Object.defineProperty(exports, "DaikinChip", {
+  enumerable: true,
+  get: () => daikinChip.DaikinChip
+});
+Object.defineProperty(exports, "DaikinCombobox", {
+  enumerable: true,
+  get: () => daikinCombobox.DaikinCombobox
+});
+exports.defaultFilterFn = daikinCombobox.defaultFilterFn;
 Object.defineProperty(exports, "DaikinDatePicker", {
   enumerable: true,
   get: () => daikinDatePicker.DaikinDatePicker
@@ -193,6 +207,10 @@ Object.defineProperty(exports, "DaikinRadio", {
   enumerable: true,
   get: () => daikinRadio.DaikinRadio
 });
+Object.defineProperty(exports, "DaikinRadioGroup", {
+  enumerable: true,
+  get: () => daikinRadioGroup.DaikinRadioGroup
+});
 Object.defineProperty(exports, "DaikinSelect", {
   enumerable: true,
   get: () => daikinSelect.DaikinSelect
@@ -233,6 +251,24 @@ Object.defineProperty(exports, "DaikinTextField", {
   enumerable: true,
   get: () => daikinTextField.DaikinTextField
 });
+Object.defineProperty(exports, "DaikinTextMaskedField", {
+  enumerable: true,
+  get: () => daikinTextMaskedField.DaikinTextMaskedField
+});
+Object.defineProperty(exports, "DaikinTimePicker", {
+  enumerable: true,
+  get: () => daikinTimePicker.DaikinTimePicker
+});
+exports.calcDigitInput = daikinTimePicker.calcDigitInput;
+exports.formatPartsForUI = daikinTimePicker.formatPartsForUI;
+exports.formatTimeForUI = daikinTimePicker.formatTimeForUI;
+exports.from24HourFormat = daikinTimePicker.from24HourFormat;
+exports.getTimeItemInSelection = daikinTimePicker.getTimeItemInSelection;
+exports.isTimeOutOfRange = daikinTimePicker.isTimeOutOfRange;
+exports.isValidValueTime = daikinTimePicker.isValidValueTime;
+exports.parsePartsFromUIValue = daikinTimePicker.parsePartsFromUIValue;
+exports.to24HourFormat = daikinTimePicker.to24HourFormat;
+exports.tryParseTimeFromUIValue = daikinTimePicker.tryParseTimeFromUIValue;
 Object.defineProperty(exports, "DaikinToastNotification", {
   enumerable: true,
   get: () => daikinToastNotification.DaikinToastNotification

package/dist/cjs-dev/components/index.d.cts

@@ -12,6 +12,8 @@ export * from "./carousel/index.cjs";
 export * from "./carousel-item/index.cjs";
 export * from "./checkbox/index.cjs";
 export * from "./checkbox-group/index.cjs";
+export * from "./chip/index.cjs";
+export * from "./combobox/index.cjs";
 export * from "./date-picker/index.cjs";
 export * from "./dropdown/index.cjs";
 export * from "./dropdown-item/index.cjs";
@@ -33,6 +35,7 @@ export * from "./progress-bar/index.cjs";
 export * from "./progress-indicator/index.cjs";
 export * from "./progress-indicator-item/index.cjs";
 export * from "./radio/index.cjs";
+export * from "./radio-group/index.cjs";
 export * from "./select/index.cjs";
 export * from "./slider/index.cjs";
 export * from "./tab/index.cjs";
@@ -43,6 +46,8 @@ export * from "./table-header-cell/index.cjs";
 export * from "./tabs/index.cjs";
 export * from "./text-area/index.cjs";
 export * from "./text-field/index.cjs";
+export * from "./text-masked-field/index.cjs";
+export * from "./time-picker/index.cjs";
 export * from "./toast-notification/index.cjs";
 export * from "./toast-notification-manager/index.cjs";
 export * from "./toggle/index.cjs";

package/dist/cjs-dev/components/input-group/daikin-input-group.cjs

@@ -184,7 +184,7 @@ __decorateClass([
 ], exports.DaikinInputGroup.prototype, "_textareas", 2);
 __decorateClass([
   decorators_js.queryAssignedElements({
-    selector: "daikin-date-picker,daikin-dropdown,daikin-radio-group,daikin-checkbox-group,daikin-select,daikin-text-field,daikin-text-area"
+    selector: "daikin-checkbox-group,daikin-combobox,daikin-date-picker,daikin-dropdown,daikin-radio-group,daikin-select,daikin-text-area,daikin-text-field,daikin-time-picker"
   })
 ], exports.DaikinInputGroup.prototype, "_controls", 2);
 __decorateClass([