@tylertech/forge 3.13.1 → 3.14.0-dev.0

package/dist/checkbox/forge-checkbox.css

@@ -1,285 +1,6 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-/* prettier-ignore */
-.forge-checkbox {
-  --_checkbox-primary-color: var(--forge-checkbox-primary-color, var(--forge-theme-tertiary, #3d5afe));
-  --_checkbox-size: var(--forge-checkbox-size, 16px);
-  --_checkbox-border-width: var(--forge-checkbox-border-width, var(--forge-border-medium, 2px));
-  --_checkbox-icon-color: var(--forge-checkbox-icon-color, var(--forge-theme-on-tertiary, #ffffff));
-  --_checkbox-state-layer-size: var(--forge-checkbox-state-layer-size, 40px);
-  --_checkbox-state-layer-dense-size: var(--forge-checkbox-state-layer-dense-size, 24px);
-  --_checkbox-background: var(--forge-checkbox-background, var(--forge-theme-surface, #ffffff));
-  --_checkbox-width: var(--forge-checkbox-width, var(--_checkbox-size));
-  --_checkbox-height: var(--forge-checkbox-height, var(--_checkbox-size));
-  --_checkbox-unchecked-border-width: var(--forge-checkbox-unchecked-border-width, var(--_checkbox-border-width));
-  --_checkbox-unchecked-border-color: var(--forge-checkbox-unchecked-border-color, var(--forge-theme-surface-container-high, #9e9e9e));
-  --_checkbox-shape: var(--forge-checkbox-shape, calc(var(--forge-shape-small, 2px) * var(--forge-shape-factor, 1)));
-  --_checkbox-elevation: var(--forge-checkbox-elevation, 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12));
-  --_checkbox-checked-background: var(--forge-checkbox-checked-background, var(--_checkbox-primary-color));
-  --_checkbox-checked-border-width: var(--forge-checkbox-checked-border-width, var(--_checkbox-border-width));
-  --_checkbox-checked-border-color: var(--forge-checkbox-checked-border-color, var(--_checkbox-checked-background));
-  --_checkbox-icon-checked-color: var(--forge-checkbox-icon-checked-color, var(--_checkbox-icon-color));
-  --_checkbox-icon-indeterminate-color: var(--forge-checkbox-icon-indeterminate-color, var(--_checkbox-icon-color));
-  --_checkbox-icon-stroke-width: var(--forge-checkbox-icon-stroke-width, 4px);
-  --_checkbox-gap: var(--forge-checkbox-gap, 0);
-  --_checkbox-justify: var(--forge-checkbox-justify, start);
-  --_checkbox-align: var(--forge-checkbox-align, center);
-  --_checkbox-direction: var(--forge-checkbox-direction, initial);
-  --_checkbox-state-layer-width: var(--forge-checkbox-state-layer-width, var(--_checkbox-state-layer-size));
-  --_checkbox-state-layer-height: var(--forge-checkbox-state-layer-height, var(--_checkbox-state-layer-size));
-  --_checkbox-state-layer-checked-color: var(--forge-checkbox-state-layer-checked-color, var(--_checkbox-primary-color));
-  --_checkbox-state-layer-unchecked-color: var(--forge-checkbox-state-layer-unchecked-color, var(--_checkbox-color));
-  --_checkbox-state-layer-shape: var(--forge-checkbox-state-layer-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));
-  --_checkbox-dense-gap: var(--forge-checkbox-dense-gap, 8px);
-  --_checkbox-state-layer-dense-width: var(--forge-checkbox-state-layer-dense-width, var(--_checkbox-state-layer-dense-size));
-  --_checkbox-state-layer-dense-height: var(--forge-checkbox-state-layer-dense-height, var(--_checkbox-state-layer-dense-size));
-  --_checkbox-disabled-opacity: var(--forge-checkbox-disabled-opacity, 0.38);
-  --_checkbox-animation-duration: var(--forge-checkbox-animation-duration, var(--forge-animation-duration-short2, 100ms));
-  --_checkbox-background-animation-timing: var(--forge-checkbox-background-animation-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));
-  --_checkbox-icon-animation-timing: var(--forge-checkbox-icon-animation-timing, var(--forge-animation-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)));
-}
-
-.forge-checkbox {
-  outline: none;
-}
-.forge-checkbox:has(input[type=checkbox]:focus-visible)::after {
-  --_focus-indicator-display: var(--forge-focus-indicator-display, flex);
-  --_focus-indicator-width: var(--forge-focus-indicator-width, var(--forge-border-medium, 2px));
-  --_focus-indicator-active-width: var(--forge-focus-indicator-active-width, 6px);
-  --_focus-indicator-color: var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));
-  --_focus-indicator-shape: var(--forge-focus-indicator-shape, calc(var(--forge-shape-extra-small, 1px) * var(--forge-shape-factor, 1)));
-  --_focus-indicator-duration: var(--forge-focus-indicator-duration, var(--forge-animation-duration-long4, 600ms));
-  --_focus-indicator-easing: var(--forge-focus-indicator-easing, var(--forge-animation-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)));
-  --_focus-indicator-shape-start-start: var(--forge-focus-indicator-shape-start-start, var(--_focus-indicator-shape));
-  --_focus-indicator-shape-start-end: var(--forge-focus-indicator-shape-start-end, var(--_focus-indicator-shape));
-  --_focus-indicator-shape-end-end: var(--forge-focus-indicator-shape-end-end, var(--_focus-indicator-shape));
-  --_focus-indicator-shape-end-start: var(--forge-focus-indicator-shape-end-start, var(--_focus-indicator-shape));
-  --_focus-indicator-outward-offset: var(--forge-focus-indicator-outward-offset, var(--forge-spacing-xxsmall, 4px));
-  --_focus-indicator-inward-offset: var(--forge-focus-indicator-inward-offset, 0px);
-  --_focus-indicator-offset-block: var(--forge-focus-indicator-offset-block, 0);
-  --_focus-indicator-offset-inline: var(--forge-focus-indicator-offset-inline, 0);
-}
-.forge-checkbox:has(input[type=checkbox]:focus-visible)::after {
-  animation-delay: 0s, calc(var(--_focus-indicator-duration) * 0.25);
-  animation-duration: calc(var(--_focus-indicator-duration) * 0.25), calc(var(--_focus-indicator-duration) * 0.75);
-  animation-timing-function: var(--_focus-indicator-easing);
-  box-sizing: border-box;
-  color: var(--_focus-indicator-color);
-  display: none;
-  pointer-events: none;
-  position: absolute;
-  margin-block: var(--_focus-indicator-offset-block);
-  margin-inline: var(--_focus-indicator-offset-inline);
-  animation-name: forge-focus-indicator-outward-grow, forge-focus-indicator-outward-shrink;
-  border-end-end-radius: calc(var(--_focus-indicator-shape-end-end) + var(--_focus-indicator-outward-offset));
-  border-end-start-radius: calc(var(--_focus-indicator-shape-end-start) + var(--_focus-indicator-outward-offset));
-  border-start-end-radius: calc(var(--_focus-indicator-shape-start-end) + var(--_focus-indicator-outward-offset));
-  border-start-start-radius: calc(var(--_focus-indicator-shape-start-start) + var(--_focus-indicator-outward-offset));
-  inset: calc(-1 * var(--_focus-indicator-outward-offset));
-  outline: var(--_focus-indicator-width) solid currentColor;
-  content: "";
-  display: block;
-}
-.forge-checkbox {
-  --forge-focus-indicator-shape: 0px;
-  --forge-focus-indicator-outward-offset: 8px;
-  display: inline grid;
-  position: relative;
-  align-items: center;
-  justify-items: center;
-  inline-size: var(--_checkbox-state-layer-width);
-  block-size: var(--_checkbox-state-layer-height);
-}
-.forge-checkbox input[type=checkbox] {
-  appearance: none;
-  grid-column: 1;
-  grid-row: 1;
-  z-index: 20;
-  outline: none;
-  margin: 0;
-  cursor: pointer;
-}
-.forge-checkbox input[type=checkbox]:checked, .forge-checkbox input[type=checkbox]:indeterminate {
-  --forge-state-layer-color: var(--_checkbox-state-layer-checked-color);
-}
-.forge-checkbox input[type=checkbox]:not(:disabled) {
-  --_state-layer-display: var(--forge-state-layer-display, flex);
-  --_state-layer-color: var(--forge-state-layer-color, var(--forge-theme-on-surface, #000000));
-  --_state-layer-hover-color: var(--forge-state-layer-hover-color, var(--_state-layer-color));
-  --_state-layer-hover-opacity: var(--forge-state-layer-hover-opacity, 0.08);
-  --_state-layer-pressed-color: var(--forge-state-layer-pressed-color, var(--_state-layer-color));
-  --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.12);
-  --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 15ms);
-  --_state-layer-pressed-duration: var(--forge-state-layer-pressed-duration, 105ms);
-  --_state-layer-animation-duration: var(--forge-state-layer-animation-duration, 375ms);
-}
-.forge-checkbox input[type=checkbox]:not(:disabled) {
-  opacity: 0;
-  position: absolute;
-  backface-visibility: hidden;
-  transform: translateZ(0);
-  background-color: var(--_state-layer-hover-color);
-  inset: 0;
-  transition: opacity var(--_state-layer-hover-duration) linear, background-color var(--_state-layer-hover-duration) linear;
-  --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 100ms);
-  opacity: 0;
-  border-radius: inherit;
-}
-.forge-checkbox input[type=checkbox]:not(:disabled):hover {
-  background-color: var(--_state-layer-hover-color);
-  opacity: var(--_state-layer-hover-opacity);
-}
-.forge-checkbox input[type=checkbox]:not(:disabled):active {
-  opacity: var(--_state-layer-pressed-opacity);
-  transition-duration: var(--_state-layer-pressed-duration);
-  --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.18);
-}
-.forge-checkbox input[type=checkbox]:not(:disabled) {
-  border-radius: var(--_checkbox-state-layer-shape) !important;
-}
-.forge-checkbox__icon {
-  display: none;
-  grid-column: 1;
-  grid-row: 1;
-  block-size: calc(var(--_checkbox-height) - 2 * var(--_checkbox-checked-border-width));
-  inline-size: calc(var(--_checkbox-width) - 2 * var(--_checkbox-checked-border-width));
-  pointer-events: none;
-}
-.forge-checkbox__icon--checked {
-  background-color: none;
-}
-.forge-checkbox__icon--indeterminate {
-  background-color: none;
-}
-.forge-checkbox__icon::before {
-  display: block;
-  block-size: 100%;
-  inline-size: 100%;
-  background-color: var(--_checkbox-icon-checked-color);
-  content: "";
-  translate: -100% 0;
-  transition-property: translate;
-  transition-duration: var(--_checkbox-animation-duration);
-  transition-timing-function: var(--_checkbox-icon-animation-timing);
-  transition-delay: var(--_checkbox-animation-duration);
-}
-.forge-checkbox::before {
-  position: relative;
-  align-items: center;
-  justify-content: center;
-  display: flex;
-  transition-property: background, border-width, border-color;
-  transition-duration: var(--_checkbox-animation-duration);
-  transition-timing-function: var(--_checkbox-background-animation-timing);
-  box-shadow: var(--_checkbox-elevation);
-  border-style: solid;
-  border-width: var(--_checkbox-unchecked-border-width);
-  border-color: var(--_checkbox-unchecked-border-color);
-  border-radius: var(--_checkbox-shape);
-  box-sizing: border-box;
-  block-size: var(--_checkbox-height);
-  inline-size: var(--_checkbox-width);
-  background: var(--_checkbox-background);
-  display: block;
-  grid-column: 1;
-  grid-row: 1;
-  line-height: 0;
-  content: "";
-}
-.forge-checkbox:has(input[type=checkbox]:checked)::before {
-  border-style: solid;
-  border-width: var(--_checkbox-checked-border-width);
-  border-color: var(--_checkbox-checked-border-color);
-  background: var(--_checkbox-checked-background);
-}
-.forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon::before {
-  translate: 0;
-}
-@starting-style {
-  .forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon::before {
-    translate: -100% 0;
-  }
-}
-.forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon {
-  display: block;
-  clip-path: polygon(13.101048% 47.903832%, 1.316772% 59.688108%, 33.7527% 92.84076%, 100.858068% 25.018668%, 89.073792% 13.234392%, 33.7527% 68.3388%);
-}
-.forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon--checked {
-  clip-path: none;
-}
-.forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon--checked::before {
-  content: none;
-}
-.forge-checkbox:has(input[type=checkbox]:indeterminate)::before {
-  border-style: solid;
-  border-width: var(--_checkbox-checked-border-width);
-  border-color: var(--_checkbox-checked-border-color);
-  background: var(--_checkbox-checked-background);
-}
-.forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon::before {
-  translate: 0;
-}
-@starting-style {
-  .forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon::before {
-    translate: -100% 0;
-  }
-}
-.forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon {
-  display: block;
-  clip-path: polygon(8.334% 41.67%, 8.334% 58.338%, 91.674% 58.338%, 91.674% 41.67%);
-}
-.forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon--indeterminate {
-  clip-path: none;
-}
-.forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon--indeterminate::before {
-  content: none;
-}
-.forge-checkbox:has(input[type=checkbox]:disabled) {
-  opacity: var(--_checkbox-disabled-opacity);
-  cursor: not-allowed;
-}
-@keyframes forge-focus-indicator-outward-grow {
-  from {
-    outline-width: 0;
-  }
-  to {
-    outline-width: var(--_focus-indicator-active-width);
-  }
-}
-@keyframes forge-focus-indicator-outward-shrink {
-  from {
-    outline-width: var(--_focus-indicator-active-width);
-  }
-}
-@keyframes forge-focus-indicator-inward-grow {
-  from {
-    border-width: 0;
-  }
-  to {
-    border-width: var(--_focus-indicator-active-width);
-  }
-}
-@keyframes forge-focus-indicator-inward-shrink {
-  from {
-    border-width: var(--_focus-indicator-active-width);
-  }
-}
-.forge-checkbox:has(input[type=checkbox]:focus-visible)::after {
-  position: relative;
-  grid-column: 1;
-  grid-row: 1;
-  inset: 0;
-  /* 
-    We "fake" the pseudo-element's dimensions here to size the focus indicator without
-    overriding any of its calculations, taking the width of its outline into account
-  */
-  padding-inline: calc(var(--_checkbox-width) - var(--_focus-indicator-width));
-  padding-block: calc(var(--_checkbox-height) - var(--_focus-indicator-width));
-}
-.forge-checkbox--dense {
-  inline-size: var(--_checkbox-state-layer-dense-width);
-  block-size: var(--_checkbox-state-layer-dense-height);
-}
+.forge-checkbox{--_checkbox-primary-color:var(--forge-checkbox-primary-color, var(--forge-theme-tertiary, #3d5afe));--_checkbox-size:var(--forge-checkbox-size, 16px);--_checkbox-border-width:var(--forge-checkbox-border-width, var(--forge-border-medium, 2px));--_checkbox-icon-color:var(--forge-checkbox-icon-color, var(--forge-theme-on-tertiary, #ffffff));--_checkbox-state-layer-size:var(--forge-checkbox-state-layer-size, 40px);--_checkbox-state-layer-dense-size:var(--forge-checkbox-state-layer-dense-size, 24px);--_checkbox-background:var(--forge-checkbox-background, var(--forge-theme-surface, #ffffff));--_checkbox-width:var(--forge-checkbox-width, var(--_checkbox-size));--_checkbox-height:var(--forge-checkbox-height, var(--_checkbox-size));--_checkbox-unchecked-border-width:var(--forge-checkbox-unchecked-border-width, var(--_checkbox-border-width));--_checkbox-unchecked-border-color:var(--forge-checkbox-unchecked-border-color, var(--forge-theme-outline-medium, #757575));--_checkbox-shape:var(--forge-checkbox-shape, calc(var(--forge-shape-small, 2px) * var(--forge-shape-factor, 1)));--_checkbox-elevation:var(--forge-checkbox-elevation, 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12));--_checkbox-checked-background:var(--forge-checkbox-checked-background, var(--_checkbox-primary-color));--_checkbox-checked-border-width:var(--forge-checkbox-checked-border-width, var(--_checkbox-border-width));--_checkbox-checked-border-color:var(--forge-checkbox-checked-border-color, var(--_checkbox-checked-background));--_checkbox-icon-checked-color:var(--forge-checkbox-icon-checked-color, var(--_checkbox-icon-color));--_checkbox-icon-indeterminate-color:var(--forge-checkbox-icon-indeterminate-color, var(--_checkbox-icon-color));--_checkbox-icon-stroke-width:var(--forge-checkbox-icon-stroke-width, 4px);--_checkbox-gap:var(--forge-checkbox-gap, 0);--_checkbox-justify:var(--forge-checkbox-justify, start);--_checkbox-align:var(--forge-checkbox-align, center);--_checkbox-direction:var(--forge-checkbox-direction, initial);--_checkbox-state-layer-width:var(--forge-checkbox-state-layer-width, var(--_checkbox-state-layer-size));--_checkbox-state-layer-height:var(--forge-checkbox-state-layer-height, var(--_checkbox-state-layer-size));--_checkbox-state-layer-checked-color:var(--forge-checkbox-state-layer-checked-color, var(--_checkbox-primary-color));--_checkbox-state-layer-unchecked-color:var(--forge-checkbox-state-layer-unchecked-color, var(--_checkbox-color));--_checkbox-state-layer-shape:var(--forge-checkbox-state-layer-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));--_checkbox-dense-gap:var(--forge-checkbox-dense-gap, 8px);--_checkbox-state-layer-dense-width:var(--forge-checkbox-state-layer-dense-width, var(--_checkbox-state-layer-dense-size));--_checkbox-state-layer-dense-height:var(--forge-checkbox-state-layer-dense-height, var(--_checkbox-state-layer-dense-size));--_checkbox-disabled-opacity:var(--forge-checkbox-disabled-opacity, 0.38);--_checkbox-animation-duration:var(--forge-checkbox-animation-duration, var(--forge-animation-duration-short2, 100ms));--_checkbox-background-animation-timing:var(--forge-checkbox-background-animation-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));--_checkbox-icon-animation-timing:var(--forge-checkbox-icon-animation-timing, var(--forge-animation-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)))}.forge-checkbox{outline:none}.forge-checkbox:has(input[type=checkbox]:focus-visible)::after{--_focus-indicator-display:var(--forge-focus-indicator-display, flex);--_focus-indicator-width:var(--forge-focus-indicator-width, var(--forge-border-medium, 2px));--_focus-indicator-active-width:var(--forge-focus-indicator-active-width, 6px);--_focus-indicator-color:var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));--_focus-indicator-shape:var(--forge-focus-indicator-shape, calc(var(--forge-shape-extra-small, 1px) * var(--forge-shape-factor, 1)));--_focus-indicator-duration:var(--forge-focus-indicator-duration, var(--forge-animation-duration-long4, 600ms));--_focus-indicator-easing:var(--forge-focus-indicator-easing, var(--forge-animation-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)));--_focus-indicator-shape-start-start:var(--forge-focus-indicator-shape-start-start, var(--_focus-indicator-shape));--_focus-indicator-shape-start-end:var(--forge-focus-indicator-shape-start-end, var(--_focus-indicator-shape));--_focus-indicator-shape-end-end:var(--forge-focus-indicator-shape-end-end, var(--_focus-indicator-shape));--_focus-indicator-shape-end-start:var(--forge-focus-indicator-shape-end-start, var(--_focus-indicator-shape));--_focus-indicator-outward-offset:var(--forge-focus-indicator-outward-offset, var(--forge-spacing-xxsmall, 4px));--_focus-indicator-inward-offset:var(--forge-focus-indicator-inward-offset, 0px);--_focus-indicator-offset-block:var(--forge-focus-indicator-offset-block, 0);--_focus-indicator-offset-inline:var(--forge-focus-indicator-offset-inline, 0)}.forge-checkbox:has(input[type=checkbox]:focus-visible)::after{animation-delay:0s,calc(var(--_focus-indicator-duration)*.25);animation-duration:calc(var(--_focus-indicator-duration)*.25),calc(var(--_focus-indicator-duration)*.75);animation-timing-function:var(--_focus-indicator-easing);box-sizing:border-box;color:var(--_focus-indicator-color);display:none;pointer-events:none;position:absolute;margin-block:var(--_focus-indicator-offset-block);margin-inline:var(--_focus-indicator-offset-inline);animation-name:forge-focus-indicator-outward-grow,forge-focus-indicator-outward-shrink;border-end-end-radius:calc(var(--_focus-indicator-shape-end-end) + var(--_focus-indicator-outward-offset));border-end-start-radius:calc(var(--_focus-indicator-shape-end-start) + var(--_focus-indicator-outward-offset));border-start-end-radius:calc(var(--_focus-indicator-shape-start-end) + var(--_focus-indicator-outward-offset));border-start-start-radius:calc(var(--_focus-indicator-shape-start-start) + var(--_focus-indicator-outward-offset));inset:calc(-1*var(--_focus-indicator-outward-offset));outline:var(--_focus-indicator-width) solid currentColor;content:"";display:block}.forge-checkbox{--forge-focus-indicator-shape: 0px;--forge-focus-indicator-outward-offset: 8px;display:inline grid;position:relative;align-items:center;justify-items:center;inline-size:var(--_checkbox-state-layer-width);block-size:var(--_checkbox-state-layer-height)}.forge-checkbox input[type=checkbox]{appearance:none;grid-column:1;grid-row:1;z-index:20;outline:none;margin:0;cursor:pointer}.forge-checkbox input[type=checkbox]:checked,.forge-checkbox input[type=checkbox]:indeterminate{--forge-state-layer-color: var(--_checkbox-state-layer-checked-color)}.forge-checkbox input[type=checkbox]:not(:disabled){--_state-layer-display:var(--forge-state-layer-display, flex);--_state-layer-color:var(--forge-state-layer-color, var(--forge-theme-on-surface, #000000));--_state-layer-hover-color:var(--forge-state-layer-hover-color, var(--_state-layer-color));--_state-layer-hover-opacity:var(--forge-state-layer-hover-opacity, 0.08);--_state-layer-pressed-color:var(--forge-state-layer-pressed-color, var(--_state-layer-color));--_state-layer-pressed-opacity:var(--forge-state-layer-pressed-opacity, 0.12);--_state-layer-hover-duration:var(--forge-state-layer-hover-duration, 15ms);--_state-layer-pressed-duration:var(--forge-state-layer-pressed-duration, 105ms);--_state-layer-animation-duration:var(--forge-state-layer-animation-duration, 375ms)}.forge-checkbox input[type=checkbox]:not(:disabled){opacity:0;position:absolute;backface-visibility:hidden;transform:translateZ(0);background-color:var(--_state-layer-hover-color);inset:0;transition:opacity var(--_state-layer-hover-duration) linear,background-color var(--_state-layer-hover-duration) linear;--_state-layer-hover-duration:var(--forge-state-layer-hover-duration, 100ms);opacity:0;border-radius:inherit}.forge-checkbox input[type=checkbox]:not(:disabled):hover{background-color:var(--_state-layer-hover-color);opacity:var(--_state-layer-hover-opacity)}.forge-checkbox input[type=checkbox]:not(:disabled):active{opacity:var(--_state-layer-pressed-opacity);transition-duration:var(--_state-layer-pressed-duration);--_state-layer-pressed-opacity:var(--forge-state-layer-pressed-opacity, 0.18)}.forge-checkbox input[type=checkbox]:not(:disabled){border-radius:var(--_checkbox-state-layer-shape) !important}.forge-checkbox__icon{display:none;grid-column:1;grid-row:1;block-size:calc(var(--_checkbox-height) - 2*var(--_checkbox-checked-border-width));inline-size:calc(var(--_checkbox-width) - 2*var(--_checkbox-checked-border-width));pointer-events:none}.forge-checkbox__icon--checked{background-color:none}.forge-checkbox__icon--indeterminate{background-color:none}.forge-checkbox__icon::before{display:block;block-size:100%;inline-size:100%;background-color:var(--_checkbox-icon-checked-color);content:"";translate:-100% 0;transition-property:translate;transition-duration:var(--_checkbox-animation-duration);transition-timing-function:var(--_checkbox-icon-animation-timing);transition-delay:var(--_checkbox-animation-duration)}.forge-checkbox::before{position:relative;align-items:center;justify-content:center;display:flex;transition-property:background,border-width,border-color;transition-duration:var(--_checkbox-animation-duration);transition-timing-function:var(--_checkbox-background-animation-timing);box-shadow:var(--_checkbox-elevation);border-style:solid;border-width:var(--_checkbox-unchecked-border-width);border-color:var(--_checkbox-unchecked-border-color);border-radius:var(--_checkbox-shape);box-sizing:border-box;block-size:var(--_checkbox-height);inline-size:var(--_checkbox-width);background:var(--_checkbox-background);display:block;grid-column:1;grid-row:1;line-height:0;content:""}.forge-checkbox:has(input[type=checkbox]:checked)::before{border-style:solid;border-width:var(--_checkbox-checked-border-width);border-color:var(--_checkbox-checked-border-color);background:var(--_checkbox-checked-background)}.forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon::before{translate:0}@starting-style{.forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon::before{translate:-100% 0}}.forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon{display:block;clip-path:polygon(13.101048% 47.903832%, 1.316772% 59.688108%, 33.7527% 92.84076%, 100.858068% 25.018668%, 89.073792% 13.234392%, 33.7527% 68.3388%)}.forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon--checked{clip-path:none}.forge-checkbox:has(input[type=checkbox]:checked) .forge-checkbox__icon--checked::before{content:none}.forge-checkbox:has(input[type=checkbox]:indeterminate)::before{border-style:solid;border-width:var(--_checkbox-checked-border-width);border-color:var(--_checkbox-checked-border-color);background:var(--_checkbox-checked-background)}.forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon::before{translate:0}@starting-style{.forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon::before{translate:-100% 0}}.forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon{display:block;clip-path:polygon(8.334% 41.67%, 8.334% 58.338%, 91.674% 58.338%, 91.674% 41.67%)}.forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon--indeterminate{clip-path:none}.forge-checkbox:has(input[type=checkbox]:indeterminate) .forge-checkbox__icon--indeterminate::before{content:none}.forge-checkbox:has(input[type=checkbox]:disabled){opacity:var(--_checkbox-disabled-opacity);cursor:not-allowed}@keyframes forge-focus-indicator-outward-grow{from{outline-width:0}to{outline-width:var(--_focus-indicator-active-width)}}@keyframes forge-focus-indicator-outward-shrink{from{outline-width:var(--_focus-indicator-active-width)}}@keyframes forge-focus-indicator-inward-grow{from{border-width:0}to{border-width:var(--_focus-indicator-active-width)}}@keyframes forge-focus-indicator-inward-shrink{from{border-width:var(--_focus-indicator-active-width)}}.forge-checkbox:has(input[type=checkbox]:focus-visible)::after{position:relative;grid-column:1;grid-row:1;inset:0;padding-inline:calc(var(--_checkbox-width) - var(--_focus-indicator-width));padding-block:calc(var(--_checkbox-height) - var(--_focus-indicator-width))}.forge-checkbox--dense{inline-size:var(--_checkbox-state-layer-dense-width);block-size:var(--_checkbox-state-layer-dense-height)}

package/dist/chips/forge-chips.css

@@ -1,247 +1,6 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-/* prettier-ignore */
-.forge-chip-set {
-  --_chip-set-spacing: var(--forge-chip-set-spacing, var(--forge-spacing-xsmall, 8px));
-}
-
-.forge-chip-set {
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--_chip-set-spacing);
-}
-.forge-chip-set--vertical {
-  flex-direction: column;
-}
-
-.forge-chip {
-  --_chip-background: var(--forge-chip-background, transparent);
-  --_chip-color: var(--forge-chip-color, var(--forge-theme-primary, #3f51b5));
-  --_chip-shape: var(--forge-chip-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));
-  --_chip-spacing: var(--forge-chip-spacing, var(--forge-spacing-xsmall, 8px));
-  --_chip-height: var(--forge-chip-height, 32px);
-  --_chip-padding-inline: var(--forge-chip-padding-inline, var(--forge-spacing-small, 12px));
-  --_chip-padding-block: var(--forge-chip-padding-block, 0);
-  --_chip-cursor: var(--forge-chip-cursor, pointer);
-  --_chip-icon-font-size: var(--forge-chip-icon-font-size, 1.5rem);
-  --_chip-focus-indicator-color: var(--forge-chip-focus-indicator-color, var(--_chip-color));
-  --_chip-disabled-opacity: var(--forge-chip-disabled-opacity, 0.38);
-  --_chip-disabled-cursor: var(--forge-chip-disabled-cursor, not-allowed);
-  --_chip-dense-height: var(--forge-chip-dense-height, 24px);
-  --_chip-dense-padding-inline: var(--forge-chip-dense-padding-inline, var(--forge-spacing-xsmall, 8px));
-  --_chip-dense-spacing: var(--forge-chip-dense-spacing, var(--forge-spacing-xxsmall, 4px));
-  --_chip-dense-font-size: var(--forge-chip-dense-font-size, 0.75rem);
-  --_chip-dense-font-weight: var(--forge-chip-dense-font-weight, normal);
-  --_chip-dense-focus-indicator-offset: var(--forge-chip-dense-focus-indicator-offset, var(--forge-spacing-xxxsmall, 2px));
-  --_chip-dense-icon-font-size: var(--forge-chip-dense-icon-font-size, 1.25rem);
-  --_chip-remove-button-spacing: var(--forge-chip-remove-button-spacing, var(--forge-spacing-xsmall, 8px) var(--forge-spacing-xxsmall, 4px));
-  --_chip-remove-button-height-dense: var(--forge-chip-remove-button-height-dense, 18px);
-  --_chip-remove-button-icon-size-dense: var(--forge-chip-remove-button-icon-size-dense, 16px);
-  --_chip-remove-button-spacing-dense: var(--forge-chip-remove-button-spacing-dense, 0 var(--forge-spacing-xxxsmall, 2px));
-  --_chip-selected-background: var(--forge-chip-selected-background, var(--forge-theme-primary, #3f51b5));
-  --_chip-selected-color: var(--forge-chip-selected-color, var(--forge-theme-on-primary, #ffffff));
-  --_chip-invalid-color: var(--forge-chip-invalid-color, var(--forge-theme-error, #b00020));
-  --_chip-invalid-selected-background: var(--forge-chip-invalid-selected-background, var(--forge-theme-error, #b00020));
-  --_chip-invalid-selected-color: var(--forge-chip-invalid-selected-color, var(--forge-theme-on-error, #ffffff));
-  --_chip-border-width: var(--forge-chip-border-width, var(--forge-border-thin, 1px));
-  --_chip-border-style: var(--forge-chip-border-style, solid);
-  --_chip-border-color: var(--forge-chip-border-color, var(--_chip-color));
-  --_chip-field-background: var(--forge-chip-field-background, var(--forge-theme-surface-container-low, #ebebeb));
-  --_chip-field-color: var(--forge-chip-field-color, var(--forge-theme-on-surface-container-low, #000000));
-  --_chip-field-shape: var(--forge-chip-field-shape, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));
-  --_chip-field-border-color: var(--forge-chip-field-border-color, transparent);
-  --_chip-field-cursor: var(--forge-chip-field-cursor, default);
-  --_chip-checkmark-size: var(--forge-chip-checkmark-size, 1.25em);
-  --_chip-checkmark-color: var(--forge-chip-checkmark-color, var(--_chip-color));
-  --_chip-checkmark-spacing: var(--forge-chip-checkmark-spacing, var(--forge-spacing-xsmall, 8px));
-  --_chip-avatar-size: var(--forge-chip-avatar-size, 24px);
-  --_chip-avatar-size-dense: var(--forge-chip-avatar-size-dense, 18px);
-  --_chip-avatar-font-size: var(--forge-chip-avatar-font-size, 0.75rem);
-  --_chip-avatar-font-size-dense: var(--forge-chip-avatar-font-size-dense, 0.5rem);
-  --_chip-avatar-spacing: var(--forge-chip-avatar-spacing, calc(var(--forge-spacing-xsmall, 8px) * -1));
-  --_chip-avatar-spacing-dense: var(--forge-chip-avatar-spacing-dense, calc(var(--forge-spacing-xxsmall, 4px) * -1));
-  --_chip-transition-duration: var(--forge-chip-transition-duration, var(--forge-animation-duration-short3, 150ms));
-  --_chip-transition-easing: var(--forge-chip-transition-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));
-  --_chip-checkmark-transition-delay: var(--forge-chip-checkmark-transition-delay, 50ms);
-}
-
-.forge-chip {
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  font-family: var(--forge-typography-button-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));
-  font-size: var(--forge-typography-button-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-button-font-size-scale, 0.875)));
-  font-weight: var(--forge-typography-button-font-weight, 500);
-  line-height: var(--forge-typography-button-line-height, normal);
-  letter-spacing: var(--forge-typography-button-letter-spacing, 0.0714285714em);
-  text-transform: var(--forge-typography-button-text-transform, inherit);
-  text-decoration: var(--forge-typography-button-text-decoration, inherit);
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  gap: var(--_chip-spacing);
-  box-sizing: border-box;
-  height: 100%;
-  padding-inline: var(--_chip-padding-inline);
-  padding-block: var(--_chip-padding-block);
-  cursor: var(--_chip-cursor);
-  z-index: 0;
-  text-decoration: none;
-  border: none;
-  background: inherit;
-  color: inherit;
-  -webkit-tap-highlight-color: transparent;
-  border-radius: var(--_chip-shape);
-  outline: none;
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  box-sizing: border-box;
-  height: var(--_chip-height);
-  border-width: var(--_chip-border-width);
-  border-style: var(--_chip-border-style);
-  border-color: var(--_chip-border-color);
-  border-radius: var(--_chip-shape);
-  background: var(--_chip-background);
-  color: var(--_chip-color);
-  transition-property: background-color, color;
-  transition-duration: var(--_chip-transition-duration);
-  transition-timing-function: var(--_chip-transition-easing);
-}
-.forge-chip:not(:disabled) {
-  --_state-layer-display: var(--forge-state-layer-display, flex);
-  --_state-layer-color: var(--forge-state-layer-color, var(--forge-theme-on-surface, #000000));
-  --_state-layer-hover-color: var(--forge-state-layer-hover-color, var(--_state-layer-color));
-  --_state-layer-hover-opacity: var(--forge-state-layer-hover-opacity, 0.08);
-  --_state-layer-pressed-color: var(--forge-state-layer-pressed-color, var(--_state-layer-color));
-  --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.12);
-  --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 15ms);
-  --_state-layer-pressed-duration: var(--forge-state-layer-pressed-duration, 105ms);
-  --_state-layer-animation-duration: var(--forge-state-layer-animation-duration, 375ms);
-}
-.forge-chip:not(:disabled)::before {
-  opacity: 0;
-  position: absolute;
-  backface-visibility: hidden;
-  transform: translateZ(0);
-  background-color: var(--_state-layer-hover-color);
-  inset: 0;
-  transition: opacity var(--_state-layer-hover-duration) linear, background-color var(--_state-layer-hover-duration) linear;
-  --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 100ms);
-  content: "";
-  opacity: 0;
-  border-radius: inherit;
-}
-.forge-chip:not(:disabled):hover::before {
-  background-color: var(--_state-layer-hover-color);
-  opacity: var(--_state-layer-hover-opacity);
-}
-.forge-chip:not(:disabled):active::before {
-  opacity: var(--_state-layer-pressed-opacity);
-  transition-duration: var(--_state-layer-pressed-duration);
-  --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.18);
-}
-.forge-chip:not(:disabled) {
-  --forge-state-layer-color: var(--_chip-color);
-}
-@keyframes forge-focus-indicator-outward-grow {
-  from {
-    outline-width: 0;
-  }
-  to {
-    outline-width: var(--_focus-indicator-active-width);
-  }
-}
-@keyframes forge-focus-indicator-outward-shrink {
-  from {
-    outline-width: var(--_focus-indicator-active-width);
-  }
-}
-@keyframes forge-focus-indicator-inward-grow {
-  from {
-    border-width: 0;
-  }
-  to {
-    border-width: var(--_focus-indicator-active-width);
-  }
-}
-@keyframes forge-focus-indicator-inward-shrink {
-  from {
-    border-width: var(--_focus-indicator-active-width);
-  }
-}
-.forge-chip:not(:disabled) {
-  outline: none;
-}
-.forge-chip:not(:disabled):focus-visible::after {
-  --_focus-indicator-display: var(--forge-focus-indicator-display, flex);
-  --_focus-indicator-width: var(--forge-focus-indicator-width, var(--forge-border-medium, 2px));
-  --_focus-indicator-active-width: var(--forge-focus-indicator-active-width, 6px);
-  --_focus-indicator-color: var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));
-  --_focus-indicator-shape: var(--forge-focus-indicator-shape, calc(var(--forge-shape-extra-small, 1px) * var(--forge-shape-factor, 1)));
-  --_focus-indicator-duration: var(--forge-focus-indicator-duration, var(--forge-animation-duration-long4, 600ms));
-  --_focus-indicator-easing: var(--forge-focus-indicator-easing, var(--forge-animation-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)));
-  --_focus-indicator-shape-start-start: var(--forge-focus-indicator-shape-start-start, var(--_focus-indicator-shape));
-  --_focus-indicator-shape-start-end: var(--forge-focus-indicator-shape-start-end, var(--_focus-indicator-shape));
-  --_focus-indicator-shape-end-end: var(--forge-focus-indicator-shape-end-end, var(--_focus-indicator-shape));
-  --_focus-indicator-shape-end-start: var(--forge-focus-indicator-shape-end-start, var(--_focus-indicator-shape));
-  --_focus-indicator-outward-offset: var(--forge-focus-indicator-outward-offset, var(--forge-spacing-xxsmall, 4px));
-  --_focus-indicator-inward-offset: var(--forge-focus-indicator-inward-offset, 0px);
-  --_focus-indicator-offset-block: var(--forge-focus-indicator-offset-block, 0);
-  --_focus-indicator-offset-inline: var(--forge-focus-indicator-offset-inline, 0);
-}
-.forge-chip:not(:disabled):focus-visible::after {
-  animation-delay: 0s, calc(var(--_focus-indicator-duration) * 0.25);
-  animation-duration: calc(var(--_focus-indicator-duration) * 0.25), calc(var(--_focus-indicator-duration) * 0.75);
-  animation-timing-function: var(--_focus-indicator-easing);
-  box-sizing: border-box;
-  color: var(--_focus-indicator-color);
-  display: none;
-  pointer-events: none;
-  position: absolute;
-  margin-block: var(--_focus-indicator-offset-block);
-  margin-inline: var(--_focus-indicator-offset-inline);
-  animation-name: forge-focus-indicator-outward-grow, forge-focus-indicator-outward-shrink;
-  border-end-end-radius: calc(var(--_focus-indicator-shape-end-end) + var(--_focus-indicator-outward-offset));
-  border-end-start-radius: calc(var(--_focus-indicator-shape-end-start) + var(--_focus-indicator-outward-offset));
-  border-start-end-radius: calc(var(--_focus-indicator-shape-start-end) + var(--_focus-indicator-outward-offset));
-  border-start-start-radius: calc(var(--_focus-indicator-shape-start-start) + var(--_focus-indicator-outward-offset));
-  inset: calc(-1 * var(--_focus-indicator-outward-offset));
-  outline: var(--_focus-indicator-width) solid currentColor;
-  content: "";
-  display: block;
-}
-.forge-chip:not(:disabled) {
-  --forge-focus-indicator-color: var(--_chip-color);
-  --forge-focus-indicator-shape: var(--_chip-shape);
-}
-.forge-chip--field {
-  --_chip-background: var(--_chip-field-background);
-  --_chip-color: var(--_chip-field-color);
-  --_chip-border-color: var(--_chip-field-border-color);
-  --_chip-shape: var(--_chip-field-shape);
-  --_chip-cursor: var(--_chip-field-cursor);
-}
-.forge-chip--invalid:not(:disabled) {
-  --_chip-color: var(--_chip-invalid-color);
-}
-.forge-chip--selected:not(:disabled) {
-  --_chip-background: var(--_chip-selected-background);
-  --_chip-color: var(--_chip-selected-color);
-  --forge-focus-indicator-color: var(--_chip-background);
-}
-.forge-chip--selected:not(:disabled).forge-chip--invalid {
-  --_chip-background: var(--_chip-invalid-selected-background);
-  --_chip-color: var(--_chip-invalid-selected-color);
-}
-.forge-chip--dense {
-  --_chip-height: var(--_chip-dense-height);
-  --_chip-padding-inline: var(--_chip-dense-padding-inline);
-  --_chip-spacing: var(--_chip-dense-spacing);
-}
-.forge-chip:disabled {
-  cursor: var(--_chip-disabled-cursor);
-  opacity: var(--_chip-disabled-opacity);
-}
+.forge-chip-set{--_chip-set-spacing:var(--forge-chip-set-spacing, var(--forge-spacing-xsmall, 8px))}.forge-chip-set{display:flex;flex-wrap:wrap;gap:var(--_chip-set-spacing)}.forge-chip-set--vertical{flex-direction:column}.forge-chip{--_chip-background:var(--forge-chip-background, transparent);--_chip-color:var(--forge-chip-color, var(--forge-theme-primary, #3f51b5));--_chip-shape:var(--forge-chip-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));--_chip-spacing:var(--forge-chip-spacing, var(--forge-spacing-xsmall, 8px));--_chip-height:var(--forge-chip-height, 32px);--_chip-padding-inline:var(--forge-chip-padding-inline, var(--forge-spacing-small, 12px));--_chip-padding-block:var(--forge-chip-padding-block, 0);--_chip-cursor:var(--forge-chip-cursor, pointer);--_chip-icon-font-size:var(--forge-chip-icon-font-size, 1.5rem);--_chip-focus-indicator-color:var(--forge-chip-focus-indicator-color, var(--_chip-color));--_chip-disabled-opacity:var(--forge-chip-disabled-opacity, 0.38);--_chip-disabled-cursor:var(--forge-chip-disabled-cursor, not-allowed);--_chip-dense-height:var(--forge-chip-dense-height, 24px);--_chip-dense-padding-inline:var(--forge-chip-dense-padding-inline, var(--forge-spacing-xsmall, 8px));--_chip-dense-spacing:var(--forge-chip-dense-spacing, var(--forge-spacing-xxsmall, 4px));--_chip-dense-font-size:var(--forge-chip-dense-font-size, 0.75rem);--_chip-dense-font-weight:var(--forge-chip-dense-font-weight, normal);--_chip-dense-focus-indicator-offset:var(--forge-chip-dense-focus-indicator-offset, var(--forge-spacing-xxxsmall, 2px));--_chip-dense-icon-font-size:var(--forge-chip-dense-icon-font-size, 1.25rem);--_chip-remove-button-spacing:var(--forge-chip-remove-button-spacing, var(--forge-spacing-xsmall, 8px) var(--forge-spacing-xxsmall, 4px));--_chip-remove-button-height-dense:var(--forge-chip-remove-button-height-dense, 18px);--_chip-remove-button-icon-size-dense:var(--forge-chip-remove-button-icon-size-dense, 16px);--_chip-remove-button-spacing-dense:var(--forge-chip-remove-button-spacing-dense, 0 var(--forge-spacing-xxxsmall, 2px));--_chip-selected-background:var(--forge-chip-selected-background, var(--forge-theme-primary, #3f51b5));--_chip-selected-color:var(--forge-chip-selected-color, var(--forge-theme-on-primary, #ffffff));--_chip-invalid-color:var(--forge-chip-invalid-color, var(--forge-theme-error, #b00020));--_chip-invalid-selected-background:var(--forge-chip-invalid-selected-background, var(--forge-theme-error, #b00020));--_chip-invalid-selected-color:var(--forge-chip-invalid-selected-color, var(--forge-theme-on-error, #ffffff));--_chip-border-width:var(--forge-chip-border-width, var(--forge-border-thin, 1px));--_chip-border-style:var(--forge-chip-border-style, solid);--_chip-border-color:var(--forge-chip-border-color, var(--_chip-color));--_chip-field-background:var(--forge-chip-field-background, var(--forge-theme-surface-container-low, #ebebeb));--_chip-field-color:var(--forge-chip-field-color, var(--forge-theme-on-surface-container-low, #000000));--_chip-field-shape:var(--forge-chip-field-shape, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));--_chip-field-border-color:var(--forge-chip-field-border-color, transparent);--_chip-field-cursor:var(--forge-chip-field-cursor, default);--_chip-checkmark-size:var(--forge-chip-checkmark-size, 1.25em);--_chip-checkmark-color:var(--forge-chip-checkmark-color, var(--_chip-color));--_chip-checkmark-spacing:var(--forge-chip-checkmark-spacing, var(--forge-spacing-xsmall, 8px));--_chip-avatar-size:var(--forge-chip-avatar-size, 24px);--_chip-avatar-size-dense:var(--forge-chip-avatar-size-dense, 18px);--_chip-avatar-font-size:var(--forge-chip-avatar-font-size, 0.75rem);--_chip-avatar-font-size-dense:var(--forge-chip-avatar-font-size-dense, 0.5rem);--_chip-avatar-spacing:var(--forge-chip-avatar-spacing, calc(var(--forge-spacing-xsmall, 8px) * -1));--_chip-avatar-spacing-dense:var(--forge-chip-avatar-spacing-dense, calc(var(--forge-spacing-xxsmall, 4px) * -1));--_chip-transition-duration:var(--forge-chip-transition-duration, var(--forge-animation-duration-short3, 150ms));--_chip-transition-easing:var(--forge-chip-transition-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));--_chip-checkmark-transition-delay:var(--forge-chip-checkmark-transition-delay, 50ms)}.forge-chip{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-button-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));font-size:var(--forge-typography-button-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-button-font-size-scale, 0.875)));font-weight:var(--forge-typography-button-font-weight, 500);line-height:var(--forge-typography-button-line-height, normal);letter-spacing:var(--forge-typography-button-letter-spacing, 0.0714285714em);text-transform:var(--forge-typography-button-text-transform, inherit);text-decoration:var(--forge-typography-button-text-decoration, inherit);display:inline-flex;align-items:center;justify-content:center;gap:var(--_chip-spacing);box-sizing:border-box;height:100%;padding-inline:var(--_chip-padding-inline);padding-block:var(--_chip-padding-block);cursor:var(--_chip-cursor);z-index:0;text-decoration:none;border:none;background:inherit;color:inherit;-webkit-tap-highlight-color:rgba(0,0,0,0);border-radius:var(--_chip-shape);outline:none;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;height:var(--_chip-height);border-width:var(--_chip-border-width);border-style:var(--_chip-border-style);border-color:var(--_chip-border-color);border-radius:var(--_chip-shape);background:var(--_chip-background);color:var(--_chip-color);transition-property:background-color,color;transition-duration:var(--_chip-transition-duration);transition-timing-function:var(--_chip-transition-easing)}.forge-chip:not(:disabled){--_state-layer-display:var(--forge-state-layer-display, flex);--_state-layer-color:var(--forge-state-layer-color, var(--forge-theme-on-surface, #000000));--_state-layer-hover-color:var(--forge-state-layer-hover-color, var(--_state-layer-color));--_state-layer-hover-opacity:var(--forge-state-layer-hover-opacity, 0.08);--_state-layer-pressed-color:var(--forge-state-layer-pressed-color, var(--_state-layer-color));--_state-layer-pressed-opacity:var(--forge-state-layer-pressed-opacity, 0.12);--_state-layer-hover-duration:var(--forge-state-layer-hover-duration, 15ms);--_state-layer-pressed-duration:var(--forge-state-layer-pressed-duration, 105ms);--_state-layer-animation-duration:var(--forge-state-layer-animation-duration, 375ms)}.forge-chip:not(:disabled)::before{opacity:0;position:absolute;backface-visibility:hidden;transform:translateZ(0);background-color:var(--_state-layer-hover-color);inset:0;transition:opacity var(--_state-layer-hover-duration) linear,background-color var(--_state-layer-hover-duration) linear;--_state-layer-hover-duration:var(--forge-state-layer-hover-duration, 100ms);content:"";opacity:0;border-radius:inherit}.forge-chip:not(:disabled):hover::before{background-color:var(--_state-layer-hover-color);opacity:var(--_state-layer-hover-opacity)}.forge-chip:not(:disabled):active::before{opacity:var(--_state-layer-pressed-opacity);transition-duration:var(--_state-layer-pressed-duration);--_state-layer-pressed-opacity:var(--forge-state-layer-pressed-opacity, 0.18)}.forge-chip:not(:disabled){--forge-state-layer-color: var(--_chip-color)}@keyframes forge-focus-indicator-outward-grow{from{outline-width:0}to{outline-width:var(--_focus-indicator-active-width)}}@keyframes forge-focus-indicator-outward-shrink{from{outline-width:var(--_focus-indicator-active-width)}}@keyframes forge-focus-indicator-inward-grow{from{border-width:0}to{border-width:var(--_focus-indicator-active-width)}}@keyframes forge-focus-indicator-inward-shrink{from{border-width:var(--_focus-indicator-active-width)}}.forge-chip:not(:disabled){outline:none}.forge-chip:not(:disabled):focus-visible::after{--_focus-indicator-display:var(--forge-focus-indicator-display, flex);--_focus-indicator-width:var(--forge-focus-indicator-width, var(--forge-border-medium, 2px));--_focus-indicator-active-width:var(--forge-focus-indicator-active-width, 6px);--_focus-indicator-color:var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));--_focus-indicator-shape:var(--forge-focus-indicator-shape, calc(var(--forge-shape-extra-small, 1px) * var(--forge-shape-factor, 1)));--_focus-indicator-duration:var(--forge-focus-indicator-duration, var(--forge-animation-duration-long4, 600ms));--_focus-indicator-easing:var(--forge-focus-indicator-easing, var(--forge-animation-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)));--_focus-indicator-shape-start-start:var(--forge-focus-indicator-shape-start-start, var(--_focus-indicator-shape));--_focus-indicator-shape-start-end:var(--forge-focus-indicator-shape-start-end, var(--_focus-indicator-shape));--_focus-indicator-shape-end-end:var(--forge-focus-indicator-shape-end-end, var(--_focus-indicator-shape));--_focus-indicator-shape-end-start:var(--forge-focus-indicator-shape-end-start, var(--_focus-indicator-shape));--_focus-indicator-outward-offset:var(--forge-focus-indicator-outward-offset, var(--forge-spacing-xxsmall, 4px));--_focus-indicator-inward-offset:var(--forge-focus-indicator-inward-offset, 0px);--_focus-indicator-offset-block:var(--forge-focus-indicator-offset-block, 0);--_focus-indicator-offset-inline:var(--forge-focus-indicator-offset-inline, 0)}.forge-chip:not(:disabled):focus-visible::after{animation-delay:0s,calc(var(--_focus-indicator-duration)*.25);animation-duration:calc(var(--_focus-indicator-duration)*.25),calc(var(--_focus-indicator-duration)*.75);animation-timing-function:var(--_focus-indicator-easing);box-sizing:border-box;color:var(--_focus-indicator-color);display:none;pointer-events:none;position:absolute;margin-block:var(--_focus-indicator-offset-block);margin-inline:var(--_focus-indicator-offset-inline);animation-name:forge-focus-indicator-outward-grow,forge-focus-indicator-outward-shrink;border-end-end-radius:calc(var(--_focus-indicator-shape-end-end) + var(--_focus-indicator-outward-offset));border-end-start-radius:calc(var(--_focus-indicator-shape-end-start) + var(--_focus-indicator-outward-offset));border-start-end-radius:calc(var(--_focus-indicator-shape-start-end) + var(--_focus-indicator-outward-offset));border-start-start-radius:calc(var(--_focus-indicator-shape-start-start) + var(--_focus-indicator-outward-offset));inset:calc(-1*var(--_focus-indicator-outward-offset));outline:var(--_focus-indicator-width) solid currentColor;content:"";display:block}.forge-chip:not(:disabled){--forge-focus-indicator-color: var(--_chip-color);--forge-focus-indicator-shape: var(--_chip-shape)}.forge-chip--field{--_chip-background:var(--_chip-field-background);--_chip-color:var(--_chip-field-color);--_chip-border-color:var(--_chip-field-border-color);--_chip-shape:var(--_chip-field-shape);--_chip-cursor:var(--_chip-field-cursor)}.forge-chip--invalid:not(:disabled){--_chip-color:var(--_chip-invalid-color)}.forge-chip--selected:not(:disabled){--_chip-background:var(--_chip-selected-background);--_chip-color:var(--_chip-selected-color);--forge-focus-indicator-color: var(--_chip-background)}.forge-chip--selected:not(:disabled).forge-chip--invalid{--_chip-background:var(--_chip-invalid-selected-background);--_chip-color:var(--_chip-invalid-selected-color)}.forge-chip--dense{--_chip-height:var(--_chip-dense-height);--_chip-padding-inline:var(--_chip-dense-padding-inline);--_chip-spacing:var(--_chip-dense-spacing)}.forge-chip:disabled{cursor:var(--_chip-disabled-cursor);opacity:var(--_chip-disabled-opacity)}

package/dist/dialog/forge-dialog-utils.css

@@ -1,36 +1,6 @@
 /**
  * @license
- * Copyright Tyler Technologies, Inc. 
+ * Copyright Tyler Technologies, Inc.
  * License: Apache-2.0
  */
-.forge-dialog--scrollable .forge-dialog__title,
-.forge-dialog--scrollable .forge-dialog__footer {
-  border-color: var(--forge-theme-outline, #e0e0e0);
-}
-.forge-dialog__header {
-  margin: 0;
-  padding: 0 24px 8px;
-  border-bottom: 1px solid transparent;
-}
-.forge-dialog__title {
-  box-sizing: border-box;
-  margin: 0;
-}
-.forge-dialog__body {
-  padding-top: 20px;
-  padding: 0 24px 24px;
-  overflow: auto;
-}
-.forge-dialog__footer {
-  display: flex;
-  position: relative;
-  flex-shrink: 0;
-  flex-wrap: wrap;
-  align-items: center;
-  justify-content: flex-end;
-  box-sizing: border-box;
-  min-height: 52px;
-  margin: 0;
-  padding: 8px;
-  border-top: 1px solid transparent;
-}
+.forge-dialog--scrollable .forge-dialog__title,.forge-dialog--scrollable .forge-dialog__footer{border-color:var(--forge-theme-outline, #e0e0e0)}.forge-dialog__header{margin:0;padding:0 24px 8px;border-bottom:1px solid rgba(0,0,0,0)}.forge-dialog__title{box-sizing:border-box;margin:0}.forge-dialog__body{padding-top:20px;padding:0 24px 24px;overflow:auto}.forge-dialog__footer{display:flex;position:relative;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;box-sizing:border-box;min-height:52px;margin:0;padding:8px;border-top:1px solid rgba(0,0,0,0)}