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

package/dist/cjs/utils/calendar-common.d.cts

@@ -0,0 +1,64 @@
+export declare const DEFAULT_MIN_DATE = "1900-01-01";
+export declare const DEFAULT_MAX_DATE = "2099-12-31";
+export declare const cvaIconButton: (props?: ({
+    intent?: "previous" | "next" | "calender" | "pulldown" | null | undefined;
+    rotate?: "default" | "inverse" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+/**
+ * Determines whether the specified date is outside the range. Time information is ignored.
+ */
+export declare function isDateOutOfRange(base: Date, min: Date, max: Date): boolean;
+/**
+ * Determines whether the specified month and year are outside the range. Date and time information is ignored.
+ */
+export declare function isMonthOutOfRange(base: Date, min: Date, max: Date): boolean;
+/**
+ * Determines whether the year and month of two dates are the same.
+ */
+export declare function isSameYearMonth(a: Date, b: Date): boolean;
+/**
+ * Stringify the date in YYYY-MM-DD format.
+ */
+export declare function formatDateForProperty(date: Date): string;
+/**
+ * Parses the date in YYYY-MM-DD format and returns UTC date.
+ */
+export declare function parseDateFromProperty(value: string): Date;
+/**
+ * Try parsing the date in YYYY-MM-DD format and returns UTC date if available.
+ */
+export declare function tryParseDateFromProperty(value: string): Date | null;
+/**
+ * Normalizes the Date by stripping time information.
+ */
+export declare function normalizeDate(base: Date): Date;
+/**
+ * Clones the Date with stripping time information.
+ */
+export declare function cloneDate(base: Date): Date;
+/**
+ * Clamps the date to the specified range.
+ */
+export declare function clampDate(base: Date, min: Date, max: Date): Date;
+/**
+ * Retrieves the date specified by the year, month, and day.
+ * If the specified date does not exist in the month (e.g., 2/31), it is rounded to the closest date in the same month.
+ * The month is in the range 0 to 11.
+ */
+export declare function createDateClamped(year: number, month: number, date: number): Date;
+/**
+ * Retrieves the date of the same day in a different month with the specified offset.
+ * If that day does not exist in the month (such as February 31), it is rounded to the closest day in the month.
+ */
+export declare function getDateByMonthOffsetClamped(base: Date, monthOffset: number): Date;
+/**
+ * Calculates the sequence of weeks that exist on the calendar for the specified year and month.
+ * The array of weeks in each return value always starts with Sunday and contains seven dates.
+ */
+export declare function calcWeeksOnCalendar(year: number, month: number): Date[][];
+/**
+ * Return the number of days in the specified year and month.
+ * @param year year starting from 1.
+ * @param month month starting from 0 (0 means January).
+ */
+export declare function countDaysForYearMonth(year: number, month: number): number;

package/dist/cjs/utils/is-similar-to-click.cjs

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const isSimilarToClick = (key) => ["Enter", " "].includes(key);
+exports.isSimilarToClick = isSimilarToClick;

package/dist/cjs/utils/is-similar-to-click.d.cts

@@ -0,0 +1 @@
+export declare const isSimilarToClick: (key: string) => boolean;

package/dist/cjs/utils/notification-common.cjs

@@ -45,23 +45,20 @@ const cvaContainer = classVarianceAuthority.cva(
       status: {
         positive: [
           "before:text-ddt-color-common-success",
-          "before:i-daikin-status-positive"
+          "before:i-daikin-success"
         ],
         negative: [
           "before:text-ddt-color-common-danger-default",
-          "before:i-daikin-status-negative"
+          "before:i-daikin-error"
         ],
         warning: [
           "before:text-ddt-color-common-warning",
-          "before:i-daikin-status-warning"
-        ],
-        alarm: [
-          "before:text-ddt-color-common-alarm",
-          "before:i-daikin-status-alarm"
+          "before:i-daikin-warning"
         ],
+        alarm: ["before:text-ddt-color-common-alarm", "before:i-daikin-alarm"],
         information: [
           "before:text-ddt-color-common-information",
-          "before:i-daikin-status-information"
+          "before:i-daikin-information"
         ]
       }
     }
@@ -91,15 +88,22 @@ const cvaTimestamp = classVarianceAuthority.cva(
     }
   }
 );
-const cvaTitle = classVarianceAuthority.cva(["inline-block", "font-bold"], {
-  variants: {
-    layout: {
-      vertical: [],
-      horizontal: ["whitespace-nowrap", "overflow-hidden", "overflow-ellipsis"]
+const cvaTitle = classVarianceAuthority.cva(
+  ["slotted:inline-block", "font-bold", "leading-[130%]"],
+  {
+    variants: {
+      layout: {
+        vertical: [],
+        horizontal: [
+          "slotted:whitespace-nowrap",
+          "slotted:overflow-hidden",
+          "slotted:overflow-ellipsis"
+        ]
+      }
     }
   }
-});
-const cvaDescription = classVarianceAuthority.cva(["inline-block"], {
+);
+const cvaDescription = classVarianceAuthority.cva(["inline-block", "leading-[130%]"], {
   variants: {
     layout: {
       vertical: [],

package/dist/cjs/utils/notification-common.d.cts

@@ -3,7 +3,7 @@ export declare const TOAST_ANIMATION_DURATION = 200;
 export declare function formatDate(date: Date): string | null;
 export declare const cvaContainer: (props?: ({
     variant?: "toast" | "inline" | null | undefined;
-    status?: "alarm" | "information" | "negative" | "positive" | "warning" | null | undefined;
+    status?: "alarm" | "information" | "warning" | "negative" | "positive" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export declare const cvaContent: (props?: ({
     layout?: "horizontal" | "vertical" | null | undefined;

package/dist/cjs/{components/tabs → utils}/scroller.cjs

@@ -5,7 +5,7 @@ function getEffectiveParentElement(element) {
   return element.assignedSlot || element.parentElement || ((_a = element.parentNode) == null ? void 0 : _a.host);
 }
 function getBooleanForDirection(horizontal, vertical, direction) {
-  return horizontal;
+  return direction === "horizontal" ? horizontal : direction === "vertical" ? vertical : horizontal || vertical;
 }
 function isScrollableOverflowValue(overflow) {
   return overflow !== "visible" && overflow !== "hidden" && overflow !== "clip";
@@ -17,43 +17,51 @@ function getFirstScrollableAncestor(element, direction) {
   }
   const overflow = getBooleanForDirection(
     parent.scrollWidth > parent.clientWidth,
-    parent.scrollHeight > parent.clientHeight
+    parent.scrollHeight > parent.clientHeight,
+    direction
   );
   if (overflow) {
     const computedStyle = getComputedStyle(parent);
     const scrollableOverflow = getBooleanForDirection(
       isScrollableOverflowValue(computedStyle.overflowX),
-      isScrollableOverflowValue(computedStyle.overflowY)
+      isScrollableOverflowValue(computedStyle.overflowY),
+      direction
     );
     if (scrollableOverflow) {
       return parent;
     }
   }
-  return getFirstScrollableAncestor(parent);
+  return getFirstScrollableAncestor(parent, direction);
 }
-function calcScrollIntoViewOffset(target, container) {
+function calcScrollIntoViewOffset(target, container, center) {
   const bBoxContainer = container.getBoundingClientRect();
   const bBoxTarget = target.getBoundingClientRect();
+  const xOffset = center ? (bBoxContainer.width - bBoxTarget.width) / 2 : 0;
+  const yOffset = center ? (bBoxContainer.height - bBoxTarget.height) / 2 : 0;
   const scrollByX = (
     // If the left end of the target is to the left of the container, align the left end of the target so that it is in the viewport.
-    Math.min(bBoxTarget.left - bBoxContainer.left, 0) || // If the right end of the target is to the right of the container, align the right end of the target so that it is in the viewport.
-    Math.max(bBoxTarget.right - bBoxContainer.right, 0)
+    Math.min(bBoxTarget.left - bBoxContainer.left - xOffset, 0) || // If the right end of the target is to the right of the container, align the right end of the target so that it is in the viewport.
+    Math.max(bBoxTarget.right - bBoxContainer.right + xOffset, 0)
   );
-  const scrollByY = Math.min(bBoxTarget.top - bBoxContainer.top, 0) || Math.max(bBoxTarget.bottom - bBoxContainer.bottom, 0);
+  const scrollByY = Math.min(bBoxTarget.top - bBoxContainer.top - yOffset, 0) || Math.max(bBoxTarget.bottom - bBoxContainer.bottom + yOffset, 0);
   return [scrollByX, scrollByY];
 }
-function scrollIntoViewOnlyParent(target, direction) {
-  const scrollableParent = getFirstScrollableAncestor(target);
+function scrollIntoViewOnlyParent(target, direction, center) {
+  const scrollableParent = getFirstScrollableAncestor(target, direction);
   if (!scrollableParent) {
     return false;
   }
   let [scrollByX, scrollByY] = calcScrollIntoViewOffset(
     target,
-    scrollableParent
+    scrollableParent,
+    center
   );
-  {
+  if (direction === "horizontal") {
     scrollByY = 0;
   }
+  if (direction === "vertical") {
+    scrollByX = 0;
+  }
   if (scrollByX || scrollByY) {
     scrollableParent.scrollBy(scrollByX, scrollByY);
   }

package/dist/cjs/{components/tabs → utils}/scroller.d.cts

@@ -14,7 +14,7 @@ export declare function getEffectiveParentElement(element: HTMLElement): HTMLEle
  * @returns the first scrollable ancestor element (if any)
  */
 export declare function getFirstScrollableAncestor(element: HTMLElement, direction: Direction): HTMLElement | null;
-export declare function calcScrollIntoViewOffset(target: HTMLElement, container: HTMLElement): [x: number, y: number];
+export declare function calcScrollIntoViewOffset(target: HTMLElement, container: HTMLElement, center: boolean): [x: number, y: number];
 /**
  * An alternative `.scrollIntoView()` function which only scrolls the first scrollable ancestor element.
  *
@@ -22,4 +22,4 @@ export declare function calcScrollIntoViewOffset(target: HTMLElement, container:
  * @param direction direction
  * @returns `true` if success, `false` if scrollable parent not found
  */
-export declare function scrollIntoViewOnlyParent(target: HTMLElement, direction: Direction): boolean;
+export declare function scrollIntoViewOnlyParent(target: HTMLElement, direction: Direction, center: boolean): boolean;

package/dist/cjs-dev/base/dds-element.cjs

@@ -3,6 +3,6 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lit = require("lit");
 const _DDSElement = class _DDSElement extends lit.LitElement {
 };
-_DDSElement.version = "1.0.0";
+_DDSElement.version = "1.2.0";
 let DDSElement = _DDSElement;
 exports.DDSElement = DDSElement;

package/dist/cjs-dev/base/dds-form-element.cjs

@@ -0,0 +1,139 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const decorators_js = require("lit/decorators.js");
+const ddsElement = require("./dds-element.cjs");
+var __defProp = Object.defineProperty;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = void 0;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = decorator(target, key, result) || result;
+  if (result) __defProp(target, key, result);
+  return result;
+};
+const _DDSFormElement = class _DDSFormElement extends ddsElement.DDSElement {
+  constructor() {
+    super();
+    this.name = "";
+    this.value = "";
+    this.internals = this.attachInternals();
+  }
+  /**
+   * Returns the form object associated with the element, or null if none exists.
+   * @private
+   */
+  get form() {
+    return this.internals ? this.internals.form : null;
+  }
+  /**
+   * Set the element's name and value within the current form.
+   * @private
+   */
+  setFormValue(value, state) {
+    var _a;
+    (_a = this.internals) == null ? void 0 : _a.setFormValue(value, state);
+  }
+  /**
+   * A function that maps to the form control's `reportValidity()` function.
+   * Reference: https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/reportValidity
+   * @private
+   */
+  reportValidity() {
+    var _a;
+    return (_a = this.internals) == null ? void 0 : _a.reportValidity();
+  }
+  /**
+   * A function that maps to the form control's `checkValidity()` function.
+   * Reference: https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/checkValidity
+   * @private
+   */
+  checkValidity() {
+    var _a;
+    return (_a = this.internals) == null ? void 0 : _a.checkValidity();
+  }
+  /**
+   * TODO Enhance these functions to bring our components closer to native form components.
+   * @private
+   */
+  hostConnected() {
+  }
+  /**
+   * TODO Enhance these functions to bring our components closer to native form components.
+   * @private
+   */
+  hostDisconnected() {
+  }
+  /**
+   * TODO Enhance these functions to bring our components closer to native form components.
+   * @private
+   */
+  hostUpdated() {
+  }
+};
+_DDSFormElement.formAssociated = true;
+let DDSFormElement = _DDSFormElement;
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true })
+], DDSFormElement.prototype, "name");
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true })
+], DDSFormElement.prototype, "value");
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true, attribute: "form" })
+], DDSFormElement.prototype, "formAttr");
+const _DDSFormSubmitElement = class _DDSFormSubmitElement extends ddsElement.DDSElement {
+  constructor() {
+    super();
+    this.internals = this.attachInternals();
+  }
+  /**
+   * Returns the form object associated with the element, or null if none exists.
+   * @private
+   */
+  get form() {
+    return this.internals ? this.internals.form : null;
+  }
+  /**
+   * A function that maps to the form control's `reportValidity()` function.
+   * Reference: https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/reportValidity
+   * @private
+   */
+  requestSubmit() {
+    var _a, _b;
+    (_b = (_a = this.internals) == null ? void 0 : _a.form) == null ? void 0 : _b.requestSubmit();
+  }
+  /**
+   * A function that maps to the form control's `checkValidity()` function.
+   * Reference: https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/checkValidity
+   * @private
+   */
+  reset() {
+    var _a, _b;
+    (_b = (_a = this.internals) == null ? void 0 : _a.form) == null ? void 0 : _b.reset();
+  }
+  /**
+   * TODO Enhance these functions to bring our components closer to native form components.
+   * @private
+   */
+  hostConnected() {
+  }
+  /**
+   * TODO Enhance these functions to bring our components closer to native form components.
+   * @private
+   */
+  hostDisconnected() {
+  }
+  /**
+   * TODO Enhance these functions to bring our components closer to native form components.
+   * @private
+   */
+  hostUpdated() {
+  }
+};
+_DDSFormSubmitElement.formAssociated = true;
+let DDSFormSubmitElement = _DDSFormSubmitElement;
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true, attribute: "form" })
+], DDSFormSubmitElement.prototype, "formAttr");
+exports.DDSFormElement = DDSFormElement;
+exports.DDSFormSubmitElement = DDSFormSubmitElement;

package/dist/cjs-dev/base/dds-form-element.d.cts

@@ -0,0 +1,100 @@
+import { DDSElement } from "./dds-element.cjs";
+type FormValueType = string | File | FormData | null;
+export declare class DDSFormElement extends DDSElement {
+    static readonly formAssociated = true;
+    /**
+     * The form name, submitted as a name/value pair when submitting the form.
+     */
+    name: string;
+    /**
+     * The form value, submitted as a name/value pair when submitting the form.
+     */
+    value: string;
+    /**
+     * The form attribute specifies the form the form component belongs to.
+     * The value of this attribute must be equal to the id attribute of a <form> element in the same document.
+     */
+    formAttr: string | undefined;
+    protected internals: ElementInternals | null | undefined;
+    constructor();
+    /**
+     * Returns the form object associated with the element, or null if none exists.
+     * @private
+     */
+    get form(): HTMLFormElement | null;
+    /**
+     * Set the element's name and value within the current form.
+     * @private
+     */
+    setFormValue(value: FormValueType, state?: FormValueType): void;
+    /**
+     * A function that maps to the form control's `reportValidity()` function.
+     * Reference: https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/reportValidity
+     * @private
+     */
+    reportValidity(): boolean | undefined;
+    /**
+     * A function that maps to the form control's `checkValidity()` function.
+     * Reference: https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/checkValidity
+     * @private
+     */
+    checkValidity(): boolean | undefined;
+    /**
+     * TODO Enhance these functions to bring our components closer to native form components.
+     * @private
+     */
+    hostConnected(): void;
+    /**
+     * TODO Enhance these functions to bring our components closer to native form components.
+     * @private
+     */
+    hostDisconnected(): void;
+    /**
+     * TODO Enhance these functions to bring our components closer to native form components.
+     * @private
+     */
+    hostUpdated(): void;
+}
+export declare class DDSFormSubmitElement extends DDSElement {
+    static readonly formAssociated = true;
+    /**
+     * The form attribute specifies the form the form component belongs to.
+     * The value of this attribute must be equal to the id attribute of a <form> element in the same document.
+     */
+    formAttr: string | undefined;
+    protected internals: ElementInternals | null | undefined;
+    constructor();
+    /**
+     * Returns the form object associated with the element, or null if none exists.
+     * @private
+     */
+    get form(): HTMLFormElement | null;
+    /**
+     * A function that maps to the form control's `reportValidity()` function.
+     * Reference: https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/reportValidity
+     * @private
+     */
+    requestSubmit(): void;
+    /**
+     * A function that maps to the form control's `checkValidity()` function.
+     * Reference: https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/checkValidity
+     * @private
+     */
+    reset(): void;
+    /**
+     * TODO Enhance these functions to bring our components closer to native form components.
+     * @private
+     */
+    hostConnected(): void;
+    /**
+     * TODO Enhance these functions to bring our components closer to native form components.
+     * @private
+     */
+    hostDisconnected(): void;
+    /**
+     * TODO Enhance these functions to bring our components closer to native form components.
+     * @private
+     */
+    hostUpdated(): void;
+}
+export {};

package/dist/cjs-dev/components/accordion-item/daikin-accordion-item.cjs

@@ -27,13 +27,16 @@ const cvaSummary = classVarianceAuthority.cva(
     "w-full",
     "min-h-12",
     "p-3",
+    "break-all",
+    "text-left",
     "focus-visible:outline",
     "focus-visible:outline-2",
     "focus-visible:-outline-offset-2",
     "focus-visible:outline-ddt-color-common-border-focus",
     "after:size-6",
     "after:transition-all",
-    "after:i-daikin-chevron-down"
+    "after:i-daikin-chevron-down",
+    "after:flex-none"
   ],
   {
     variants: {
@@ -100,7 +103,7 @@ exports.DaikinAccordionItem = class DaikinAccordionItem extends ddsElement.DDSEl
   render() {
     const open = !this.disabled && this.open;
     return lit.html`<div
-      class="w-full text-ddt-color-common-text-primary font-daikinSerif overflow-clip"
+      class="w-full text-ddt-color-common-text-primary font-daikinSerif"
     >
       <button
         id="summary"
@@ -128,7 +131,7 @@ exports.DaikinAccordionItem = class DaikinAccordionItem extends ddsElement.DDSEl
       >
         <div class="overflow-hidden">
           <div class="pt-2 px-3 pb-3">
-            <slot></slot>
+            <slot class="slotted:break-all"></slot>
           </div>
         </div>
       </div>

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

@@ -0,0 +1,160 @@
+"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 ifDefined_js = require("lit/directives/if-defined.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 cvaWrapper = classVarianceAuthority.cva(
+  [
+    "inline-block",
+    "rounded-full",
+    "relative",
+    "overflow-hidden",
+    "box-border",
+    "size-full",
+    "focus-visible:outline",
+    "focus-visible:outline-2",
+    "focus-visible:outline-offset-2",
+    "focus-visible:outline-ddt-color-common-border-focus"
+  ],
+  {
+    variants: {
+      type: {
+        button: [
+          "enabled:bg-ddt-color-common-neutral-default",
+          "enabled:text-ddt-color-common-surface-default",
+          "enabled:hover:bg-ddt-color-common-neutral-hover",
+          "enabled:hover:text-ddt-color-common-surface-hover",
+          "enabled:active:bg-ddt-color-common-neutral-press",
+          "enabled:active:text-ddt-color-common-surface-press",
+          "disabled:bg-ddt-color-common-disabled",
+          "disabled:text-ddt-color-common-surface-default"
+        ],
+        icon: [
+          "bg-ddt-color-common-neutral-default",
+          "text-ddt-color-common-surface-default"
+        ],
+        link: [
+          "link-enabled:bg-ddt-color-common-neutral-default",
+          "link-enabled:text-ddt-color-common-surface-default",
+          "link-enabled:hover:bg-ddt-color-common-neutral-hover",
+          "link-enabled:hover:text-ddt-color-common-surface-hover",
+          "link-enabled:active:bg-ddt-color-common-neutral-press",
+          "link-enabled:active:text-ddt-color-common-surface-press",
+          "link-disabled:bg-ddt-color-common-disabled",
+          "link-disabled:text-ddt-color-common-surface-default"
+        ]
+      }
+    }
+  }
+);
+exports.DaikinAvatar = class DaikinAvatar extends lit.LitElement {
+  constructor() {
+    super();
+    this.type = "icon";
+    this.href = null;
+    this.alt = null;
+    this.disabled = false;
+    this.avatarAriaHaspopup = null;
+    this.avatarAriaExpanded = null;
+    this.addEventListener("click", (event) => {
+      if (this.disabled || this.type === "link" && this.href == null) {
+        event.stopImmediatePropagation();
+      }
+    });
+  }
+  render() {
+    const icon = lit.html`
+      <span
+        class="i-daikin-profile"
+      >
+      </span>
+    </daikin-icon>`;
+    if (this.type === "icon") {
+      return lit.html`<span
+        class=${cvaWrapper({ type: "icon" })}
+        role="figure"
+        aria-label=${ifDefined_js.ifDefined(this.alt ?? void 0)}
+      >
+        ${icon}
+      </span>`;
+    } else if (this.type === "button") {
+      return lit.html`<button
+        class=${cvaWrapper({ type: "button" })}
+        aria-label=${ifDefined_js.ifDefined(this.alt ?? void 0)}
+        aria-haspopup=${ifDefined_js.ifDefined(this.avatarAriaHaspopup ?? void 0)}
+        aria-expanded=${ifDefined_js.ifDefined(this.avatarAriaExpanded ?? void 0)}
+        ?disabled=${this.disabled}
+      >
+        ${icon}
+      </button>`;
+    } else {
+      const linkDisabled = this.disabled || this.href == null;
+      return lit.html`<a
+        class=${cvaWrapper({ type: "link" })}
+        role=${ifDefined_js.ifDefined(linkDisabled ? "link" : void 0)}
+        aria-label=${ifDefined_js.ifDefined(this.alt ?? void 0)}
+        href=${ifDefined_js.ifDefined(!linkDisabled ? this.href ?? void 0 : void 0)}
+        aria-disabled=${ifDefined_js.ifDefined(linkDisabled ? "true" : void 0)}
+      >
+        ${icon}
+      </a>`;
+    }
+  }
+  /**
+   * Focuses on the inner button or link.
+   * @param options focus options
+   */
+  focus(options) {
+    var _a;
+    (_a = this._focusableElement) == null ? void 0 : _a.focus(options);
+  }
+};
+exports.DaikinAvatar.styles = lit.css`
+    ${lit.unsafeCSS(tailwind.default)}
+
+    :host {
+      display: inline-flex;
+      position: relative;
+    }
+
+    :host {
+      width: 2.5rem;
+      height: 2.5rem;
+    }
+  `;
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true })
+], exports.DaikinAvatar.prototype, "type", 2);
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true })
+], exports.DaikinAvatar.prototype, "href", 2);
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true })
+], exports.DaikinAvatar.prototype, "alt", 2);
+__decorateClass([
+  decorators_js.property({ type: Boolean, reflect: true })
+], exports.DaikinAvatar.prototype, "disabled", 2);
+__decorateClass([
+  decorators_js.property({ type: String, reflect: true, attribute: "avatar-aria-haspopup" })
+], exports.DaikinAvatar.prototype, "avatarAriaHaspopup", 2);
+__decorateClass([
+  decorators_js.property({ type: Boolean, reflect: true, attribute: "avatar-aria-expanded" })
+], exports.DaikinAvatar.prototype, "avatarAriaExpanded", 2);
+__decorateClass([
+  decorators_js.query("a,button")
+], exports.DaikinAvatar.prototype, "_focusableElement", 2);
+exports.DaikinAvatar = __decorateClass([
+  decorators_js.customElement("daikin-avatar")
+], exports.DaikinAvatar);