@daikin-oss/design-system-web-components 1.0.0 → 1.1.0

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

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const icons = { "alarm": { "class": "i-daikin-status-alarm", "color": null }, "close": { "class": "i-daikin-notification-close", "color": "#a0a0a0" }, "information": { "class": "i-daikin-status-information", "color": null }, "negative": { "class": "i-daikin-status-negative", "color": null }, "positive": { "class": "i-daikin-status-positive", "color": null }, "warning": { "class": "i-daikin-status-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" }, "error": { "class": "i-daikin-status-error", "color": "#FF4949" }, "cross": { "class": "i-daikin-cross", "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 icons = { "alarm": { "class": "i-daikin-status-alarm", "color": null }, "close": { "class": "i-daikin-notification-close", "color": "#a0a0a0" }, "information": { "class": "i-daikin-status-information", "color": null }, "negative": { "class": "i-daikin-status-negative", "color": null }, "positive": { "class": "i-daikin-status-positive", "color": null }, "warning": { "class": "i-daikin-status-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" }, "error": { "class": "i-daikin-status-error", "color": "#FF4949" }, "cross": { "class": "i-daikin-cross", "color": null }, "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 } };
 exports.icons = icons;

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

@@ -40,6 +40,10 @@ declare const _default: {
       "class": "i-daikin-cross",
       "color": null
     },
+    "profile": {
+      "class": "i-daikin-profile",
+      "color": null
+    },
     "chevron-up": {
       "class": "i-daikin-chevron-up",
       "color": null

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

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const daikinAccordion = require("./accordion/daikin-accordion.cjs");
 const daikinAccordionItem = require("./accordion-item/daikin-accordion-item.cjs");
+const daikinAvatar = require("./avatar/daikin-avatar.cjs");
 const daikinBreadcrumb = require("./breadcrumb/daikin-breadcrumb.cjs");
 const daikinBreadcrumbItem = require("./breadcrumb-item/daikin-breadcrumb-item.cjs");
 const daikinButton = require("./button/daikin-button.cjs");
@@ -20,6 +21,7 @@ const daikinInputGroup = require("./input-group/daikin-input-group.cjs");
 const daikinLink = require("./link/daikin-link.cjs");
 const daikinList = require("./list/daikin-list.cjs");
 const daikinListItem = require("./list-item/daikin-list-item.cjs");
+const daikinLoading = require("./loading/daikin-loading.cjs");
 const daikinPagination = require("./pagination/daikin-pagination.cjs");
 const daikinProgressBar = require("./progress-bar/daikin-progress-bar.cjs");
 const daikinProgressIndicator = require("./progress-indicator/daikin-progress-indicator.cjs");
@@ -49,6 +51,10 @@ Object.defineProperty(exports, "DaikinAccordionItem", {
   enumerable: true,
   get: () => daikinAccordionItem.DaikinAccordionItem
 });
+Object.defineProperty(exports, "DaikinAvatar", {
+  enumerable: true,
+  get: () => daikinAvatar.DaikinAvatar
+});
 Object.defineProperty(exports, "DaikinBreadcrumb", {
   enumerable: true,
   get: () => daikinBreadcrumb.DaikinBreadcrumb
@@ -122,6 +128,10 @@ Object.defineProperty(exports, "DaikinListItem", {
   enumerable: true,
   get: () => daikinListItem.DaikinListItem
 });
+Object.defineProperty(exports, "DaikinLoading", {
+  enumerable: true,
+  get: () => daikinLoading.DaikinLoading
+});
 Object.defineProperty(exports, "DaikinPagination", {
   enumerable: true,
   get: () => daikinPagination.DaikinPagination

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

@@ -1,5 +1,6 @@
 export * from "./accordion/index.cjs";
 export * from "./accordion-item/index.cjs";
+export * from "./avatar/index.cjs";
 export * from "./breadcrumb/index.cjs";
 export * from "./breadcrumb-item/index.cjs";
 export * from "./button/index.cjs";
@@ -18,6 +19,7 @@ export * from "./input-group/index.cjs";
 export * from "./link/index.cjs";
 export * from "./list/index.cjs";
 export * from "./list-item/index.cjs";
+export * from "./loading/index.cjs";
 export * from "./pagination/index.cjs";
 export * from "./progress-bar/index.cjs";
 export * from "./progress-indicator/index.cjs";

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

@@ -0,0 +1,91 @@
+"use strict";
+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 tailwind = require("../../tailwind.css.cjs");
+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 cvaLoadingContainer = classVarianceAuthority.cva(
+  ["flex", "justify-center", "items-center", "size-full"],
+  {
+    variants: {
+      background: {
+        false: ["bg-transparent"],
+        true: ["bg-ddt-color-common-background-default", "rounded"]
+      }
+    }
+  }
+);
+const cvaLoading = classVarianceAuthority.cva(
+  [
+    "block",
+    "border-t-ddt-color-common-brand-default",
+    "border-r-ddt-color-common-brand-default",
+    "border-b-ddt-color-common-brand-default",
+    "border-l-transparent",
+    "rounded-full",
+    "animate-[loading_800ms_linear_infinite]"
+  ],
+  {
+    variants: {
+      size: {
+        small: ["size-[1.125rem]", "border-2"],
+        medium: ["size-9", "border-4"]
+      }
+    }
+  }
+);
+exports.DaikinLoading = class DaikinLoading extends lit.LitElement {
+  constructor() {
+    super(...arguments);
+    this.size = "medium";
+    this.background = false;
+  }
+  render() {
+    return lit.html`<div
+      class=${cvaLoadingContainer({ background: this.background })}
+      role="progressbar"
+      aria-busy="true"
+      aria-label="Loading"
+    >
+      <div class="size-fit rotate-45">
+        <span class=${cvaLoading({ size: this.size })}></span>
+      </div>
+    </div>`;
+  }
+};
+exports.DaikinLoading.styles = lit.css`
+    ${lit.unsafeCSS(tailwind.default)}
+
+    :host {
+      display: block;
+    }
+
+    :host([size="small"]) {
+      width: 2rem;
+      height: 2rem;
+    }
+
+    :host([size="medium"]) {
+      width: 3.5rem;
+      height: 3.5rem;
+    }
+  `;
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true })
+], exports.DaikinLoading.prototype, "size", 2);
+__decorateClass([
+  decorators_js.property({ type: Boolean, reflect: true })
+], exports.DaikinLoading.prototype, "background", 2);
+exports.DaikinLoading = __decorateClass([
+  decorators_js.customElement("daikin-loading")
+], exports.DaikinLoading);

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

@@ -0,0 +1,32 @@
+import { LitElement } from 'lit';
+/**
+ * The loading component displays a spinner to indicate that a process is in progress.
+ * If the spinner is expected to blend into the background, set the background color. You can use the `background` attribute for such cases.
+ *
+ * @example
+ *
+ * ```js
+ * import "@daikin-oss/design-system-web-components/components/loading/index.js";
+ * ```
+ *
+ * ```html
+ *  <daikin-loading></daikin-loading>
+ * ```
+ */
+export declare class DaikinLoading extends LitElement {
+    static readonly styles: import('lit').CSSResult;
+    /**
+     * Size of the loading.
+     */
+    size: "small" | "medium";
+    /**
+     * Variant of the loading.
+     */
+    background: boolean;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "daikin-loading": DaikinLoading;
+    }
+}

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

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const daikinLoading = require("./daikin-loading.cjs");
+Object.defineProperty(exports, "DaikinLoading", {
+  enumerable: true,
+  get: () => daikinLoading.DaikinLoading
+});

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

@@ -0,0 +1 @@
+export * from "./daikin-loading.cjs";

package/dist/cjs-dev/index.cjs

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const daikinAccordion = require("./components/accordion/daikin-accordion.cjs");
 const daikinAccordionItem = require("./components/accordion-item/daikin-accordion-item.cjs");
+const daikinAvatar = require("./components/avatar/daikin-avatar.cjs");
 const daikinBreadcrumb = require("./components/breadcrumb/daikin-breadcrumb.cjs");
 const daikinBreadcrumbItem = require("./components/breadcrumb-item/daikin-breadcrumb-item.cjs");
 const daikinButton = require("./components/button/daikin-button.cjs");
@@ -20,6 +21,7 @@ const daikinInputGroup = require("./components/input-group/daikin-input-group.cj
 const daikinLink = require("./components/link/daikin-link.cjs");
 const daikinList = require("./components/list/daikin-list.cjs");
 const daikinListItem = require("./components/list-item/daikin-list-item.cjs");
+const daikinLoading = require("./components/loading/daikin-loading.cjs");
 const daikinPagination = require("./components/pagination/daikin-pagination.cjs");
 const daikinProgressBar = require("./components/progress-bar/daikin-progress-bar.cjs");
 const daikinProgressIndicator = require("./components/progress-indicator/daikin-progress-indicator.cjs");
@@ -49,6 +51,10 @@ Object.defineProperty(exports, "DaikinAccordionItem", {
   enumerable: true,
   get: () => daikinAccordionItem.DaikinAccordionItem
 });
+Object.defineProperty(exports, "DaikinAvatar", {
+  enumerable: true,
+  get: () => daikinAvatar.DaikinAvatar
+});
 Object.defineProperty(exports, "DaikinBreadcrumb", {
   enumerable: true,
   get: () => daikinBreadcrumb.DaikinBreadcrumb
@@ -122,6 +128,10 @@ Object.defineProperty(exports, "DaikinListItem", {
   enumerable: true,
   get: () => daikinListItem.DaikinListItem
 });
+Object.defineProperty(exports, "DaikinLoading", {
+  enumerable: true,
+  get: () => daikinLoading.DaikinLoading
+});
 Object.defineProperty(exports, "DaikinPagination", {
   enumerable: true,
   get: () => daikinPagination.DaikinPagination