docs(action): deprecates the compact property (#9847)

**Related Issue:** #3859 ## Summary - deprecates the compact property
Esri · Jul 30, 2024 · 00d69be · 00d69be
1 parent a77cd27
commit 00d69be
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 10 deletions.
diff --git a/packages/calcite-components/src/components.d.ts b/packages/calcite-components/src/components.d.ts
@@ -283,7 +283,8 @@ export namespace Components {
          */
         "appearance": Extract<"solid" | "transparent", Appearance>;
         /**
-          * When `true`, the side padding of the component is reduced. Compact mode is used internally by components, e.g. `calcite-block-section`.
+          * When `true`, the side padding of the component is reduced.
+          * @deprecated No longer necessary.
          */
         "compact": boolean;
         /**
@@ -8167,7 +8168,8 @@ declare namespace LocalJSX {
          */
         "appearance"?: Extract<"solid" | "transparent", Appearance>;
         /**
-          * When `true`, the side padding of the component is reduced. Compact mode is used internally by components, e.g. `calcite-block-section`.
+          * When `true`, the side padding of the component is reduced.
+          * @deprecated No longer necessary.
          */
         "compact"?: boolean;
         /**

diff --git a/packages/calcite-components/src/components/action/action.e2e.ts b/packages/calcite-components/src/components/action/action.e2e.ts
@@ -14,7 +14,7 @@ describe("calcite-action", () => {
         defaultValue: "solid",
       },
       {
-        propertyName: "compact",
+        propertyName: "compact", // (deprecated)
         defaultValue: false,
       },
       {

diff --git a/packages/calcite-components/src/components/action/action.scss b/packages/calcite-components/src/components/action/action.scss
@@ -135,7 +135,7 @@
   }
 }
 
-// Compact
+/* [Deprecated]  Compact */
 :host([scale="s"][compact]) .button,
 :host([scale="m"][compact]) .button,
 :host([scale="l"][compact]) .button {

diff --git a/packages/calcite-components/src/components/action/action.stories.ts b/packages/calcite-components/src/components/action/action.stories.ts
@@ -10,7 +10,6 @@ type ActionStoryArgs = Pick<
   | "active"
   | "alignment"
   | "appearance"
-  | "compact"
   | "disabled"
   | "icon"
   | "indicator"
@@ -27,7 +26,6 @@ export default {
     active: false,
     alignment: alignment.defaultValue,
     appearance: appearance.defaultValue,
-    compact: false,
     disabled: false,
     icon: "banana",
     indicator: false,
@@ -63,7 +61,6 @@ export const simple = (args: ActionStoryArgs): string => html`
       ${boolean("active", args.active)}
       alignment="${args.alignment}"
       appearance="${args.appearance}"
-      ${boolean("compact", args.compact)}
       ${boolean("disabled", args.disabled)}
       icon="${args.icon}"
       ${boolean("indicator", args.indicator)}
@@ -76,15 +73,14 @@ export const simple = (args: ActionStoryArgs): string => html`
   </div>
 `;
 
-export const disabledAndCompactAndTextOnly_TestOnly = (): string => html`
+export const disabledAndTextOnly_TestOnly = (): string => html`
   <div>
     <calcite-action
       icon="banana"
       alignment="start"
       appearance="solid"
       label="Label"
       scale="m"
-      compact
       disabled
       text="Text"
       text-enabled

diff --git a/packages/calcite-components/src/components/action/action.tsx b/packages/calcite-components/src/components/action/action.tsx
@@ -74,7 +74,9 @@ export class Action
   @Prop({ reflect: true }) appearance: Extract<"solid" | "transparent", Appearance> = "solid";
 
   /**
-   * When `true`, the side padding of the component is reduced. Compact mode is used internally by components, e.g. `calcite-block-section`.
+   * When `true`, the side padding of the component is reduced.
+   *
+   * @deprecated No longer necessary.
    */
   @Prop({ reflect: true }) compact = false;