@fluentui/web-components 3.0.0-rc.3 → 3.0.0-rc.31

package/dist/esm/compound-button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/compound-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,wBAAwB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AACjH,OAAO,EAAE,QAAQ,IAAI,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AACnF,OAAO,EAAE,MAAM,IAAI,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAC7E,OAAO,EAAE,UAAU,IAAI,wBAAwB,EAAE,MAAM,iCAAiC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/compound-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,wBAAwB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AACjH,OAAO,EAAE,QAAQ,IAAI,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AACnF,OAAO,EAAE,MAAM,IAAI,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAC7E,OAAO,EAAE,UAAU,IAAI,wBAAwB,EAAE,MAAM,iCAAiC,CAAC;AACzF,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,8BAA8B,CAAC"}

package/dist/esm/counter-badge/counter-badge.base.d.ts

@@ -0,0 +1,55 @@
+import { FASTElement } from '@microsoft/fast-element';
+/**
+ * The base class used for constructing a fluent-counter-badge custom element.
+ * Contains the count-related state and display logic, without any visual
+ * appearance attributes.
+ *
+ * @public
+ */
+export declare class BaseCounterBadge extends FASTElement {
+    /**
+     * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
+     *
+     * @internal
+     */
+    elementInternals: ElementInternals;
+    /**
+     * The count to be displayed in the badge.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `count`
+     */
+    count: number;
+    /**
+     * The maximum count to be displayed before showing the overflow count (e.g. "99+").
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `overflow-count`
+     */
+    overflowCount: number;
+    /**
+     * Whether to show the badge when the count is zero. By default, the badge will be hidden when the count is zero.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `show-zero`
+     */
+    showZero: boolean;
+    /**
+     * Whether to display the badge as a dot. When true, the badge will be displayed as a dot and the count will not be
+     * shown.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `dot`
+     */
+    dot: boolean;
+    /**
+     * The value to be displayed in the badge, which is determined by the `count`, `overflow-count`, and `show-zero` attributes.
+     *
+     * @public
+     */
+    get displayValue(): string | undefined;
+}

package/dist/esm/counter-badge/counter-badge.base.js

@@ -0,0 +1,84 @@
+import { __decorate } from "tslib";
+import { attr, FASTElement, nullableNumberConverter, volatile } from '@microsoft/fast-element';
+/**
+ * The base class used for constructing a fluent-counter-badge custom element.
+ * Contains the count-related state and display logic, without any visual
+ * appearance attributes.
+ *
+ * @public
+ */
+export class BaseCounterBadge extends FASTElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
+         *
+         * @internal
+         */
+        this.elementInternals = this.attachInternals();
+        /**
+         * The count to be displayed in the badge.
+         *
+         * @public
+         * @remarks
+         * HTML Attribute: `count`
+         */
+        this.count = 0;
+        /**
+         * The maximum count to be displayed before showing the overflow count (e.g. "99+").
+         *
+         * @public
+         * @remarks
+         * HTML Attribute: `overflow-count`
+         */
+        this.overflowCount = 99;
+        /**
+         * Whether to show the badge when the count is zero. By default, the badge will be hidden when the count is zero.
+         *
+         * @public
+         * @remarks
+         * HTML Attribute: `show-zero`
+         */
+        this.showZero = false;
+        /**
+         * Whether to display the badge as a dot. When true, the badge will be displayed as a dot and the count will not be
+         * shown.
+         *
+         * @public
+         * @remarks
+         * HTML Attribute: `dot`
+         */
+        this.dot = false;
+    }
+    /**
+     * The value to be displayed in the badge, which is determined by the `count`, `overflow-count`, and `show-zero` attributes.
+     *
+     * @public
+     */
+    get displayValue() {
+        const count = this.count ?? 0;
+        if ((!this.showZero && count === 0) || this.dot) {
+            return '';
+        }
+        if (this.overflowCount > 0 && count > this.overflowCount) {
+            return `${this.overflowCount}+`;
+        }
+        return `${count}`;
+    }
+}
+__decorate([
+    attr({ converter: nullableNumberConverter })
+], BaseCounterBadge.prototype, "count", void 0);
+__decorate([
+    attr({ attribute: 'overflow-count', converter: nullableNumberConverter })
+], BaseCounterBadge.prototype, "overflowCount", void 0);
+__decorate([
+    attr({ attribute: 'show-zero', mode: 'boolean' })
+], BaseCounterBadge.prototype, "showZero", void 0);
+__decorate([
+    attr({ mode: 'boolean' })
+], BaseCounterBadge.prototype, "dot", void 0);
+__decorate([
+    volatile
+], BaseCounterBadge.prototype, "displayValue", null);
+//# sourceMappingURL=counter-badge.base.js.map

package/dist/esm/counter-badge/counter-badge.base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"counter-badge.base.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.base.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,uBAAuB,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAE/F;;;;;;GAMG;AACH,MAAM,OAAO,gBAAiB,SAAQ,WAAW;IAAjD;;QACE;;;;WAIG;QACI,qBAAgB,GAAqB,IAAI,CAAC,eAAe,EAAE,CAAC;QAEnE;;;;;;WAMG;QAEI,UAAK,GAAW,CAAC,CAAC;QAEzB;;;;;;WAMG;QAEI,kBAAa,GAAW,EAAE,CAAC;QAElC;;;;;;WAMG;QAEI,aAAQ,GAAY,KAAK,CAAC;QAEjC;;;;;;;WAOG;QAEI,QAAG,GAAY,KAAK,CAAC;IAqB9B,CAAC;IAnBC;;;;OAIG;IAEH,IAAW,YAAY;QACrB,MAAM,KAAK,GAAW,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC;QAEtC,IAAI,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,KAAK,KAAK,CAAC,CAAC,IAAI,IAAI,CAAC,GAAG,EAAE,CAAC;YAChD,OAAO,EAAE,CAAC;QACZ,CAAC;QAED,IAAI,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,KAAK,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;YACzD,OAAO,GAAG,IAAI,CAAC,aAAa,GAAG,CAAC;QAClC,CAAC;QAED,OAAO,GAAG,KAAK,EAAE,CAAC;IACpB,CAAC;CACF;AApDQ;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,uBAAuB,EAAE,CAAC;+CACpB;AAUlB;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,SAAS,EAAE,uBAAuB,EAAE,CAAC;uDACxC;AAU3B;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;kDACjB;AAW1B;IADN,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;6CACE;AAQ5B;IADC,QAAQ;oDAaR"}

package/dist/esm/counter-badge/counter-badge.bench.d.ts

@@ -1,3 +1,4 @@
+import './define.js';
 declare const itemRenderer: () => HTMLElement;
 export default itemRenderer;
 export { tests } from '../utils/benchmark-wrapper.js';

package/dist/esm/counter-badge/counter-badge.bench.js

@@ -1,6 +1,4 @@
-import { FluentDesignSystem } from '../fluent-design-system.js';
-import { definition } from './counter-badge.definition.js';
-definition.define(FluentDesignSystem.registry);
+import './define.js';
 const itemRenderer = () => {
     const counterBadge = document.createElement('fluent-counter-badge');
     counterBadge.setAttribute('count', '5');

package/dist/esm/counter-badge/counter-badge.bench.js.map

@@ -1 +1 @@
-{"version":3,"file":"counter-badge.bench.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.bench.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAE3D,UAAU,CAAC,MAAM,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;AAE/C,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;IACpE,YAAY,CAAC,YAAY,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;IACxC,OAAO,YAAY,CAAC;AACtB,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC;AAC5B,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC"}
+{"version":3,"file":"counter-badge.bench.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.bench.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AAErB,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;IACpE,YAAY,CAAC,YAAY,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;IACxC,OAAO,YAAY,CAAC;AACtB,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC;AAC5B,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/esm/counter-badge/counter-badge.d.ts

@@ -1,20 +1,18 @@
-import { FASTElement } from '@microsoft/fast-element';
-import { StartEnd } from '../patterns/index.js';
+import { StartEnd } from '../patterns/start-end.js';
+import { BaseCounterBadge } from './counter-badge.base.js';
 import { CounterBadgeAppearance, CounterBadgeColor, CounterBadgeShape, CounterBadgeSize } from './counter-badge.options.js';
 /**
- * The base class used for constructing a fluent-badge custom element
+ * A CounterBadge Custom HTML Element.
+ * Based on BaseCounterBadge and includes style and layout specific attributes.
  *
  * @tag fluent-counter-badge
  *
+ * @slot start - Content which can be provided before the badge content.
+ * @slot end - Content which can be provided after the badge content.
+ *
  * @public
  */
-export declare class CounterBadge extends FASTElement {
-    /**
-     * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
-     *
-     * @internal
-     */
-    elementInternals: ElementInternals;
+export declare class CounterBadge extends BaseCounterBadge {
     /**
      * The appearance the badge should have.
      *
@@ -47,53 +45,6 @@ export declare class CounterBadge extends FASTElement {
      * HTML Attribute: size
      */
     size?: CounterBadgeSize;
-    /**
-     * The count the badge should have.
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: count
-     */
-    count: number;
-    protected countChanged(): void;
-    /**
-     * Max number to be displayed
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: overflow-count
-     */
-    overflowCount: number;
-    protected overflowCountChanged(): void;
-    /**
-     * If the badge should be shown when count is 0
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: show-zero
-     */
-    showZero: boolean;
-    /**
-     * If a dot should be displayed without the count
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: dot
-     */
-    dot: boolean;
-    /**
-     * @internal
-     * Function to set the count
-     * This is the default slotted content for the counter badge
-     * If children are slotted, that will override the value returned
-     */
-    setCount(): string | void;
 }
-/**
- * Mark internal because exporting class and interface of the same name
- * confuses API extractor.
- * TODO: Below will be unnecessary when Badge class gets updated
- * @internal
- */
 export interface CounterBadge extends StartEnd {
 }

package/dist/esm/counter-badge/counter-badge.definition-async.d.ts

@@ -0,0 +1,10 @@
+import { type PartialFASTElementDefinition } from '@microsoft/fast-element/declarative.js';
+/**
+ * The async definition configuration for the `<fluent-counter-badge>` element.
+ *
+ * @public
+ * @remarks
+ * This is used in server-side rendering (SSR) scenarios where the template
+ * is provided as a deferred option to be hydrated later.
+ */
+export declare const declarativeDefinition: PartialFASTElementDefinition;

package/dist/esm/counter-badge/counter-badge.definition-async.js

@@ -0,0 +1,17 @@
+import { declarativeTemplate } from '@microsoft/fast-element/declarative.js';
+import { FluentDesignSystem } from '../fluent-design-system.js';
+import { tagName } from './counter-badge.options.js';
+/**
+ * The async definition configuration for the `<fluent-counter-badge>` element.
+ *
+ * @public
+ * @remarks
+ * This is used in server-side rendering (SSR) scenarios where the template
+ * is provided as a deferred option to be hydrated later.
+ */
+export const declarativeDefinition = {
+    name: tagName,
+    registry: FluentDesignSystem.registry,
+    template: declarativeTemplate(),
+};
+//# sourceMappingURL=counter-badge.definition-async.js.map

package/dist/esm/counter-badge/counter-badge.definition-async.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"counter-badge.definition-async.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.definition-async.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAqC,MAAM,wCAAwC,CAAC;AAChH,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAiC;IACjE,IAAI,EAAE,OAAO;IACb,QAAQ,EAAE,kBAAkB,CAAC,QAAQ;IACrC,QAAQ,EAAE,mBAAmB,EAAE;CAChC,CAAC"}

package/dist/esm/counter-badge/counter-badge.definition.d.ts

@@ -1,7 +1,7 @@
-import { CounterBadge } from './counter-badge.js';
+import type { PartialFASTElementDefinition } from '@microsoft/fast-element';
 /**
+ * The definition for the `<fluent-counter-badge>` element.
+ *
  * @public
- * @remarks
- * HTML Element: \<fluent-counter-badge\>
  */
-export declare const definition: import("@microsoft/fast-element").FASTElementDefinition<typeof CounterBadge>;
+export declare const definition: PartialFASTElementDefinition;

package/dist/esm/counter-badge/counter-badge.definition.js

@@ -1,15 +1,16 @@
 import { FluentDesignSystem } from '../fluent-design-system.js';
-import { CounterBadge } from './counter-badge.js';
+import { tagName } from './counter-badge.options.js';
 import { styles } from './counter-badge.styles.js';
 import { template } from './counter-badge.template.js';
 /**
+ * The definition for the `<fluent-counter-badge>` element.
+ *
  * @public
- * @remarks
- * HTML Element: \<fluent-counter-badge\>
  */
-export const definition = CounterBadge.compose({
-    name: `${FluentDesignSystem.prefix}-counter-badge`,
-    template,
+export const definition = {
+    name: tagName,
+    registry: FluentDesignSystem.registry,
     styles,
-});
+    template,
+};
 //# sourceMappingURL=counter-badge.definition.js.map

package/dist/esm/counter-badge/counter-badge.definition.js.map

@@ -1 +1 @@
-{"version":3,"file":"counter-badge.definition.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD;;;;GAIG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,YAAY,CAAC,OAAO,CAAC;IAC7C,IAAI,EAAE,GAAG,kBAAkB,CAAC,MAAM,gBAAgB;IAClD,QAAQ;IACR,MAAM;CACP,CAAC,CAAC"}
+{"version":3,"file":"counter-badge.definition.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.definition.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD;;;;GAIG;AACH,MAAM,CAAC,MAAM,UAAU,GAAiC;IACtD,IAAI,EAAE,OAAO;IACb,QAAQ,EAAE,kBAAkB,CAAC,QAAQ;IACrC,MAAM;IACN,QAAQ;CACT,CAAC"}

package/dist/esm/counter-badge/counter-badge.js

@@ -1,75 +1,20 @@
 import { __decorate } from "tslib";
-import { attr, FASTElement, nullableNumberConverter } from '@microsoft/fast-element';
+import { attr } from '@microsoft/fast-element';
+import { StartEnd } from '../patterns/start-end.js';
 import { applyMixins } from '../utils/apply-mixins.js';
-import { StartEnd } from '../patterns/index.js';
+import { BaseCounterBadge } from './counter-badge.base.js';
 /**
- * The base class used for constructing a fluent-badge custom element
+ * A CounterBadge Custom HTML Element.
+ * Based on BaseCounterBadge and includes style and layout specific attributes.
  *
  * @tag fluent-counter-badge
  *
+ * @slot start - Content which can be provided before the badge content.
+ * @slot end - Content which can be provided after the badge content.
+ *
  * @public
  */
-export class CounterBadge extends FASTElement {
-    constructor() {
-        super(...arguments);
-        /**
-         * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
-         *
-         * @internal
-         */
-        this.elementInternals = this.attachInternals();
-        /**
-         * The count the badge should have.
-         *
-         * @public
-         * @remarks
-         * HTML Attribute: count
-         */
-        this.count = 0;
-        /**
-         * Max number to be displayed
-         *
-         * @public
-         * @remarks
-         * HTML Attribute: overflow-count
-         */
-        this.overflowCount = 99;
-        /**
-         * If the badge should be shown when count is 0
-         *
-         * @public
-         * @remarks
-         * HTML Attribute: show-zero
-         */
-        this.showZero = false;
-        /**
-         * If a dot should be displayed without the count
-         *
-         * @public
-         * @remarks
-         * HTML Attribute: dot
-         */
-        this.dot = false;
-    }
-    countChanged() {
-        this.setCount();
-    }
-    overflowCountChanged() {
-        this.setCount();
-    }
-    /**
-     * @internal
-     * Function to set the count
-     * This is the default slotted content for the counter badge
-     * If children are slotted, that will override the value returned
-     */
-    setCount() {
-        const count = this.count ?? 0;
-        if ((count !== 0 || this.showZero) && !this.dot) {
-            return count > this.overflowCount ? `${this.overflowCount}+` : `${count}`;
-        }
-        return;
-    }
+export class CounterBadge extends BaseCounterBadge {
 }
 __decorate([
     attr
@@ -83,17 +28,5 @@ __decorate([
 __decorate([
     attr
 ], CounterBadge.prototype, "size", void 0);
-__decorate([
-    attr({ converter: nullableNumberConverter })
-], CounterBadge.prototype, "count", void 0);
-__decorate([
-    attr({ attribute: 'overflow-count', converter: nullableNumberConverter })
-], CounterBadge.prototype, "overflowCount", void 0);
-__decorate([
-    attr({ attribute: 'show-zero', mode: 'boolean' })
-], CounterBadge.prototype, "showZero", void 0);
-__decorate([
-    attr({ mode: 'boolean' })
-], CounterBadge.prototype, "dot", void 0);
 applyMixins(CounterBadge, StartEnd);
 //# sourceMappingURL=counter-badge.js.map

package/dist/esm/counter-badge/counter-badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"counter-badge.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAC;AACrF,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAQhD;;;;;;GAMG;AACH,MAAM,OAAO,YAAa,SAAQ,WAAW;IAA7C;;QACE;;;;WAIG;QACI,qBAAgB,GAAqB,IAAI,CAAC,eAAe,EAAE,CAAC;QA0CnE;;;;;;WAMG;QAEI,UAAK,GAAW,CAAC,CAAC;QAKzB;;;;;;WAMG;QAEI,kBAAa,GAAW,EAAE,CAAC;QAKlC;;;;;;WAMG;QAEI,aAAQ,GAAY,KAAK,CAAC;QAEjC;;;;;;WAMG;QAEI,QAAG,GAAY,KAAK,CAAC;IAiB9B,CAAC;IApDW,YAAY;QACpB,IAAI,CAAC,QAAQ,EAAE,CAAC;IAClB,CAAC;IAWS,oBAAoB;QAC5B,IAAI,CAAC,QAAQ,EAAE,CAAC;IAClB,CAAC;IAsBD;;;;;OAKG;IACI,QAAQ;QACb,MAAM,KAAK,GAAkB,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC;QAE7C,IAAI,CAAC,KAAK,KAAK,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC;YAChD,OAAO,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC,GAAG,KAAK,EAAE,CAAC;QAC5E,CAAC;QAED,OAAO;IACT,CAAC;CACF;AA7FQ;IADN,IAAI;gDACsC;AAUpC;IADN,IAAI;2CAC4B;AAU1B;IADN,IAAI;2CAC4B;AAU1B;IADN,IAAI;0CAC0B;AAUxB;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,uBAAuB,EAAE,CAAC;2CACpB;AAalB;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,SAAS,EAAE,uBAAuB,EAAE,CAAC;mDACxC;AAa3B;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;8CACjB;AAU1B;IADN,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;yCACE;AA2B9B,WAAW,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC"}
+{"version":3,"file":"counter-badge.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAQ3D;;;;;;;;;;GAUG;AACH,MAAM,OAAO,YAAa,SAAQ,gBAAgB;CAwCjD;AA/BQ;IADN,IAAI;gDACsC;AAUpC;IADN,IAAI;2CAC4B;AAU1B;IADN,IAAI;2CAC4B;AAU1B;IADN,IAAI;0CAC0B;AAKjC,WAAW,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC"}

package/dist/esm/counter-badge/counter-badge.options.d.ts

@@ -1,12 +1,15 @@
-import type { BadgeOptions } from '../badge/badge.options.js';
-import type { ValuesOf } from '../utils/index.js';
+import type { StartEndOptions } from '../patterns/start-end.js';
+import type { ValuesOf } from '../utils/typings.js';
+import type { CounterBadge } from './counter-badge.js';
 /**
- * CounterBadge options
+ * Template options for CounterBadge component.
+ *
  * @public
  */
-export type CounterBadgeOptions = BadgeOptions;
+export type CounterBadgeOptions = StartEndOptions<CounterBadge>;
 /**
- * CounterBadgeAppearance constants
+ * Values for the `appearance` attribute on CounterBadge elements.
+ *
  * @public
  */
 export declare const CounterBadgeAppearance: {
@@ -14,12 +17,13 @@ export declare const CounterBadgeAppearance: {
     readonly ghost: "ghost";
 };
 /**
- * A CounterBadge can have an appearance of filled or ghost
+ * Type for the `appearance` attribute on CounterBadge elements, based on the CounterBadgeAppearance constants.
  * @public
  */
 export type CounterBadgeAppearance = ValuesOf<typeof CounterBadgeAppearance>;
 /**
- * CounterBadgeColor constants
+ * Values for the `color` attribute on CounterBadge elements.
+ *
  * @public
  */
 export declare const CounterBadgeColor: {
@@ -33,12 +37,13 @@ export declare const CounterBadgeColor: {
     readonly warning: "warning";
 };
 /**
- * A CounterBadge can be one of preset colors
+ * Type for the `color` attribute on CounterBadge elements, based on the CounterBadgeColor constants.
  * @public
  */
 export type CounterBadgeColor = ValuesOf<typeof CounterBadgeColor>;
 /**
- * A CounterBadge shape can be circular or rounded.
+ * Values for the `shape` attribute on CounterBadge elements.
+ *
  * @public
  */
 export declare const CounterBadgeShape: {
@@ -46,12 +51,14 @@ export declare const CounterBadgeShape: {
     readonly rounded: "rounded";
 };
 /**
- * A CounterBadge can be one of preset colors
+ * Type for the `shape` attribute on CounterBadge elements, based on the CounterBadgeShape constants.
+ *
  * @public
  */
 export type CounterBadgeShape = ValuesOf<typeof CounterBadgeShape>;
 /**
- * A CounterBadge can be square, circular or rounded.
+ * Values for the `size` attribute on CounterBadge elements.
+ *
  * @public
  */
 export declare const CounterBadgeSize: {
@@ -63,7 +70,14 @@ export declare const CounterBadgeSize: {
     readonly extraLarge: "extra-large";
 };
 /**
- * A CounterBadge can be on of several preset sizes.
+ * Type for the `size` attribute on CounterBadge elements, based on the CounterBadgeSize constants.
+ *
  * @public
  */
 export type CounterBadgeSize = ValuesOf<typeof CounterBadgeSize>;
+/**
+ * The tag name for the counter badge element.
+ *
+ * @public
+ */
+export declare const tagName: "fluent-counter-badge";

package/dist/esm/counter-badge/counter-badge.options.js

@@ -1,5 +1,7 @@
+import { FluentDesignSystem } from '../fluent-design-system.js';
 /**
- * CounterBadgeAppearance constants
+ * Values for the `appearance` attribute on CounterBadge elements.
+ *
  * @public
  */
 export const CounterBadgeAppearance = {
@@ -7,7 +9,8 @@ export const CounterBadgeAppearance = {
     ghost: 'ghost',
 };
 /**
- * CounterBadgeColor constants
+ * Values for the `color` attribute on CounterBadge elements.
+ *
  * @public
  */
 export const CounterBadgeColor = {
@@ -21,7 +24,8 @@ export const CounterBadgeColor = {
     warning: 'warning',
 };
 /**
- * A CounterBadge shape can be circular or rounded.
+ * Values for the `shape` attribute on CounterBadge elements.
+ *
  * @public
  */
 export const CounterBadgeShape = {
@@ -29,7 +33,8 @@ export const CounterBadgeShape = {
     rounded: 'rounded',
 };
 /**
- * A CounterBadge can be square, circular or rounded.
+ * Values for the `size` attribute on CounterBadge elements.
+ *
  * @public
  */
 export const CounterBadgeSize = {
@@ -40,4 +45,10 @@ export const CounterBadgeSize = {
     large: 'large',
     extraLarge: 'extra-large',
 };
+/**
+ * The tag name for the counter badge element.
+ *
+ * @public
+ */
+export const tagName = `${FluentDesignSystem.prefix}-counter-badge`;
 //# sourceMappingURL=counter-badge.options.js.map

package/dist/esm/counter-badge/counter-badge.options.js.map

@@ -1 +1 @@
-{"version":3,"file":"counter-badge.options.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.options.ts"],"names":[],"mappings":"AASA;;;GAGG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG;IACpC,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;CACN,CAAC;AAQX;;;GAGG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,SAAS,EAAE,WAAW;IACtB,WAAW,EAAE,aAAa;IAC1B,MAAM,EAAE,QAAQ;IAChB,MAAM,EAAE,QAAQ;IAChB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;CACV,CAAC;AAQX;;;GAGG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,SAAS;CACV,CAAC;AAQX;;;GAGG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,IAAI,EAAE,MAAM;IACZ,UAAU,EAAE,aAAa;IACzB,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;IACd,UAAU,EAAE,aAAa;CACjB,CAAC"}
+{"version":3,"file":"counter-badge.options.js","sourceRoot":"","sources":["../../../src/counter-badge/counter-badge.options.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAYhE;;;;GAIG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG;IACpC,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;CACN,CAAC;AAQX;;;;GAIG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,SAAS,EAAE,WAAW;IACtB,WAAW,EAAE,aAAa;IAC1B,MAAM,EAAE,QAAQ;IAChB,MAAM,EAAE,QAAQ;IAChB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;CACV,CAAC;AAQX;;;;GAIG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,SAAS;CACV,CAAC;AASX;;;;GAIG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,IAAI,EAAE,MAAM;IACZ,UAAU,EAAE,aAAa;IACzB,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;IACd,UAAU,EAAE,aAAa;CACjB,CAAC;AASX;;;;GAIG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,kBAAkB,CAAC,MAAM,gBAAyB,CAAC"}