@ionic/core 8.7.4-dev.11757430138.13649dec → 8.7.4-dev.11758100307.13cc0353

package/dist/collection/components/radio/radio.ionic.css

@@ -4,9 +4,7 @@
  * @param pixels - Value in pixels to be converted (i.e. px)
  * @param context (optional) - Baseline value
  */
-/*
-Do not edit directly, this file was auto-generated.
-*/ /**
+/**
  * A heuristic that applies CSS to tablet
  * viewports.
  *
@@ -278,21 +276,21 @@ input {
 }
 
 :host {
-  --color: var(--ion-primitives-neutral-500, #a2a2a2);
-  --color-checked: var(--ion-semantics-primary-base, var(--ion-semantics-primary-700, var(--ion-primitives-blue-700, #105cef)));
-  --border-width: var(--ion-border-size-025, var(--ion-scale-025, 1px));
-  --border-style: var(--ion-border-style-solid, solid);
-  --border-radius: var(--ion-border-radius-full, 999px);
-  --focus-ring-color: var(--ion-border-focus-default, var(--ion-primitives-blue-400, #b5c0f7));
-  --focus-ring-width: var(--ion-border-size-050, var(--ion-scale-050, 2px));
-  font-size: var(--ion-font-size-350, 0.875rem);
-  font-weight: var(--ion-font-weight-regular, 400);
-  letter-spacing: var(--ion-font-letter-spacing-0, 0%);
-  line-height: var(--ion-font-line-height-600, var(--ion-scale-600, 24px));
+  --color: var(--token-primitives-neutral-500, #a2a2a2);
+  --color-checked: var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)));
+  --border-width: var(--token-border-size-025, var(--token-scale-025, 1px));
+  --border-style: var(--token-border-style-solid, solid);
+  --border-radius: var(--token-border-radius-full, 999px);
+  --focus-ring-color: var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));
+  --focus-ring-width: var(--token-border-size-050, var(--token-scale-050, 2px));
+  font-size: var(--token-font-size-350, 0.875rem);
+  font-weight: var(--token-font-weight-regular, 400);
+  letter-spacing: var(--token-font-letter-spacing-0, 0%);
+  line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
   text-decoration: none;
   text-transform: none;
-  min-height: var(--ion-scale-1200, 48px);
-  color: var(--ion-primitives-neutral-1200, #242424);
+  min-height: var(--token-scale-1200, 48px);
+  color: var(--token-primitives-neutral-1200, #242424);
 }
 
 :host(.ion-color.radio-checked) .radio-icon {
@@ -301,12 +299,12 @@ input {
 }
 
 :host(.in-item.radio-label-placement-stacked) .native-wrapper {
-  margin-bottom: var(--ion-space-250, var(--ion-scale-250, 10px));
+  margin-bottom: var(--token-space-250, var(--token-scale-250, 10px));
 }
 
 .native-wrapper .radio-icon {
-  width: var(--ion-scale-600, 24px);
-  height: var(--ion-scale-600, 24px);
+  width: var(--token-scale-600, 24px);
+  height: var(--token-scale-600, 24px);
 }
 
 .radio-icon {
@@ -318,14 +316,14 @@ input {
   border-width: var(--border-width);
   border-style: var(--border-style);
   border-color: var(--color);
-  background-color: var(--ion-primitives-base-white, #ffffff);
+  background-color: var(--token-primitives-base-white, #ffffff);
 }
 
 .radio-inner {
   border-radius: var(--inner-border-radius);
   width: calc(32% + var(--border-width));
   height: calc(32% + var(--border-width));
-  background-color: var(--ion-primitives-base-white, #ffffff);
+  background-color: var(--token-primitives-base-white, #ffffff);
 }
 
 :host(.radio-checked) .radio-icon {
@@ -342,8 +340,8 @@ input {
    */
   -webkit-margin-start: 0;
   margin-inline-start: 0;
-  -webkit-margin-end: var(--ion-space-400, var(--ion-scale-400, 16px));
-  margin-inline-end: var(--ion-space-400, var(--ion-scale-400, 16px));
+  -webkit-margin-end: var(--token-space-400, var(--token-scale-400, 16px));
+  margin-inline-end: var(--token-space-400, var(--token-scale-400, 16px));
 }
 
 /**
@@ -352,8 +350,8 @@ input {
  * when the label sits at the end.
  */
 :host(.radio-label-placement-end) .label-text-wrapper {
-  -webkit-margin-start: var(--ion-space-400, var(--ion-scale-400, 16px));
-  margin-inline-start: var(--ion-space-400, var(--ion-scale-400, 16px));
+  -webkit-margin-start: var(--token-space-400, var(--token-scale-400, 16px));
+  margin-inline-start: var(--token-space-400, var(--token-scale-400, 16px));
   -webkit-margin-end: 0;
   margin-inline-end: 0;
 }
@@ -367,7 +365,7 @@ input {
    */
   margin-left: 0;
   margin-right: 0;
-  margin-bottom: var(--ion-space-400, var(--ion-scale-400, 16px));
+  margin-bottom: var(--token-space-400, var(--token-scale-400, 16px));
   /**
    * Label text should not extend
    * beyond the bounds of the radio.
@@ -376,7 +374,7 @@ input {
 }
 
 :host(:not(.in-item):not(:last-of-type)) {
-  margin-bottom: var(--ion-space-200, var(--ion-scale-200, 8px));
+  margin-bottom: var(--token-space-200, var(--token-scale-200, 8px));
 }
 
 :host(.radio-disabled) .radio-icon::after {
@@ -385,7 +383,7 @@ input {
   top: 0;
   bottom: 0;
   position: absolute;
-  background-color: var(--ion-state-disabled, rgba(255, 255, 255, 0.6));
+  background-color: var(--token-state-disabled, rgba(255, 255, 255, 0.6));
   content: "";
   pointer-events: none;
   border-radius: inherit;
@@ -401,7 +399,7 @@ input {
 
 :host(.ion-focused) .radio-icon {
   outline-offset: var(--focus-ring-width);
-  outline: var(--focus-ring-width) var(--ion-border-style-solid, solid) var(--focus-ring-color);
+  outline: var(--focus-ring-width) var(--token-border-style-solid, solid) var(--focus-ring-color);
 }
 
 :host(.ion-activated) .radio-icon::after {
@@ -410,7 +408,7 @@ input {
   top: 0;
   bottom: 0;
   position: absolute;
-  background-color: var(--ion-state-press, rgba(36, 36, 36, 0.08));
+  background-color: var(--token-state-press, rgba(36, 36, 36, 0.08));
   content: "";
   border-radius: inherit;
   top: calc(var(--border-width) * -1);

package/dist/collection/components/radio-group/radio-group.ionic.css

@@ -4,9 +4,7 @@
  * @param pixels - Value in pixels to be converted (i.e. px)
  * @param context (optional) - Baseline value
  */
-/*
-Do not edit directly, this file was auto-generated.
-*/ /**
+/**
  * A heuristic that applies CSS to tablet
  * viewports.
  *
@@ -86,42 +84,42 @@ ion-radio-group {
 }
 
 .radio-group-top {
-  font-size: var(--ion-font-size-350, 0.875rem);
-  font-weight: var(--ion-font-weight-regular, 400);
-  letter-spacing: var(--ion-font-letter-spacing-0, 0%);
-  line-height: var(--ion-font-line-height-600, var(--ion-scale-600, 24px));
+  font-size: var(--token-font-size-350, 0.875rem);
+  font-weight: var(--token-font-weight-regular, 400);
+  letter-spacing: var(--token-font-letter-spacing-0, 0%);
+  line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
   text-decoration: none;
   text-transform: none;
-  margin-bottom: var(--ion-space-400, var(--ion-scale-400, 16px));
+  margin-bottom: var(--token-space-400, var(--token-scale-400, 16px));
 }
 
 .radio-group-top .error-text {
-  color: var(--ion-semantics-danger-800, var(--ion-primitives-red-800, #bf2222));
+  color: var(--token-semantics-danger-800, var(--token-primitives-red-800, #bf2222));
 }
 
 .radio-group-top .helper-text {
-  color: var(--ion-primitives-neutral-800, #626262);
+  color: var(--token-primitives-neutral-800, #626262);
 }
 
 ion-list .radio-group-top {
   /* stylelint-disable */
-  padding-right: var(--ion-space-400, var(--ion-scale-400, 16px));
-  padding-left: calc(var(--ion-space-400, var(--ion-scale-400, 16px)) + var(--ion-safe-area-left, 0px));
+  padding-right: var(--token-space-400, var(--token-scale-400, 16px));
+  padding-left: calc(var(--token-space-400, var(--token-scale-400, 16px)) + var(--ion-safe-area-left, 0px));
   /* stylelint-enable */
 }
 :host-context([dir=rtl]) ion-list .radio-group-top {
-  padding-right: calc(var(--ion-space-400, var(--ion-scale-400, 16px)) + var(--ion-safe-area-right, 0px));
-  padding-left: var(--ion-space-400, var(--ion-scale-400, 16px));
+  padding-right: calc(var(--token-space-400, var(--token-scale-400, 16px)) + var(--ion-safe-area-right, 0px));
+  padding-left: var(--token-space-400, var(--token-scale-400, 16px));
 }
 
 [dir=rtl] ion-list .radio-group-top {
-  padding-right: calc(var(--ion-space-400, var(--ion-scale-400, 16px)) + var(--ion-safe-area-right, 0px));
-  padding-left: var(--ion-space-400, var(--ion-scale-400, 16px));
+  padding-right: calc(var(--token-space-400, var(--token-scale-400, 16px)) + var(--ion-safe-area-right, 0px));
+  padding-left: var(--token-space-400, var(--token-scale-400, 16px));
 }
 
 @supports selector(:dir(rtl)) {
   ion-list .radio-group-top:dir(rtl) {
-    padding-right: calc(var(--ion-space-400, var(--ion-scale-400, 16px)) + var(--ion-safe-area-right, 0px));
-    padding-left: var(--ion-space-400, var(--ion-scale-400, 16px));
+    padding-right: calc(var(--token-space-400, var(--token-scale-400, 16px)) + var(--ion-safe-area-right, 0px));
+    padding-left: var(--token-space-400, var(--token-scale-400, 16px));
   }
 }

package/dist/collection/components/range/range.ionic.css

@@ -4,9 +4,7 @@
  * @param pixels - Value in pixels to be converted (i.e. px)
  * @param context (optional) - Baseline value
  */
-/*
-Do not edit directly, this file was auto-generated.
-*/ /**
+/**
  * A heuristic that applies CSS to tablet
  * viewports.
  *
@@ -347,33 +345,33 @@ Do not edit directly, this file was auto-generated.
 }
 
 :host {
-  --knob-border-radius: var(--ion-border-radius-full, 999px);
-  --knob-background: var(--ion-bg-input-default, var(--ion-primitives-base-white, #ffffff));
+  --knob-border-radius: var(--token-border-radius-full, 999px);
+  --knob-background: var(--token-bg-input-default, var(--token-primitives-base-white, #ffffff));
   --knob-box-shadow: none;
-  --knob-size: var(--ion-scale-600, 24px);
-  --knob-handle-size: var(--ion-scale-1100, 44px);
-  --bar-height: var(--ion-scale-200, 8px);
-  --bar-background: var(--ion-bg-neutral-subtle-default, var(--ion-primitives-neutral-200, #efefef));
-  --bar-background-active: var(--ion-color-primary, var(--ion-bg-primary-base-default, var(--ion-semantics-primary-base, var(--ion-semantics-primary-700, var(--ion-primitives-blue-700, #105cef)))));
-  --bar-border-radius: var(--ion-border-radius-400, var(--ion-scale-400, 16px));
-  --height: var(--ion-scale-1100, 44px);
-  font-size: var(--ion-font-size-350, 0.875rem);
-  font-weight: var(--ion-font-weight-regular, 400);
-  letter-spacing: var(--ion-font-letter-spacing-0, 0%);
-  line-height: var(--ion-font-line-height-600, var(--ion-scale-600, 24px));
+  --knob-size: var(--token-scale-600, 24px);
+  --knob-handle-size: var(--token-scale-1100, 44px);
+  --bar-height: var(--token-scale-200, 8px);
+  --bar-background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-200, #efefef));
+  --bar-background-active: var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));
+  --bar-border-radius: var(--token-border-radius-400, var(--token-scale-400, 16px));
+  --height: var(--token-scale-1100, 44px);
+  font-size: var(--token-font-size-350, 0.875rem);
+  font-weight: var(--token-font-weight-regular, 400);
+  letter-spacing: var(--token-font-letter-spacing-0, 0%);
+  line-height: var(--token-font-line-height-600, var(--token-scale-600, 24px));
   text-decoration: none;
   text-transform: none;
-  z-index: var(--ion-z-index-100, 100);
+  z-index: var(--token-z-index-100, 100);
 }
 
 :host(.range-item-start-adjustment) {
-  -webkit-padding-start: var(--ion-space-600, var(--ion-scale-600, 24px));
-  padding-inline-start: var(--ion-space-600, var(--ion-scale-600, 24px));
+  -webkit-padding-start: var(--token-space-600, var(--token-scale-600, 24px));
+  padding-inline-start: var(--token-space-600, var(--token-scale-600, 24px));
 }
 
 :host(.range-item-end-adjustment) {
-  -webkit-padding-end: var(--ion-space-600, var(--ion-scale-600, 24px));
-  padding-inline-end: var(--ion-space-600, var(--ion-scale-600, 24px));
+  -webkit-padding-end: var(--token-space-600, var(--token-scale-600, 24px));
+  padding-inline-end: var(--token-space-600, var(--token-scale-600, 24px));
 }
 
 :host(.ion-color) .range-bar-active,
@@ -382,21 +380,21 @@ Do not edit directly, this file was auto-generated.
 }
 
 ::slotted(ion-icon[slot]) {
-  font-size: var(--ion-font-size-600, 1.5rem);
+  font-size: var(--token-font-size-600, 1.5rem);
 }
 
 ::slotted([slot=start]) {
   -webkit-margin-start: 0;
   margin-inline-start: 0;
-  -webkit-margin-end: var(--ion-space-400, var(--ion-scale-400, 16px));
-  margin-inline-end: var(--ion-space-400, var(--ion-scale-400, 16px));
+  -webkit-margin-end: var(--token-space-400, var(--token-scale-400, 16px));
+  margin-inline-end: var(--token-space-400, var(--token-scale-400, 16px));
   margin-top: 0;
   margin-bottom: 0;
 }
 
 ::slotted([slot=end]) {
-  -webkit-margin-start: var(--ion-space-400, var(--ion-scale-400, 16px));
-  margin-inline-start: var(--ion-space-400, var(--ion-scale-400, 16px));
+  -webkit-margin-start: var(--token-space-400, var(--token-scale-400, 16px));
+  margin-inline-start: var(--token-space-400, var(--token-scale-400, 16px));
   -webkit-margin-end: 0;
   margin-inline-end: 0;
   margin-top: 0;
@@ -404,7 +402,7 @@ Do not edit directly, this file was auto-generated.
 }
 
 ::slotted([slot=label]) {
-  max-width: var(--ion-scale-5000, 200px);
+  max-width: var(--token-scale-5000, 200px);
 }
 
 :host(.range-has-pin:not(.range-label-placement-stacked)) {
@@ -420,7 +418,7 @@ Do not edit directly, this file was auto-generated.
   * overlapping the range. The buffer is added to the
   * bottom of the range label instead of the host.
   */
-  padding-top: calc(var(--ion-space-100, var(--ion-scale-100, 4px)) + var(--ion-scale-600, 24px));
+  padding-top: calc(var(--token-space-100, var(--token-scale-100, 4px)) + var(--token-scale-600, 24px));
 }
 
 :host(.range-has-pin.range-label-placement-stacked) .label-text-wrapper {
@@ -429,7 +427,7 @@ Do not edit directly, this file was auto-generated.
   * margin to the bottom of the label, it provides a buffer
   * for the pin to move into when it is pressed.
   */
-  margin-bottom: calc(var(--ion-space-200, var(--ion-scale-200, 8px)) + var(--ion-font-size-300, 0.75rem));
+  margin-bottom: calc(var(--token-space-200, var(--token-scale-200, 8px)) + var(--token-font-size-300, 0.75rem));
 }
 
 .range-bar.range-bar-active {
@@ -439,21 +437,21 @@ Do not edit directly, this file was auto-generated.
 }
 .range-bar.range-bar-active.has-ticks {
   border-radius: 0;
-  -webkit-margin-start: calc(-1 * var(--ion-scale-100, 4px) * 0.5);
-  margin-inline-start: calc(-1 * var(--ion-scale-100, 4px) * 0.5);
-  -webkit-margin-end: calc(-1 * var(--ion-scale-100, 4px) * 0.5);
-  margin-inline-end: calc(-1 * var(--ion-scale-100, 4px) * 0.5);
+  -webkit-margin-start: calc(-1 * var(--token-scale-100, 4px) * 0.5);
+  margin-inline-start: calc(-1 * var(--token-scale-100, 4px) * 0.5);
+  -webkit-margin-end: calc(-1 * var(--token-scale-100, 4px) * 0.5);
+  margin-inline-end: calc(-1 * var(--token-scale-100, 4px) * 0.5);
 }
 
 .range-tick {
-  -webkit-margin-start: calc(var(--ion-scale-100, 4px) * -0.5);
-  margin-inline-start: calc(var(--ion-scale-100, 4px) * -0.5);
-  border-radius: var(--ion-border-radius-0, var(--ion-scale-0, 0px));
+  -webkit-margin-start: calc(var(--token-scale-100, 4px) * -0.5);
+  margin-inline-start: calc(var(--token-scale-100, 4px) * -0.5);
+  border-radius: var(--token-border-radius-0, var(--token-scale-0, 0px));
   position: absolute;
-  top: calc(var(--height) * 0.5 - var(--ion-scale-300, 12px) * 0.5);
-  width: var(--ion-scale-100, 4px);
-  height: var(--ion-scale-300, 12px);
-  background: var(--ion-primitives-neutral-100, #f5f5f5);
+  top: calc(var(--height) * 0.5 - var(--token-scale-300, 12px) * 0.5);
+  width: var(--token-scale-100, 4px);
+  height: var(--token-scale-300, 12px);
+  background: var(--token-primitives-neutral-100, #f5f5f5);
   pointer-events: none;
 }
 
@@ -462,28 +460,28 @@ Do not edit directly, this file was auto-generated.
 }
 
 .range-pin {
-  padding-bottom: var(--ion-space-100, var(--ion-scale-100, 4px));
-  min-width: var(--ion-scale-700, 28px);
+  padding-bottom: var(--token-space-100, var(--token-scale-100, 4px));
+  min-width: var(--token-scale-700, 28px);
   transform: translate3d(0, -100%, 0);
   background: transparent;
-  color: var(--ion-text-default, var(--ion-primitives-neutral-1200, #242424));
-  font-size: var(--ion-font-size-300, 0.75rem);
+  color: var(--token-text-default, var(--token-primitives-neutral-1200, #242424));
+  font-size: var(--token-font-size-300, 0.75rem);
   text-align: center;
 }
 
 .range-knob {
-  border-width: var(--ion-border-size-025, var(--ion-scale-025, 1px));
-  border-style: var(--ion-border-style-solid, solid);
-  border-color: var(--ion-border-primary, var(--ion-semantics-primary-base, var(--ion-semantics-primary-700, var(--ion-primitives-blue-700, #105cef))));
+  border-width: var(--token-border-size-025, var(--token-scale-025, 1px));
+  border-style: var(--token-border-style-solid, solid);
+  border-color: var(--token-border-primary, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef))));
   box-sizing: border-box;
 }
 
 :host(.range-disabled) {
-  --bar-background: var(--ion-bg-neutral-subtle-default, var(--ion-primitives-neutral-200, #efefef));
+  --bar-background: var(--token-bg-neutral-subtle-default, var(--token-primitives-neutral-200, #efefef));
 }
 :host(.range-disabled) .range-knob {
-  border-color: var(--ion-border-input-default, var(--ion-primitives-neutral-500, #a2a2a2));
-  background: var(--ion-bg-input-disabled, var(--ion-primitives-neutral-100, #f5f5f5));
+  border-color: var(--token-border-input-default, var(--token-primitives-neutral-500, #a2a2a2));
+  background: var(--token-bg-input-disabled, var(--token-primitives-neutral-100, #f5f5f5));
 }
 
 :host(.range-label-placement-start) .label-text-wrapper {
@@ -494,8 +492,8 @@ Do not edit directly, this file was auto-generated.
    */
   -webkit-margin-start: 0;
   margin-inline-start: 0;
-  -webkit-margin-end: var(--ion-space-400, var(--ion-scale-400, 16px));
-  margin-inline-end: var(--ion-space-400, var(--ion-scale-400, 16px));
+  -webkit-margin-end: var(--token-space-400, var(--token-scale-400, 16px));
+  margin-inline-end: var(--token-space-400, var(--token-scale-400, 16px));
   margin-top: 0;
   margin-bottom: 0;
 }
@@ -506,8 +504,8 @@ Do not edit directly, this file was auto-generated.
    * the range should be on the start
    * when the label sits at the end.
    */
-  -webkit-margin-start: var(--ion-space-400, var(--ion-scale-400, 16px));
-  margin-inline-start: var(--ion-space-400, var(--ion-scale-400, 16px));
+  -webkit-margin-start: var(--token-space-400, var(--token-scale-400, 16px));
+  margin-inline-start: var(--token-space-400, var(--token-scale-400, 16px));
   -webkit-margin-end: 0;
   margin-inline-end: 0;
   margin-top: 0;
@@ -522,8 +520,8 @@ Do not edit directly, this file was auto-generated.
    */
   -webkit-margin-start: 0;
   margin-inline-start: 0;
-  -webkit-margin-end: var(--ion-space-400, var(--ion-scale-400, 16px));
-  margin-inline-end: var(--ion-space-400, var(--ion-scale-400, 16px));
+  -webkit-margin-end: var(--token-space-400, var(--token-scale-400, 16px));
+  margin-inline-end: var(--token-space-400, var(--token-scale-400, 16px));
   margin-top: 0;
   margin-bottom: 0;
 }
@@ -537,7 +535,7 @@ Do not edit directly, this file was auto-generated.
   */
   margin-left: 0;
   margin-right: 0;
-  margin-bottom: var(--ion-space-400, var(--ion-scale-400, 16px));
+  margin-bottom: var(--token-space-400, var(--token-scale-400, 16px));
   /**
    * Label text should not extend
    * beyond the bounds of the range.
@@ -546,20 +544,20 @@ Do not edit directly, this file was auto-generated.
 }
 
 :host(.in-item.range-label-placement-stacked) .label-text-wrapper {
-  margin-top: var(--ion-space-250, var(--ion-scale-250, 10px));
-  margin-bottom: var(--ion-space-400, var(--ion-scale-400, 16px));
+  margin-top: var(--token-space-250, var(--token-scale-250, 10px));
+  margin-bottom: var(--token-space-400, var(--token-scale-400, 16px));
 }
 
 :host(.in-item.range-label-placement-stacked) .native-wrapper {
-  margin-bottom: var(--ion-space-0, var(--ion-scale-0, 0px));
+  margin-bottom: var(--token-space-0, var(--token-scale-0, 0px));
 }
 
 .range-knob-handle.ion-focused .range-knob {
-  outline-offset: var(--ion-border-size-050, var(--ion-scale-050, 2px));
-  outline: var(--ion-border-size-050, var(--ion-scale-050, 2px)) var(--ion-border-style-solid, solid) var(--ion-border-focus-default, var(--ion-primitives-blue-400, #b5c0f7));
+  outline-offset: var(--token-border-size-050, var(--token-scale-050, 2px));
+  outline: var(--token-border-size-050, var(--token-scale-050, 2px)) var(--token-border-style-solid, solid) var(--token-border-focus-default, var(--token-primitives-blue-400, #b5c0f7));
 }
 
 .range-knob-handle.ion-activated .range-knob,
 .range-knob-handle.range-knob-pressed .range-knob {
-  background: var(--ion-bg-input-press, var(--ion-primitives-neutral-200, #efefef));
+  background: var(--token-bg-input-press, var(--token-primitives-neutral-200, #efefef));
 }

package/dist/collection/components/ripple-effect/ripple-effect.ionic.css

@@ -123,9 +123,7 @@
  * @param pixels - Value in pixels to be converted (i.e. px)
  * @param context (optional) - Baseline value
  */
-/*
-Do not edit directly, this file was auto-generated.
-*/ /**
+/**
  * A heuristic that applies CSS to tablet
  * viewports.
  *
@@ -190,7 +188,7 @@ Do not edit directly, this file was auto-generated.
 
 @keyframes rippleAnimation {
   from {
-    animation-timing-function: var(--ion-transition-curve-expressive, cubic-bezier(0.4, 0, 0.2, 1));
+    animation-timing-function: var(--token-transition-curve-expressive, cubic-bezier(0.4, 0, 0.2, 1));
     transform: scale(1);
   }
   to {

package/dist/collection/components/row/row.css

@@ -143,8 +143,10 @@
  * }
  */
 :host {
-  --ion-grid-gap: 0px;
   display: flex;
   flex-wrap: wrap;
+  /**
+   * @prop --ion-grid-gap: The gap between grid items
+   */
   gap: var(--ion-grid-gap, 0px);
 }