@fluentui/web-components 2.5.11 → 3.0.0-alpha.2

package/dist/dts/counter-badge/define.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/dts/counter-badge/index.d.ts

@@ -0,0 +1,5 @@
+export * from './counter-badge.js';
+export * from './counter-badge.options.js';
+export { template as CounterBadgeTemplate } from './counter-badge.template.js';
+export { styles as CounterBadgeStyles } from './counter-badge.styles.js';
+export { definition as CounterBadgeDefinition } from './counter-badge.definition.js';

package/dist/dts/fluent-design-system.d.ts

@@ -1,9 +1,5 @@
-import { DesignSystem } from '@microsoft/fast-foundation';
-/**
- * Provides a design system for the specified element either by returning one that was
- * already created for that element or creating one.
- * @param element - The element to root the design system at. By default, this is the body.
- * @returns A Fluent Design System
- * @public
- */
-export declare function provideFluentDesignSystem(element?: HTMLElement): DesignSystem;
+export declare const FluentDesignSystem: Readonly<{
+    prefix: "fluent";
+    shadowRootMode: "open";
+    registry: CustomElementRegistry;
+}>;

package/dist/dts/index-rollup.d.ts

@@ -1,8 +1 @@
-export * from './index';
-/**
- * The global Fluent Design System.
- * @remarks
- * Only available if the components are added through a script tag
- * rather than a module/build system.
- */
-export declare const FluentDesignSystem: import("@microsoft/fast-foundation").DesignSystem;
+export * from './index.js';

package/dist/dts/index.d.ts

@@ -1,49 +1,5 @@
-/**
- * Export all custom element definitions.
- */
-export * from './custom-elements';
-export * from './fluent-design-system';
-export * from './accordion/';
-export * from './anchor/';
-export * from './anchored-region';
-export * from './badge/';
-export * from './breadcrumb';
-export * from './breadcrumb-item';
-export * from './button/';
-export * from './card/';
-export * from './checkbox/';
-export * from './combobox/';
-export * from './data-grid';
-export * from './design-system-provider/';
-export * from './dialog/';
-export * from './divider/';
-export * from './flipper/';
-export * from './horizontal-scroll/';
-export * from './listbox';
-export * from './listbox-option';
-export * from './menu/';
-export * from './menu-item/';
-export * from './number-field/';
-export * from './progress/';
-export * from './radio/';
-export * from './radio-group/';
-export * from './search/';
-export * from './select';
-export * from './skeleton/';
-export * from './slider/';
-export * from './slider-label/';
-export * from './switch/';
-export * from './tabs/';
-export * from './text-area/';
-export * from './text-field/';
-export * from './toolbar';
-export * from './tooltip';
-export * from './tree-item/';
-export * from './tree-view/';
-export * from './design-tokens';
-export * from './styles';
-export { Palette, PaletteRGB } from './color/palette';
-export { InteractiveSwatchSet } from './color/recipe';
-export { Swatch, SwatchRGB } from './color/swatch';
-export { isDark } from './color/utilities/is-dark';
-export { StandardLuminance } from './color/utilities/base-layer-luminance';
+export * from './badge/index.js';
+export * from './counter-badge/index.js';
+export * from './progress-bar/index.js';
+export * from './text/index.js';
+export * from './theme/index.js';

package/dist/dts/progress-bar/define.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/dts/progress-bar/index.d.ts

@@ -0,0 +1,5 @@
+export * from './progress-bar.js';
+export * from './progress-bar.options.js';
+export { definition as ProgressBarDefinition } from './progress-bar.definition.js';
+export { styles as ProgressBarStyles } from './progress-bar.styles.js';
+export { template as ProgressBarTemplate } from './progress-bar.template.js';

package/dist/dts/progress-bar/progress-bar.d.ts

@@ -0,0 +1,30 @@
+import { FASTProgress } from '@microsoft/fast-foundation';
+import type { ProgressBarShape, ProgressBarThickness, ProgressBarValidationState } from './progress-bar.options.js';
+/**
+ * The base class used for constructing a fluent-progress-bar custom element
+ * @public
+ */
+export declare class ProgressBar extends FASTProgress {
+    /**
+     * The thickness of the progress bar
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: thickness
+     */
+    thickness: ProgressBarThickness;
+    /**
+     * The shape of the progress bar
+     * @public
+     * @remarks
+     * HTML Attribute: shape
+     */
+    shape: ProgressBarShape;
+    /**
+     * The validation state of the progress bar
+     * @public
+     * @remarks
+     * HTML Attribute: validation-state
+     */
+    validationState: ProgressBarValidationState | null;
+}

package/dist/dts/progress-bar/progress-bar.definition.d.ts

@@ -0,0 +1,10 @@
+import { ProgressBar } from './progress-bar.js';
+/**
+ * The Fluent ProgressBar Element.
+ *
+ *
+ * @public
+ * @remarks
+ * HTML Element: \<fluent-progress-bar\>
+ */
+export declare const definition: import("@microsoft/fast-element").FASTElementDefinition<typeof ProgressBar>;

package/dist/dts/progress-bar/progress-bar.options.d.ts

@@ -0,0 +1,41 @@
+import { ValuesOf } from '@microsoft/fast-foundation';
+/**
+ * ProgressBarThickness Constants
+ * @public
+ */
+export declare const ProgressBarThickness: {
+    readonly medium: "medium";
+    readonly large: "large";
+};
+/**
+ * Applies bar thickness to the content
+ * @public
+ */
+export declare type ProgressBarThickness = ValuesOf<typeof ProgressBarThickness>;
+/**
+ * ProgressBarShape Constants
+ * @public
+ */
+export declare const ProgressBarShape: {
+    readonly rounded: "rounded";
+    readonly square: "square";
+};
+/**
+ * Applies bar shape to the content
+ * @public
+ */
+export declare type ProgressBarShape = ValuesOf<typeof ProgressBarShape>;
+/**
+ * ProgressBarValidationState Constants
+ * @public
+ */
+export declare const ProgressBarValidationState: {
+    readonly success: "success";
+    readonly warning: "warning";
+    readonly error: "error";
+};
+/**
+ * Applies validation state to the content
+ * @public
+ */
+export declare type ProgressBarValidationState = ValuesOf<typeof ProgressBarValidationState>;

package/dist/dts/progress-bar/progress-bar.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Args, Meta } from '@storybook/html';
+import type { ProgressBar as FluentProgressBar } from './progress-bar.js';
+import './define.js';
+declare type ProgressStoryArgs = Args & FluentProgressBar;
+declare type ProgressStoryMeta = Meta<ProgressStoryArgs>;
+declare const _default: ProgressStoryMeta;
+export default _default;
+export declare const Progress: any;
+export declare const ProgressIndeterminate: (args: Args) => Element | DocumentFragment | null;

package/dist/dts/progress-bar/progress-bar.styles.d.ts

@@ -0,0 +1,4 @@
+/** Text styles
+ * @public
+ */
+export declare const styles: import("@microsoft/fast-element").ElementStyles;

package/dist/dts/progress-bar/progress-bar.template.d.ts

@@ -0,0 +1,3 @@
+import type { ElementViewTemplate } from '@microsoft/fast-element';
+import type { ProgressBar } from './progress-bar.js';
+export declare const template: ElementViewTemplate<ProgressBar>;

package/dist/dts/styles/index.d.ts

@@ -1,5 +1 @@
-export * from './direction';
-export * from './elevation';
-export * from './focus';
-export * from './patterns/';
-export * from './size';
+export * from './partials/index.js';

package/dist/dts/styles/partials/badge.partials.d.ts

@@ -0,0 +1,28 @@
+export declare const badgeBaseStyles: import("@microsoft/fast-element").CSSDirective;
+/**
+ * @public
+ * The badge's size styles
+ */
+export declare const badgeSizeStyles: import("@microsoft/fast-element").CSSDirective;
+/**
+ * The badge's `filled` appearance styles
+ * Filled appearance is default so do not
+ * Include that attribute as it's not present by default
+ * @public
+ */
+export declare const badgeFilledStyles: import("@microsoft/fast-element").CSSDirective;
+/**
+ * The badge's `ghost` appearance styles
+ * @public
+ */
+export declare const badgeGhostStyles: import("@microsoft/fast-element").CSSDirective;
+/**
+ * The badge's `outline` appearance styles
+ * @public
+ */
+export declare const badgeOutlineStyles: import("@microsoft/fast-element").CSSDirective;
+/**
+ * The badge's `tint` appearance styles
+ * @public
+ */
+export declare const badgeTintStyles: import("@microsoft/fast-element").CSSDirective;

package/dist/dts/styles/partials/index.d.ts

@@ -0,0 +1 @@
+export * from './badge.partials.js';

package/dist/dts/text/define.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/dts/text/index.d.ts

@@ -0,0 +1,5 @@
+export * from './text.js';
+export * from './text.options.js';
+export { template as TextTemplate } from './text.template.js';
+export { styles as TextStyles } from './text.styles.js';
+export { definition as TextDefinition } from './text.definition.js';

package/dist/dts/text/text.d.ts

@@ -0,0 +1,91 @@
+import { FASTElement } from '@microsoft/fast-element';
+import type { TextAlign, TextFont, TextSize, TextWeight } from './text.options.js';
+/**
+ * The base class used for constructing a fluent-text custom element
+ * @public
+ */
+export declare class Text extends FASTElement {
+    /**
+     * The text will not wrap
+     * NOTE: In Fluent UI React v9 this is "wrap"
+     * Boolean attributes which default to true in HTML can't be switched off in the DOM
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: nowrap
+     */
+    nowrap: boolean;
+    /**
+     * The text truncates
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: truncate
+     */
+    truncate: boolean;
+    /**
+     * The text style is italic
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: italic
+     */
+    italic: boolean;
+    /**
+     * The text style is underline
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: underline
+     */
+    underline: boolean;
+    /**
+     * The text style is strikethrough
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: strikethrough
+     */
+    strikethrough: boolean;
+    /**
+     * An text can take up the width of its container.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: block
+     */
+    block: boolean;
+    /**
+     * THe Text size
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: size
+     *
+     */
+    size: TextSize;
+    /**
+     * THe Text font
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: font
+     */
+    font: TextFont;
+    /**
+     * THe Text weight
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: weight
+     */
+    weight: TextWeight;
+    /**
+     * THe Text align
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: align
+     */
+    align: TextAlign;
+}

package/dist/dts/text/text.definition.d.ts

@@ -0,0 +1,10 @@
+import { Text } from './text.js';
+/**
+ * The Fluent Text Element.
+ *
+ *
+ * @public
+ * @remarks
+ * HTML Element: \<fluent-text\>
+ */
+export declare const definition: import("@microsoft/fast-element").FASTElementDefinition<typeof Text>;

package/dist/dts/text/text.options.d.ts

@@ -0,0 +1,67 @@
+import { ValuesOf } from '@microsoft/fast-foundation';
+/**
+ * TextSize constants
+ * @public
+ */
+export declare const TextSize: {
+    readonly _100: "100";
+    readonly _200: "200";
+    readonly _300: "300";
+    readonly _400: "400";
+    readonly _500: "500";
+    readonly _600: "600";
+    readonly _700: "700";
+    readonly _800: "800";
+    readonly _900: "900";
+    readonly _1000: "1000";
+};
+/**
+ * The type for TextSize
+ * The font size and line height based on the theme tokens
+ * @public
+ */
+export declare type TextSize = ValuesOf<typeof TextSize>;
+/**
+ * TextFont Constants
+ * @public
+ */
+export declare const TextFont: {
+    readonly base: "base";
+    readonly numeric: "numeric";
+    readonly monospace: "monospace";
+};
+/**
+ * Applies font family to the content
+ * @public
+ */
+export declare type TextFont = ValuesOf<typeof TextFont>;
+/**
+ * TextWeight Constants
+ * @public
+ */
+export declare const TextWeight: {
+    readonly medium: "medium";
+    readonly regular: "regular";
+    readonly semibold: "semibold";
+    readonly bold: "bold";
+};
+/**
+ * Applies font weight to the content
+ * @public
+ */
+export declare type TextWeight = ValuesOf<typeof TextWeight>;
+/**
+ * TextAlign Constants
+ * @public
+ */
+export declare const TextAlign: {
+    readonly start: "start";
+    readonly end: "end";
+    readonly center: "center";
+    readonly justify: "justify";
+};
+/**
+ * Aligns the content
+ * @public
+ */
+export declare type TextAlign = ValuesOf<typeof TextAlign>;

package/dist/dts/text/text.stories.d.ts

@@ -0,0 +1,8 @@
+import type { Args, Meta } from '@storybook/html';
+import type { Text as FluentText } from './text.js';
+import './define.js';
+declare type TextStoryArgs = Args & FluentText;
+declare type TextStoryMeta = Meta<TextStoryArgs>;
+declare const _default: TextStoryMeta;
+export default _default;
+export declare const Text: any;

package/dist/dts/text/text.styles.d.ts

@@ -0,0 +1,4 @@
+/** Text styles
+ * @public
+ */
+export declare const styles: import("@microsoft/fast-element").ElementStyles;

package/dist/dts/text/text.template.d.ts

@@ -0,0 +1,6 @@
+import { ElementViewTemplate } from '@microsoft/fast-element';
+import type { Text } from './text.js';
+/**
+ * @internal
+ */
+export declare const template: ElementViewTemplate<Text>;