@daikin-oss/design-system-web-components 2.0.0 → 2.0.1-next.1

package/dist/es-dev/components/icon/daikin-icon.js

@@ -1,236 +1,188 @@
-import { cva } from "class-variance-authority";
-import { unsafeCSS, css, html } from "lit";
-import { state } from "lit/decorators.js";
-import { unsafeHTML } from "lit/directives/unsafe-html.js";
 import { DDSElement } from "../../base/dds-element.js";
-import "../../base/dds-form-element.js";
-import { property, oneOf } from "../../base/dds-property.js";
+import { oneOf, property as property$1 } from "../../base/dds-property.js";
+import __decorate from "../../_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/decorate.js";
 import { ddsElement } from "../../base/decorators.js";
-import "../../base/define.js";
+import "../../base/index.js";
+import tailwind_default from "../../tailwind.css.js";
 import { iconRegistry } from "../../icon-registry.js";
-import tailwindStyles from "../../tailwind.css.js";
-import iconsJson from "./icons.json.js";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-const { icons } = iconsJson;
-const iconList = Object.keys(icons).filter(
-  (key) => key !== "logo-positive" && key !== "logo-negative"
-);
+import icons_default from "./icons.json.js";
+import { css, html, unsafeCSS } from "lit";
+import { state } from "lit/decorators.js";
+import { cva } from "class-variance-authority";
+import { unsafeHTML } from "lit/directives/unsafe-html.js";
+//#region src/components/icon/daikin-icon.ts
+var { icons } = icons_default;
+var iconList = Object.keys(icons).filter((key) => key !== "logo-positive" && key !== "logo-negative");
 function svgToDataUrl(svg) {
-  const encoded = encodeURIComponent(svg).replaceAll("'", "%27");
-  return `url("data:image/svg+xml,${encoded}")`;
+	return `url("data:image/svg+xml,${encodeURIComponent(svg).replaceAll("'", "%27")}")`;
 }
-const cvaIcon = cva(["inline-flex size-full"], {
-  variants: {
-    color: {
-      black: ["text-black"],
-      white: ["text-ddt-color-common-text-inverse"],
-      default: ["text-(--default-color)"],
-      current: []
-      // uses `currentColor`
-    },
-    mode: {
-      inline: [],
-      mask: [
-        "bg-current",
-        "mask-size-[100%_100%]",
-        "mask-no-repeat",
-        "mask-(--svg)"
-      ],
-      background: ["bg-no-repeat", "bg-size-[100%_100%]", "bg-(image:--svg)"],
-      static: []
-      // for static icons from icons.json
-    }
-  }
-});
-let DaikinIcon = class extends DDSElement {
-  constructor() {
-    super(...arguments);
-    this.registry = iconRegistry;
-    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
-          );
-        }
-      });
+var cvaIcon = cva(["inline-flex size-full"], { variants: {
+	color: {
+		black: ["text-ddt-color-black"],
+		white: ["text-ddt-color-white"],
+		default: ["text-(--default-color)"],
+		current: []
+	},
+	mode: {
+		inline: [],
+		mask: [
+			"bg-current",
+			"mask-size-[100%_100%]",
+			"mask-no-repeat",
+			"mask-(--svg)"
+		],
+		background: [
+			"bg-no-repeat",
+			"bg-size-[100%_100%]",
+			"bg-(image:--svg)"
+		],
+		static: []
+	}
+} });
+var DaikinIcon = class DaikinIcon extends DDSElement {
+	constructor(..._args) {
+		super(..._args);
+		this.registry = iconRegistry;
+		this._iconData = null;
+	}
+	static {
+		this.styles = css`
+    ${unsafeCSS(tailwind_default)}
+
+    :host {
+      display: inline-flex;
+      width: var(--ddc-icon-size, 100%);
+      height: var(--ddc-icon-size, 100%);
     }
-  }
-  async loadIcon() {
-    if (!this.icon) {
-      this._iconData = null;
-      return;
+
+    :host([size="s"]) {
+      --ddc-icon-size: 16px;
     }
-    const staticIcon = icons[this.icon];
-    if (staticIcon) {
-      this._iconData = {
-        mode: "static",
-        defaultColor: staticIcon.color,
-        class: staticIcon.class
-      };
-      return;
+
+    :host([size="m"]) {
+      --ddc-icon-size: 24px;
     }
-    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;
+
+    :host([size="l"]) {
+      --ddc-icon-size: 32px;
     }
-  }
-  render() {
-    {
-      if (!this.icon) {
-        console.warn("icon property is not specified for daikin-icon");
-      }
+
+    :host([size="xl"]) {
+      --ddc-icon-size: 40px;
     }
-    if (!this.icon) {
-      return html`<span
+  `;
+	}
+	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 (!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() {
+		if (!this.icon) console.warn("icon property is not specified for daikin-icon");
+		if (!this.icon) return html`<span
         class=${cvaIcon({
-        color: this.color,
-        mode: "static"
-      })}
+			color: this.color,
+			mode: "static"
+		})}
         title="Unknown icon"
       ></span>`;
-    }
-    if (!this._iconData) {
-      return html`<span
+		if (!this._iconData) return html`<span
         class=${cvaIcon({
-        color: this.color,
-        mode: "inline"
-      })}
+			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 html`<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 html`<span
         class="${cvaIcon({
-        color: this.color,
-        mode: "static"
-      })} ${this._iconData.class}"
+			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 html`<span
+		const mode = this._iconData.mode ?? "mask";
+		if (mode === "inline") return html`<span
         class=${cvaIcon({
-        color: this.color,
-        mode
-      })}
+			color: this.color,
+			mode
+		})}
         style=${`--default-color:${defaultColor ?? "#000000"}`}
         role="presentation"
         >${unsafeHTML(this._iconData.svg)}</span
       >`;
-    }
-    const svgDataUrl = svgToDataUrl(this._iconData.svg);
-    return html`<span
+		const svgDataUrl = svgToDataUrl(this._iconData.svg);
+		return html`<span
       class=${cvaIcon({
-      color: this.color,
-      mode
-    })}
+			color: this.color,
+			mode
+		})}
       style=${`--default-color:${defaultColor ?? "#000000"};--svg:${svgDataUrl}`}
       role="presentation"
     ></span>`;
-  }
-};
-DaikinIcon.styles = css`
-    ${unsafeCSS(tailwindStyles)}
-
-    :host {
-      display: inline-flex;
-      width: var(--ddc-icon-size, 100%);
-      height: var(--ddc-icon-size, 100%);
-    }
-
-    :host([size="s"]) {
-      --ddc-icon-size: 16px;
-    }
-
-    :host([size="m"]) {
-      --ddc-icon-size: 24px;
-    }
-
-    :host([size="l"]) {
-      --ddc-icon-size: 32px;
-    }
-
-    :host([size="xl"]) {
-      --ddc-icon-size: 40px;
-    }
-  `;
-__decorateClass([
-  property({ attribute: false })
-], DaikinIcon.prototype, "registry", 2);
-__decorateClass([
-  property({ type: String, reflect: true, fallbackValue: "" })
-], DaikinIcon.prototype, "icon", 2);
-__decorateClass([
-  property({
-    type: String,
-    reflect: true,
-    fallbackValue: "default",
-    isAllowedValue: oneOf([
-      "default",
-      "current",
-      "black",
-      "white"
-    ])
-  })
-], DaikinIcon.prototype, "color", 2);
-__decorateClass([
-  property({
-    type: String,
-    reflect: true,
-    fallbackValue: "current",
-    isAllowedValue: oneOf(["s", "m", "l", "xl", "current"])
-  })
-], DaikinIcon.prototype, "size", 2);
-__decorateClass([
-  state()
-], DaikinIcon.prototype, "_iconData", 2);
-DaikinIcon = __decorateClass([
-  ddsElement("daikin-icon")
-], DaikinIcon);
-export {
-  DaikinIcon,
-  iconList
+	}
 };
+__decorate([property$1({ attribute: false })], DaikinIcon.prototype, "registry", void 0);
+__decorate([property$1({
+	type: String,
+	reflect: true,
+	fallbackValue: ""
+})], DaikinIcon.prototype, "icon", void 0);
+__decorate([property$1({
+	type: String,
+	reflect: true,
+	fallbackValue: "default",
+	isAllowedValue: oneOf([
+		"default",
+		"current",
+		"black",
+		"white"
+	])
+})], DaikinIcon.prototype, "color", void 0);
+__decorate([property$1({
+	type: String,
+	reflect: true,
+	fallbackValue: "current",
+	isAllowedValue: oneOf([
+		"s",
+		"m",
+		"l",
+		"xl",
+		"current"
+	])
+})], DaikinIcon.prototype, "size", void 0);
+__decorate([state()], DaikinIcon.prototype, "_iconData", void 0);
+DaikinIcon = __decorate([ddsElement("daikin-icon")], DaikinIcon);
+//#endregion
+export { DaikinIcon, iconList };

package/dist/es-dev/components/icon/icons.json.js

@@ -1,8 +1,98 @@
-const icons = { "logo-positive": { "class": "icon-[daikin--logo-positive]", "color": null }, "logo-negative": { "class": "icon-[daikin--logo-negative]", "color": null }, "alarm": { "class": "icon-[daikin--alarm]", "color": null }, "close": { "class": "icon-[daikin--close]", "color": "#a0a0a0" }, "information": { "class": "icon-[daikin--information]", "color": null }, "error": { "class": "icon-[daikin--error]", "color": null }, "success": { "class": "icon-[daikin--success]", "color": null }, "warning": { "class": "icon-[daikin--warning]", "color": null }, "pagination-chevron-left": { "class": "icon-[daikin--pagination-chevron-left]", "color": "#414141" }, "pagination-chevron-right": { "class": "icon-[daikin--pagination-chevron-right]", "color": "#414141" }, "profile": { "class": "icon-[daikin--profile]", "color": null }, "chevron-up": { "class": "icon-[daikin--chevron-up]", "color": null }, "chevron-down": { "class": "icon-[daikin--chevron-down]", "color": null }, "chevron-left": { "class": "icon-[daikin--chevron-left]", "color": null }, "chevron-right": { "class": "icon-[daikin--chevron-right]", "color": null }, "sort": { "class": "icon-[daikin--sort]", "color": null }, "negative": { "class": "icon-[daikin--error]", "color": null }, "positive": { "class": "icon-[daikin--success]", "color": null }, "cross": { "class": "icon-[daikin--close]", "color": null }, "notification": { "class": "icon-[daikin--notification]", "color": null }, "neutral": { "class": "icon-[daikin--neutral]", "color": null }, "download": { "class": "icon-[daikin--download]", "color": null }, "check": { "class": "icon-[daikin--check]", "color": null } };
-const iconsJson = {
-  icons
-};
-export {
-  iconsJson as default,
-  icons
+//#region src/components/icon/icons.json
+var icons = {
+	"logo-positive": {
+		"class": "icon-[daikin--logo-positive]",
+		"color": null
+	},
+	"logo-negative": {
+		"class": "icon-[daikin--logo-negative]",
+		"color": null
+	},
+	"alarm": {
+		"class": "icon-[daikin--alarm]",
+		"color": null
+	},
+	"close": {
+		"class": "icon-[daikin--close]",
+		"color": "#a0a0a0"
+	},
+	"information": {
+		"class": "icon-[daikin--information]",
+		"color": null
+	},
+	"error": {
+		"class": "icon-[daikin--error]",
+		"color": null
+	},
+	"success": {
+		"class": "icon-[daikin--success]",
+		"color": null
+	},
+	"warning": {
+		"class": "icon-[daikin--warning]",
+		"color": null
+	},
+	"pagination-chevron-left": {
+		"class": "icon-[daikin--pagination-chevron-left]",
+		"color": "#414141"
+	},
+	"pagination-chevron-right": {
+		"class": "icon-[daikin--pagination-chevron-right]",
+		"color": "#414141"
+	},
+	"profile": {
+		"class": "icon-[daikin--profile]",
+		"color": null
+	},
+	"chevron-up": {
+		"class": "icon-[daikin--chevron-up]",
+		"color": null
+	},
+	"chevron-down": {
+		"class": "icon-[daikin--chevron-down]",
+		"color": null
+	},
+	"chevron-left": {
+		"class": "icon-[daikin--chevron-left]",
+		"color": null
+	},
+	"chevron-right": {
+		"class": "icon-[daikin--chevron-right]",
+		"color": null
+	},
+	"sort": {
+		"class": "icon-[daikin--sort]",
+		"color": null
+	},
+	"negative": {
+		"class": "icon-[daikin--error]",
+		"color": null
+	},
+	"positive": {
+		"class": "icon-[daikin--success]",
+		"color": null
+	},
+	"cross": {
+		"class": "icon-[daikin--close]",
+		"color": null
+	},
+	"notification": {
+		"class": "icon-[daikin--notification]",
+		"color": null
+	},
+	"neutral": {
+		"class": "icon-[daikin--neutral]",
+		"color": null
+	},
+	"download": {
+		"class": "icon-[daikin--download]",
+		"color": null
+	},
+	"check": {
+		"class": "icon-[daikin--check]",
+		"color": null
+	}
 };
+var icons_default = { icons };
+//#endregion
+export { icons_default as default, icons };

package/dist/es-dev/components/icon/index.js

@@ -1,5 +1,2 @@
 import { DaikinIcon, iconList } from "./daikin-icon.js";
-export {
-  DaikinIcon,
-  iconList
-};
+export { DaikinIcon, iconList };