agnosticui-core 2.0.0-alpha.2

package/dist/components/Toggle/core/_Toggle.js

@@ -0,0 +1,325 @@
+import { LitElement as b, css as u, html as s } from "lit";
+import { n as t } from "../../../property-CemaeiRl.js";
+import { o as p } from "../../../if-defined-C8i28hSj.js";
+import { createFormControlIds as f, isHorizontalLabel as c, buildAriaDescribedBy as m } from "../../../shared/form-control-utils.js";
+import { formControlStyles as y } from "../../../shared/form-control-styles.js";
+var v = Object.defineProperty, i = (d, r, a, l) => {
+  for (var o = void 0, n = d.length - 1, g; n >= 0; n--)
+    (g = d[n]) && (o = g(r, a, o) || o);
+  return o && v(r, a, o), o;
+};
+const h = class h extends b {
+  constructor() {
+    super(), this._toggleId = "", this._labelId = "", this._helperId = "", this._errorId = "", this.labelPosition = "top", this._handleClick = (a) => {
+      this.onClick && this.onClick(a), this._performToggle(a);
+    }, this._handleKeydown = (a) => {
+      (a.key === " " || a.key === "Enter") && (a.preventDefault(), this._performToggle(a));
+    }, this._performToggle = (a) => {
+      if (this.disabled || this.readonly) {
+        a.preventDefault();
+        return;
+      }
+      this.checked = !this.checked;
+      const l = new CustomEvent("toggle-change", {
+        detail: {
+          checked: this.checked,
+          name: this.name,
+          value: this.value
+        },
+        bubbles: !0,
+        composed: !0
+      });
+      this.dispatchEvent(l), this.onToggleChange && this.onToggleChange(l);
+    };
+    const r = f("toggle");
+    this._toggleId = r.inputId, this._labelId = r.labelId, this._helperId = r.helperId, this._errorId = r.errorId, this.label = "", this.labelHidden = !1, this.noLabel = !1, this.checked = !1, this.size = "md", this.variant = "default", this.disabled = !1, this.readonly = !1, this.required = !1, this.invalid = !1, this.errorMessage = "", this.helpText = "", this.name = "", this.value = "";
+  }
+  firstUpdated() {
+    !this.label && !this.noLabel && console.warn("AgToggle: label property is required for accessibility.");
+  }
+  renderLabel() {
+    if (!this.label || this.noLabel) return "";
+    const r = [];
+    return c(this.labelPosition) ? (r.push("ag-form-control__label--horizontal"), r.push(`ag-form-control__label--${this.labelPosition}`)) : this.labelPosition === "bottom" && r.push(`ag-form-control__label--${this.labelPosition}`), s`
+      <label
+        id=${this._labelId}
+        for=${this._toggleId}
+        class="ag-form-control__label ${this.labelHidden ? "ag-form-control__label--hidden" : ""} ${this.required ? "ag-form-control__label--required" : ""} ${r.join(" ")}"
+        part="ag-toggle-label"
+      >
+        ${this.label}
+      </label>
+    `;
+  }
+  render() {
+    const r = m({
+      helperId: this._helperId,
+      errorId: this._errorId,
+      hasHelper: !!this.helpText && !this.invalid,
+      hasError: !!this.invalid && !!this.errorMessage
+    }), a = this.helpText && !this.invalid ? s`<div class="ag-form-control__helper" id="${this._helperId}">
+          ${this.helpText}
+        </div>` : "", l = this.invalid && this.errorMessage ? s`<div class="ag-form-control__error" id="${this._errorId}">
+          ${this.errorMessage}
+        </div>` : "", o = s`
+      <button
+        id="${this._toggleId}"
+        role="switch"
+        aria-checked="${this.checked}"
+        aria-labelledby="${p(this.label && !this.noLabel ? this._labelId : void 0)}"
+        aria-describedby="${p(r)}"
+        ?disabled="${this.disabled}"
+        class="ag-toggle ag-toggle--${this.size} ag-toggle--${this.variant}"
+        part="ag-toggle-button"
+        @click="${this._handleClick}"
+        @keydown="${this._handleKeydown}"
+      >
+        <span class="ag-toggle__track" part="ag-toggle-track">
+          <span class="ag-toggle__handle" part="ag-toggle-handle"></span>
+        </span>
+
+        <!-- Screen reader state indication -->
+        <span class="visually-hidden">
+          ${this.checked ? "On" : "Off"}
+        </span>
+      </button>
+    `;
+    return c(this.labelPosition) ? s`
+        <div class="ag-form-control--horizontal">
+          ${this.renderLabel()}
+          ${o}
+        </div>
+        ${a}
+        ${l}
+      ` : this.labelPosition === "bottom" ? s`
+        ${o}
+        ${a}
+        ${l}
+        ${this.renderLabel()}
+      ` : s`
+      ${this.renderLabel()}
+      ${o}
+      ${a}
+      ${l}
+    `;
+  }
+};
+h.styles = [
+  y,
+  u`
+    /* MINIMALIST & THEMEABLE - Styling via --ag-* design tokens */
+    :host {
+      /* Block for label positioning support */
+      display: block;
+    }
+
+    button {
+      /* Reset browser button styles */
+      margin: 0;
+      border: none;
+      background: transparent;
+      cursor: pointer;
+      font-family: inherit;
+      color: inherit;
+      padding: 0;
+
+      /* Flexbox for track/handle layout */
+      display: flex;
+      align-items: center;
+      position: relative;
+
+      /* Touch target accessibility - minimum 44px */
+      min-inline-size: 44px;
+      min-block-size: 44px;
+
+      /* Focus management */
+      border-radius: var(--ag-focus-border-radius);
+      transition: all var(--ag-transition-duration) ease;
+    }
+
+    button:focus-visible {
+      outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
+      outline-offset: var(--ag-focus-offset);
+    }
+
+    button:disabled {
+      cursor: not-allowed;
+      opacity: 0.6;
+      pointer-events: none;
+    }
+
+    .ag-toggle__track {
+      /* Track container */
+      position: relative;
+      display: flex;
+      align-items: center;
+      border-radius: 9999px;
+      transition: inherit;
+
+      /* Default size - will be overridden by size variants */
+      width: var(--toggle-width, 40px);
+      height: var(--toggle-height, 20px);
+
+      /* Functional styling only */
+      background: var(--ag-neutral-300);
+      border: 1px solid transparent;
+    }
+
+    .ag-toggle__handle {
+      /* Handle positioning and animation */
+      position: absolute;
+      top: 50%;
+      inset-inline-start: 2px;
+      transform: translateY(-50%);
+      border-radius: 50%;
+      transition: transform var(--ag-transition-duration) ease;
+
+      /* Default handle size */
+      width: var(--handle-size, 18px);
+      height: var(--handle-size, 18px);
+
+      /* Functional styling only */
+      background: var(--ag-white);
+      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+    }
+
+    /* Checked state - handle moves to right */
+    :host([checked]) .ag-toggle__handle {
+      transform: translateY(-50%) translateX(calc(var(--toggle-width) - var(--handle-size) - 4px));
+    }
+
+    /* RTL Support - flip handle movement direction */
+    :host-context([dir="rtl"]):host([checked]) .ag-toggle__handle {
+      transform: translateY(-50%) translateX(calc(-1 * (var(--toggle-width) - var(--handle-size) - 4px)));
+    }
+
+    /* Size variants with 2:1 width:height ratio */
+    :host([size="xs"]) {
+      --toggle-width: 28px;
+      --toggle-height: 14px;
+      --handle-size: 12px;
+    }
+
+    :host([size="sm"]) {
+      --toggle-width: 34px;
+      --toggle-height: 17px;
+      --handle-size: 15px;
+    }
+
+    :host([size="md"]) {
+      --toggle-width: 40px;
+      --toggle-height: 20px;
+      --handle-size: 18px;
+    }
+
+    :host([size="lg"]) {
+      --toggle-width: 48px;
+      --toggle-height: 24px;
+      --handle-size: 22px;
+    }
+
+    :host([size="xl"]) {
+      --toggle-width: 56px;
+      --toggle-height: 28px;
+      --handle-size: 26px;
+    }
+
+    /* Checked state coloring */
+    :host([checked]) .ag-toggle__track {
+      background: var(--ag-primary);
+    }
+
+    :host([checked][variant="success"]) .ag-toggle__track {
+      background: var(--ag-success);
+    }
+
+    :host([checked][variant="warning"]) .ag-toggle__track {
+      background: var(--ag-warning);
+    }
+
+    :host([checked][variant="danger"]) .ag-toggle__track {
+      background: var(--ag-danger);
+    }
+
+    :host([checked][variant="monochrome"]) .ag-toggle__track {
+      background: var(--ag-background-primary-inverted);
+    }
+
+    :host([checked][variant="monochrome"]) .ag-toggle__handle {
+      background: var(--ag-text-primary-inverted);
+    }
+
+    /* Readonly state */
+    :host([readonly]) button {
+      cursor: default;
+    }
+
+    /* Screen reader only text */
+    .visually-hidden {
+      position: absolute !important;
+      width: 1px !important;
+      height: 1px !important;
+      padding: 0 !important;
+      margin: -1px !important;
+      overflow: hidden !important;
+      clip: rect(0, 0, 0, 0) !important;
+      white-space: nowrap !important;
+      border: 0 !important;
+    }
+  `
+];
+let e = h;
+i([
+  t({ type: String })
+], e.prototype, "label");
+i([
+  t({ type: String, attribute: "label-position" })
+], e.prototype, "labelPosition");
+i([
+  t({ type: Boolean, attribute: "label-hidden" })
+], e.prototype, "labelHidden");
+i([
+  t({ type: Boolean, attribute: "no-label" })
+], e.prototype, "noLabel");
+i([
+  t({ type: Boolean, reflect: !0 })
+], e.prototype, "checked");
+i([
+  t({ type: String, reflect: !0 })
+], e.prototype, "size");
+i([
+  t({ type: String, reflect: !0 })
+], e.prototype, "variant");
+i([
+  t({ type: Boolean, reflect: !0 })
+], e.prototype, "disabled");
+i([
+  t({ type: Boolean, reflect: !0 })
+], e.prototype, "readonly");
+i([
+  t({ type: Boolean, reflect: !0 })
+], e.prototype, "required");
+i([
+  t({ type: Boolean, reflect: !0 })
+], e.prototype, "invalid");
+i([
+  t({ type: String, attribute: "error-message" })
+], e.prototype, "errorMessage");
+i([
+  t({ type: String, attribute: "help-text" })
+], e.prototype, "helpText");
+i([
+  t({ type: String })
+], e.prototype, "name");
+i([
+  t({ type: String })
+], e.prototype, "value");
+i([
+  t({ attribute: !1 })
+], e.prototype, "onClick");
+i([
+  t({ attribute: !1 })
+], e.prototype, "onToggleChange");
+export {
+  e as AgToggle
+};

package/dist/components/Toggle/react/ReactToggle.d.ts

@@ -0,0 +1,19 @@
+import { EventName } from '@lit/react';
+import { AgToggle, ToggleProps, ToggleChangeEvent } from '../core/Toggle';
+import * as React from 'react';
+/**
+ * React-specific props interface derived from core ToggleProps
+ * Extends core props including event handlers
+ */
+export interface ReactToggleProps extends ToggleProps {
+    children?: React.ReactNode;
+    className?: string;
+    id?: string;
+    onClick?: (event: MouseEvent) => void;
+    onToggleChange?: (event: ToggleChangeEvent) => void;
+}
+export declare const ReactToggle: import('@lit/react').ReactWebComponent<AgToggle, {
+    onToggleChange: EventName<ToggleChangeEvent>;
+}>;
+export type { ToggleChangeEvent } from '../core/Toggle';
+//# sourceMappingURL=ReactToggle.d.ts.map

package/dist/components/Toggle/react/ReactToggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReactToggle.d.ts","sourceRoot":"","sources":["../../../../src/components/Toggle/react/ReactToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAmB,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,KAAK,WAAW,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEpF;;;GAGG;AACH,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IACtC,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;CACrD;AAGD,eAAO,MAAM,WAAW;oBAKe,SAAS,CAAC,iBAAiB,CAAC;EAEjE,CAAC;AAGH,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/Toggle/react/ReactToggle.js

@@ -0,0 +1,15 @@
+import * as e from "react";
+import { o } from "../../../create-component-BPMDMe-q.js";
+import "../core/Toggle.js";
+import { AgToggle as g } from "../core/_Toggle.js";
+const r = o({
+  tagName: "ag-toggle",
+  elementClass: g,
+  react: e,
+  events: {
+    onToggleChange: "toggle-change"
+  }
+});
+export {
+  r as ReactToggle
+};

package/dist/components/Toggle/react/index.d.ts

@@ -0,0 +1,4 @@
+export { ReactToggle } from './ReactToggle';
+export type { ReactToggleProps } from './ReactToggle';
+export type { ToggleChangeEvent, ToggleChangeEventDetail } from '../core/Toggle';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Toggle/react/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Toggle/react/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAGtD,YAAY,EAAE,iBAAiB,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/Toggle/react/index.js

@@ -0,0 +1,4 @@
+import { ReactToggle as g } from "./ReactToggle.js";
+export {
+  g as ReactToggle
+};

package/dist/components/Toggle/vue/VueToggle.js

@@ -0,0 +1,4 @@
+import { _ as f } from "../../../VueToggle.vue_vue_type_script_setup_true_lang-BxrvAsse.js";
+export {
+  f as default
+};

package/dist/components/Toggle/vue/VueToggle.vue.d.ts

@@ -0,0 +1,71 @@
+import { ToggleProps, ToggleChangeEventDetail } from '../core/Toggle';
+
+export interface VueToggleProps extends Omit<ToggleProps, "onClick" | "onToggleChange"> {
+}
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<VueToggleProps>, {
+    checked: boolean;
+    labelPosition: string;
+    labelHidden: boolean;
+    noLabel: boolean;
+    size: string;
+    variant: string;
+    disabled: boolean;
+    readonly: boolean;
+    required: boolean;
+    invalid: boolean;
+    errorMessage: string;
+    helpText: string;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (event: MouseEvent) => void;
+    "toggle-change": (detail: ToggleChangeEventDetail) => void;
+    "update:checked": (checked: boolean) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<VueToggleProps>, {
+    checked: boolean;
+    labelPosition: string;
+    labelHidden: boolean;
+    noLabel: boolean;
+    size: string;
+    variant: string;
+    disabled: boolean;
+    readonly: boolean;
+    required: boolean;
+    invalid: boolean;
+    errorMessage: string;
+    helpText: string;
+}>>> & Readonly<{
+    onClick?: ((event: MouseEvent) => any) | undefined;
+    "onToggle-change"?: ((detail: ToggleChangeEventDetail) => any) | undefined;
+    "onUpdate:checked"?: ((checked: boolean) => any) | undefined;
+}>, {
+    invalid: boolean;
+    disabled: boolean;
+    labelPosition: import('../../../shared/form-control-utils').LabelPosition;
+    labelHidden: boolean;
+    noLabel: boolean;
+    checked: boolean;
+    size: "xs" | "sm" | "md" | "lg" | "xl";
+    variant: "default" | "success" | "warning" | "danger" | "monochrome";
+    readonly: boolean;
+    required: boolean;
+    errorMessage: string;
+    helpText: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+//# sourceMappingURL=VueToggle.vue.d.ts.map

package/dist/components/Toggle/vue/VueToggle.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VueToggle.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Toggle/vue/VueToggle.vue"],"names":[],"mappings":"AAuBA;AAGA,OAAO,KAAK,EACV,WAAW,EAEX,uBAAuB,EACxB,MAAM,gBAAgB,CAAC;AACxB,OAAO,gBAAgB,CAAC;AAGxB,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,gBAAgB,CAAC;CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyH5D,wBAOG;AACH,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AACN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/dist/components/Toggle/vue/index.d.ts

@@ -0,0 +1,6 @@
+import { ToggleProps } from '../core/Toggle';
+export { default } from './VueToggle.vue';
+export { default as VueToggle } from './VueToggle.vue';
+export interface VueToggleProps extends ToggleProps {
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Toggle/vue/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Toggle/vue/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,MAAM,WAAW,cAAe,SAAQ,WAAW;CAAG"}

package/dist/components/Toggle/vue/index.js

@@ -0,0 +1,6 @@
+import { _ as r, _ as t } from "../../../VueToggle.vue_vue_type_script_setup_true_lang-BxrvAsse.js";
+import "../core/Toggle.js";
+export {
+  r as VueToggle,
+  t as default
+};

package/dist/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,36 @@
+import { Tooltip as CanonicalTooltip } from './core/_Tooltip.js';
+
+/**
+ * Experimental Tooltip component that extends the canonical implementation
+ *
+ * This version can be safely modified by AI assistants while maintaining
+ * the core functionality and accessibility features from the canonical base.
+ *
+ * @example
+ * ```html
+ * <ag-tooltip content="Helpful information">
+ *   <button>Hover me</button>
+ * </ag-tooltip>
+ * ```
+ */
+export declare class Tooltip extends CanonicalTooltip {
+    static styles: import('lit').CSSResult;
+    /**
+     * Extended functionality can be added here while preserving
+     * the canonical implementation's core behavior
+     */
+    animationDuration: number;
+    constructor();
+    /**
+     * Override render to add experimental features
+     * while delegating core functionality to canonical base
+     */
+    render(): import('lit').TemplateResult<1>;
+    /**
+     * Example: Enhanced show method with custom animation timing
+     * (can be safely modified by AI assistants)
+     */
+    connectedCallback(): void;
+}
+export default Tooltip;
+//# sourceMappingURL=Tooltip.d.ts.map

package/dist/components/Tooltip/Tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAIH,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEjE;;;;;;;;;;;;GAYG;AACH,qBAAa,OAAQ,SAAQ,gBAAgB;IAC3C,MAAM,CAAC,MAAM,0BAIX;IAEF;;;OAGG;IAIK,iBAAiB,EAAE,MAAM,CAAC;;IAOlC;;;OAGG;IACH,MAAM;IAKN;;;OAGG;IACM,iBAAiB;CAW3B;AAQD,eAAe,OAAO,CAAC"}

package/dist/components/Tooltip/Tooltip.js

@@ -0,0 +1,44 @@
+import { css as m } from "lit";
+import { n as p } from "../../property-CemaeiRl.js";
+import { Tooltip as l } from "./core/_Tooltip.js";
+var c = Object.defineProperty, u = (a, e, r, d) => {
+  for (var t = void 0, o = a.length - 1, s; o >= 0; o--)
+    (s = a[o]) && (t = s(e, r, t) || t);
+  return t && c(e, r, t), t;
+};
+const i = class i extends l {
+  constructor() {
+    super(), this.animationDuration = 150;
+  }
+  /**
+   * Override render to add experimental features
+   * while delegating core functionality to canonical base
+   */
+  render() {
+    return super.render();
+  }
+  /**
+   * Example: Enhanced show method with custom animation timing
+   * (can be safely modified by AI assistants)
+   */
+  connectedCallback() {
+    super.connectedCallback(), this.updateComplete.then(() => {
+      const e = this.shadowRoot?.getElementById("tooltip");
+      e && (e.style.transition = `opacity ${this.animationDuration}ms ease-in-out`);
+    });
+  }
+};
+i.styles = m`
+    ${l.styles}
+    /* Experimental styling can be added here */
+    /* Core functionality remains in canonical implementation */
+  `;
+let n = i;
+u([
+  p({ type: Number })
+], n.prototype, "animationDuration");
+customElements.get("ag-tooltip") || customElements.define("ag-tooltip", n);
+export {
+  n as Tooltip,
+  n as default
+};

package/dist/components/Tooltip/core/Tooltip.d.ts

@@ -0,0 +1,9 @@
+import { Tooltip } from './_Tooltip.js';
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'ag-tooltip': Tooltip;
+    }
+}
+export * from './_Tooltip.js';
+//# sourceMappingURL=Tooltip.d.ts.map

package/dist/components/Tooltip/core/Tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/Tooltip/core/Tooltip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAMxC,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,OAAO,CAAC;KACvB;CACF;AAED,cAAc,eAAe,CAAC"}

package/dist/components/Tooltip/core/Tooltip.js

@@ -0,0 +1,5 @@
+import { Tooltip as o } from "./_Tooltip.js";
+customElements.get("ag-tooltip") || customElements.define("ag-tooltip", o);
+export {
+  o as Tooltip
+};

package/dist/components/Tooltip/core/_Tooltip.d.ts

@@ -0,0 +1,86 @@
+import { LitElement } from 'lit';
+import { Placement } from '@floating-ui/dom';
+
+/**
+ * Event detail for show event
+ */
+export interface TooltipShowEventDetail {
+    visible: boolean;
+}
+/**
+ * Event detail for hide event
+ */
+export interface TooltipHideEventDetail {
+    visible: boolean;
+}
+/**
+ * Custom event dispatched when the tooltip is shown
+ */
+export type TooltipShowEvent = CustomEvent<TooltipShowEventDetail>;
+/**
+ * Custom event dispatched when the tooltip is hidden
+ */
+export type TooltipHideEvent = CustomEvent<TooltipHideEventDetail>;
+/**
+ * Props interface for Tooltip component including event handlers
+ *
+ * This interface defines the complete public API of the Tooltip component.
+ * The component class implements this interface to enforce type safety between
+ * the interface contract and the actual implementation.
+ *
+ * Event handlers (onShow, onHide) are included directly in the base Props interface,
+ * making it simpler for consumers - there's just one interface to import and use.
+ *
+ * @fires {TooltipShowEvent} show - Fired when the tooltip becomes visible
+ * @fires {TooltipHideEvent} hide - Fired when the tooltip becomes hidden
+ *
+ * @csspart ag-tooltip - The main tooltip container element that displays the content
+ * @csspart ag-tooltip-arrow - The arrow element that points to the trigger element
+ */
+export interface TooltipProps {
+    content?: string;
+    placement?: Placement;
+    distance?: number;
+    skidding?: number;
+    trigger?: string;
+    disabled?: boolean;
+    onShow?: (event: TooltipShowEvent) => void;
+    onHide?: (event: TooltipHideEvent) => void;
+}
+export declare class Tooltip extends LitElement implements TooltipProps {
+    static styles: import('lit').CSSResult;
+    content: string;
+    placement: Placement;
+    distance: number;
+    skidding: number;
+    trigger: string;
+    disabled: boolean;
+    onShow?: (event: TooltipShowEvent) => void;
+    onHide?: (event: TooltipHideEvent) => void;
+    private _open;
+    tooltipElement: HTMLElement | undefined;
+    arrowElement: HTMLElement | undefined;
+    private _cleanup;
+    private _hideTimeout;
+    constructor();
+    firstUpdated(): void;
+    private _setupEventListeners;
+    disconnectedCallback(): void;
+    private _setupARIA;
+    private _removeEventListeners;
+    private _handleMouseEnter;
+    private _handleMouseLeave;
+    private _handleFocus;
+    private _handleBlur;
+    private _handleClick;
+    private _handleDocumentKeyDown;
+    updated(changedProperties: Map<string, unknown>): void;
+    private _startPositioning;
+    private _stopPositioning;
+    private _updatePosition;
+    show: () => void;
+    hide: () => void;
+    toggle: () => void;
+    render(): import('lit').TemplateResult<1>;
+}
+//# sourceMappingURL=_Tooltip.d.ts.map

package/dist/components/Tooltip/core/_Tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"_Tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/Tooltip/core/_Tooltip.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,EAA2D,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE3G;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,OAAO,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,OAAO,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,WAAW,CAAC,sBAAsB,CAAC,CAAC;AAEnE;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,WAAW,CAAC,sBAAsB,CAAC,CAAC;AAEnE;;;;;;;;;;;;;;;GAeG;AACH,MAAM,WAAW,YAAY;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC3C,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAC5C;AAED,qBAAa,OAAQ,SAAQ,UAAW,YAAW,YAAY;IAC7D,MAAM,CAAC,MAAM,0BAiCX;IAGM,OAAO,EAAE,MAAM,CAAC;IAGhB,SAAS,EAAE,SAAS,CAAC;IAGrB,QAAQ,EAAE,MAAM,CAAC;IAGjB,QAAQ,EAAE,MAAM,CAAC;IAGjB,OAAO,EAAE,MAAM,CAAC;IAGhB,QAAQ,EAAE,OAAO,CAAC;IAGlB,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAG3C,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAEnD,QACgB,KAAK,CAAU;IAG/B,cAAc,EAAE,WAAW,GAAG,SAAS,CAAC;IAGxC,YAAY,EAAE,WAAW,GAAG,SAAS,CAAC;IAEtC,OAAO,CAAC,QAAQ,CAA2B;IAC3C,OAAO,CAAC,YAAY,CAAqB;;IAazC,YAAY;IAKZ,OAAO,CAAC,oBAAoB;IAiB5B,oBAAoB;IAOpB,OAAO,CAAC,UAAU;IAKlB,OAAO,CAAC,qBAAqB;IAW7B,OAAO,CAAC,iBAAiB,CAKvB;IAEF,OAAO,CAAC,iBAAiB,CAMvB;IAEF,OAAO,CAAC,YAAY,CAIlB;IAEF,OAAO,CAAC,WAAW,CAIjB;IAEF,OAAO,CAAC,YAAY,CAQlB;IAEF,OAAO,CAAC,sBAAsB,CAI5B;IAEF,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IA0C/C,OAAO,CAAC,iBAAiB;IAgBzB,OAAO,CAAC,gBAAgB;YAKV,eAAe;IAkD7B,IAAI,aAGH;IAED,IAAI,aAGH;IAED,MAAM,aAEL;IAED,MAAM;CAiBP"}