agnosticui-core 2.0.0-alpha.2 → 2.0.0-alpha.21

package/dist/shared/face-mixin.js

@@ -0,0 +1,86 @@
+import "lit";
+import { n } from "../property-CemaeiRl.js";
+var l = Object.defineProperty, d = (e, t, r, o) => {
+  for (var i = void 0, s = e.length - 1, a; s >= 0; s--)
+    (a = e[s]) && (i = a(t, r, i) || i);
+  return i && l(t, r, i), i;
+};
+function c(e, t) {
+  t && (t.validity.valid ? e.setValidity({}) : e.setValidity(t.validity, t.validationMessage, t));
+}
+const y = (e) => {
+  const r = class r extends e {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    constructor(...i) {
+      super(...i), this.name = "", this._internals = this.attachInternals();
+    }
+    /** The parent <form> element, or null if not inside a form. */
+    get form() {
+      return this._internals.form;
+    }
+    /** The current ValidityState, updated via this._internals.setValidity(). */
+    get validity() {
+      return this._internals.validity;
+    }
+    /** The browser-generated or custom validation message. */
+    get validationMessage() {
+      return this._internals.validationMessage;
+    }
+    /** Whether this element will participate in constraint validation. */
+    get willValidate() {
+      return this._internals.willValidate;
+    }
+    /** Checks validity silently; fires a cancellable 'invalid' event if invalid. */
+    checkValidity() {
+      return this._internals.checkValidity();
+    }
+    /** Checks validity and shows the browser validation tooltip if invalid. */
+    reportValidity() {
+      return this._internals.reportValidity();
+    }
+    /**
+     * FACE lifecycle: called when a <fieldset disabled> ancestor is toggled.
+     * Syncs the component's own `disabled` property so it renders correctly.
+     *
+     * Note: this only fires for inherited disabled state (via fieldset), not
+     * for the element's own `disabled` attribute — both paths must be handled.
+     */
+    formDisabledCallback(i) {
+      this.disabled = i;
+    }
+    /**
+     * FACE lifecycle: called when the parent form is reset.
+     * Default is a no-op. Subclasses MUST override to restore their default state
+     * and call this._internals.setFormValue('') / setValidity({}).
+     */
+    formResetCallback() {
+    }
+    /**
+     * Toggle a custom state in ElementInternals.states (CustomStateSet).
+     *
+     * Exposes internal states as CSS :state() pseudo-classes targetable from
+     * outside the shadow root — e.g. ag-toggle:state(checked), ag-radio:state(invalid).
+     *
+     * Always call this AFTER _syncValidity() so that :state(invalid) reads
+     * the freshly-updated _internals.validity.valid value.
+     *
+     * Feature-guarded: _internals.states requires Chrome 90+, Firefox 126+,
+     * Safari 17.4+. The guard is here so call sites don't repeat it.
+     *
+     * @param state  State name, e.g. 'checked', 'disabled', 'invalid'
+     * @param active True to add the state, false to remove it
+     */
+    _setState(i, s) {
+      this._internals.states && (s ? this._internals.states.add(i) : this._internals.states.delete(i));
+    }
+  };
+  r.formAssociated = !0;
+  let t = r;
+  return d([
+    n({ type: String, reflect: !0 })
+  ], t.prototype, "name"), t;
+};
+export {
+  y as FaceMixin,
+  c as syncInnerInputValidity
+};

package/dist/shared/form-control-styles.js

@@ -3,7 +3,7 @@ const a = o`
   /* Label - Default (top position) */
   .ag-form-control__label {
     display: block;
-    font-size: var(--ag-font-size-base);
+    font-size: var(--ag-font-size-sm);
     font-weight: 600;
     color: var(--ag-text-primary);
     line-height: var(--ag-line-height-base);

package/dist/styles/ag-tokens-dark.css

@@ -96,6 +96,10 @@
   --ag-warning-text: #f2cc60;
   --ag-danger-background: #490202;
   --ag-danger-text: #ffc1ba;
+  --ag-primary-fg: #ffffff;
+  --ag-success-fg: #ffffff;
+  --ag-warning-fg: #0D1117;
+  --ag-danger-fg: #ffffff;
   --ag-border: #3D444D;
   --ag-border-subtle: #656C76;
   --ag-primary: #1158c7;

package/dist/styles/ag-tokens.css

@@ -151,23 +151,27 @@
   --ag-background-primary-inverted: #1f2328;
   --ag-background-secondary: #f3f4f6;
   --ag-background-secondary-inverted: #111827;
-  --ag-background-tertiary: #e5e7eb;
-  --ag-background-disabled: #f3f4f6;
-  --ag-primary-background: #ddf4ff;
-  --ag-primary-text: #0550ae;
-  --ag-success-background: #dafbe1;
-  --ag-success-text: #116329;
-  --ag-info-background: #f3f4f6;
-  --ag-info-text: #4b5563;
-  --ag-warning-background: #fff8c5;
-  --ag-warning-text: #7d4e00;
-  --ag-danger-background: #ffebe9;
-  --ag-danger-text: #a40e26;
+  --ag-background-tertiary: #e5e7eb; /** Used by: Button default bg; also secondary button hover bg */
+  --ag-background-disabled: #f3f4f6; /** Used by: Button, Input, Checkbox, Radio, Select disabled states */
+  --ag-primary-background: #ddf4ff; /** Used by: Alert primary variant bg, Button faint variant bg */
+  --ag-primary-text: #0550ae; /** Used by: Alert primary text, Button bordered/outlined text + border */
+  --ag-success-background: #dafbe1; /** Used by: Alert success variant bg, Badge success variant bg */
+  --ag-success-text: #116329; /** Used by: Alert success variant text, Badge success variant text */
+  --ag-info-background: #f3f4f6; /** Used by: Alert info variant bg, Badge info variant bg */
+  --ag-info-text: #4b5563; /** Used by: Alert info variant text, Badge info variant text */
+  --ag-warning-background: #fff8c5; /** Used by: Alert warning variant bg, Badge warning variant bg */
+  --ag-warning-text: #7d4e00; /** Used by: Alert warning variant text, Badge warning variant text */
+  --ag-danger-background: #ffebe9; /** Used by: Alert danger variant bg, Badge danger variant bg */
+  --ag-danger-text: #a40e26; /** Used by: Alert danger variant text, Badge danger variant text */
+  --ag-primary-fg: #ffffff;
+  --ag-success-fg: #ffffff;
+  --ag-warning-fg: #111827;
+  --ag-danger-fg: #ffffff;
   --ag-border: #e5e7eb;
   --ag-border-subtle: #d1d5db;
   --ag-primary: #0550ae;
   --ag-primary-rgb: 5, 80, 174;
-  --ag-primary-border: #d1d5db;
+  --ag-primary-border: #d1d5db; /** Used by: Button bordered variant border */
   --ag-primary-dark: #0a3069;
   --ag-secondary: #6b7280;
   --ag-secondary-dark: #4b5563;
@@ -190,4 +194,5 @@
   --ag-rating-filled-success: #238636;
   --ag-rating-filled-warning: #9a6700;
   --ag-rating-filled-danger: #cf222e;
+  --ag-rating-filled-secondary: #6b7280;
 }