From 62077416ea0fae2bb869a977eae632302bd061eb Mon Sep 17 00:00:00 2001 From: Maria Hutt Date: Thu, 27 Aug 2026 11:15:25 -0700 Subject: [PATCH 1/3] chore(deps): upgrade prettier to v3 --- _templates/playground/new/index.js | 2 +- docs/angular/overlays.md | 20 ++++++++++++---- docs/angular/zoneless.md | 6 +++-- docs/cli/configuration.md | 4 +--- docs/core-concepts/fundamentals.md | 2 +- .../what-are-progressive-web-apps.md | 2 +- docs/deployment/app-store.md | 2 +- .../guides/first-app-v3/intro.md | 12 +++++----- .../guides/first-app-v4/intro.md | 12 ++++------ docs/developing/tips.md | 4 +--- docs/index.md | 2 +- .../testing/unit-testing/best-practices.md | 4 ++-- docs/react/testing/unit-testing/examples.md | 4 ++-- docs/react/utility-functions.md | 2 +- docs/react/your-first-app.md | 2 +- docs/reference/glossary.md | 10 ++++---- docs/reference/support.md | 3 +++ docs/theming/basics.md | 2 +- docs/troubleshooting/native.md | 6 ++--- docs/vue/pwa.md | 2 +- docusaurus.config.js | 2 +- package-lock.json | 22 +++++++++-------- package.json | 4 ++-- .../index.js | 8 +++---- src/components/global/Playground/index.tsx | 12 +++++----- .../Playground/stackblitz.utils.spec.ts | 6 ++--- .../global/Playground/stackblitz.utils.ts | 24 +++++++++---------- .../global/PlaygroundTabs/index.tsx | 12 +++++----- .../page/reference/ReleaseNotes/index.tsx | 2 +- .../page/theming/ColorAccordion/index.tsx | 2 +- .../page/theming/ColorDot/index.tsx | 2 +- .../page/theming/ColorInput/index.tsx | 2 +- .../page/theming/InputWrapper/index.tsx | 2 +- .../theming/LayeredColorsSelect/index.tsx | 2 +- .../theming/SteppedColorGenerator/index.tsx | 2 +- src/utils/hooks.ts | 2 +- static/demos/api/action-sheet/index.html | 2 +- static/demos/api/alert/index.html | 2 +- static/demos/api/avatar/index.html | 2 +- static/demos/api/back-button/index.html | 6 ++--- static/demos/api/backdrop/index.html | 2 +- static/demos/api/badge/index.html | 2 +- static/demos/api/button/index.html | 2 +- static/demos/api/card/index.html | 2 +- static/demos/api/checkbox/index.html | 2 +- static/demos/api/chip/index.html | 2 +- static/demos/api/content/index.html | 2 +- static/demos/api/datetime/index.html | 2 +- static/demos/api/fab/index.html | 2 +- static/demos/api/grid/index.html | 2 +- static/demos/api/infinite-scroll/index.html | 2 +- static/demos/api/input/index.html | 2 +- static/demos/api/item/index.html | 2 +- static/demos/api/list/index.html | 2 +- static/demos/api/loading/index.html | 2 +- static/demos/api/menu/index.html | 2 +- static/demos/api/modal/index.html | 4 ++-- static/demos/api/nav/index.html | 8 +++---- static/demos/api/note/index.html | 2 +- static/demos/api/picker/index.html | 2 +- static/demos/api/popover/index.html | 4 ++-- static/demos/api/progress-bar/index.html | 2 +- static/demos/api/radio/index.html | 2 +- static/demos/api/range/index.html | 2 +- static/demos/api/refresher/index.html | 2 +- static/demos/api/reorder/index.html | 2 +- static/demos/api/router-link/index.html | 2 +- static/demos/api/searchbar/index.html | 2 +- static/demos/api/segment/index.html | 2 +- static/demos/api/select/index.html | 2 +- static/demos/api/skeleton-text/index.html | 2 +- static/demos/api/slides/index.html | 2 +- static/demos/api/spinner/index.html | 2 +- static/demos/api/tabs/index.html | 2 +- static/demos/api/text/index.html | 2 +- static/demos/api/thumbnail/index.html | 2 +- static/demos/api/toast/index.html | 2 +- static/demos/api/toggle/index.html | 2 +- static/demos/api/toolbar/index.html | 2 +- .../accessibility/animations/demo.html | 2 +- static/usage/v8/accordion/basic/demo.html | 2 +- .../advanced-expansion-styles/demo.html | 2 +- .../customization/expansion-styles/demo.html | 2 +- .../accordion/customization/icons/demo.html | 2 +- .../accordion/customization/theming/demo.html | 2 +- .../v8/accordion/disable/group/demo.html | 2 +- .../v8/accordion/disable/individual/demo.html | 2 +- .../angular/example_component_ts.md | 2 +- .../v8/accordion/listen-changes/demo.html | 6 ++--- .../v8/accordion/listen-changes/javascript.md | 2 +- .../v8/accordion/listen-changes/react.md | 2 +- .../usage/v8/accordion/listen-changes/vue.md | 2 +- static/usage/v8/accordion/multiple/demo.html | 2 +- .../v8/accordion/readonly/group/demo.html | 2 +- .../accordion/readonly/individual/demo.html | 2 +- static/usage/v8/accordion/toggle/demo.html | 2 +- .../v8/action-sheet/controller/demo.html | 2 +- .../v8/action-sheet/inline/isOpen/demo.html | 2 +- .../v8/action-sheet/inline/trigger/demo.html | 2 +- .../role-info-on-dismiss/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- .../v8/action-sheet/theming/styling/demo.html | 2 +- static/usage/v8/alert/buttons/demo.html | 2 +- static/usage/v8/alert/customization/demo.html | 2 +- static/usage/v8/alert/inputs/radios/demo.html | 2 +- .../v8/alert/inputs/text-inputs/demo.html | 2 +- .../v8/alert/presenting/controller/demo.html | 2 +- .../v8/alert/presenting/isOpen/demo.html | 2 +- .../v8/alert/presenting/trigger/demo.html | 2 +- static/usage/v8/animations/basic/demo.html | 2 +- .../before-and-after-hooks/demo.html | 2 +- static/usage/v8/animations/chain/demo.html | 2 +- .../gesture/angular/example_component_ts.md | 5 +++- static/usage/v8/animations/gesture/demo.html | 2 +- static/usage/v8/animations/group/demo.html | 2 +- .../usage/v8/animations/keyframes/demo.html | 2 +- .../v8/animations/modal-override/demo.html | 2 +- .../v8/animations/preference-based/demo.html | 2 +- static/usage/v8/app/set-focus/demo.html | 2 +- static/usage/v8/avatar/basic/demo.html | 2 +- static/usage/v8/avatar/chip/demo.html | 2 +- static/usage/v8/avatar/item/demo.html | 2 +- .../avatar/theming/css-properties/demo.html | 2 +- static/usage/v8/back-button/basic/demo.html | 2 +- static/usage/v8/back-button/custom/demo.html | 2 +- static/usage/v8/backdrop/basic/demo.html | 2 +- static/usage/v8/backdrop/styling/demo.html | 2 +- static/usage/v8/badge/basic/demo.html | 2 +- .../usage/v8/badge/inside-tab-bar/demo.html | 2 +- .../usage/v8/badge/theming/colors/demo.html | 2 +- .../v8/badge/theming/css-properties/demo.html | 2 +- static/usage/v8/breadcrumbs/basic/demo.html | 2 +- .../expand-on-click/demo.html | 2 +- .../items-before-after/demo.html | 2 +- .../collapsing-items/max-items/demo.html | 2 +- .../popover-on-click/demo.html | 2 +- .../icons/custom-separators/demo.html | 2 +- .../icons/icons-on-items/demo.html | 2 +- .../v8/breadcrumbs/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v8/button/basic/demo.html | 2 +- static/usage/v8/button/expand/demo.html | 2 +- static/usage/v8/button/fill/demo.html | 2 +- static/usage/v8/button/icons/demo.html | 2 +- static/usage/v8/button/shape/demo.html | 2 +- static/usage/v8/button/size/demo.html | 2 +- .../usage/v8/button/text-wrapping/demo.html | 2 +- .../usage/v8/button/theming/colors/demo.html | 2 +- .../button/theming/css-properties/demo.html | 2 +- static/usage/v8/buttons/basic/demo.html | 2 +- static/usage/v8/buttons/placement/demo.html | 2 +- static/usage/v8/buttons/types/demo.html | 2 +- static/usage/v8/card/basic/demo.html | 2 +- static/usage/v8/card/buttons/demo.html | 2 +- static/usage/v8/card/list/demo.html | 2 +- static/usage/v8/card/media/demo.html | 2 +- static/usage/v8/card/theming/colors/demo.html | 2 +- .../v8/card/theming/css-properties/demo.html | 2 +- static/usage/v8/checkbox/alignment/demo.html | 2 +- static/usage/v8/checkbox/basic/demo.html | 2 +- .../usage/v8/checkbox/helper-error/demo.html | 2 +- .../usage/v8/checkbox/indeterminate/demo.html | 2 +- static/usage/v8/checkbox/justify/demo.html | 2 +- static/usage/v8/checkbox/label-link/demo.html | 2 +- .../v8/checkbox/label-placement/demo.html | 2 +- .../checkbox/theming/css-properties/demo.html | 2 +- static/usage/v8/chip/basic/demo.html | 2 +- static/usage/v8/chip/slots/demo.html | 2 +- static/usage/v8/chip/theming/colors/demo.html | 2 +- .../v8/chip/theming/css-properties/demo.html | 2 +- static/usage/v8/common.js | 2 +- static/usage/v8/config/mode/demo.html | 2 +- static/usage/v8/content/basic/demo.html | 2 +- static/usage/v8/content/fixed/demo.html | 2 +- static/usage/v8/content/fullscreen/demo.html | 2 +- .../usage/v8/content/header-footer/demo.html | 2 +- .../usage/v8/content/scroll-events/demo.html | 2 +- .../usage/v8/content/scroll-methods/demo.html | 2 +- .../usage/v8/content/theming/colors/demo.html | 2 +- .../content/theming/css-properties/demo.html | 2 +- .../theming/css-shadow-parts/demo.html | 2 +- .../v8/content/theming/safe-area/demo.html | 2 +- .../usage/v8/datetime-button/basic/demo.html | 2 +- .../datetime-button/format-options/demo.html | 2 +- static/usage/v8/datetime/basic/demo.html | 2 +- .../customizing-button-texts/demo.html | 2 +- .../buttons/customizing-buttons/demo.html | 2 +- .../showing-confirmation-buttons/demo.html | 2 +- .../date-constraints/advanced/demo.html | 2 +- .../date-constraints/max-min/demo.html | 2 +- .../date-constraints/values/demo.html | 2 +- .../v8/datetime/format-options/demo.html | 2 +- .../datetime/highlightedDates/array/demo.html | 2 +- .../highlightedDates/callback/demo.html | 2 +- .../localization/custom-locale/demo.html | 2 +- .../localization/first-day-of-week/demo.html | 2 +- .../localization/hour-cycle/demo.html | 2 +- .../locale-extension-tags/demo.html | 2 +- .../localization/time-label/demo.html | 2 +- static/usage/v8/datetime/multiple/demo.html | 2 +- .../v8/datetime/presentation/date/demo.html | 2 +- .../presentation/month-and-year/demo.html | 2 +- .../v8/datetime/presentation/time/demo.html | 2 +- .../v8/datetime/presentation/wheel/demo.html | 2 +- .../v8/datetime/show-adjacent-days/demo.html | 2 +- .../datetime/styling/calendar-days/demo.html | 2 +- .../styling/calendar-header/demo.html | 2 +- .../styling/datetime-header/demo.html | 2 +- .../datetime/styling/global-theming/demo.html | 2 +- .../datetime/styling/wheel-styling/demo.html | 2 +- .../title/customizing-title/demo.html | 2 +- .../title/showing-default-title/demo.html | 2 +- static/usage/v8/fab/basic/demo.html | 2 +- static/usage/v8/fab/before-content/demo.html | 2 +- static/usage/v8/fab/button-sizing/demo.html | 2 +- static/usage/v8/fab/list-side/demo.html | 2 +- static/usage/v8/fab/positioning/demo.html | 2 +- static/usage/v8/fab/safe-area/demo.html | 2 +- static/usage/v8/fab/theming/colors/demo.html | 2 +- .../theming/css-custom-properties/demo.html | 2 +- .../angular/example_component_css.md | 4 +++- .../v8/fab/theming/css-shadow-parts/demo.html | 6 +++-- .../theming/css-shadow-parts/javascript.md | 4 +++- .../css-shadow-parts/javascript/index_html.md | 4 +++- .../css-shadow-parts/react/main_css.md | 4 +++- .../v8/fab/theming/css-shadow-parts/vue.md | 4 +++- static/usage/v8/footer/basic/demo.html | 2 +- .../v8/footer/custom-scroll-target/demo.html | 2 +- static/usage/v8/footer/fade/demo.html | 2 +- static/usage/v8/footer/no-border/demo.html | 2 +- static/usage/v8/footer/translucent/demo.html | 2 +- .../basic/angular/example_component_ts.md | 6 ++++- static/usage/v8/gestures/basic/demo.html | 2 +- .../angular/example_component_ts.md | 5 +++- .../usage/v8/gestures/double-click/demo.html | 2 +- static/usage/v8/grid/basic/demo.html | 2 +- .../grid/customizing/column-number/demo.html | 2 +- .../v8/grid/customizing/padding/demo.html | 2 +- .../usage/v8/grid/customizing/width/demo.html | 2 +- static/usage/v8/grid/fixed/demo.html | 2 +- .../v8/grid/horizontal-alignment/demo.html | 2 +- .../usage/v8/grid/offset-responsive/demo.html | 2 +- static/usage/v8/grid/offset/demo.html | 2 +- .../v8/grid/push-pull-responsive/demo.html | 2 +- static/usage/v8/grid/push-pull/demo.html | 2 +- static/usage/v8/grid/size-auto/demo.html | 2 +- .../usage/v8/grid/size-responsive/demo.html | 2 +- static/usage/v8/grid/size/demo.html | 2 +- .../v8/grid/vertical-alignment/demo.html | 2 +- static/usage/v8/header/basic/demo.html | 2 +- static/usage/v8/header/condense/demo.html | 2 +- .../v8/header/custom-scroll-target/demo.html | 2 +- static/usage/v8/header/fade/demo.html | 2 +- static/usage/v8/header/no-border/demo.html | 2 +- static/usage/v8/header/translucent/demo.html | 2 +- static/usage/v8/icon/basic/demo.html | 2 +- static/usage/v8/img/basic/demo.html | 2 +- .../usage/v8/infinite-scroll/basic/demo.html | 2 +- .../custom-infinite-scroll-content/demo.html | 2 +- .../infinite-scroll-content/demo.html | 2 +- static/usage/v8/input-otp/basic/demo.html | 2 +- static/usage/v8/input-otp/fill/demo.html | 2 +- static/usage/v8/input-otp/pattern/demo.html | 2 +- .../usage/v8/input-otp/separators/demo.html | 2 +- static/usage/v8/input-otp/shape/demo.html | 2 +- static/usage/v8/input-otp/size/demo.html | 2 +- static/usage/v8/input-otp/states/demo.html | 2 +- .../v8/input-otp/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v8/input-otp/type/demo.html | 2 +- .../v8/input-password-toggle/basic/demo.html | 2 +- static/usage/v8/input/basic/demo.html | 2 +- static/usage/v8/input/clear/demo.html | 2 +- .../v8/input/counter-alignment/demo.html | 2 +- static/usage/v8/input/counter/demo.html | 2 +- static/usage/v8/input/fill/demo.html | 2 +- static/usage/v8/input/filtering/demo.html | 2 +- static/usage/v8/input/helper-error/demo.html | 4 ++-- .../usage/v8/input/helper-error/javascript.md | 2 +- static/usage/v8/input/helper-error/react.md | 2 +- static/usage/v8/input/helper-error/vue.md | 2 +- .../usage/v8/input/label-placement/demo.html | 2 +- static/usage/v8/input/label-slot/demo.html | 2 +- static/usage/v8/input/mask/demo.html | 2 +- .../usage/v8/input/no-visible-label/demo.html | 2 +- static/usage/v8/input/set-focus/demo.html | 2 +- .../usage/v8/input/start-end-slots/demo.html | 2 +- .../usage/v8/input/theming/colors/demo.html | 2 +- .../v8/input/theming/css-properties/demo.html | 2 +- static/usage/v8/input/types/demo.html | 2 +- static/usage/v8/item-divider/basic/demo.html | 2 +- .../v8/item-divider/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v8/item-group/basic/demo.html | 2 +- .../v8/item-group/sliding-items/demo.html | 2 +- static/usage/v8/item-sliding/basic/demo.html | 2 +- .../v8/item-sliding/expandable/demo.html | 2 +- static/usage/v8/item-sliding/icons/demo.html | 2 +- static/usage/v8/item/basic/demo.html | 2 +- static/usage/v8/item/buttons/demo.html | 2 +- static/usage/v8/item/clickable/demo.html | 2 +- .../v8/item/content-types/actions/demo.html | 2 +- .../v8/item/content-types/controls/demo.html | 2 +- .../v8/item/content-types/metadata/demo.html | 2 +- .../supporting-visuals/demo.html | 2 +- .../v8/item/content-types/text/demo.html | 2 +- static/usage/v8/item/detail-arrows/demo.html | 2 +- static/usage/v8/item/inputs/demo.html | 2 +- static/usage/v8/item/lines/demo.html | 2 +- static/usage/v8/item/media/demo.html | 2 +- static/usage/v8/item/theming/colors/demo.html | 2 +- .../v8/item/theming/css-properties/demo.html | 2 +- .../item/theming/css-shadow-parts/demo.html | 2 +- .../v8/item/theming/input-highlight/demo.html | 2 +- .../usage/v8/keyboard/enterkeyhint/demo.html | 2 +- static/usage/v8/keyboard/inputmode/demo.html | 2 +- static/usage/v8/label/basic/demo.html | 2 +- static/usage/v8/label/input/demo.html | 2 +- static/usage/v8/label/item/demo.html | 2 +- .../usage/v8/label/theming/colors/demo.html | 2 +- .../v8/layout/dynamic-font-scaling/demo.html | 2 +- static/usage/v8/list-header/basic/demo.html | 2 +- static/usage/v8/list-header/buttons/demo.html | 2 +- static/usage/v8/list-header/lines/demo.html | 2 +- .../v8/list-header/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v8/list/basic/demo.html | 2 +- static/usage/v8/list/inset/demo.html | 2 +- static/usage/v8/list/lines/demo.html | 2 +- static/usage/v8/loading/controller/demo.html | 2 +- static/usage/v8/loading/inline/demo.html | 2 +- static/usage/v8/loading/spinners/demo.html | 2 +- static/usage/v8/loading/theming/demo.html | 2 +- static/usage/v8/menu/basic/demo.html | 2 +- static/usage/v8/menu/multiple/demo.html | 2 +- static/usage/v8/menu/sides/demo.html | 2 +- static/usage/v8/menu/theming/demo.html | 2 +- static/usage/v8/menu/toggle/demo.html | 2 +- static/usage/v8/menu/type/demo.html | 2 +- static/usage/v8/menu/type/react.md | 3 ++- .../v8/modal/can-dismiss/boolean/demo.html | 2 +- .../modal/can-dismiss/child-state/demo.html | 2 +- .../v8/modal/can-dismiss/function/demo.html | 2 +- .../prevent-swipe-to-close/demo.html | 2 +- static/usage/v8/modal/card/basic/demo.html | 2 +- static/usage/v8/modal/controller/demo.html | 2 +- .../usage/v8/modal/custom-dialogs/demo.html | 2 +- .../usage/v8/modal/drag-move-event/demo.html | 2 +- .../v8/modal/drag-start-end-events/demo.html | 2 +- static/usage/v8/modal/inline/basic/demo.html | 2 +- static/usage/v8/modal/inline/basic/react.md | 2 +- .../usage/v8/modal/inline/is-open/demo.html | 2 +- .../v8/modal/performance/mount/demo.html | 2 +- .../v8/modal/sheet/auto-height/demo.html | 2 +- .../modal/sheet/background-content/demo.html | 2 +- static/usage/v8/modal/sheet/basic/demo.html | 2 +- .../v8/modal/sheet/expand-to-scroll/demo.html | 2 +- .../v8/modal/sheet/handle-behavior/demo.html | 2 +- .../v8/modal/styling/animations/demo.html | 2 +- .../usage/v8/modal/styling/theming/demo.html | 2 +- .../usage/v8/nav/modal-navigation/demo.html | 2 +- static/usage/v8/nav/nav-link/demo.html | 2 +- static/usage/v8/note/basic/demo.html | 2 +- static/usage/v8/note/item/demo.html | 2 +- static/usage/v8/note/theming/colors/demo.html | 2 +- .../v8/note/theming/css-properties/demo.html | 2 +- .../v8/picker-legacy/controller/demo.html | 2 +- .../v8/picker-legacy/inline/isOpen/demo.html | 2 +- .../v8/picker-legacy/inline/trigger/demo.html | 2 +- .../picker-legacy/multiple-column/demo.html | 2 +- static/usage/v8/picker/basic/demo.html | 2 +- static/usage/v8/picker/modal/demo.html | 2 +- .../usage/v8/picker/prefix-suffix/demo.html | 2 +- .../picker/theming/css-properties/demo.html | 2 +- .../customization/positioning/demo.html | 2 +- .../v8/popover/customization/sizing/demo.html | 2 +- .../popover/customization/styling/demo.html | 2 +- static/usage/v8/popover/nested/demo.html | 2 +- .../v8/popover/performance/mount/demo.html | 2 +- .../popover/presenting/controller/demo.html | 2 +- .../presenting/inline-isopen/demo.html | 2 +- .../presenting/inline-trigger/demo.html | 2 +- static/usage/v8/progress-bar/buffer/demo.html | 2 +- .../v8/progress-bar/determinate/demo.html | 2 +- .../v8/progress-bar/indeterminate/demo.html | 2 +- .../v8/progress-bar/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- .../theming/css-shadow-parts/demo.html | 2 +- static/usage/v8/radio/alignment/demo.html | 2 +- static/usage/v8/radio/basic/demo.html | 2 +- .../usage/v8/radio/empty-selection/demo.html | 2 +- static/usage/v8/radio/helper-error/demo.html | 2 +- static/usage/v8/radio/justify/demo.html | 2 +- .../usage/v8/radio/label-placement/demo.html | 2 +- static/usage/v8/radio/label-wrap/demo.html | 2 +- .../usage/v8/radio/theming/colors/demo.html | 2 +- .../v8/radio/theming/css-properties/demo.html | 2 +- .../radio/theming/css-shadow-parts/demo.html | 2 +- .../v8/radio/using-comparewith/demo.html | 2 +- static/usage/v8/range/basic/demo.html | 2 +- static/usage/v8/range/dual-knobs/demo.html | 2 +- .../usage/v8/range/ion-change-event/demo.html | 2 +- .../v8/range/ion-knob-move-event/demo.html | 2 +- static/usage/v8/range/label-slot/demo.html | 2 +- static/usage/v8/range/labels/demo.html | 2 +- .../usage/v8/range/no-visible-label/demo.html | 2 +- static/usage/v8/range/pins/demo.html | 2 +- static/usage/v8/range/slots/demo.html | 2 +- .../usage/v8/range/snapping-ticks/demo.html | 2 +- .../v8/range/theming/css-properties/demo.html | 2 +- .../range/theming/css-shadow-parts/demo.html | 2 +- static/usage/v8/refresher/advanced/demo.html | 2 +- static/usage/v8/refresher/basic/demo.html | 2 +- .../v8/refresher/custom-content/demo.html | 2 +- .../refresher/custom-scroll-target/demo.html | 2 +- .../v8/refresher/pull-properties/demo.html | 2 +- .../refresher/pull-start-end-events/demo.html | 2 +- static/usage/v8/reorder/basic/demo.html | 2 +- static/usage/v8/reorder/custom-icon/demo.html | 2 +- .../v8/reorder/custom-scroll-target/demo.html | 2 +- .../v8/reorder/reorder-move-event/demo.html | 2 +- .../reorder-start-end-events/demo.html | 2 +- .../v8/reorder/toggling-disabled/demo.html | 2 +- .../usage/v8/reorder/updating-data/demo.html | 2 +- static/usage/v8/reorder/wrapper/demo.html | 2 +- static/usage/v8/ripple-effect/basic/demo.html | 2 +- .../v8/ripple-effect/customizing/demo.html | 2 +- static/usage/v8/ripple-effect/type/demo.html | 2 +- static/usage/v8/router/basic/demo.html | 2 +- static/usage/v8/searchbar/basic/demo.html | 2 +- .../v8/searchbar/cancel-button/demo.html | 2 +- .../usage/v8/searchbar/clear-button/demo.html | 2 +- static/usage/v8/searchbar/debounce/demo.html | 2 +- .../usage/v8/searchbar/search-icon/demo.html | 2 +- .../v8/searchbar/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- .../usage/v8/segment-button/basic/demo.html | 2 +- .../usage/v8/segment-button/layout/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- .../theming/css-shadow-parts/demo.html | 2 +- static/usage/v8/segment/basic/demo.html | 2 +- static/usage/v8/segment/scrollable/demo.html | 2 +- static/usage/v8/segment/swipeable/demo.html | 2 +- .../usage/v8/segment/theming/colors/demo.html | 2 +- .../segment/theming/css-properties/demo.html | 2 +- .../select/basic/multiple-selection/demo.html | 2 +- .../basic/responding-to-interaction/demo.html | 2 +- .../select/basic/single-selection/demo.html | 2 +- .../customization/button-text/demo.html | 2 +- .../custom-toggle-icons/demo.html | 2 +- .../icon-flip-behavior/demo.html | 2 +- .../customization/interface-options/demo.html | 2 +- .../customization/styling-select/demo.html | 2 +- static/usage/v8/select/fill/demo.html | 2 +- static/usage/v8/select/helper-error/demo.html | 2 +- .../select/interfaces/action-sheet/demo.html | 2 +- .../v8/select/interfaces/modal/demo.html | 2 +- .../v8/select/interfaces/popover/demo.html | 2 +- static/usage/v8/select/justify/demo.html | 2 +- .../usage/v8/select/label-placement/demo.html | 2 +- static/usage/v8/select/label-slot/demo.html | 2 +- .../v8/select/no-visible-label/demo.html | 2 +- .../multiple-selection/demo.html | 2 +- .../using-comparewith/demo.html | 2 +- .../usage/v8/select/start-end-slots/demo.html | 2 +- static/usage/v8/select/typeahead/demo.html | 2 +- .../react/typeahead_component_tsx.md | 2 +- static/usage/v8/skeleton-text/basic/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v8/spinner/basic/demo.html | 2 +- .../usage/v8/spinner/theming/colors/demo.html | 2 +- .../spinner/theming/css-properties/demo.html | 2 +- .../v8/spinner/theming/resizing/demo.html | 2 +- static/usage/v8/split-pane/basic/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v8/tabs/basic/demo.html | 2 +- static/usage/v8/tabs/router/demo.html | 2 +- static/usage/v8/tabs/select-method/demo.html | 2 +- static/usage/v8/text/basic/demo.html | 2 +- static/usage/v8/text/basic/react.md | 11 ++++++--- static/usage/v8/textarea/autogrow/demo.html | 2 +- static/usage/v8/textarea/basic/demo.html | 2 +- .../usage/v8/textarea/clear-on-edit/demo.html | 2 +- static/usage/v8/textarea/counter/demo.html | 2 +- static/usage/v8/textarea/fill/demo.html | 2 +- .../usage/v8/textarea/helper-error/demo.html | 4 ++-- .../v8/textarea/helper-error/javascript.md | 2 +- .../usage/v8/textarea/helper-error/react.md | 2 +- static/usage/v8/textarea/helper-error/vue.md | 2 +- .../v8/textarea/label-placement/demo.html | 2 +- static/usage/v8/textarea/label-slot/demo.html | 2 +- .../v8/textarea/no-visible-label/demo.html | 2 +- .../v8/textarea/start-end-slots/demo.html | 2 +- static/usage/v8/textarea/theming/demo.html | 2 +- .../v8/theming/always-dark-mode/demo.html | 2 +- .../always-high-contrast-mode/demo.html | 2 +- .../v8/theming/class-dark-mode/demo.html | 2 +- .../angular/example_component_ts.md | 2 +- .../class-high-contrast-mode/demo.html | 2 +- .../v8/theming/system-dark-mode/demo.html | 2 +- .../system-high-contrast-mode/demo.html | 2 +- static/usage/v8/thumbnail/basic/demo.html | 2 +- static/usage/v8/thumbnail/item/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v8/title/basic/demo.html | 2 +- .../collapsible-large-title/basic/demo.html | 2 +- .../collapsible-large-title/buttons/demo.html | 2 +- .../v8/title/theming/css-properties/demo.html | 2 +- static/usage/v8/toast/buttons/demo.html | 2 +- static/usage/v8/toast/icon/demo.html | 2 +- static/usage/v8/toast/inline/basic/demo.html | 2 +- .../usage/v8/toast/inline/is-open/demo.html | 2 +- static/usage/v8/toast/layout/demo.html | 2 +- .../usage/v8/toast/position-anchor/demo.html | 2 +- .../v8/toast/presenting/controller/demo.html | 2 +- static/usage/v8/toast/swipe-gesture/demo.html | 2 +- static/usage/v8/toast/theming/demo.html | 2 +- static/usage/v8/toggle/alignment/demo.html | 2 +- static/usage/v8/toggle/basic/demo.html | 2 +- static/usage/v8/toggle/helper-error/demo.html | 2 +- static/usage/v8/toggle/justify/demo.html | 2 +- .../usage/v8/toggle/label-placement/demo.html | 2 +- static/usage/v8/toggle/list/demo.html | 2 +- static/usage/v8/toggle/on-off/demo.html | 2 +- .../usage/v8/toggle/theming/colors/demo.html | 2 +- .../toggle/theming/css-properties/demo.html | 2 +- .../toggle/theming/css-shadow-parts/demo.html | 2 +- static/usage/v8/toolbar/basic/demo.html | 2 +- static/usage/v8/toolbar/buttons/demo.html | 2 +- .../usage/v8/toolbar/progress-bars/demo.html | 2 +- static/usage/v8/toolbar/searchbars/demo.html | 2 +- static/usage/v8/toolbar/segments/demo.html | 2 +- .../usage/v8/toolbar/theming/colors/demo.html | 2 +- .../toolbar/theming/css-properties/demo.html | 2 +- .../accessibility/animations/demo.html | 2 +- static/usage/v9/accordion/basic/demo.html | 2 +- .../advanced-expansion-styles/demo.html | 2 +- .../customization/expansion-styles/demo.html | 2 +- .../accordion/customization/icons/demo.html | 2 +- .../accordion/customization/theming/demo.html | 2 +- .../v9/accordion/disable/group/demo.html | 2 +- .../v9/accordion/disable/individual/demo.html | 2 +- .../angular/example_component_ts.md | 2 +- .../v9/accordion/listen-changes/demo.html | 6 ++--- .../v9/accordion/listen-changes/javascript.md | 2 +- .../v9/accordion/listen-changes/react.md | 2 +- .../usage/v9/accordion/listen-changes/vue.md | 2 +- static/usage/v9/accordion/multiple/demo.html | 2 +- .../v9/accordion/readonly/group/demo.html | 2 +- .../accordion/readonly/individual/demo.html | 2 +- static/usage/v9/accordion/toggle/demo.html | 2 +- .../v9/action-sheet/controller/demo.html | 2 +- .../v9/action-sheet/inline/isOpen/demo.html | 2 +- .../v9/action-sheet/inline/trigger/demo.html | 2 +- .../role-info-on-dismiss/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- .../v9/action-sheet/theming/styling/demo.html | 2 +- static/usage/v9/alert/buttons/demo.html | 2 +- static/usage/v9/alert/customization/demo.html | 2 +- static/usage/v9/alert/inputs/radios/demo.html | 2 +- .../v9/alert/inputs/text-inputs/demo.html | 2 +- .../v9/alert/presenting/controller/demo.html | 2 +- .../v9/alert/presenting/isOpen/demo.html | 2 +- .../v9/alert/presenting/trigger/demo.html | 2 +- static/usage/v9/animations/basic/demo.html | 2 +- .../before-and-after-hooks/demo.html | 2 +- static/usage/v9/animations/chain/demo.html | 2 +- .../gesture/angular/example_component_ts.md | 5 +++- static/usage/v9/animations/gesture/demo.html | 2 +- static/usage/v9/animations/group/demo.html | 2 +- .../usage/v9/animations/keyframes/demo.html | 2 +- .../v9/animations/modal-override/demo.html | 2 +- .../v9/animations/preference-based/demo.html | 2 +- static/usage/v9/app/set-focus/demo.html | 2 +- static/usage/v9/avatar/basic/demo.html | 2 +- static/usage/v9/avatar/chip/demo.html | 2 +- static/usage/v9/avatar/item/demo.html | 2 +- .../avatar/theming/css-properties/demo.html | 2 +- static/usage/v9/back-button/basic/demo.html | 2 +- static/usage/v9/back-button/custom/demo.html | 2 +- static/usage/v9/backdrop/basic/demo.html | 2 +- static/usage/v9/backdrop/styling/demo.html | 2 +- static/usage/v9/badge/basic/demo.html | 2 +- .../usage/v9/badge/inside-tab-bar/demo.html | 2 +- .../usage/v9/badge/theming/colors/demo.html | 2 +- .../v9/badge/theming/css-properties/demo.html | 2 +- static/usage/v9/breadcrumbs/basic/demo.html | 2 +- .../expand-on-click/demo.html | 2 +- .../items-before-after/demo.html | 2 +- .../collapsing-items/max-items/demo.html | 2 +- .../popover-on-click/demo.html | 2 +- .../icons/custom-separators/demo.html | 2 +- .../icons/icons-on-items/demo.html | 2 +- .../v9/breadcrumbs/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v9/button/basic/demo.html | 2 +- static/usage/v9/button/expand/demo.html | 2 +- static/usage/v9/button/fill/demo.html | 2 +- static/usage/v9/button/icons/demo.html | 2 +- static/usage/v9/button/shape/demo.html | 2 +- static/usage/v9/button/size/demo.html | 2 +- .../usage/v9/button/text-wrapping/demo.html | 2 +- .../usage/v9/button/theming/colors/demo.html | 2 +- .../button/theming/css-properties/demo.html | 2 +- static/usage/v9/buttons/basic/demo.html | 2 +- static/usage/v9/buttons/placement/demo.html | 2 +- static/usage/v9/buttons/types/demo.html | 2 +- static/usage/v9/card/basic/demo.html | 2 +- static/usage/v9/card/buttons/demo.html | 2 +- static/usage/v9/card/list/demo.html | 2 +- static/usage/v9/card/media/demo.html | 2 +- static/usage/v9/card/theming/colors/demo.html | 2 +- .../v9/card/theming/css-properties/demo.html | 2 +- static/usage/v9/checkbox/alignment/demo.html | 2 +- static/usage/v9/checkbox/basic/demo.html | 2 +- .../usage/v9/checkbox/helper-error/demo.html | 2 +- .../usage/v9/checkbox/indeterminate/demo.html | 2 +- static/usage/v9/checkbox/justify/demo.html | 2 +- static/usage/v9/checkbox/label-link/demo.html | 2 +- .../v9/checkbox/label-placement/demo.html | 2 +- .../checkbox/theming/css-properties/demo.html | 2 +- static/usage/v9/chip/basic/demo.html | 2 +- static/usage/v9/chip/slots/demo.html | 2 +- static/usage/v9/chip/theming/colors/demo.html | 2 +- .../v9/chip/theming/css-properties/demo.html | 2 +- static/usage/v9/common.js | 2 +- static/usage/v9/config/mode/demo.html | 2 +- static/usage/v9/content/basic/demo.html | 2 +- static/usage/v9/content/fixed/demo.html | 2 +- static/usage/v9/content/fullscreen/demo.html | 2 +- .../usage/v9/content/header-footer/demo.html | 2 +- .../usage/v9/content/scroll-events/demo.html | 2 +- .../usage/v9/content/scroll-methods/demo.html | 2 +- .../usage/v9/content/theming/colors/demo.html | 2 +- .../content/theming/css-properties/demo.html | 2 +- .../theming/css-shadow-parts/demo.html | 2 +- .../v9/content/theming/safe-area/demo.html | 2 +- .../usage/v9/datetime-button/basic/demo.html | 2 +- .../datetime-button/format-options/demo.html | 2 +- static/usage/v9/datetime/basic/demo.html | 2 +- .../customizing-button-texts/demo.html | 2 +- .../buttons/customizing-buttons/demo.html | 2 +- .../showing-confirmation-buttons/demo.html | 2 +- .../date-constraints/advanced/demo.html | 2 +- .../date-constraints/max-min/demo.html | 2 +- .../date-constraints/values/demo.html | 2 +- .../v9/datetime/format-options/demo.html | 2 +- .../datetime/highlightedDates/array/demo.html | 2 +- .../highlightedDates/callback/demo.html | 2 +- .../localization/custom-locale/demo.html | 2 +- .../localization/first-day-of-week/demo.html | 2 +- .../localization/hour-cycle/demo.html | 2 +- .../locale-extension-tags/demo.html | 2 +- .../localization/time-label/demo.html | 2 +- static/usage/v9/datetime/multiple/demo.html | 2 +- .../v9/datetime/presentation/date/demo.html | 2 +- .../presentation/month-and-year/demo.html | 2 +- .../v9/datetime/presentation/time/demo.html | 2 +- .../v9/datetime/presentation/wheel/demo.html | 2 +- .../v9/datetime/show-adjacent-days/demo.html | 2 +- .../datetime/styling/calendar-days/demo.html | 2 +- .../styling/calendar-header/demo.html | 2 +- .../styling/datetime-header/demo.html | 2 +- .../datetime/styling/global-theming/demo.html | 2 +- .../datetime/styling/wheel-styling/demo.html | 2 +- .../title/customizing-title/demo.html | 2 +- .../title/showing-default-title/demo.html | 2 +- static/usage/v9/fab/basic/demo.html | 2 +- static/usage/v9/fab/before-content/demo.html | 2 +- static/usage/v9/fab/button-sizing/demo.html | 2 +- static/usage/v9/fab/list-side/demo.html | 2 +- static/usage/v9/fab/positioning/demo.html | 2 +- static/usage/v9/fab/safe-area/demo.html | 2 +- static/usage/v9/fab/theming/colors/demo.html | 2 +- .../theming/css-custom-properties/demo.html | 2 +- .../angular/example_component_css.md | 4 +++- .../v9/fab/theming/css-shadow-parts/demo.html | 6 +++-- .../theming/css-shadow-parts/javascript.md | 4 +++- .../css-shadow-parts/javascript/index_html.md | 4 +++- .../css-shadow-parts/react/main_css.md | 4 +++- .../v9/fab/theming/css-shadow-parts/vue.md | 4 +++- static/usage/v9/footer/basic/demo.html | 2 +- .../v9/footer/custom-scroll-target/demo.html | 2 +- static/usage/v9/footer/fade/demo.html | 2 +- static/usage/v9/footer/no-border/demo.html | 2 +- static/usage/v9/footer/translucent/demo.html | 2 +- .../basic/angular/example_component_ts.md | 6 ++++- static/usage/v9/gestures/basic/demo.html | 2 +- .../angular/example_component_ts.md | 5 +++- .../usage/v9/gestures/double-click/demo.html | 2 +- static/usage/v9/grid/basic/demo.html | 2 +- .../grid/customizing/column-number/demo.html | 2 +- .../v9/grid/customizing/padding/demo.html | 2 +- .../usage/v9/grid/customizing/width/demo.html | 2 +- static/usage/v9/grid/fixed/demo.html | 2 +- .../v9/grid/horizontal-alignment/demo.html | 2 +- .../usage/v9/grid/offset-responsive/demo.html | 2 +- static/usage/v9/grid/offset/demo.html | 2 +- .../v9/grid/push-pull-responsive/demo.html | 2 +- static/usage/v9/grid/push-pull/demo.html | 2 +- static/usage/v9/grid/size-auto/demo.html | 2 +- .../usage/v9/grid/size-responsive/demo.html | 2 +- static/usage/v9/grid/size/demo.html | 2 +- .../v9/grid/vertical-alignment/demo.html | 2 +- static/usage/v9/header/basic/demo.html | 2 +- static/usage/v9/header/condense/demo.html | 2 +- .../v9/header/custom-scroll-target/demo.html | 2 +- static/usage/v9/header/fade/demo.html | 2 +- static/usage/v9/header/no-border/demo.html | 2 +- static/usage/v9/header/translucent/demo.html | 2 +- static/usage/v9/icon/basic/demo.html | 2 +- static/usage/v9/icon/custom-svgs/demo.html | 2 +- static/usage/v9/icon/font-icons/demo.html | 2 +- static/usage/v9/img/basic/demo.html | 2 +- .../usage/v9/infinite-scroll/basic/demo.html | 2 +- .../custom-infinite-scroll-content/demo.html | 2 +- .../infinite-scroll-content/demo.html | 2 +- static/usage/v9/input-otp/basic/demo.html | 2 +- static/usage/v9/input-otp/fill/demo.html | 2 +- static/usage/v9/input-otp/pattern/demo.html | 2 +- .../usage/v9/input-otp/separators/demo.html | 2 +- static/usage/v9/input-otp/shape/demo.html | 2 +- static/usage/v9/input-otp/size/demo.html | 2 +- static/usage/v9/input-otp/states/demo.html | 2 +- .../v9/input-otp/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v9/input-otp/type/demo.html | 2 +- .../v9/input-password-toggle/basic/demo.html | 2 +- static/usage/v9/input/basic/demo.html | 2 +- static/usage/v9/input/clear/demo.html | 2 +- .../v9/input/counter-alignment/demo.html | 2 +- static/usage/v9/input/counter/demo.html | 2 +- static/usage/v9/input/fill/demo.html | 2 +- static/usage/v9/input/filtering/demo.html | 2 +- static/usage/v9/input/helper-error/demo.html | 4 ++-- .../usage/v9/input/helper-error/javascript.md | 2 +- static/usage/v9/input/helper-error/react.md | 2 +- static/usage/v9/input/helper-error/vue.md | 2 +- .../usage/v9/input/label-placement/demo.html | 2 +- static/usage/v9/input/label-slot/demo.html | 2 +- static/usage/v9/input/mask/demo.html | 2 +- .../usage/v9/input/no-visible-label/demo.html | 2 +- static/usage/v9/input/set-focus/demo.html | 2 +- .../usage/v9/input/start-end-slots/demo.html | 2 +- .../usage/v9/input/theming/colors/demo.html | 2 +- .../v9/input/theming/css-properties/demo.html | 2 +- static/usage/v9/input/types/demo.html | 2 +- static/usage/v9/item-divider/basic/demo.html | 2 +- .../v9/item-divider/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v9/item-group/basic/demo.html | 2 +- .../v9/item-group/sliding-items/demo.html | 2 +- static/usage/v9/item-sliding/basic/demo.html | 2 +- .../v9/item-sliding/expandable/demo.html | 2 +- static/usage/v9/item-sliding/icons/demo.html | 2 +- static/usage/v9/item/basic/demo.html | 2 +- static/usage/v9/item/buttons/demo.html | 2 +- static/usage/v9/item/clickable/demo.html | 2 +- .../v9/item/content-types/actions/demo.html | 2 +- .../v9/item/content-types/controls/demo.html | 2 +- .../v9/item/content-types/metadata/demo.html | 2 +- .../supporting-visuals/demo.html | 2 +- .../v9/item/content-types/text/demo.html | 2 +- static/usage/v9/item/detail-arrows/demo.html | 2 +- static/usage/v9/item/inputs/demo.html | 2 +- static/usage/v9/item/lines/demo.html | 2 +- static/usage/v9/item/media/demo.html | 2 +- static/usage/v9/item/theming/colors/demo.html | 2 +- .../v9/item/theming/css-properties/demo.html | 2 +- .../item/theming/css-shadow-parts/demo.html | 2 +- .../v9/item/theming/input-highlight/demo.html | 2 +- .../usage/v9/keyboard/enterkeyhint/demo.html | 2 +- static/usage/v9/keyboard/inputmode/demo.html | 2 +- static/usage/v9/label/basic/demo.html | 2 +- static/usage/v9/label/input/demo.html | 2 +- static/usage/v9/label/item/demo.html | 2 +- .../usage/v9/label/theming/colors/demo.html | 2 +- .../v9/layout/dynamic-font-scaling/demo.html | 2 +- static/usage/v9/list-header/basic/demo.html | 2 +- static/usage/v9/list-header/buttons/demo.html | 2 +- static/usage/v9/list-header/lines/demo.html | 2 +- .../v9/list-header/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v9/list/basic/demo.html | 2 +- static/usage/v9/list/inset/demo.html | 2 +- static/usage/v9/list/lines/demo.html | 2 +- static/usage/v9/loading/controller/demo.html | 2 +- static/usage/v9/loading/inline/demo.html | 2 +- static/usage/v9/loading/spinners/demo.html | 2 +- static/usage/v9/loading/theming/demo.html | 2 +- static/usage/v9/menu/basic/demo.html | 2 +- static/usage/v9/menu/multiple/demo.html | 2 +- static/usage/v9/menu/sides/demo.html | 2 +- static/usage/v9/menu/theming/demo.html | 2 +- static/usage/v9/menu/toggle/demo.html | 2 +- static/usage/v9/menu/type/demo.html | 2 +- static/usage/v9/menu/type/react.md | 3 ++- .../v9/modal/can-dismiss/boolean/demo.html | 2 +- .../modal/can-dismiss/child-state/demo.html | 2 +- .../v9/modal/can-dismiss/function/demo.html | 2 +- .../prevent-swipe-to-close/demo.html | 2 +- static/usage/v9/modal/card/basic/demo.html | 2 +- static/usage/v9/modal/controller/demo.html | 2 +- .../usage/v9/modal/custom-dialogs/demo.html | 2 +- .../usage/v9/modal/drag-move-event/demo.html | 2 +- .../v9/modal/drag-start-end-events/demo.html | 2 +- static/usage/v9/modal/inline/basic/demo.html | 2 +- static/usage/v9/modal/inline/basic/react.md | 2 +- .../usage/v9/modal/inline/is-open/demo.html | 2 +- .../v9/modal/performance/mount/demo.html | 2 +- .../v9/modal/sheet/auto-height/demo.html | 2 +- .../modal/sheet/background-content/demo.html | 2 +- static/usage/v9/modal/sheet/basic/demo.html | 2 +- .../v9/modal/sheet/expand-to-scroll/demo.html | 2 +- .../v9/modal/sheet/handle-behavior/demo.html | 2 +- .../v9/modal/styling/animations/demo.html | 2 +- .../usage/v9/modal/styling/theming/demo.html | 2 +- .../usage/v9/nav/modal-navigation/demo.html | 2 +- static/usage/v9/nav/nav-link/demo.html | 2 +- static/usage/v9/navigation/demo.html | 2 +- static/usage/v9/note/basic/demo.html | 2 +- static/usage/v9/note/item/demo.html | 2 +- static/usage/v9/note/theming/colors/demo.html | 2 +- .../v9/note/theming/css-properties/demo.html | 2 +- static/usage/v9/picker/basic/demo.html | 2 +- static/usage/v9/picker/modal/demo.html | 2 +- .../usage/v9/picker/prefix-suffix/demo.html | 2 +- .../picker/theming/css-properties/demo.html | 2 +- .../customization/positioning/demo.html | 2 +- .../v9/popover/customization/sizing/demo.html | 2 +- .../popover/customization/styling/demo.html | 2 +- static/usage/v9/popover/nested/demo.html | 2 +- .../v9/popover/performance/mount/demo.html | 2 +- .../popover/presenting/controller/demo.html | 2 +- .../presenting/inline-isopen/demo.html | 2 +- .../presenting/inline-trigger/demo.html | 2 +- static/usage/v9/progress-bar/buffer/demo.html | 2 +- .../v9/progress-bar/determinate/demo.html | 2 +- .../v9/progress-bar/indeterminate/demo.html | 2 +- .../v9/progress-bar/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- .../theming/css-shadow-parts/demo.html | 2 +- static/usage/v9/radio/alignment/demo.html | 2 +- static/usage/v9/radio/basic/demo.html | 2 +- .../usage/v9/radio/empty-selection/demo.html | 2 +- static/usage/v9/radio/helper-error/demo.html | 2 +- static/usage/v9/radio/justify/demo.html | 2 +- .../usage/v9/radio/label-placement/demo.html | 2 +- static/usage/v9/radio/label-wrap/demo.html | 2 +- .../usage/v9/radio/theming/colors/demo.html | 2 +- .../v9/radio/theming/css-properties/demo.html | 2 +- .../radio/theming/css-shadow-parts/demo.html | 2 +- .../v9/radio/using-comparewith/demo.html | 2 +- static/usage/v9/range/basic/demo.html | 2 +- static/usage/v9/range/dual-knobs/demo.html | 2 +- .../usage/v9/range/ion-change-event/demo.html | 2 +- .../v9/range/ion-knob-move-event/demo.html | 2 +- static/usage/v9/range/label-slot/demo.html | 2 +- static/usage/v9/range/labels/demo.html | 2 +- .../usage/v9/range/no-visible-label/demo.html | 2 +- static/usage/v9/range/pins/demo.html | 2 +- static/usage/v9/range/slots/demo.html | 2 +- .../usage/v9/range/snapping-ticks/demo.html | 2 +- .../v9/range/theming/css-properties/demo.html | 2 +- .../range/theming/css-shadow-parts/demo.html | 2 +- static/usage/v9/refresher/advanced/demo.html | 2 +- static/usage/v9/refresher/basic/demo.html | 2 +- .../v9/refresher/custom-content/demo.html | 2 +- .../refresher/custom-scroll-target/demo.html | 2 +- .../v9/refresher/pull-properties/demo.html | 2 +- .../refresher/pull-start-end-events/demo.html | 2 +- static/usage/v9/reorder/basic/demo.html | 2 +- static/usage/v9/reorder/custom-icon/demo.html | 2 +- .../v9/reorder/custom-scroll-target/demo.html | 2 +- .../v9/reorder/reorder-move-event/demo.html | 2 +- .../reorder-start-end-events/demo.html | 2 +- .../v9/reorder/toggling-disabled/demo.html | 2 +- .../usage/v9/reorder/updating-data/demo.html | 2 +- static/usage/v9/reorder/wrapper/demo.html | 2 +- static/usage/v9/ripple-effect/basic/demo.html | 2 +- .../v9/ripple-effect/customizing/demo.html | 2 +- static/usage/v9/ripple-effect/type/demo.html | 2 +- static/usage/v9/router/basic/demo.html | 2 +- .../usage/v9/router/nav-within-page/demo.html | 2 +- static/usage/v9/searchbar/basic/demo.html | 2 +- .../v9/searchbar/cancel-button/demo.html | 2 +- .../usage/v9/searchbar/clear-button/demo.html | 2 +- static/usage/v9/searchbar/debounce/demo.html | 2 +- .../usage/v9/searchbar/search-icon/demo.html | 2 +- .../v9/searchbar/theming/colors/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- .../usage/v9/segment-button/basic/demo.html | 2 +- .../usage/v9/segment-button/layout/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- .../theming/css-shadow-parts/demo.html | 2 +- static/usage/v9/segment/basic/demo.html | 2 +- static/usage/v9/segment/scrollable/demo.html | 2 +- static/usage/v9/segment/swipeable/demo.html | 2 +- .../usage/v9/segment/theming/colors/demo.html | 2 +- .../segment/theming/css-properties/demo.html | 2 +- .../select/basic/multiple-selection/demo.html | 2 +- .../basic/responding-to-interaction/demo.html | 2 +- .../select/basic/single-selection/demo.html | 2 +- .../customization/button-text/demo.html | 2 +- .../custom-toggle-icons/demo.html | 2 +- .../icon-flip-behavior/demo.html | 2 +- .../customization/interface-options/demo.html | 2 +- .../customization/styling-select/demo.html | 2 +- static/usage/v9/select/fill/demo.html | 2 +- static/usage/v9/select/helper-error/demo.html | 2 +- .../select/interfaces/action-sheet/demo.html | 2 +- .../v9/select/interfaces/modal/demo.html | 2 +- .../v9/select/interfaces/popover/demo.html | 2 +- static/usage/v9/select/justify/demo.html | 2 +- .../usage/v9/select/label-placement/demo.html | 2 +- static/usage/v9/select/label-slot/demo.html | 2 +- .../v9/select/no-visible-label/demo.html | 2 +- .../multiple-selection/demo.html | 2 +- .../using-comparewith/demo.html | 2 +- .../v9/select/rich-content-options/demo.html | 2 +- .../usage/v9/select/start-end-slots/demo.html | 2 +- static/usage/v9/select/typeahead/demo.html | 2 +- .../react/typeahead_component_tsx.md | 2 +- static/usage/v9/skeleton-text/basic/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v9/spinner/basic/demo.html | 2 +- .../usage/v9/spinner/theming/colors/demo.html | 2 +- .../spinner/theming/css-properties/demo.html | 2 +- .../v9/spinner/theming/resizing/demo.html | 2 +- static/usage/v9/split-pane/basic/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v9/tabs/basic/demo.html | 2 +- static/usage/v9/tabs/router/demo.html | 2 +- static/usage/v9/tabs/select-method/demo.html | 2 +- static/usage/v9/text/basic/demo.html | 2 +- static/usage/v9/text/basic/react.md | 11 ++++++--- static/usage/v9/textarea/autogrow/demo.html | 2 +- static/usage/v9/textarea/basic/demo.html | 2 +- .../usage/v9/textarea/clear-on-edit/demo.html | 2 +- static/usage/v9/textarea/counter/demo.html | 2 +- static/usage/v9/textarea/fill/demo.html | 2 +- .../usage/v9/textarea/helper-error/demo.html | 4 ++-- .../v9/textarea/helper-error/javascript.md | 2 +- .../usage/v9/textarea/helper-error/react.md | 2 +- static/usage/v9/textarea/helper-error/vue.md | 2 +- .../v9/textarea/label-placement/demo.html | 2 +- static/usage/v9/textarea/label-slot/demo.html | 2 +- .../v9/textarea/no-visible-label/demo.html | 2 +- .../v9/textarea/start-end-slots/demo.html | 2 +- static/usage/v9/textarea/theming/demo.html | 2 +- .../v9/theming/always-dark-mode/demo.html | 2 +- .../always-high-contrast-mode/demo.html | 2 +- .../v9/theming/class-dark-mode/demo.html | 2 +- .../angular/example_component_ts.md | 2 +- .../class-high-contrast-mode/demo.html | 2 +- .../v9/theming/system-dark-mode/demo.html | 2 +- .../system-high-contrast-mode/demo.html | 2 +- static/usage/v9/thumbnail/basic/demo.html | 2 +- static/usage/v9/thumbnail/item/demo.html | 2 +- .../theming/css-properties/demo.html | 2 +- static/usage/v9/title/basic/demo.html | 2 +- .../collapsible-large-title/basic/demo.html | 2 +- .../collapsible-large-title/buttons/demo.html | 2 +- .../v9/title/theming/css-properties/demo.html | 2 +- static/usage/v9/toast/buttons/demo.html | 2 +- static/usage/v9/toast/icon/demo.html | 2 +- static/usage/v9/toast/inline/basic/demo.html | 2 +- .../usage/v9/toast/inline/is-open/demo.html | 2 +- static/usage/v9/toast/layout/demo.html | 2 +- .../usage/v9/toast/position-anchor/demo.html | 2 +- .../v9/toast/presenting/controller/demo.html | 2 +- static/usage/v9/toast/swipe-gesture/demo.html | 2 +- static/usage/v9/toast/theming/demo.html | 2 +- static/usage/v9/toggle/alignment/demo.html | 2 +- static/usage/v9/toggle/basic/demo.html | 2 +- static/usage/v9/toggle/helper-error/demo.html | 2 +- static/usage/v9/toggle/justify/demo.html | 2 +- .../usage/v9/toggle/label-placement/demo.html | 2 +- static/usage/v9/toggle/list/demo.html | 2 +- static/usage/v9/toggle/on-off/demo.html | 2 +- .../usage/v9/toggle/theming/colors/demo.html | 2 +- .../toggle/theming/css-properties/demo.html | 2 +- .../toggle/theming/css-shadow-parts/demo.html | 2 +- static/usage/v9/toolbar/basic/demo.html | 2 +- static/usage/v9/toolbar/buttons/demo.html | 2 +- .../usage/v9/toolbar/progress-bars/demo.html | 2 +- static/usage/v9/toolbar/searchbars/demo.html | 2 +- static/usage/v9/toolbar/segments/demo.html | 2 +- .../usage/v9/toolbar/theming/colors/demo.html | 2 +- .../toolbar/theming/css-properties/demo.html | 2 +- versioned_docs/version-v8/angular/overlays.md | 20 ++++++++++++---- .../angular/your-first-app/7-live-reload.md | 5 +++- .../version-v8/cli/configuration.md | 4 +--- .../version-v8/core-concepts/fundamentals.md | 2 +- .../what-are-progressive-web-apps.md | 2 +- .../version-v8/deployment/app-store.md | 2 +- .../guides/first-app-v3/intro.md | 12 +++++----- .../guides/first-app-v4/intro.md | 12 ++++------ versioned_docs/version-v8/developing/tips.md | 4 +--- versioned_docs/version-v8/index.md | 2 +- versioned_docs/version-v8/react/navigation.md | 9 ++++--- .../testing/unit-testing/best-practices.md | 4 ++-- .../react/testing/unit-testing/examples.md | 4 ++-- .../version-v8/react/your-first-app.md | 2 +- .../version-v8/reference/glossary.md | 10 ++++---- .../version-v8/reference/support.md | 2 ++ versioned_docs/version-v8/theming/basics.md | 2 +- .../version-v8/troubleshooting/native.md | 6 ++--- versioned_docs/version-v8/vue/pwa.md | 2 +- 1009 files changed, 1200 insertions(+), 1121 deletions(-) diff --git a/_templates/playground/new/index.js b/_templates/playground/new/index.js index c298b870b2d..daf2b3c86e5 100644 --- a/_templates/playground/new/index.js +++ b/_templates/playground/new/index.js @@ -72,7 +72,7 @@ module.exports = { const playgroundName = changeCase.pascal(answers.path.split('/').pop()); console.log( - `\nTo use this playground in a docs markdown file, include\nthe following:\n\n## ${playgroundName}\n\nimport ${playgroundName} from '@site/static/usage/v${answers.version}/${answers.name}/${answers.path}/index.mdx';\n\n<${playgroundName} />\n` + `\nTo use this playground in a docs markdown file, include\nthe following:\n\n## ${playgroundName}\n\nimport ${playgroundName} from '@site/static/usage/v${answers.version}/${answers.name}/${answers.path}/index.mdx';\n\n<${playgroundName} />\n`, ); return answers; diff --git a/docs/angular/overlays.md b/docs/angular/overlays.md index 911063b5362..010530bc5ea 100644 --- a/docs/angular/overlays.md +++ b/docs/angular/overlays.md @@ -71,7 +71,10 @@ import { MyRouteService } from './my-route.service'; providers: [MyRouteService], // Service provided at route level }) export class FeatureComponent { - constructor(private modalController: ModalController, private injector: Injector) {} + constructor( + private modalController: ModalController, + private injector: Injector, + ) {} async openModal() { const modal = await this.modalController.create({ @@ -113,7 +116,10 @@ import { MyService } from './my.service'; templateUrl: './feature.component.html', }) export class FeatureComponent { - constructor(private modalController: ModalController, private injector: Injector) {} + constructor( + private modalController: ModalController, + private injector: Injector, + ) {} async openModal() { const myService = new MyService(); @@ -148,7 +154,10 @@ import { MyModalComponent } from './my-modal.component'; templateUrl: './feature.component.html', }) export class FeatureComponent { - constructor(private modalController: ModalController, private injector: Injector) {} + constructor( + private modalController: ModalController, + private injector: Injector, + ) {} async openModal() { const modal = await this.modalController.create({ @@ -174,7 +183,10 @@ import { MyPopoverComponent } from './my-popover.component'; templateUrl: './feature.component.html', }) export class FeatureComponent { - constructor(private popoverController: PopoverController, private injector: Injector) {} + constructor( + private popoverController: PopoverController, + private injector: Injector, + ) {} async openPopover(event: Event) { const popover = await this.popoverController.create({ diff --git a/docs/angular/zoneless.md b/docs/angular/zoneless.md index bbcb5031ab5..890522f268b 100644 --- a/docs/angular/zoneless.md +++ b/docs/angular/zoneless.md @@ -81,7 +81,9 @@ import { ChangeDetectorRef, Component, inject } from '@angular/core'; @Component({ selector: 'app-list', - template: `@for (item of items; track item) { {{ item }} }`, + template: `@for (item of items; track item) { + {{ item }} +}`, }) export class ListPage { private cdr = inject(ChangeDetectorRef); @@ -113,7 +115,7 @@ Content projected into an inline `ion-modal` or `ion-popover` follows the same r @for (item of items(); track item) { - {{ item }} + {{ item }} } diff --git a/docs/cli/configuration.md b/docs/cli/configuration.md index 708c5388f03..3fe6ae94d0a 100644 --- a/docs/cli/configuration.md +++ b/docs/cli/configuration.md @@ -117,9 +117,7 @@ module.exports = function (ctx) { ## Multi-app Projects - - Available in CLI 6.2.0+ - +_Available in CLI 6.2.0+_ The Ionic CLI supports a multi-app configuration setup, which involves multiple Ionic apps and shared code within a single repository, or [monorepo](../reference/glossary.md#monorepo). diff --git a/docs/core-concepts/fundamentals.md b/docs/core-concepts/fundamentals.md index f8fd446013b..8f4772ac565 100644 --- a/docs/core-concepts/fundamentals.md +++ b/docs/core-concepts/fundamentals.md @@ -38,7 +38,7 @@ For apps that are built with Angular and `@ionic/angular`, we recommend using th An amazing feature of apps built with web technologies (such as Ionic apps!) is that it can run on virtually any platform: desktop computers, phones, tablets, cars, refrigerators, and more! The same code base for Ionic apps can work on many platforms because it is based on web standards and common APIs that are shared across these platforms. -One of the most common use cases for Ionic is to build an app which can be downloaded from both the [App Store](https://www.apple.com/ios/app-store/) and [Play Store](https://play.google.com/). Both iOS and Android software development kits (SDKs) provide [Web Views](webview.md) which render any Ionic app, while still allowing for full Native SDK access. +One of the most common use cases for Ionic is to build an app which can be downloaded from both the [App Store](https://www.apple.com/ios/app-store/) and [Play Store](https://play.google.com/). Both iOS and Android software development kits (SDKs) provide [Web Views](webview.md) which render any Ionic app, while still allowing for _full_ Native SDK access. Projects such as [Capacitor](https://capacitorjs.com/) and [Cordova](https://cordova.apache.org/) are commonly used to give Ionic apps this access to Native SDKs. This means developers can quickly build out an app using common web development tools, and still have access to native features such as the device's accelerometer, camera, GPS, and more. diff --git a/docs/core-concepts/what-are-progressive-web-apps.md b/docs/core-concepts/what-are-progressive-web-apps.md index f9643cb087d..551e81f8709 100644 --- a/docs/core-concepts/what-are-progressive-web-apps.md +++ b/docs/core-concepts/what-are-progressive-web-apps.md @@ -47,7 +47,7 @@ To be considered a Progressive Web App, your app must be: {/* cspell:disable */} -[Addy Osmani: Progressive web apps](https://addyosmani.com/blog/getting-started-with-progressive-web-apps/) +_[Addy Osmani: Progressive web apps](https://addyosmani.com/blog/getting-started-with-progressive-web-apps/)_ {/* cspell:enable */} diff --git a/docs/deployment/app-store.md b/docs/deployment/app-store.md index b4c3120479e..e421c1902e3 100644 --- a/docs/deployment/app-store.md +++ b/docs/deployment/app-store.md @@ -116,7 +116,7 @@ If the upload is successful the app should be listed under 'Activities' on [iTun As an app grows, it will need to be updated with new features and fixes. An app can be updated by either submitting a new version to Apple, or by using a live update service like Appflow's [live update feature](https://ionic.io/docs/appflow/deploy/intro). -With Live Updates, app changes can be pushed in realtime directly to users from the Appflow dashboard, without waiting for App Store approvals. +With **Live Updates**, app changes can be pushed in realtime directly to users from the Appflow dashboard, without waiting for App Store approvals. :::note In order for the iOS App Store to accept the updated build, the config.xml file will need to be edited to increment the version value, then rebuild the app for release following the same instructions above. diff --git a/docs/developer-resources/guides/first-app-v3/intro.md b/docs/developer-resources/guides/first-app-v3/intro.md index 898b2122970..76a92a638ee 100644 --- a/docs/developer-resources/guides/first-app-v3/intro.md +++ b/docs/developer-resources/guides/first-app-v3/intro.md @@ -28,27 +28,27 @@ ionic start photo-gallery tabs This starter project comes complete with three pre-built pages and best practices for Ionic development. With common building blocks already in place, we can add more features easily! -“Would you like to integrate your new app with Cordova to target native iOS and Android?” +**“Would you like to integrate your new app with Cordova to target native iOS and Android?”** Type “y” and press Enter. Project setup may take a few moments. -“Install the free Appflow SDK and connect your app?” +**“Install the free Appflow SDK and connect your app?”** Type “y” and press Enter. [Appflow](https://ionicframework.com/pro) is a powerful set of services and features built on top of the flagship Ionic Framework. This includes updating your app instantly (skipping the app store review process!), packaging apps in the cloud, and error monitoring. -Log into your Ionic Account +**Log into your Ionic Account** Sign in now to easily access awesome features like Live Deploys later in this tutorial. -What would you like to do? +**What would you like to do?** Choose “Create a new app on Appflow.” -Which git host would you like to use? +**Which git host would you like to use?** Choose “Appflow.” -“How would you like to connect to Appflow?” +**“How would you like to connect to Appflow?”** - Choose “Automatically setup a new SSH key pair for Appflow” if you haven’t used SSH before. - Choose “Use an existing SSH key pair” if you’ve used SSH before. diff --git a/docs/developer-resources/guides/first-app-v4/intro.md b/docs/developer-resources/guides/first-app-v4/intro.md index d7e9e1112ba..1988676ba8f 100644 --- a/docs/developer-resources/guides/first-app-v4/intro.md +++ b/docs/developer-resources/guides/first-app-v4/intro.md @@ -11,13 +11,11 @@ It’s easy to get started. Note that all code referenced in this guide can be [ Download/install these right away to ensure an optimal Ionic development experience: - [Git](https://git-scm.com/downloads) for version control. -- SSH client, such as [PuTTy](https://putty.software/), for secure login to Appflow. -- Node.js for interacting with the Ionic ecosystem. [Download the LTS version](https://nodejs.org/en/). -- A code editor for... writing code! We are fans of [Visual Studio Code](https://code.visualstudio.com/). -- Command-line terminal (CLI): FYI Windows users, for the best Ionic experience, we - recommend the built-in command line (cmd) or the Powershell CLI, running in Administrator mode. For - Mac/Linux - users, virtually any terminal will work. +- **SSH client**, such as [PuTTy](https://putty.software/), for secure login to Appflow. +- **Node.js** for interacting with the Ionic ecosystem. [Download the LTS version](https://nodejs.org/en/). +- **A code editor** for... writing code! We are fans of [Visual Studio Code](https://code.visualstudio.com/). +- **Command-line terminal (CLI)**: FYI **Windows** users, for the best Ionic experience, we + recommend the built-in command line (cmd) or the Powershell CLI, running in Administrator mode. For **Mac/Linux** users, virtually any terminal will work. ## Install Ionic and Cordova diff --git a/docs/developing/tips.md b/docs/developing/tips.md index 1ed040a4ff0..c4cdc6ca5bc 100644 --- a/docs/developing/tips.md +++ b/docs/developing/tips.md @@ -61,9 +61,7 @@ Global packages will now be installed in the `~/.nvm` directory, so permission e ### Option 2 - - Does not apply to Windows - +_Does not apply to Windows_ Change the owner of npm's directories to the current user: diff --git a/docs/index.md b/docs/index.md index c3bfcd5ba85..dd59a621c8e 100644 --- a/docs/index.md +++ b/docs/index.md @@ -125,7 +125,7 @@ The official [Ionic CLI](cli.md), or Command Line Interface, is a tool that quic ## Appflow -To help build, deploy, and manage Ionic apps throughout their lifecycle, we offer a commercial service for production apps called [Appflow](https://ionic.io/appflow), which is separate from the open source Framework. +To help build, deploy, and manage Ionic apps throughout their lifecycle, we offer a commercial service for production apps called [Appflow](https://ionic.io/appflow), which is **separate from the open source Framework.** Appflow helps developers and teams compile native app builds and deploy live code updates to Ionic apps from a centralized dashboard. Optional paid upgrades are available for more advanced capabilities like publishing directly to app stores, workflow automation, single sign-on (SSO) and access to connected services and integrations. diff --git a/docs/react/testing/unit-testing/best-practices.md b/docs/react/testing/unit-testing/best-practices.md index 6af22f45d4f..7decbced27f 100644 --- a/docs/react/testing/unit-testing/best-practices.md +++ b/docs/react/testing/unit-testing/best-practices.md @@ -41,7 +41,7 @@ test('example', async () => { render( - + , ); await user.click(screen.getByRole('button', { name: /click me!/i })); @@ -65,7 +65,7 @@ test('renders the submit button', async () => { const { container } = render( - + , ); const button = container.querySelector('ion-button')!; diff --git a/docs/react/testing/unit-testing/examples.md b/docs/react/testing/unit-testing/examples.md index 39275eef669..a619cb6d6ac 100644 --- a/docs/react/testing/unit-testing/examples.md +++ b/docs/react/testing/unit-testing/examples.md @@ -37,7 +37,7 @@ test('button presents a modal when clicked', async () => { render( - + , ); // Simulate a click on the button fireEvent.click(screen.getByText('Open')); @@ -99,7 +99,7 @@ test('should present ModalContent when button is clicked', async () => { render( - + , ); // Simulate a click on the button fireEvent.click(screen.getByText('Open')); diff --git a/docs/react/utility-functions.md b/docs/react/utility-functions.md index ed8814188b8..1489c5bffae 100644 --- a/docs/react/utility-functions.md +++ b/docs/react/utility-functions.md @@ -122,7 +122,7 @@ type UseIonRouterResult = { routerDirection?: RouterDirection, routeAction?: RouteAction, routerOptions?: RouterOptions, - animationBuilder?: AnimationBuilder + animationBuilder?: AnimationBuilder, ): void; /** * Navigates backwards in history, using the IonRouter to determine history diff --git a/docs/react/your-first-app.md b/docs/react/your-first-app.md index 92bdb7393ee..c4959aeb20b 100644 --- a/docs/react/your-first-app.md +++ b/docs/react/your-first-app.md @@ -113,7 +113,7 @@ const root = createRoot(container!); root.render( - + , ); ``` diff --git a/docs/reference/glossary.md b/docs/reference/glossary.md index 6df9ec43090..ce1377d6fc5 100644 --- a/docs/reference/glossary.md +++ b/docs/reference/glossary.md @@ -44,7 +44,7 @@ Bundling is the process of taking an app's dependencies (code you've written plu ### CLI {/* #cli */} -A CLI, or Command-Line Interface, is a text-based interface for interacting with a program. The common command-line app for a Mac user is the Terminal app, and Windows users often use Command Prompt. The Ionic community often uses this term to refer to [Ionic's CLI](https://ionicframework.com/docs/cli). Ionic's CLI can be used for a number of things, such as creating production builds of an app, running the development server, and accessing [Ionic commercial services](https://ionic.io/appflow). +A CLI, or **C**ommand-**L**ine **I**nterface, is a text-based interface for interacting with a program. The common command-line app for a Mac user is the Terminal app, and Windows users often use Command Prompt. The Ionic community often uses this term to refer to [Ionic's CLI](https://ionicframework.com/docs/cli). Ionic's CLI can be used for a number of things, such as creating production builds of an app, running the development server, and accessing [Ionic commercial services](https://ionic.io/appflow). {/* cspell:enable */} @@ -66,7 +66,7 @@ You may be familiar with variables from Sass. [CSS Variables](https://developers ### Decorators {/* #decorators */} -Decorators are expressions that return a function. They allow you to take an existing function, and extend its behavior. With TypeScript, you can also decorate classes and parameters. When you decorate a class, you are wrapping and extending the behavior of its constructor. In other words, the decorator will add some functionality when the constructor is called, and will then return the original constructor. When you decorate a parameter, you are wrapping the argument that gets passed in for that parameter. The decorator will add functionality when an argument is passed to the method, and then return the original argument. +Decorators are expressions that return a function. They allow you to take an existing function, and extend its behavior. With TypeScript, you can also decorate _classes_ and _parameters_. When you decorate a **class**, you are wrapping and extending the behavior of its constructor. In other words, the decorator will add some functionality when the constructor is called, and will then return the original constructor. When you decorate a **parameter**, you are wrapping the argument that gets passed in for that parameter. The decorator will add functionality when an argument is passed to the method, and then return the original argument. ### ES5 {/* #es5 */} @@ -114,7 +114,7 @@ Modules in JavaScript are small, independent, and reusable pieces or code that a ### Monorepo {/* #monorepo */} -A monorepo is a single git repository with multiple projects. Advantages include simpler organization, shared tooling and dependencies, and better collaboration with teammates. +A **monorepo** is a single git repository with multiple projects. Advantages include simpler organization, shared tooling and dependencies, and better collaboration with teammates. ### Live Reload {/* #livereload */} @@ -134,7 +134,7 @@ An observable is an object that emits events (or notifications). An observer is ### Package ID {/* #package-id */} -Referred to by Apple as Bundle ID and by Android as Application ID, the Package ID is used for identifying apps published to the App Store/Play Store. It is a string formatted in [reverse-DNS notation](https://en.wikipedia.org/wiki/Reverse_domain_name_notation). +Referred to by Apple as **Bundle ID** and by Android as **Application ID**, the **Package ID** is used for identifying apps published to the App Store/Play Store. It is a string formatted in [reverse-DNS notation](https://en.wikipedia.org/wiki/Reverse_domain_name_notation). ### Polyfill {/* #polyfill */} @@ -162,7 +162,7 @@ A shim is a piece of code that normalizes an APIs across browsers. A shim can ha ### Transpiler {/* #transpiler */} -Transpilation is the process of converting code from one language to another language prior to execution. Typically, a transpiler will convert a high-level language to another high-level language. The most common type of transpilation in Ionic Framework is converting [ES2015/ES6](#es2015-es6) ([TypeScript](#typescript)) to [ES5](#es5) (traditional JavaScript). +Transpilation is the process of converting code from one language to another language prior to execution. Typically, a transpiler will convert a high-level language to another high-level language. The most common type of _transpilation_ in Ionic Framework is converting [ES2015/ES6](#es2015-es6) ([TypeScript](#typescript)) to [ES5](#es5) (traditional JavaScript). ### TypeScript {/* #typescript */} diff --git a/docs/reference/support.md b/docs/reference/support.md index 44eb8e28a7e..efcac5b444f 100644 --- a/docs/reference/support.md +++ b/docs/reference/support.md @@ -54,8 +54,11 @@ The Ionic team has compiled a set of recommendations for using the Ionic Framewo | v3 | v5.2.11 | v5.2.11 | 2.6.2 | [^1]: Angular 14.x supported starting in Ionic v6.1.9. Angular 15.x supported starting in Ionic v6.3.6. + [^2]: Angular 17.x supported starting in Ionic v7.5.4. + [^3]: Angular 18.x supported starting in Ionic v8.2.0. + [^4]: `@ionic/angular` and `@ionic/react` require TypeScript 5.4+. Using Angular 21 requires TypeScript 5.9 or later, and Angular 22 requires TypeScript 6.0 or later, per Angular's own requirements. **Angular 13+ Support On Older Versions of iOS** diff --git a/docs/theming/basics.md b/docs/theming/basics.md index f89c78e4026..c7072fd73c7 100644 --- a/docs/theming/basics.md +++ b/docs/theming/basics.md @@ -25,7 +25,7 @@ When changing a color, it is important to set all of the related properties. Thi ## Platform Standards -Ionic components adapt their look and behavior based on the platform the app is running on. We call this Adaptive Styling. This allows developers to build apps that use the same codebase for multiple platforms, while still looking "native" to those particular platforms. +Ionic components adapt their look and behavior based on the platform the app is running on. We call this **Adaptive Styling**. This allows developers to build apps that use the same codebase for multiple platforms, while still looking "native" to those particular platforms. Ionic has two **modes** that are used to customize the look of components based on the **platform**: `ios` and `md`. Each platform has a default mode, but this can easily be configured. For more information on customizing an application based on the platform, refer to [Platform Styles](platform-styles.md). diff --git a/docs/troubleshooting/native.md b/docs/troubleshooting/native.md index 80f8be3948a..357e40b45f0 100644 --- a/docs/troubleshooting/native.md +++ b/docs/troubleshooting/native.md @@ -24,7 +24,7 @@ Running an app on an iOS device requires a provisioning profile. If a provisioni For Cordova, open the `config.xml` file and modify the `id` attribute of the root element, ``. Refer to [the Cordova documentation](https://cordova.apache.org/docs/en/latest/config_ref/#widget) for more information. -2. **Open the project in Xcode.** +2. **Open the project in **Xcode**.** For Capacitor, run the following to open the app in Xcode: @@ -34,11 +34,11 @@ Running an app on an iOS device requires a provisioning profile. If a provisioni For Cordova, open Xcode. Use **File** » **Open** and locate the app. Open the app's `platforms/ios` directory. -3. **In Project navigator, select the project root to open the project editor. Under the Identity section, verify that the Package ID that was set matches the Bundle Identifier.** +3. **In **Project navigator**, select the project root to open the project editor. Under the **Identity** section, verify that the Package ID that was set matches the Bundle Identifier.** ![Xcode showing the Identity section for an iOS app with fields for Display Name, Bundle Identifier, Version, and Build.](/img/running/ios-xcode-identity-setup.png 'Xcode Identity Section') -4. **In the same project editor, under the Signing section, ensure Automatically manage signing is enabled.** Then, select a Development Team. Given a Development Team, Xcode will attempt to automatically prepare provisioning and signing. +4. **In the same project editor, under the **Signing** section, ensure **Automatically manage signing** is enabled.** Then, select a Development Team. Given a Development Team, Xcode will attempt to automatically prepare provisioning and signing. ![Xcode showing the Signing section with 'Automatically manage signing' enabled and a Development Team selected.](/img/running/ios-xcode-signing-setup.png 'Xcode Signing Section') diff --git a/docs/vue/pwa.md b/docs/vue/pwa.md index fd84d820611..563faf40157 100644 --- a/docs/vue/pwa.md +++ b/docs/vue/pwa.md @@ -78,7 +78,7 @@ if (process.env.NODE_ENV === 'production') { register(`${process.env.BASE_URL}service-worker.js`, { ready() { console.log( - 'App is being served from cache by a service worker.\n' + 'For more details, visit https://goo.gl/AFskqB' + 'App is being served from cache by a service worker.\n' + 'For more details, visit https://goo.gl/AFskqB', ); }, registered() { diff --git a/docusaurus.config.js b/docusaurus.config.js index 0b3061a8f7b..31bee4a6800 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -88,7 +88,7 @@ module.exports = { if ((match = docPath.match(/cli\/commands\/(.*)\.md/)) != null) { return `https://github.com/ionic-team/ionic-cli/edit/develop/packages/@ionic/cli/src/commands/${match[1].replace( '-', - '/' + '/', )}.ts`; } if ((match = docPath.match(/native\/(.*)\.md/)) != null) { diff --git a/package-lock.json b/package-lock.json index 31d8911f522..9b9071b3251 100644 --- a/package-lock.json +++ b/package-lock.json @@ -35,11 +35,11 @@ "devDependencies": { "@docusaurus/module-type-aliases": "^3.10.2", "@docusaurus/tsconfig": "^3.10.2", - "@ionic/prettier-config": "^3.0.0", + "@ionic/prettier-config": "^4.0.0", "@types/react": "^19.2.18", "cspell": "^10.0.1", "hygen": "^6.2.11", - "prettier": "^2.8.8", + "prettier": "^3.9.6", "typescript": "^5.9.3", "vitest": "^4.1.7" }, @@ -4937,10 +4937,11 @@ } }, "node_modules/@ionic/prettier-config": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/@ionic/prettier-config/-/prettier-config-3.1.0.tgz", - "integrity": "sha512-5cQ9qy9G0JDcIfUSP03EyX9ReEHK0mD34anvc2eCNpcca8GbY/wB0QS125FBkmV2DhDc5BvQSSM6VWZSGkxDJQ==", + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@ionic/prettier-config/-/prettier-config-4.0.0.tgz", + "integrity": "sha512-0DqL6CggVdgeJAWOLPUT73rF1VD5p0tVlCpC5GXz5vTIUBxNwsJ5085Q7wXjKiE5Odx3aOHGTcuRWCawFsLFag==", "dev": true, + "license": "MIT", "peerDependencies": { "prettier": "^2.4.0 || ^3.0.0" } @@ -18906,15 +18907,16 @@ } }, "node_modules/prettier": { - "version": "2.8.8", - "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz", - "integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==", + "version": "3.9.6", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.9.6.tgz", + "integrity": "sha512-OpN0zzVdiaiAhxpuuj5efpIS4sY9j7bY6uR5mnj5yPzGkdkjNKSJeUThPb60Jw29QuAZgA4o+/iB49kFiaBX6g==", "dev": true, + "license": "MIT", "bin": { - "prettier": "bin-prettier.js" + "prettier": "bin/prettier.cjs" }, "engines": { - "node": ">=10.13.0" + "node": ">=14" }, "funding": { "url": "https://github.com/prettier/prettier?sponsor=1" diff --git a/package.json b/package.json index 3e2661c1951..c49f58d1d2a 100644 --- a/package.json +++ b/package.json @@ -65,11 +65,11 @@ "devDependencies": { "@docusaurus/module-type-aliases": "^3.10.2", "@docusaurus/tsconfig": "^3.10.2", - "@ionic/prettier-config": "^3.0.0", + "@ionic/prettier-config": "^4.0.0", "@types/react": "^19.2.18", "cspell": "^10.0.1", "hygen": "^6.2.11", - "prettier": "^2.8.8", + "prettier": "^3.9.6", "typescript": "^5.9.3", "vitest": "^4.1.7" }, diff --git a/plugins/docusaurus-plugin-ionic-component-api/index.js b/plugins/docusaurus-plugin-ionic-component-api/index.js index 93a400479bd..cab44f8e2f3 100644 --- a/plugins/docusaurus-plugin-ionic-component-api/index.js +++ b/plugins/docusaurus-plugin-ionic-component-api/index.js @@ -63,7 +63,7 @@ module.exports = function (context, options) { currentVersion.path || currentVersion.label, npmTag, context.i18n.currentLocale, - true + true, ); return data; @@ -84,7 +84,7 @@ module.exports = function (context, options) { createData(`${basePath}/methods.mdx`, data.methods), createData(`${basePath}/parts.mdx`, data.parts), createData(`${basePath}/custom-props.mdx`, data.customProps), - createData(`${basePath}/slots.mdx`, data.slots) + createData(`${basePath}/slots.mdx`, data.slots), ); /** @@ -110,7 +110,7 @@ module.exports = function (context, options) { createData(`${basePath}/events.md`, data.events), createData(`${basePath}/methods.md`, data.methods), createData(`${basePath}/parts.md`, data.parts), - createData(`${basePath}/slots.md`, data.slots) + createData(`${basePath}/slots.md`, data.slots), ); } @@ -321,7 +321,7 @@ ${methods | **Description** | ${formatMultiline(method.docs)} | | **Signature** | \`${method.signature.replace(/\|/g, '\uff5c')}\` | ${method.parameters.length !== 0 ? renderParameters(method.parameters) : ''} -` +`, ) .join('\n')} diff --git a/src/components/global/Playground/index.tsx b/src/components/global/Playground/index.tsx index e47a69075ca..c1d61562640 100644 --- a/src/components/global/Playground/index.tsx +++ b/src/components/global/Playground/index.tsx @@ -30,7 +30,7 @@ const ControlButton = forwardRef( label: string; disabled?: boolean; }, - ref: RefObject + ref: RefObject, ) => { const controlButton = (