From 4e569fe1ea0ddfd81e11616abe5535f55e3a9fac Mon Sep 17 00:00:00 2001 From: Branden Chong <158607603+brandentheintern@users.noreply.github.com> Date: Tue, 5 Mar 2024 13:35:07 -0800 Subject: [PATCH 1/4] test(alert): added text align centered test (#8840) **Related Issue:** #4636 Set up a Chromatic test to check if text align center would affect the shadow DOM of the calcite-alert component --- .../src/components/alert/alert.stories.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/packages/calcite-components/src/components/alert/alert.stories.ts b/packages/calcite-components/src/components/alert/alert.stories.ts index 99c2654aca4..5008f270a0e 100644 --- a/packages/calcite-components/src/components/alert/alert.stories.ts +++ b/packages/calcite-components/src/components/alert/alert.stories.ts @@ -218,3 +218,13 @@ export const autoClosableRetainsCloseButton_TestOnly = (): string => html` Take action `; + +export const textAlignDoesNotAffectComponentAlignment_TestOnly = (): string => html` +
+ +
Trail Camera Report
+
We thought you might want to take a look
+ Take action + +
+`; From ec9982ba714ece59f782639fa02deec9f4006216 Mon Sep 17 00:00:00 2001 From: DitwanP Date: Tue, 2 Apr 2024 12:58:38 -0700 Subject: [PATCH 2/4] docs: remove usage sample snippets for a through d components --- .../src/components/accordion/usage/Basic.md | 7 ----- .../action-bar/usage/Actions-end.md | 8 ------ .../src/components/action-bar/usage/Basic.md | 8 ------ .../components/action-bar/usage/Tooltip.md | 8 ------ .../action-bar/usage/With-grouping.md | 15 ----------- .../src/components/action-pad/usage/Basic.md | 8 ------ .../components/action-pad/usage/Tooltip.md | 8 ------ .../action-pad/usage/With-grouping.md | 12 --------- .../action/usage/Transparent-appearance.md | 5 ---- .../action/usage/With-text-displayed.md | 5 ---- .../components/action/usage/With-tooltip.md | 7 ----- .../action/usage/Without-text-displayed.md | 5 ---- .../src/components/alert/usage/Basic.md | 9 ------- .../src/components/avatar/usage/Basic.md | 27 ------------------- .../src/components/block/usage/Always-open.md | 11 -------- .../src/components/block/usage/Basic.md | 5 ---- .../src/components/block/usage/Collapsible.md | 13 --------- .../block/usage/Header-with-control.md | 7 ----- .../block/usage/Header-with-icon.md | 7 ----- .../src/components/button/usage/Basic.md | 3 --- .../src/components/button/usage/Focusing.md | 5 ---- .../src/components/button/usage/Internals.md | 9 ------- .../src/components/button/usage/With-icons.md | 5 ---- .../button/usage/With-loader-disabled.md | 4 --- .../components/button/usage/Within-form.md | 11 -------- .../src/components/card-group/usage/Basic.md | 20 -------------- .../card-group/usage/SelectionMode.md | 20 -------------- .../src/components/card/usage/Basic.md | 10 ------- .../src/components/checkbox/usage/Basic.md | 3 --- .../usage/Checked-with-calcite-label.md | 6 ----- .../usage/Indeterminate-with-native-label.md | 4 --- .../src/components/chip-group/usage/Basic.md | 8 ------ .../chip-group/usage/SinglePersist.md | 8 ------ .../src/components/chip/usage/Basic.md | 3 --- .../components/color-picker/usage/Basic.md | 3 --- .../components/combobox/usage/Ancestors.md | 13 --------- .../src/components/combobox/usage/Multiple.md | 13 --------- .../src/components/combobox/usage/Single.md | 14 ---------- .../combobox/usage/SinglePersist.md | 14 ---------- .../src/components/date-picker/usage/Basic.md | 5 ---- .../src/components/date-picker/usage/Range.md | 9 ------- .../src/components/dropdown/usage/Basic.md | 12 --------- .../usage/Disabling-close-on-select.md | 12 --------- .../src/components/dropdown/usage/Groups.md | 21 --------------- 44 files changed, 410 deletions(-) delete mode 100644 packages/calcite-components/src/components/accordion/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/action-bar/usage/Actions-end.md delete mode 100644 packages/calcite-components/src/components/action-bar/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/action-bar/usage/Tooltip.md delete mode 100644 packages/calcite-components/src/components/action-bar/usage/With-grouping.md delete mode 100644 packages/calcite-components/src/components/action-pad/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/action-pad/usage/Tooltip.md delete mode 100644 packages/calcite-components/src/components/action-pad/usage/With-grouping.md delete mode 100644 packages/calcite-components/src/components/action/usage/Transparent-appearance.md delete mode 100644 packages/calcite-components/src/components/action/usage/With-text-displayed.md delete mode 100644 packages/calcite-components/src/components/action/usage/With-tooltip.md delete mode 100644 packages/calcite-components/src/components/action/usage/Without-text-displayed.md delete mode 100644 packages/calcite-components/src/components/alert/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/avatar/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/block/usage/Always-open.md delete mode 100644 packages/calcite-components/src/components/block/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/block/usage/Collapsible.md delete mode 100644 packages/calcite-components/src/components/block/usage/Header-with-control.md delete mode 100644 packages/calcite-components/src/components/block/usage/Header-with-icon.md delete mode 100644 packages/calcite-components/src/components/button/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/button/usage/Focusing.md delete mode 100644 packages/calcite-components/src/components/button/usage/Internals.md delete mode 100644 packages/calcite-components/src/components/button/usage/With-icons.md delete mode 100644 packages/calcite-components/src/components/button/usage/With-loader-disabled.md delete mode 100644 packages/calcite-components/src/components/button/usage/Within-form.md delete mode 100644 packages/calcite-components/src/components/card-group/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/card-group/usage/SelectionMode.md delete mode 100644 packages/calcite-components/src/components/card/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/checkbox/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/checkbox/usage/Checked-with-calcite-label.md delete mode 100644 packages/calcite-components/src/components/checkbox/usage/Indeterminate-with-native-label.md delete mode 100644 packages/calcite-components/src/components/chip-group/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/chip-group/usage/SinglePersist.md delete mode 100644 packages/calcite-components/src/components/chip/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/color-picker/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/combobox/usage/Ancestors.md delete mode 100644 packages/calcite-components/src/components/combobox/usage/Multiple.md delete mode 100644 packages/calcite-components/src/components/combobox/usage/Single.md delete mode 100644 packages/calcite-components/src/components/combobox/usage/SinglePersist.md delete mode 100644 packages/calcite-components/src/components/date-picker/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/date-picker/usage/Range.md delete mode 100644 packages/calcite-components/src/components/dropdown/usage/Basic.md delete mode 100644 packages/calcite-components/src/components/dropdown/usage/Disabling-close-on-select.md delete mode 100644 packages/calcite-components/src/components/dropdown/usage/Groups.md diff --git a/packages/calcite-components/src/components/accordion/usage/Basic.md b/packages/calcite-components/src/components/accordion/usage/Basic.md deleted file mode 100644 index df94d83e183..00000000000 --- a/packages/calcite-components/src/components/accordion/usage/Basic.md +++ /dev/null @@ -1,7 +0,0 @@ -```html - - Accordion Section Content - Accordion Section Content - Accordion Section Content - -``` diff --git a/packages/calcite-components/src/components/action-bar/usage/Actions-end.md b/packages/calcite-components/src/components/action-bar/usage/Actions-end.md deleted file mode 100644 index 6b937fc14d6..00000000000 --- a/packages/calcite-components/src/components/action-bar/usage/Actions-end.md +++ /dev/null @@ -1,8 +0,0 @@ -The actions-end slot renders `calcite-action`s that stick to the end of the bar prior to the expand/collapse icon. - -```html - - - - -``` diff --git a/packages/calcite-components/src/components/action-bar/usage/Basic.md b/packages/calcite-components/src/components/action-bar/usage/Basic.md deleted file mode 100644 index 33eb076d9b6..00000000000 --- a/packages/calcite-components/src/components/action-bar/usage/Basic.md +++ /dev/null @@ -1,8 +0,0 @@ -Renders `calcite-action`s that stick to the top of the bar. - -```html - - - - -``` diff --git a/packages/calcite-components/src/components/action-bar/usage/Tooltip.md b/packages/calcite-components/src/components/action-bar/usage/Tooltip.md deleted file mode 100644 index 931502b9252..00000000000 --- a/packages/calcite-components/src/components/action-bar/usage/Tooltip.md +++ /dev/null @@ -1,8 +0,0 @@ -Renders with a tooltip on the expand action. - -```html - - Expand - - -``` diff --git a/packages/calcite-components/src/components/action-bar/usage/With-grouping.md b/packages/calcite-components/src/components/action-bar/usage/With-grouping.md deleted file mode 100644 index 7cb222d88bd..00000000000 --- a/packages/calcite-components/src/components/action-bar/usage/With-grouping.md +++ /dev/null @@ -1,15 +0,0 @@ -Renders a group of `calcite-action`s contained in a `calcite-action-group`. Actions in a group are visually separated from other groups or actions in the bar. - -```html - - - - - - - - - - - -``` diff --git a/packages/calcite-components/src/components/action-pad/usage/Basic.md b/packages/calcite-components/src/components/action-pad/usage/Basic.md deleted file mode 100644 index 513bf141dd3..00000000000 --- a/packages/calcite-components/src/components/action-pad/usage/Basic.md +++ /dev/null @@ -1,8 +0,0 @@ -Renders a basic action pad with `calcite-action`s. - -```html - - - - -``` diff --git a/packages/calcite-components/src/components/action-pad/usage/Tooltip.md b/packages/calcite-components/src/components/action-pad/usage/Tooltip.md deleted file mode 100644 index ef1fcaf4043..00000000000 --- a/packages/calcite-components/src/components/action-pad/usage/Tooltip.md +++ /dev/null @@ -1,8 +0,0 @@ -Renders an action pad with a tooltip on the expand action. - -```html - - - Let's expand - -``` diff --git a/packages/calcite-components/src/components/action-pad/usage/With-grouping.md b/packages/calcite-components/src/components/action-pad/usage/With-grouping.md deleted file mode 100644 index 3694c259490..00000000000 --- a/packages/calcite-components/src/components/action-pad/usage/With-grouping.md +++ /dev/null @@ -1,12 +0,0 @@ -Renders a group of `calcite-action`s contained in a `calcite-action-group`. Actions in a group are visually separated from other groups or actions in the pad. - -```html - - - - - - - - -``` diff --git a/packages/calcite-components/src/components/action/usage/Transparent-appearance.md b/packages/calcite-components/src/components/action/usage/Transparent-appearance.md deleted file mode 100644 index c41f2be9bd4..00000000000 --- a/packages/calcite-components/src/components/action/usage/Transparent-appearance.md +++ /dev/null @@ -1,5 +0,0 @@ -Renders a `calcite-action` that is transparent. - -```html - -``` diff --git a/packages/calcite-components/src/components/action/usage/With-text-displayed.md b/packages/calcite-components/src/components/action/usage/With-text-displayed.md deleted file mode 100644 index 0d5766a4d8f..00000000000 --- a/packages/calcite-components/src/components/action/usage/With-text-displayed.md +++ /dev/null @@ -1,5 +0,0 @@ -Renders a `calcite-action` that displays text alongside an icon. - -```html - -``` diff --git a/packages/calcite-components/src/components/action/usage/With-tooltip.md b/packages/calcite-components/src/components/action/usage/With-tooltip.md deleted file mode 100644 index 4a529b81abf..00000000000 --- a/packages/calcite-components/src/components/action/usage/With-tooltip.md +++ /dev/null @@ -1,7 +0,0 @@ -Renders a `calcite-action` that displays text alongside an icon. A `calcite-tooltip` will be displayed on hover or focus. - -```html -Save me! -``` diff --git a/packages/calcite-components/src/components/action/usage/Without-text-displayed.md b/packages/calcite-components/src/components/action/usage/Without-text-displayed.md deleted file mode 100644 index 24ffb0d5b0c..00000000000 --- a/packages/calcite-components/src/components/action/usage/Without-text-displayed.md +++ /dev/null @@ -1,5 +0,0 @@ -Renders a `calcite-action` that displays only an icon. - -```html - -``` diff --git a/packages/calcite-components/src/components/alert/usage/Basic.md b/packages/calcite-components/src/components/alert/usage/Basic.md deleted file mode 100644 index 5fa2bd3b257..00000000000 --- a/packages/calcite-components/src/components/alert/usage/Basic.md +++ /dev/null @@ -1,9 +0,0 @@ -A single instance of an alert. Multiple alerts will aggregate in a queue. - -```html - -
Title of alert
-
Message text of the alert
- Retry - -``` diff --git a/packages/calcite-components/src/components/avatar/usage/Basic.md b/packages/calcite-components/src/components/avatar/usage/Basic.md deleted file mode 100644 index f682d18901b..00000000000 --- a/packages/calcite-components/src/components/avatar/usage/Basic.md +++ /dev/null @@ -1,27 +0,0 @@ -The JSON sample user below is returned from a [search for users](https://developers.arcgis.com/rest/users-groups-and-items/user-search.htm). You can create an avatar for Ron by passing these properties directly to the avatar component. - -When no thumbnail is provided, the avatar component will construct a useful placeholder, leveraging the user's information to construct a unique background-color with initials. - -**Note:** if your user is private, remember to append a token to the end of the thumbnail using the form `thumbnail.jpg?token=YOUR_LOGGED_IN_USER_TOKEN`. - -```json -{ - "username": "ron_swanson_pawnee", - "id": "a81470986eaeee1833b74b7d8abcd5b2", - "fullName": "Ron Swanson", - "firstName": "Ron", - "lastName": "Swanson", - "thumbnail": "mySelf.jpg", - ... -} -``` - -```html - - -``` diff --git a/packages/calcite-components/src/components/block/usage/Always-open.md b/packages/calcite-components/src/components/block/usage/Always-open.md deleted file mode 100644 index fc0d74f3cfa..00000000000 --- a/packages/calcite-components/src/components/block/usage/Always-open.md +++ /dev/null @@ -1,11 +0,0 @@ -Renders a header and content that remains open - no collapsible option. - -```html - - - -``` diff --git a/packages/calcite-components/src/components/block/usage/Basic.md b/packages/calcite-components/src/components/block/usage/Basic.md deleted file mode 100644 index dd71913c28c..00000000000 --- a/packages/calcite-components/src/components/block/usage/Basic.md +++ /dev/null @@ -1,5 +0,0 @@ -Renders a basic, non-collapsible block. - -```html - -``` diff --git a/packages/calcite-components/src/components/block/usage/Collapsible.md b/packages/calcite-components/src/components/block/usage/Collapsible.md deleted file mode 100644 index 5e229be3a12..00000000000 --- a/packages/calcite-components/src/components/block/usage/Collapsible.md +++ /dev/null @@ -1,13 +0,0 @@ -Renders a header with a clickable icon to toggle the block open and closed. - -```html - - -
    -
  • The first species to be domesticated
    • -
  • Domesticated from wolves over 15,000 years ago
    • -
  • Adapted to human behavior performing many roles such as hunting, protection, military, therapy, etc.
    • -
- - -``` diff --git a/packages/calcite-components/src/components/block/usage/Header-with-control.md b/packages/calcite-components/src/components/block/usage/Header-with-control.md deleted file mode 100644 index 52bb22a75f6..00000000000 --- a/packages/calcite-components/src/components/block/usage/Header-with-control.md +++ /dev/null @@ -1,7 +0,0 @@ -Renders a header and control with a slot for adding a single HTML element (in the header). - -```html - - - -``` diff --git a/packages/calcite-components/src/components/block/usage/Header-with-icon.md b/packages/calcite-components/src/components/block/usage/Header-with-icon.md deleted file mode 100644 index de3d41cda50..00000000000 --- a/packages/calcite-components/src/components/block/usage/Header-with-icon.md +++ /dev/null @@ -1,7 +0,0 @@ -Renders a header and icon with the icon. - -```html - -
🐕
- -``` diff --git a/packages/calcite-components/src/components/button/usage/Basic.md b/packages/calcite-components/src/components/button/usage/Basic.md deleted file mode 100644 index ef029cd8c2a..00000000000 --- a/packages/calcite-components/src/components/button/usage/Basic.md +++ /dev/null @@ -1,3 +0,0 @@ -```html -Go! -``` diff --git a/packages/calcite-components/src/components/button/usage/Focusing.md b/packages/calcite-components/src/components/button/usage/Focusing.md deleted file mode 100644 index a154f86a91c..00000000000 --- a/packages/calcite-components/src/components/button/usage/Focusing.md +++ /dev/null @@ -1,5 +0,0 @@ -You can programmatically focus a `calcite-button` with the `setFocus()` method: - -```html -
Focus!
-``` diff --git a/packages/calcite-components/src/components/button/usage/Internals.md b/packages/calcite-components/src/components/button/usage/Internals.md deleted file mode 100644 index d53ce6307ef..00000000000 --- a/packages/calcite-components/src/components/button/usage/Internals.md +++ /dev/null @@ -1,9 +0,0 @@ -Any additional attributes set on `` are passed to the internal `` or `