@esri/calcite-components 1.0.0-next.687 → 1.0.0-next.688

package/dist/types/components.d.ts

@@ -20,10 +20,9 @@ import { HeadingLevel } from "./components/functional/Heading";
 import { Messages as Messages5 } from "./components/block/assets/block/t9n";
 import { BlockSectionToggleDisplay } from "./components/block-section/interfaces";
 import { Messages as Messages6 } from "./components/block-section/assets/block-section/t9n";
-import { ButtonAlignment, ButtonAppearance, ButtonColor, DropdownIconType } from "./components/button/interfaces";
+import { ButtonAlignment, DropdownIconType } from "./components/button/interfaces";
 import { Messages as Messages7 } from "./components/button/assets/button/t9n";
 import { Messages as Messages8 } from "./components/card/assets/card/t9n";
-import { ChipColor } from "./components/chip/interfaces";
 import { Messages as Messages9 } from "./components/chip/assets/chip/t9n";
 import { ColorAppearance, ColorValue, InternalColor } from "./components/color-picker/interfaces";
 import { Format } from "./components/color-picker/utils";
@@ -109,6 +108,10 @@ export namespace Components {
           * Specifies an icon to display at the end of the component.
          */
         "iconEnd": string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": FlipContext;
         /**
           * Specifies an icon to display at the start of the component.
          */
@@ -139,6 +142,10 @@ export namespace Components {
           * Specifies an icon to display.
          */
         "icon": string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
         /**
           * When `true`, displays a visual indicator.
          */
@@ -329,6 +336,10 @@ export namespace Components {
           * When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.
          */
         "icon": string | boolean;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
         /**
           * Specifies the kind of the component (will apply to top border and icon).
          */
@@ -468,20 +479,14 @@ export namespace Components {
         /**
           * Specifies the appearance style of the component.
          */
-        "appearance": ButtonAppearance;
-        /**
-          * Specifies the color of the component.
-         */
-        "color": ButtonColor;
+        "appearance": Extract<
+    "outline" | "outline-fill" | "solid" | "transparent",
+    Appearance
+  >;
         /**
           * When `true`, interaction is prevented and the component is displayed with lower opacity.
          */
         "disabled": boolean;
-        /**
-          * The form ID to associate with the component.
-          * @deprecated – The property is no longer needed if the component is placed inside a form.
-         */
-        "form": string;
         /**
           * Specifies the URL of the linked resource, which can be set as an absolute or relative path.
          */
@@ -498,6 +503,10 @@ export namespace Components {
           * Specifies an icon to display at the start of the component.
          */
         "iconStart": string;
+        /**
+          * Specifies the kind of the component (will apply to border and background if applicable).
+         */
+        "kind": Extract<"brand" | "danger" | "inverse" | "neutral", Kind>;
         /**
           * Accessible name for the component.
          */
@@ -631,7 +640,7 @@ export namespace Components {
         /**
           * Specifies the appearance style of the component.
          */
-        "appearance": Extract<"solid" | "transparent", Appearance>;
+        "appearance": Extract<"outline" | "outline-fill" | "solid", Appearance>;
         /**
           * When `true`, a close button is added to the component.
          */
@@ -640,10 +649,6 @@ export namespace Components {
           * When `true`, hides the component.
          */
         "closed": boolean;
-        /**
-          * Specifies the color for the component.
-         */
-        "color": ChipColor;
         /**
           * Specifies an icon to display.
          */
@@ -652,6 +657,10 @@ export namespace Components {
           * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
          */
         "iconFlipRtl": boolean;
+        /**
+          * Specifies the kind of the component (will apply to border and background if applicable).
+         */
+        "kind": Extract<"brand" | "inverse" | "neutral", Kind>;
         /**
           * Use this property to override individual strings used by the component.
          */
@@ -840,6 +849,10 @@ export namespace Components {
           * Specifies the placeholder icon for the input.
          */
         "placeholderIcon": string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "placeholderIconFlipRtl": boolean;
         /**
           * Updates the position of the component.
           * @param delayed
@@ -896,6 +909,10 @@ export namespace Components {
           * Specifies an icon to display.
          */
         "icon": string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
         /**
           * When `true`, the component is selected.
          */
@@ -1228,11 +1245,7 @@ export namespace Components {
         /**
           * Specifies the appearance style of the component.
          */
-        "appearance": Extract<"solid" | "outline", Appearance>;
-        /**
-          * Specifies the color of the component.
-         */
-        "color": ButtonColor;
+        "appearance": Extract<"solid" | "outline-fill", Appearance>;
         /**
           * When `true`, interaction is prevented and the component is displayed with lower opacity.
          */
@@ -1242,6 +1255,14 @@ export namespace Components {
           * @default "plus"
          */
         "icon": string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
+        /**
+          * Specifies the kind of the component (will apply to border and background).
+         */
+        "kind": Extract<"brand" | "danger" | "inverse" | "neutral", Kind>;
         /**
           * Accessible name for the component.
          */
@@ -1780,6 +1801,10 @@ export namespace Components {
           * Specifies an icon to display.
          */
         "icon": boolean | string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
         /**
           * Specifies the size of the component.
          */
@@ -2416,6 +2441,10 @@ export namespace Components {
           * When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.
          */
         "icon": string | boolean;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
         /**
           * Specifies the kind of the component (will apply to top border and icon).
          */
@@ -2657,6 +2686,10 @@ export namespace Components {
           * @see [ICON_TYPES](https://github.com/Esri/calcite-components/blob/master/src/components/pick-list/resources.ts#L5)
          */
         "icon": ICON_TYPES | null;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
         /**
           * Label and accessible name for the component. Appears next to the icon.
          */
@@ -3245,11 +3278,10 @@ export namespace Components {
         /**
           * Specifies the appearance style of the component.
          */
-        "appearance": ButtonAppearance;
-        /**
-          * Specifies the color of the component.
-         */
-        "color": ButtonColor;
+        "appearance": Extract<
+    "outline" | "outline-fill" | "solid" | "transparent",
+    Appearance
+  >;
         /**
           * When `true`, interaction is prevented and the component is displayed with lower opacity.
          */
@@ -3262,6 +3294,10 @@ export namespace Components {
           * Accessible name for the dropdown menu.
          */
         "dropdownLabel": string;
+        /**
+          * Specifies the kind of the component (will apply to border and background if applicable).
+         */
+        "kind": Extract<"brand" | "danger" | "inverse" | "neutral", Kind>;
         /**
           * When `true`, a busy indicator is displayed on the primary button.
          */
@@ -3364,6 +3400,10 @@ export namespace Components {
          */
         "heading": string;
         "icon": boolean;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
         "layout": Extract<"horizontal" | "vertical", Layout>;
         "numbered": boolean;
         "scale": Scale;
@@ -3534,6 +3574,10 @@ export namespace Components {
           * Specifies an icon to display.
          */
         "icon": string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
     }
     interface CalciteTileSelect {
         /**
@@ -3560,6 +3604,10 @@ export namespace Components {
           * Specifies an icon to display.
          */
         "icon": string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
         /**
           * When `inputEnabled` is `true`, specifies the placement of the interactive input on the component.
          */
@@ -3867,6 +3915,10 @@ export namespace Components {
           * @see [ICON_TYPES](https://github.com/Esri/calcite-components/blob/master/src/components/pick-list/resources.ts#L5)
          */
         "icon"?: ICON_TYPES | null;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl": boolean;
         /**
           * Label and accessible name for the component. Appears next to the icon.
          */
@@ -4851,6 +4903,10 @@ declare namespace LocalJSX {
           * Specifies an icon to display at the end of the component.
          */
         "iconEnd"?: string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: FlipContext;
         /**
           * Specifies an icon to display at the start of the component.
          */
@@ -4881,6 +4937,10 @@ declare namespace LocalJSX {
           * Specifies an icon to display.
          */
         "icon"?: string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
         /**
           * When `true`, displays a visual indicator.
          */
@@ -5047,6 +5107,10 @@ declare namespace LocalJSX {
           * When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.
          */
         "icon"?: string | boolean;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
         /**
           * Specifies the kind of the component (will apply to top border and icon).
          */
@@ -5194,20 +5258,14 @@ declare namespace LocalJSX {
         /**
           * Specifies the appearance style of the component.
          */
-        "appearance"?: ButtonAppearance;
-        /**
-          * Specifies the color of the component.
-         */
-        "color"?: ButtonColor;
+        "appearance"?: Extract<
+    "outline" | "outline-fill" | "solid" | "transparent",
+    Appearance
+  >;
         /**
           * When `true`, interaction is prevented and the component is displayed with lower opacity.
          */
         "disabled"?: boolean;
-        /**
-          * The form ID to associate with the component.
-          * @deprecated – The property is no longer needed if the component is placed inside a form.
-         */
-        "form"?: string;
         /**
           * Specifies the URL of the linked resource, which can be set as an absolute or relative path.
          */
@@ -5224,6 +5282,10 @@ declare namespace LocalJSX {
           * Specifies an icon to display at the start of the component.
          */
         "iconStart"?: string;
+        /**
+          * Specifies the kind of the component (will apply to border and background if applicable).
+         */
+        "kind"?: Extract<"brand" | "danger" | "inverse" | "neutral", Kind>;
         /**
           * Accessible name for the component.
          */
@@ -5337,7 +5399,7 @@ declare namespace LocalJSX {
         /**
           * Specifies the appearance style of the component.
          */
-        "appearance"?: Extract<"solid" | "transparent", Appearance>;
+        "appearance"?: Extract<"outline" | "outline-fill" | "solid", Appearance>;
         /**
           * When `true`, a close button is added to the component.
          */
@@ -5346,10 +5408,6 @@ declare namespace LocalJSX {
           * When `true`, hides the component.
          */
         "closed"?: boolean;
-        /**
-          * Specifies the color for the component.
-         */
-        "color"?: ChipColor;
         /**
           * Specifies an icon to display.
          */
@@ -5358,6 +5416,10 @@ declare namespace LocalJSX {
           * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
          */
         "iconFlipRtl"?: boolean;
+        /**
+          * Specifies the kind of the component (will apply to border and background if applicable).
+         */
+        "kind"?: Extract<"brand" | "inverse" | "neutral", Kind>;
         /**
           * Use this property to override individual strings used by the component.
          */
@@ -5562,6 +5624,10 @@ declare namespace LocalJSX {
           * Specifies the placeholder icon for the input.
          */
         "placeholderIcon"?: string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "placeholderIconFlipRtl"?: boolean;
         /**
           * Specifies the size of the component.
          */
@@ -5605,6 +5671,10 @@ declare namespace LocalJSX {
           * Specifies an icon to display.
          */
         "icon"?: string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
         /**
           * Emits whenever the component is selected or unselected.
          */
@@ -5951,11 +6021,7 @@ declare namespace LocalJSX {
         /**
           * Specifies the appearance style of the component.
          */
-        "appearance"?: Extract<"solid" | "outline", Appearance>;
-        /**
-          * Specifies the color of the component.
-         */
-        "color"?: ButtonColor;
+        "appearance"?: Extract<"solid" | "outline-fill", Appearance>;
         /**
           * When `true`, interaction is prevented and the component is displayed with lower opacity.
          */
@@ -5965,6 +6031,14 @@ declare namespace LocalJSX {
           * @default "plus"
          */
         "icon"?: string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
+        /**
+          * Specifies the kind of the component (will apply to border and background).
+         */
+        "kind"?: Extract<"brand" | "danger" | "inverse" | "neutral", Kind>;
         /**
           * Accessible name for the component.
          */
@@ -6495,6 +6569,10 @@ declare namespace LocalJSX {
           * Specifies an icon to display.
          */
         "icon"?: boolean | string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
         /**
           * Specifies the size of the component.
          */
@@ -7075,6 +7153,10 @@ declare namespace LocalJSX {
           * When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.
          */
         "icon"?: string | boolean;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
         /**
           * Specifies the kind of the component (will apply to top border and icon).
          */
@@ -7300,6 +7382,10 @@ declare namespace LocalJSX {
           * @see [ICON_TYPES](https://github.com/Esri/calcite-components/blob/master/src/components/pick-list/resources.ts#L5)
          */
         "icon"?: ICON_TYPES | null;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
         /**
           * Label and accessible name for the component. Appears next to the icon.
          */
@@ -7859,11 +7945,10 @@ declare namespace LocalJSX {
         /**
           * Specifies the appearance style of the component.
          */
-        "appearance"?: ButtonAppearance;
-        /**
-          * Specifies the color of the component.
-         */
-        "color"?: ButtonColor;
+        "appearance"?: Extract<
+    "outline" | "outline-fill" | "solid" | "transparent",
+    Appearance
+  >;
         /**
           * When `true`, interaction is prevented and the component is displayed with lower opacity.
          */
@@ -7876,6 +7961,10 @@ declare namespace LocalJSX {
           * Accessible name for the dropdown menu.
          */
         "dropdownLabel"?: string;
+        /**
+          * Specifies the kind of the component (will apply to border and background if applicable).
+         */
+        "kind"?: Extract<"brand" | "danger" | "inverse" | "neutral", Kind>;
         /**
           * When `true`, a busy indicator is displayed on the primary button.
          */
@@ -7968,6 +8057,10 @@ declare namespace LocalJSX {
           * The component header text.
          */
         "heading"?: string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
         /**
           * When `true`, the component is selected.
          */
@@ -8108,6 +8201,10 @@ declare namespace LocalJSX {
           * Specifies an icon to display.
          */
         "icon"?: string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
     }
     interface CalciteTileSelect {
         /**
@@ -8134,6 +8231,10 @@ declare namespace LocalJSX {
           * Specifies an icon to display.
          */
         "icon"?: string;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
         /**
           * When `inputEnabled` is `true`, specifies the placement of the interactive input on the component.
          */
@@ -8433,6 +8534,10 @@ declare namespace LocalJSX {
           * @see [ICON_TYPES](https://github.com/Esri/calcite-components/blob/master/src/components/pick-list/resources.ts#L5)
          */
         "icon"?: ICON_TYPES | null;
+        /**
+          * When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`).
+         */
+        "iconFlipRtl"?: boolean;
         /**
           * Label and accessible name for the component. Appears next to the icon.
          */