From eaef5d0d1a5e73fb45782cebab78dad499ff56ef Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Fri, 19 Apr 2024 10:49:05 -0700
Subject: [PATCH 01/70] progress check

---
 .nvmrc                                        |  1 +
 .prettierrc.json                              | 18 ++++++
 package-lock.json                             | 15 +++--
 package.json                                  |  4 +-
 src/components/box/CdrBox.vue                 | 59 +++++++++++++++++++
 src/components/box/examples/Box.vue           | 57 ++++++++++++++++++
 src/components/box/stylesMap.mts              | 50 ++++++++++++++++
 src/components/examples.js                    |  4 ++
 .../styledButton/CdrStyledButton.vue          | 34 +++++++++++
 .../styledButton/examples/StyledButton.vue    | 47 +++++++++++++++
 .../styles/CdrUnstyledButton.module.scss      |  6 ++
 .../styles/vars/CdrUnstyledButton.vars.scss   | 17 ++++++
 .../unstyledButton/CdrUnstyledButton.vue      | 37 ++++++++++++
 .../examples/UnstyledButton.vue               | 47 +++++++++++++++
 .../styles/CdrStyledButton.module.scss        |  6 ++
 .../styles/vars/CdrStyledButton.vars.scss     | 17 ++++++
 src/dev/DevPage.vue                           |  3 -
 src/dev/index.js                              |  2 +-
 src/dev/router.js                             |  2 +
 src/lib.ts                                    |  3 +-
 src/types/other.ts                            | 46 +++++++++++++++
 src/types/symbols.ts                          |  1 -
 22 files changed, 460 insertions(+), 16 deletions(-)
 create mode 100644 .nvmrc
 create mode 100644 .prettierrc.json
 create mode 100644 src/components/box/CdrBox.vue
 create mode 100644 src/components/box/examples/Box.vue
 create mode 100644 src/components/box/stylesMap.mts
 create mode 100644 src/components/styledButton/CdrStyledButton.vue
 create mode 100644 src/components/styledButton/examples/StyledButton.vue
 create mode 100644 src/components/styledButton/styles/CdrUnstyledButton.module.scss
 create mode 100644 src/components/styledButton/styles/vars/CdrUnstyledButton.vars.scss
 create mode 100644 src/components/unstyledButton/CdrUnstyledButton.vue
 create mode 100644 src/components/unstyledButton/examples/UnstyledButton.vue
 create mode 100644 src/components/unstyledButton/styles/CdrStyledButton.module.scss
 create mode 100644 src/components/unstyledButton/styles/vars/CdrStyledButton.vars.scss
 create mode 100644 src/types/other.ts

diff --git a/.nvmrc b/.nvmrc
new file mode 100644
index 000000000..2edeafb09
--- /dev/null
+++ b/.nvmrc
@@ -0,0 +1 @@
+20
\ No newline at end of file
diff --git a/.prettierrc.json b/.prettierrc.json
new file mode 100644
index 000000000..51878cea5
--- /dev/null
+++ b/.prettierrc.json
@@ -0,0 +1,18 @@
+{
+  "printWidth": 100,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": true,
+  "singleQuote": true,
+  "quoteProps": "as-needed",
+  "jsxSingleQuote": false,
+  "trailingComma": "all",
+  "bracketSpacing": true,
+  "bracketSameLine": false,
+  "arrowParens": "always",
+  "proseWrap": "preserve",
+  "htmlWhitespaceSensitivity": "ignore",
+  "vueIndentScriptAndStyle": false,
+  "endOfLine": "auto",
+  "singleAttributePerLine": true
+}
diff --git a/package-lock.json b/package-lock.json
index 8bafaa9a0..4fd5cdab0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -29,6 +29,7 @@
         "chromedriver": "^122",
         "concat": "^1.0.3",
         "cross-env": "^7.0.3",
+        "csstype": "^3.1.3",
         "cz-conventional-changelog": "^3.3.0",
         "eslint": "^8.42.0",
         "eslint-config-prettier": "^8.8.0",
@@ -5778,10 +5779,9 @@
       "dev": true
     },
     "node_modules/csstype": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz",
-      "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==",
-      "peer": true
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
+      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
     },
     "node_modules/cz-conventional-changelog": {
       "version": "3.3.0",
@@ -18789,10 +18789,9 @@
       }
     },
     "csstype": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz",
-      "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==",
-      "peer": true
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
+      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
     },
     "cz-conventional-changelog": {
       "version": "3.3.0",
diff --git a/package.json b/package.json
index 8d3e28328..ba46879b1 100644
--- a/package.json
+++ b/package.json
@@ -52,7 +52,8 @@
     "build:docgen": "node docgen.mjs",
     "build:extractcss": "node build/extract-css.js",
     "build:variables": "node build/component-variables-transfer.js",
-    "build:icons": "ts-node src/components/icon/build/generate.ts"
+    "build:icons": "ts-node src/components/icon/build/generate.ts",
+    "type-check": "vue-tsc --noEmit"
   },
   "devDependencies": {
     "@babel/preset-env": "^7.18.2",
@@ -72,6 +73,7 @@
     "chromedriver": "^122",
     "concat": "^1.0.3",
     "cross-env": "^7.0.3",
+    "csstype": "^3.1.3",
     "cz-conventional-changelog": "^3.3.0",
     "eslint": "^8.42.0",
     "eslint-config-prettier": "^8.8.0",
diff --git a/src/components/box/CdrBox.vue b/src/components/box/CdrBox.vue
new file mode 100644
index 000000000..313842f93
--- /dev/null
+++ b/src/components/box/CdrBox.vue
@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+import type * as CSS from 'csstype';
+import type { StylingProps } from '../../types/other';
+import stylesMap from './stylesMap.mjs';
+
+/** Base component for all other components */
+
+defineOptions({ name: 'CdrBox' });
+
+export interface CdrBoxProps extends StylingProps {
+  tag?: keyof HTMLElementTagNameMap;
+}
+
+const props = withDefaults(defineProps<CdrBoxProps>(), {
+  tag: 'div',
+});
+
+const styles = computed(() => {
+  const styles: CSS.Properties = {};
+
+  const propsToProcess = { ...props };
+
+  // If shadow is present without background, apply a primary background
+  if (props.shadow && !props.background) {
+    propsToProcess.background = 'primary';
+  }
+
+  // Check props for styles that can be applied
+  Object.keys(propsToProcess).forEach((key) => {
+    const mapValue = stylesMap[key];
+
+    if (props[key] && mapValue) {
+      styles[mapValue.property] = mapValue.converter
+        ? stylesMap[key].converter(props[key])
+        : props[key];
+    }
+  });
+
+  // Add border as box-shadow, which only requires a borderColor to be set for ease
+  if (props.borderColor) {
+    const borderWidth = `var(--cdr-space-inset-${props.borderWidth || 'eighth-x'})`;
+    const borderColor = `var(--cdr-color-border-${props.borderColor})`;
+    const borderAsBoxShadow = `inset 0 0 0 ${borderWidth} ${borderColor}`;
+    styles.boxShadow = `${styles.boxShadow ? `${styles.boxShadow}, ` : ''}${borderAsBoxShadow}`;
+  }
+
+  return styles;
+});
+</script>
+
+<template>
+  <component
+    :is="tag"
+    :style="styles"
+  >
+    <slot />
+  </component>
+</template>
diff --git a/src/components/box/examples/Box.vue b/src/components/box/examples/Box.vue
new file mode 100644
index 000000000..4921249c4
--- /dev/null
+++ b/src/components/box/examples/Box.vue
@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import CdrBox, { type CdrBoxProps } from '../CdrBox.vue';
+
+defineOptions({ name: 'Box' });
+
+export interface Example {
+  description: string;
+  props: CdrBoxProps;
+}
+
+const boxes: Example[] = [
+  {
+    description: 'This is a box without any props',
+    props: {},
+  },
+  {
+    description:
+      'This box is styled like a card. This box has padding, background, radius, and shadow props applied.',
+    props: { p: 'one-x', background: 'secondary', radius: 'softer', shadow: 'elevated' },
+  },
+  {
+    description:
+      'This box is styled like a tile. This box has padding, background, and borderColor props applied.',
+    props: {
+      p: 'one-x',
+      radius: 'softer',
+      background: 'secondary',
+      borderColor: 'secondary',
+    },
+  },
+];
+</script>
+
+<template>
+  <div class="boxes-demo">
+    <h2>Box</h2>
+    <template
+      v-for="{ description, props } in boxes"
+      :key="description"
+    >
+      <hr class="boxes-demo__hr" />
+      <CdrBox v-bind="props">
+        <span v-html="description" />
+      </CdrBox>
+    </template>
+  </div>
+</template>
+
+<style lang="scss">
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
+.boxes-demo {
+  &__hr {
+    margin: $cdr-space-two-x 0;
+  }
+}
+</style>
diff --git a/src/components/box/stylesMap.mts b/src/components/box/stylesMap.mts
new file mode 100644
index 000000000..f97c97ef9
--- /dev/null
+++ b/src/components/box/stylesMap.mts
@@ -0,0 +1,50 @@
+import type { SpacingKey, DirectKey, StylingKey } from '../../types/other';
+
+const spacing: Record<SpacingKey, string> = {
+  m: 'margin',
+  mx: 'marginInline',
+  my: 'marginBlock',
+  p: 'padding',
+  px: 'paddingInline',
+  py: 'paddingBlock',
+};
+
+interface StylesMapValue {
+  property: string;
+  converter?: Function;
+}
+
+const stylesMap: Partial<Record<StylingKey, StylesMapValue>> = {};
+
+// Add spacing
+(Object.keys(spacing) as Array<SpacingKey>).forEach((key) => {
+  stylesMap[key] = {
+    property: spacing[key],
+    converter: (value: string) => `var(--cdr-space-${value})`,
+  };
+});
+
+// Add any CSS properties that do not use different names than their prop name
+(['display'] as Array<DirectKey>).forEach((key) => {
+  stylesMap[key] = { property: key };
+});
+
+// Add radius
+stylesMap.radius = {
+  property: 'borderRadius',
+  converter: (value: string) => `var(--cdr-radius-${value})`,
+};
+
+// Add background
+stylesMap.background = {
+  property: 'backgroundColor',
+  converter: (value: string) => `var(--cdr-color-background-${value})`,
+};
+
+// Add shadow
+stylesMap.shadow = {
+  property: 'boxShadow',
+  converter: (value: string) => `var(--cdr-prominence-${value})`,
+};
+
+export default stylesMap;
diff --git a/src/components/examples.js b/src/components/examples.js
index 670aaa351..f1a2fa3e4 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -1,6 +1,7 @@
 import abstract from 'componentsdir/abstract/examples/Abstract.vue';
 import accordion from 'componentsdir/accordion/examples/Accordion.vue';
 import banner from 'componentsdir/banner/examples/Banner.vue';
+import box from 'componentsdir/box/examples/Box.vue';
 import breadcrumb from 'componentsdir/breadcrumb/examples/Breadcrumb.vue';
 import buttons from 'componentsdir/button/examples/Buttons.vue';
 import captions from 'componentsdir/caption/examples/Caption.vue';
@@ -37,11 +38,13 @@ import toast from 'componentsdir/toast/examples/Toast.vue';
 import toggleButton from 'componentsdir/toggleButton/examples/ToggleButton.vue';
 import cdrSwitch from 'componentsdir/switch/examples/Switch.vue'; // Can't name it switch because it's a JS keyword
 import tooltip from 'componentsdir/tooltip/examples/Tooltip.vue';
+import unstyledButton from 'componentsdir/unstyledButton/examples/UnstyledButton.vue';
 
 export default {
   abstract,
   banner,
   accordion,
+  box,
   breadcrumb,
   buttons,
   captions,
@@ -78,4 +81,5 @@ export default {
   toggleButton,
   cdrSwitch,
   tooltip,
+  unstyledButton,
 };
diff --git a/src/components/styledButton/CdrStyledButton.vue b/src/components/styledButton/CdrStyledButton.vue
new file mode 100644
index 000000000..449f98871
--- /dev/null
+++ b/src/components/styledButton/CdrStyledButton.vue
@@ -0,0 +1,34 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import mapClasses from '../../utils/mapClasses';
+import CdrUnstyledButton, {
+  type CdrUnstyledButtonProps,
+} from '../unstyledButton/CdrUnstyledButton.vue';
+
+/** Base component for styled buttons */
+
+defineOptions({ name: 'CdrStyledButton' });
+
+export interface CdrStyledButtonProps extends CdrUnstyledButtonProps {}
+
+const props = withDefaults(defineProps<CdrStyledButtonProps>(), {});
+
+const style = useCssModule();
+const baseClass = 'cdr-styled-button';
+
+// Manages the props passed along to CdrBox
+const computedProps = computed(() => ({
+  ...props,
+  // Automatically apply a type if using button tag
+  type: props.tag == 'button' ? props.type || 'button' : undefined,
+  class: mapClasses(style, baseClass),
+}));
+</script>
+
+<template>
+  <CdrUnstyledButton v-bind="computedProps">
+    <slot />
+  </CdrUnstyledButton>
+</template>
+
+<style lang="scss" module src="./styles/CdrStyledButton.module.scss"></style>
diff --git a/src/components/styledButton/examples/StyledButton.vue b/src/components/styledButton/examples/StyledButton.vue
new file mode 100644
index 000000000..3aefa46a0
--- /dev/null
+++ b/src/components/styledButton/examples/StyledButton.vue
@@ -0,0 +1,47 @@
+<script setup lang="ts">
+import CdrStyledButton, { type CdrStyledButtonProps } from '../CdrStyledButton.vue';
+
+defineOptions({ name: 'StyledButton' });
+
+export interface Example {
+  description: string;
+  props: CdrStyledButtonProps;
+}
+
+const boxes: Example[] = [
+  {
+    description: 'This is a styled button',
+    props: {},
+  },
+  {
+    description:
+      'This button has padding, background, shadow, and radius applied. It inherits all props from CdrUnstyledButton',
+    props: {},
+  },
+];
+</script>
+
+<template>
+  <div class="styled-buttons-demo">
+    <h2>StyledButton</h2>
+    <template
+      v-for="{ description, props } in boxes"
+      :key="description"
+    >
+      <hr class="styled-buttons-demo__hr" />
+      <CdrStyledButton v-bind="props">
+        <span v-html="description" />
+      </CdrStyledButton>
+    </template>
+  </div>
+</template>
+
+<style lang="scss">
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
+.styled-buttons-demo {
+  &__hr {
+    margin: $cdr-space-two-x 0;
+  }
+}
+</style>
diff --git a/src/components/styledButton/styles/CdrUnstyledButton.module.scss b/src/components/styledButton/styles/CdrUnstyledButton.module.scss
new file mode 100644
index 000000000..a04f398f5
--- /dev/null
+++ b/src/components/styledButton/styles/CdrUnstyledButton.module.scss
@@ -0,0 +1,6 @@
+@import '../../../styles/settings/index.scss';
+@import './vars/CdrUnstyledButton.vars.scss';
+
+.cdr-unstyled-button {
+  @include cdr-unstyled-button-base-mixin;
+}
diff --git a/src/components/styledButton/styles/vars/CdrUnstyledButton.vars.scss b/src/components/styledButton/styles/vars/CdrUnstyledButton.vars.scss
new file mode 100644
index 000000000..1a7b54b15
--- /dev/null
+++ b/src/components/styledButton/styles/vars/CdrUnstyledButton.vars.scss
@@ -0,0 +1,17 @@
+@mixin cdr-unstyled-button-base-reset-mixin() {
+  background-color: transparent;
+  cursor: pointer;
+  border: 0;
+  padding: 0;
+  appearance: none;
+  text-align: left;
+  text-decoration: none;
+  color: inherit;
+  touch-action: manipulation;
+  -webkit-tap-highlight-color: transparent;
+}
+
+@mixin cdr-unstyled-button-base-mixin() {
+  @include cdr-text-utility-sans-300;
+  @include cdr-unstyled-button-base-reset-mixin;
+}
diff --git a/src/components/unstyledButton/CdrUnstyledButton.vue b/src/components/unstyledButton/CdrUnstyledButton.vue
new file mode 100644
index 000000000..a2055e5d0
--- /dev/null
+++ b/src/components/unstyledButton/CdrUnstyledButton.vue
@@ -0,0 +1,37 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import mapClasses from '../../utils/mapClasses';
+import CdrBox, { type CdrBoxProps } from '../box/CdrBox.vue';
+
+/** Base component for all other buttons */
+
+defineOptions({ name: 'CdrUnstyledButton' });
+
+export interface CdrUnstyledButtonProps extends CdrBoxProps {
+  type?: 'button' | 'reset' | 'submit' | undefined;
+}
+
+const props = withDefaults(defineProps<CdrUnstyledButtonProps>(), {
+  tag: 'button',
+  type: undefined,
+});
+
+const style = useCssModule();
+const baseClass = 'cdr-unstyled-button';
+
+// Manages the props passed along to CdrBox
+const computedProps = computed(() => ({
+  ...props,
+  // Automatically apply a type if using button tag
+  type: props.tag == 'button' ? props.type || 'button' : undefined,
+  class: mapClasses(style, baseClass),
+}));
+</script>
+
+<template>
+  <CdrBox v-bind="computedProps">
+    <slot />
+  </CdrBox>
+</template>
+
+<style lang="scss" module src="./styles/CdrUnstyledButton.module.scss"></style>
diff --git a/src/components/unstyledButton/examples/UnstyledButton.vue b/src/components/unstyledButton/examples/UnstyledButton.vue
new file mode 100644
index 000000000..3a2c3f4ad
--- /dev/null
+++ b/src/components/unstyledButton/examples/UnstyledButton.vue
@@ -0,0 +1,47 @@
+<script setup lang="ts">
+import CdrUnstyledButton, { type CdrUnstyledButtonProps } from '../CdrUnstyledButton.vue';
+
+defineOptions({ name: 'UnstyledButton' });
+
+export interface Example {
+  description: string;
+  props: CdrUnstyledButtonProps;
+}
+
+const boxes: Example[] = [
+  {
+    description: 'This is an unstyled button',
+    props: {},
+  },
+  {
+    description:
+      'This button has padding, background, shadow, and radius applied. It inherits all props from CdrBox',
+    props: { p: 'one-x', background: 'secondary', radius: 'softer', shadow: 'elevated' },
+  },
+];
+</script>
+
+<template>
+  <div class="unstyled-buttons-demo">
+    <h2>UnstyledButton</h2>
+    <template
+      v-for="{ description, props } in boxes"
+      :key="description"
+    >
+      <hr class="unstyled-buttons-demo__hr" />
+      <CdrUnstyledButton v-bind="props">
+        <span v-html="description" />
+      </CdrUnstyledButton>
+    </template>
+  </div>
+</template>
+
+<style lang="scss">
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
+.unstyled-buttons-demo {
+  &__hr {
+    margin: $cdr-space-two-x 0;
+  }
+}
+</style>
diff --git a/src/components/unstyledButton/styles/CdrStyledButton.module.scss b/src/components/unstyledButton/styles/CdrStyledButton.module.scss
new file mode 100644
index 000000000..1448e9943
--- /dev/null
+++ b/src/components/unstyledButton/styles/CdrStyledButton.module.scss
@@ -0,0 +1,6 @@
+@import '../../../styles/settings/index.scss';
+@import './vars/CdrStyledButton.vars.scss';
+
+.cdr-unstyled-button {
+  @include cdr-styled-button-base-mixin;
+}
diff --git a/src/components/unstyledButton/styles/vars/CdrStyledButton.vars.scss b/src/components/unstyledButton/styles/vars/CdrStyledButton.vars.scss
new file mode 100644
index 000000000..773032638
--- /dev/null
+++ b/src/components/unstyledButton/styles/vars/CdrStyledButton.vars.scss
@@ -0,0 +1,17 @@
+// @mixin cdr-styled-button-base-mixin() {
+//   background-color: transparent;
+//   cursor: pointer;
+//   border: 0;
+//   padding: 0;
+//   appearance: none;
+//   text-align: left;
+//   text-decoration: none;
+//   color: inherit;
+//   touch-action: manipulation;
+//   -webkit-tap-highlight-color: transparent;
+// }
+
+@mixin cdr-styled-button-base-mixin() {
+  // @include cdr-text-utility-sans-300;
+  // @include cdr-unstyled-button-base-reset-mixin;
+}
diff --git a/src/dev/DevPage.vue b/src/dev/DevPage.vue
index 9aee35b71..8eeebf755 100644
--- a/src/dev/DevPage.vue
+++ b/src/dev/DevPage.vue
@@ -42,9 +42,6 @@ export default {
       focusTarget.removeAttribute('tabindex');
     },
   },
-  mounted() {
-    console.log('BACKSTOP_READY'); // eslint-disable-line
-  },
 };
 </script>
 
diff --git a/src/dev/index.js b/src/dev/index.js
index bd885ee18..6792f5177 100644
--- a/src/dev/index.js
+++ b/src/dev/index.js
@@ -1,7 +1,7 @@
 import { createRouter, createWebHashHistory } from 'vue-router';
 import { createApp } from 'vue';
 import routes from './router';
-import DevPage from './DevPage.vue'; //eslint-disable-line
+import DevPage from './DevPage.vue';
 
 const router = createRouter({
   routes,
diff --git a/src/dev/router.js b/src/dev/router.js
index 3d28e73aa..6bfead133 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -24,6 +24,7 @@ const routes = [
   { path: '/abstract', name: 'Abstract', component: Examples.abstract },
   { path: '/accordion', name: 'Accordion', component: Examples.accordion },
   { path: '/banner', name: 'Banner', component: Examples.banner },
+  { path: '/box', name: 'Box', component: Examples.box },
   { path: '/breadcrumbs', name: 'Breadcrumb', component: Examples.breadcrumb },
   { path: '/buttons', name: 'Buttons', component: Examples.buttons },
   { path: '/captions', name: 'Captions', component: Examples.captions },
@@ -60,6 +61,7 @@ const routes = [
   { path: '/toggleButton', name: 'ToggleButton', component: Examples.toggleButton },
   { path: '/switch', name: 'Switch', component: Examples.cdrSwitch },
   { path: '/tooltip', name: 'Tooltip', component: Examples.tooltip },
+  { path: '/unstyledButton', name: 'UnstyledButton', component: Examples.unstyledButton },
 
   // Nightwatch test targets
   { path: '/e2e-1', component: e2e1 },
diff --git a/src/lib.ts b/src/lib.ts
index ec8193a49..73371b038 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -49,5 +49,4 @@ export * from './components/text/presets/textPresets';
 
 /** Type exports */
 export * from './types/interfaces';
-
-
+export * from './types/other';
diff --git a/src/types/other.ts b/src/types/other.ts
new file mode 100644
index 000000000..285e4d27e
--- /dev/null
+++ b/src/types/other.ts
@@ -0,0 +1,46 @@
+export type Space =
+  | 'eighth-x'
+  | 'quarter-x'
+  | 'half-x'
+  | 'three-quarter-x'
+  | 'one-x'
+  | 'one-and-a-half-x'
+  | 'two-x'
+  | 'three-x'
+  | 'four-x';
+export type Background = 'primary' | 'secondary' | 'brand-spruce';
+export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
+export type Radius = 'sharp' | 'soft' | 'softer' | 'round';
+export type BorderColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error';
+export type SpacingKey = 'm' | 'mx' | 'my' | 'p' | 'px' | 'py';
+export type OtherKey = 'radius' | 'shadow' | 'background' | 'borderWidth' | 'borderColor';
+export type DirectKey = 'display';
+
+/**
+ * Text component properties
+ * @type space
+ */
+// export type Space = (typeof spacing)[number];
+
+export interface SpacingProps {
+  p?: Space;
+  px?: Space;
+  py?: Space;
+  m?: Space;
+  mx?: Space;
+  my?: Space;
+}
+
+export interface DirectProps {
+  display?: string;
+}
+
+export type StylingKey = SpacingKey | DirectKey | OtherKey;
+
+export interface StylingProps extends SpacingProps, DirectProps {
+  background?: Background;
+  radius?: Radius;
+  shadow?: Shadow;
+  borderWidth?: Space;
+  borderColor?: BorderColor;
+}
diff --git a/src/types/symbols.ts b/src/types/symbols.ts
index 965619e71..72b1790d8 100644
--- a/src/types/symbols.ts
+++ b/src/types/symbols.ts
@@ -13,4 +13,3 @@ export const selectedToggleKey:
 
 /** Accordion injection keys */ 
 export const unwrappedKey: InjectionKey<Ref<boolean>> = Symbol();
-  
\ No newline at end of file

From 171ce20bea9395ad022291d877461b9f98433d1c Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 23 Apr 2024 16:56:18 -0700
Subject: [PATCH 02/70] progress check

---
 src/components/box/CdrBox.vue                 | 144 +++++++++++++++---
 src/components/box/examples/Box.vue           |  24 +--
 src/components/box/styles/CdrBox.module.scss  |  60 ++++++++
 .../box/styles/vars/CdrBox.vars.scss          |   0
 src/components/box/stylesMap.mts              |  50 ------
 .../styles/CdrUnstyledButton.module.scss      |   4 +-
 .../styles/CdrStyledButton.module.scss        |   6 -
 .../styles/CdrUnstyledButton.module.scss      |   6 +
 .../styles/vars/CdrStyledButton.vars.scss     |  17 ---
 .../styles/vars/CdrUnstyledButton.vars.scss   |  17 +++
 src/styles/settings/fluid.vars.scss           |  13 ++
 11 files changed, 232 insertions(+), 109 deletions(-)
 create mode 100644 src/components/box/styles/CdrBox.module.scss
 create mode 100644 src/components/box/styles/vars/CdrBox.vars.scss
 delete mode 100644 src/components/box/stylesMap.mts
 delete mode 100644 src/components/unstyledButton/styles/CdrStyledButton.module.scss
 create mode 100644 src/components/unstyledButton/styles/CdrUnstyledButton.module.scss
 delete mode 100644 src/components/unstyledButton/styles/vars/CdrStyledButton.vars.scss
 create mode 100644 src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss

diff --git a/src/components/box/CdrBox.vue b/src/components/box/CdrBox.vue
index 313842f93..f6d9cb9be 100644
--- a/src/components/box/CdrBox.vue
+++ b/src/components/box/CdrBox.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import { useCssModule, computed } from 'vue';
 import type * as CSS from 'csstype';
+import mapClasses from '../../utils/mapClasses';
 import type { StylingProps } from '../../types/other';
-import stylesMap from './stylesMap.mjs';
 
 /** Base component for all other components */
 
@@ -10,50 +10,144 @@ defineOptions({ name: 'CdrBox' });
 
 export interface CdrBoxProps extends StylingProps {
   tag?: keyof HTMLElementTagNameMap;
+  shadow?: 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
+  radius?: 'sharp' | 'soft' | 'softer' | 'round';
+  surface?: 'primary' | 'secondary' | 'brand-spruce';
+  borderWidth?:
+    | 'eighth-x'
+    | 'quarter-x'
+    | 'half-x'
+    | 'three-quarter-x'
+    | 'one-x'
+    | 'one-and-a-half-x'
+    | 'two-x'
+    | 'three-x'
+    | 'four-x';
+  borderColor?: 'primary' | 'secondary' | 'success' | 'warning' | 'error';
+  elevation?:
+    | 'ground'
+    | 'dropdown'
+    | 'popover'
+    | 'navigation'
+    | 'sticky'
+    | 'notification'
+    | 'modal';
+  position?: CSS.Properties['position'];
+  palette?: 'primary' | 'sale';
 }
 
 const props = withDefaults(defineProps<CdrBoxProps>(), {
   tag: 'div',
+  shadow: undefined,
+  radius: undefined,
+  surface: undefined,
+  borderWidth: undefined,
+  borderColor: undefined,
+  elevation: undefined,
+  position: undefined,
+  palette: undefined,
 });
 
-const styles = computed(() => {
-  const styles: CSS.Properties = {};
+const style = useCssModule();
+const baseClass = 'cdr-box';
+const borderClass = `${baseClass}__border`;
+const radiusClass = `${baseClass}__radius`;
+const shadowClass = `${baseClass}__shadow`;
+const surfaceClass = `${baseClass}__surface`;
+const elevationClass = `${baseClass}__elevation`;
+const paletteClass = `${baseClass}__palette`;
 
-  const propsToProcess = { ...props };
+// Map of zIndex for elevation
+const elevations = {
+  ground: 0,
+  dropdown: 100,
+  popover: 200,
+  navigation: 300,
+  sticky: 400,
+  notification: 500,
+  modal: 600,
+};
 
-  // If shadow is present without background, apply a primary background
-  if (props.shadow && !props.background) {
-    propsToProcess.background = 'primary';
+// Map of palettes
+const palettes = {
+  primary: {
+    color: 'primary',
+    surface: 'primary',
+  },
+  sale: {
+    color: 'sale',
+    surface: 'primary',
+  },
+};
+
+// Manages the props passed along to CdrBox
+const computedProps = computed(() => {
+  const classes = new Set([baseClass]);
+  const inlineStyles: CSS.Properties = {};
+
+  // Add palette
+  if (props.palette) {
+    const { color, surface } = palettes[props.palette];
+    inlineStyles['--cdr-box-surface'] = `var(--cdr-color-background-${surface})`;
+    inlineStyles['--cdr-text-color'] = `var(--cdr-color-text-${color})`;
+    classes.add(surfaceClass);
   }
 
-  // Check props for styles that can be applied
-  Object.keys(propsToProcess).forEach((key) => {
-    const mapValue = stylesMap[key];
+  // Add border
+  if (props.borderWidth || props.borderColor) {
+    if (props.borderWidth) {
+      inlineStyles['--cdr-box-border-width'] = `var(--cdr-space-inset-${props.borderWidth})`;
+    }
 
-    if (props[key] && mapValue) {
-      styles[mapValue.property] = mapValue.converter
-        ? stylesMap[key].converter(props[key])
-        : props[key];
+    if (props.borderColor) {
+      inlineStyles['--cdr-box-border-color'] = `var(--cdr-color-border-${props.borderColor})`;
     }
-  });
-
-  // Add border as box-shadow, which only requires a borderColor to be set for ease
-  if (props.borderColor) {
-    const borderWidth = `var(--cdr-space-inset-${props.borderWidth || 'eighth-x'})`;
-    const borderColor = `var(--cdr-color-border-${props.borderColor})`;
-    const borderAsBoxShadow = `inset 0 0 0 ${borderWidth} ${borderColor}`;
-    styles.boxShadow = `${styles.boxShadow ? `${styles.boxShadow}, ` : ''}${borderAsBoxShadow}`;
+
+    classes.add(borderClass);
   }
 
-  return styles;
+  // Add radius
+  if (props.radius) {
+    inlineStyles['--cdr-box-radius'] = `var(--cdr-radius-${props.radius})`;
+    classes.add(radiusClass);
+  }
+
+  // Add shadow
+  if (props.shadow) {
+    inlineStyles['--cdr-box-shadow'] = `var(--cdr-prominence-${props.shadow})`;
+    classes.add(shadowClass);
+  }
+
+  // Add surface
+  if (props.surface) {
+    inlineStyles['--cdr-box-surface'] = `var(--cdr-color-background-${props.surface})`;
+    classes.add(surfaceClass);
+  }
+
+  // Add elevation
+  if (props.elevation) {
+    if (props.elevation) {
+      inlineStyles['--cdr-box-elevation'] = elevations[props.elevation];
+    }
+
+    if (props.position) {
+      inlineStyles['--cdr-box-position'] = props.position;
+    }
+
+    classes.add(elevationClass);
+  }
+
+  return { style: inlineStyles, class: mapClasses(style, ...classes) };
 });
 </script>
 
 <template>
   <component
     :is="tag"
-    :style="styles"
+    v-bind="computedProps"
   >
     <slot />
   </component>
 </template>
+
+<style lang="scss" module src="./styles/CdrBox.module.scss"></style>
diff --git a/src/components/box/examples/Box.vue b/src/components/box/examples/Box.vue
index 4921249c4..3ddefa44b 100644
--- a/src/components/box/examples/Box.vue
+++ b/src/components/box/examples/Box.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import CdrBox, { type CdrBoxProps } from '../CdrBox.vue';
+import CdrText from '../../text/CdrText.vue';
 
 defineOptions({ name: 'Box' });
 
@@ -15,17 +16,20 @@ const boxes: Example[] = [
   },
   {
     description:
-      'This box is styled like a card. This box has padding, background, radius, and shadow props applied.',
-    props: { p: 'one-x', background: 'secondary', radius: 'softer', shadow: 'elevated' },
+      'This is a box with radius, shadow, borderColor, surface, elevation and position props applied.',
+    props: {
+      radius: 'round',
+      shadow: 'elevated',
+      borderColor: 'secondary',
+      surface: 'secondary',
+      elevation: 'modal',
+      position: 'relative',
+    },
   },
   {
-    description:
-      'This box is styled like a tile. This box has padding, background, and borderColor props applied.',
+    description: 'This is a box with the palette prop applied.',
     props: {
-      p: 'one-x',
-      radius: 'softer',
-      background: 'secondary',
-      borderColor: 'secondary',
+      palette: 'sale',
     },
   },
 ];
@@ -40,7 +44,9 @@ const boxes: Example[] = [
     >
       <hr class="boxes-demo__hr" />
       <CdrBox v-bind="props">
-        <span v-html="description" />
+        <CdrText>
+          <span v-html="description" />
+        </CdrText>
       </CdrBox>
     </template>
   </div>
diff --git a/src/components/box/styles/CdrBox.module.scss b/src/components/box/styles/CdrBox.module.scss
new file mode 100644
index 000000000..57bc54438
--- /dev/null
+++ b/src/components/box/styles/CdrBox.module.scss
@@ -0,0 +1,60 @@
+@import '../../../styles/settings/index.scss';
+@import './vars/CdrBox.vars.scss';
+
+@mixin cdr-box-base-mixin() {
+  --cdr-box-border-width-default: var(--cdr-space-inset-eighth-x);
+  --cdr-box-border-style-default: solid;
+  --cdr-box-border-color-default: var(--cdr-color-border-primary);
+  --cdr-box-radius-default: var(--cdr-radius-sharp);
+  --cdr-box-shadow-default: var(--cdr-prominence-flat);
+  --cdr-box-surface-default: transparent;
+  --cdr-box-elevation-default: 0;
+  --cdr-box-position-default: relative;
+}
+
+@mixin cdr-box-border-mixin() {
+  border: var(--cdr-box-border-width, var(--cdr-box-border-width-default))
+    var(--cdr-box-border-style, var(--cdr-box-border-style-default))
+    var(--cdr-box-border-color, var(--cdr-box-border-color-default));
+}
+
+@mixin cdr-box-radius-mixin() {
+  border-radius: var(--cdr-box-radius, var(--cdr-box-radius-default));
+}
+
+@mixin cdr-box-shadow-mixin() {
+  box-shadow: var(--cdr-box-shadow, var(--cdr-box-shadow-default));
+}
+
+@mixin cdr-box-surface-mixin() {
+  background-color: var(--cdr-box-surface, var(--cdr-box-surface-default));
+}
+
+@mixin cdr-box-elevation-mixin() {
+  z-index: var(--cdr-box-elevation, var(--cdr-box-elevation-default));
+  position: var(--cdr-box-position, var(--cdr-box-position-default));
+}
+
+.cdr-box {
+  @include cdr-box-base-mixin;
+}
+
+.cdr-box__border {
+  @include cdr-box-border-mixin;
+}
+
+.cdr-box__radius {
+  @include cdr-box-radius-mixin;
+}
+
+.cdr-box__shadow {
+  @include cdr-box-shadow-mixin;
+}
+
+.cdr-box__surface {
+  @include cdr-box-surface-mixin;
+}
+
+.cdr-box__elevation {
+  @include cdr-box-elevation-mixin;
+}
diff --git a/src/components/box/styles/vars/CdrBox.vars.scss b/src/components/box/styles/vars/CdrBox.vars.scss
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/components/box/stylesMap.mts b/src/components/box/stylesMap.mts
deleted file mode 100644
index f97c97ef9..000000000
--- a/src/components/box/stylesMap.mts
+++ /dev/null
@@ -1,50 +0,0 @@
-import type { SpacingKey, DirectKey, StylingKey } from '../../types/other';
-
-const spacing: Record<SpacingKey, string> = {
-  m: 'margin',
-  mx: 'marginInline',
-  my: 'marginBlock',
-  p: 'padding',
-  px: 'paddingInline',
-  py: 'paddingBlock',
-};
-
-interface StylesMapValue {
-  property: string;
-  converter?: Function;
-}
-
-const stylesMap: Partial<Record<StylingKey, StylesMapValue>> = {};
-
-// Add spacing
-(Object.keys(spacing) as Array<SpacingKey>).forEach((key) => {
-  stylesMap[key] = {
-    property: spacing[key],
-    converter: (value: string) => `var(--cdr-space-${value})`,
-  };
-});
-
-// Add any CSS properties that do not use different names than their prop name
-(['display'] as Array<DirectKey>).forEach((key) => {
-  stylesMap[key] = { property: key };
-});
-
-// Add radius
-stylesMap.radius = {
-  property: 'borderRadius',
-  converter: (value: string) => `var(--cdr-radius-${value})`,
-};
-
-// Add background
-stylesMap.background = {
-  property: 'backgroundColor',
-  converter: (value: string) => `var(--cdr-color-background-${value})`,
-};
-
-// Add shadow
-stylesMap.shadow = {
-  property: 'boxShadow',
-  converter: (value: string) => `var(--cdr-prominence-${value})`,
-};
-
-export default stylesMap;
diff --git a/src/components/styledButton/styles/CdrUnstyledButton.module.scss b/src/components/styledButton/styles/CdrUnstyledButton.module.scss
index a04f398f5..1448e9943 100644
--- a/src/components/styledButton/styles/CdrUnstyledButton.module.scss
+++ b/src/components/styledButton/styles/CdrUnstyledButton.module.scss
@@ -1,6 +1,6 @@
 @import '../../../styles/settings/index.scss';
-@import './vars/CdrUnstyledButton.vars.scss';
+@import './vars/CdrStyledButton.vars.scss';
 
 .cdr-unstyled-button {
-  @include cdr-unstyled-button-base-mixin;
+  @include cdr-styled-button-base-mixin;
 }
diff --git a/src/components/unstyledButton/styles/CdrStyledButton.module.scss b/src/components/unstyledButton/styles/CdrStyledButton.module.scss
deleted file mode 100644
index 1448e9943..000000000
--- a/src/components/unstyledButton/styles/CdrStyledButton.module.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-@import '../../../styles/settings/index.scss';
-@import './vars/CdrStyledButton.vars.scss';
-
-.cdr-unstyled-button {
-  @include cdr-styled-button-base-mixin;
-}
diff --git a/src/components/unstyledButton/styles/CdrUnstyledButton.module.scss b/src/components/unstyledButton/styles/CdrUnstyledButton.module.scss
new file mode 100644
index 000000000..a04f398f5
--- /dev/null
+++ b/src/components/unstyledButton/styles/CdrUnstyledButton.module.scss
@@ -0,0 +1,6 @@
+@import '../../../styles/settings/index.scss';
+@import './vars/CdrUnstyledButton.vars.scss';
+
+.cdr-unstyled-button {
+  @include cdr-unstyled-button-base-mixin;
+}
diff --git a/src/components/unstyledButton/styles/vars/CdrStyledButton.vars.scss b/src/components/unstyledButton/styles/vars/CdrStyledButton.vars.scss
deleted file mode 100644
index 773032638..000000000
--- a/src/components/unstyledButton/styles/vars/CdrStyledButton.vars.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-// @mixin cdr-styled-button-base-mixin() {
-//   background-color: transparent;
-//   cursor: pointer;
-//   border: 0;
-//   padding: 0;
-//   appearance: none;
-//   text-align: left;
-//   text-decoration: none;
-//   color: inherit;
-//   touch-action: manipulation;
-//   -webkit-tap-highlight-color: transparent;
-// }
-
-@mixin cdr-styled-button-base-mixin() {
-  // @include cdr-text-utility-sans-300;
-  // @include cdr-unstyled-button-base-reset-mixin;
-}
diff --git a/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss b/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss
new file mode 100644
index 000000000..1a7b54b15
--- /dev/null
+++ b/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss
@@ -0,0 +1,17 @@
+@mixin cdr-unstyled-button-base-reset-mixin() {
+  background-color: transparent;
+  cursor: pointer;
+  border: 0;
+  padding: 0;
+  appearance: none;
+  text-align: left;
+  text-decoration: none;
+  color: inherit;
+  touch-action: manipulation;
+  -webkit-tap-highlight-color: transparent;
+}
+
+@mixin cdr-unstyled-button-base-mixin() {
+  @include cdr-text-utility-sans-300;
+  @include cdr-unstyled-button-base-reset-mixin;
+}
diff --git a/src/styles/settings/fluid.vars.scss b/src/styles/settings/fluid.vars.scss
index fe766d5cf..67142b1c2 100644
--- a/src/styles/settings/fluid.vars.scss
+++ b/src/styles/settings/fluid.vars.scss
@@ -23,6 +23,19 @@
     --cdr-type-scale-5: clamp(3.98rem, 2.33cqw + 3.24rem, 6.1rem);
     --cdr-type-scale-6: clamp(4.78rem, 3.13cqw + 3.78rem, 7.63rem);
     --cdr-type-scale-7: clamp(5.73rem, 4.17cqw + 4.4rem, 9.54rem);
+
+    // space
+    --cdr-space-scale-eighth-x: clamp(0.2rem, 0.2rem + 0.11cqi, 0.3rem);
+    --cdr-space-scale-quarter-x: clamp(0.3rem, 0.3rem + 0.11cqi, 0.4rem);
+    --cdr-space-scale-half-x: clamp(0.4rem, 0.4rem + 0.11cqi, 0.5rem);
+    --cdr-space-scale-three-quarter-x: clamp(0.8rem, 0.7rem + 0.22cqi, 1rem);
+    --cdr-space-scale-one-x: clamp(1.2rem, 1.1rem + 0.33cqi, 1.5rem);
+    --cdr-space-scale-one-and-a-half-x: clamp(1.6rem, 1.5rem + 0.44cqi, 2rem);
+    --cdr-space-scale-two-x: clamp(2.4rem, 2.2rem + 0.66cqi, 3rem);
+    --cdr-space-scale-three-x: clamp(3.2rem, 2.9rem + 0.88cqi, 4rem);
+    --cdr-space-scale-four-x: clamp(4.8rem, 4.4rem + 1.31cqi, 6rem);
+    --cdr-space-scale-five-x: clamp(6.4rem, 5.8rem + 1.75cqi, 8rem);
+    --cdr-space-scale-six-x: clamp(9.6rem, 8.8rem + 2.63cqi, 12rem);
   }
 }
 /** Remove once Safari < 16 is no longer a target */

From ec128b8c02dc38aeb3dbf62dd5aa715827422e31 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 23 Apr 2024 17:04:47 -0700
Subject: [PATCH 03/70] progress check

---
 src/components/box/CdrBox.vue                 |  4 +-
 src/components/box/styles/CdrBox.module.scss  | 38 ++----------------
 .../box/styles/vars/CdrBox.vars.scss          | 39 +++++++++++++++++++
 3 files changed, 45 insertions(+), 36 deletions(-)

diff --git a/src/components/box/CdrBox.vue b/src/components/box/CdrBox.vue
index f6d9cb9be..6573b68a1 100644
--- a/src/components/box/CdrBox.vue
+++ b/src/components/box/CdrBox.vue
@@ -89,8 +89,8 @@ const computedProps = computed(() => {
   if (props.palette) {
     const { color, surface } = palettes[props.palette];
     inlineStyles['--cdr-box-surface'] = `var(--cdr-color-background-${surface})`;
-    inlineStyles['--cdr-text-color'] = `var(--cdr-color-text-${color})`;
-    classes.add(surfaceClass);
+    inlineStyles['--cdr-box-text-color'] = `var(--cdr-color-text-${color})`;
+    classes.add(paletteClass);
   }
 
   // Add border
diff --git a/src/components/box/styles/CdrBox.module.scss b/src/components/box/styles/CdrBox.module.scss
index 57bc54438..980cd5565 100644
--- a/src/components/box/styles/CdrBox.module.scss
+++ b/src/components/box/styles/CdrBox.module.scss
@@ -1,40 +1,6 @@
 @import '../../../styles/settings/index.scss';
 @import './vars/CdrBox.vars.scss';
 
-@mixin cdr-box-base-mixin() {
-  --cdr-box-border-width-default: var(--cdr-space-inset-eighth-x);
-  --cdr-box-border-style-default: solid;
-  --cdr-box-border-color-default: var(--cdr-color-border-primary);
-  --cdr-box-radius-default: var(--cdr-radius-sharp);
-  --cdr-box-shadow-default: var(--cdr-prominence-flat);
-  --cdr-box-surface-default: transparent;
-  --cdr-box-elevation-default: 0;
-  --cdr-box-position-default: relative;
-}
-
-@mixin cdr-box-border-mixin() {
-  border: var(--cdr-box-border-width, var(--cdr-box-border-width-default))
-    var(--cdr-box-border-style, var(--cdr-box-border-style-default))
-    var(--cdr-box-border-color, var(--cdr-box-border-color-default));
-}
-
-@mixin cdr-box-radius-mixin() {
-  border-radius: var(--cdr-box-radius, var(--cdr-box-radius-default));
-}
-
-@mixin cdr-box-shadow-mixin() {
-  box-shadow: var(--cdr-box-shadow, var(--cdr-box-shadow-default));
-}
-
-@mixin cdr-box-surface-mixin() {
-  background-color: var(--cdr-box-surface, var(--cdr-box-surface-default));
-}
-
-@mixin cdr-box-elevation-mixin() {
-  z-index: var(--cdr-box-elevation, var(--cdr-box-elevation-default));
-  position: var(--cdr-box-position, var(--cdr-box-position-default));
-}
-
 .cdr-box {
   @include cdr-box-base-mixin;
 }
@@ -58,3 +24,7 @@
 .cdr-box__elevation {
   @include cdr-box-elevation-mixin;
 }
+
+.cdr-box__palette {
+  @include cdr-box-palette-mixin;
+}
\ No newline at end of file
diff --git a/src/components/box/styles/vars/CdrBox.vars.scss b/src/components/box/styles/vars/CdrBox.vars.scss
index e69de29bb..32dc82e67 100644
--- a/src/components/box/styles/vars/CdrBox.vars.scss
+++ b/src/components/box/styles/vars/CdrBox.vars.scss
@@ -0,0 +1,39 @@
+@mixin cdr-box-base-mixin() {
+  --cdr-box-border-width-default: var(--cdr-space-inset-eighth-x);
+  --cdr-box-border-style-default: solid;
+  --cdr-box-border-color-default: var(--cdr-color-border-primary);
+  --cdr-box-radius-default: var(--cdr-radius-sharp);
+  --cdr-box-shadow-default: var(--cdr-prominence-flat);
+  --cdr-box-surface-default: transparent;
+  --cdr-box-elevation-default: 0;
+  --cdr-box-position-default: relative;
+  --cdr-box-text-color-default: var(--cdr-color-text-primary);
+}
+
+@mixin cdr-box-border-mixin() {
+  border: var(--cdr-box-border-width, var(--cdr-box-border-width-default))
+    var(--cdr-box-border-style, var(--cdr-box-border-style-default))
+    var(--cdr-box-border-color, var(--cdr-box-border-color-default));
+}
+
+@mixin cdr-box-radius-mixin() {
+  border-radius: var(--cdr-box-radius, var(--cdr-box-radius-default));
+}
+
+@mixin cdr-box-shadow-mixin() {
+  box-shadow: var(--cdr-box-shadow, var(--cdr-box-shadow-default));
+}
+
+@mixin cdr-box-surface-mixin() {
+  background-color: var(--cdr-box-surface, var(--cdr-box-surface-default));
+}
+
+@mixin cdr-box-elevation-mixin() {
+  z-index: var(--cdr-box-elevation, var(--cdr-box-elevation-default));
+  position: var(--cdr-box-position, var(--cdr-box-position-default));
+}
+
+@mixin cdr-box-palette-mixin() {
+  background-color: var(--cdr-box-surface, var(--cdr-box-surface-default));
+  --cdr-text-color: var(--cdr-box-text-color, var(--cdr-box-text-color-default));
+}
\ No newline at end of file

From 48dd0abc123a00e041a471462bce8b91e9d94b5b Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Wed, 24 Apr 2024 13:47:17 -0700
Subject: [PATCH 04/70] progress check

---
 src/components/box/CdrBox.vue                 | 111 ++--
 src/components/box/examples/Box.vue           |   8 +-
 src/components/box/styles/CdrBox.module.scss  |  18 +-
 .../box/styles/vars/CdrBox.vars.scss          |   3 +-
 src/components/examples.js                    |   4 +-
 .../styledButton/CdrStyledButton.vue          |  28 +-
 .../styledButton/examples/StyledButton.vue    |   6 +-
 .../styles/CdrStyledButton.module.scss        |  26 +
 .../styles/CdrUnstyledButton.module.scss      |   6 -
 .../styles/vars/CdrStyledButton.vars.scss     | 533 ++++++++++++++++++
 .../styles/vars/CdrUnstyledButton.vars.scss   |  17 -
 .../unstyledButton/CdrUnstyledButton.vue      |   1 +
 .../examples/UnstyledButton.vue               |  24 +-
 .../styles/vars/CdrUnstyledButton.vars.scss   |   1 -
 src/dev/router.js                             |   1 +
 src/types/interfaces.ts                       |  93 +--
 src/types/other.ts                            |  47 +-
 17 files changed, 760 insertions(+), 167 deletions(-)
 create mode 100644 src/components/styledButton/styles/CdrStyledButton.module.scss
 delete mode 100644 src/components/styledButton/styles/CdrUnstyledButton.module.scss
 create mode 100644 src/components/styledButton/styles/vars/CdrStyledButton.vars.scss
 delete mode 100644 src/components/styledButton/styles/vars/CdrUnstyledButton.vars.scss

diff --git a/src/components/box/CdrBox.vue b/src/components/box/CdrBox.vue
index 6573b68a1..37f405152 100644
--- a/src/components/box/CdrBox.vue
+++ b/src/components/box/CdrBox.vue
@@ -1,61 +1,62 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import type * as CSS from 'csstype';
+import type { HTMLAttributes } from '../../types/interfaces';
 import mapClasses from '../../utils/mapClasses';
-import type { StylingProps } from '../../types/other';
+import type {
+  Tag,
+  Space,
+  Shadow,
+  Radius,
+  BorderColor,
+  Elevation,
+  Position,
+  Palette,
+  Surface,
+} from '../../types/other';
 
 /** Base component for all other components */
 
 defineOptions({ name: 'CdrBox' });
 
-export interface CdrBoxProps extends StylingProps {
-  tag?: keyof HTMLElementTagNameMap;
-  shadow?: 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
-  radius?: 'sharp' | 'soft' | 'softer' | 'round';
-  surface?: 'primary' | 'secondary' | 'brand-spruce';
-  borderWidth?:
-    | 'eighth-x'
-    | 'quarter-x'
-    | 'half-x'
-    | 'three-quarter-x'
-    | 'one-x'
-    | 'one-and-a-half-x'
-    | 'two-x'
-    | 'three-x'
-    | 'four-x';
-  borderColor?: 'primary' | 'secondary' | 'success' | 'warning' | 'error';
-  elevation?:
-    | 'ground'
-    | 'dropdown'
-    | 'popover'
-    | 'navigation'
-    | 'sticky'
-    | 'notification'
-    | 'modal';
-  position?: CSS.Properties['position'];
-  palette?: 'primary' | 'sale';
+export interface CdrBoxProps extends HTMLAttributes {
+  tag?: Tag;
+  shadow?: Shadow;
+  radius?: Radius;
+  surface?: Surface;
+  borderWidth?: Space;
+  borderColor?: BorderColor;
+  elevation?: Elevation;
+  position?: Position;
+  palette?: Palette;
+  m?: Space;
+  mx?: Space;
+  my?: Space;
+  ml?: Space;
+  mr?: Space;
+  mt?: Space;
+  mb?: Space;
+  p?: Space;
+  px?: Space;
+  py?: Space;
+  pl?: Space;
+  pr?: Space;
+  pt?: Space;
+  pb?: Space;
 }
 
 const props = withDefaults(defineProps<CdrBoxProps>(), {
   tag: 'div',
-  shadow: undefined,
-  radius: undefined,
-  surface: undefined,
-  borderWidth: undefined,
-  borderColor: undefined,
-  elevation: undefined,
-  position: undefined,
-  palette: undefined,
 });
 
 const style = useCssModule();
 const baseClass = 'cdr-box';
-const borderClass = `${baseClass}__border`;
-const radiusClass = `${baseClass}__radius`;
-const shadowClass = `${baseClass}__shadow`;
-const surfaceClass = `${baseClass}__surface`;
-const elevationClass = `${baseClass}__elevation`;
-const paletteClass = `${baseClass}__palette`;
+const borderClass = `${baseClass}--border`;
+const radiusClass = `${baseClass}--radius`;
+const shadowClass = `${baseClass}--shadow`;
+const surfaceClass = `${baseClass}--surface`;
+const elevationClass = `${baseClass}--elevation`;
+const paletteClass = `${baseClass}--palette`;
 
 // Map of zIndex for elevation
 const elevations = {
@@ -80,6 +81,25 @@ const palettes = {
   },
 };
 
+// Map of margins and padding
+const marginsAndPaddingMap = {
+  m: 'margin',
+  mx: 'marginInline',
+  my: 'marginBlock',
+  ml: 'marginInlineStart',
+  mr: 'marginInlineEnd',
+  mt: 'marginTop',
+  mb: 'marginBottom',
+  p: 'padding',
+  px: 'marginInline',
+  py: 'paddingBlock',
+  pl: 'paddingInlineStart',
+  pr: 'paddingInlineEnd',
+  pt: 'paddingTop',
+  pb: 'paddingBottom',
+};
+const marginAndPaddingKeys = Object.keys(marginsAndPaddingMap);
+
 // Manages the props passed along to CdrBox
 const computedProps = computed(() => {
   const classes = new Set([baseClass]);
@@ -137,6 +157,15 @@ const computedProps = computed(() => {
     classes.add(elevationClass);
   }
 
+  // Add margin and padding
+  if (marginAndPaddingKeys.find((key) => props[key])) {
+    marginAndPaddingKeys.forEach((key) => {
+      if (props[key]) {
+        inlineStyles[marginsAndPaddingMap[key]] = `var(--cdr-space-scale-${props[key]})`;
+      }
+    });
+  }
+
   return { style: inlineStyles, class: mapClasses(style, ...classes) };
 });
 </script>
diff --git a/src/components/box/examples/Box.vue b/src/components/box/examples/Box.vue
index 3ddefa44b..b81709aca 100644
--- a/src/components/box/examples/Box.vue
+++ b/src/components/box/examples/Box.vue
@@ -11,12 +11,12 @@ export interface Example {
 
 const boxes: Example[] = [
   {
-    description: 'This is a box without any props',
-    props: {},
+    description: 'This is a box without any specific props',
+    props: { 'data-id': 'test' },
   },
   {
     description:
-      'This is a box with radius, shadow, borderColor, surface, elevation and position props applied.',
+      'This is a box with radius, shadow, borderColor, surface, elevation, position, margin, and padding props applied.',
     props: {
       radius: 'round',
       shadow: 'elevated',
@@ -24,6 +24,8 @@ const boxes: Example[] = [
       surface: 'secondary',
       elevation: 'modal',
       position: 'relative',
+      m: 'one-x',
+      p: 'one-x',
     },
   },
   {
diff --git a/src/components/box/styles/CdrBox.module.scss b/src/components/box/styles/CdrBox.module.scss
index 980cd5565..dd7ad9844 100644
--- a/src/components/box/styles/CdrBox.module.scss
+++ b/src/components/box/styles/CdrBox.module.scss
@@ -3,28 +3,34 @@
 
 .cdr-box {
   @include cdr-box-base-mixin;
+  // @include cdr-box-border-mixin;
+  // @include cdr-box-radius-mixin;
+  // @include cdr-box-shadow-mixin;
+  // @include cdr-box-surface-mixin;
+  // @include cdr-box-elevation-mixin;
+  // @include cdr-box-palette-mixin;
 }
 
-.cdr-box__border {
+.cdr-box--border {
   @include cdr-box-border-mixin;
 }
 
-.cdr-box__radius {
+.cdr-box--radius {
   @include cdr-box-radius-mixin;
 }
 
-.cdr-box__shadow {
+.cdr-box--shadow {
   @include cdr-box-shadow-mixin;
 }
 
-.cdr-box__surface {
+.cdr-box--surface {
   @include cdr-box-surface-mixin;
 }
 
-.cdr-box__elevation {
+.cdr-box--elevation {
   @include cdr-box-elevation-mixin;
 }
 
-.cdr-box__palette {
+.cdr-box--palette {
   @include cdr-box-palette-mixin;
 }
\ No newline at end of file
diff --git a/src/components/box/styles/vars/CdrBox.vars.scss b/src/components/box/styles/vars/CdrBox.vars.scss
index 32dc82e67..363d44c43 100644
--- a/src/components/box/styles/vars/CdrBox.vars.scss
+++ b/src/components/box/styles/vars/CdrBox.vars.scss
@@ -1,5 +1,6 @@
 @mixin cdr-box-base-mixin() {
-  --cdr-box-border-width-default: var(--cdr-space-inset-eighth-x);
+  --cdr-color-background-transparent: transparent;
+  --cdr-box-border-width-default: 0;
   --cdr-box-border-style-default: solid;
   --cdr-box-border-color-default: var(--cdr-color-border-primary);
   --cdr-box-radius-default: var(--cdr-radius-sharp);
diff --git a/src/components/examples.js b/src/components/examples.js
index f1a2fa3e4..e76a9b242 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -8,7 +8,7 @@ import captions from 'componentsdir/caption/examples/Caption.vue';
 import card from 'componentsdir/card/examples/Cards.vue';
 import checkbox from 'componentsdir/checkbox/examples/checkboxes.vue';
 import chip from 'componentsdir/chip/examples/Chip.vue';
-import choreographer from 'componentsdir/choreographer/examples/Choreographer.vue'
+import choreographer from 'componentsdir/choreographer/examples/Choreographer.vue';
 import container from 'componentsdir/container/examples/Container.vue';
 import formGroup from 'componentsdir/formGroup/examples/FormGroup.vue';
 import grid from 'componentsdir/grid/examples/Grid.vue';
@@ -30,6 +30,7 @@ import rating from 'componentsdir/rating/examples/Ratings.vue';
 import selects from 'componentsdir/select/examples/Selects.vue';
 import skeleton from 'componentsdir/skeleton/examples/Skeleton.vue';
 import splitSurface from 'componentsdir/splitSurface/examples/SplitSurface.vue';
+import styledButton from 'componentsdir/styledButton/examples/StyledButton.vue';
 import tables from 'componentsdir/table/examples/Table.vue';
 import tabs from 'componentsdir/tabs/examples/Tabs.vue';
 import texts from 'componentsdir/text/examples/Text.vue';
@@ -73,6 +74,7 @@ export default {
   selects,
   skeleton,
   splitSurface,
+  styledButton,
   tables,
   tabs,
   texts,
diff --git a/src/components/styledButton/CdrStyledButton.vue b/src/components/styledButton/CdrStyledButton.vue
index 449f98871..f71262c26 100644
--- a/src/components/styledButton/CdrStyledButton.vue
+++ b/src/components/styledButton/CdrStyledButton.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
+import type * as CSS from 'csstype';
 import mapClasses from '../../utils/mapClasses';
 import CdrUnstyledButton, {
   type CdrUnstyledButtonProps,
@@ -9,20 +10,31 @@ import CdrUnstyledButton, {
 
 defineOptions({ name: 'CdrStyledButton' });
 
-export interface CdrStyledButtonProps extends CdrUnstyledButtonProps {}
+export interface CdrStyledButtonProps extends CdrUnstyledButtonProps {
+  modifier?: 'primary' | 'secondary' | 'sale' | 'dark' | 'link';
+  size?: 'small' | 'medium' | 'large';
+}
 
-const props = withDefaults(defineProps<CdrStyledButtonProps>(), {});
+const props = withDefaults(defineProps<CdrStyledButtonProps>(), {
+  modifier: 'primary',
+  size: 'medium',
+});
 
 const style = useCssModule();
 const baseClass = 'cdr-styled-button';
 
 // Manages the props passed along to CdrBox
-const computedProps = computed(() => ({
-  ...props,
-  // Automatically apply a type if using button tag
-  type: props.tag == 'button' ? props.type || 'button' : undefined,
-  class: mapClasses(style, baseClass),
-}));
+const computedProps = computed(() => {
+  const classes = new Set([baseClass]);
+  const inlineStyles: CSS.Properties = {};
+
+  // Add modifier
+  if (props.modifier) {
+    classes.add(`${baseClass}--${props.modifier}`);
+  }
+
+  return { ...props, style: inlineStyles, class: mapClasses(style, ...classes) };
+});
 </script>
 
 <template>
diff --git a/src/components/styledButton/examples/StyledButton.vue b/src/components/styledButton/examples/StyledButton.vue
index 3aefa46a0..f5a072b46 100644
--- a/src/components/styledButton/examples/StyledButton.vue
+++ b/src/components/styledButton/examples/StyledButton.vue
@@ -11,12 +11,12 @@ export interface Example {
 const boxes: Example[] = [
   {
     description: 'This is a styled button',
-    props: {},
+    props: { 'data-id': 'test', surface: 'secondary' },
   },
   {
     description:
-      'This button has padding, background, shadow, and radius applied. It inherits all props from CdrUnstyledButton',
-    props: {},
+      'This button has a modifier prop applied. It inherits all props from CdrUnstyledButton',
+    props: { modifier: 'secondary' },
   },
 ];
 </script>
diff --git a/src/components/styledButton/styles/CdrStyledButton.module.scss b/src/components/styledButton/styles/CdrStyledButton.module.scss
new file mode 100644
index 000000000..c31d7b1b7
--- /dev/null
+++ b/src/components/styledButton/styles/CdrStyledButton.module.scss
@@ -0,0 +1,26 @@
+@import '../../../styles/settings/index.scss';
+@import './vars/CdrStyledButton.vars.scss';
+
+.cdr-styled-button {
+  @include cdr-button-base-mixin;
+
+  &--primary {
+    @include cdr-button-primary-mixin;
+  }
+
+  &--secondary {
+    @include cdr-button-secondary-mixin;
+  }
+
+  &--large {
+    @include cdr-button-large-mixin;
+  }
+
+  &--medium {
+    @include cdr-button-medium-mixin;
+  }
+
+  &--small {
+    @include cdr-button-small-mixin;
+  }
+}
diff --git a/src/components/styledButton/styles/CdrUnstyledButton.module.scss b/src/components/styledButton/styles/CdrUnstyledButton.module.scss
deleted file mode 100644
index 1448e9943..000000000
--- a/src/components/styledButton/styles/CdrUnstyledButton.module.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-@import '../../../styles/settings/index.scss';
-@import './vars/CdrStyledButton.vars.scss';
-
-.cdr-unstyled-button {
-  @include cdr-styled-button-base-mixin;
-}
diff --git a/src/components/styledButton/styles/vars/CdrStyledButton.vars.scss b/src/components/styledButton/styles/vars/CdrStyledButton.vars.scss
new file mode 100644
index 000000000..e16b99d6b
--- /dev/null
+++ b/src/components/styledButton/styles/vars/CdrStyledButton.vars.scss
@@ -0,0 +1,533 @@
+@mixin cdr-button-base-text-mixin-small() {
+  font-family: $cdr-font-family-sans;
+  font-style: normal;
+  font-weight: 500;
+  letter-spacing: -.008rem;
+  font-size: 1.4rem;
+  line-height: 1.8rem;
+}
+
+@mixin cdr-button-base-text-mixin-medium() {
+  font-family: $cdr-font-family-sans;
+  font-style: normal;
+  font-weight: 500;
+  letter-spacing: -.008rem;
+  font-size: 1.6rem;
+  line-height: 2.2rem;
+}
+
+@mixin cdr-button-base-mixin() {
+  @include cdr-button-base-text-mixin-medium;
+
+  border: none;
+  border-radius: $cdr-radius-softer;
+  cursor: pointer;
+  display: inline-flex;
+  outline: none;
+  overflow: visible;
+  margin: 0;
+  padding: $cdr-space-inset-one-x-squish;
+  text-align: left;
+  text-decoration: none;
+  text-transform: none;
+  vertical-align: middle;
+
+  transition: box-shadow $cdr-duration-2-x $cdr-timing-function-ease, background-color $cdr-duration-2-x $cdr-timing-function-ease, color $cdr-duration-2-x $cdr-timing-function-ease, fill $cdr-duration-2-x $cdr-timing-function-ease;
+
+  &:hover, &:active, &:focus {
+    outline: none;
+    outline-offset: 0;
+    text-decoration: none;
+  }
+
+  &[disabled] {
+    cursor: not-allowed;
+  }
+}
+
+@mixin cdr-button-base-icon-mixin() {
+  align-self: center;
+  fill: inherit;
+}
+
+@mixin cdr-button-primary-mixin() {
+  //ITEM_DOC: Primary button's background color
+  background-color: var(--cdr-button-primary-background-color-rest, var(--cdr-color-background-button-primary-rest, #{$cdr-color-background-button-primary-rest}));
+  //ITEM_DOC: Primary button's box shadow which serves as a border
+  box-shadow: inset 0 0 0 1px var(--cdr-button-primary-box-shadow-color-rest, var(--cdr-color-border-button-primary-rest, #{$cdr-color-border-button-primary-rest}));
+  //ITEM_DOC: Primary button's text color
+  color: var(--cdr-button-primary-text-color, var(--cdr-color-text-button-primary, #{$cdr-color-text-button-primary}));
+  //ITEM_DOC: Primary button's fill color
+  fill: var(--cdr-button-primary-fill-color, var(--cdr-color-text-button-primary, #{$cdr-color-text-button-primary}));
+
+  &:hover,
+  &:focus {
+    //ITEM_DOC: Primary button's text color when hovered or focused
+    color: var(--cdr-button-primary-text-color-interaction, var(--cdr-color-text-button-primary-hover, #{$cdr-color-text-button-primary-hover}));
+    //ITEM_DOC: Primary button's fill color when hovered or focused
+    fill: var(--cdr-button-primary-fill-color-interaction, var(--cdr-color-text-button-primary-hover, #{$cdr-color-text-button-primary-hover}));
+    //ITEM_DOC: Primary button's background color when hovered or focused
+    background-color: var(--cdr-button-primary-background-color-interaction, var(--cdr-color-background-button-primary-hover, #{$cdr-color-background-button-primary-hover}));
+    //ITEM_DOC: Primary button's box shadow when hovered or focused
+    box-shadow: inset 0 0 0 3px var(--cdr-button-primary-box-shadow-color-interaction, var(--cdr-color-border-button-primary-hover, #{$cdr-color-border-button-primary-hover})), $cdr-prominence-raised;
+  }
+
+  &:active {
+    //ITEM_DOC: Primary button's text color when active
+    color: var(--cdr-button-primary-text-color-active, var(--cdr-color-text-button-primary-active, #{$cdr-color-text-button-primary-active}));
+    //ITEM_DOC: Primary button's fill color when active
+    fill: var(--cdr-button-primary-fill-color-active, var(--cdr-color-text-button-primary-active, #{$cdr-color-text-button-primary-active}));
+    //ITEM_DOC: Primary button's background color when active
+    background-color: var(--cdr-button-primary-background-color-active, var(--cdr-color-background-button-primary-active, #{$cdr-color-background-button-primary-active}));
+    //ITEM_DOC: Primary button's box shadow when active. //ITEM_DOC: Primary button's inset box shadow when active
+    box-shadow: inset 0 0 0 3px var(--cdr-button-primary-box-shadow-color-active, var(--cdr-color-border-button-primary-active, #{$cdr-color-border-button-primary-active})), inset 0 0 0 5px var(--cdr-button-primary-box-shadow-color-active-inset, var(--cdr-color-border-button-primary-active-inset, #{$cdr-color-border-button-primary-active-inset}));
+  }
+
+  &[disabled] {
+    //ITEM_DOC: Primary button's background color when disabled
+    background-color: var(--cdr-button-primary-background-color-disabled, var(--cdr-color-background-button-default-disabled, #{$cdr-color-background-button-default-disabled}));
+    //ITEM_DOC: Primary button's border color when disabled
+    box-shadow: inset 0 0 0 1px var(--cdr-button-primary-box-shadow-color-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
+    //ITEM_DOC: Primary button's text color when disabled
+    color: var(--cdr-button-primary-text-color-disabled, var(--cdr-color-text-button-primary-disabled, #{$cdr-color-text-button-primary-disabled}));
+    //ITEM_DOC: Primary button's fill color when disabled
+    fill: var(--cdr-button-primary-fill-color-disabled, var(--cdr-color-text-button-primary-disabled, #{$cdr-color-text-button-primary-disabled}));
+  }
+}
+
+@mixin cdr-button-secondary-mixin() {
+  //ITEM_DOC: Secondary button's background color
+  background-color: var(--cdr-button-secondary-background-color-rest, var(--cdr-color-background-button-secondary-rest, #{$cdr-color-background-button-secondary-rest}));
+  //ITEM_DOC: Secondary button's box shadow which serves as a border
+  box-shadow: inset 0 0 0 1px var(--cdr-button-secondary-box-shadow-color-rest, var(--cdr-color-border-button-secondary-rest, #{$cdr-color-border-button-secondary-rest}));
+  //ITEM_DOC: Secondary button's text color
+  color: var(--cdr-button-secondary-text-color, var(--cdr-color-text-button-secondary, #{$cdr-color-text-button-secondary}));
+  //ITEM_DOC: Secondary button's fill color
+  fill: var(--cdr-button-secondary-fill-color, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
+
+  &:hover,
+  &:focus {
+    //ITEM_DOC: Secondary button's text color when hovered or focused
+    color: var(--cdr-button-secondary-text-color-interaction, var(--cdr-color-text-button-secondary-hover, #{$cdr-color-text-button-secondary-hover}));
+    //ITEM_DOC: Secondary button's fill color when hovered or focused
+    fill: var(--cdr-button-secondary-fill-color-interaction, var(--cdr-color-text-button-secondary-hover, #{$cdr-color-text-button-secondary-hover}));
+    //ITEM_DOC: Secondary button's background color when hovered or focused
+    background-color: var(--cdr-button-secondary-background-color-interaction, var(--cdr-color-background-button-secondary-hover, #{$cdr-color-background-button-secondary-hover}));
+    //ITEM_DOC: Secondary button's box shadow when hovered or focused
+    box-shadow: inset 0 0 0 3px var(--cdr-button-secondary-box-shadow-color-interaction, var(--cdr-color-border-button-secondary-hover, #{$cdr-color-border-button-secondary-hover})), $cdr-prominence-raised;
+  }
+
+  &:active {
+    //ITEM_DOC: Secondary button's text color when active
+    color: var(--cdr-button-secondary-text-color-active, var(--cdr-color-text-button-secondary-active, #{$cdr-color-text-button-secondary-active}));
+    //ITEM_DOC: Secondary button's fill color when active
+    fill: var(--cdr-button-secondary-fill-color-active, var(--cdr-color-text-button-secondary-active, #{$cdr-color-text-button-secondary-active}));
+    //ITEM_DOC: Secondary button's background color when active
+    background-color: var(--cdr-button-secondary-background-color-active, var(--cdr-color-background-button-secondary-active, #{$cdr-color-background-button-secondary-active}));
+    //ITEM_DOC: Secondary button's box shadow when active. //ITEM_DOC: Secondary button's inset box shadow when active
+    box-shadow: inset 0 0 0 3px var(--cdr-button-secondary-box-shadow-color-active, var(--cdr-color-border-button-secondary-active, #{$cdr-color-border-button-secondary-active})), inset 0 0 0 5px var(--cdr-button-secondary-border-color-active-inset, var(--cdr-color-border-button-secondary-active-inset, #{$cdr-color-border-button-secondary-active-inset}));
+  }
+
+  &[disabled] {
+    //ITEM_DOC: Secondary button's background color when disabled
+    background-color: var(--cdr-button-secondary-background-color-disabled, var(--cdr-color-background-button-secondary-disabled, #{$cdr-color-background-button-secondary-disabled}));
+    //ITEM_DOC: Secondary button's box shadow color when disabled. The box shadow serves as a border
+    box-shadow: inset 0 0 0 1px var(--cdr-button-secondary-box-shadow-color-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
+    //ITEM_DOC: Secondary button's text color when disabled
+    color: var(--cdr-button-secondary-text-color-disabled, var(--cdr-color-text-button-secondary-disabled, #{$cdr-color-text-button-secondary-disabled}));
+    //ITEM_DOC: Secondary button's fill color when disabled
+    fill: var(--cdr-button-secondary-fill-color-disabled, var(--cdr-color-text-button-secondary-disabled, #{$cdr-color-text-button-secondary-disabled}));
+  }
+}
+
+@mixin cdr-button-dark-mixin() {
+  //ITEM_DOC: Dark button's background color
+  background-color: var(--cdr-button-dark-background-color-rest, var(--cdr-color-background-button-dark-rest, #{$cdr-color-background-button-dark-rest}));
+  //ITEM_DOC: Dark button's box shadow which serves as a border
+  box-shadow: inset 0 0 0 1px var(--cdr-button-dark-box-shadow-color-rest, var(--cdr-color-border-button-dark-rest, #{$cdr-color-border-button-dark-rest}));
+  //ITEM_DOC: Dark button's text color
+  color: var(--cdr-button-dark-text-color, var(--cdr-color-text-button-dark, #{$cdr-color-text-button-dark}));
+  //ITEM_DOC: Dark button's fill color
+  fill: var(--cdr-button-dark-fill-color, var(--cdr-color-text-button-dark, #{$cdr-color-text-button-dark}));
+
+  &:hover,
+  &:focus {
+    //ITEM_DOC: Dark button's text color when hovered or focused
+    color: var(--cdr-button-dark-text-color-interaction, var(--cdr-color-text-button-dark-hover, #{$cdr-color-text-button-dark-hover}));
+    //ITEM_DOC: Dark button's fill color when hovered or focused
+    fill: var(--cdr-button-dark-fill-color-interaction, var(--cdr-color-text-button-dark-hover, #{$cdr-color-text-button-dark-hover}));
+    //ITEM_DOC: Dark button's background color when hovered or focused
+    background-color: var(--cdr-button-dark-background-color-interaction, var(--cdr-color-background-button-dark-hover, #{$cdr-color-background-button-dark-hover}));
+    //ITEM_DOC: Dark button's box shadow when hovered or focused
+    box-shadow: inset 0 0 0 3px var(--cdr-button-dark-box-shadow-color-interaction, var(--cdr-color-border-button-dark-hover, #{$cdr-color-border-button-dark-hover})), $cdr-prominence-raised;
+  }
+
+  &:active {
+    //ITEM_DOC: Dark button's text color when active
+    color: var(--cdr-button-dark-text-color-active, var(--cdr-color-text-button-dark-active, #{$cdr-color-text-button-dark-active}));
+    //ITEM_DOC: Dark button's fill color when active
+    fill: var(--cdr-button-dark-fill-color-active, var(--cdr-color-text-button-dark-active, #{$cdr-color-text-button-dark-active}));
+    //ITEM_DOC: Dark button's background color when active
+    background-color: var(--cdr-button-dark-background-color-active, var(--cdr-color-background-button-dark-active, #{$cdr-color-background-button-dark-active}));
+    //ITEM_DOC: Dark button's box shadow when active. The box shadow serves as a border. //ITEM_DOC: Dark button's inset box shadow when active. The box shadow serves as a border
+    box-shadow: inset 0 0 0 3px var(--cdr-button-dark-box-shadow-color-active, var(--cdr-color-border-button-dark-active, #{$cdr-color-border-button-dark-active})), inset 0 0 0 5px var(--cdr-button-dark-box-shadow-color-active-inset, var(--cdr-color-border-button-dark-active-inset, #{$cdr-color-border-button-dark-active-inset}));
+  }
+
+  &[disabled] {
+    //ITEM_DOC: Dark button's background color when disabled
+    background-color: var(--cdr-button-dark-background-color-disabled, var(--cdr-color-background-button-default-disabled, #{$cdr-color-background-button-default-disabled}));
+    //ITEM_DOC: Dark button's box shadow color when disabled. The box shadow serves as a border
+    box-shadow: inset 0 0 0 1px var(--cdr-button-dark-box-shadow-color-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
+    //ITEM_DOC: Dark button's text color when disabled
+    color: var(--cdr-button-dark-text-color-disabled, var(--cdr-color-text-button-dark-disabled, #{$cdr-color-text-button-dark-disabled}));
+    //ITEM_DOC: Dark button's fill color when disabled
+    fill: var(--cdr-button-dark-fill-color-disabled, var(--cdr-color-text-button-dark-disabled, #{$cdr-color-text-button-dark-disabled}));
+  }
+}
+
+@mixin cdr-button-sale-mixin() {
+  //ITEM_DOC: Sale button's background color
+  background-color: var(--cdr-button-sale-background-color-rest, var(--cdr-color-background-button-sale-rest, #{$cdr-color-background-button-sale-rest}));
+  //ITEM_DOC: Sale button's box shadow which serves as a border
+  box-shadow: inset 0 0 0 1px var(--cdr-button-sale-box-shadow-color-rest, var(--cdr-color-border-button-sale-rest, #{$cdr-color-border-button-sale-rest}));
+  //ITEM_DOC: Sale button's text color
+  color: var(--cdr-button-sale-text-color, var(--cdr-color-text-button-sale, #{$cdr-color-text-button-sale}));
+  //ITEM_DOC: Sale button's fill color
+  fill: var(--cdr-button-sale-fill-color, var(--cdr-color-text-button-sale, #{$cdr-color-text-button-sale}));
+
+  &:hover,
+  &:focus {
+    //ITEM_DOC: Sale button's text color when hovered or focused
+    color: var(--cdr-button-sale-text-color-interaction, var(--cdr-color-text-button-sale-hover, #{$cdr-color-text-button-sale-hover}));
+    //ITEM_DOC: Sale button's fill color when hovered or focused
+    fill: var(--cdr-button-sale-fill-color-interaction, var(--cdr-color-text-button-sale-hover, #{$cdr-color-text-button-sale-hover}));
+    //ITEM_DOC: Sale button's background color when hovered or focused
+    background-color: var(--cdr-button-sale-background-color-interaction, var(--cdr-color-background-button-sale-hover, #{$cdr-color-background-button-sale-hover}));
+    //ITEM_DOC: Sale button's box shadow when hovered or focused. The box shadow serves as a border
+    box-shadow: inset 0 0 0 3px var(--cdr-button-sale-box-shadow-color-interaction, var(--cdr-color-border-button-sale-hover, #{$cdr-color-border-button-sale-hover})), $cdr-prominence-raised;
+  }
+
+  &:active {
+    //ITEM_DOC: Sale button's text color when active
+    color: var(--cdr-button-sale-text-color-active, var(--cdr-color-text-button-sale-active, #{$cdr-color-text-button-sale-active}));
+    //ITEM_DOC: Sale button's fill color when active
+    fill: var(--cdr-button-sale-fill-color-active, var(--cdr-color-text-button-sale-active, #{$cdr-color-text-button-sale-active}));
+    //ITEM_DOC: Sale button's background color when active
+    background-color: var(--cdr-button-sale-background-color-active, var(--cdr-color-background-button-sale-active, #{$cdr-color-background-button-sale-active}));
+    //ITEM_DOC: Sale button's box shadow when active. The box shadow serves as a border. //ITEM_DOC: Sale button's inset box shadow when active. The box shadow serves as a border
+    box-shadow: inset 0 0 0 3px var(--cdr-button-sale-box-shadow-color-active, var(--cdr-color-border-button-sale-active, #{$cdr-color-border-button-sale-active})), inset 0 0 0 5px var(--cdr-button-sale-box-shadow-color-active-inset, var(--cdr-color-border-button-sale-active-inset, #{$cdr-color-border-button-sale-active-inset}));
+  }
+
+  &[disabled] {
+    //ITEM_DOC: Sale button's background color when disabled
+    background-color: var(--cdr-button-sale-background-color-disabled, var(--cdr-color-background-button-default-disabled, #{$cdr-color-background-button-default-disabled}));
+    //ITEM_DOC: Sale button's border color when disabled
+    box-shadow: inset 0 0 0 1px var(--cdr-button-sale-box-shadow-color-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
+    //ITEM_DOC: Sale button's text color when disabled
+    color: var(--cdr-button-sale-text-color-disabled, var(--cdr-color-text-button-sale-disabled, #{$cdr-color-text-button-sale-disabled}));
+    //ITEM_DOC: Sale button's fill color when disabled
+    fill: var(--cdr-button-sale-fill-color-disabled, var(--cdr-color-text-button-sale-disabled, #{$cdr-color-text-button-sale-disabled}));
+  }
+}
+
+
+@mixin cdr-button-link-mixin() {
+  //ITEM_DOC: Link variant of cdr-button's text color
+  color: var(--cdr-button-link-text-color, var(--cdr-color-text-link-rest, #{$cdr-color-text-link-rest}));
+  //ITEM_DOC: Link variant of cdr-button's fill color
+  fill: var(--cdr-button-link-fill-color, var(--cdr-color-text-link-rest, #{$cdr-color-text-link-rest}));
+  background-color: transparent;
+  text-decoration: underline;
+
+  &:active,
+  &:focus {
+    //ITEM_DOC: Link variant of cdr-button's text color when active or focused
+    color: var(--cdr-button-link-text-color-active, var(--cdr-color-text-link-active, #{$cdr-color-text-link-active}));
+  }
+
+  &:hover {
+    //ITEM_DOC: Link variant of cdr-button's text color when hovered
+    color: var(--cdr-button-link-text-color-hover, var(--cdr-color-text-link-hover, #{$cdr-color-text-link-hover}));
+    //ITEM_DOC: Link variant of cdr-button's text decoration when hovered
+    text-decoration: none;
+  }
+
+  &:focus {
+    //ITEM_DOC: Link variant of cdr-button's outline
+    outline: var(--cdr-button-link-outline, var(--default-outline, #{$default-outline}));
+    outline-color: -webkit-focus-ring-color;
+    outline-offset: 0;
+  }
+}
+
+
+@mixin cdr-button-secondary-elevated-mixin() {
+  //ITEM_DOC: Box shadow color of a secondary elevated cdr-button
+  box-shadow: inset 0 0 0 1px var(--cdr-button-secondary-box-shadow, var(--cdr-color-border-button-secondary-rest, #{$cdr-color-border-button-secondary-rest})), $cdr-prominence-elevated;
+
+  &:hover,
+  &:focus {
+    //ITEM_DOC: Box shadow color of a secondary elevated cdr-button when hovered or focused
+    box-shadow: inset 0 0 0 3px var(--cdr-button-secondary-interaction-box-shadow, var(--cdr-color-border-button-secondary-hover, #{$cdr-color-border-button-secondary-hover})), $cdr-prominence-floating;
+  }
+
+  &:active {
+    //ITEM_DOC: Box shadow color of a secondary elevated cdr-button when active. //ITEM_DOC: Inset box shadow color of a secondary elevated cdr-button when active
+    box-shadow: inset 0 0 0 3px var(--cdr-button-secondary-active-box-shadow, var(--cdr-color-border-button-secondary-active, #{$cdr-color-border-button-secondary-active})), inset 0 0 0 5px var(--cdr-button-secondary-active-inset-box-shadow, var(--cdr-color-border-button-secondary-active-inset, #{$cdr-color-border-button-secondary-active-inset})), $cdr-prominence-raised;
+  }
+}
+
+@mixin cdr-button-primary-elevated-mixin() {
+  //ITEM_DOC: Box shadow color of a primary elevated cdr-button
+  box-shadow: inset 0 0 0 1px var(--cdr-button-primary-box-shadow, var(--cdr-color-border-button-primary-rest, #{$cdr-color-border-button-primary-rest})), $cdr-prominence-elevated;
+
+  &:hover,
+  &:focus {
+    //ITEM_DOC: Box shadow color of a primary elevated cdr-button when hovered or focused
+    box-shadow: inset 0 0 0 3px var(--cdr-button-primary-hover-focus-box-shadow, var(--cdr-color-border-button-primary-hover, #{$cdr-color-border-button-primary-hover})), $cdr-prominence-floating;
+  }
+
+  &:active {
+    //ITEM_DOC: Box shadow color of a primary elevated cdr-button when active. //ITEM_DOC: Inset box shadow color of a primary elevated cdr-button when active
+    box-shadow: inset 0 0 0 3px var(--cdr-button-primary-active-box-shadow, var(--cdr-color-border-button-primary-active, #{$cdr-color-border-button-primary-active})), inset 0 0 0 5px var(--cdr-button-primary-active-inset-box-shadow, var(--cdr-color-border-button-primary-active-inset, #{$cdr-color-border-button-primary-active-inset})), $cdr-prominence-raised;
+  }
+}
+
+@mixin cdr-button-dark-elevated-mixin() {
+  //ITEM_DOC: Box shadow color of a dark elevated cdr-button
+  box-shadow: inset 0 0 0 1px var(--cdr-button-dark-box-shadow-rest, var(--cdr-color-border-button-dark-rest, #{$cdr-color-border-button-dark-rest})), $cdr-prominence-elevated;
+
+  &:hover,
+  &:focus {
+    //ITEM_DOC: Box shadow color of a dark elevated cdr-button when hovered or focused
+    box-shadow: inset 0 0 0 3px var(--cdr-button-dark-box-shadow-interaction, var(--cdr-color-border-button-dark-hover, #{$cdr-color-border-button-dark-hover})), $cdr-prominence-floating;
+  }
+
+  &:active {
+    //ITEM_DOC: Box shadow color of a dark elevated cdr-button when active. //ITEM_DOC: Inset box shadow color of a dark elevated cdr-button when active
+    box-shadow: inset 0 0 0 3px var(--cdr-button-dark-box-shadow-active, var(--cdr-color-border-button-dark-active, #{$cdr-color-border-button-dark-active})), inset 0 0 0 5px var(--cdr-button-dark-active-inset-box-shadow, var(--cdr-color-border-button-dark-active-inset, #{$cdr-color-border-button-dark-active-inset})), $cdr-prominence-raised;
+  }
+}
+
+@mixin cdr-button-sale-elevated-mixin() {
+  //ITEM_DOC: Box shadow color of a sale elevated cdr-button
+  box-shadow: inset 0 0 0 1px var(--cdr-button-sale-box-shadow-rest, var(--cdr-color-border-button-sale-rest, #{$cdr-color-border-button-sale-rest})), $cdr-prominence-elevated;
+
+  &:hover,
+  &:focus {
+    //ITEM_DOC: Box shadow color of a sale elevated cdr-button when hovered or focused
+    box-shadow: inset 0 0 0 3px var(--cdr-button-sale-box-shadow-interaction, var(--cdr-color-border-button-sale-hover, #{$cdr-color-border-button-sale-hover})), $cdr-prominence-floating;
+  }
+
+  &:active {
+    //ITEM_DOC: Box shadow color of a sale elevated cdr-button when active. //ITEM_DOC: Inset box shadow color of a sale elevated cdr-button when active
+    box-shadow: inset 0 0 0 3px var(--cdr-button-sale-box-shadow-active, var(--cdr-color-border-button-sale-active, #{$cdr-color-border-button-sale-active})), inset 0 0 0 5px var(--cdr-button-sale-active-inset-box-shadow, var(--cdr-color-border-button-sale-active-inset, #{$cdr-color-border-button-sale-active-inset})), $cdr-prominence-raised;
+  }
+}
+
+
+@mixin cdr-button-full-width-mixin() {
+  width: 100% !important;
+  justify-content: center;
+}
+
+@mixin cdr-button-icon-only-mixin() {
+  background: none;
+  border: none;
+  border-radius: $cdr-radius-soft;
+  box-shadow: none;
+  display: inline-block;
+  line-height: normal;
+  padding: $cdr-space-inset-half-x;
+
+  //ITEM_DOC: Fill color of an icon-only cdr-button
+  fill: var(--cdr-button-icon-only-icon-fill, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
+
+  &:hover{
+    background: none;
+    box-shadow: none;
+    border: none;
+
+    //ITEM_DOC: Fill color of an icon-only cdr-button when hovered
+    fill: var(--cdr-button-icon-only-icon-fill-hover, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
+  }
+
+  &:active, &:focus {
+    background: none;
+    outline: none;
+    border: none;
+    box-shadow: none;
+
+    //ITEM_DOC: Fill color of an icon-only cdr-button when active or focused
+    fill: var(--cdr-button-icon-only-icon-fill-active, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
+    
+    svg {
+      //ITEM_DOC: Box shadow of the svg in an icon-only cdr-button when active or focused
+      box-shadow: inset 0 0 0 1px var(--cdr-button-icon-only-icon-svg-box-shadow, var(--cdr-color-border-button-secondary-active, #{$cdr-color-border-button-secondary-active}));
+    }
+  }
+
+  &[disabled] {
+    background: transparent;
+    box-shadow: none;
+    border: none;
+
+    //ITEM_DOC: Fill color of a disabled icon-only cdr-button
+    fill: var(--cdr-button-icon-only-disabled-icon-fill, var(--cdr-color-icon-disabled, #{$cdr-color-icon-disabled}));
+  }
+}
+
+@mixin cdr-button-with-background-mixin() {
+  border-radius: 50%;
+
+  //ITEM_DOC: Fill color of a cdr-button with background
+  fill: var(--cdr-button-with-background-icon-fill, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
+
+  //ITEM_DOC: Background color of a cdr-button with background
+  background-color: var(--cdr-button-with-background-background-color, var(--cdr-color-background-button-secondary-rest, #{$cdr-color-background-button-secondary-rest}));
+
+  //ITEM_DOC: Box shadow color of a cdr-button with background
+  box-shadow: inset 0 0 0 1px var(--cdr-button-with-background-box-shadow, var(--cdr-color-border-button-secondary-rest, #{$cdr-color-border-button-secondary-rest}));
+
+  &:hover,
+  &:focus {
+    //ITEM_DOC: Fill color of a cdr-button with background during interaction
+    fill: var(--cdr-button-with-background-icon-fill-interaction, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
+    
+    //ITEM_DOC: Background color of a cdr-button with background during interaction
+    background-color: var(--cdr-button-with-background-background-color-interaction, var(--cdr-color-background-button-secondary-hover, #{$cdr-color-background-button-secondary-hover}));
+    
+    //ITEM_DOC: Box shadow color of a cdr-button with background during interaction
+    box-shadow: inset 0 0 0 3px var(--cdr-button-with-background-box-shadow-interaction, var(--cdr-color-border-button-secondary-hover, #{$cdr-color-border-button-secondary-hover})), $cdr-prominence-raised;
+    
+    svg {
+      box-shadow: none;
+    }
+  }
+
+  &:active {
+    //ITEM_DOC: Text color of an active cdr-button with background
+    color: var(--cdr-button-with-background-color-active, var(--cdr-color-text-button-secondary-active, #{$cdr-color-text-button-secondary-active}));
+    
+    //ITEM_DOC: Fill color of an active cdr-button with background
+    fill: var(--cdr-button-with-background-fill-active, var(--cdr-color-text-button-secondary-active, #{$cdr-color-text-button-secondary-active}));
+    
+    //ITEM_DOC: Background color of an active cdr-button with background
+    background-color: var(--cdr-button-with-background-background-color-active, var(--cdr-color-background-button-secondary-active, #{$cdr-color-background-button-secondary-active}));
+    
+    //ITEM_DOC: Box shadow color of an active cdr-button with background
+    box-shadow: inset 0 0 0 3px var(--cdr-button-with-background-box-shadow-active, var(--cdr-color-border-button-secondary-active, #{$cdr-color-border-button-secondary-active})), inset 0 0 0 5px var(--cdr-button-with-background-box-shadow-inset-active, var(--cdr-color-border-button-secondary-active-inset, #{$cdr-color-border-button-secondary-active-inset}));
+    
+    svg {
+      box-shadow: none;
+    }
+  }
+
+  &[disabled] {
+    //ITEM_DOC: Background color of a disabled cdr-button with background
+    background-color: var(--cdr-button-with-background-background-color-disabled, var(--cdr-color-background-button-secondary-disabled, #{$cdr-color-background-button-secondary-disabled}));
+    
+    //ITEM_DOC: Box shadow color of a disabled cdr-button with background
+    box-shadow: inset 0 0 0 1px var(--cdr-button-with-background-box-shadow-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
+    
+    //ITEM_DOC: Fill color of a disabled cdr-button with background
+    fill: var(--cdr-button-with-background-fill-disabled, var(--cdr-color-text-button-secondary-disabled, #{$cdr-color-text-button-secondary-disabled}));
+  }
+}
+
+
+@mixin cdr-button-small-mixin() {
+  @include cdr-button-base-text-mixin-small;
+  padding: $cdr-space-inset-three-quarter-x-squish;
+  width: auto;
+
+  &.cdr-button--has-icon-left {
+    @include cdr-button-has-icon-left-small-mixin;
+  }
+
+  &.cdr-button--has-icon-right {
+    @include cdr-button-has-icon-right-small-mixin;
+  }
+
+  & svg {
+    @include cdr-button-icon-small-mixin;
+  }
+}
+
+@mixin cdr-button-has-icon-left-small-mixin {
+  padding-left: calc(#{$cdr-space-three-quarter-x} - #{$cdr-space-quarter-x});
+}
+
+@mixin cdr-button-has-icon-right-small-mixin {
+  padding-right: calc(#{$cdr-space-three-quarter-x} - #{$cdr-space-quarter-x});
+}
+
+@mixin cdr-button-icon-small-mixin {
+  /* This is to correct icon size vs line height */
+  width: 2rem;
+  height: 2rem;
+}
+
+@mixin cdr-button-medium-mixin() {
+  @include cdr-button-base-text-mixin-medium;
+  padding: $cdr-space-inset-one-x-squish;
+  width: auto;
+
+  &.cdr-button--has-icon-left {
+    @include cdr-button-has-icon-left-medium-mixin;
+  }
+
+  &.cdr-button--has-icon-right {
+    @include cdr-button-has-icon-right-medium-mixin;
+  }
+
+  & svg {
+    @include cdr-button-icon-medium-mixin;
+  }
+}
+
+@mixin cdr-button-has-icon-left-medium-mixin {
+  padding-left: calc(#{$cdr-space-one-x} - #{$cdr-space-quarter-x});
+}
+
+@mixin cdr-button-has-icon-right-medium-mixin {
+  padding-right: calc(#{$cdr-space-one-x} - #{$cdr-space-quarter-x});
+}
+
+@mixin cdr-button-icon-medium-mixin {
+  /* This is to correct icon size vs line height */
+  width: $cdr-icon-size;
+  height: $cdr-icon-size;
+}
+
+@mixin cdr-button-large-mixin() {
+  @include cdr-button-base-text-mixin-medium;
+  padding: $cdr-space-inset-one-and-a-half-x-squish;
+  width: auto;
+
+  &.cdr-button--has-icon-left {
+    @include cdr-button-has-icon-left-large-mixin;
+  }
+
+  &.cdr-button--has-icon-right {
+    @include cdr-button-has-icon-right-large-mixin;
+  }
+
+  & svg {
+    @include cdr-button-icon-large-mixin;
+  }
+}
+
+@mixin cdr-button-has-icon-left-large-mixin {
+  padding-left: calc(#{$cdr-space-one-and-a-half-x} - #{$cdr-space-quarter-x});
+}
+
+@mixin cdr-button-has-icon-right-large-mixin {
+  padding-right: calc(#{$cdr-space-one-and-a-half-x} - #{$cdr-space-quarter-x});
+}
+
+@mixin cdr-button-icon-large-mixin {
+  /* This is to correct icon size vs line height */
+  width: $cdr-icon-size;
+  height: $cdr-icon-size;
+}
diff --git a/src/components/styledButton/styles/vars/CdrUnstyledButton.vars.scss b/src/components/styledButton/styles/vars/CdrUnstyledButton.vars.scss
deleted file mode 100644
index 1a7b54b15..000000000
--- a/src/components/styledButton/styles/vars/CdrUnstyledButton.vars.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-@mixin cdr-unstyled-button-base-reset-mixin() {
-  background-color: transparent;
-  cursor: pointer;
-  border: 0;
-  padding: 0;
-  appearance: none;
-  text-align: left;
-  text-decoration: none;
-  color: inherit;
-  touch-action: manipulation;
-  -webkit-tap-highlight-color: transparent;
-}
-
-@mixin cdr-unstyled-button-base-mixin() {
-  @include cdr-text-utility-sans-300;
-  @include cdr-unstyled-button-base-reset-mixin;
-}
diff --git a/src/components/unstyledButton/CdrUnstyledButton.vue b/src/components/unstyledButton/CdrUnstyledButton.vue
index a2055e5d0..29ee39a0b 100644
--- a/src/components/unstyledButton/CdrUnstyledButton.vue
+++ b/src/components/unstyledButton/CdrUnstyledButton.vue
@@ -22,6 +22,7 @@ const baseClass = 'cdr-unstyled-button';
 // Manages the props passed along to CdrBox
 const computedProps = computed(() => ({
   ...props,
+  surface: props.surface || 'transparent',
   // Automatically apply a type if using button tag
   type: props.tag == 'button' ? props.type || 'button' : undefined,
   class: mapClasses(style, baseClass),
diff --git a/src/components/unstyledButton/examples/UnstyledButton.vue b/src/components/unstyledButton/examples/UnstyledButton.vue
index 3a2c3f4ad..7ec245f33 100644
--- a/src/components/unstyledButton/examples/UnstyledButton.vue
+++ b/src/components/unstyledButton/examples/UnstyledButton.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import CdrBox from '../../box copy/CdrBox.vue';
+import CdrText from '../../text/CdrText.vue';
 import CdrUnstyledButton, { type CdrUnstyledButtonProps } from '../CdrUnstyledButton.vue';
 
 defineOptions({ name: 'UnstyledButton' });
@@ -6,17 +8,26 @@ defineOptions({ name: 'UnstyledButton' });
 export interface Example {
   description: string;
   props: CdrUnstyledButtonProps;
+  events?: {
+    click?: Function;
+  };
 }
 
 const boxes: Example[] = [
   {
     description: 'This is an unstyled button',
-    props: {},
+    props: { 'data-id': 'test' },
+    events: { click: () => alert('Clicked!') },
+  },
+  {
+    description: 'This button is a link',
+    props: { tag: 'a', href: 'https://www.rei.com/' },
   },
   {
     description:
-      'This button has padding, background, shadow, and radius applied. It inherits all props from CdrBox',
-    props: { p: 'one-x', background: 'secondary', radius: 'softer', shadow: 'elevated' },
+      'This button has padding, surface, shadow, and radius applied. It inherits all props from CdrBox',
+    props: { p: 'one-x', surface: 'primary', radius: 'softer', shadow: 'elevated' },
+    events: { click: () => alert('Clicked!') },
   },
 ];
 </script>
@@ -25,11 +36,14 @@ const boxes: Example[] = [
   <div class="unstyled-buttons-demo">
     <h2>UnstyledButton</h2>
     <template
-      v-for="{ description, props } in boxes"
+      v-for="{ description, props, events = {} } in boxes"
       :key="description"
     >
       <hr class="unstyled-buttons-demo__hr" />
-      <CdrUnstyledButton v-bind="props">
+      <CdrUnstyledButton
+        v-bind="props"
+        v-on="events"
+      >
         <span v-html="description" />
       </CdrUnstyledButton>
     </template>
diff --git a/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss b/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss
index 1a7b54b15..582aca746 100644
--- a/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss
+++ b/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss
@@ -1,5 +1,4 @@
 @mixin cdr-unstyled-button-base-reset-mixin() {
-  background-color: transparent;
   cursor: pointer;
   border: 0;
   padding: 0;
diff --git a/src/dev/router.js b/src/dev/router.js
index 6bfead133..954a4357f 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -53,6 +53,7 @@ const routes = [
   { path: '/selects', name: 'Selects', component: Examples.selects },
   { path: '/skeleton', name: 'Skeleton', component: Examples.skeleton },
   { path: '/split-surface', name: 'Split Surface', component: Examples.splitSurface },
+  { path: '/styledButton', name: 'StyledButton', component: Examples.styledButton },
   { path: '/tables', name: 'Tables', component: Examples.tables },
   { path: '/tabs', name: 'Tabs', component: Examples.tabs },
   { path: '/texts', name: 'Texts', component: Examples.texts },
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 5f6dd9c7a..91fb9ecb9 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -1,6 +1,15 @@
+/**
+ * HTMLAttributes data object for allowing any prop to get passed to child
+ *
+ * @interface HTMLAttributes
+ */
+export interface HTMLAttributes {
+  [key: string]: any;
+}
+
 /**
  * Breadcrumb data object
- * 
+ *
  * @interface breadcrumbItem
  * @url {string} The url for the breadcrumb link
  * @name {string} The display name for breadcrumb link
@@ -8,122 +17,122 @@
  */
 export interface breadcrumbItem {
   item: {
-    url: string,
-    name: string,
-    id?: string,
-  }
+    url: string;
+    name: string;
+    id?: string;
+  };
 }
 
 /**
  * Pagination data object
- * 
+ *
  * @interface paginationItem
  * @page {number} The page number, also used as link text
  * @url {string} The url for the pagination link
  * @ellip {boolean} Optional flag to render pagination to truncate pagination links
  */
 export interface paginationItem {
-  page: number,
-  url: string,
-  ellip?: boolean
+  page: number;
+  url: string;
+  ellip?: boolean;
 }
 
 /**
  * Select data object
- * 
+ *
  * @interface selectOption
  * @text {string} The displayed option
  * @value {string} The underlying value for the option
  */
 export interface selectOption {
-  text: string,
-  value: string,
+  text: string;
+  value: string;
 }
 
 export interface choreographerSchema {
-  type: string,
-  props?: object,
-  content?: string | choreographerSchema
+  type: string;
+  props?: object;
+  content?: string | choreographerSchema;
 }
 
 /**
  * Image component properties
- * 
+ *
  * @interface baseImageProps
- * 
+ *
  */
 export interface baseImageProps {
   /** The image src */
-  src: string,
+  src: string;
   /** The image alt. Defaults to empty string. */
-  alt?: string,
+  alt?: string;
   /** Comma separated list of image sources */
-  srcset?: string,
+  srcset?: string;
   /** Comma separated list of source sizes */
-  sizes?: string,
+  sizes?: string;
   /**
    * Object fit of the image, passes value to CSS object-fit property
    * @demoSelectMultiple false
    * @values none,contain,cover,fill,scale-down
    */
-    fit?: "contain"|"cover"|"fill"|"none"|"scale-down",
+  fit?: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down';
   /**
    * Object position of the image, passes value to CSS object-position property.
    * @demoSelectMultiple true
    * @values center,top,right,bottom,left
    */
-  position?: string,
+  position?: string;
   /**
    * Border radius of the image. Accepts shorthand for cedar radius tokens ("soft", "softer", "round") or a custom value which is passed ot the CSS border-radius property.
    * @demoSelectMultiple false
    * @values unset, soft, softer, round, 10%
    */
-  radius?: "soft" | "softer" | "round" | string,
+  radius?: 'soft' | 'softer' | 'round' | string;
   /**
    * Aspect ratio of the image, passes to the CSS aspect-ratio property.
    * @demoSelectMultiple false
    * @values auto,1/1,1/2,3/4,9/16,2/1,4/3,16/9
    */
-  ratio?: string,
+  ratio?: string;
   /**
    * Value for loading attribute ("lazy", "eager", "auto")
    * @demoIgnore
    */
-  loading?: "lazy" | "eager",
-  /** 
+  loading?: 'lazy' | 'eager';
+  /**
    * value for decoding attribute ()
    * @demoIgnore
    */
-  decoding?: "async" | "sync" | "auto",
-  /** 
+  decoding?: 'async' | 'sync' | 'auto';
+  /**
    * value for fetch priority attribute
    * @demoIgnore
    */
-  fetchpriority?: "high" | "low" | "auto",
+  fetchpriority?: 'high' | 'low' | 'auto';
 }
 
 /**
  * An object containing 1..n child objects containing HTMLSourceElement attributes
- * 
+ *
  * @interface pictureSourceObject
  * @extends HTMLSourceElement
  */
 export interface pictureSourceObject {
-  [key: string] : {
-    media: string,
-    srcset: string,
-    width?: string,
-    height?: string,
-    type?: string,
-    sizes?: string,
-  }
+  [key: string]: {
+    media: string;
+    srcset: string;
+    width?: string;
+    height?: string;
+    type?: string;
+    sizes?: string;
+  };
 }
 
-/** 
+/**
  * Text component properties
  * @interface baseTextProps
  */
 export interface baseTextProps {
   /** Sets the HTML tag (p, span, h1, h2, etc) */
-  tag?: string
-}
\ No newline at end of file
+  tag?: string;
+}
diff --git a/src/types/other.ts b/src/types/other.ts
index 285e4d27e..f372003fd 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -1,3 +1,6 @@
+import type * as CSS from 'csstype';
+
+export type Tag = keyof HTMLElementTagNameMap;
 export type Space =
   | 'eighth-x'
   | 'quarter-x'
@@ -8,39 +11,17 @@ export type Space =
   | 'two-x'
   | 'three-x'
   | 'four-x';
-export type Background = 'primary' | 'secondary' | 'brand-spruce';
 export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
+export type Surface = 'transparent' | 'primary' | 'secondary' | 'brand-spruce';
 export type Radius = 'sharp' | 'soft' | 'softer' | 'round';
 export type BorderColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error';
-export type SpacingKey = 'm' | 'mx' | 'my' | 'p' | 'px' | 'py';
-export type OtherKey = 'radius' | 'shadow' | 'background' | 'borderWidth' | 'borderColor';
-export type DirectKey = 'display';
-
-/**
- * Text component properties
- * @type space
- */
-// export type Space = (typeof spacing)[number];
-
-export interface SpacingProps {
-  p?: Space;
-  px?: Space;
-  py?: Space;
-  m?: Space;
-  mx?: Space;
-  my?: Space;
-}
-
-export interface DirectProps {
-  display?: string;
-}
-
-export type StylingKey = SpacingKey | DirectKey | OtherKey;
-
-export interface StylingProps extends SpacingProps, DirectProps {
-  background?: Background;
-  radius?: Radius;
-  shadow?: Shadow;
-  borderWidth?: Space;
-  borderColor?: BorderColor;
-}
+export type Elevation =
+  | 'ground'
+  | 'dropdown'
+  | 'popover'
+  | 'navigation'
+  | 'sticky'
+  | 'notification'
+  | 'modal';
+export type Position = CSS.Properties['position'];
+export type Palette = 'primary' | 'sale';

From a89f2725f01905b350e4c46b6b466e9e5d8d6b7d Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 30 Apr 2024 15:32:02 -0700
Subject: [PATCH 05/70] progress check

---
 src/components/box/CdrBox.vue                 |  89 +--
 src/components/box/examples/Box.vue           |  70 ++-
 src/components/box/styles/CdrBox.module.scss  |  34 +-
 .../box/styles/vars/CdrBox.vars.scss          |  40 --
 src/components/examples.js                    |   8 +-
 .../genericButton/CdrGenericButton.vue        |  54 ++
 .../genericButton/examples/GenericButton.vue  | 205 +++++++
 .../styles/CdrGenericButton.module.scss       |   5 +
 .../CdrHeadlessButton.vue}                    |  13 +-
 .../examples/HeadlessButton.vue               |  60 ++
 .../styles/CdrHeadlessButton.module.scss      |   6 +
 .../styles/vars/CdrHeadlessButton.vars.scss   |  21 +
 .../styledButton/CdrStyledButton.vue          |  46 --
 .../styledButton/examples/StyledButton.vue    |  47 --
 .../styles/CdrStyledButton.module.scss        |  26 -
 .../styles/vars/CdrStyledButton.vars.scss     | 533 ------------------
 .../examples/UnstyledButton.vue               |  61 --
 .../styles/CdrUnstyledButton.module.scss      |   6 -
 .../styles/vars/CdrUnstyledButton.vars.scss   |  16 -
 src/dev/router.js                             |   4 +-
 src/styles/settings/index.scss                | 135 ++++-
 src/types/interfaces.ts                       |  68 ++-
 src/types/other.ts                            |   6 +-
 23 files changed, 642 insertions(+), 911 deletions(-)
 delete mode 100644 src/components/box/styles/vars/CdrBox.vars.scss
 create mode 100644 src/components/genericButton/CdrGenericButton.vue
 create mode 100644 src/components/genericButton/examples/GenericButton.vue
 create mode 100644 src/components/genericButton/styles/CdrGenericButton.module.scss
 rename src/components/{unstyledButton/CdrUnstyledButton.vue => headlessButton/CdrHeadlessButton.vue} (65%)
 create mode 100644 src/components/headlessButton/examples/HeadlessButton.vue
 create mode 100644 src/components/headlessButton/styles/CdrHeadlessButton.module.scss
 create mode 100644 src/components/headlessButton/styles/vars/CdrHeadlessButton.vars.scss
 delete mode 100644 src/components/styledButton/CdrStyledButton.vue
 delete mode 100644 src/components/styledButton/examples/StyledButton.vue
 delete mode 100644 src/components/styledButton/styles/CdrStyledButton.module.scss
 delete mode 100644 src/components/styledButton/styles/vars/CdrStyledButton.vars.scss
 delete mode 100644 src/components/unstyledButton/examples/UnstyledButton.vue
 delete mode 100644 src/components/unstyledButton/styles/CdrUnstyledButton.module.scss
 delete mode 100644 src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss

diff --git a/src/components/box/CdrBox.vue b/src/components/box/CdrBox.vue
index 37f405152..ebf06ea46 100644
--- a/src/components/box/CdrBox.vue
+++ b/src/components/box/CdrBox.vue
@@ -1,49 +1,14 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import type * as CSS from 'csstype';
-import type { HTMLAttributes } from '../../types/interfaces';
 import mapClasses from '../../utils/mapClasses';
-import type {
-  Tag,
-  Space,
-  Shadow,
-  Radius,
-  BorderColor,
-  Elevation,
-  Position,
-  Palette,
-  Surface,
-} from '../../types/other';
+import type { SurfaceProps } from '../../types/interfaces';
 
 /** Base component for all other components */
 
 defineOptions({ name: 'CdrBox' });
 
-export interface CdrBoxProps extends HTMLAttributes {
-  tag?: Tag;
-  shadow?: Shadow;
-  radius?: Radius;
-  surface?: Surface;
-  borderWidth?: Space;
-  borderColor?: BorderColor;
-  elevation?: Elevation;
-  position?: Position;
-  palette?: Palette;
-  m?: Space;
-  mx?: Space;
-  my?: Space;
-  ml?: Space;
-  mr?: Space;
-  mt?: Space;
-  mb?: Space;
-  p?: Space;
-  px?: Space;
-  py?: Space;
-  pl?: Space;
-  pr?: Space;
-  pt?: Space;
-  pb?: Space;
-}
+export interface CdrBoxProps extends SurfaceProps {}
 
 const props = withDefaults(defineProps<CdrBoxProps>(), {
   tag: 'div',
@@ -58,29 +23,6 @@ const surfaceClass = `${baseClass}--surface`;
 const elevationClass = `${baseClass}--elevation`;
 const paletteClass = `${baseClass}--palette`;
 
-// Map of zIndex for elevation
-const elevations = {
-  ground: 0,
-  dropdown: 100,
-  popover: 200,
-  navigation: 300,
-  sticky: 400,
-  notification: 500,
-  modal: 600,
-};
-
-// Map of palettes
-const palettes = {
-  primary: {
-    color: 'primary',
-    surface: 'primary',
-  },
-  sale: {
-    color: 'sale',
-    surface: 'primary',
-  },
-};
-
 // Map of margins and padding
 const marginsAndPaddingMap = {
   m: 'margin',
@@ -91,7 +33,7 @@ const marginsAndPaddingMap = {
   mt: 'marginTop',
   mb: 'marginBottom',
   p: 'padding',
-  px: 'marginInline',
+  px: 'paddingInline',
   py: 'paddingBlock',
   pl: 'paddingInlineStart',
   pr: 'paddingInlineEnd',
@@ -102,25 +44,24 @@ const marginAndPaddingKeys = Object.keys(marginsAndPaddingMap);
 
 // Manages the props passed along to CdrBox
 const computedProps = computed(() => {
-  const classes = new Set([baseClass]);
+  const classes = new Set<string>([baseClass]);
   const inlineStyles: CSS.Properties = {};
 
   // Add palette
   if (props.palette) {
-    const { color, surface } = palettes[props.palette];
-    inlineStyles['--cdr-box-surface'] = `var(--cdr-color-background-${surface})`;
-    inlineStyles['--cdr-box-text-color'] = `var(--cdr-color-text-${color})`;
-    classes.add(paletteClass);
+    classes.add(`${paletteClass}-${props.palette}`);
+    classes.add(borderClass);
+    classes.add(surfaceClass);
   }
 
   // Add border
-  if (props.borderWidth || props.borderColor) {
+  if (props.withBorder) {
     if (props.borderWidth) {
-      inlineStyles['--cdr-box-border-width'] = `var(--cdr-space-inset-${props.borderWidth})`;
+      inlineStyles['--cdr-default-border-width'] = `var(--cdr-space-inset-${props.borderWidth})`;
     }
 
     if (props.borderColor) {
-      inlineStyles['--cdr-box-border-color'] = `var(--cdr-color-border-${props.borderColor})`;
+      inlineStyles['--cdr-default-border-color'] = `var(--cdr-color-border-${props.borderColor})`;
     }
 
     classes.add(borderClass);
@@ -128,30 +69,30 @@ const computedProps = computed(() => {
 
   // Add radius
   if (props.radius) {
-    inlineStyles['--cdr-box-radius'] = `var(--cdr-radius-${props.radius})`;
+    inlineStyles['--cdr-default-radius'] = `var(--cdr-radius-${props.radius})`;
     classes.add(radiusClass);
   }
 
   // Add shadow
   if (props.shadow) {
-    inlineStyles['--cdr-box-shadow'] = `var(--cdr-prominence-${props.shadow})`;
+    inlineStyles['--cdr-default-shadow'] = `var(--cdr-prominence-${props.shadow})`;
     classes.add(shadowClass);
   }
 
   // Add surface
   if (props.surface) {
-    inlineStyles['--cdr-box-surface'] = `var(--cdr-color-background-${props.surface})`;
+    inlineStyles['--cdr-default-surface'] = `var(--cdr-color-background-${props.surface})`;
     classes.add(surfaceClass);
   }
 
   // Add elevation
   if (props.elevation) {
     if (props.elevation) {
-      inlineStyles['--cdr-box-elevation'] = elevations[props.elevation];
+      inlineStyles['--cdr-default-elevation'] = `var(--cdr-elevation-${props.elevation})`;
     }
 
     if (props.position) {
-      inlineStyles['--cdr-box-position'] = props.position;
+      inlineStyles['--cdr-default-position'] = props.position;
     }
 
     classes.add(elevationClass);
diff --git a/src/components/box/examples/Box.vue b/src/components/box/examples/Box.vue
index b81709aca..18b930fb5 100644
--- a/src/components/box/examples/Box.vue
+++ b/src/components/box/examples/Box.vue
@@ -1,26 +1,26 @@
 <script setup lang="ts">
 import CdrBox, { type CdrBoxProps } from '../CdrBox.vue';
-import CdrText from '../../text/CdrText.vue';
 
 defineOptions({ name: 'Box' });
 
-export interface Example {
-  description: string;
+export interface BoxExample {
   props: CdrBoxProps;
 }
 
+export interface Example extends BoxExample {
+  children?: BoxExample[];
+}
+
 const boxes: Example[] = [
   {
-    description: 'This is a box without any specific props',
     props: { 'data-id': 'test' },
   },
   {
-    description:
-      'This is a box with radius, shadow, borderColor, surface, elevation, position, margin, and padding props applied.',
     props: {
       radius: 'round',
       shadow: 'elevated',
-      borderColor: 'secondary',
+      withBorder: true,
+      borderWidth: 'sixteenth-x',
       surface: 'secondary',
       elevation: 'modal',
       position: 'relative',
@@ -29,26 +29,68 @@ const boxes: Example[] = [
     },
   },
   {
-    description: 'This is a box with the palette prop applied.',
     props: {
-      palette: 'sale',
+      palette: 'secondary',
+      p: 'one-x',
+      withBorder: true,
+      borderWidth: 'sixteenth-x',
     },
+    children: [
+      {
+        props: {
+          p: 'one-x',
+          withBorder: true,
+          borderWidth: 'sixteenth-x',
+          mt: 'two-x',
+        },
+      },
+      {
+        props: {
+          palette: 'secondary',
+          p: 'one-x',
+          withBorder: true,
+          borderWidth: 'sixteenth-x',
+          mt: 'two-x',
+        },
+      },
+      {
+        props: {
+          palette: 'primary',
+          p: 'one-x',
+          withBorder: true,
+          borderWidth: 'sixteenth-x',
+          mt: 'two-x',
+        },
+      },
+    ],
   },
 ];
+
+const getDescription = (someProps) => {
+  const propsText = Object.keys(someProps)
+    .map((key) => `${key}=${someProps[key]}`)
+    .join(', ');
+  return `Props: ${propsText}`;
+};
 </script>
 
 <template>
   <div class="boxes-demo">
     <h2>Box</h2>
     <template
-      v-for="{ description, props } in boxes"
-      :key="description"
+      v-for="({ props, children }, index) in boxes"
+      :key="index"
     >
       <hr class="boxes-demo__hr" />
       <CdrBox v-bind="props">
-        <CdrText>
-          <span v-html="description" />
-        </CdrText>
+        {{ getDescription(props) }}
+        <CdrBox
+          v-if="children"
+          v-for="child in children"
+          v-bind="child.props"
+        >
+          {{ getDescription(props) }}
+        </CdrBox>
       </CdrBox>
     </template>
   </div>
diff --git a/src/components/box/styles/CdrBox.module.scss b/src/components/box/styles/CdrBox.module.scss
index dd7ad9844..1b2e3ec20 100644
--- a/src/components/box/styles/CdrBox.module.scss
+++ b/src/components/box/styles/CdrBox.module.scss
@@ -1,36 +1,26 @@
 @import '../../../styles/settings/index.scss';
-@import './vars/CdrBox.vars.scss';
-
-.cdr-box {
-  @include cdr-box-base-mixin;
-  // @include cdr-box-border-mixin;
-  // @include cdr-box-radius-mixin;
-  // @include cdr-box-shadow-mixin;
-  // @include cdr-box-surface-mixin;
-  // @include cdr-box-elevation-mixin;
-  // @include cdr-box-palette-mixin;
-}
-
-.cdr-box--border {
-  @include cdr-box-border-mixin;
-}
 
 .cdr-box--radius {
-  @include cdr-box-radius-mixin;
+  @include cdr-radius-mixin;
 }
 
+.cdr-box--border,
 .cdr-box--shadow {
-  @include cdr-box-shadow-mixin;
+  @include cdr-border-shadow-mixin;
 }
 
 .cdr-box--surface {
-  @include cdr-box-surface-mixin;
+  @include cdr-surface-mixin;
 }
 
 .cdr-box--elevation {
-  @include cdr-box-elevation-mixin;
+  @include cdr-elevation-mixin;
 }
 
-.cdr-box--palette {
-  @include cdr-box-palette-mixin;
-}
\ No newline at end of file
+.cdr-box--palette-primary {
+  @include cdr-palette-primary-mixin;
+}
+
+.cdr-box--palette-secondary {
+  @include cdr-palette-secondary-mixin;
+}
diff --git a/src/components/box/styles/vars/CdrBox.vars.scss b/src/components/box/styles/vars/CdrBox.vars.scss
deleted file mode 100644
index 363d44c43..000000000
--- a/src/components/box/styles/vars/CdrBox.vars.scss
+++ /dev/null
@@ -1,40 +0,0 @@
-@mixin cdr-box-base-mixin() {
-  --cdr-color-background-transparent: transparent;
-  --cdr-box-border-width-default: 0;
-  --cdr-box-border-style-default: solid;
-  --cdr-box-border-color-default: var(--cdr-color-border-primary);
-  --cdr-box-radius-default: var(--cdr-radius-sharp);
-  --cdr-box-shadow-default: var(--cdr-prominence-flat);
-  --cdr-box-surface-default: transparent;
-  --cdr-box-elevation-default: 0;
-  --cdr-box-position-default: relative;
-  --cdr-box-text-color-default: var(--cdr-color-text-primary);
-}
-
-@mixin cdr-box-border-mixin() {
-  border: var(--cdr-box-border-width, var(--cdr-box-border-width-default))
-    var(--cdr-box-border-style, var(--cdr-box-border-style-default))
-    var(--cdr-box-border-color, var(--cdr-box-border-color-default));
-}
-
-@mixin cdr-box-radius-mixin() {
-  border-radius: var(--cdr-box-radius, var(--cdr-box-radius-default));
-}
-
-@mixin cdr-box-shadow-mixin() {
-  box-shadow: var(--cdr-box-shadow, var(--cdr-box-shadow-default));
-}
-
-@mixin cdr-box-surface-mixin() {
-  background-color: var(--cdr-box-surface, var(--cdr-box-surface-default));
-}
-
-@mixin cdr-box-elevation-mixin() {
-  z-index: var(--cdr-box-elevation, var(--cdr-box-elevation-default));
-  position: var(--cdr-box-position, var(--cdr-box-position-default));
-}
-
-@mixin cdr-box-palette-mixin() {
-  background-color: var(--cdr-box-surface, var(--cdr-box-surface-default));
-  --cdr-text-color: var(--cdr-box-text-color, var(--cdr-box-text-color-default));
-}
\ No newline at end of file
diff --git a/src/components/examples.js b/src/components/examples.js
index e76a9b242..787514280 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -11,7 +11,9 @@ import chip from 'componentsdir/chip/examples/Chip.vue';
 import choreographer from 'componentsdir/choreographer/examples/Choreographer.vue';
 import container from 'componentsdir/container/examples/Container.vue';
 import formGroup from 'componentsdir/formGroup/examples/FormGroup.vue';
+import genericButton from 'componentsdir/genericButton/examples/GenericButton.vue';
 import grid from 'componentsdir/grid/examples/Grid.vue';
+import headlessButton from 'componentsdir/headlessButton/examples/HeadlessButton.vue';
 import icon from 'componentsdir/icon/examples/Icons.vue';
 import images from 'componentsdir/image/examples/Images.vue';
 import inputs from 'componentsdir/input/examples/Inputs.vue';
@@ -30,7 +32,6 @@ import rating from 'componentsdir/rating/examples/Ratings.vue';
 import selects from 'componentsdir/select/examples/Selects.vue';
 import skeleton from 'componentsdir/skeleton/examples/Skeleton.vue';
 import splitSurface from 'componentsdir/splitSurface/examples/SplitSurface.vue';
-import styledButton from 'componentsdir/styledButton/examples/StyledButton.vue';
 import tables from 'componentsdir/table/examples/Table.vue';
 import tabs from 'componentsdir/tabs/examples/Tabs.vue';
 import texts from 'componentsdir/text/examples/Text.vue';
@@ -39,7 +40,6 @@ import toast from 'componentsdir/toast/examples/Toast.vue';
 import toggleButton from 'componentsdir/toggleButton/examples/ToggleButton.vue';
 import cdrSwitch from 'componentsdir/switch/examples/Switch.vue'; // Can't name it switch because it's a JS keyword
 import tooltip from 'componentsdir/tooltip/examples/Tooltip.vue';
-import unstyledButton from 'componentsdir/unstyledButton/examples/UnstyledButton.vue';
 
 export default {
   abstract,
@@ -55,7 +55,9 @@ export default {
   choreographer,
   container,
   formGroup,
+  genericButton,
   grid,
+  headlessButton,
   icon,
   images,
   inputs,
@@ -74,7 +76,6 @@ export default {
   selects,
   skeleton,
   splitSurface,
-  styledButton,
   tables,
   tabs,
   texts,
@@ -83,5 +84,4 @@ export default {
   toggleButton,
   cdrSwitch,
   tooltip,
-  unstyledButton,
 };
diff --git a/src/components/genericButton/CdrGenericButton.vue b/src/components/genericButton/CdrGenericButton.vue
new file mode 100644
index 000000000..b38db9779
--- /dev/null
+++ b/src/components/genericButton/CdrGenericButton.vue
@@ -0,0 +1,54 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import type * as CSS from 'csstype';
+import mapClasses from '../../utils/mapClasses';
+import CdrHeadlessButton from '../headlessButton/CdrHeadlessButton.vue';
+import type { CdrHeadlessButtonProps } from '../headlessButton/CdrHeadlessButton.vue';
+
+/** Generic button component for buttons that may have a checked state */
+
+defineOptions({ name: 'CdrGenericButton' });
+
+export interface CdrGenericButtonProps extends CdrHeadlessButtonProps {
+  checked?: boolean;
+  modifier?: 'primary' | 'secondary';
+}
+
+const props = withDefaults(defineProps<CdrGenericButtonProps>(), {});
+
+const style = useCssModule();
+const baseClass = 'cdr-generic-button';
+
+// Manages the props passed along to CdrBox
+const computedProps = computed(() => {
+  const { checked, modifier, ...otherProps } = props;
+  const classes = new Set([baseClass]);
+  const inlineStyles: CSS.Properties = {};
+  const additionalProps: CdrHeadlessButtonProps = { withBorder: true };
+
+  // Add checked
+  if (checked) {
+    additionalProps['aria-checked'] = 'true';
+  }
+
+  // If transparent, add class for hover effects
+  if ((!props.surface || props.surface === 'transparent') && !props.palette) {
+    classes.add(`${baseClass}--transparent`);
+  }
+
+  return {
+    ...otherProps,
+    ...additionalProps,
+    style: inlineStyles,
+    class: mapClasses(style, ...classes),
+  };
+});
+</script>
+
+<template>
+  <CdrHeadlessButton v-bind="computedProps">
+    <slot />
+  </CdrHeadlessButton>
+</template>
+
+<style lang="scss" module src="./styles/CdrGenericButton.module.scss"></style>
diff --git a/src/components/genericButton/examples/GenericButton.vue b/src/components/genericButton/examples/GenericButton.vue
new file mode 100644
index 000000000..2da7262c5
--- /dev/null
+++ b/src/components/genericButton/examples/GenericButton.vue
@@ -0,0 +1,205 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+import CdrGenericButton, { type CdrGenericButtonProps } from '../CdrGenericButton.vue';
+import CdrBox from '../../box/CdrBox.vue';
+
+defineOptions({ name: 'StyledButton' });
+
+export interface Example {
+  name?: string;
+  props: CdrGenericButtonProps;
+  events?: {
+    click?: Function;
+  };
+}
+
+const boxes: Example[] = [
+  {
+    props: { 'data-id': 'test' },
+  },
+  {
+    props: {
+      surface: 'secondary',
+      p: 'one-x',
+      borderWidth: 'eighth-x',
+      borderColor: 'secondary',
+      withBorder: true,
+    },
+  },
+  {
+    props: {
+      palette: 'secondary',
+      p: 'one-x',
+      borderWidth: 'eighth-x',
+      withBorder: true,
+    },
+  },
+];
+
+const chips = {
+  count: 4,
+  props: {
+    withBorder: true,
+    borderWidth: 'eighth-x',
+    px: 'one-x',
+    py: 'half-x',
+    radius: 'round',
+  },
+};
+const chipsValue = ref(0);
+
+const toggle = {
+  count: 2,
+  props: {
+    p: 'one-x',
+    radius: 'soft',
+    borderWidth: 'zero',
+  },
+};
+
+const toggleValue = ref(0);
+
+const cards = [
+  {
+    props: {
+      class: 'generic-buttons-demo__card',
+      shadow: 'elevated',
+      radius: 'softer',
+      tag: 'a',
+      href: 'https://rei.com/',
+      surface: 'secondary',
+    },
+  },
+  {
+    props: {
+      class: 'generic-buttons-demo__card',
+      shadow: 'elevated',
+      radius: 'softer',
+      button: 'a',
+      surface: 'secondary',
+    },
+  },
+];
+
+const getDescription = (someProps) =>
+  Object.keys(someProps)
+    .map((key) => `${key}=${someProps[key]}`)
+    .join(', ');
+</script>
+
+<template>
+  <div class="generic-buttons-demo">
+    <h2>GenericButton</h2>
+    <template
+      v-for="({ name, props, events = {} }, index) in boxes"
+      :key="index"
+    >
+      <hr class="generic-buttons-demo__hr" />
+      <CdrGenericButton
+        v-bind="props"
+        v-on="events"
+      >
+        <span v-if="name">{{ name }}: {{ ' ' }}</span>
+        {{ getDescription(props) }}
+      </CdrGenericButton>
+    </template>
+    <h3 class="generic-buttons-demo__h3">Chips</h3>
+    <div class="generic-buttons-demo__chips">
+      <CdrGenericButton
+        v-for="(x, index) in new Array(chips.count)"
+        :key="index"
+        v-bind="chips.props"
+        :checked="index === chipsValue"
+        :disabled="index === 2"
+        @click="chipsValue = index"
+      >
+        Chip {{ index + 1 }}
+      </CdrGenericButton>
+    </div>
+    <h3 class="generic-buttons-demo__h3">Toggle</h3>
+    <CdrBox
+      class="generic-buttons-demo__toggle"
+      :with-border="true"
+      border-width="sixteenth-x"
+      p="eighth-x"
+      radius="softer"
+    >
+      <CdrGenericButton
+        v-for="(x, index) in new Array(toggle.count)"
+        :key="index"
+        v-bind="toggle.props"
+        :checked="index === toggleValue"
+        @click="toggleValue = index"
+      >
+        Toggle {{ index + 1 }}
+      </CdrGenericButton>
+    </CdrBox>
+    <h3 class="generic-buttons-demo__h3">Cards</h3>
+    <div class="generic-buttons-demo__cards">
+      <CdrGenericButton
+        v-for="(card, index) in cards"
+        :key="index"
+        v-bind="card.props"
+      >
+        <img
+          src="https://www.rei.com/dam/18516466_gear-up-camp-hikie-homepage-lead-lg_web_lg.jpeg?im=Resize,width=400"
+        />
+        <CdrBox
+          p="two-x"
+          class="generic-buttons-demo__card-content"
+        >
+          Some content
+        </CdrBox>
+      </CdrGenericButton>
+    </div>
+    <br />
+    <br />
+    <br />
+    <br />
+  </div>
+</template>
+
+<style lang="scss">
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
+.generic-buttons-demo {
+  &__hr {
+    margin: $cdr-space-two-x 0;
+  }
+
+  &__h3 {
+    margin: $cdr-space-two-x 0 $cdr-space-one-x 0;
+  }
+
+  &__chips {
+    display: inline-flex;
+    gap: $cdr-space-quarter-x;
+  }
+
+  &__toggle {
+    display: inline-flex;
+    gap: $cdr-space-quarter-x;
+  }
+
+  &__cards {
+    display: flex;
+    gap: $cdr-space-two-x;
+  }
+
+  &__card {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    width: 300px;
+    height: 200px;
+
+    img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+  }
+
+  &__card-content {
+  }
+}
+</style>
diff --git a/src/components/genericButton/styles/CdrGenericButton.module.scss b/src/components/genericButton/styles/CdrGenericButton.module.scss
new file mode 100644
index 000000000..10ea5e08e
--- /dev/null
+++ b/src/components/genericButton/styles/CdrGenericButton.module.scss
@@ -0,0 +1,5 @@
+@import '../../../styles/settings/index.scss';
+
+.cdr-generic-button {
+  @include cdr-action-mixin;
+}
diff --git a/src/components/unstyledButton/CdrUnstyledButton.vue b/src/components/headlessButton/CdrHeadlessButton.vue
similarity index 65%
rename from src/components/unstyledButton/CdrUnstyledButton.vue
rename to src/components/headlessButton/CdrHeadlessButton.vue
index 29ee39a0b..823bee168 100644
--- a/src/components/unstyledButton/CdrUnstyledButton.vue
+++ b/src/components/headlessButton/CdrHeadlessButton.vue
@@ -1,23 +1,24 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import CdrBox, { type CdrBoxProps } from '../box/CdrBox.vue';
+import CdrBox from '../box/CdrBox.vue';
+import type { SurfaceProps } from '../../types/interfaces';
 
 /** Base component for all other buttons */
 
-defineOptions({ name: 'CdrUnstyledButton' });
+defineOptions({ name: 'CdrHeadlessButton' });
 
-export interface CdrUnstyledButtonProps extends CdrBoxProps {
+export interface CdrHeadlessButtonProps extends SurfaceProps {
   type?: 'button' | 'reset' | 'submit' | undefined;
 }
 
-const props = withDefaults(defineProps<CdrUnstyledButtonProps>(), {
+const props = withDefaults(defineProps<CdrHeadlessButtonProps>(), {
   tag: 'button',
   type: undefined,
 });
 
 const style = useCssModule();
-const baseClass = 'cdr-unstyled-button';
+const baseClass = 'cdr-headless-button';
 
 // Manages the props passed along to CdrBox
 const computedProps = computed(() => ({
@@ -35,4 +36,4 @@ const computedProps = computed(() => ({
   </CdrBox>
 </template>
 
-<style lang="scss" module src="./styles/CdrUnstyledButton.module.scss"></style>
+<style lang="scss" module src="./styles/CdrHeadlessButton.module.scss"></style>
diff --git a/src/components/headlessButton/examples/HeadlessButton.vue b/src/components/headlessButton/examples/HeadlessButton.vue
new file mode 100644
index 000000000..fffa06528
--- /dev/null
+++ b/src/components/headlessButton/examples/HeadlessButton.vue
@@ -0,0 +1,60 @@
+<script setup lang="ts">
+import CdrHeadlessButton, { type CdrHeadlessButtonProps } from '../CdrHeadlessButton.vue';
+
+defineOptions({ name: 'HeadlessButton' });
+
+export interface Example {
+  props: CdrHeadlessButtonProps;
+  events?: {
+    click?: Function;
+  };
+}
+
+const boxes: Example[] = [
+  {
+    props: { 'data-id': 'test' },
+    events: { click: () => alert('Clicked!') },
+  },
+  {
+    props: { tag: 'a', href: 'https://www.rei.com/' },
+  },
+  {
+    props: { p: 'one-x', surface: 'secondary', radius: 'softer', shadow: 'elevated' },
+  },
+];
+
+const getDescription = (someProps) => {
+  const propsText = Object.keys(someProps)
+    .map((key) => `${key}=${someProps[key]}`)
+    .join(', ');
+  return `Props: ${propsText}`;
+};
+</script>
+
+<template>
+  <div class="headless-buttons-demo">
+    <h2>HeadlessButton</h2>
+    <template
+      v-for="({ props, events = {} }, index) in boxes"
+      :key="index"
+    >
+      <hr class="headless-buttons-demo__hr" />
+      <CdrHeadlessButton
+        v-bind="props"
+        v-on="events"
+      >
+        {{ getDescription(props) }}
+      </CdrHeadlessButton>
+    </template>
+  </div>
+</template>
+
+<style lang="scss">
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
+.headless-buttons-demo {
+  &__hr {
+    margin: $cdr-space-two-x 0;
+  }
+}
+</style>
diff --git a/src/components/headlessButton/styles/CdrHeadlessButton.module.scss b/src/components/headlessButton/styles/CdrHeadlessButton.module.scss
new file mode 100644
index 000000000..56fb6a264
--- /dev/null
+++ b/src/components/headlessButton/styles/CdrHeadlessButton.module.scss
@@ -0,0 +1,6 @@
+@import '../../../styles/settings/index.scss';
+@import './vars/CdrHeadlessButton.vars.scss';
+
+.cdr-headless-button {
+  @include cdr-headless-button-base-mixin;
+}
diff --git a/src/components/headlessButton/styles/vars/CdrHeadlessButton.vars.scss b/src/components/headlessButton/styles/vars/CdrHeadlessButton.vars.scss
new file mode 100644
index 000000000..1405815e9
--- /dev/null
+++ b/src/components/headlessButton/styles/vars/CdrHeadlessButton.vars.scss
@@ -0,0 +1,21 @@
+@mixin cdr-headless-button-base-reset-mixin() {
+  border: none;
+  cursor: pointer;
+  appearance: none;
+  text-align: left;
+  text-decoration: none;
+  color: inherit;
+  touch-action: manipulation;
+  -webkit-tap-highlight-color: transparent;
+  padding-block: 0;
+  padding-inline: 0;
+
+  &:focus {
+    outline: none;
+  }
+}
+
+@mixin cdr-headless-button-base-mixin() {
+  @include cdr-text-utility-sans-300;
+  @include cdr-headless-button-base-reset-mixin;
+}
diff --git a/src/components/styledButton/CdrStyledButton.vue b/src/components/styledButton/CdrStyledButton.vue
deleted file mode 100644
index f71262c26..000000000
--- a/src/components/styledButton/CdrStyledButton.vue
+++ /dev/null
@@ -1,46 +0,0 @@
-<script setup lang="ts">
-import { useCssModule, computed } from 'vue';
-import type * as CSS from 'csstype';
-import mapClasses from '../../utils/mapClasses';
-import CdrUnstyledButton, {
-  type CdrUnstyledButtonProps,
-} from '../unstyledButton/CdrUnstyledButton.vue';
-
-/** Base component for styled buttons */
-
-defineOptions({ name: 'CdrStyledButton' });
-
-export interface CdrStyledButtonProps extends CdrUnstyledButtonProps {
-  modifier?: 'primary' | 'secondary' | 'sale' | 'dark' | 'link';
-  size?: 'small' | 'medium' | 'large';
-}
-
-const props = withDefaults(defineProps<CdrStyledButtonProps>(), {
-  modifier: 'primary',
-  size: 'medium',
-});
-
-const style = useCssModule();
-const baseClass = 'cdr-styled-button';
-
-// Manages the props passed along to CdrBox
-const computedProps = computed(() => {
-  const classes = new Set([baseClass]);
-  const inlineStyles: CSS.Properties = {};
-
-  // Add modifier
-  if (props.modifier) {
-    classes.add(`${baseClass}--${props.modifier}`);
-  }
-
-  return { ...props, style: inlineStyles, class: mapClasses(style, ...classes) };
-});
-</script>
-
-<template>
-  <CdrUnstyledButton v-bind="computedProps">
-    <slot />
-  </CdrUnstyledButton>
-</template>
-
-<style lang="scss" module src="./styles/CdrStyledButton.module.scss"></style>
diff --git a/src/components/styledButton/examples/StyledButton.vue b/src/components/styledButton/examples/StyledButton.vue
deleted file mode 100644
index f5a072b46..000000000
--- a/src/components/styledButton/examples/StyledButton.vue
+++ /dev/null
@@ -1,47 +0,0 @@
-<script setup lang="ts">
-import CdrStyledButton, { type CdrStyledButtonProps } from '../CdrStyledButton.vue';
-
-defineOptions({ name: 'StyledButton' });
-
-export interface Example {
-  description: string;
-  props: CdrStyledButtonProps;
-}
-
-const boxes: Example[] = [
-  {
-    description: 'This is a styled button',
-    props: { 'data-id': 'test', surface: 'secondary' },
-  },
-  {
-    description:
-      'This button has a modifier prop applied. It inherits all props from CdrUnstyledButton',
-    props: { modifier: 'secondary' },
-  },
-];
-</script>
-
-<template>
-  <div class="styled-buttons-demo">
-    <h2>StyledButton</h2>
-    <template
-      v-for="{ description, props } in boxes"
-      :key="description"
-    >
-      <hr class="styled-buttons-demo__hr" />
-      <CdrStyledButton v-bind="props">
-        <span v-html="description" />
-      </CdrStyledButton>
-    </template>
-  </div>
-</template>
-
-<style lang="scss">
-@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
-
-.styled-buttons-demo {
-  &__hr {
-    margin: $cdr-space-two-x 0;
-  }
-}
-</style>
diff --git a/src/components/styledButton/styles/CdrStyledButton.module.scss b/src/components/styledButton/styles/CdrStyledButton.module.scss
deleted file mode 100644
index c31d7b1b7..000000000
--- a/src/components/styledButton/styles/CdrStyledButton.module.scss
+++ /dev/null
@@ -1,26 +0,0 @@
-@import '../../../styles/settings/index.scss';
-@import './vars/CdrStyledButton.vars.scss';
-
-.cdr-styled-button {
-  @include cdr-button-base-mixin;
-
-  &--primary {
-    @include cdr-button-primary-mixin;
-  }
-
-  &--secondary {
-    @include cdr-button-secondary-mixin;
-  }
-
-  &--large {
-    @include cdr-button-large-mixin;
-  }
-
-  &--medium {
-    @include cdr-button-medium-mixin;
-  }
-
-  &--small {
-    @include cdr-button-small-mixin;
-  }
-}
diff --git a/src/components/styledButton/styles/vars/CdrStyledButton.vars.scss b/src/components/styledButton/styles/vars/CdrStyledButton.vars.scss
deleted file mode 100644
index e16b99d6b..000000000
--- a/src/components/styledButton/styles/vars/CdrStyledButton.vars.scss
+++ /dev/null
@@ -1,533 +0,0 @@
-@mixin cdr-button-base-text-mixin-small() {
-  font-family: $cdr-font-family-sans;
-  font-style: normal;
-  font-weight: 500;
-  letter-spacing: -.008rem;
-  font-size: 1.4rem;
-  line-height: 1.8rem;
-}
-
-@mixin cdr-button-base-text-mixin-medium() {
-  font-family: $cdr-font-family-sans;
-  font-style: normal;
-  font-weight: 500;
-  letter-spacing: -.008rem;
-  font-size: 1.6rem;
-  line-height: 2.2rem;
-}
-
-@mixin cdr-button-base-mixin() {
-  @include cdr-button-base-text-mixin-medium;
-
-  border: none;
-  border-radius: $cdr-radius-softer;
-  cursor: pointer;
-  display: inline-flex;
-  outline: none;
-  overflow: visible;
-  margin: 0;
-  padding: $cdr-space-inset-one-x-squish;
-  text-align: left;
-  text-decoration: none;
-  text-transform: none;
-  vertical-align: middle;
-
-  transition: box-shadow $cdr-duration-2-x $cdr-timing-function-ease, background-color $cdr-duration-2-x $cdr-timing-function-ease, color $cdr-duration-2-x $cdr-timing-function-ease, fill $cdr-duration-2-x $cdr-timing-function-ease;
-
-  &:hover, &:active, &:focus {
-    outline: none;
-    outline-offset: 0;
-    text-decoration: none;
-  }
-
-  &[disabled] {
-    cursor: not-allowed;
-  }
-}
-
-@mixin cdr-button-base-icon-mixin() {
-  align-self: center;
-  fill: inherit;
-}
-
-@mixin cdr-button-primary-mixin() {
-  //ITEM_DOC: Primary button's background color
-  background-color: var(--cdr-button-primary-background-color-rest, var(--cdr-color-background-button-primary-rest, #{$cdr-color-background-button-primary-rest}));
-  //ITEM_DOC: Primary button's box shadow which serves as a border
-  box-shadow: inset 0 0 0 1px var(--cdr-button-primary-box-shadow-color-rest, var(--cdr-color-border-button-primary-rest, #{$cdr-color-border-button-primary-rest}));
-  //ITEM_DOC: Primary button's text color
-  color: var(--cdr-button-primary-text-color, var(--cdr-color-text-button-primary, #{$cdr-color-text-button-primary}));
-  //ITEM_DOC: Primary button's fill color
-  fill: var(--cdr-button-primary-fill-color, var(--cdr-color-text-button-primary, #{$cdr-color-text-button-primary}));
-
-  &:hover,
-  &:focus {
-    //ITEM_DOC: Primary button's text color when hovered or focused
-    color: var(--cdr-button-primary-text-color-interaction, var(--cdr-color-text-button-primary-hover, #{$cdr-color-text-button-primary-hover}));
-    //ITEM_DOC: Primary button's fill color when hovered or focused
-    fill: var(--cdr-button-primary-fill-color-interaction, var(--cdr-color-text-button-primary-hover, #{$cdr-color-text-button-primary-hover}));
-    //ITEM_DOC: Primary button's background color when hovered or focused
-    background-color: var(--cdr-button-primary-background-color-interaction, var(--cdr-color-background-button-primary-hover, #{$cdr-color-background-button-primary-hover}));
-    //ITEM_DOC: Primary button's box shadow when hovered or focused
-    box-shadow: inset 0 0 0 3px var(--cdr-button-primary-box-shadow-color-interaction, var(--cdr-color-border-button-primary-hover, #{$cdr-color-border-button-primary-hover})), $cdr-prominence-raised;
-  }
-
-  &:active {
-    //ITEM_DOC: Primary button's text color when active
-    color: var(--cdr-button-primary-text-color-active, var(--cdr-color-text-button-primary-active, #{$cdr-color-text-button-primary-active}));
-    //ITEM_DOC: Primary button's fill color when active
-    fill: var(--cdr-button-primary-fill-color-active, var(--cdr-color-text-button-primary-active, #{$cdr-color-text-button-primary-active}));
-    //ITEM_DOC: Primary button's background color when active
-    background-color: var(--cdr-button-primary-background-color-active, var(--cdr-color-background-button-primary-active, #{$cdr-color-background-button-primary-active}));
-    //ITEM_DOC: Primary button's box shadow when active. //ITEM_DOC: Primary button's inset box shadow when active
-    box-shadow: inset 0 0 0 3px var(--cdr-button-primary-box-shadow-color-active, var(--cdr-color-border-button-primary-active, #{$cdr-color-border-button-primary-active})), inset 0 0 0 5px var(--cdr-button-primary-box-shadow-color-active-inset, var(--cdr-color-border-button-primary-active-inset, #{$cdr-color-border-button-primary-active-inset}));
-  }
-
-  &[disabled] {
-    //ITEM_DOC: Primary button's background color when disabled
-    background-color: var(--cdr-button-primary-background-color-disabled, var(--cdr-color-background-button-default-disabled, #{$cdr-color-background-button-default-disabled}));
-    //ITEM_DOC: Primary button's border color when disabled
-    box-shadow: inset 0 0 0 1px var(--cdr-button-primary-box-shadow-color-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
-    //ITEM_DOC: Primary button's text color when disabled
-    color: var(--cdr-button-primary-text-color-disabled, var(--cdr-color-text-button-primary-disabled, #{$cdr-color-text-button-primary-disabled}));
-    //ITEM_DOC: Primary button's fill color when disabled
-    fill: var(--cdr-button-primary-fill-color-disabled, var(--cdr-color-text-button-primary-disabled, #{$cdr-color-text-button-primary-disabled}));
-  }
-}
-
-@mixin cdr-button-secondary-mixin() {
-  //ITEM_DOC: Secondary button's background color
-  background-color: var(--cdr-button-secondary-background-color-rest, var(--cdr-color-background-button-secondary-rest, #{$cdr-color-background-button-secondary-rest}));
-  //ITEM_DOC: Secondary button's box shadow which serves as a border
-  box-shadow: inset 0 0 0 1px var(--cdr-button-secondary-box-shadow-color-rest, var(--cdr-color-border-button-secondary-rest, #{$cdr-color-border-button-secondary-rest}));
-  //ITEM_DOC: Secondary button's text color
-  color: var(--cdr-button-secondary-text-color, var(--cdr-color-text-button-secondary, #{$cdr-color-text-button-secondary}));
-  //ITEM_DOC: Secondary button's fill color
-  fill: var(--cdr-button-secondary-fill-color, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
-
-  &:hover,
-  &:focus {
-    //ITEM_DOC: Secondary button's text color when hovered or focused
-    color: var(--cdr-button-secondary-text-color-interaction, var(--cdr-color-text-button-secondary-hover, #{$cdr-color-text-button-secondary-hover}));
-    //ITEM_DOC: Secondary button's fill color when hovered or focused
-    fill: var(--cdr-button-secondary-fill-color-interaction, var(--cdr-color-text-button-secondary-hover, #{$cdr-color-text-button-secondary-hover}));
-    //ITEM_DOC: Secondary button's background color when hovered or focused
-    background-color: var(--cdr-button-secondary-background-color-interaction, var(--cdr-color-background-button-secondary-hover, #{$cdr-color-background-button-secondary-hover}));
-    //ITEM_DOC: Secondary button's box shadow when hovered or focused
-    box-shadow: inset 0 0 0 3px var(--cdr-button-secondary-box-shadow-color-interaction, var(--cdr-color-border-button-secondary-hover, #{$cdr-color-border-button-secondary-hover})), $cdr-prominence-raised;
-  }
-
-  &:active {
-    //ITEM_DOC: Secondary button's text color when active
-    color: var(--cdr-button-secondary-text-color-active, var(--cdr-color-text-button-secondary-active, #{$cdr-color-text-button-secondary-active}));
-    //ITEM_DOC: Secondary button's fill color when active
-    fill: var(--cdr-button-secondary-fill-color-active, var(--cdr-color-text-button-secondary-active, #{$cdr-color-text-button-secondary-active}));
-    //ITEM_DOC: Secondary button's background color when active
-    background-color: var(--cdr-button-secondary-background-color-active, var(--cdr-color-background-button-secondary-active, #{$cdr-color-background-button-secondary-active}));
-    //ITEM_DOC: Secondary button's box shadow when active. //ITEM_DOC: Secondary button's inset box shadow when active
-    box-shadow: inset 0 0 0 3px var(--cdr-button-secondary-box-shadow-color-active, var(--cdr-color-border-button-secondary-active, #{$cdr-color-border-button-secondary-active})), inset 0 0 0 5px var(--cdr-button-secondary-border-color-active-inset, var(--cdr-color-border-button-secondary-active-inset, #{$cdr-color-border-button-secondary-active-inset}));
-  }
-
-  &[disabled] {
-    //ITEM_DOC: Secondary button's background color when disabled
-    background-color: var(--cdr-button-secondary-background-color-disabled, var(--cdr-color-background-button-secondary-disabled, #{$cdr-color-background-button-secondary-disabled}));
-    //ITEM_DOC: Secondary button's box shadow color when disabled. The box shadow serves as a border
-    box-shadow: inset 0 0 0 1px var(--cdr-button-secondary-box-shadow-color-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
-    //ITEM_DOC: Secondary button's text color when disabled
-    color: var(--cdr-button-secondary-text-color-disabled, var(--cdr-color-text-button-secondary-disabled, #{$cdr-color-text-button-secondary-disabled}));
-    //ITEM_DOC: Secondary button's fill color when disabled
-    fill: var(--cdr-button-secondary-fill-color-disabled, var(--cdr-color-text-button-secondary-disabled, #{$cdr-color-text-button-secondary-disabled}));
-  }
-}
-
-@mixin cdr-button-dark-mixin() {
-  //ITEM_DOC: Dark button's background color
-  background-color: var(--cdr-button-dark-background-color-rest, var(--cdr-color-background-button-dark-rest, #{$cdr-color-background-button-dark-rest}));
-  //ITEM_DOC: Dark button's box shadow which serves as a border
-  box-shadow: inset 0 0 0 1px var(--cdr-button-dark-box-shadow-color-rest, var(--cdr-color-border-button-dark-rest, #{$cdr-color-border-button-dark-rest}));
-  //ITEM_DOC: Dark button's text color
-  color: var(--cdr-button-dark-text-color, var(--cdr-color-text-button-dark, #{$cdr-color-text-button-dark}));
-  //ITEM_DOC: Dark button's fill color
-  fill: var(--cdr-button-dark-fill-color, var(--cdr-color-text-button-dark, #{$cdr-color-text-button-dark}));
-
-  &:hover,
-  &:focus {
-    //ITEM_DOC: Dark button's text color when hovered or focused
-    color: var(--cdr-button-dark-text-color-interaction, var(--cdr-color-text-button-dark-hover, #{$cdr-color-text-button-dark-hover}));
-    //ITEM_DOC: Dark button's fill color when hovered or focused
-    fill: var(--cdr-button-dark-fill-color-interaction, var(--cdr-color-text-button-dark-hover, #{$cdr-color-text-button-dark-hover}));
-    //ITEM_DOC: Dark button's background color when hovered or focused
-    background-color: var(--cdr-button-dark-background-color-interaction, var(--cdr-color-background-button-dark-hover, #{$cdr-color-background-button-dark-hover}));
-    //ITEM_DOC: Dark button's box shadow when hovered or focused
-    box-shadow: inset 0 0 0 3px var(--cdr-button-dark-box-shadow-color-interaction, var(--cdr-color-border-button-dark-hover, #{$cdr-color-border-button-dark-hover})), $cdr-prominence-raised;
-  }
-
-  &:active {
-    //ITEM_DOC: Dark button's text color when active
-    color: var(--cdr-button-dark-text-color-active, var(--cdr-color-text-button-dark-active, #{$cdr-color-text-button-dark-active}));
-    //ITEM_DOC: Dark button's fill color when active
-    fill: var(--cdr-button-dark-fill-color-active, var(--cdr-color-text-button-dark-active, #{$cdr-color-text-button-dark-active}));
-    //ITEM_DOC: Dark button's background color when active
-    background-color: var(--cdr-button-dark-background-color-active, var(--cdr-color-background-button-dark-active, #{$cdr-color-background-button-dark-active}));
-    //ITEM_DOC: Dark button's box shadow when active. The box shadow serves as a border. //ITEM_DOC: Dark button's inset box shadow when active. The box shadow serves as a border
-    box-shadow: inset 0 0 0 3px var(--cdr-button-dark-box-shadow-color-active, var(--cdr-color-border-button-dark-active, #{$cdr-color-border-button-dark-active})), inset 0 0 0 5px var(--cdr-button-dark-box-shadow-color-active-inset, var(--cdr-color-border-button-dark-active-inset, #{$cdr-color-border-button-dark-active-inset}));
-  }
-
-  &[disabled] {
-    //ITEM_DOC: Dark button's background color when disabled
-    background-color: var(--cdr-button-dark-background-color-disabled, var(--cdr-color-background-button-default-disabled, #{$cdr-color-background-button-default-disabled}));
-    //ITEM_DOC: Dark button's box shadow color when disabled. The box shadow serves as a border
-    box-shadow: inset 0 0 0 1px var(--cdr-button-dark-box-shadow-color-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
-    //ITEM_DOC: Dark button's text color when disabled
-    color: var(--cdr-button-dark-text-color-disabled, var(--cdr-color-text-button-dark-disabled, #{$cdr-color-text-button-dark-disabled}));
-    //ITEM_DOC: Dark button's fill color when disabled
-    fill: var(--cdr-button-dark-fill-color-disabled, var(--cdr-color-text-button-dark-disabled, #{$cdr-color-text-button-dark-disabled}));
-  }
-}
-
-@mixin cdr-button-sale-mixin() {
-  //ITEM_DOC: Sale button's background color
-  background-color: var(--cdr-button-sale-background-color-rest, var(--cdr-color-background-button-sale-rest, #{$cdr-color-background-button-sale-rest}));
-  //ITEM_DOC: Sale button's box shadow which serves as a border
-  box-shadow: inset 0 0 0 1px var(--cdr-button-sale-box-shadow-color-rest, var(--cdr-color-border-button-sale-rest, #{$cdr-color-border-button-sale-rest}));
-  //ITEM_DOC: Sale button's text color
-  color: var(--cdr-button-sale-text-color, var(--cdr-color-text-button-sale, #{$cdr-color-text-button-sale}));
-  //ITEM_DOC: Sale button's fill color
-  fill: var(--cdr-button-sale-fill-color, var(--cdr-color-text-button-sale, #{$cdr-color-text-button-sale}));
-
-  &:hover,
-  &:focus {
-    //ITEM_DOC: Sale button's text color when hovered or focused
-    color: var(--cdr-button-sale-text-color-interaction, var(--cdr-color-text-button-sale-hover, #{$cdr-color-text-button-sale-hover}));
-    //ITEM_DOC: Sale button's fill color when hovered or focused
-    fill: var(--cdr-button-sale-fill-color-interaction, var(--cdr-color-text-button-sale-hover, #{$cdr-color-text-button-sale-hover}));
-    //ITEM_DOC: Sale button's background color when hovered or focused
-    background-color: var(--cdr-button-sale-background-color-interaction, var(--cdr-color-background-button-sale-hover, #{$cdr-color-background-button-sale-hover}));
-    //ITEM_DOC: Sale button's box shadow when hovered or focused. The box shadow serves as a border
-    box-shadow: inset 0 0 0 3px var(--cdr-button-sale-box-shadow-color-interaction, var(--cdr-color-border-button-sale-hover, #{$cdr-color-border-button-sale-hover})), $cdr-prominence-raised;
-  }
-
-  &:active {
-    //ITEM_DOC: Sale button's text color when active
-    color: var(--cdr-button-sale-text-color-active, var(--cdr-color-text-button-sale-active, #{$cdr-color-text-button-sale-active}));
-    //ITEM_DOC: Sale button's fill color when active
-    fill: var(--cdr-button-sale-fill-color-active, var(--cdr-color-text-button-sale-active, #{$cdr-color-text-button-sale-active}));
-    //ITEM_DOC: Sale button's background color when active
-    background-color: var(--cdr-button-sale-background-color-active, var(--cdr-color-background-button-sale-active, #{$cdr-color-background-button-sale-active}));
-    //ITEM_DOC: Sale button's box shadow when active. The box shadow serves as a border. //ITEM_DOC: Sale button's inset box shadow when active. The box shadow serves as a border
-    box-shadow: inset 0 0 0 3px var(--cdr-button-sale-box-shadow-color-active, var(--cdr-color-border-button-sale-active, #{$cdr-color-border-button-sale-active})), inset 0 0 0 5px var(--cdr-button-sale-box-shadow-color-active-inset, var(--cdr-color-border-button-sale-active-inset, #{$cdr-color-border-button-sale-active-inset}));
-  }
-
-  &[disabled] {
-    //ITEM_DOC: Sale button's background color when disabled
-    background-color: var(--cdr-button-sale-background-color-disabled, var(--cdr-color-background-button-default-disabled, #{$cdr-color-background-button-default-disabled}));
-    //ITEM_DOC: Sale button's border color when disabled
-    box-shadow: inset 0 0 0 1px var(--cdr-button-sale-box-shadow-color-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
-    //ITEM_DOC: Sale button's text color when disabled
-    color: var(--cdr-button-sale-text-color-disabled, var(--cdr-color-text-button-sale-disabled, #{$cdr-color-text-button-sale-disabled}));
-    //ITEM_DOC: Sale button's fill color when disabled
-    fill: var(--cdr-button-sale-fill-color-disabled, var(--cdr-color-text-button-sale-disabled, #{$cdr-color-text-button-sale-disabled}));
-  }
-}
-
-
-@mixin cdr-button-link-mixin() {
-  //ITEM_DOC: Link variant of cdr-button's text color
-  color: var(--cdr-button-link-text-color, var(--cdr-color-text-link-rest, #{$cdr-color-text-link-rest}));
-  //ITEM_DOC: Link variant of cdr-button's fill color
-  fill: var(--cdr-button-link-fill-color, var(--cdr-color-text-link-rest, #{$cdr-color-text-link-rest}));
-  background-color: transparent;
-  text-decoration: underline;
-
-  &:active,
-  &:focus {
-    //ITEM_DOC: Link variant of cdr-button's text color when active or focused
-    color: var(--cdr-button-link-text-color-active, var(--cdr-color-text-link-active, #{$cdr-color-text-link-active}));
-  }
-
-  &:hover {
-    //ITEM_DOC: Link variant of cdr-button's text color when hovered
-    color: var(--cdr-button-link-text-color-hover, var(--cdr-color-text-link-hover, #{$cdr-color-text-link-hover}));
-    //ITEM_DOC: Link variant of cdr-button's text decoration when hovered
-    text-decoration: none;
-  }
-
-  &:focus {
-    //ITEM_DOC: Link variant of cdr-button's outline
-    outline: var(--cdr-button-link-outline, var(--default-outline, #{$default-outline}));
-    outline-color: -webkit-focus-ring-color;
-    outline-offset: 0;
-  }
-}
-
-
-@mixin cdr-button-secondary-elevated-mixin() {
-  //ITEM_DOC: Box shadow color of a secondary elevated cdr-button
-  box-shadow: inset 0 0 0 1px var(--cdr-button-secondary-box-shadow, var(--cdr-color-border-button-secondary-rest, #{$cdr-color-border-button-secondary-rest})), $cdr-prominence-elevated;
-
-  &:hover,
-  &:focus {
-    //ITEM_DOC: Box shadow color of a secondary elevated cdr-button when hovered or focused
-    box-shadow: inset 0 0 0 3px var(--cdr-button-secondary-interaction-box-shadow, var(--cdr-color-border-button-secondary-hover, #{$cdr-color-border-button-secondary-hover})), $cdr-prominence-floating;
-  }
-
-  &:active {
-    //ITEM_DOC: Box shadow color of a secondary elevated cdr-button when active. //ITEM_DOC: Inset box shadow color of a secondary elevated cdr-button when active
-    box-shadow: inset 0 0 0 3px var(--cdr-button-secondary-active-box-shadow, var(--cdr-color-border-button-secondary-active, #{$cdr-color-border-button-secondary-active})), inset 0 0 0 5px var(--cdr-button-secondary-active-inset-box-shadow, var(--cdr-color-border-button-secondary-active-inset, #{$cdr-color-border-button-secondary-active-inset})), $cdr-prominence-raised;
-  }
-}
-
-@mixin cdr-button-primary-elevated-mixin() {
-  //ITEM_DOC: Box shadow color of a primary elevated cdr-button
-  box-shadow: inset 0 0 0 1px var(--cdr-button-primary-box-shadow, var(--cdr-color-border-button-primary-rest, #{$cdr-color-border-button-primary-rest})), $cdr-prominence-elevated;
-
-  &:hover,
-  &:focus {
-    //ITEM_DOC: Box shadow color of a primary elevated cdr-button when hovered or focused
-    box-shadow: inset 0 0 0 3px var(--cdr-button-primary-hover-focus-box-shadow, var(--cdr-color-border-button-primary-hover, #{$cdr-color-border-button-primary-hover})), $cdr-prominence-floating;
-  }
-
-  &:active {
-    //ITEM_DOC: Box shadow color of a primary elevated cdr-button when active. //ITEM_DOC: Inset box shadow color of a primary elevated cdr-button when active
-    box-shadow: inset 0 0 0 3px var(--cdr-button-primary-active-box-shadow, var(--cdr-color-border-button-primary-active, #{$cdr-color-border-button-primary-active})), inset 0 0 0 5px var(--cdr-button-primary-active-inset-box-shadow, var(--cdr-color-border-button-primary-active-inset, #{$cdr-color-border-button-primary-active-inset})), $cdr-prominence-raised;
-  }
-}
-
-@mixin cdr-button-dark-elevated-mixin() {
-  //ITEM_DOC: Box shadow color of a dark elevated cdr-button
-  box-shadow: inset 0 0 0 1px var(--cdr-button-dark-box-shadow-rest, var(--cdr-color-border-button-dark-rest, #{$cdr-color-border-button-dark-rest})), $cdr-prominence-elevated;
-
-  &:hover,
-  &:focus {
-    //ITEM_DOC: Box shadow color of a dark elevated cdr-button when hovered or focused
-    box-shadow: inset 0 0 0 3px var(--cdr-button-dark-box-shadow-interaction, var(--cdr-color-border-button-dark-hover, #{$cdr-color-border-button-dark-hover})), $cdr-prominence-floating;
-  }
-
-  &:active {
-    //ITEM_DOC: Box shadow color of a dark elevated cdr-button when active. //ITEM_DOC: Inset box shadow color of a dark elevated cdr-button when active
-    box-shadow: inset 0 0 0 3px var(--cdr-button-dark-box-shadow-active, var(--cdr-color-border-button-dark-active, #{$cdr-color-border-button-dark-active})), inset 0 0 0 5px var(--cdr-button-dark-active-inset-box-shadow, var(--cdr-color-border-button-dark-active-inset, #{$cdr-color-border-button-dark-active-inset})), $cdr-prominence-raised;
-  }
-}
-
-@mixin cdr-button-sale-elevated-mixin() {
-  //ITEM_DOC: Box shadow color of a sale elevated cdr-button
-  box-shadow: inset 0 0 0 1px var(--cdr-button-sale-box-shadow-rest, var(--cdr-color-border-button-sale-rest, #{$cdr-color-border-button-sale-rest})), $cdr-prominence-elevated;
-
-  &:hover,
-  &:focus {
-    //ITEM_DOC: Box shadow color of a sale elevated cdr-button when hovered or focused
-    box-shadow: inset 0 0 0 3px var(--cdr-button-sale-box-shadow-interaction, var(--cdr-color-border-button-sale-hover, #{$cdr-color-border-button-sale-hover})), $cdr-prominence-floating;
-  }
-
-  &:active {
-    //ITEM_DOC: Box shadow color of a sale elevated cdr-button when active. //ITEM_DOC: Inset box shadow color of a sale elevated cdr-button when active
-    box-shadow: inset 0 0 0 3px var(--cdr-button-sale-box-shadow-active, var(--cdr-color-border-button-sale-active, #{$cdr-color-border-button-sale-active})), inset 0 0 0 5px var(--cdr-button-sale-active-inset-box-shadow, var(--cdr-color-border-button-sale-active-inset, #{$cdr-color-border-button-sale-active-inset})), $cdr-prominence-raised;
-  }
-}
-
-
-@mixin cdr-button-full-width-mixin() {
-  width: 100% !important;
-  justify-content: center;
-}
-
-@mixin cdr-button-icon-only-mixin() {
-  background: none;
-  border: none;
-  border-radius: $cdr-radius-soft;
-  box-shadow: none;
-  display: inline-block;
-  line-height: normal;
-  padding: $cdr-space-inset-half-x;
-
-  //ITEM_DOC: Fill color of an icon-only cdr-button
-  fill: var(--cdr-button-icon-only-icon-fill, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
-
-  &:hover{
-    background: none;
-    box-shadow: none;
-    border: none;
-
-    //ITEM_DOC: Fill color of an icon-only cdr-button when hovered
-    fill: var(--cdr-button-icon-only-icon-fill-hover, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
-  }
-
-  &:active, &:focus {
-    background: none;
-    outline: none;
-    border: none;
-    box-shadow: none;
-
-    //ITEM_DOC: Fill color of an icon-only cdr-button when active or focused
-    fill: var(--cdr-button-icon-only-icon-fill-active, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
-    
-    svg {
-      //ITEM_DOC: Box shadow of the svg in an icon-only cdr-button when active or focused
-      box-shadow: inset 0 0 0 1px var(--cdr-button-icon-only-icon-svg-box-shadow, var(--cdr-color-border-button-secondary-active, #{$cdr-color-border-button-secondary-active}));
-    }
-  }
-
-  &[disabled] {
-    background: transparent;
-    box-shadow: none;
-    border: none;
-
-    //ITEM_DOC: Fill color of a disabled icon-only cdr-button
-    fill: var(--cdr-button-icon-only-disabled-icon-fill, var(--cdr-color-icon-disabled, #{$cdr-color-icon-disabled}));
-  }
-}
-
-@mixin cdr-button-with-background-mixin() {
-  border-radius: 50%;
-
-  //ITEM_DOC: Fill color of a cdr-button with background
-  fill: var(--cdr-button-with-background-icon-fill, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
-
-  //ITEM_DOC: Background color of a cdr-button with background
-  background-color: var(--cdr-button-with-background-background-color, var(--cdr-color-background-button-secondary-rest, #{$cdr-color-background-button-secondary-rest}));
-
-  //ITEM_DOC: Box shadow color of a cdr-button with background
-  box-shadow: inset 0 0 0 1px var(--cdr-button-with-background-box-shadow, var(--cdr-color-border-button-secondary-rest, #{$cdr-color-border-button-secondary-rest}));
-
-  &:hover,
-  &:focus {
-    //ITEM_DOC: Fill color of a cdr-button with background during interaction
-    fill: var(--cdr-button-with-background-icon-fill-interaction, var(--cdr-color-icon-default, #{$cdr-color-icon-default}));
-    
-    //ITEM_DOC: Background color of a cdr-button with background during interaction
-    background-color: var(--cdr-button-with-background-background-color-interaction, var(--cdr-color-background-button-secondary-hover, #{$cdr-color-background-button-secondary-hover}));
-    
-    //ITEM_DOC: Box shadow color of a cdr-button with background during interaction
-    box-shadow: inset 0 0 0 3px var(--cdr-button-with-background-box-shadow-interaction, var(--cdr-color-border-button-secondary-hover, #{$cdr-color-border-button-secondary-hover})), $cdr-prominence-raised;
-    
-    svg {
-      box-shadow: none;
-    }
-  }
-
-  &:active {
-    //ITEM_DOC: Text color of an active cdr-button with background
-    color: var(--cdr-button-with-background-color-active, var(--cdr-color-text-button-secondary-active, #{$cdr-color-text-button-secondary-active}));
-    
-    //ITEM_DOC: Fill color of an active cdr-button with background
-    fill: var(--cdr-button-with-background-fill-active, var(--cdr-color-text-button-secondary-active, #{$cdr-color-text-button-secondary-active}));
-    
-    //ITEM_DOC: Background color of an active cdr-button with background
-    background-color: var(--cdr-button-with-background-background-color-active, var(--cdr-color-background-button-secondary-active, #{$cdr-color-background-button-secondary-active}));
-    
-    //ITEM_DOC: Box shadow color of an active cdr-button with background
-    box-shadow: inset 0 0 0 3px var(--cdr-button-with-background-box-shadow-active, var(--cdr-color-border-button-secondary-active, #{$cdr-color-border-button-secondary-active})), inset 0 0 0 5px var(--cdr-button-with-background-box-shadow-inset-active, var(--cdr-color-border-button-secondary-active-inset, #{$cdr-color-border-button-secondary-active-inset}));
-    
-    svg {
-      box-shadow: none;
-    }
-  }
-
-  &[disabled] {
-    //ITEM_DOC: Background color of a disabled cdr-button with background
-    background-color: var(--cdr-button-with-background-background-color-disabled, var(--cdr-color-background-button-secondary-disabled, #{$cdr-color-background-button-secondary-disabled}));
-    
-    //ITEM_DOC: Box shadow color of a disabled cdr-button with background
-    box-shadow: inset 0 0 0 1px var(--cdr-button-with-background-box-shadow-disabled, var(--cdr-color-border-button-default-disabled, #{$cdr-color-border-button-default-disabled}));
-    
-    //ITEM_DOC: Fill color of a disabled cdr-button with background
-    fill: var(--cdr-button-with-background-fill-disabled, var(--cdr-color-text-button-secondary-disabled, #{$cdr-color-text-button-secondary-disabled}));
-  }
-}
-
-
-@mixin cdr-button-small-mixin() {
-  @include cdr-button-base-text-mixin-small;
-  padding: $cdr-space-inset-three-quarter-x-squish;
-  width: auto;
-
-  &.cdr-button--has-icon-left {
-    @include cdr-button-has-icon-left-small-mixin;
-  }
-
-  &.cdr-button--has-icon-right {
-    @include cdr-button-has-icon-right-small-mixin;
-  }
-
-  & svg {
-    @include cdr-button-icon-small-mixin;
-  }
-}
-
-@mixin cdr-button-has-icon-left-small-mixin {
-  padding-left: calc(#{$cdr-space-three-quarter-x} - #{$cdr-space-quarter-x});
-}
-
-@mixin cdr-button-has-icon-right-small-mixin {
-  padding-right: calc(#{$cdr-space-three-quarter-x} - #{$cdr-space-quarter-x});
-}
-
-@mixin cdr-button-icon-small-mixin {
-  /* This is to correct icon size vs line height */
-  width: 2rem;
-  height: 2rem;
-}
-
-@mixin cdr-button-medium-mixin() {
-  @include cdr-button-base-text-mixin-medium;
-  padding: $cdr-space-inset-one-x-squish;
-  width: auto;
-
-  &.cdr-button--has-icon-left {
-    @include cdr-button-has-icon-left-medium-mixin;
-  }
-
-  &.cdr-button--has-icon-right {
-    @include cdr-button-has-icon-right-medium-mixin;
-  }
-
-  & svg {
-    @include cdr-button-icon-medium-mixin;
-  }
-}
-
-@mixin cdr-button-has-icon-left-medium-mixin {
-  padding-left: calc(#{$cdr-space-one-x} - #{$cdr-space-quarter-x});
-}
-
-@mixin cdr-button-has-icon-right-medium-mixin {
-  padding-right: calc(#{$cdr-space-one-x} - #{$cdr-space-quarter-x});
-}
-
-@mixin cdr-button-icon-medium-mixin {
-  /* This is to correct icon size vs line height */
-  width: $cdr-icon-size;
-  height: $cdr-icon-size;
-}
-
-@mixin cdr-button-large-mixin() {
-  @include cdr-button-base-text-mixin-medium;
-  padding: $cdr-space-inset-one-and-a-half-x-squish;
-  width: auto;
-
-  &.cdr-button--has-icon-left {
-    @include cdr-button-has-icon-left-large-mixin;
-  }
-
-  &.cdr-button--has-icon-right {
-    @include cdr-button-has-icon-right-large-mixin;
-  }
-
-  & svg {
-    @include cdr-button-icon-large-mixin;
-  }
-}
-
-@mixin cdr-button-has-icon-left-large-mixin {
-  padding-left: calc(#{$cdr-space-one-and-a-half-x} - #{$cdr-space-quarter-x});
-}
-
-@mixin cdr-button-has-icon-right-large-mixin {
-  padding-right: calc(#{$cdr-space-one-and-a-half-x} - #{$cdr-space-quarter-x});
-}
-
-@mixin cdr-button-icon-large-mixin {
-  /* This is to correct icon size vs line height */
-  width: $cdr-icon-size;
-  height: $cdr-icon-size;
-}
diff --git a/src/components/unstyledButton/examples/UnstyledButton.vue b/src/components/unstyledButton/examples/UnstyledButton.vue
deleted file mode 100644
index 7ec245f33..000000000
--- a/src/components/unstyledButton/examples/UnstyledButton.vue
+++ /dev/null
@@ -1,61 +0,0 @@
-<script setup lang="ts">
-import CdrBox from '../../box copy/CdrBox.vue';
-import CdrText from '../../text/CdrText.vue';
-import CdrUnstyledButton, { type CdrUnstyledButtonProps } from '../CdrUnstyledButton.vue';
-
-defineOptions({ name: 'UnstyledButton' });
-
-export interface Example {
-  description: string;
-  props: CdrUnstyledButtonProps;
-  events?: {
-    click?: Function;
-  };
-}
-
-const boxes: Example[] = [
-  {
-    description: 'This is an unstyled button',
-    props: { 'data-id': 'test' },
-    events: { click: () => alert('Clicked!') },
-  },
-  {
-    description: 'This button is a link',
-    props: { tag: 'a', href: 'https://www.rei.com/' },
-  },
-  {
-    description:
-      'This button has padding, surface, shadow, and radius applied. It inherits all props from CdrBox',
-    props: { p: 'one-x', surface: 'primary', radius: 'softer', shadow: 'elevated' },
-    events: { click: () => alert('Clicked!') },
-  },
-];
-</script>
-
-<template>
-  <div class="unstyled-buttons-demo">
-    <h2>UnstyledButton</h2>
-    <template
-      v-for="{ description, props, events = {} } in boxes"
-      :key="description"
-    >
-      <hr class="unstyled-buttons-demo__hr" />
-      <CdrUnstyledButton
-        v-bind="props"
-        v-on="events"
-      >
-        <span v-html="description" />
-      </CdrUnstyledButton>
-    </template>
-  </div>
-</template>
-
-<style lang="scss">
-@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
-
-.unstyled-buttons-demo {
-  &__hr {
-    margin: $cdr-space-two-x 0;
-  }
-}
-</style>
diff --git a/src/components/unstyledButton/styles/CdrUnstyledButton.module.scss b/src/components/unstyledButton/styles/CdrUnstyledButton.module.scss
deleted file mode 100644
index a04f398f5..000000000
--- a/src/components/unstyledButton/styles/CdrUnstyledButton.module.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-@import '../../../styles/settings/index.scss';
-@import './vars/CdrUnstyledButton.vars.scss';
-
-.cdr-unstyled-button {
-  @include cdr-unstyled-button-base-mixin;
-}
diff --git a/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss b/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss
deleted file mode 100644
index 582aca746..000000000
--- a/src/components/unstyledButton/styles/vars/CdrUnstyledButton.vars.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-@mixin cdr-unstyled-button-base-reset-mixin() {
-  cursor: pointer;
-  border: 0;
-  padding: 0;
-  appearance: none;
-  text-align: left;
-  text-decoration: none;
-  color: inherit;
-  touch-action: manipulation;
-  -webkit-tap-highlight-color: transparent;
-}
-
-@mixin cdr-unstyled-button-base-mixin() {
-  @include cdr-text-utility-sans-300;
-  @include cdr-unstyled-button-base-reset-mixin;
-}
diff --git a/src/dev/router.js b/src/dev/router.js
index 954a4357f..5783396b3 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -34,7 +34,9 @@ const routes = [
   { path: '/choreographer', name: 'Choreographer', component: Examples.choreographer },
   { path: '/containers', name: 'Container', component: Examples.container },
   { path: '/formGroups', name: 'Form Groups', component: Examples.formGroup },
+  { path: '/genericButton', name: 'GenericButton', component: Examples.genericButton },
   { path: '/grid', name: 'Grid', component: Examples.grid },
+  { path: '/headlessButton', name: 'HeadlessButton', component: Examples.headlessButton },
   { path: '/icons', name: 'Icons', component: Examples.icon },
   { path: '/images', name: 'Images', component: Examples.images },
   { path: '/inputs', name: 'Input', component: Examples.inputs },
@@ -53,7 +55,6 @@ const routes = [
   { path: '/selects', name: 'Selects', component: Examples.selects },
   { path: '/skeleton', name: 'Skeleton', component: Examples.skeleton },
   { path: '/split-surface', name: 'Split Surface', component: Examples.splitSurface },
-  { path: '/styledButton', name: 'StyledButton', component: Examples.styledButton },
   { path: '/tables', name: 'Tables', component: Examples.tables },
   { path: '/tabs', name: 'Tabs', component: Examples.tabs },
   { path: '/texts', name: 'Texts', component: Examples.texts },
@@ -62,7 +63,6 @@ const routes = [
   { path: '/toggleButton', name: 'ToggleButton', component: Examples.toggleButton },
   { path: '/switch', name: 'Switch', component: Examples.cdrSwitch },
   { path: '/tooltip', name: 'Tooltip', component: Examples.tooltip },
-  { path: '/unstyledButton', name: 'UnstyledButton', component: Examples.unstyledButton },
 
   // Nightwatch test targets
   { path: '/e2e-1', component: e2e1 },
diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index 69e80c638..831657b4d 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -1,5 +1,132 @@
 $cdr-warn: false;
-@import "../../../node_modules/@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss";
-@import "./alignment.vars";
-@import "./options.vars";
-@import "./visibility.vars";
+@import '../../../node_modules/@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+@import './alignment.vars';
+@import './options.vars';
+@import './visibility.vars';
+
+:root {
+  // New elevation tokens
+  --cdr-elevation-ground: 0;
+  --cdr-elevation-dropdown: 100;
+  --cdr-elevation-popover: 200;
+  --cdr-elevation-navigation: 300;
+  --cdr-elevation-sticky: 400;
+  --cdr-elevation-notification: 500;
+  --cdr-elevation-modal: 600;
+
+  // New color tokens
+  --cdr-color-background-transparent: transparent;
+  --cdr-color-border-transparent: transparent;
+  --cdr-color-border-dark: var(--cdr-color-text-primary);
+
+  // New spacing tokens
+  --cdr-space-inset-zero: 0;
+  --cdr-space-inset-sixteenth-x: 0.1rem;
+  --cdr-space-zero: 0;
+  --cdr-space-sixteenth-x: 0.1rem;
+
+  // Defaults are the least intrusive state of something
+  --cdr-default-border-width: var(--cdr-space-inset-zero);
+  --cdr-default-border-color: var(--cdr-color-border-primary);
+  --cdr-default-border: inset var(--cdr-default-border-width) 0 0 var(--cdr-color-border-primary);
+  --cdr-default-surface: transparent;
+  --cdr-default-radius: var(--cdr-radius-sharp);
+  --cdr-default-shadow: var(--cdr-prominence-flat);
+  --cdr-default-elevation: var(--cdr-elevation-ground);
+  --cdr-default-position: relative;
+  --cdr-default-active-border-color: var(--cdr-color-border-dark);
+}
+
+@mixin cdr-radius-mixin() {
+  border-radius: var(--cdr-radius, var(--cdr-default-radius));
+  overflow: hidden;
+}
+
+// This mixin provides a border and a shadow by layering two box-shadows.
+// The border is on a sudo element to elevate it above inner content.
+@mixin cdr-border-shadow-mixin() {
+  position: relative;
+
+  &::after {
+    @include cdr-radius-mixin;
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    content: '';
+    box-shadow:
+      inset 0 0 0 var(--cdr-border-width, var(--cdr-default-border-width))
+        var(--cdr-border-color, var(--cdr-palette-border-color, var(--cdr-default-border-color))),
+      var(--cdr-shadow, var(--cdr-default-shadow));
+  }
+}
+
+@mixin cdr-surface-mixin() {
+  background-color: var(--cdr-surface, var(--cdr-palette-surface, var(--cdr-default-surface)));
+}
+
+@mixin cdr-elevation-mixin() {
+  z-index: var(--cdr-elevation, var(--cdr-default-elevation));
+  position: var(--cdr-position, var(--cdr-default-position));
+}
+
+@mixin cdr-palette-primary-mixin() {
+  --cdr-palette-surface: var(--cdr-color-background-primary);
+  --cdr-palette-border-color: var(--cdr-color-border-primary);
+}
+
+@mixin cdr-palette-secondary-mixin() {
+  --cdr-palette-surface: var(--cdr-color-background-secondary);
+  --cdr-palette-border-color: var(--cdr-color-border-secondary);
+}
+
+@mixin cdr-action-mixin() {
+  transition:
+    color $cdr-duration-1-x $cdr-timing-function-ease,
+    fill $cdr-duration-1-x $cdr-timing-function-ease,
+    background-color $cdr-duration-1-x $cdr-timing-function-ease,
+    box-shadow $cdr-duration-1-x $cdr-timing-function-ease;
+
+  &--transparent {
+    &:hover {
+      background-color: $cdr-color-background-primary;
+    }
+  }
+
+  &:disabled,
+  &:disabled:hover,
+  &:disabled:focus {
+    cursor: not-allowed !important;
+  }
+
+  &:hover:not([aria-pressed='true'], [aria-checked='true'], :disabled) {
+    filter: brightness(95%);
+  }
+
+  &:focus {
+    --cdr-border-width: var(--cdr-space-inset-quarter-x);
+  }
+
+  &:active {
+    --cdr-border-width: var(--cdr-space-inset-quarter-x);
+  }
+
+  &[aria-pressed='true'],
+  &[aria-checked='true'] {
+    --cdr-border-width: var(--cdr-space-inset-eighth-x);
+    --cdr-border-color: var(--cdr-default-active-border-color);
+    cursor: default;
+  }
+
+  &[aria-pressed='true']:focus,
+  &[aria-checked='true']:focus {
+    --cdr-border-width: var(--cdr-space-inset-quarter-x);
+  }
+
+  &[aria-pressed='true']:active,
+  &[aria-checked='true']:active {
+    --cdr-border-width: var(--cdr-space-inset-quarter-x);
+  }
+}
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 91fb9ecb9..eb7cbbd72 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -1,11 +1,14 @@
-/**
- * HTMLAttributes data object for allowing any prop to get passed to child
- *
- * @interface HTMLAttributes
- */
-export interface HTMLAttributes {
-  [key: string]: any;
-}
+import type {
+  Tag,
+  Space,
+  Shadow,
+  Radius,
+  BorderColor,
+  Elevation,
+  Position,
+  Palette,
+  Surface,
+} from './other';
 
 /**
  * Breadcrumb data object
@@ -136,3 +139,52 @@ export interface baseTextProps {
   /** Sets the HTML tag (p, span, h1, h2, etc) */
   tag?: string;
 }
+
+/**
+ * HTMLAttributes data object for allowing any prop to get passed to child
+ * @interface HTMLAttributes
+ */
+export interface HTMLAttributes {
+  [key: string]: any;
+}
+
+/**
+ * AtomProps is used by all CdrBox based components
+ * @interface AtomProps
+ */
+export interface AtomProps extends HTMLAttributes {
+  tag?: Tag;
+  shadow?: Shadow;
+  radius?: Radius;
+  surface?: Surface;
+  withBorder?: boolean;
+  borderWidth?: Space;
+  borderColor?: BorderColor;
+  elevation?: Elevation;
+  position?: Position;
+  palette?: Palette;
+  m?: Space;
+  mx?: Space;
+  my?: Space;
+  ml?: Space;
+  mr?: Space;
+  mt?: Space;
+  mb?: Space;
+  p?: Space;
+  px?: Space;
+  py?: Space;
+  pl?: Space;
+  pr?: Space;
+  pt?: Space;
+  pb?: Space;
+}
+
+/**
+ * SurfaceProps contains the props used to create a surface
+ * @interface SurfaceProps
+ * @extends AtomProps
+ */
+export interface SurfaceProps extends AtomProps {
+  surface?: Surface;
+  palette?: Palette;
+}
diff --git a/src/types/other.ts b/src/types/other.ts
index f372003fd..124b47849 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -2,6 +2,8 @@ import type * as CSS from 'csstype';
 
 export type Tag = keyof HTMLElementTagNameMap;
 export type Space =
+  | 'zero'
+  | 'sixteenth-x'
   | 'eighth-x'
   | 'quarter-x'
   | 'half-x'
@@ -14,7 +16,7 @@ export type Space =
 export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
 export type Surface = 'transparent' | 'primary' | 'secondary' | 'brand-spruce';
 export type Radius = 'sharp' | 'soft' | 'softer' | 'round';
-export type BorderColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error';
+export type BorderColor = 'transparent' | 'primary' | 'secondary' | 'success' | 'warning' | 'error';
 export type Elevation =
   | 'ground'
   | 'dropdown'
@@ -24,4 +26,4 @@ export type Elevation =
   | 'notification'
   | 'modal';
 export type Position = CSS.Properties['position'];
-export type Palette = 'primary' | 'sale';
+export type Palette = 'primary' | 'secondary' | 'sale';

From bd0106120ad8f2747c191e3c7179f9ecff040175 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Wed, 1 May 2024 09:37:07 -0700
Subject: [PATCH 06/70] progress check

---
 src/components/box/styles/CdrBox.module.scss  |  7 ++++--
 .../genericButton/CdrGenericButton.vue        |  7 +++---
 .../genericButton/examples/GenericButton.vue  |  2 +-
 src/styles/settings/fluid.vars.scss           |  1 +
 src/styles/settings/index.scss                | 22 +++++++++----------
 5 files changed, 21 insertions(+), 18 deletions(-)

diff --git a/src/components/box/styles/CdrBox.module.scss b/src/components/box/styles/CdrBox.module.scss
index 1b2e3ec20..17a2aa7eb 100644
--- a/src/components/box/styles/CdrBox.module.scss
+++ b/src/components/box/styles/CdrBox.module.scss
@@ -4,9 +4,12 @@
   @include cdr-radius-mixin;
 }
 
-.cdr-box--border,
 .cdr-box--shadow {
-  @include cdr-border-shadow-mixin;
+  @include cdr-shadow-mixin;
+}
+
+.cdr-box--border {
+  @include cdr-border-mixin;
 }
 
 .cdr-box--surface {
diff --git a/src/components/genericButton/CdrGenericButton.vue b/src/components/genericButton/CdrGenericButton.vue
index b38db9779..7243f6a12 100644
--- a/src/components/genericButton/CdrGenericButton.vue
+++ b/src/components/genericButton/CdrGenericButton.vue
@@ -11,7 +11,6 @@ defineOptions({ name: 'CdrGenericButton' });
 
 export interface CdrGenericButtonProps extends CdrHeadlessButtonProps {
   checked?: boolean;
-  modifier?: 'primary' | 'secondary';
 }
 
 const props = withDefaults(defineProps<CdrGenericButtonProps>(), {});
@@ -19,12 +18,12 @@ const props = withDefaults(defineProps<CdrGenericButtonProps>(), {});
 const style = useCssModule();
 const baseClass = 'cdr-generic-button';
 
-// Manages the props passed along to CdrBox
+// Manages the props passed along to CdrHeadlessButton
 const computedProps = computed(() => {
-  const { checked, modifier, ...otherProps } = props;
+  const { checked, ...otherProps } = props;
   const classes = new Set([baseClass]);
   const inlineStyles: CSS.Properties = {};
-  const additionalProps: CdrHeadlessButtonProps = { withBorder: true };
+  const additionalProps: CdrGenericButtonProps = {};
 
   // Add checked
   if (checked) {
diff --git a/src/components/genericButton/examples/GenericButton.vue b/src/components/genericButton/examples/GenericButton.vue
index 2da7262c5..8213b6af7 100644
--- a/src/components/genericButton/examples/GenericButton.vue
+++ b/src/components/genericButton/examples/GenericButton.vue
@@ -3,7 +3,7 @@ import { ref } from 'vue';
 import CdrGenericButton, { type CdrGenericButtonProps } from '../CdrGenericButton.vue';
 import CdrBox from '../../box/CdrBox.vue';
 
-defineOptions({ name: 'StyledButton' });
+defineOptions({ name: 'GenericButton' });
 
 export interface Example {
   name?: string;
diff --git a/src/styles/settings/fluid.vars.scss b/src/styles/settings/fluid.vars.scss
index 67142b1c2..b5ec6d6ab 100644
--- a/src/styles/settings/fluid.vars.scss
+++ b/src/styles/settings/fluid.vars.scss
@@ -25,6 +25,7 @@
     --cdr-type-scale-7: clamp(5.73rem, 4.17cqw + 4.4rem, 9.54rem);
 
     // space
+    --cdr-space-scale-sixteenth-x: clamp(0.1rem, 0.1rem + 0.11cqi, 0.2rem);
     --cdr-space-scale-eighth-x: clamp(0.2rem, 0.2rem + 0.11cqi, 0.3rem);
     --cdr-space-scale-quarter-x: clamp(0.3rem, 0.3rem + 0.11cqi, 0.4rem);
     --cdr-space-scale-half-x: clamp(0.4rem, 0.4rem + 0.11cqi, 0.5rem);
diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index 831657b4d..edf21aeea 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -42,9 +42,11 @@ $cdr-warn: false;
   overflow: hidden;
 }
 
-// This mixin provides a border and a shadow by layering two box-shadows.
-// The border is on a sudo element to elevate it above inner content.
-@mixin cdr-border-shadow-mixin() {
+@mixin cdr-shadow-mixin() {
+  box-shadow: var(--cdr-shadow, var(--cdr-default-shadow));
+}
+
+@mixin cdr-border-mixin() {
   position: relative;
 
   &::after {
@@ -56,10 +58,8 @@ $cdr-warn: false;
     width: 100%;
     height: 100%;
     content: '';
-    box-shadow:
-      inset 0 0 0 var(--cdr-border-width, var(--cdr-default-border-width))
-        var(--cdr-border-color, var(--cdr-palette-border-color, var(--cdr-default-border-color))),
-      var(--cdr-shadow, var(--cdr-default-shadow));
+    box-shadow: inset 0 0 0 var(--cdr-border-width, var(--cdr-default-border-width))
+      var(--cdr-border-color, var(--cdr-palette-border-color, var(--cdr-default-border-color)));
   }
 }
 
@@ -83,6 +83,9 @@ $cdr-warn: false;
 }
 
 @mixin cdr-action-mixin() {
+  // Include a border, which is used to apply checked, focus, and active styling
+  @include cdr-border-mixin;
+
   transition:
     color $cdr-duration-1-x $cdr-timing-function-ease,
     fill $cdr-duration-1-x $cdr-timing-function-ease,
@@ -105,10 +108,7 @@ $cdr-warn: false;
     filter: brightness(95%);
   }
 
-  &:focus {
-    --cdr-border-width: var(--cdr-space-inset-quarter-x);
-  }
-
+  &:focus,
   &:active {
     --cdr-border-width: var(--cdr-space-inset-quarter-x);
   }

From 30d4ff94e0d42b397e652098a5002b77ffdd6a6b Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Fri, 31 May 2024 12:05:34 -0700
Subject: [PATCH 07/70] progress check

---
 src/components/box/examples/Box.vue           | 107 -------
 src/components/examples.js                    |  12 +-
 .../fulfillmentTile/CdrFulfillmentTile.vue    |  85 +++++
 .../CdrFulfillmentTileHeader.vue              |  45 +++
 .../examples/FulfillmentTile.vue              | 296 ++++++++++++++++++
 .../styles/CdrFulfillmentTile.module.scss     |   9 +
 .../CdrFulfillmentTileHeader.module.scss      |  18 ++
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  41 +++
 .../genericButton/CdrGenericButton.vue        |  53 ----
 .../genericButton/examples/GenericButton.vue  | 205 ------------
 .../styles/CdrGenericButton.module.scss       |   5 -
 .../headlessButton/CdrHeadlessButton.vue      |  39 ---
 .../examples/HeadlessButton.vue               |  60 ----
 .../styles/CdrHeadlessButton.module.scss      |   6 -
 .../styles/vars/CdrHeadlessButton.vars.scss   |  21 --
 src/components/modal/examples/Modal.vue       |   1 +
 .../CdrBox.vue => surface/CdrSurface.vue}     |  63 ++--
 src/components/surface/examples/Surface.vue   |  86 +++++
 .../styles/CdrSurface.module.scss}            |  16 +-
 .../surfaceSelection/CdrSurfaceSelection.vue  |  48 +++
 .../examples/SurfaceSelection.vue             | 131 ++++++++
 .../styles/CdrSurfaceSelection.module.scss    |   5 +
 .../styles/vars/CdrSurfaceSelection.vars.scss |  61 ++++
 src/dev/DevPage.vue                           |  13 -
 src/dev/SinkWrapper.vue                       |  47 ++-
 src/dev/router.js                             |   6 +-
 src/lib.ts                                    |   3 +
 src/styles/settings/index.scss                | 131 ++++----
 src/types/interfaces.ts                       |  40 +--
 src/types/other.ts                            |  14 +-
 30 files changed, 991 insertions(+), 676 deletions(-)
 delete mode 100644 src/components/box/examples/Box.vue
 create mode 100644 src/components/fulfillmentTile/CdrFulfillmentTile.vue
 create mode 100644 src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
 create mode 100644 src/components/fulfillmentTile/examples/FulfillmentTile.vue
 create mode 100644 src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
 create mode 100644 src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
 create mode 100644 src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
 delete mode 100644 src/components/genericButton/CdrGenericButton.vue
 delete mode 100644 src/components/genericButton/examples/GenericButton.vue
 delete mode 100644 src/components/genericButton/styles/CdrGenericButton.module.scss
 delete mode 100644 src/components/headlessButton/CdrHeadlessButton.vue
 delete mode 100644 src/components/headlessButton/examples/HeadlessButton.vue
 delete mode 100644 src/components/headlessButton/styles/CdrHeadlessButton.module.scss
 delete mode 100644 src/components/headlessButton/styles/vars/CdrHeadlessButton.vars.scss
 rename src/components/{box/CdrBox.vue => surface/CdrSurface.vue} (54%)
 create mode 100644 src/components/surface/examples/Surface.vue
 rename src/components/{box/styles/CdrBox.module.scss => surface/styles/CdrSurface.module.scss} (51%)
 create mode 100644 src/components/surfaceSelection/CdrSurfaceSelection.vue
 create mode 100644 src/components/surfaceSelection/examples/SurfaceSelection.vue
 create mode 100644 src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
 create mode 100644 src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss

diff --git a/src/components/box/examples/Box.vue b/src/components/box/examples/Box.vue
deleted file mode 100644
index 18b930fb5..000000000
--- a/src/components/box/examples/Box.vue
+++ /dev/null
@@ -1,107 +0,0 @@
-<script setup lang="ts">
-import CdrBox, { type CdrBoxProps } from '../CdrBox.vue';
-
-defineOptions({ name: 'Box' });
-
-export interface BoxExample {
-  props: CdrBoxProps;
-}
-
-export interface Example extends BoxExample {
-  children?: BoxExample[];
-}
-
-const boxes: Example[] = [
-  {
-    props: { 'data-id': 'test' },
-  },
-  {
-    props: {
-      radius: 'round',
-      shadow: 'elevated',
-      withBorder: true,
-      borderWidth: 'sixteenth-x',
-      surface: 'secondary',
-      elevation: 'modal',
-      position: 'relative',
-      m: 'one-x',
-      p: 'one-x',
-    },
-  },
-  {
-    props: {
-      palette: 'secondary',
-      p: 'one-x',
-      withBorder: true,
-      borderWidth: 'sixteenth-x',
-    },
-    children: [
-      {
-        props: {
-          p: 'one-x',
-          withBorder: true,
-          borderWidth: 'sixteenth-x',
-          mt: 'two-x',
-        },
-      },
-      {
-        props: {
-          palette: 'secondary',
-          p: 'one-x',
-          withBorder: true,
-          borderWidth: 'sixteenth-x',
-          mt: 'two-x',
-        },
-      },
-      {
-        props: {
-          palette: 'primary',
-          p: 'one-x',
-          withBorder: true,
-          borderWidth: 'sixteenth-x',
-          mt: 'two-x',
-        },
-      },
-    ],
-  },
-];
-
-const getDescription = (someProps) => {
-  const propsText = Object.keys(someProps)
-    .map((key) => `${key}=${someProps[key]}`)
-    .join(', ');
-  return `Props: ${propsText}`;
-};
-</script>
-
-<template>
-  <div class="boxes-demo">
-    <h2>Box</h2>
-    <template
-      v-for="({ props, children }, index) in boxes"
-      :key="index"
-    >
-      <hr class="boxes-demo__hr" />
-      <CdrBox v-bind="props">
-        {{ getDescription(props) }}
-        <CdrBox
-          v-if="children"
-          v-for="child in children"
-          v-bind="child.props"
-        >
-          {{ getDescription(props) }}
-        </CdrBox>
-      </CdrBox>
-    </template>
-  </div>
-</template>
-
-<style lang="scss">
-@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
-
-.boxes-demo {
-  &__hr {
-    margin: $cdr-space-two-x 0;
-  }
-}
-</style>
diff --git a/src/components/examples.js b/src/components/examples.js
index 787514280..45cf2c1b4 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -1,7 +1,6 @@
 import abstract from 'componentsdir/abstract/examples/Abstract.vue';
 import accordion from 'componentsdir/accordion/examples/Accordion.vue';
 import banner from 'componentsdir/banner/examples/Banner.vue';
-import box from 'componentsdir/box/examples/Box.vue';
 import breadcrumb from 'componentsdir/breadcrumb/examples/Breadcrumb.vue';
 import buttons from 'componentsdir/button/examples/Buttons.vue';
 import captions from 'componentsdir/caption/examples/Caption.vue';
@@ -11,9 +10,8 @@ import chip from 'componentsdir/chip/examples/Chip.vue';
 import choreographer from 'componentsdir/choreographer/examples/Choreographer.vue';
 import container from 'componentsdir/container/examples/Container.vue';
 import formGroup from 'componentsdir/formGroup/examples/FormGroup.vue';
-import genericButton from 'componentsdir/genericButton/examples/GenericButton.vue';
+import fulfillmentTile from 'componentsdir/fulfillmentTile/examples/FulfillmentTile.vue';
 import grid from 'componentsdir/grid/examples/Grid.vue';
-import headlessButton from 'componentsdir/headlessButton/examples/HeadlessButton.vue';
 import icon from 'componentsdir/icon/examples/Icons.vue';
 import images from 'componentsdir/image/examples/Images.vue';
 import inputs from 'componentsdir/input/examples/Inputs.vue';
@@ -32,6 +30,8 @@ import rating from 'componentsdir/rating/examples/Ratings.vue';
 import selects from 'componentsdir/select/examples/Selects.vue';
 import skeleton from 'componentsdir/skeleton/examples/Skeleton.vue';
 import splitSurface from 'componentsdir/splitSurface/examples/SplitSurface.vue';
+import surface from 'componentsdir/surface/examples/Surface.vue';
+import surfaceSelection from 'componentsdir/surfaceSelection/examples/SurfaceSelection.vue';
 import tables from 'componentsdir/table/examples/Table.vue';
 import tabs from 'componentsdir/tabs/examples/Tabs.vue';
 import texts from 'componentsdir/text/examples/Text.vue';
@@ -45,7 +45,6 @@ export default {
   abstract,
   banner,
   accordion,
-  box,
   breadcrumb,
   buttons,
   captions,
@@ -54,10 +53,9 @@ export default {
   chip,
   choreographer,
   container,
+  fulfillmentTile,
   formGroup,
-  genericButton,
   grid,
-  headlessButton,
   icon,
   images,
   inputs,
@@ -76,6 +74,8 @@ export default {
   selects,
   skeleton,
   splitSurface,
+  surface,
+  surfaceSelection,
   tables,
   tabs,
   texts,
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
new file mode 100644
index 000000000..9c9b0f135
--- /dev/null
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -0,0 +1,85 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import type * as CSS from 'csstype';
+import mapClasses from '../../utils/mapClasses';
+import CdrSurfaceSelection from '../surfaceSelection/CdrSurfaceSelection.vue';
+import type { CdrSurfaceSelectionProps } from '../surfaceSelection/CdrSurfaceSelection.vue';
+import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
+import CdrUtilitySans from '../text/presets/CdrUtilitySans.vue';
+
+/** Tile component for displaying a button with optional icon at the top right */
+
+defineOptions({ name: 'CdrFulfillmentTile' });
+
+export interface CdrFulfillmentTileProps extends CdrSurfaceSelectionProps {
+  loading?: boolean;
+  typeScale?: '-1' | '0' | '1' | '2' | '3';
+}
+
+const props = withDefaults(defineProps<CdrFulfillmentTileProps>(), {
+  typeScale: '0',
+});
+
+const style = useCssModule();
+const baseClass = 'cdr-fulfillment-tile';
+
+// Manages the props passed along to CdrGenericButton
+const rootProps = computed(() => {
+  const classes = [baseClass];
+  const inlineStyles: CSS.Properties = {};
+
+  return {
+    ...props,
+    style: inlineStyles,
+    class: mapClasses(style, ...classes),
+  };
+});
+
+const headerProps = computed(() => ({
+  typeScale: props.typeScale,
+  class: style[`${baseClass}__header`],
+}))
+
+const bodyProps = computed(() => ({
+  scale: "-1",
+  tag: "div",
+  class: {
+    [style[`${baseClass}__content`]]: true,
+    [style[`${baseClass}__content--body`]]: true,
+  },
+}))
+
+const footerProps = computed(() => ({
+  scale: "-1",
+  tag: "div",
+  class: {
+    [style[`${baseClass}__content`]]: true,
+    [style[`${baseClass}__content--footer`]]: true,
+  },
+}))
+</script>
+
+<template>
+  <CdrSurfaceSelection v-bind="rootProps">
+    <CdrFulfillmentTileHeader v-if="$slots.label" v-bind="headerProps">
+      <template v-if="$slots['icon-left']" #icon-left>
+        <slot name="icon-left" />
+      </template>
+      <template #label>
+        <slot name="label" />
+      </template>
+      <template v-if="$slots['icon-right']" #icon-right>
+        <slot name="icon-right" />
+      </template>
+    </CdrFulfillmentTileHeader>
+    <CdrUtilitySans v-if="$slots.body" v-bind="bodyProps">
+      <slot name="body" />
+    </CdrUtilitySans>
+    <CdrUtilitySans v-if="$slots.footer" v-bind="footerProps">
+      <slot name="footer" />
+    </CdrUtilitySans>
+
+  </CdrSurfaceSelection>
+</template>
+
+<style lang="scss" module src="./styles/CdrFulfillmentTile.module.scss"></style>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
new file mode 100644
index 000000000..c77b5b1a1
--- /dev/null
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -0,0 +1,45 @@
+<script setup lang="ts">
+import { useCssModule } from 'vue';
+import CdrUtilitySans from '../text/presets/CdrUtilitySans.vue';
+
+/** Tile header component */
+
+defineOptions({ name: 'CdrFulfillmentTileHeader' });
+
+export interface CdrFulfillmentTileHeaderProps {
+  typeScale?: '-1' | '0' | '1' | '2' | '3';
+}
+
+withDefaults(defineProps<CdrFulfillmentTileHeaderProps>(), {
+  typeScale: '0',
+});
+
+const style = useCssModule();
+</script>
+
+<template>
+  <div :class="style['cdr-fulfillment-tile-header']">
+    <span
+      v-if="$slots['icon-left']"
+      :class="style['cdr-fulfillment-tile-header__icon']"
+    >
+      <slot name="icon-left" />
+    </span>
+    <CdrUtilitySans
+      :strong="true"
+      :scale="typeScale"
+      tag="span"
+      :class="style['cdr-fulfillment-tile-header__label']"
+    >
+      <slot name="label" />
+    </CdrUtilitySans>
+    <span
+      v-if="$slots['icon-right']"
+      :class="style['cdr-fulfillment-tile-header__icon']"
+    >
+      <slot name="icon-right" />
+    </span>
+  </div>
+</template>
+
+<style lang="scss" module src="./styles/CdrFulfillmentTileHeader.module.scss"></style>
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
new file mode 100644
index 000000000..33392b3a1
--- /dev/null
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -0,0 +1,296 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+import CdrFulfillmentTile from '../CdrFulfillmentTile.vue';
+import CdrFulfillmentTileHeader from '../CdrFulfillmentTileHeader.vue';
+import { IconCheckFill, IconErrorFill, IconXFill } from '../../icon';
+import CdrButton from '../../button/CdrButton.vue';
+import CdrSurface from '../../surface/CdrSurface.vue';
+import CdrSurfaceSelection from '../../surfaceSelection/CdrSurfaceSelection.vue';
+import CdrUtilitySans from '../../text/presets/CdrUtilitySans.vue';
+
+defineOptions({ name: 'FulfillmentTile' });
+
+const recommendedValue1 = ref(2);
+const recommendedValue2 = ref([1]);
+const otherValue1 = ref(1);
+const otherValue2 = ref([1]);
+
+const toggleCheckbox = (value) => {
+  if (recommendedValue2.value.includes(value)) {
+    recommendedValue2.value = recommendedValue2.value.filter((v) => v !== value);
+  } else {
+    recommendedValue2.value.push(value);
+  }
+};
+
+const toggleCheckbox2 = (value) => {
+  if (otherValue2.value.includes(value)) {
+    otherValue2.value = otherValue2.value.filter((v) => v !== value);
+  } else {
+    otherValue2.value.push(value);
+  }
+};
+</script>
+
+<template>
+  <div class="example">
+    <h2>FulfillmentTile</h2>
+    <h3 class="action-tile-demo__h3">Recommended patterns</h3>
+    <div class="example__tile-row">
+      <CdrFulfillmentTile :disabled="true" class="example__tile example__tile--checkout example__tile--recommended">
+        <template #icon-right>
+          <IconErrorFill inherit-color />
+        </template>
+        <template #label>Pick up</template>
+        <template #body>Not offered</template>
+      </CdrFulfillmentTile>
+      <CdrFulfillmentTile class="example__tile example__tile--checkout example__tile--recommended"
+        :checked="recommendedValue1 === 1" @click="recommendedValue1 = 1">
+        <template v-if="recommendedValue1 === 1" #icon-right>
+          <IconCheckFill inherit-color />
+        </template>
+        <template #label>Ship to address</template>
+        <template #body>
+          Today after 2pm
+        </template>
+        <template #footer>
+          <strong>FREE</strong>
+          - $60 minimum
+        </template>
+      </CdrFulfillmentTile>
+      <CdrFulfillmentTile class="example__tile example__tile--checkout example__tile--recommended"
+        :checked="recommendedValue1 === 2" @click="recommendedValue1 = 2">
+        <template v-if="recommendedValue1 === 2" #icon-right>
+          <IconCheckFill inherit-color />
+        </template>
+        <template #label>Ship to address</template>
+        <template #body>
+          Today after 2pm
+          <br />
+          at Encinitas
+        </template>
+        <template #footer>
+          <strong>FREE</strong>
+          - $60 minimum
+        </template>
+      </CdrFulfillmentTile>
+    </div>
+    <br />
+    <div class="example__tile-row example__tile-row--vertical">
+      <div>
+        <CdrFulfillmentTile class="example__tile example__tile--search example__tile--recommended"
+          :checked="recommendedValue2.includes(1)" type-scale="-1" role="checkbox" @click="toggleCheckbox(1)">
+          <template #icon-left>
+            <IconCheckFill v-if="recommendedValue2.includes(1)" inherit-color />
+            <svg v-else xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="example__icon">
+              <g>
+                <path fill-rule="evenodd"
+                  d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 11-16 0 8 8 0 0116 0z"
+                  clip-rule="evenodd"></path>
+              </g>
+            </svg>
+          </template>
+          <template #label>Store Pickup (32)</template>
+          <template #footer>
+            In stock at
+            <strong>Encinitas</strong>
+          </template>
+
+        </CdrFulfillmentTile>
+        <CdrButton class="example__change-store" modifier="link">
+          Change store
+        </CdrButton>
+      </div>
+      <CdrFulfillmentTile class="example__tile example__tile--search example__tile--recommended"
+        :checked="recommendedValue2.includes(2)" type-scale="-1" role="checkbox" @click="toggleCheckbox(2)">
+        <template #icon-left>
+          <IconCheckFill v-if="recommendedValue2.includes(2)" inherit-color />
+          <svg v-else xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="example__icon">
+            <g>
+              <path fill-rule="evenodd"
+                d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 11-16 0 8 8 0 0116 0z"
+                clip-rule="evenodd"></path>
+            </g>
+          </svg>
+        </template>
+        <template #label>Ship to address (32)</template>
+      </CdrFulfillmentTile>
+    </div>
+    <h3 class="action-tile-demo__h3">Other patterns</h3>
+    <div class="example__tile-row">
+      <CdrFulfillmentTile class="example__tile example__tile--checkout example__tile--checkout-other-disabled"
+        :checked="otherValue1 === 0" @click="otherValue1 = 0">
+        <template v-if="otherValue1 === 0" #icon-right>
+          <IconXFill inherit-color />
+        </template>
+        <template #label>Pick up</template>
+        <template #body>Not offered</template>
+      </CdrFulfillmentTile>
+      <CdrFulfillmentTile class="example__tile example__tile--checkout example__tile--recommended"
+        :checked="otherValue1 === 1" @click="otherValue1 = 1">
+        <template v-if="otherValue1 === 1" #icon-right>
+          <IconCheckFill inherit-color />
+        </template>
+        <template #label>Ship to address</template>
+        <template #body>
+          Today after 2pm
+          <br />
+          at Encinitas
+        </template>
+        <template #footer>
+          <strong>FREE</strong>
+          - $60 minimum
+        </template>
+      </CdrFulfillmentTile>
+    </div>
+    <br />
+    <!--  type-scale="-1"
+         @click="toggleCheckbox2(1)" -->
+    <div class="example__tile-row example__tile-row--vertical">
+      <CdrSurface class="example__tile example__tile--search example__tile--search-other"
+        :border-width="otherValue2.includes(1) ? 'eighth-x' : 'sixteenth-x'" :with-border="true">
+        <CdrSurfaceSelection class="example__search-other-header-button" :checked="otherValue2.includes(1)"
+          role="checkbox" @click="toggleCheckbox2(1)">
+          <CdrFulfillmentTileHeader type-scale="-1">
+            <template #icon-left>
+              <IconCheckFill v-if="otherValue2.includes(1)" inherit-color />
+              <svg v-else xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="example__icon">
+                <g>
+                  <path fill-rule="evenodd"
+                    d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 11-16 0 8 8 0 0116 0z"
+                    clip-rule="evenodd"></path>
+                </g>
+              </svg>
+            </template>
+            <template #label>Store Pickup (32)</template>
+          </CdrFulfillmentTileHeader>
+          <CdrUtilitySans class="example__search-other-header-content" scale="-1" tag="div">
+            In stock at
+            <strong>Encinitas</strong>
+          </CdrUtilitySans>
+        </CdrSurfaceSelection>
+        <hr class="example__search-other-header-hr" />
+        <CdrButton class="example__change-store-other" :full-width="true" modifier="link">
+          Change store
+        </CdrButton>
+      </CdrSurface>
+    </div>
+    <br />
+    <br />
+    <br />
+    <br />
+  </div>
+</template>
+
+<style lang="scss">
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+@import '../styles/vars/CdrFulfillmentTile.vars.scss';
+
+.example {
+  &__h3 {
+    margin: $cdr-space-two-x 0 $cdr-space-one-x 0;
+  }
+
+  &__tile-row {
+    display: flex;
+    gap: var(--cdr-space-scale-three-quarter-x);
+
+    &--vertical {
+      flex-direction: column;
+    }
+  }
+
+  &__tile {
+    &--checkout {
+      width: 100%;
+      max-width: 230px;
+    }
+
+    &--search {
+      width: 100%;
+      max-width: 230px;
+    }
+
+    &--recommended {
+
+      &[aria-pressed='true'],
+      &[aria-checked='true'] {
+        --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-message-success);
+      }
+
+      &:disabled,
+      &:disabled:hover,
+      &:disabled:focus {
+        --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+      }
+    }
+
+    &--checkout-other-disabled {
+      --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+      --cdr-palette-background-rest: var(--cdr-color-background-button-default-disabled);
+      --cdr-palette-border-color: var(--cdr-color-border-primary);
+
+      &[aria-pressed='true'],
+      &[aria-checked='true'] {
+        --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+        --cdr-palette-background-checked: var(--cdr-color-background-button-default-disabled);
+        --cdr-palette-border-color: var(--cdr-palette-border-color-checked);
+      }
+    }
+
+    &--search-other {
+      @include cdr-fulfillment-tile-base-mixin;
+      gap: 0;
+      padding-top: 0;
+      padding-bottom: 0;
+    }
+  }
+
+  &__icon {
+    display: inline-block;
+    vertical-align: middle;
+    flex: 0 0 auto;
+    width: 2.4rem;
+    height: 2.4rem;
+    fill: inherit;
+  }
+
+  &__change-store {
+    padding-left: 0;
+    padding-right: 0;
+  }
+
+  &__search-other-header-button {
+    --cdr-action-border-width-checked: 0;
+    padding: var(--cdr-space-scale-one-x) 0;
+    width: 100%;
+
+    &[aria-pressed='true'],
+    &[aria-checked='true'] {
+      --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-message-success);
+    }
+
+    &:disabled,
+    &:disabled:hover,
+    &:disabled:focus {
+      --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+    }
+  }
+
+  &__search-other-header-content {
+    @include cdr-fulfillment-tile-content-mixin;
+    margin-top: var(--cdr-space-scale-half-x);
+  }
+
+  &__search-other-header-hr {
+    margin: 0;
+    border-top: var(--cdr-space-scale-sixteenth-x) solid initial;
+    width: 100%;
+  }
+
+  &__change-store-other {
+    padding: var(--cdr-space-scale-three-quarter-x) var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x);
+    justify-content: flex-start;
+  }
+}
+</style>
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
new file mode 100644
index 000000000..e3473b7ee
--- /dev/null
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
@@ -0,0 +1,9 @@
+@import './vars/CdrFulfillmentTile.vars.scss';
+
+.cdr-fulfillment-tile {
+  @include cdr-fulfillment-tile-base-mixin;
+
+  &__content {
+    @include cdr-fulfillment-tile-content-mixin;
+  }
+}
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
new file mode 100644
index 000000000..9475ddf7e
--- /dev/null
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
@@ -0,0 +1,18 @@
+@import '../../../styles/settings/index.scss';
+
+.cdr-fulfillment-tile-header {
+  display: flex;
+  align-items: center;
+  gap: var(--cdr-space-scale-three-quarter-x);
+  width: 100%;
+  padding: 0 var(--cdr-space-scale-one-x);
+
+  &__icon {
+    flex: 0 0 auto;
+    fill: var(--cdr-fulfillment-tile-icon-fill);
+  }
+
+  &__label {
+    flex: 1 1 auto;
+  }
+}
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
new file mode 100644
index 000000000..51420023a
--- /dev/null
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -0,0 +1,41 @@
+@import '../../../../styles/settings/index.scss';
+
+@mixin cdr-fulfillment-tile-base-mixin() {
+  @include cdr-text-utility-sans-300;
+  @include cdr-border-mixin;
+  @include cdr-radius-mixin;
+  @include cdr-palette-primary-mixin;
+  --cdr-border-width-default: var(--cdr-space-inset-sixteenth-x);
+  --cdr-radius-default: var(--cdr-radius-softer);
+  --cdr-palette-border-color: var(--cdr-color-border-message-default-01);
+  --cdr-palette-background-checked: var(--cdr-color-background-primary);
+  --cdr-palette-background-disabled: var(--cdr-color-background-button-default-disabled);
+  --cdr-palette-text-color-disabled: var(--cdr-color-text-primary);
+  display: flex;
+  align-items: flex-start;
+  flex-direction: column;
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  width: 100%;
+  gap: var(--cdr-space-scale-half-x);
+  padding: var(--cdr-space-scale-one-x) 0;
+}
+
+@mixin cdr-fulfillment-tile-content-mixin() {
+  padding: 0 var(--cdr-space-scale-one-x);
+  width: 100%;
+
+  strong {
+    --cdr-utility-sans-font-weight: 600;
+    font-weight: var(--cdr-utility-sans-font-weight);
+  }
+
+  &--body {
+    flex: 1 1 auto;
+  }
+
+  &--footer {
+    flex: 0 0 auto;
+  }
+}
diff --git a/src/components/genericButton/CdrGenericButton.vue b/src/components/genericButton/CdrGenericButton.vue
deleted file mode 100644
index 7243f6a12..000000000
--- a/src/components/genericButton/CdrGenericButton.vue
+++ /dev/null
@@ -1,53 +0,0 @@
-<script setup lang="ts">
-import { useCssModule, computed } from 'vue';
-import type * as CSS from 'csstype';
-import mapClasses from '../../utils/mapClasses';
-import CdrHeadlessButton from '../headlessButton/CdrHeadlessButton.vue';
-import type { CdrHeadlessButtonProps } from '../headlessButton/CdrHeadlessButton.vue';
-
-/** Generic button component for buttons that may have a checked state */
-
-defineOptions({ name: 'CdrGenericButton' });
-
-export interface CdrGenericButtonProps extends CdrHeadlessButtonProps {
-  checked?: boolean;
-}
-
-const props = withDefaults(defineProps<CdrGenericButtonProps>(), {});
-
-const style = useCssModule();
-const baseClass = 'cdr-generic-button';
-
-// Manages the props passed along to CdrHeadlessButton
-const computedProps = computed(() => {
-  const { checked, ...otherProps } = props;
-  const classes = new Set([baseClass]);
-  const inlineStyles: CSS.Properties = {};
-  const additionalProps: CdrGenericButtonProps = {};
-
-  // Add checked
-  if (checked) {
-    additionalProps['aria-checked'] = 'true';
-  }
-
-  // If transparent, add class for hover effects
-  if ((!props.surface || props.surface === 'transparent') && !props.palette) {
-    classes.add(`${baseClass}--transparent`);
-  }
-
-  return {
-    ...otherProps,
-    ...additionalProps,
-    style: inlineStyles,
-    class: mapClasses(style, ...classes),
-  };
-});
-</script>
-
-<template>
-  <CdrHeadlessButton v-bind="computedProps">
-    <slot />
-  </CdrHeadlessButton>
-</template>
-
-<style lang="scss" module src="./styles/CdrGenericButton.module.scss"></style>
diff --git a/src/components/genericButton/examples/GenericButton.vue b/src/components/genericButton/examples/GenericButton.vue
deleted file mode 100644
index 8213b6af7..000000000
--- a/src/components/genericButton/examples/GenericButton.vue
+++ /dev/null
@@ -1,205 +0,0 @@
-<script setup lang="ts">
-import { ref } from 'vue';
-import CdrGenericButton, { type CdrGenericButtonProps } from '../CdrGenericButton.vue';
-import CdrBox from '../../box/CdrBox.vue';
-
-defineOptions({ name: 'GenericButton' });
-
-export interface Example {
-  name?: string;
-  props: CdrGenericButtonProps;
-  events?: {
-    click?: Function;
-  };
-}
-
-const boxes: Example[] = [
-  {
-    props: { 'data-id': 'test' },
-  },
-  {
-    props: {
-      surface: 'secondary',
-      p: 'one-x',
-      borderWidth: 'eighth-x',
-      borderColor: 'secondary',
-      withBorder: true,
-    },
-  },
-  {
-    props: {
-      palette: 'secondary',
-      p: 'one-x',
-      borderWidth: 'eighth-x',
-      withBorder: true,
-    },
-  },
-];
-
-const chips = {
-  count: 4,
-  props: {
-    withBorder: true,
-    borderWidth: 'eighth-x',
-    px: 'one-x',
-    py: 'half-x',
-    radius: 'round',
-  },
-};
-const chipsValue = ref(0);
-
-const toggle = {
-  count: 2,
-  props: {
-    p: 'one-x',
-    radius: 'soft',
-    borderWidth: 'zero',
-  },
-};
-
-const toggleValue = ref(0);
-
-const cards = [
-  {
-    props: {
-      class: 'generic-buttons-demo__card',
-      shadow: 'elevated',
-      radius: 'softer',
-      tag: 'a',
-      href: 'https://rei.com/',
-      surface: 'secondary',
-    },
-  },
-  {
-    props: {
-      class: 'generic-buttons-demo__card',
-      shadow: 'elevated',
-      radius: 'softer',
-      button: 'a',
-      surface: 'secondary',
-    },
-  },
-];
-
-const getDescription = (someProps) =>
-  Object.keys(someProps)
-    .map((key) => `${key}=${someProps[key]}`)
-    .join(', ');
-</script>
-
-<template>
-  <div class="generic-buttons-demo">
-    <h2>GenericButton</h2>
-    <template
-      v-for="({ name, props, events = {} }, index) in boxes"
-      :key="index"
-    >
-      <hr class="generic-buttons-demo__hr" />
-      <CdrGenericButton
-        v-bind="props"
-        v-on="events"
-      >
-        <span v-if="name">{{ name }}: {{ ' ' }}</span>
-        {{ getDescription(props) }}
-      </CdrGenericButton>
-    </template>
-    <h3 class="generic-buttons-demo__h3">Chips</h3>
-    <div class="generic-buttons-demo__chips">
-      <CdrGenericButton
-        v-for="(x, index) in new Array(chips.count)"
-        :key="index"
-        v-bind="chips.props"
-        :checked="index === chipsValue"
-        :disabled="index === 2"
-        @click="chipsValue = index"
-      >
-        Chip {{ index + 1 }}
-      </CdrGenericButton>
-    </div>
-    <h3 class="generic-buttons-demo__h3">Toggle</h3>
-    <CdrBox
-      class="generic-buttons-demo__toggle"
-      :with-border="true"
-      border-width="sixteenth-x"
-      p="eighth-x"
-      radius="softer"
-    >
-      <CdrGenericButton
-        v-for="(x, index) in new Array(toggle.count)"
-        :key="index"
-        v-bind="toggle.props"
-        :checked="index === toggleValue"
-        @click="toggleValue = index"
-      >
-        Toggle {{ index + 1 }}
-      </CdrGenericButton>
-    </CdrBox>
-    <h3 class="generic-buttons-demo__h3">Cards</h3>
-    <div class="generic-buttons-demo__cards">
-      <CdrGenericButton
-        v-for="(card, index) in cards"
-        :key="index"
-        v-bind="card.props"
-      >
-        <img
-          src="https://www.rei.com/dam/18516466_gear-up-camp-hikie-homepage-lead-lg_web_lg.jpeg?im=Resize,width=400"
-        />
-        <CdrBox
-          p="two-x"
-          class="generic-buttons-demo__card-content"
-        >
-          Some content
-        </CdrBox>
-      </CdrGenericButton>
-    </div>
-    <br />
-    <br />
-    <br />
-    <br />
-  </div>
-</template>
-
-<style lang="scss">
-@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
-
-.generic-buttons-demo {
-  &__hr {
-    margin: $cdr-space-two-x 0;
-  }
-
-  &__h3 {
-    margin: $cdr-space-two-x 0 $cdr-space-one-x 0;
-  }
-
-  &__chips {
-    display: inline-flex;
-    gap: $cdr-space-quarter-x;
-  }
-
-  &__toggle {
-    display: inline-flex;
-    gap: $cdr-space-quarter-x;
-  }
-
-  &__cards {
-    display: flex;
-    gap: $cdr-space-two-x;
-  }
-
-  &__card {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    width: 300px;
-    height: 200px;
-
-    img {
-      width: 100%;
-      height: 100%;
-      object-fit: cover;
-    }
-  }
-
-  &__card-content {
-  }
-}
-</style>
diff --git a/src/components/genericButton/styles/CdrGenericButton.module.scss b/src/components/genericButton/styles/CdrGenericButton.module.scss
deleted file mode 100644
index 10ea5e08e..000000000
--- a/src/components/genericButton/styles/CdrGenericButton.module.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-@import '../../../styles/settings/index.scss';
-
-.cdr-generic-button {
-  @include cdr-action-mixin;
-}
diff --git a/src/components/headlessButton/CdrHeadlessButton.vue b/src/components/headlessButton/CdrHeadlessButton.vue
deleted file mode 100644
index 823bee168..000000000
--- a/src/components/headlessButton/CdrHeadlessButton.vue
+++ /dev/null
@@ -1,39 +0,0 @@
-<script setup lang="ts">
-import { useCssModule, computed } from 'vue';
-import mapClasses from '../../utils/mapClasses';
-import CdrBox from '../box/CdrBox.vue';
-import type { SurfaceProps } from '../../types/interfaces';
-
-/** Base component for all other buttons */
-
-defineOptions({ name: 'CdrHeadlessButton' });
-
-export interface CdrHeadlessButtonProps extends SurfaceProps {
-  type?: 'button' | 'reset' | 'submit' | undefined;
-}
-
-const props = withDefaults(defineProps<CdrHeadlessButtonProps>(), {
-  tag: 'button',
-  type: undefined,
-});
-
-const style = useCssModule();
-const baseClass = 'cdr-headless-button';
-
-// Manages the props passed along to CdrBox
-const computedProps = computed(() => ({
-  ...props,
-  surface: props.surface || 'transparent',
-  // Automatically apply a type if using button tag
-  type: props.tag == 'button' ? props.type || 'button' : undefined,
-  class: mapClasses(style, baseClass),
-}));
-</script>
-
-<template>
-  <CdrBox v-bind="computedProps">
-    <slot />
-  </CdrBox>
-</template>
-
-<style lang="scss" module src="./styles/CdrHeadlessButton.module.scss"></style>
diff --git a/src/components/headlessButton/examples/HeadlessButton.vue b/src/components/headlessButton/examples/HeadlessButton.vue
deleted file mode 100644
index fffa06528..000000000
--- a/src/components/headlessButton/examples/HeadlessButton.vue
+++ /dev/null
@@ -1,60 +0,0 @@
-<script setup lang="ts">
-import CdrHeadlessButton, { type CdrHeadlessButtonProps } from '../CdrHeadlessButton.vue';
-
-defineOptions({ name: 'HeadlessButton' });
-
-export interface Example {
-  props: CdrHeadlessButtonProps;
-  events?: {
-    click?: Function;
-  };
-}
-
-const boxes: Example[] = [
-  {
-    props: { 'data-id': 'test' },
-    events: { click: () => alert('Clicked!') },
-  },
-  {
-    props: { tag: 'a', href: 'https://www.rei.com/' },
-  },
-  {
-    props: { p: 'one-x', surface: 'secondary', radius: 'softer', shadow: 'elevated' },
-  },
-];
-
-const getDescription = (someProps) => {
-  const propsText = Object.keys(someProps)
-    .map((key) => `${key}=${someProps[key]}`)
-    .join(', ');
-  return `Props: ${propsText}`;
-};
-</script>
-
-<template>
-  <div class="headless-buttons-demo">
-    <h2>HeadlessButton</h2>
-    <template
-      v-for="({ props, events = {} }, index) in boxes"
-      :key="index"
-    >
-      <hr class="headless-buttons-demo__hr" />
-      <CdrHeadlessButton
-        v-bind="props"
-        v-on="events"
-      >
-        {{ getDescription(props) }}
-      </CdrHeadlessButton>
-    </template>
-  </div>
-</template>
-
-<style lang="scss">
-@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
-
-.headless-buttons-demo {
-  &__hr {
-    margin: $cdr-space-two-x 0;
-  }
-}
-</style>
diff --git a/src/components/headlessButton/styles/CdrHeadlessButton.module.scss b/src/components/headlessButton/styles/CdrHeadlessButton.module.scss
deleted file mode 100644
index 56fb6a264..000000000
--- a/src/components/headlessButton/styles/CdrHeadlessButton.module.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-@import '../../../styles/settings/index.scss';
-@import './vars/CdrHeadlessButton.vars.scss';
-
-.cdr-headless-button {
-  @include cdr-headless-button-base-mixin;
-}
diff --git a/src/components/headlessButton/styles/vars/CdrHeadlessButton.vars.scss b/src/components/headlessButton/styles/vars/CdrHeadlessButton.vars.scss
deleted file mode 100644
index 1405815e9..000000000
--- a/src/components/headlessButton/styles/vars/CdrHeadlessButton.vars.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-@mixin cdr-headless-button-base-reset-mixin() {
-  border: none;
-  cursor: pointer;
-  appearance: none;
-  text-align: left;
-  text-decoration: none;
-  color: inherit;
-  touch-action: manipulation;
-  -webkit-tap-highlight-color: transparent;
-  padding-block: 0;
-  padding-inline: 0;
-
-  &:focus {
-    outline: none;
-  }
-}
-
-@mixin cdr-headless-button-base-mixin() {
-  @include cdr-text-utility-sans-300;
-  @include cdr-headless-button-base-reset-mixin;
-}
diff --git a/src/components/modal/examples/Modal.vue b/src/components/modal/examples/Modal.vue
index 2dee9d59e..ce6440151 100644
--- a/src/components/modal/examples/Modal.vue
+++ b/src/components/modal/examples/Modal.vue
@@ -13,6 +13,7 @@
       role="dialog"
       data-ui="hamburger-modal"
       aria-labelledby="some-heading"
+      class="david-class"
     >
       <template #title>
         <cdr-text
diff --git a/src/components/box/CdrBox.vue b/src/components/surface/CdrSurface.vue
similarity index 54%
rename from src/components/box/CdrBox.vue
rename to src/components/surface/CdrSurface.vue
index ebf06ea46..93c4f85fe 100644
--- a/src/components/box/CdrBox.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -1,25 +1,24 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
-import type * as CSS from 'csstype';
 import mapClasses from '../../utils/mapClasses';
-import type { SurfaceProps } from '../../types/interfaces';
+import type { SurfaceProps, InlineCss } from '../../types/interfaces';
 
 /** Base component for all other components */
 
-defineOptions({ name: 'CdrBox' });
+defineOptions({ name: 'CdrSurface' });
 
-export interface CdrBoxProps extends SurfaceProps {}
+export interface CdrSurfaceProps extends SurfaceProps {}
 
-const props = withDefaults(defineProps<CdrBoxProps>(), {
+const props = withDefaults(defineProps<CdrSurfaceProps>(), {
   tag: 'div',
 });
 
 const style = useCssModule();
-const baseClass = 'cdr-box';
+const baseClass = 'cdr-surface';
 const borderClass = `${baseClass}--border`;
 const radiusClass = `${baseClass}--radius`;
 const shadowClass = `${baseClass}--shadow`;
-const surfaceClass = `${baseClass}--surface`;
+const backgroundClass = `${baseClass}--background`;
 const elevationClass = `${baseClass}--elevation`;
 const paletteClass = `${baseClass}--palette`;
 
@@ -42,72 +41,76 @@ const marginsAndPaddingMap = {
 };
 const marginAndPaddingKeys = Object.keys(marginsAndPaddingMap);
 
-// Manages the props passed along to CdrBox
+// Manages the props passed along to CdrSurface
 const computedProps = computed(() => {
-  const classes = new Set<string>([baseClass]);
-  const inlineStyles: CSS.Properties = {};
+  const classes = [];
+  const inlineStyles: InlineCss = {};
+
+  // Add display
+  if (props.display) {
+    inlineStyles['display'] = props.display;
+  }
 
   // Add palette
   if (props.palette) {
-    classes.add(`${paletteClass}-${props.palette}`);
-    classes.add(borderClass);
-    classes.add(surfaceClass);
+    classes.push(`${paletteClass}-${props.palette}`);
   }
 
   // Add border
   if (props.withBorder) {
     if (props.borderWidth) {
-      inlineStyles['--cdr-default-border-width'] = `var(--cdr-space-inset-${props.borderWidth})`;
+      inlineStyles['--cdr-border-width-default'] = `var(--cdr-space-inset-${props.borderWidth})`;
     }
 
     if (props.borderColor) {
-      inlineStyles['--cdr-default-border-color'] = `var(--cdr-color-border-${props.borderColor})`;
+      inlineStyles['--cdr-border-color-default'] = `var(--cdr-color-border-${props.borderColor})`;
     }
 
-    classes.add(borderClass);
+    classes.push(borderClass);
   }
 
   // Add radius
   if (props.radius) {
-    inlineStyles['--cdr-default-radius'] = `var(--cdr-radius-${props.radius})`;
-    classes.add(radiusClass);
+    inlineStyles['--cdr-radius-default'] = `var(--cdr-radius-${props.radius})`;
+    classes.push(radiusClass);
   }
 
   // Add shadow
   if (props.shadow) {
-    inlineStyles['--cdr-default-shadow'] = `var(--cdr-prominence-${props.shadow})`;
-    classes.add(shadowClass);
+    inlineStyles['--cdr-shadow-default'] = `var(--cdr-prominence-${props.shadow})`;
+    classes.push(shadowClass);
   }
 
-  // Add surface
-  if (props.surface) {
-    inlineStyles['--cdr-default-surface'] = `var(--cdr-color-background-${props.surface})`;
-    classes.add(surfaceClass);
+  // Add background
+  if (props.background) {
+    inlineStyles['--cdr-background-default'] = `var(--cdr-color-background-${props.background})`;
+    classes.push(backgroundClass);
   }
 
   // Add elevation
   if (props.elevation) {
     if (props.elevation) {
-      inlineStyles['--cdr-default-elevation'] = `var(--cdr-elevation-${props.elevation})`;
+      inlineStyles['--cdr-elevation-default'] = `var(--cdr-elevation-${props.elevation})`;
     }
 
     if (props.position) {
-      inlineStyles['--cdr-default-position'] = props.position;
+      inlineStyles['--cdr-position-default'] = props.position;
     }
 
-    classes.add(elevationClass);
+    classes.push(elevationClass);
   }
 
   // Add margin and padding
   if (marginAndPaddingKeys.find((key) => props[key])) {
     marginAndPaddingKeys.forEach((key) => {
       if (props[key]) {
-        inlineStyles[marginsAndPaddingMap[key]] = `var(--cdr-space-scale-${props[key]})`;
+        const cssProperty = marginsAndPaddingMap[key];
+        inlineStyles[cssProperty] = `var(--cdr-space-${props.fixed ? '' : 'scale-'}${props[key]})`;
       }
     });
   }
 
-  return { style: inlineStyles, class: mapClasses(style, ...classes) };
+  return { style: inlineStyles, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
 
@@ -120,4 +123,4 @@ const computedProps = computed(() => {
   </component>
 </template>
 
-<style lang="scss" module src="./styles/CdrBox.module.scss"></style>
+<style lang="scss" module src="./styles/CdrSurface.module.scss"></style>
diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
new file mode 100644
index 000000000..ed7a06a86
--- /dev/null
+++ b/src/components/surface/examples/Surface.vue
@@ -0,0 +1,86 @@
+<script setup lang="ts">
+import CdrSurface, { type CdrSurfaceProps } from '../CdrSurface.vue';
+
+defineOptions({ name: 'Surface' });
+
+export interface Example {
+  label: string;
+  props: CdrSurfaceProps;
+}
+
+const boxes: Example[] = [
+  {
+    label: 'This is a blank Surface',
+    props: {},
+  },
+  {
+    label: 'This surface is styled like a card',
+    props: {
+      display: 'inline-block',
+      radius: 'soft',
+      shadow: 'elevated',
+      background: 'secondary',
+      p: 'three-x',
+    },
+  },
+  {
+    label: 'This surface is styled like a chip or pill',
+    props: {
+      display: 'inline-block',
+      radius: 'round',
+      withBorder: true,
+      borderWidth: 'sixteenth-x',
+      background: 'secondary',
+      elevation: 'modal',
+      position: 'relative',
+      px: 'one-x',
+      py: 'three-quarter-x',
+      fixed: true,
+    },
+  },
+  {
+    label: 'This surface uses the primary palette to apply a background and border color',
+    props: {
+      palette: 'primary',
+      display: 'inline-block',
+      radius: 'soft',
+      p: 'two-x',
+      withBorder: true,
+      borderWidth: 'sixteenth-x',
+    },
+  },
+  {
+    label: 'This surface uses the secondary palette to apply a background and border color',
+    props: {
+      palette: 'secondary',
+      display: 'inline-block',
+      radius: 'soft',
+      p: 'two-x',
+      withBorder: true,
+      borderWidth: 'sixteenth-x',
+    },
+  },
+];
+</script>
+
+<template>
+  <div class="example">
+    <h2>Surface</h2>
+    <template v-for="({ label, props }, index) in boxes" :key="index">
+      <hr class="example__hr" />
+      <CdrSurface v-bind="props">
+        {{ label }}
+      </CdrSurface>
+    </template>
+  </div>
+</template>
+
+<style lang="scss">
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
+.example {
+  &__hr {
+    margin: $cdr-space-two-x 0;
+  }
+}
+</style>
diff --git a/src/components/box/styles/CdrBox.module.scss b/src/components/surface/styles/CdrSurface.module.scss
similarity index 51%
rename from src/components/box/styles/CdrBox.module.scss
rename to src/components/surface/styles/CdrSurface.module.scss
index 17a2aa7eb..0abcbfe13 100644
--- a/src/components/box/styles/CdrBox.module.scss
+++ b/src/components/surface/styles/CdrSurface.module.scss
@@ -1,29 +1,29 @@
 @import '../../../styles/settings/index.scss';
 
-.cdr-box--radius {
+.cdr-surface--radius {
   @include cdr-radius-mixin;
 }
 
-.cdr-box--shadow {
+.cdr-surface--shadow {
   @include cdr-shadow-mixin;
 }
 
-.cdr-box--border {
+.cdr-surface--border {
   @include cdr-border-mixin;
 }
 
-.cdr-box--surface {
-  @include cdr-surface-mixin;
+.cdr-surface--background {
+  @include cdr-background-mixin;
 }
 
-.cdr-box--elevation {
+.cdr-surface--elevation {
   @include cdr-elevation-mixin;
 }
 
-.cdr-box--palette-primary {
+.cdr-surface--palette-primary {
   @include cdr-palette-primary-mixin;
 }
 
-.cdr-box--palette-secondary {
+.cdr-surface--palette-secondary {
   @include cdr-palette-secondary-mixin;
 }
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
new file mode 100644
index 000000000..384a7d94c
--- /dev/null
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -0,0 +1,48 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import mapClasses from '../../utils/mapClasses';
+import CdrSurface from '../surface/CdrSurface.vue';
+import type { CdrSurfaceProps } from '../surface/CdrSurface.vue';
+
+/** SurfaceSelection component for buttons that may have a checked state */
+
+defineOptions({ name: 'CdrSurfaceSelection' });
+
+export interface CdrSurfaceSelectionProps extends CdrSurfaceProps {
+  type?: 'button' | 'reset' | 'submit' | undefined;
+  checked?: boolean;
+}
+
+const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
+  tag: 'button',
+  background: 'transparent',
+});
+
+const style = useCssModule();
+const baseClass = 'cdr-surface-selection';
+
+// Manages the props passed along to CdrSurface
+const computedProps = computed(() => {
+  const { checked, ...otherProps } = props;
+  const additionalProps: CdrSurfaceSelectionProps = {};
+
+  // Add checked
+  if (checked) {
+    additionalProps['aria-checked'] = 'true';
+  }
+
+  return {
+    ...otherProps,
+    ...additionalProps,
+    class: mapClasses(style, baseClass),
+  };
+});
+</script>
+
+<template>
+  <CdrSurface v-bind="computedProps">
+    <slot />
+  </CdrSurface>
+</template>
+
+<style lang="scss" module src="./styles/CdrSurfaceSelection.module.scss"></style>
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
new file mode 100644
index 000000000..633340265
--- /dev/null
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -0,0 +1,131 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+import CdrSurfaceSelection, { type CdrSurfaceSelectionProps } from '../CdrSurfaceSelection.vue';
+import CdrSurface from '../../surface/CdrSurface.vue';
+import CdrText from '../../text/CdrText.vue';
+
+defineOptions({ name: 'SurfaceSelection' });
+
+
+
+// const boxes: Example[] = [
+//   {
+//     props: { 'data-id': 'test' },
+//   },
+//   {
+//     props: ,
+//   },
+//   {
+//     props: {
+//       palette: 'secondary',
+//       p: 'one-x',
+//       borderWidth: 'eighth-x',
+//       withBorder: true,
+//     },
+//   },
+// ];
+
+const chips = {
+  count: 4,
+  props: {
+    withBorder: true,
+    borderWidth: 'eighth-x',
+    px: 'one-x',
+    py: 'half-x',
+    radius: 'round',
+    palette: 'primary',
+  },
+};
+const chipsValue = ref(0);
+
+const toggle = {
+  count: 2,
+  props: {
+    p: 'one-x',
+    radius: 'softer',
+    palette: 'primary',
+    borderWidth: 'zero',
+    withBorder: true,
+    class: 'example__toggle-button',
+  },
+};
+
+const toggleValue = ref(0);
+
+const card = {
+  props: {
+    class: 'example__card',
+    shadow: 'elevated',
+    radius: 'softer',
+    tag: 'a',
+    href: 'https://rei.com/',
+    palette: 'secondary',
+  },
+};
+</script>
+
+<template>
+  <div class="example">
+    <h2>SurfaceSelection</h2>
+    <hr class="example__hr" />
+    <CdrSurfaceSelection>
+      This is a blank SurfaceSelection
+    </CdrSurfaceSelection>
+    <hr class="example__hr" />
+    <CdrSurfaceSelection v-bind="{ p: 'one-x', palette: 'primary', withBorder: true, borderWidth: 'sixteenth-x' }">
+      This surface uses the primary palette to apply a background and border color
+    </CdrSurfaceSelection>
+    <hr class="example__hr" />
+    <CdrSurfaceSelection v-bind="{ p: 'one-x', palette: 'secondary', withBorder: true, borderWidth: 'sixteenth-x' }">
+      This surface uses the secondary palette to apply a background and border color
+    </CdrSurfaceSelection>
+    <hr class="example__hr" />
+    <h3 class="example__h3">Chips</h3>
+    <div class="example__chips">
+      <CdrSurfaceSelection v-for="(x, index) in new Array(chips.count)" :key="index" v-bind="chips.props"
+        :checked="index === chipsValue" :disabled="index === 2" @click="chipsValue = index">
+        Chip {{ index + 1 }}
+      </CdrSurfaceSelection>
+    </div>
+    <hr class="example__hr" />
+    <h3 class="example__h3">Toggle</h3>
+    <CdrSurface class="example__toggle" :with-border="true" border-width="sixteenth-x" p="quarter-x" radius="softer"
+      palette="secondary">
+      <CdrSurfaceSelection v-for="(x, index) in new Array(toggle.count)" :key="index" v-bind="toggle.props"
+        :checked="index === toggleValue" @click="toggleValue = index">
+        Toggle {{ index + 1 }}
+      </CdrSurfaceSelection>
+    </CdrSurface>
+  </div>
+</template>
+
+<style lang="scss">
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
+.example {
+  &__hr {
+    margin: $cdr-space-two-x 0;
+  }
+
+  &__h3 {
+    margin: $cdr-space-two-x 0 $cdr-space-one-x 0;
+  }
+
+  &__chips {
+    display: inline-flex;
+    gap: $cdr-space-quarter-x;
+  }
+
+  &__toggle {
+    display: inline-flex;
+    gap: $cdr-space-quarter-x;
+  }
+
+  &__toggle-button {
+    --cdr-palette-background-rest: var(--cdr-color-border-transparent);
+    --cdr-palette-background-hover: #e3e0d8;
+    --cdr-palette-background-active: var(--cdr-color-background-primary);
+    --cdr-palette-background-checked: var(--cdr-color-background-primary);
+  }
+}
+</style>
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
new file mode 100644
index 000000000..98441c72c
--- /dev/null
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
@@ -0,0 +1,5 @@
+@import './vars/CdrSurfaceSelection.vars.scss';
+
+.cdr-surface-selection {
+  @include cdr-surface-selection-base-mixin;
+}
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
new file mode 100644
index 000000000..bff221a29
--- /dev/null
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -0,0 +1,61 @@
+@import '../../../../styles/settings/index.scss';
+
+@mixin cdr-surface-selection-base-mixin() {
+  @include cdr-text-utility-sans-300;
+  border: none;
+  cursor: pointer;
+  appearance: none;
+  text-align: left;
+  text-decoration: none;
+  touch-action: manipulation;
+  -webkit-tap-highlight-color: transparent;
+  padding-block: 0;
+  padding-inline: 0;
+
+  transition:
+    color var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
+    fill var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
+    background-color var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
+    box-shadow var(--cdr-duration-1-x) var(--cdr-timing-function-ease);
+
+  &:disabled,
+  &:disabled:hover,
+  &:disabled:focus {
+    --cdr-palette-background: var(--cdr-palette-background-disabled);
+    --cdr-palette-border-color: var(--cdr-palette-border-color-disabled);
+    --cdr-palette-text-color: var(--cdr-palette-text-color-disabled);
+    cursor: not-allowed !important;
+  }
+
+  &:hover:not([aria-pressed='true'], [aria-checked='true'], :disabled) {
+    --cdr-palette-background: var(--cdr-palette-background-hover);
+    --cdr-palette-border-color: var(--cdr-palette-border-color-hover);
+  }
+
+  &:focus,
+  &:active,
+  &[aria-pressed='true']:focus,
+  &[aria-pressed='true']:active,
+  &[aria-checked='true']:focus,
+  &[aria-checked='true']:active {
+    @include cdr-border-mixin;
+    outline: none;
+    --cdr-border-width: var(--cdr-action-border-width-active);
+    --cdr-palette-background: var(--cdr-palette-background-active);
+    --cdr-palette-border-color: var(--cdr-palette-border-color-active);
+  }
+
+  &[aria-pressed='true'],
+  &[aria-checked='true'] {
+    @include cdr-border-mixin;
+    --cdr-border-width: var(--cdr-action-border-width-checked);
+    --cdr-palette-background: var(--cdr-palette-background-checked);
+    --cdr-palette-border-color: var(--cdr-palette-border-color-checked);
+    @include cdr-text-utility-sans-strong-300;
+  }
+
+  &[aria-pressed='true']:not([role='checkbox']),
+  &[aria-checked='true']:not([role='checkbox']) {
+    cursor: default;
+  }
+}
diff --git a/src/dev/DevPage.vue b/src/dev/DevPage.vue
index 8eeebf755..35ad31b70 100644
--- a/src/dev/DevPage.vue
+++ b/src/dev/DevPage.vue
@@ -133,19 +133,6 @@ export default {
   display:inline-flex;
 }
 
-.background-primary {
-  background-color: $cdr-color-background-primary;
-
-}
-
-.background-secondary {
-  background-color: $cdr-color-background-secondary;
-}
-
-.background-brand {
-  background-color: $cdr-color-background-brand-spruce;
-}
-
 // NOTE: type examples in this file are for testing and development purposes only
 .cdr-text-dev {
   &--italic {
diff --git a/src/dev/SinkWrapper.vue b/src/dev/SinkWrapper.vue
index 35ed10cff..7b8d8a9fa 100644
--- a/src/dev/SinkWrapper.vue
+++ b/src/dev/SinkWrapper.vue
@@ -1,52 +1,44 @@
 <template>
-  <div
-    :class="backgroundClass"
-  >
-    Toggle background color:
+  <div>
+    Toggle palette color:
     <cdr-radio
-      v-for="bg in backgrounds"
-      :custom-value="bg"
-      :key="bg"
-      name="background"
-      v-model="background"
-      class="background-toggle"
+      v-for="pal in palettes"
+      :custom-value="pal"
+      :key="pal"
+      name="palette"
+      v-model="palette"
+      class="palette-toggle"
     >
-      {{ capitalize(bg) }}
+      {{ capitalize(pal) }}
     </cdr-radio>
-    <slot />
+    <cdr-surface :palette="palette">
+      <slot />
+    </cdr-surface>
   </div>
 </template>
 
 <script>
-
-import { CdrRadio } from 'srcdir/lib';
+import { CdrRadio, CdrSurface } from 'srcdir/lib';
 import { upperFirst } from 'lodash-es';
 
 export default {
   name: 'SinkWrapper',
   components: {
     CdrRadio,
+    CdrSurface,
   },
   data() {
     return {
-      background: this.$route.query.background || 'primary',
-      backgrounds: [
-        'primary', 'secondary',
-        //  'success', 'info', 'warning', 'error',
-      ],
+      palette: this.$route.query.palette || 'primary',
+      palettes: ['primary', 'secondary'],
     };
   },
-  computed: {
-    backgroundClass() {
-      return `background-${this.background}`;
-    },
-  },
   watch: {
-    background() {
+    palette() {
       this.$router.replace({
         path: this.$route.path,
         query: {
-          background: this.background,
+          palette: this.palette,
         },
       });
     },
@@ -60,9 +52,8 @@ export default {
 </script>
 
 <style>
-.background-toggle {
+.palette-toggle {
   display: inline-block;
   margin: 0 8px;
 }
-
 </style>
diff --git a/src/dev/router.js b/src/dev/router.js
index 5783396b3..d0f868fc6 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -24,7 +24,6 @@ const routes = [
   { path: '/abstract', name: 'Abstract', component: Examples.abstract },
   { path: '/accordion', name: 'Accordion', component: Examples.accordion },
   { path: '/banner', name: 'Banner', component: Examples.banner },
-  { path: '/box', name: 'Box', component: Examples.box },
   { path: '/breadcrumbs', name: 'Breadcrumb', component: Examples.breadcrumb },
   { path: '/buttons', name: 'Buttons', component: Examples.buttons },
   { path: '/captions', name: 'Captions', component: Examples.captions },
@@ -34,9 +33,8 @@ const routes = [
   { path: '/choreographer', name: 'Choreographer', component: Examples.choreographer },
   { path: '/containers', name: 'Container', component: Examples.container },
   { path: '/formGroups', name: 'Form Groups', component: Examples.formGroup },
-  { path: '/genericButton', name: 'GenericButton', component: Examples.genericButton },
+  { path: '/fulfillmentTile', name: 'FulfillmentTile', component: Examples.fulfillmentTile },
   { path: '/grid', name: 'Grid', component: Examples.grid },
-  { path: '/headlessButton', name: 'HeadlessButton', component: Examples.headlessButton },
   { path: '/icons', name: 'Icons', component: Examples.icon },
   { path: '/images', name: 'Images', component: Examples.images },
   { path: '/inputs', name: 'Input', component: Examples.inputs },
@@ -55,6 +53,8 @@ const routes = [
   { path: '/selects', name: 'Selects', component: Examples.selects },
   { path: '/skeleton', name: 'Skeleton', component: Examples.skeleton },
   { path: '/split-surface', name: 'Split Surface', component: Examples.splitSurface },
+  { path: '/surface', name: 'Surface', component: Examples.surface },
+  { path: '/surfaceSelection', name: 'SurfaceSelection', component: Examples.surfaceSelection },
   { path: '/tables', name: 'Tables', component: Examples.tables },
   { path: '/tabs', name: 'Tabs', component: Examples.tabs },
   { path: '/texts', name: 'Texts', component: Examples.texts },
diff --git a/src/lib.ts b/src/lib.ts
index 73371b038..30f920ee6 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -13,6 +13,7 @@ export { default as CdrChipGroup } from './components/chip/CdrChipGroup.vue';
 export { default as CdrChoreographer } from './components/choreographer/CdrChoreographer.vue';
 export { default as CdrContainer } from './components/container/CdrContainer.vue';
 export { default as CdrFormGroup } from './components/formGroup/CdrFormGroup.vue';
+export { default as CdrFulfillmentTile } from './components/fulfillmentTile/CdrFulfillmentTile.vue';
 export { default as CdrGrid } from './components/grid/CdrGrid.vue';
 export { default as CdrIcon } from './components/icon/CdrIcon.vue';
 export { default as CdrImg } from './components/image/CdrImg.vue';
@@ -32,6 +33,8 @@ export { default as CdrSelect } from './components/select/CdrSelect.vue';
 export { default as CdrSkeleton } from './components/skeleton/CdrSkeleton.vue';
 export { default as CdrSkeletonBone } from './components/skeleton/CdrSkeletonBone.vue';
 export { default as CdrSplitSurface } from './components/splitSurface/CdrSplitSurface.vue';
+export { default as CdrSurface } from './components/surface/CdrSurface.vue';
+export { default as CdrSurfaceSelection } from './components/surfaceSelection/CdrSurfaceSelection.vue';
 export { default as CdrTable } from './components/table/CdrTable.vue';
 export { default as CdrTabPanel } from './components/tabs/CdrTabPanel.vue';
 export { default as CdrTabs } from './components/tabs/CdrTabs.vue';
diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index edf21aeea..b013e799d 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -25,28 +25,33 @@ $cdr-warn: false;
   --cdr-space-zero: 0;
   --cdr-space-sixteenth-x: 0.1rem;
 
+  // Action globals
+  --cdr-action-border-width-rest: var(--cdr-space-inset-zero);
+  --cdr-action-border-width-hover: var(--cdr-space-inset-eighth-x);
+  --cdr-action-border-width-active: var(--cdr-space-inset-quarter-x);
+  --cdr-action-border-width-checked: var(--cdr-space-inset-eighth-x);
+
   // Defaults are the least intrusive state of something
-  --cdr-default-border-width: var(--cdr-space-inset-zero);
-  --cdr-default-border-color: var(--cdr-color-border-primary);
-  --cdr-default-border: inset var(--cdr-default-border-width) 0 0 var(--cdr-color-border-primary);
-  --cdr-default-surface: transparent;
-  --cdr-default-radius: var(--cdr-radius-sharp);
-  --cdr-default-shadow: var(--cdr-prominence-flat);
-  --cdr-default-elevation: var(--cdr-elevation-ground);
-  --cdr-default-position: relative;
-  --cdr-default-active-border-color: var(--cdr-color-border-dark);
+  --cdr-border-width-default: var(--cdr-space-inset-zero);
+  --cdr-border-color-default: var(--cdr-color-border-primary);
+  --cdr-background-default: transparent;
+  --cdr-radius-default: var(--cdr-radius-sharp);
+  --cdr-shadow-default: var(--cdr-prominence-flat);
+  --cdr-elevation-default: var(--cdr-elevation-ground);
+  --cdr-position-default: relative;
 }
 
 @mixin cdr-radius-mixin() {
-  border-radius: var(--cdr-radius, var(--cdr-default-radius));
+  border-radius: var(--cdr-radius, var(--cdr-radius-default));
   overflow: hidden;
 }
 
 @mixin cdr-shadow-mixin() {
-  box-shadow: var(--cdr-shadow, var(--cdr-default-shadow));
+  box-shadow: var(--cdr-shadow, var(--cdr-shadow-default));
 }
 
 @mixin cdr-border-mixin() {
+  --cdr-palette-border-color: initial;
   position: relative;
 
   &::after {
@@ -58,75 +63,61 @@ $cdr-warn: false;
     width: 100%;
     height: 100%;
     content: '';
-    box-shadow: inset 0 0 0 var(--cdr-border-width, var(--cdr-default-border-width))
-      var(--cdr-border-color, var(--cdr-palette-border-color, var(--cdr-default-border-color)));
+    box-shadow: inset 0 0 0 var(--cdr-border-width, var(--cdr-border-width-default))
+      var(--cdr-border-color, var(--cdr-palette-border-color, var(--cdr-border-color-default)));
   }
 }
 
-@mixin cdr-surface-mixin() {
-  background-color: var(--cdr-surface, var(--cdr-palette-surface, var(--cdr-default-surface)));
+@mixin cdr-background-mixin() {
+  --cdr-palette-background: initial;
+  background-color: var(
+    --cdr-background,
+    var(--cdr-palette-background, var(--cdr-background-default))
+  );
 }
 
 @mixin cdr-elevation-mixin() {
-  z-index: var(--cdr-elevation, var(--cdr-default-elevation));
-  position: var(--cdr-position, var(--cdr-default-position));
+  z-index: var(--cdr-elevation, var(--cdr-elevation-default));
+  position: var(--cdr-position, var(--cdr-position-default));
 }
 
-@mixin cdr-palette-primary-mixin() {
-  --cdr-palette-surface: var(--cdr-color-background-primary);
-  --cdr-palette-border-color: var(--cdr-color-border-primary);
+@mixin cdr-palette-base-mixin() {
+  @include cdr-background-mixin();
+  @include cdr-border-mixin();
+  --cdr-palette-background: var(--cdr-palette-background-rest);
+  --cdr-palette-border-color: var(--cdr-palette-border-color-rest);
+  --cdr-palette-text-color: var(--cdr-palette-text-color-rest);
+  --cdr-text-color: var(--cdr-palette-text-color);
 }
 
-@mixin cdr-palette-secondary-mixin() {
-  --cdr-palette-surface: var(--cdr-color-background-secondary);
-  --cdr-palette-border-color: var(--cdr-color-border-secondary);
+@mixin cdr-palette-primary-mixin() {
+  @include cdr-palette-base-mixin;
+  --cdr-palette-background-rest: var(--cdr-color-background-primary);
+  --cdr-palette-background-hover: #f4f2ed;
+  --cdr-palette-background-active: #edeae3;
+  --cdr-palette-background-checked: #dcd6cb;
+  --cdr-palette-background-disabled: #ffffff;
+  --cdr-palette-border-color-rest: #dcd6cb;
+  --cdr-palette-border-color-hover: #928b80;
+  --cdr-palette-border-color-active: #4e4d49;
+  --cdr-palette-border-color-checked: #4e4d49;
+  --cdr-palette-border-color-disabled: var(--cdr-color-border-primary);
+  --cdr-palette-text-color-rest: var(--cdr-color-text-primary);
+  --cdr-palette-text-color-disabled: var(--cdr-color-text-disabled);
 }
 
-@mixin cdr-action-mixin() {
-  // Include a border, which is used to apply checked, focus, and active styling
-  @include cdr-border-mixin;
-
-  transition:
-    color $cdr-duration-1-x $cdr-timing-function-ease,
-    fill $cdr-duration-1-x $cdr-timing-function-ease,
-    background-color $cdr-duration-1-x $cdr-timing-function-ease,
-    box-shadow $cdr-duration-1-x $cdr-timing-function-ease;
-
-  &--transparent {
-    &:hover {
-      background-color: $cdr-color-background-primary;
-    }
-  }
-
-  &:disabled,
-  &:disabled:hover,
-  &:disabled:focus {
-    cursor: not-allowed !important;
-  }
-
-  &:hover:not([aria-pressed='true'], [aria-checked='true'], :disabled) {
-    filter: brightness(95%);
-  }
-
-  &:focus,
-  &:active {
-    --cdr-border-width: var(--cdr-space-inset-quarter-x);
-  }
-
-  &[aria-pressed='true'],
-  &[aria-checked='true'] {
-    --cdr-border-width: var(--cdr-space-inset-eighth-x);
-    --cdr-border-color: var(--cdr-default-active-border-color);
-    cursor: default;
-  }
-
-  &[aria-pressed='true']:focus,
-  &[aria-checked='true']:focus {
-    --cdr-border-width: var(--cdr-space-inset-quarter-x);
-  }
-
-  &[aria-pressed='true']:active,
-  &[aria-checked='true']:active {
-    --cdr-border-width: var(--cdr-space-inset-quarter-x);
-  }
+@mixin cdr-palette-secondary-mixin() {
+  @include cdr-palette-base-mixin;
+  --cdr-palette-background-rest: var(--cdr-color-background-secondary);
+  --cdr-palette-background-hover: #e3e0d8;
+  --cdr-palette-background-active: #edeae3;
+  --cdr-palette-background-checked: var(--cdr-color-border-secondary);
+  --cdr-palette-background-disabled: #ffffff;
+  --cdr-palette-border-color-rest: #928b80;
+  --cdr-palette-border-color-hover: #928b80;
+  --cdr-palette-border-color-active: #4e4d49;
+  --cdr-palette-border-color-checked: #4e4d49;
+  --cdr-palette-border-color-disabled: var(--cdr-color-border-secondary);
+  --cdr-palette-text-color-rest: var(--cdr-color-text-primary);
+  --cdr-palette-text-color-disabled: var(--cdr-color-text-disabled);
 }
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index eb7cbbd72..3c9c03995 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -1,4 +1,5 @@
 import type {
+  Display,
   Tag,
   Space,
   Shadow,
@@ -7,7 +8,7 @@ import type {
   Elevation,
   Position,
   Palette,
-  Surface,
+  Background,
 } from './other';
 
 /**
@@ -141,28 +142,39 @@ export interface baseTextProps {
 }
 
 /**
- * HTMLAttributes data object for allowing any prop to get passed to child
- * @interface HTMLAttributes
+ * HtmlAttributes data object for allowing any HTML attribute
+ * @interface HtmlAttributes
  */
-export interface HTMLAttributes {
+export interface HtmlAttributes {
   [key: string]: any;
 }
 
 /**
- * AtomProps is used by all CdrBox based components
- * @interface AtomProps
+ * InlineCss data object for allowing any CSS attribute, including CSS variables
+ * @interface InlineCss
  */
-export interface AtomProps extends HTMLAttributes {
+export interface InlineCss {
+  [key: string]: any;
+}
+
+/**
+ * SurfaceProps contains the props used to create a surface
+ * @interface SurfaceProps
+ * @extends HtmlAttributes
+ */
+export interface SurfaceProps extends HtmlAttributes {
+  display?: Display;
+  background?: Background;
+  palette?: Palette;
   tag?: Tag;
   shadow?: Shadow;
   radius?: Radius;
-  surface?: Surface;
   withBorder?: boolean;
   borderWidth?: Space;
   borderColor?: BorderColor;
   elevation?: Elevation;
   position?: Position;
-  palette?: Palette;
+  fixed?: boolean;
   m?: Space;
   mx?: Space;
   my?: Space;
@@ -178,13 +190,3 @@ export interface AtomProps extends HTMLAttributes {
   pt?: Space;
   pb?: Space;
 }
-
-/**
- * SurfaceProps contains the props used to create a surface
- * @interface SurfaceProps
- * @extends AtomProps
- */
-export interface SurfaceProps extends AtomProps {
-  surface?: Surface;
-  palette?: Palette;
-}
diff --git a/src/types/other.ts b/src/types/other.ts
index 124b47849..0e7aa1da3 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -14,9 +14,16 @@ export type Space =
   | 'three-x'
   | 'four-x';
 export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
-export type Surface = 'transparent' | 'primary' | 'secondary' | 'brand-spruce';
+export type Background = 'transparent' | 'primary' | 'secondary' | 'brand-spruce';
 export type Radius = 'sharp' | 'soft' | 'softer' | 'round';
-export type BorderColor = 'transparent' | 'primary' | 'secondary' | 'success' | 'warning' | 'error';
+export type BorderColor =
+  | 'transparent'
+  | 'primary'
+  | 'secondary'
+  | 'success'
+  | 'warning'
+  | 'error'
+  | 'message-default-01';
 export type Elevation =
   | 'ground'
   | 'dropdown'
@@ -26,4 +33,5 @@ export type Elevation =
   | 'notification'
   | 'modal';
 export type Position = CSS.Properties['position'];
-export type Palette = 'primary' | 'secondary' | 'sale';
+export type Palette = 'primary' | 'secondary';
+export type Display = CSS.Properties['display'];
\ No newline at end of file

From 2b9f0fcfe06c10883e90d408ff04e5e9023f2559 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Fri, 31 May 2024 16:00:01 -0700
Subject: [PATCH 08/70] progress check

---
 .../fulfillmentTile/CdrFulfillmentTile.vue    | 46 ++++++++----
 .../examples/FulfillmentTile.vue              |  6 +-
 src/components/surface/CdrSurface.vue         |  2 +-
 src/components/surface/examples/Surface.vue   |  2 +-
 .../examples/SurfaceSelection.vue             | 74 ++++++++-----------
 .../text/presets/CdrUtilitySans.vue           |  2 +-
 6 files changed, 66 insertions(+), 66 deletions(-)

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 9c9b0f135..ff7f9b8e4 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -5,7 +5,7 @@ import mapClasses from '../../utils/mapClasses';
 import CdrSurfaceSelection from '../surfaceSelection/CdrSurfaceSelection.vue';
 import type { CdrSurfaceSelectionProps } from '../surfaceSelection/CdrSurfaceSelection.vue';
 import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
-import CdrUtilitySans from '../text/presets/CdrUtilitySans.vue';
+import CdrUtilitySans, { type utilitySansTextProps } from '../text/presets/CdrUtilitySans.vue';
 
 /** Tile component for displaying a button with optional icon at the top right */
 
@@ -38,47 +38,61 @@ const rootProps = computed(() => {
 const headerProps = computed(() => ({
   typeScale: props.typeScale,
   class: style[`${baseClass}__header`],
-}))
+}));
 
-const bodyProps = computed(() => ({
-  scale: "-1",
-  tag: "div",
+const bodyProps = computed<utilitySansTextProps>(() => ({
+  scale: '-1',
+  tag: 'div',
   class: {
     [style[`${baseClass}__content`]]: true,
     [style[`${baseClass}__content--body`]]: true,
   },
-}))
+}));
 
-const footerProps = computed(() => ({
-  scale: "-1",
-  tag: "div",
+const footerProps = computed<utilitySansTextProps>(() => ({
+  scale: '-1',
+  tag: 'div',
   class: {
     [style[`${baseClass}__content`]]: true,
     [style[`${baseClass}__content--footer`]]: true,
   },
-}))
+}));
 </script>
 
 <template>
   <CdrSurfaceSelection v-bind="rootProps">
-    <CdrFulfillmentTileHeader v-if="$slots.label" v-bind="headerProps">
-      <template v-if="$slots['icon-left']" #icon-left>
+    <CdrFulfillmentTileHeader
+      v-if="$slots.label"
+      v-bind="headerProps"
+    >
+      <template
+        v-if="$slots['icon-left']"
+        #icon-left
+      >
         <slot name="icon-left" />
       </template>
       <template #label>
         <slot name="label" />
       </template>
-      <template v-if="$slots['icon-right']" #icon-right>
+      <template
+        v-if="$slots['icon-right']"
+        #icon-right
+      >
         <slot name="icon-right" />
       </template>
     </CdrFulfillmentTileHeader>
-    <CdrUtilitySans v-if="$slots.body" v-bind="bodyProps">
+    <CdrUtilitySans
+      v-if="$slots.body"
+      v-bind="bodyProps"
+    >
       <slot name="body" />
     </CdrUtilitySans>
-    <CdrUtilitySans v-if="$slots.footer" v-bind="footerProps">
+    <CdrUtilitySans
+      v-if="$slots.footer"
+      v-bind="footerProps"
+    >
       <slot name="footer" />
     </CdrUtilitySans>
-
   </CdrSurfaceSelection>
 </template>
 
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 33392b3a1..f7103b719 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -15,7 +15,7 @@ const recommendedValue2 = ref([1]);
 const otherValue1 = ref(1);
 const otherValue2 = ref([1]);
 
-const toggleCheckbox = (value) => {
+const toggleCheckbox = (value: number) => {
   if (recommendedValue2.value.includes(value)) {
     recommendedValue2.value = recommendedValue2.value.filter((v) => v !== value);
   } else {
@@ -23,7 +23,7 @@ const toggleCheckbox = (value) => {
   }
 };
 
-const toggleCheckbox2 = (value) => {
+const toggleCheckbox2 = (value: number) => {
   if (otherValue2.value.includes(value)) {
     otherValue2.value = otherValue2.value.filter((v) => v !== value);
   } else {
@@ -144,8 +144,6 @@ const toggleCheckbox2 = (value) => {
       </CdrFulfillmentTile>
     </div>
     <br />
-    <!--  type-scale="-1"
-         @click="toggleCheckbox2(1)" -->
     <div class="example__tile-row example__tile-row--vertical">
       <CdrSurface class="example__tile example__tile--search example__tile--search-other"
         :border-width="otherValue2.includes(1) ? 'eighth-x' : 'sixteenth-x'" :with-border="true">
diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index 93c4f85fe..bd8c46422 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -23,7 +23,7 @@ const elevationClass = `${baseClass}--elevation`;
 const paletteClass = `${baseClass}--palette`;
 
 // Map of margins and padding
-const marginsAndPaddingMap = {
+const marginsAndPaddingMap: Record<string, string> = {
   m: 'margin',
   mx: 'marginInline',
   my: 'marginBlock',
diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index ed7a06a86..648a02126 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -66,7 +66,7 @@ const boxes: Example[] = [
 <template>
   <div class="example">
     <h2>Surface</h2>
-    <template v-for="({ label, props }, index) in boxes" :key="index">
+    <template v-for="({ label, props }) in boxes" :key="label">
       <hr class="example__hr" />
       <CdrSurface v-bind="props">
         {{ label }}
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index 633340265..3ac90a78c 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -1,30 +1,10 @@
 <script setup lang="ts">
 import { ref } from 'vue';
-import CdrSurfaceSelection, { type CdrSurfaceSelectionProps } from '../CdrSurfaceSelection.vue';
+import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
 import CdrSurface from '../../surface/CdrSurface.vue';
-import CdrText from '../../text/CdrText.vue';
 
 defineOptions({ name: 'SurfaceSelection' });
 
-
-
-// const boxes: Example[] = [
-//   {
-//     props: { 'data-id': 'test' },
-//   },
-//   {
-//     props: ,
-//   },
-//   {
-//     props: {
-//       palette: 'secondary',
-//       p: 'one-x',
-//       borderWidth: 'eighth-x',
-//       withBorder: true,
-//     },
-//   },
-// ];
-
 const chips = {
   count: 4,
   props: {
@@ -51,48 +31,56 @@ const toggle = {
 };
 
 const toggleValue = ref(0);
-
-const card = {
-  props: {
-    class: 'example__card',
-    shadow: 'elevated',
-    radius: 'softer',
-    tag: 'a',
-    href: 'https://rei.com/',
-    palette: 'secondary',
-  },
-};
 </script>
 
 <template>
   <div class="example">
     <h2>SurfaceSelection</h2>
     <hr class="example__hr" />
-    <CdrSurfaceSelection>
-      This is a blank SurfaceSelection
-    </CdrSurfaceSelection>
+    <CdrSurfaceSelection>This is a blank SurfaceSelection</CdrSurfaceSelection>
     <hr class="example__hr" />
-    <CdrSurfaceSelection v-bind="{ p: 'one-x', palette: 'primary', withBorder: true, borderWidth: 'sixteenth-x' }">
+    <CdrSurfaceSelection
+      v-bind="{ p: 'one-x', palette: 'primary', withBorder: true, borderWidth: 'sixteenth-x' }"
+    >
       This surface uses the primary palette to apply a background and border color
     </CdrSurfaceSelection>
     <hr class="example__hr" />
-    <CdrSurfaceSelection v-bind="{ p: 'one-x', palette: 'secondary', withBorder: true, borderWidth: 'sixteenth-x' }">
+    <CdrSurfaceSelection
+      v-bind="{ p: 'one-x', palette: 'secondary', withBorder: true, borderWidth: 'sixteenth-x' }"
+    >
       This surface uses the secondary palette to apply a background and border color
     </CdrSurfaceSelection>
     <hr class="example__hr" />
     <h3 class="example__h3">Chips</h3>
     <div class="example__chips">
-      <CdrSurfaceSelection v-for="(x, index) in new Array(chips.count)" :key="index" v-bind="chips.props"
-        :checked="index === chipsValue" :disabled="index === 2" @click="chipsValue = index">
+      <CdrSurfaceSelection
+        v-for="index in chips.count"
+        :key="index"
+        v-bind="chips.props"
+        :checked="index === chipsValue"
+        :disabled="index === 2"
+        @click="chipsValue = index"
+      >
         Chip {{ index + 1 }}
       </CdrSurfaceSelection>
     </div>
     <hr class="example__hr" />
     <h3 class="example__h3">Toggle</h3>
-    <CdrSurface class="example__toggle" :with-border="true" border-width="sixteenth-x" p="quarter-x" radius="softer"
-      palette="secondary">
-      <CdrSurfaceSelection v-for="(x, index) in new Array(toggle.count)" :key="index" v-bind="toggle.props"
-        :checked="index === toggleValue" @click="toggleValue = index">
+    <CdrSurface
+      class="example__toggle"
+      :with-border="true"
+      border-width="sixteenth-x"
+      p="quarter-x"
+      radius="softer"
+      palette="secondary"
+    >
+      <CdrSurfaceSelection
+        v-for="index in toggle.count"
+        :key="index"
+        v-bind="toggle.props"
+        :checked="index === toggleValue"
+        @click="toggleValue = index"
+      >
         Toggle {{ index + 1 }}
       </CdrSurfaceSelection>
     </CdrSurface>
diff --git a/src/components/text/presets/CdrUtilitySans.vue b/src/components/text/presets/CdrUtilitySans.vue
index b812fe8cb..5c5b3eb75 100644
--- a/src/components/text/presets/CdrUtilitySans.vue
+++ b/src/components/text/presets/CdrUtilitySans.vue
@@ -6,7 +6,7 @@ defineOptions({
   name: 'CdrUtilitySans',
 });
 
-interface utilitySansTextProps extends baseTextProps {
+export interface utilitySansTextProps extends baseTextProps {
    /** 
    * Sets the type scale
    * @type scaleValue

From ca1aa2a03b9beadf67280fcc320e5d74d07b727c Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Fri, 31 May 2024 16:39:44 -0700
Subject: [PATCH 09/70] progress check

---
 src/components/surface/CdrSurface.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index bd8c46422..57109f3ac 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -7,7 +7,7 @@ import type { SurfaceProps, InlineCss } from '../../types/interfaces';
 
 defineOptions({ name: 'CdrSurface' });
 
-export interface CdrSurfaceProps extends SurfaceProps {}
+export type CdrSurfaceProps = SurfaceProps;
 
 const props = withDefaults(defineProps<CdrSurfaceProps>(), {
   tag: 'div',

From 2cf92b0631f5dd6b0caebe907b21c0178bfeb6e0 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 3 Jun 2024 10:43:49 -0700
Subject: [PATCH 10/70] progress check

---
 package-lock.json                             | 222 ++++++------------
 package.json                                  |   2 +-
 .../fulfillmentTile/CdrFulfillmentTile.vue    |   7 +-
 src/components/surface/CdrSurface.vue         |   4 +-
 .../surfaceSelection/CdrSurfaceSelection.vue  |   9 +-
 src/types/interfaces.ts                       |  14 +-
 6 files changed, 90 insertions(+), 168 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 4fd5cdab0..747cf61d2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -63,7 +63,7 @@
         "vite": "^5.0.1",
         "vite-plugin-dts": "^3.3.1",
         "vitest": "^1.1.1",
-        "vue-docgen-cli": "^4.56.1",
+        "vue-docgen-cli": "^4.79.0",
         "vue-eslint-parser": "^9.3.0",
         "vue-router": "^4.0.10",
         "vue-tsc": "^1.6.5"
@@ -4596,19 +4596,6 @@
       "integrity": "sha512-BSHWgDSAiKs50o2Re8ppvp3seVHXSRM44cdSsT9FfNEUUZLOGWVCsiWaRPWM1Znn+mqZ1OfVZ3z3DWEzSp7hRA==",
       "dev": true
     },
-    "node_modules/assert": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/assert/-/assert-2.1.0.tgz",
-      "integrity": "sha512-eLHpSK/Y4nhMJ07gDaAzoX/XAKS8PSaojml3M0DM4JpV1LAi5JOJ/p6H/XWrl8L+DzVEvVCW1z3vWAaB9oTsQw==",
-      "dev": true,
-      "dependencies": {
-        "call-bind": "^1.0.2",
-        "is-nan": "^1.3.2",
-        "object-is": "^1.1.5",
-        "object.assign": "^4.1.4",
-        "util": "^0.12.5"
-      }
-    },
     "node_modules/assert-never": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/assert-never/-/assert-never-1.2.1.tgz",
@@ -6908,6 +6895,12 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/esm-resolve": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/esm-resolve/-/esm-resolve-1.0.11.tgz",
+      "integrity": "sha512-LxF0wfUQm3ldUDHkkV2MIbvvY0TgzIpJ420jHSV1Dm+IlplBEWiJTKWM61GtxUfvjV6iD4OtTYFGAGM2uuIUWg==",
+      "dev": true
+    },
     "node_modules/espree": {
       "version": "9.6.1",
       "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
@@ -8391,21 +8384,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/is-generator-function": {
-      "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.0.10.tgz",
-      "integrity": "sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==",
-      "dev": true,
-      "dependencies": {
-        "has-tostringtag": "^1.0.0"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/is-glob": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
@@ -8436,22 +8414,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/is-nan": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/is-nan/-/is-nan-1.3.2.tgz",
-      "integrity": "sha512-E+zBKpQ2t6MEo1VsonYmluk9NxGrbzpeeLC2xIViuO2EjU2xsXsBPwTr3Ykv9l08UYEVEdWeRZNouaZqF6RN0w==",
-      "dev": true,
-      "dependencies": {
-        "call-bind": "^1.0.0",
-        "define-properties": "^1.1.3"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/is-negative-zero": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.2.tgz",
@@ -11607,12 +11569,12 @@
       "dev": true
     },
     "node_modules/pug": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/pug/-/pug-3.0.2.tgz",
-      "integrity": "sha512-bp0I/hiK1D1vChHh6EfDxtndHji55XP/ZJKwsRqrz6lRia6ZC2OZbdAymlxdVFwd1L70ebrVJw4/eZ79skrIaw==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/pug/-/pug-3.0.3.tgz",
+      "integrity": "sha512-uBi6kmc9f3SZ3PXxqcHiUZLmIXgfgWooKWXcwSGwQd2Zi5Rb0bT14+8CJjJgI8AB+nndLaNgHGrcc6bPIB665g==",
       "dev": true,
       "dependencies": {
-        "pug-code-gen": "^3.0.2",
+        "pug-code-gen": "^3.0.3",
         "pug-filters": "^4.0.0",
         "pug-lexer": "^5.0.1",
         "pug-linker": "^4.0.0",
@@ -11634,25 +11596,25 @@
       }
     },
     "node_modules/pug-code-gen": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/pug-code-gen/-/pug-code-gen-3.0.2.tgz",
-      "integrity": "sha512-nJMhW16MbiGRiyR4miDTQMRWDgKplnHyeLvioEJYbk1RsPI3FuA3saEP8uwnTb2nTJEKBU90NFVWJBk4OU5qyg==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/pug-code-gen/-/pug-code-gen-3.0.3.tgz",
+      "integrity": "sha512-cYQg0JW0w32Ux+XTeZnBEeuWrAY7/HNE6TWnhiHGnnRYlCgyAUPoyh9KzCMa9WhcJlJ1AtQqpEYHc+vbCzA+Aw==",
       "dev": true,
       "dependencies": {
         "constantinople": "^4.0.1",
         "doctypes": "^1.1.0",
         "js-stringify": "^1.0.2",
         "pug-attrs": "^3.0.0",
-        "pug-error": "^2.0.0",
-        "pug-runtime": "^3.0.0",
+        "pug-error": "^2.1.0",
+        "pug-runtime": "^3.0.1",
         "void-elements": "^3.1.0",
         "with": "^7.0.0"
       }
     },
     "node_modules/pug-error": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/pug-error/-/pug-error-2.0.0.tgz",
-      "integrity": "sha512-sjiUsi9M4RAGHktC1drQfCr5C5eriu24Lfbt4s+7SykztEOwVZtbFk1RRq0tzLxcMxMYTBR+zMQaG07J/btayQ==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/pug-error/-/pug-error-2.1.0.tgz",
+      "integrity": "sha512-lv7sU9e5Jk8IeUheHata6/UThZ7RK2jnaaNztxfPYUY+VxZyk/ePVaNZ/vwmH8WqGvDz3LrNYt/+gA55NDg6Pg==",
       "dev": true
     },
     "node_modules/pug-filters": {
@@ -11873,15 +11835,15 @@
       }
     },
     "node_modules/recast": {
-      "version": "0.23.4",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.23.4.tgz",
-      "integrity": "sha512-qtEDqIZGVcSZCHniWwZWbRy79Dc6Wp3kT/UmDA2RJKBPg7+7k51aQBZirHmUGn5uvHf2rg8DkjizrN26k61ATw==",
+      "version": "0.23.9",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.23.9.tgz",
+      "integrity": "sha512-Hx/BGIbwj+Des3+xy5uAtAbdCyqK9y9wbBcDFDYanLS9JnMqf7OeF87HQwUimE87OEc72mr6tkKUKMBBL+hF9Q==",
       "dev": true,
       "dependencies": {
-        "assert": "^2.0.0",
         "ast-types": "^0.16.1",
         "esprima": "~4.0.0",
         "source-map": "~0.6.1",
+        "tiny-invariant": "^1.3.3",
         "tslib": "^2.0.1"
       },
       "engines": {
@@ -13309,6 +13271,12 @@
       "integrity": "sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==",
       "dev": true
     },
+    "node_modules/tiny-invariant": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
+      "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==",
+      "dev": true
+    },
     "node_modules/tinybench": {
       "version": "2.5.1",
       "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.5.1.tgz",
@@ -13780,19 +13748,6 @@
         "requires-port": "^1.0.0"
       }
     },
-    "node_modules/util": {
-      "version": "0.12.5",
-      "resolved": "https://registry.npmjs.org/util/-/util-0.12.5.tgz",
-      "integrity": "sha512-kZf/K6hEIrWHI6XqOFUiiMa+79wE/D8Q+NCNAWclkyg3b4d2k7s0QGepNjiABc+aR3N1PAyHL7p6UcLY6LmrnA==",
-      "dev": true,
-      "dependencies": {
-        "inherits": "^2.0.3",
-        "is-arguments": "^1.0.4",
-        "is-generator-function": "^1.0.7",
-        "is-typed-array": "^1.1.3",
-        "which-typed-array": "^1.1.2"
-      }
-    },
     "node_modules/util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -14062,9 +14017,9 @@
       "dev": true
     },
     "node_modules/vue-docgen-api": {
-      "version": "4.75.1",
-      "resolved": "https://registry.npmjs.org/vue-docgen-api/-/vue-docgen-api-4.75.1.tgz",
-      "integrity": "sha512-MECZ3uExz+ssmhD/2XrFoQQs93y17IVO1KDYTp8nr6i9GNrk67AAto6QAtilW1H/pTDPMkQxJ7w/25ZIqVtfAA==",
+      "version": "4.78.0",
+      "resolved": "https://registry.npmjs.org/vue-docgen-api/-/vue-docgen-api-4.78.0.tgz",
+      "integrity": "sha512-RsZf+qzTttCCAN9v7AKmBykc2QWmO8csVk1c2aXeOktomSOu0NA7sgK4ObuRB5lpmtOvTnwuxssyYmxXxABr+A==",
       "dev": true,
       "dependencies": {
         "@babel/parser": "^7.21.4",
@@ -14072,6 +14027,7 @@
         "@vue/compiler-dom": "^3.2.0",
         "@vue/compiler-sfc": "^3.2.0",
         "ast-types": "^0.16.1",
+        "esm-resolve": "^1.0.8",
         "hash-sum": "^2.0.0",
         "lru-cache": "^8.0.3",
         "pug": "^3.0.2",
@@ -14093,9 +14049,9 @@
       }
     },
     "node_modules/vue-docgen-cli": {
-      "version": "4.67.0",
-      "resolved": "https://registry.npmjs.org/vue-docgen-cli/-/vue-docgen-cli-4.67.0.tgz",
-      "integrity": "sha512-+61rC7H7zd5NWydAkKCuwW6TnStEJbgxsHk5i4Nb3S8eReuAge35SJ1gvEm6ILj3lUztJzKolpevAfL42OHySw==",
+      "version": "4.79.0",
+      "resolved": "https://registry.npmjs.org/vue-docgen-cli/-/vue-docgen-cli-4.79.0.tgz",
+      "integrity": "sha512-ye4/HAy1i/ULWpvLC+k7FGr7QiXyCPyduFoWAaXeMgmhxAu5H3jPSLQwf6MQwOWlMw4phRQnMlGfyHH1/NjsrQ==",
       "dev": true,
       "dependencies": {
         "cac": "^6.7.14",
@@ -14104,7 +14060,7 @@
         "lodash.memoize": "4.1.2",
         "loglevel": "^1.8.1",
         "prettier": "^2.8.4",
-        "vue-docgen-api": "^4.67.0"
+        "vue-docgen-api": "^4.78.0"
       },
       "bin": {
         "vue-docgen": "lib/bin.js"
@@ -17945,19 +17901,6 @@
       "integrity": "sha512-BSHWgDSAiKs50o2Re8ppvp3seVHXSRM44cdSsT9FfNEUUZLOGWVCsiWaRPWM1Znn+mqZ1OfVZ3z3DWEzSp7hRA==",
       "dev": true
     },
-    "assert": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/assert/-/assert-2.1.0.tgz",
-      "integrity": "sha512-eLHpSK/Y4nhMJ07gDaAzoX/XAKS8PSaojml3M0DM4JpV1LAi5JOJ/p6H/XWrl8L+DzVEvVCW1z3vWAaB9oTsQw==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "is-nan": "^1.3.2",
-        "object-is": "^1.1.5",
-        "object.assign": "^4.1.4",
-        "util": "^0.12.5"
-      }
-    },
     "assert-never": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/assert-never/-/assert-never-1.2.1.tgz",
@@ -19652,6 +19595,12 @@
       "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
       "dev": true
     },
+    "esm-resolve": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/esm-resolve/-/esm-resolve-1.0.11.tgz",
+      "integrity": "sha512-LxF0wfUQm3ldUDHkkV2MIbvvY0TgzIpJ420jHSV1Dm+IlplBEWiJTKWM61GtxUfvjV6iD4OtTYFGAGM2uuIUWg==",
+      "dev": true
+    },
     "espree": {
       "version": "9.6.1",
       "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
@@ -20745,15 +20694,6 @@
       "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
       "dev": true
     },
-    "is-generator-function": {
-      "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.0.10.tgz",
-      "integrity": "sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==",
-      "dev": true,
-      "requires": {
-        "has-tostringtag": "^1.0.0"
-      }
-    },
     "is-glob": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
@@ -20775,16 +20715,6 @@
       "integrity": "sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==",
       "dev": true
     },
-    "is-nan": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/is-nan/-/is-nan-1.3.2.tgz",
-      "integrity": "sha512-E+zBKpQ2t6MEo1VsonYmluk9NxGrbzpeeLC2xIViuO2EjU2xsXsBPwTr3Ykv9l08UYEVEdWeRZNouaZqF6RN0w==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.0",
-        "define-properties": "^1.1.3"
-      }
-    },
     "is-negative-zero": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.2.tgz",
@@ -23212,12 +23142,12 @@
       "dev": true
     },
     "pug": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/pug/-/pug-3.0.2.tgz",
-      "integrity": "sha512-bp0I/hiK1D1vChHh6EfDxtndHji55XP/ZJKwsRqrz6lRia6ZC2OZbdAymlxdVFwd1L70ebrVJw4/eZ79skrIaw==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/pug/-/pug-3.0.3.tgz",
+      "integrity": "sha512-uBi6kmc9f3SZ3PXxqcHiUZLmIXgfgWooKWXcwSGwQd2Zi5Rb0bT14+8CJjJgI8AB+nndLaNgHGrcc6bPIB665g==",
       "dev": true,
       "requires": {
-        "pug-code-gen": "^3.0.2",
+        "pug-code-gen": "^3.0.3",
         "pug-filters": "^4.0.0",
         "pug-lexer": "^5.0.1",
         "pug-linker": "^4.0.0",
@@ -23239,25 +23169,25 @@
       }
     },
     "pug-code-gen": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/pug-code-gen/-/pug-code-gen-3.0.2.tgz",
-      "integrity": "sha512-nJMhW16MbiGRiyR4miDTQMRWDgKplnHyeLvioEJYbk1RsPI3FuA3saEP8uwnTb2nTJEKBU90NFVWJBk4OU5qyg==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/pug-code-gen/-/pug-code-gen-3.0.3.tgz",
+      "integrity": "sha512-cYQg0JW0w32Ux+XTeZnBEeuWrAY7/HNE6TWnhiHGnnRYlCgyAUPoyh9KzCMa9WhcJlJ1AtQqpEYHc+vbCzA+Aw==",
       "dev": true,
       "requires": {
         "constantinople": "^4.0.1",
         "doctypes": "^1.1.0",
         "js-stringify": "^1.0.2",
         "pug-attrs": "^3.0.0",
-        "pug-error": "^2.0.0",
-        "pug-runtime": "^3.0.0",
+        "pug-error": "^2.1.0",
+        "pug-runtime": "^3.0.1",
         "void-elements": "^3.1.0",
         "with": "^7.0.0"
       }
     },
     "pug-error": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/pug-error/-/pug-error-2.0.0.tgz",
-      "integrity": "sha512-sjiUsi9M4RAGHktC1drQfCr5C5eriu24Lfbt4s+7SykztEOwVZtbFk1RRq0tzLxcMxMYTBR+zMQaG07J/btayQ==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/pug-error/-/pug-error-2.1.0.tgz",
+      "integrity": "sha512-lv7sU9e5Jk8IeUheHata6/UThZ7RK2jnaaNztxfPYUY+VxZyk/ePVaNZ/vwmH8WqGvDz3LrNYt/+gA55NDg6Pg==",
       "dev": true
     },
     "pug-filters": {
@@ -23450,15 +23380,15 @@
       }
     },
     "recast": {
-      "version": "0.23.4",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.23.4.tgz",
-      "integrity": "sha512-qtEDqIZGVcSZCHniWwZWbRy79Dc6Wp3kT/UmDA2RJKBPg7+7k51aQBZirHmUGn5uvHf2rg8DkjizrN26k61ATw==",
+      "version": "0.23.9",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.23.9.tgz",
+      "integrity": "sha512-Hx/BGIbwj+Des3+xy5uAtAbdCyqK9y9wbBcDFDYanLS9JnMqf7OeF87HQwUimE87OEc72mr6tkKUKMBBL+hF9Q==",
       "dev": true,
       "requires": {
-        "assert": "^2.0.0",
         "ast-types": "^0.16.1",
         "esprima": "~4.0.0",
         "source-map": "~0.6.1",
+        "tiny-invariant": "^1.3.3",
         "tslib": "^2.0.1"
       }
     },
@@ -24502,6 +24432,12 @@
       "integrity": "sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==",
       "dev": true
     },
+    "tiny-invariant": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
+      "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==",
+      "dev": true
+    },
     "tinybench": {
       "version": "2.5.1",
       "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.5.1.tgz",
@@ -24839,19 +24775,6 @@
         "requires-port": "^1.0.0"
       }
     },
-    "util": {
-      "version": "0.12.5",
-      "resolved": "https://registry.npmjs.org/util/-/util-0.12.5.tgz",
-      "integrity": "sha512-kZf/K6hEIrWHI6XqOFUiiMa+79wE/D8Q+NCNAWclkyg3b4d2k7s0QGepNjiABc+aR3N1PAyHL7p6UcLY6LmrnA==",
-      "dev": true,
-      "requires": {
-        "inherits": "^2.0.3",
-        "is-arguments": "^1.0.4",
-        "is-generator-function": "^1.0.7",
-        "is-typed-array": "^1.1.3",
-        "which-typed-array": "^1.1.2"
-      }
-    },
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -24999,9 +24922,9 @@
       "dev": true
     },
     "vue-docgen-api": {
-      "version": "4.75.1",
-      "resolved": "https://registry.npmjs.org/vue-docgen-api/-/vue-docgen-api-4.75.1.tgz",
-      "integrity": "sha512-MECZ3uExz+ssmhD/2XrFoQQs93y17IVO1KDYTp8nr6i9GNrk67AAto6QAtilW1H/pTDPMkQxJ7w/25ZIqVtfAA==",
+      "version": "4.78.0",
+      "resolved": "https://registry.npmjs.org/vue-docgen-api/-/vue-docgen-api-4.78.0.tgz",
+      "integrity": "sha512-RsZf+qzTttCCAN9v7AKmBykc2QWmO8csVk1c2aXeOktomSOu0NA7sgK4ObuRB5lpmtOvTnwuxssyYmxXxABr+A==",
       "dev": true,
       "requires": {
         "@babel/parser": "^7.21.4",
@@ -25009,6 +24932,7 @@
         "@vue/compiler-dom": "^3.2.0",
         "@vue/compiler-sfc": "^3.2.0",
         "ast-types": "^0.16.1",
+        "esm-resolve": "^1.0.8",
         "hash-sum": "^2.0.0",
         "lru-cache": "^8.0.3",
         "pug": "^3.0.2",
@@ -25026,9 +24950,9 @@
       }
     },
     "vue-docgen-cli": {
-      "version": "4.67.0",
-      "resolved": "https://registry.npmjs.org/vue-docgen-cli/-/vue-docgen-cli-4.67.0.tgz",
-      "integrity": "sha512-+61rC7H7zd5NWydAkKCuwW6TnStEJbgxsHk5i4Nb3S8eReuAge35SJ1gvEm6ILj3lUztJzKolpevAfL42OHySw==",
+      "version": "4.79.0",
+      "resolved": "https://registry.npmjs.org/vue-docgen-cli/-/vue-docgen-cli-4.79.0.tgz",
+      "integrity": "sha512-ye4/HAy1i/ULWpvLC+k7FGr7QiXyCPyduFoWAaXeMgmhxAu5H3jPSLQwf6MQwOWlMw4phRQnMlGfyHH1/NjsrQ==",
       "dev": true,
       "requires": {
         "cac": "^6.7.14",
@@ -25037,7 +24961,7 @@
         "lodash.memoize": "4.1.2",
         "loglevel": "^1.8.1",
         "prettier": "^2.8.4",
-        "vue-docgen-api": "^4.67.0"
+        "vue-docgen-api": "^4.78.0"
       },
       "dependencies": {
         "prettier": {
diff --git a/package.json b/package.json
index ba46879b1..d7ec01371 100644
--- a/package.json
+++ b/package.json
@@ -107,7 +107,7 @@
     "vite": "^5.0.1",
     "vite-plugin-dts": "^3.3.1",
     "vitest": "^1.1.1",
-    "vue-docgen-cli": "^4.56.1",
+    "vue-docgen-cli": "^4.79.0",
     "vue-eslint-parser": "^9.3.0",
     "vue-router": "^4.0.10",
     "vue-tsc": "^1.6.5"
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index ff7f9b8e4..d387364bb 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -3,19 +3,14 @@ import { useCssModule, computed } from 'vue';
 import type * as CSS from 'csstype';
 import mapClasses from '../../utils/mapClasses';
 import CdrSurfaceSelection from '../surfaceSelection/CdrSurfaceSelection.vue';
-import type { CdrSurfaceSelectionProps } from '../surfaceSelection/CdrSurfaceSelection.vue';
 import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
 import CdrUtilitySans, { type utilitySansTextProps } from '../text/presets/CdrUtilitySans.vue';
+import { CdrFulfillmentTileProps } from '../../types/interfaces'
 
 /** Tile component for displaying a button with optional icon at the top right */
 
 defineOptions({ name: 'CdrFulfillmentTile' });
 
-export interface CdrFulfillmentTileProps extends CdrSurfaceSelectionProps {
-  loading?: boolean;
-  typeScale?: '-1' | '0' | '1' | '2' | '3';
-}
-
 const props = withDefaults(defineProps<CdrFulfillmentTileProps>(), {
   typeScale: '0',
 });
diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index 57109f3ac..a56bfeed0 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -1,14 +1,12 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import type { SurfaceProps, InlineCss } from '../../types/interfaces';
+import type { CdrSurfaceProps, InlineCss } from '../../types/interfaces';
 
 /** Base component for all other components */
 
 defineOptions({ name: 'CdrSurface' });
 
-export type CdrSurfaceProps = SurfaceProps;
-
 const props = withDefaults(defineProps<CdrSurfaceProps>(), {
   tag: 'div',
 });
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 384a7d94c..eac0f4672 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -2,17 +2,12 @@
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
 import CdrSurface from '../surface/CdrSurface.vue';
-import type { CdrSurfaceProps } from '../surface/CdrSurface.vue';
+import { CdrSurfaceSelectionProps } from '../../types/interfaces'
 
-/** SurfaceSelection component for buttons that may have a checked state */
+/** Component for buttons that may have a checked state */
 
 defineOptions({ name: 'CdrSurfaceSelection' });
 
-export interface CdrSurfaceSelectionProps extends CdrSurfaceProps {
-  type?: 'button' | 'reset' | 'submit' | undefined;
-  checked?: boolean;
-}
-
 const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   tag: 'button',
   background: 'transparent',
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 3c9c03995..88e474dc4 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -159,10 +159,10 @@ export interface InlineCss {
 
 /**
  * SurfaceProps contains the props used to create a surface
- * @interface SurfaceProps
+ * @interface CdrSurfaceProps
  * @extends HtmlAttributes
  */
-export interface SurfaceProps extends HtmlAttributes {
+export interface CdrSurfaceProps extends HtmlAttributes {
   display?: Display;
   background?: Background;
   palette?: Palette;
@@ -190,3 +190,13 @@ export interface SurfaceProps extends HtmlAttributes {
   pt?: Space;
   pb?: Space;
 }
+
+export interface CdrSurfaceSelectionProps extends CdrSurfaceProps {
+  type?: 'button' | 'reset' | 'submit' | undefined;
+  checked?: boolean;
+}
+
+export interface CdrFulfillmentTileProps extends CdrSurfaceSelectionProps {
+  loading?: boolean;
+  typeScale?: '-1' | '0' | '1' | '2' | '3';
+}
\ No newline at end of file

From ec3f7aa15e09f156525f447dc517b3e81abbd995 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 3 Jun 2024 10:48:01 -0700
Subject: [PATCH 11/70] progress check

---
 src/components/surface/examples/Surface.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index 648a02126..c3ba2e498 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import CdrSurface, { type CdrSurfaceProps } from '../CdrSurface.vue';
+import CdrSurface from '../CdrSurface.vue';
+import type { CdrSurfaceProps } from '../../../types/interfaces';
 
 defineOptions({ name: 'Surface' });
 

From be884875f6a66dffc831f0008a3a897695d18b2c Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 4 Jun 2024 14:43:41 -0700
Subject: [PATCH 12/70] progress check

---
 package-lock.json                             | 688 +++++++++++++++++-
 package.json                                  |   3 +-
 .../fulfillmentTile/CdrFulfillmentTile.vue    |   7 +-
 .../CdrFulfillmentTileHeader.vue              |  12 +-
 .../examples/FulfillmentTile.vue              | 377 ++++++----
 .../CdrFulfillmentTileHeader.module.scss      |  17 +-
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  21 +-
 .../surfaceSelection/CdrSurfaceSelection.vue  |   8 +-
 .../examples/SurfaceSelection.vue             |   8 +-
 .../styles/vars/CdrSurfaceSelection.vars.scss |   1 -
 src/dev/SinkWrapper.vue                       |   2 +-
 src/types/interfaces.ts                       |   2 +-
 test/e2e/nightwatch.conf.js                   |   7 +-
 13 files changed, 968 insertions(+), 185 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 747cf61d2..4c4a8835e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -26,7 +26,7 @@
         "autoprefixer": "^10.2.5",
         "c8": "^7.11.0",
         "chalk": "^4.1.0",
-        "chromedriver": "^122",
+        "chromedriver": "^125",
         "concat": "^1.0.3",
         "cross-env": "^7.0.3",
         "csstype": "^3.1.3",
@@ -53,6 +53,7 @@
         "postcss-calc": "^8.0.0",
         "postcss-pxtorem": "^6.0.0",
         "postcss-scss": "^4.0.0",
+        "puppeteer": "^22.10.0",
         "sass": "^1.32.11",
         "sinon": "^11.1.0",
         "stylelint": "^16.1.0",
@@ -3022,6 +3023,119 @@
         "node": ">=14"
       }
     },
+    "node_modules/@puppeteer/browsers": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/@puppeteer/browsers/-/browsers-2.2.3.tgz",
+      "integrity": "sha512-bJ0UBsk0ESOs6RFcLXOt99a3yTDcOKlzfjad+rhFwdaG1Lu/Wzq58GHYCDTlZ9z6mldf4g+NTb+TXEfe0PpnsQ==",
+      "dev": true,
+      "dependencies": {
+        "debug": "4.3.4",
+        "extract-zip": "2.0.1",
+        "progress": "2.0.3",
+        "proxy-agent": "6.4.0",
+        "semver": "7.6.0",
+        "tar-fs": "3.0.5",
+        "unbzip2-stream": "1.4.3",
+        "yargs": "17.7.2"
+      },
+      "bin": {
+        "browsers": "lib/cjs/main-cli.js"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "dev": true,
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dev": true,
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/semver": {
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+      "dev": true,
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+      "dev": true
+    },
+    "node_modules/@puppeteer/browsers/node_modules/yargs": {
+      "version": "17.7.2",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
+      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+      "dev": true,
+      "dependencies": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.1.1"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "dev": true,
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/@rei/cdr-tokens": {
       "version": "12.1.0",
       "resolved": "https://registry.npmjs.org/@rei/cdr-tokens/-/cdr-tokens-12.1.0.tgz",
@@ -4722,6 +4836,12 @@
         "proxy-from-env": "^1.1.0"
       }
     },
+    "node_modules/b4a": {
+      "version": "1.6.6",
+      "resolved": "https://registry.npmjs.org/b4a/-/b4a-1.6.6.tgz",
+      "integrity": "sha512-5Tk1HLk6b6ctmjIkAcU/Ujv/1WqiDl0F0JdRCR80VsOcUlHcu7pWeWRlOqQLHfDEsVx9YH/aif5AG4ehoCtTmg==",
+      "dev": true
+    },
     "node_modules/babel-plugin-polyfill-corejs2": {
       "version": "0.4.6",
       "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.6.tgz",
@@ -4779,6 +4899,52 @@
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true
     },
+    "node_modules/bare-events": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.3.1.tgz",
+      "integrity": "sha512-sJnSOTVESURZ61XgEleqmP255T6zTYwHPwE4r6SssIh0U9/uDvfpdoJYpVUerJJZH2fueO+CdT8ZT+OC/7aZDA==",
+      "dev": true,
+      "optional": true
+    },
+    "node_modules/bare-fs": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-2.3.1.tgz",
+      "integrity": "sha512-W/Hfxc/6VehXlsgFtbB5B4xFcsCl+pAh30cYhoFyXErf6oGrwjh8SwiPAdHgpmWonKuYpZgGywN0SXt7dgsADA==",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "bare-events": "^2.0.0",
+        "bare-path": "^2.0.0",
+        "bare-stream": "^2.0.0"
+      }
+    },
+    "node_modules/bare-os": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-2.3.0.tgz",
+      "integrity": "sha512-oPb8oMM1xZbhRQBngTgpcQ5gXw6kjOaRsSWsIeNyRxGed2w/ARyP7ScBYpWR1qfX2E5rS3gBw6OWcSQo+s+kUg==",
+      "dev": true,
+      "optional": true
+    },
+    "node_modules/bare-path": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/bare-path/-/bare-path-2.1.3.tgz",
+      "integrity": "sha512-lh/eITfU8hrj9Ru5quUp0Io1kJWIk1bTjzo7JH1P5dWmQ2EL4hFUlfI8FonAhSlgIfhn63p84CDY/x+PisgcXA==",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "bare-os": "^2.1.0"
+      }
+    },
+    "node_modules/bare-stream": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/bare-stream/-/bare-stream-2.0.1.tgz",
+      "integrity": "sha512-ubLyoDqPnUf5o0kSFp709HC0WRZuxVuh4pbte5eY95Xvx5bdvz07c2JFmXBfqqe60q+9PJ8S4X5GRvmcNSKMxg==",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "streamx": "^2.18.0"
+      }
+    },
     "node_modules/base64-js": {
       "version": "1.5.1",
       "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
@@ -5226,9 +5392,9 @@
       }
     },
     "node_modules/chromedriver": {
-      "version": "122.0.4",
-      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-122.0.4.tgz",
-      "integrity": "sha512-MxkaWaxCqefHyh9UorGzl1F6ZNBgC7pqgT0piAysLZdw20ojSgJ62ljG8SFbhDJqBTegKbmuioa6MQ1m4Czdsg==",
+      "version": "125.0.3",
+      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-125.0.3.tgz",
+      "integrity": "sha512-Qzuk5Wian2o3EVGjtbz6V/jv+pT/AV9246HbG6kUljZXXjsKZLZxqJC+kHR3qEh/wdv4EJD0YwAOWV72v9hogw==",
       "dev": true,
       "hasInstallScript": true,
       "dependencies": {
@@ -5247,6 +5413,20 @@
         "node": ">=18"
       }
     },
+    "node_modules/chromium-bidi": {
+      "version": "0.5.19",
+      "resolved": "https://registry.npmjs.org/chromium-bidi/-/chromium-bidi-0.5.19.tgz",
+      "integrity": "sha512-UA6zL77b7RYCjJkZBsZ0wlvCTD+jTjllZ8f6wdO4buevXgTZYjV+XLB9CiEa2OuuTGGTLnI7eN9I60YxuALGQg==",
+      "dev": true,
+      "dependencies": {
+        "mitt": "3.0.1",
+        "urlpattern-polyfill": "10.0.0",
+        "zod": "3.22.4"
+      },
+      "peerDependencies": {
+        "devtools-protocol": "*"
+      }
+    },
     "node_modules/ci-info": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz",
@@ -7134,6 +7314,12 @@
       "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==",
       "dev": true
     },
+    "node_modules/fast-fifo": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/fast-fifo/-/fast-fifo-1.3.2.tgz",
+      "integrity": "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==",
+      "dev": true
+    },
     "node_modules/fast-glob": {
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
@@ -9755,6 +9941,12 @@
         "node": ">=16 || 14 >=14.17"
       }
     },
+    "node_modules/mitt": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
+      "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==",
+      "dev": true
+    },
     "node_modules/mlly": {
       "version": "1.4.2",
       "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.4.2.tgz",
@@ -11475,6 +11667,15 @@
       "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
       "dev": true
     },
+    "node_modules/progress": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
+      "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/promise": {
       "version": "7.3.1",
       "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
@@ -11711,6 +11912,100 @@
         "node": ">=6"
       }
     },
+    "node_modules/puppeteer": {
+      "version": "22.10.0",
+      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.10.0.tgz",
+      "integrity": "sha512-ZOkZd6a6t0BdKcWb0wAYHWQqCfdlN1PPnXOmg/XNrbo6gJhYWFX4qCNb6ahSn8TpAqBqLCoD4Q010F7GwOM7mA==",
+      "dev": true,
+      "hasInstallScript": true,
+      "dependencies": {
+        "@puppeteer/browsers": "2.2.3",
+        "cosmiconfig": "9.0.0",
+        "devtools-protocol": "0.0.1286932",
+        "puppeteer-core": "22.10.0"
+      },
+      "bin": {
+        "puppeteer": "lib/esm/puppeteer/node/cli.js"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/puppeteer-core": {
+      "version": "22.10.0",
+      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.10.0.tgz",
+      "integrity": "sha512-I54J4Vy4I07UHsgB1QSmuFoF7KNQjJWcvFBPhtY+ezMdBfwgGDr8dzYrJa11aPgP9kxIUHjhktcMmmfJkOAtTw==",
+      "dev": true,
+      "dependencies": {
+        "@puppeteer/browsers": "2.2.3",
+        "chromium-bidi": "0.5.19",
+        "debug": "4.3.4",
+        "devtools-protocol": "0.0.1286932",
+        "ws": "8.17.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/puppeteer-core/node_modules/devtools-protocol": {
+      "version": "0.0.1286932",
+      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1286932.tgz",
+      "integrity": "sha512-wu58HMQll9voDjR4NlPyoDEw1syfzaBNHymMMZ/QOXiHRNluOnDgu9hp1yHOKYoMlxCh4lSSiugLITe6Fvu1eA==",
+      "dev": true
+    },
+    "node_modules/puppeteer-core/node_modules/ws": {
+      "version": "8.17.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz",
+      "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==",
+      "dev": true,
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/puppeteer/node_modules/cosmiconfig": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
+      "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
+      "dev": true,
+      "dependencies": {
+        "env-paths": "^2.2.1",
+        "import-fresh": "^3.3.0",
+        "js-yaml": "^4.1.0",
+        "parse-json": "^5.2.0"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/d-fischer"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.9.5"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/puppeteer/node_modules/devtools-protocol": {
+      "version": "0.0.1286932",
+      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1286932.tgz",
+      "integrity": "sha512-wu58HMQll9voDjR4NlPyoDEw1syfzaBNHymMMZ/QOXiHRNluOnDgu9hp1yHOKYoMlxCh4lSSiugLITe6Fvu1eA==",
+      "dev": true
+    },
     "node_modules/querystringify": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
@@ -11737,6 +12032,12 @@
         }
       ]
     },
+    "node_modules/queue-tick": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/queue-tick/-/queue-tick-1.0.1.tgz",
+      "integrity": "sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag==",
+      "dev": true
+    },
     "node_modules/randombytes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@@ -12584,6 +12885,20 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/streamx": {
+      "version": "2.18.0",
+      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.18.0.tgz",
+      "integrity": "sha512-LLUC1TWdjVdn1weXGcSxyTR3T4+acB6tVGXT95y0nGbca4t4o/ng1wKAGTljm9VicuCVLvRlqFYXYy5GwgM7sQ==",
+      "dev": true,
+      "dependencies": {
+        "fast-fifo": "^1.3.2",
+        "queue-tick": "^1.0.1",
+        "text-decoder": "^1.1.0"
+      },
+      "optionalDependencies": {
+        "bare-events": "^2.2.0"
+      }
+    },
     "node_modules/string_decoder": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
@@ -13202,6 +13517,31 @@
         "node": ">=10.0.0"
       }
     },
+    "node_modules/tar-fs": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.5.tgz",
+      "integrity": "sha512-JOgGAmZyMgbqpLwct7ZV8VzkEB6pxXFBVErLtb+XCOqzc6w1xiWKI9GVd6bwk68EX7eJ4DWmfXVmq8K2ziZTGg==",
+      "dev": true,
+      "dependencies": {
+        "pump": "^3.0.0",
+        "tar-stream": "^3.1.5"
+      },
+      "optionalDependencies": {
+        "bare-fs": "^2.1.1",
+        "bare-path": "^2.1.0"
+      }
+    },
+    "node_modules/tar-fs/node_modules/tar-stream": {
+      "version": "3.1.7",
+      "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.7.tgz",
+      "integrity": "sha512-qJj60CXt7IU1Ffyc3NJMjh6EkuCFej46zUqJ4J7pqYlThyd9bO0XBTmcOIhSzZJVWfsLks0+nle/j538YAW9RQ==",
+      "dev": true,
+      "dependencies": {
+        "b4a": "^1.6.4",
+        "fast-fifo": "^1.2.0",
+        "streamx": "^2.15.0"
+      }
+    },
     "node_modules/tar-stream": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-2.2.0.tgz",
@@ -13259,6 +13599,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/text-decoder": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/text-decoder/-/text-decoder-1.1.0.tgz",
+      "integrity": "sha512-TmLJNj6UgX8xcUZo4UDStGQtDiTzF7BzWlzn9g7UWrjkpHr5uJTK1ld16wZ3LXb2vb6jH8qU89dW5whuMdXYdw==",
+      "dev": true,
+      "dependencies": {
+        "b4a": "^1.6.4"
+      }
+    },
     "node_modules/text-table": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
@@ -13635,6 +13984,16 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/unbzip2-stream": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/unbzip2-stream/-/unbzip2-stream-1.4.3.tgz",
+      "integrity": "sha512-mlExGW4w71ebDJviH16lQLtZS32VKqsSfk80GCfUlwT/4/hNRFsoscrF/c++9xinkMzECL1uL9DDwXqFWkruPg==",
+      "dev": true,
+      "dependencies": {
+        "buffer": "^5.2.1",
+        "through": "^2.3.8"
+      }
+    },
     "node_modules/undici-types": {
       "version": "5.26.5",
       "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
@@ -13748,6 +14107,12 @@
         "requires-port": "^1.0.0"
       }
     },
+    "node_modules/urlpattern-polyfill": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/urlpattern-polyfill/-/urlpattern-polyfill-10.0.0.tgz",
+      "integrity": "sha512-H/A06tKD7sS1O1X2SshBVeA5FLycRpjqiBeqGKmBwBDBy28EnRjORxTNe269KSSr5un5qyWi1iL61wLxpd+ZOg==",
+      "dev": true
+    },
     "node_modules/util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -14739,6 +15104,15 @@
       "engines": {
         "node": ">= 10"
       }
+    },
+    "node_modules/zod": {
+      "version": "3.22.4",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-3.22.4.tgz",
+      "integrity": "sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==",
+      "dev": true,
+      "funding": {
+        "url": "https://github.com/sponsors/colinhacks"
+      }
     }
   },
   "dependencies": {
@@ -16730,6 +17104,91 @@
       "dev": true,
       "optional": true
     },
+    "@puppeteer/browsers": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/@puppeteer/browsers/-/browsers-2.2.3.tgz",
+      "integrity": "sha512-bJ0UBsk0ESOs6RFcLXOt99a3yTDcOKlzfjad+rhFwdaG1Lu/Wzq58GHYCDTlZ9z6mldf4g+NTb+TXEfe0PpnsQ==",
+      "dev": true,
+      "requires": {
+        "debug": "4.3.4",
+        "extract-zip": "2.0.1",
+        "progress": "2.0.3",
+        "proxy-agent": "6.4.0",
+        "semver": "7.6.0",
+        "tar-fs": "3.0.5",
+        "unbzip2-stream": "1.4.3",
+        "yargs": "17.7.2"
+      },
+      "dependencies": {
+        "cliui": {
+          "version": "8.0.1",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+          "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+          "dev": true,
+          "requires": {
+            "string-width": "^4.2.0",
+            "strip-ansi": "^6.0.1",
+            "wrap-ansi": "^7.0.0"
+          }
+        },
+        "lru-cache": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+          "dev": true,
+          "requires": {
+            "yallist": "^4.0.0"
+          }
+        },
+        "semver": {
+          "version": "7.6.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+          "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+          "dev": true,
+          "requires": {
+            "lru-cache": "^6.0.0"
+          }
+        },
+        "wrap-ansi": {
+          "version": "7.0.0",
+          "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+          "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "^4.0.0",
+            "string-width": "^4.1.0",
+            "strip-ansi": "^6.0.0"
+          }
+        },
+        "yallist": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+          "dev": true
+        },
+        "yargs": {
+          "version": "17.7.2",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
+          "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+          "dev": true,
+          "requires": {
+            "cliui": "^8.0.1",
+            "escalade": "^3.1.1",
+            "get-caller-file": "^2.0.5",
+            "require-directory": "^2.1.1",
+            "string-width": "^4.2.3",
+            "y18n": "^5.0.5",
+            "yargs-parser": "^21.1.1"
+          }
+        },
+        "yargs-parser": {
+          "version": "21.1.1",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+          "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+          "dev": true
+        }
+      }
+    },
     "@rei/cdr-tokens": {
       "version": "12.1.0",
       "resolved": "https://registry.npmjs.org/@rei/cdr-tokens/-/cdr-tokens-12.1.0.tgz",
@@ -17983,6 +18442,12 @@
         "proxy-from-env": "^1.1.0"
       }
     },
+    "b4a": {
+      "version": "1.6.6",
+      "resolved": "https://registry.npmjs.org/b4a/-/b4a-1.6.6.tgz",
+      "integrity": "sha512-5Tk1HLk6b6ctmjIkAcU/Ujv/1WqiDl0F0JdRCR80VsOcUlHcu7pWeWRlOqQLHfDEsVx9YH/aif5AG4ehoCtTmg==",
+      "dev": true
+    },
     "babel-plugin-polyfill-corejs2": {
       "version": "0.4.6",
       "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.6.tgz",
@@ -18028,6 +18493,52 @@
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true
     },
+    "bare-events": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.3.1.tgz",
+      "integrity": "sha512-sJnSOTVESURZ61XgEleqmP255T6zTYwHPwE4r6SssIh0U9/uDvfpdoJYpVUerJJZH2fueO+CdT8ZT+OC/7aZDA==",
+      "dev": true,
+      "optional": true
+    },
+    "bare-fs": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-2.3.1.tgz",
+      "integrity": "sha512-W/Hfxc/6VehXlsgFtbB5B4xFcsCl+pAh30cYhoFyXErf6oGrwjh8SwiPAdHgpmWonKuYpZgGywN0SXt7dgsADA==",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "bare-events": "^2.0.0",
+        "bare-path": "^2.0.0",
+        "bare-stream": "^2.0.0"
+      }
+    },
+    "bare-os": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-2.3.0.tgz",
+      "integrity": "sha512-oPb8oMM1xZbhRQBngTgpcQ5gXw6kjOaRsSWsIeNyRxGed2w/ARyP7ScBYpWR1qfX2E5rS3gBw6OWcSQo+s+kUg==",
+      "dev": true,
+      "optional": true
+    },
+    "bare-path": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/bare-path/-/bare-path-2.1.3.tgz",
+      "integrity": "sha512-lh/eITfU8hrj9Ru5quUp0Io1kJWIk1bTjzo7JH1P5dWmQ2EL4hFUlfI8FonAhSlgIfhn63p84CDY/x+PisgcXA==",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "bare-os": "^2.1.0"
+      }
+    },
+    "bare-stream": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/bare-stream/-/bare-stream-2.0.1.tgz",
+      "integrity": "sha512-ubLyoDqPnUf5o0kSFp709HC0WRZuxVuh4pbte5eY95Xvx5bdvz07c2JFmXBfqqe60q+9PJ8S4X5GRvmcNSKMxg==",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "streamx": "^2.18.0"
+      }
+    },
     "base64-js": {
       "version": "1.5.1",
       "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
@@ -18330,9 +18841,9 @@
       }
     },
     "chromedriver": {
-      "version": "122.0.4",
-      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-122.0.4.tgz",
-      "integrity": "sha512-MxkaWaxCqefHyh9UorGzl1F6ZNBgC7pqgT0piAysLZdw20ojSgJ62ljG8SFbhDJqBTegKbmuioa6MQ1m4Czdsg==",
+      "version": "125.0.3",
+      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-125.0.3.tgz",
+      "integrity": "sha512-Qzuk5Wian2o3EVGjtbz6V/jv+pT/AV9246HbG6kUljZXXjsKZLZxqJC+kHR3qEh/wdv4EJD0YwAOWV72v9hogw==",
       "dev": true,
       "requires": {
         "@testim/chrome-version": "^1.1.4",
@@ -18344,6 +18855,17 @@
         "tcp-port-used": "^1.0.2"
       }
     },
+    "chromium-bidi": {
+      "version": "0.5.19",
+      "resolved": "https://registry.npmjs.org/chromium-bidi/-/chromium-bidi-0.5.19.tgz",
+      "integrity": "sha512-UA6zL77b7RYCjJkZBsZ0wlvCTD+jTjllZ8f6wdO4buevXgTZYjV+XLB9CiEa2OuuTGGTLnI7eN9I60YxuALGQg==",
+      "dev": true,
+      "requires": {
+        "mitt": "3.0.1",
+        "urlpattern-polyfill": "10.0.0",
+        "zod": "3.22.4"
+      }
+    },
     "ci-info": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz",
@@ -19765,6 +20287,12 @@
       "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==",
       "dev": true
     },
+    "fast-fifo": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/fast-fifo/-/fast-fifo-1.3.2.tgz",
+      "integrity": "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==",
+      "dev": true
+    },
     "fast-glob": {
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
@@ -21792,6 +22320,12 @@
       "integrity": "sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==",
       "dev": true
     },
+    "mitt": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
+      "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==",
+      "dev": true
+    },
     "mlly": {
       "version": "1.4.2",
       "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.4.2.tgz",
@@ -23061,6 +23595,12 @@
       "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
       "dev": true
     },
+    "progress": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
+      "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==",
+      "dev": true
+    },
     "promise": {
       "version": "7.3.1",
       "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
@@ -23281,6 +23821,66 @@
       "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
       "dev": true
     },
+    "puppeteer": {
+      "version": "22.10.0",
+      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.10.0.tgz",
+      "integrity": "sha512-ZOkZd6a6t0BdKcWb0wAYHWQqCfdlN1PPnXOmg/XNrbo6gJhYWFX4qCNb6ahSn8TpAqBqLCoD4Q010F7GwOM7mA==",
+      "dev": true,
+      "requires": {
+        "@puppeteer/browsers": "2.2.3",
+        "cosmiconfig": "9.0.0",
+        "devtools-protocol": "0.0.1286932",
+        "puppeteer-core": "22.10.0"
+      },
+      "dependencies": {
+        "cosmiconfig": {
+          "version": "9.0.0",
+          "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
+          "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
+          "dev": true,
+          "requires": {
+            "env-paths": "^2.2.1",
+            "import-fresh": "^3.3.0",
+            "js-yaml": "^4.1.0",
+            "parse-json": "^5.2.0"
+          }
+        },
+        "devtools-protocol": {
+          "version": "0.0.1286932",
+          "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1286932.tgz",
+          "integrity": "sha512-wu58HMQll9voDjR4NlPyoDEw1syfzaBNHymMMZ/QOXiHRNluOnDgu9hp1yHOKYoMlxCh4lSSiugLITe6Fvu1eA==",
+          "dev": true
+        }
+      }
+    },
+    "puppeteer-core": {
+      "version": "22.10.0",
+      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.10.0.tgz",
+      "integrity": "sha512-I54J4Vy4I07UHsgB1QSmuFoF7KNQjJWcvFBPhtY+ezMdBfwgGDr8dzYrJa11aPgP9kxIUHjhktcMmmfJkOAtTw==",
+      "dev": true,
+      "requires": {
+        "@puppeteer/browsers": "2.2.3",
+        "chromium-bidi": "0.5.19",
+        "debug": "4.3.4",
+        "devtools-protocol": "0.0.1286932",
+        "ws": "8.17.0"
+      },
+      "dependencies": {
+        "devtools-protocol": {
+          "version": "0.0.1286932",
+          "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1286932.tgz",
+          "integrity": "sha512-wu58HMQll9voDjR4NlPyoDEw1syfzaBNHymMMZ/QOXiHRNluOnDgu9hp1yHOKYoMlxCh4lSSiugLITe6Fvu1eA==",
+          "dev": true
+        },
+        "ws": {
+          "version": "8.17.0",
+          "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz",
+          "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==",
+          "dev": true,
+          "requires": {}
+        }
+      }
+    },
     "querystringify": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
@@ -23293,6 +23893,12 @@
       "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==",
       "dev": true
     },
+    "queue-tick": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/queue-tick/-/queue-tick-1.0.1.tgz",
+      "integrity": "sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag==",
+      "dev": true
+    },
     "randombytes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@@ -23936,6 +24542,18 @@
         "internal-slot": "^1.0.4"
       }
     },
+    "streamx": {
+      "version": "2.18.0",
+      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.18.0.tgz",
+      "integrity": "sha512-LLUC1TWdjVdn1weXGcSxyTR3T4+acB6tVGXT95y0nGbca4t4o/ng1wKAGTljm9VicuCVLvRlqFYXYy5GwgM7sQ==",
+      "dev": true,
+      "requires": {
+        "bare-events": "^2.2.0",
+        "fast-fifo": "^1.3.2",
+        "queue-tick": "^1.0.1",
+        "text-decoder": "^1.1.0"
+      }
+    },
     "string_decoder": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
@@ -24375,6 +24993,31 @@
         "strip-ansi": "^6.0.1"
       }
     },
+    "tar-fs": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.5.tgz",
+      "integrity": "sha512-JOgGAmZyMgbqpLwct7ZV8VzkEB6pxXFBVErLtb+XCOqzc6w1xiWKI9GVd6bwk68EX7eJ4DWmfXVmq8K2ziZTGg==",
+      "dev": true,
+      "requires": {
+        "bare-fs": "^2.1.1",
+        "bare-path": "^2.1.0",
+        "pump": "^3.0.0",
+        "tar-stream": "^3.1.5"
+      },
+      "dependencies": {
+        "tar-stream": {
+          "version": "3.1.7",
+          "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.7.tgz",
+          "integrity": "sha512-qJj60CXt7IU1Ffyc3NJMjh6EkuCFej46zUqJ4J7pqYlThyd9bO0XBTmcOIhSzZJVWfsLks0+nle/j538YAW9RQ==",
+          "dev": true,
+          "requires": {
+            "b4a": "^1.6.4",
+            "fast-fifo": "^1.2.0",
+            "streamx": "^2.15.0"
+          }
+        }
+      }
+    },
     "tar-stream": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-2.2.0.tgz",
@@ -24420,6 +25063,15 @@
         "minimatch": "^3.0.4"
       }
     },
+    "text-decoder": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/text-decoder/-/text-decoder-1.1.0.tgz",
+      "integrity": "sha512-TmLJNj6UgX8xcUZo4UDStGQtDiTzF7BzWlzn9g7UWrjkpHr5uJTK1ld16wZ3LXb2vb6jH8qU89dW5whuMdXYdw==",
+      "dev": true,
+      "requires": {
+        "b4a": "^1.6.4"
+      }
+    },
     "text-table": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
@@ -24700,6 +25352,16 @@
         "which-boxed-primitive": "^1.0.2"
       }
     },
+    "unbzip2-stream": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/unbzip2-stream/-/unbzip2-stream-1.4.3.tgz",
+      "integrity": "sha512-mlExGW4w71ebDJviH16lQLtZS32VKqsSfk80GCfUlwT/4/hNRFsoscrF/c++9xinkMzECL1uL9DDwXqFWkruPg==",
+      "dev": true,
+      "requires": {
+        "buffer": "^5.2.1",
+        "through": "^2.3.8"
+      }
+    },
     "undici-types": {
       "version": "5.26.5",
       "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
@@ -24775,6 +25437,12 @@
         "requires-port": "^1.0.0"
       }
     },
+    "urlpattern-polyfill": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/urlpattern-polyfill/-/urlpattern-polyfill-10.0.0.tgz",
+      "integrity": "sha512-H/A06tKD7sS1O1X2SshBVeA5FLycRpjqiBeqGKmBwBDBy28EnRjORxTNe269KSSr5un5qyWi1iL61wLxpd+ZOg==",
+      "dev": true
+    },
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -25458,6 +26126,12 @@
           }
         }
       }
+    },
+    "zod": {
+      "version": "3.22.4",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-3.22.4.tgz",
+      "integrity": "sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==",
+      "dev": true
     }
   }
 }
diff --git a/package.json b/package.json
index d7ec01371..fee8120f9 100644
--- a/package.json
+++ b/package.json
@@ -70,7 +70,7 @@
     "autoprefixer": "^10.2.5",
     "c8": "^7.11.0",
     "chalk": "^4.1.0",
-    "chromedriver": "^122",
+    "chromedriver": "^125",
     "concat": "^1.0.3",
     "cross-env": "^7.0.3",
     "csstype": "^3.1.3",
@@ -97,6 +97,7 @@
     "postcss-calc": "^8.0.0",
     "postcss-pxtorem": "^6.0.0",
     "postcss-scss": "^4.0.0",
+    "puppeteer": "^22.10.0",
     "sass": "^1.32.11",
     "sinon": "^11.1.0",
     "stylelint": "^16.1.0",
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index d387364bb..540878d56 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -5,15 +5,13 @@ import mapClasses from '../../utils/mapClasses';
 import CdrSurfaceSelection from '../surfaceSelection/CdrSurfaceSelection.vue';
 import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
 import CdrUtilitySans, { type utilitySansTextProps } from '../text/presets/CdrUtilitySans.vue';
-import { CdrFulfillmentTileProps } from '../../types/interfaces'
+import { CdrFulfillmentTileProps } from '../../types/interfaces';
 
 /** Tile component for displaying a button with optional icon at the top right */
 
 defineOptions({ name: 'CdrFulfillmentTile' });
 
-const props = withDefaults(defineProps<CdrFulfillmentTileProps>(), {
-  typeScale: '0',
-});
+const props = defineProps<CdrFulfillmentTileProps>();
 
 const style = useCssModule();
 const baseClass = 'cdr-fulfillment-tile';
@@ -31,7 +29,6 @@ const rootProps = computed(() => {
 });
 
 const headerProps = computed(() => ({
-  typeScale: props.typeScale,
   class: style[`${baseClass}__header`],
 }));
 
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
index c77b5b1a1..ebb97ba40 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -2,18 +2,10 @@
 import { useCssModule } from 'vue';
 import CdrUtilitySans from '../text/presets/CdrUtilitySans.vue';
 
-/** Tile header component */
+/** Fulfillment tile header component */
 
 defineOptions({ name: 'CdrFulfillmentTileHeader' });
 
-export interface CdrFulfillmentTileHeaderProps {
-  typeScale?: '-1' | '0' | '1' | '2' | '3';
-}
-
-withDefaults(defineProps<CdrFulfillmentTileHeaderProps>(), {
-  typeScale: '0',
-});
-
 const style = useCssModule();
 </script>
 
@@ -27,7 +19,7 @@ const style = useCssModule();
     </span>
     <CdrUtilitySans
       :strong="true"
-      :scale="typeScale"
+      scale="-1"
       tag="span"
       :class="style['cdr-fulfillment-tile-header__label']"
     >
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index f7103b719..fca763143 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -10,24 +10,24 @@ import CdrUtilitySans from '../../text/presets/CdrUtilitySans.vue';
 
 defineOptions({ name: 'FulfillmentTile' });
 
-const recommendedValue1 = ref(2);
-const recommendedValue2 = ref([1]);
-const otherValue1 = ref(1);
-const otherValue2 = ref([1]);
+const radio1 = ref(2);
+const checkbox1 = ref([1]);
+const radio2 = ref(1);
+const checkbox2 = ref([1]);
 
-const toggleCheckbox = (value: number) => {
-  if (recommendedValue2.value.includes(value)) {
-    recommendedValue2.value = recommendedValue2.value.filter((v) => v !== value);
+const toggleCheckbox1 = (value: number) => {
+  if (checkbox1.value.includes(value)) {
+    checkbox1.value = checkbox1.value.filter((v) => v !== value);
   } else {
-    recommendedValue2.value.push(value);
+    checkbox1.value.push(value);
   }
 };
 
 const toggleCheckbox2 = (value: number) => {
-  if (otherValue2.value.includes(value)) {
-    otherValue2.value = otherValue2.value.filter((v) => v !== value);
+  if (checkbox2.value.includes(value)) {
+    checkbox2.value = checkbox2.value.filter((v) => v !== value);
   } else {
-    otherValue2.value.push(value);
+    checkbox2.value.push(value);
   }
 };
 </script>
@@ -35,58 +35,108 @@ const toggleCheckbox2 = (value: number) => {
 <template>
   <div class="example">
     <h2>FulfillmentTile</h2>
-    <h3 class="action-tile-demo__h3">Recommended patterns</h3>
-    <div class="example__tile-row">
-      <CdrFulfillmentTile :disabled="true" class="example__tile example__tile--checkout example__tile--recommended">
+    <h3 class="example__h3">Recommended patterns</h3>
+    <div
+      id="radio1"
+      class="example__sr-only"
+    >
+      How would you like to receieve your order?
+    </div>
+    <div
+      class="example__row"
+      role="radiogroup"
+      aria-labelledby="radio1"
+    >
+      <CdrFulfillmentTile
+        class="example__checkout-tile"
+        :disabled="true"
+        tabindex="0"
+        role="radio"
+        :checked="false"
+      >
         <template #icon-right>
           <IconErrorFill inherit-color />
         </template>
         <template #label>Pick up</template>
         <template #body>Not offered</template>
       </CdrFulfillmentTile>
-      <CdrFulfillmentTile class="example__tile example__tile--checkout example__tile--recommended"
-        :checked="recommendedValue1 === 1" @click="recommendedValue1 = 1">
-        <template v-if="recommendedValue1 === 1" #icon-right>
+      <CdrFulfillmentTile
+        class="example__checkout-tile"
+        :checked="radio1 === 1"
+        tabindex="0"
+        role="radio"
+        @click="radio1 = 1"
+      >
+        <template
+          v-if="radio1 === 1"
+          #icon-right
+        >
           <IconCheckFill inherit-color />
         </template>
         <template #label>Ship to address</template>
-        <template #body>
-          Today after 2pm
-        </template>
+        <template #body>Today after 2pm</template>
         <template #footer>
           <strong>FREE</strong>
           - $60 minimum
         </template>
       </CdrFulfillmentTile>
-      <CdrFulfillmentTile class="example__tile example__tile--checkout example__tile--recommended"
-        :checked="recommendedValue1 === 2" @click="recommendedValue1 = 2">
-        <template v-if="recommendedValue1 === 2" #icon-right>
+      <CdrFulfillmentTile
+        class="example__checkout-tile"
+        :checked="radio1 === 2"
+        tabindex="0"
+        role="radio"
+        @click="radio1 = 2"
+      >
+        <template
+          v-if="radio1 === 2"
+          #icon-right
+        >
           <IconCheckFill inherit-color />
         </template>
-        <template #label>Ship to address</template>
-        <template #body>
-          Today after 2pm
-          <br />
-          at Encinitas
-        </template>
+        <template #label>Another option</template>
         <template #footer>
-          <strong>FREE</strong>
-          - $60 minimum
+          Footer
+          <strong>content</strong>
         </template>
       </CdrFulfillmentTile>
     </div>
     <br />
-    <div class="example__tile-row example__tile-row--vertical">
+    <div
+      id="checkbox1"
+      class="example__sr-only"
+    >
+      Would you like to filter the fulfillment method?
+    </div>
+    <div
+      class="example__column"
+      role="group"
+      aria-labelledby="checkbox1"
+    >
       <div>
-        <CdrFulfillmentTile class="example__tile example__tile--search example__tile--recommended"
-          :checked="recommendedValue2.includes(1)" type-scale="-1" role="checkbox" @click="toggleCheckbox(1)">
+        <CdrFulfillmentTile
+          class="example__search-tile"
+          :checked="checkbox1.includes(1)"
+          role="checkbox"
+          tabindex="0"
+          @click="toggleCheckbox1(1)"
+        >
           <template #icon-left>
-            <IconCheckFill v-if="recommendedValue2.includes(1)" inherit-color />
-            <svg v-else xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="example__icon">
+            <IconCheckFill
+              v-if="checkbox1.includes(1)"
+              inherit-color
+            />
+            <svg
+              v-else
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              class="example__icon"
+            >
               <g>
-                <path fill-rule="evenodd"
+                <path
+                  fill-rule="evenodd"
                   d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 11-16 0 8 8 0 0116 0z"
-                  clip-rule="evenodd"></path>
+                  clip-rule="evenodd"
+                ></path>
               </g>
             </svg>
           </template>
@@ -95,21 +145,38 @@ const toggleCheckbox2 = (value: number) => {
             In stock at
             <strong>Encinitas</strong>
           </template>
-
         </CdrFulfillmentTile>
-        <CdrButton class="example__change-store" modifier="link">
+        <CdrButton
+          class="example__change-store"
+          modifier="link"
+        >
           Change store
         </CdrButton>
       </div>
-      <CdrFulfillmentTile class="example__tile example__tile--search example__tile--recommended"
-        :checked="recommendedValue2.includes(2)" type-scale="-1" role="checkbox" @click="toggleCheckbox(2)">
+      <CdrFulfillmentTile
+        class="example__search-tile"
+        :checked="checkbox1.includes(2)"
+        role="checkbox"
+        tabindex="0"
+        @click="toggleCheckbox1(2)"
+      >
         <template #icon-left>
-          <IconCheckFill v-if="recommendedValue2.includes(2)" inherit-color />
-          <svg v-else xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="example__icon">
+          <IconCheckFill
+            v-if="checkbox1.includes(2)"
+            inherit-color
+          />
+          <svg
+            v-else
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox="0 0 24 24"
+            class="example__icon"
+          >
             <g>
-              <path fill-rule="evenodd"
+              <path
+                fill-rule="evenodd"
                 d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 11-16 0 8 8 0 0116 0z"
-                clip-rule="evenodd"></path>
+                clip-rule="evenodd"
+              ></path>
             </g>
           </svg>
         </template>
@@ -117,18 +184,42 @@ const toggleCheckbox2 = (value: number) => {
       </CdrFulfillmentTile>
     </div>
     <h3 class="action-tile-demo__h3">Other patterns</h3>
-    <div class="example__tile-row">
-      <CdrFulfillmentTile class="example__tile example__tile--checkout example__tile--checkout-other-disabled"
-        :checked="otherValue1 === 0" @click="otherValue1 = 0">
-        <template v-if="otherValue1 === 0" #icon-right>
+    <div
+      id="radio2"
+      class="example__sr-only"
+    >
+      How would you like to receieve your order?
+    </div>
+    <div
+      class="example__row"
+      role="radiogroup"
+      aria-labelledby="radio2"
+    >
+      <CdrFulfillmentTile
+        class="example__checkout-tile-other-disabled"
+        :checked="radio2 === 0"
+        role="radio"
+        @click="radio2 = 0"
+      >
+        <template
+          v-if="radio2 === 0"
+          #icon-right
+        >
           <IconXFill inherit-color />
         </template>
         <template #label>Pick up</template>
         <template #body>Not offered</template>
       </CdrFulfillmentTile>
-      <CdrFulfillmentTile class="example__tile example__tile--checkout example__tile--recommended"
-        :checked="otherValue1 === 1" @click="otherValue1 = 1">
-        <template v-if="otherValue1 === 1" #icon-right>
+      <CdrFulfillmentTile
+        class="example__checkout-tile"
+        :checked="radio2 === 1"
+        role="radio"
+        @click="radio2 = 1"
+      >
+        <template
+          v-if="radio2 === 1"
+          #icon-right
+        >
           <IconCheckFill inherit-color />
         </template>
         <template #label>Ship to address</template>
@@ -144,39 +235,70 @@ const toggleCheckbox2 = (value: number) => {
       </CdrFulfillmentTile>
     </div>
     <br />
-    <div class="example__tile-row example__tile-row--vertical">
-      <CdrSurface class="example__tile example__tile--search example__tile--search-other"
-        :border-width="otherValue2.includes(1) ? 'eighth-x' : 'sixteenth-x'" :with-border="true">
-        <CdrSurfaceSelection class="example__search-other-header-button" :checked="otherValue2.includes(1)"
-          role="checkbox" @click="toggleCheckbox2(1)">
-          <CdrFulfillmentTileHeader type-scale="-1">
+    <div
+      id="checkbox2"
+      class="example__sr-only"
+    >
+      Would you like to filter the fulfillment method?
+    </div>
+    <div
+      class="example__column"
+      role="group"
+      aria-labelledby="checkbox2"
+    >
+      <CdrSurface
+        class="example__search-tile-other"
+        :border-width="checkbox2.includes(1) ? 'eighth-x' : 'sixteenth-x'"
+        :with-border="true"
+      >
+        <CdrSurfaceSelection
+          class="example__search-tile-other-header-button"
+          :checked="checkbox2.includes(1)"
+          role="checkbox"
+          @click="toggleCheckbox2(1)"
+        >
+          <CdrFulfillmentTileHeader>
             <template #icon-left>
-              <IconCheckFill v-if="otherValue2.includes(1)" inherit-color />
-              <svg v-else xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="example__icon">
+              <IconCheckFill
+                v-if="checkbox2.includes(1)"
+                inherit-color
+              />
+              <svg
+                v-else
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 24 24"
+                class="example__icon"
+              >
                 <g>
-                  <path fill-rule="evenodd"
+                  <path
+                    fill-rule="evenodd"
                     d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 11-16 0 8 8 0 0116 0z"
-                    clip-rule="evenodd"></path>
+                    clip-rule="evenodd"
+                  ></path>
                 </g>
               </svg>
             </template>
             <template #label>Store Pickup (32)</template>
           </CdrFulfillmentTileHeader>
-          <CdrUtilitySans class="example__search-other-header-content" scale="-1" tag="div">
+          <CdrUtilitySans
+            class="example__search-tile-other-header-content"
+            scale="-1"
+            tag="div"
+          >
             In stock at
             <strong>Encinitas</strong>
           </CdrUtilitySans>
         </CdrSurfaceSelection>
-        <hr class="example__search-other-header-hr" />
-        <CdrButton class="example__change-store-other" :full-width="true" modifier="link">
+        <hr class="example__search-tile-other-header-hr" />
+        <CdrButton
+          class="example__change-store-other"
+          :full-width="true"
+          modifier="link"
+        >
           Change store
         </CdrButton>
       </CdrSurface>
     </div>
-    <br />
-    <br />
-    <br />
-    <br />
   </div>
 </template>
 
@@ -184,64 +306,45 @@ const toggleCheckbox2 = (value: number) => {
 @import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
 @import '../styles/vars/CdrFulfillmentTile.vars.scss';
 
+@mixin tile-colors() {
+  &[aria-pressed='true'],
+  &[aria-checked='true'] {
+    --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-message-success);
+  }
+
+  &:disabled,
+  &:disabled:hover,
+  &:disabled:focus {
+    --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+  }
+}
+
 .example {
   &__h3 {
     margin: $cdr-space-two-x 0 $cdr-space-one-x 0;
   }
 
-  &__tile-row {
-    display: flex;
-    gap: var(--cdr-space-scale-three-quarter-x);
-
-    &--vertical {
-      flex-direction: column;
-    }
+  &__sr-only {
+    @include cdr-display-sr-only;
   }
 
-  &__tile {
-    &--checkout {
-      width: 100%;
-      max-width: 230px;
-    }
-
-    &--search {
-      width: 100%;
-      max-width: 230px;
-    }
-
-    &--recommended {
-
-      &[aria-pressed='true'],
-      &[aria-checked='true'] {
-        --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-message-success);
-      }
-
-      &:disabled,
-      &:disabled:hover,
-      &:disabled:focus {
-        --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-      }
-    }
+  &__row {
+    display: grid;
+    gap: var(--cdr-space-scale-three-quarter-x);
+    grid-template-columns: 230px 230px 230px;
+  }
 
-    &--checkout-other-disabled {
-      --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-      --cdr-palette-background-rest: var(--cdr-color-background-button-default-disabled);
-      --cdr-palette-border-color: var(--cdr-color-border-primary);
+  &__checkout-tile {
+    @include tile-colors;
+  }
 
-      &[aria-pressed='true'],
-      &[aria-checked='true'] {
-        --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-        --cdr-palette-background-checked: var(--cdr-color-background-button-default-disabled);
-        --cdr-palette-border-color: var(--cdr-palette-border-color-checked);
-      }
-    }
+  &__column {
+    width: 100%;
+    max-width: 230px;
+  }
 
-    &--search-other {
-      @include cdr-fulfillment-tile-base-mixin;
-      gap: 0;
-      padding-top: 0;
-      padding-bottom: 0;
-    }
+  &__search-tile {
+    @include tile-colors;
   }
 
   &__icon {
@@ -256,38 +359,50 @@ const toggleCheckbox2 = (value: number) => {
   &__change-store {
     padding-left: 0;
     padding-right: 0;
+    margin-bottom: var(--cdr-space-scale-half-x);
   }
 
-  &__search-other-header-button {
-    --cdr-action-border-width-checked: 0;
-    padding: var(--cdr-space-scale-one-x) 0;
-    width: 100%;
+  &__checkout-tile-other-disabled {
+    --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+    --cdr-palette-background-rest: var(--cdr-color-background-button-default-disabled);
+    --cdr-palette-border-color: var(--cdr-color-border-primary);
 
     &[aria-pressed='true'],
     &[aria-checked='true'] {
-      --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-message-success);
-    }
-
-    &:disabled,
-    &:disabled:hover,
-    &:disabled:focus {
       --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+      --cdr-palette-background-checked: var(--cdr-color-background-button-default-disabled);
+      --cdr-palette-border-color: var(--cdr-palette-border-color-checked);
     }
   }
 
-  &__search-other-header-content {
+  &__search-tile-other {
+    @include cdr-fulfillment-tile-base-mixin;
+    gap: 0;
+    padding-top: 0;
+    padding-bottom: 0;
+  }
+
+  &__search-tile-other-header-button {
+    --cdr-action-border-width-checked: 0;
+    padding: var(--cdr-space-scale-one-x) 0;
+    width: 100%;
+    @include tile-colors;
+  }
+
+  &__search-tile-other-header-content {
     @include cdr-fulfillment-tile-content-mixin;
     margin-top: var(--cdr-space-scale-half-x);
   }
 
-  &__search-other-header-hr {
+  &__search-tile-other-header-hr {
     margin: 0;
     border-top: var(--cdr-space-scale-sixteenth-x) solid initial;
     width: 100%;
   }
 
   &__change-store-other {
-    padding: var(--cdr-space-scale-three-quarter-x) var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x);
+    padding: var(--cdr-space-scale-three-quarter-x) var(--cdr-space-scale-one-x)
+      var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x);
     justify-content: flex-start;
   }
 }
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
index 9475ddf7e..010a6a9a1 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
@@ -1,18 +1,5 @@
-@import '../../../styles/settings/index.scss';
+@import './vars/CdrFulfillmentTile.vars.scss';
 
 .cdr-fulfillment-tile-header {
-  display: flex;
-  align-items: center;
-  gap: var(--cdr-space-scale-three-quarter-x);
-  width: 100%;
-  padding: 0 var(--cdr-space-scale-one-x);
-
-  &__icon {
-    flex: 0 0 auto;
-    fill: var(--cdr-fulfillment-tile-icon-fill);
-  }
-
-  &__label {
-    flex: 1 1 auto;
-  }
+  @include cdr-fulfillment-tile-header-mixin;
 }
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index 51420023a..aa4cf42be 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -13,8 +13,7 @@
   --cdr-palette-text-color-disabled: var(--cdr-color-text-primary);
   display: flex;
   align-items: flex-start;
-  flex-direction: column;
-  display: flex;
+  justify-content: space-between;
   flex-direction: column;
   flex: 1 1 auto;
   width: 100%;
@@ -22,6 +21,24 @@
   padding: var(--cdr-space-scale-one-x) 0;
 }
 
+@mixin cdr-fulfillment-tile-header-mixin() {
+  display: flex;
+  align-items: center;
+  gap: var(--cdr-space-scale-three-quarter-x);
+  width: 100%;
+  height: $cdr-space-one-and-a-half-x;
+  padding: 0 var(--cdr-space-scale-one-x);
+
+  &__icon {
+    flex: 0 0 auto;
+    fill: var(--cdr-fulfillment-tile-icon-fill);
+  }
+
+  &__label {
+    flex: 1 1 auto;
+  }
+}
+
 @mixin cdr-fulfillment-tile-content-mixin() {
   padding: 0 var(--cdr-space-scale-one-x);
   width: 100%;
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index eac0f4672..1a8926f89 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -2,7 +2,7 @@
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
 import CdrSurface from '../surface/CdrSurface.vue';
-import { CdrSurfaceSelectionProps } from '../../types/interfaces'
+import { CdrSurfaceSelectionProps, HtmlAttributes } from '../../types/interfaces';
 
 /** Component for buttons that may have a checked state */
 
@@ -19,12 +19,10 @@ const baseClass = 'cdr-surface-selection';
 // Manages the props passed along to CdrSurface
 const computedProps = computed(() => {
   const { checked, ...otherProps } = props;
-  const additionalProps: CdrSurfaceSelectionProps = {};
+  const additionalProps: HtmlAttributes = {};
 
   // Add checked
-  if (checked) {
-    additionalProps['aria-checked'] = 'true';
-  }
+  additionalProps['aria-checked'] = checked;
 
   return {
     ...otherProps,
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index 3ac90a78c..2e3a54ebd 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -16,7 +16,7 @@ const chips = {
     palette: 'primary',
   },
 };
-const chipsValue = ref(0);
+const chipsValue = ref(1);
 
 const toggle = {
   count: 2,
@@ -30,7 +30,7 @@ const toggle = {
   },
 };
 
-const toggleValue = ref(0);
+const toggleValue = ref(1);
 </script>
 
 <template>
@@ -61,7 +61,7 @@ const toggleValue = ref(0);
         :disabled="index === 2"
         @click="chipsValue = index"
       >
-        Chip {{ index + 1 }}
+        Chip {{ index }}
       </CdrSurfaceSelection>
     </div>
     <hr class="example__hr" />
@@ -81,7 +81,7 @@ const toggleValue = ref(0);
         :checked="index === toggleValue"
         @click="toggleValue = index"
       >
-        Toggle {{ index + 1 }}
+        Toggle {{ index }}
       </CdrSurfaceSelection>
     </CdrSurface>
   </div>
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index bff221a29..56dd57764 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -11,7 +11,6 @@
   -webkit-tap-highlight-color: transparent;
   padding-block: 0;
   padding-inline: 0;
-
   transition:
     color var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
     fill var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
diff --git a/src/dev/SinkWrapper.vue b/src/dev/SinkWrapper.vue
index 7b8d8a9fa..b279e0b71 100644
--- a/src/dev/SinkWrapper.vue
+++ b/src/dev/SinkWrapper.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    Toggle palette color:
+    Toggle background palette color:
     <cdr-radio
       v-for="pal in palettes"
       :custom-value="pal"
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 88e474dc4..c61b83178 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -192,8 +192,8 @@ export interface CdrSurfaceProps extends HtmlAttributes {
 }
 
 export interface CdrSurfaceSelectionProps extends CdrSurfaceProps {
+  checked: boolean;
   type?: 'button' | 'reset' | 'submit' | undefined;
-  checked?: boolean;
 }
 
 export interface CdrFulfillmentTileProps extends CdrSurfaceSelectionProps {
diff --git a/test/e2e/nightwatch.conf.js b/test/e2e/nightwatch.conf.js
index 7f6521055..6dd480198 100644
--- a/test/e2e/nightwatch.conf.js
+++ b/test/e2e/nightwatch.conf.js
@@ -1,7 +1,7 @@
 //require('@babel/register');
 
 // http://nightwatchjs.org/getingstarted#settings-file
-
+const puppeteer = require('puppeteer');
 const vite = require('./vite.js');
 
 const startViteServer = function() {
@@ -33,7 +33,10 @@ module.exports = {
         },
       },
       desiredCapabilities: {
-        browserName : 'chrome'
+        browserName : 'chrome',
+        chromeOptions : {
+          binary: puppeteer.executablePath(),
+        }
       },
       webdriver: {
         start_process: true,

From 4750555c9933cf588d10f32ed2b836525dc4680e Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 18 Jun 2024 09:37:37 -0700
Subject: [PATCH 13/70] progress check

---
 .editorconfig                                 |  14 ++
 build/copy-css.js                             |  12 +
 index.html                                    |   3 -
 package.json                                  |  16 +-
 src/components/examples.js                    |   4 +-
 .../fulfillmentTile/CdrFulfillmentTile.vue    |   5 +-
 .../__tests__/CdrFulfillmentTile.spec.js      |  27 ++
 .../CdrFulfillmentTileHeader.spec.js          |  23 ++
 .../CdrFulfillmentTile.spec.js.snap           |  25 ++
 .../CdrFulfillmentTileHeader.spec.js.snap     |  43 ++++
 src/components/modal/examples/Modal.vue       |   1 -
 src/components/surface/CdrSurface.vue         |  98 +-------
 .../surface/__tests__/CdrSurface.spec.js      |  77 ++++++
 .../__snapshots__/CdrSurface.spec.js.snap     |  22 ++
 src/components/surface/examples/Surface.vue   |  19 +-
 .../surface/styles/CdrSurface.module.scss     |  38 +--
 .../surface/styles/vars/CdrSurface.vars.scss  |  56 +++++
 .../surfaceSelection/CdrSurfaceSelection.vue  |  19 +-
 .../examples/SurfaceSelection.vue             |  36 ++-
 .../styles/CdrSurfaceSelection.module.scss    |  18 +-
 .../styles/vars/CdrSurfaceSelection.vars.scss | 195 ++++++++++-----
 src/dev/DevPage.vue                           |   1 +
 src/dev/SinkWrapper.vue                       |  43 ++--
 src/dev/router.js                             |   2 +-
 src/lib.ts                                    |   6 +-
 .../styles/cdr-fonts.scss                     |   0
 .../styles/cdr-reset.scss                     |  52 ++--
 src/styles/main.scss                          |   3 +-
 src/styles/settings/index.scss                | 233 +++++++++++-------
 src/types/interfaces.ts                       |   6 +-
 src/types/other.ts                            |  10 +-
 src/utils/surface.ts                          |  82 ++++++
 test/e2e/specs/a11y.js                        |  16 +-
 33 files changed, 815 insertions(+), 390 deletions(-)
 create mode 100644 .editorconfig
 create mode 100644 build/copy-css.js
 create mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
 create mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
 create mode 100644 src/components/surface/__tests__/CdrSurface.spec.js
 create mode 100644 src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
 create mode 100644 src/components/surface/styles/vars/CdrSurface.vars.scss
 rename public/cdr-fonts.css => src/styles/cdr-fonts.scss (100%)
 rename public/cdr-reset.css => src/styles/cdr-reset.scss (56%)
 create mode 100644 src/utils/surface.ts

diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 000000000..257e03267
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,14 @@
+root = true
+
+[*.{js,css,scss}]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true
+max_line_length = 100
+
+[*.java]
+indent_style = space
+indent_size = 4
diff --git a/build/copy-css.js b/build/copy-css.js
new file mode 100644
index 000000000..33183733b
--- /dev/null
+++ b/build/copy-css.js
@@ -0,0 +1,12 @@
+// Copy cdr-fonts and cdr-reset to root folder.
+// Cedar 15 expects these files to be in root.
+// For 16, it would be helpful to remove this and have all styles in /style.
+
+const path = require('path');
+const fs = require('fs-extra');
+
+const DIST = 'dist';
+
+['cdr-fonts.css', 'cdr-reset.css'].forEach(file => {
+  fs.copyFileSync(path.join(DIST, '/style', file), path.join(DIST, file));
+})
\ No newline at end of file
diff --git a/index.html b/index.html
index 9d4435d29..d5b22cb72 100644
--- a/index.html
+++ b/index.html
@@ -5,9 +5,6 @@
     <meta name="description" content="Welcome to the REI Digital Design System presentation framework. A home for modular components based on our evolving design patterns.">
     <meta name="author" content="REI">
     <meta name="viewport" content="width=device-width">
-    <link rel="stylesheet" href="cdr-fonts.css">
-    <link rel="stylesheet" href="cdr-reset.css">
-    <!-- <link rel="stylesheet" href="./dist/cedar-compiled.css"> -->
   </head>
   <body>
     <div id="main"></div>
diff --git a/package.json b/package.json
index fee8120f9..2c73fd1ec 100644
--- a/package.json
+++ b/package.json
@@ -34,8 +34,12 @@
     "prepare": "npm run build",
     "prepublishOnly": "npm-run-all lint build",
     "dev": "vite",
-    "build": "vue-tsc && vite build && npm run build:umd && npm run build:icons && npm run build:docgen",
+    "build": "vue-tsc && vite build && npm run build:umd && npm run build:icons && npm run build:docgen && npm run build:copycss",
+    "build:docgen": "node docgen.mjs",
+    "build:icons": "ts-node src/components/icon/build/generate.ts",
+    "build:copycss": "node build/copy-css.js",
     "build:umd": "vite build --config vite.umd.config.ts",
+    "build:variables": "node build/component-variables-transfer.js",
     "preview": "vite preview",
     "unit": "vitest run",
     "watch": "vitest",
@@ -43,17 +47,13 @@
     "e2e": "nightwatch --config test/e2e/nightwatch.conf.js",
     "test": "npm-run-all unit e2e",
     "clean": "rm -rf dist",
-    "lint": "npm-run-all lint:js lint:styles",
+    "lint": "npm-run-all lint:js lint:styles lint:types",
     "lint:js": "eslint src --ext .js,.vue,.ts,.mjs",
     "lint:styles": "stylelint src/**/*.scss",
+    "lint:types": "vue-tsc --noEmit",
     "prepush": "npm-run-all lint unit",
     "create": "node generator.js",
-    "prerelease": "npm-publish-prerelease",
-    "build:docgen": "node docgen.mjs",
-    "build:extractcss": "node build/extract-css.js",
-    "build:variables": "node build/component-variables-transfer.js",
-    "build:icons": "ts-node src/components/icon/build/generate.ts",
-    "type-check": "vue-tsc --noEmit"
+    "prerelease": "npm-publish-prerelease"
   },
   "devDependencies": {
     "@babel/preset-env": "^7.18.2",
diff --git a/src/components/examples.js b/src/components/examples.js
index 45cf2c1b4..d00e7c0d2 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -10,7 +10,7 @@ import chip from 'componentsdir/chip/examples/Chip.vue';
 import choreographer from 'componentsdir/choreographer/examples/Choreographer.vue';
 import container from 'componentsdir/container/examples/Container.vue';
 import formGroup from 'componentsdir/formGroup/examples/FormGroup.vue';
-import fulfillmentTile from 'componentsdir/fulfillmentTile/examples/FulfillmentTile.vue';
+// import fulfillmentTile from 'componentsdir/fulfillmentTile/examples/FulfillmentTile.vue';
 import grid from 'componentsdir/grid/examples/Grid.vue';
 import icon from 'componentsdir/icon/examples/Icons.vue';
 import images from 'componentsdir/image/examples/Images.vue';
@@ -53,7 +53,7 @@ export default {
   chip,
   choreographer,
   container,
-  fulfillmentTile,
+  // fulfillmentTile,
   formGroup,
   grid,
   icon,
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 540878d56..d006f5a1e 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -53,10 +53,7 @@ const footerProps = computed<utilitySansTextProps>(() => ({
 
 <template>
   <CdrSurfaceSelection v-bind="rootProps">
-    <CdrFulfillmentTileHeader
-      v-if="$slots.label"
-      v-bind="headerProps"
-    >
+    <CdrFulfillmentTileHeader v-bind="headerProps">
       <template
         v-if="$slots['icon-left']"
         #icon-left
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
new file mode 100644
index 000000000..adf49a8a7
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
@@ -0,0 +1,27 @@
+import { shallowMount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrFulfillmentTile from '../CdrFulfillmentTile.vue';
+
+describe('CdrFulfillmentTile', () => {
+  it('icon left configuration', () => {
+    const wrapper = shallowMount(CdrFulfillmentTile, {
+      slots: {
+        'icon-left': 'X',
+        label: 'Label slot',
+        body: 'Body slot',
+        footer: 'Footer slot',
+      }
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+  it('icon right configuration', () => {
+    const wrapper = shallowMount(CdrFulfillmentTile, {
+      slots: {
+        'icon-right': 'X',
+        label: 'Label slot',
+        body: 'Body slot',
+        footer: 'Footer slot',
+      }
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+});
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
new file mode 100644
index 000000000..21dbccff1
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
@@ -0,0 +1,23 @@
+import { shallowMount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrFulfillmentTileHeader from '../CdrFulfillmentTileHeader.vue';
+
+describe('CdrFulfillmentTileHeader', () => {
+  it('icon left configuration', () => {
+    const wrapper = shallowMount(CdrFulfillmentTileHeader, {
+      slots: {
+        'icon-left': 'X',
+        label: 'Label slot',
+      }
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+  it('icon right configuration', () => {
+    const wrapper = shallowMount(CdrFulfillmentTileHeader, {
+      slots: {
+        'icon-right': 'X',
+        label: 'Label slot',
+      }
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+});
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
new file mode 100644
index 000000000..0bea2911e
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -0,0 +1,25 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTile > icon left configuration 1`] = `
+<cdr-surface-selection-stub
+  background="transparent"
+  checked="false"
+  class="cdr-fulfillment-tile"
+  fixed="false"
+  loading="false"
+  tag="button"
+  withborder="false"
+/>
+`;
+
+exports[`CdrFulfillmentTile > icon right configuration 1`] = `
+<cdr-surface-selection-stub
+  background="transparent"
+  checked="false"
+  class="cdr-fulfillment-tile"
+  fixed="false"
+  loading="false"
+  tag="button"
+  withborder="false"
+/>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
new file mode 100644
index 000000000..77cc463ff
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
@@ -0,0 +1,43 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-header"
+>
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    
+    X
+    
+  </span>
+  <cdr-utility-sans-stub
+    class="cdr-fulfillment-tile-header__label"
+    scale="-1"
+    strong="true"
+    tag="span"
+  />
+  <!--v-if-->
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-header"
+>
+  <!--v-if-->
+  <cdr-utility-sans-stub
+    class="cdr-fulfillment-tile-header__label"
+    scale="-1"
+    strong="true"
+    tag="span"
+  />
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    
+    X
+    
+  </span>
+</div>
+`;
diff --git a/src/components/modal/examples/Modal.vue b/src/components/modal/examples/Modal.vue
index ce6440151..2dee9d59e 100644
--- a/src/components/modal/examples/Modal.vue
+++ b/src/components/modal/examples/Modal.vue
@@ -13,7 +13,6 @@
       role="dialog"
       data-ui="hamburger-modal"
       aria-labelledby="some-heading"
-      class="david-class"
     >
       <template #title>
         <cdr-text
diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index a56bfeed0..a78c2f716 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import type { CdrSurfaceProps, InlineCss } from '../../types/interfaces';
+import type { CdrSurfaceProps } from '../../types/interfaces';
+import { getSurfaceProps } from '../../utils/surface';
 
 /** Base component for all other components */
 
@@ -12,102 +13,9 @@ const props = withDefaults(defineProps<CdrSurfaceProps>(), {
 });
 
 const style = useCssModule();
-const baseClass = 'cdr-surface';
-const borderClass = `${baseClass}--border`;
-const radiusClass = `${baseClass}--radius`;
-const shadowClass = `${baseClass}--shadow`;
-const backgroundClass = `${baseClass}--background`;
-const elevationClass = `${baseClass}--elevation`;
-const paletteClass = `${baseClass}--palette`;
 
-// Map of margins and padding
-const marginsAndPaddingMap: Record<string, string> = {
-  m: 'margin',
-  mx: 'marginInline',
-  my: 'marginBlock',
-  ml: 'marginInlineStart',
-  mr: 'marginInlineEnd',
-  mt: 'marginTop',
-  mb: 'marginBottom',
-  p: 'padding',
-  px: 'paddingInline',
-  py: 'paddingBlock',
-  pl: 'paddingInlineStart',
-  pr: 'paddingInlineEnd',
-  pt: 'paddingTop',
-  pb: 'paddingBottom',
-};
-const marginAndPaddingKeys = Object.keys(marginsAndPaddingMap);
-
-// Manages the props passed along to CdrSurface
 const computedProps = computed(() => {
-  const classes = [];
-  const inlineStyles: InlineCss = {};
-
-  // Add display
-  if (props.display) {
-    inlineStyles['display'] = props.display;
-  }
-
-  // Add palette
-  if (props.palette) {
-    classes.push(`${paletteClass}-${props.palette}`);
-  }
-
-  // Add border
-  if (props.withBorder) {
-    if (props.borderWidth) {
-      inlineStyles['--cdr-border-width-default'] = `var(--cdr-space-inset-${props.borderWidth})`;
-    }
-
-    if (props.borderColor) {
-      inlineStyles['--cdr-border-color-default'] = `var(--cdr-color-border-${props.borderColor})`;
-    }
-
-    classes.push(borderClass);
-  }
-
-  // Add radius
-  if (props.radius) {
-    inlineStyles['--cdr-radius-default'] = `var(--cdr-radius-${props.radius})`;
-    classes.push(radiusClass);
-  }
-
-  // Add shadow
-  if (props.shadow) {
-    inlineStyles['--cdr-shadow-default'] = `var(--cdr-prominence-${props.shadow})`;
-    classes.push(shadowClass);
-  }
-
-  // Add background
-  if (props.background) {
-    inlineStyles['--cdr-background-default'] = `var(--cdr-color-background-${props.background})`;
-    classes.push(backgroundClass);
-  }
-
-  // Add elevation
-  if (props.elevation) {
-    if (props.elevation) {
-      inlineStyles['--cdr-elevation-default'] = `var(--cdr-elevation-${props.elevation})`;
-    }
-
-    if (props.position) {
-      inlineStyles['--cdr-position-default'] = props.position;
-    }
-
-    classes.push(elevationClass);
-  }
-
-  // Add margin and padding
-  if (marginAndPaddingKeys.find((key) => props[key])) {
-    marginAndPaddingKeys.forEach((key) => {
-      if (props[key]) {
-        const cssProperty = marginsAndPaddingMap[key];
-        inlineStyles[cssProperty] = `var(--cdr-space-${props.fixed ? '' : 'scale-'}${props[key]})`;
-      }
-    });
-  }
-
+  const { inlineStyles, classes } = getSurfaceProps(props, 'cdr-surface');
   return { style: inlineStyles, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
diff --git a/src/components/surface/__tests__/CdrSurface.spec.js b/src/components/surface/__tests__/CdrSurface.spec.js
new file mode 100644
index 000000000..a077a66cd
--- /dev/null
+++ b/src/components/surface/__tests__/CdrSurface.spec.js
@@ -0,0 +1,77 @@
+import { shallowMount, mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrSurface from '../CdrSurface.vue';
+import sinon from 'sinon'
+
+describe('CdrSurface', () => {
+  describe('snapshot test', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrSurface);
+    })
+    it('renders correctly', () => {
+      wrapper.setProps({
+        display: 'flex',
+        background: 'secondary',
+        palette: 'secondary',
+        radius: 'soft',
+        withBorder: true,
+        borderWidth: 'one-x',
+        position: 'absolute',
+        p: 'three-x',
+        m: 'one-x',
+      })
+      expect(wrapper.element).toMatchSnapshot()
+    });
+  })
+
+  describe('component unit tests', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = shallowMount(CdrSurface);
+    });
+
+    describe('default component with no configuration', () => {
+      it('renders correctly', () => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
+      it('sets the default tag prop correctly', () => {
+        expect(wrapper.element.tagName).toBe('DIV');
+      });
+      it('no class added', () => {
+        expect(wrapper.classes()).toEqual([]);
+      });
+    })
+
+    describe('when "tag" is set to "a"', () => {
+      beforeEach(() => {
+        wrapper.setProps({ tag: 'a' });
+      });
+      it('renders correctly', () => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
+      it('renders a link', () => {
+        expect(wrapper.element.tagName).toBe('A');
+      });
+    })
+
+    // describe('when "iconOnly" and "withBackground" is set to true', () => {
+    //   beforeEach(() => {
+    //     wrapper.setProps({
+    //       iconOnly: true,
+    //       withBackground: true,
+    //     });
+    //   });
+    //   it('renders correctly', () => {
+    //     expect(wrapper.element).toMatchSnapshot();
+    //   });
+    //   it('adds class for icon only', () => {
+    //     expect(wrapper.classes()).toContain('cdr-button--icon-only');
+    //   });
+
+    //   it('adds class for icon background', () => {
+    //     expect(wrapper.classes()).toContain('cdr-button--with-background');
+    //   });
+    // })
+
+  })
+});
\ No newline at end of file
diff --git a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
new file mode 100644
index 000000000..904441ada
--- /dev/null
+++ b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
@@ -0,0 +1,22 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
+<div>
+  
+  
+</div>
+`;
+
+exports[`CdrSurface > component unit tests > when "tag" is set to "a" > renders correctly 1`] = `
+<a>
+  
+  
+</a>
+`;
+
+exports[`CdrSurface > snapshot test > renders correctly 1`] = `
+<div>
+  
+  
+</div>
+`;
diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index c3ba2e498..2f90c797c 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -19,9 +19,9 @@ const boxes: Example[] = [
     props: {
       display: 'inline-block',
       radius: 'soft',
-      shadow: 'elevated',
       background: 'secondary',
-      p: 'three-x',
+      shadow: 'floating',
+      p: 'two-x',
     },
   },
   {
@@ -31,32 +31,31 @@ const boxes: Example[] = [
       radius: 'round',
       withBorder: true,
       borderWidth: 'sixteenth-x',
+      borderColor: 'primary',
       background: 'secondary',
-      elevation: 'modal',
-      position: 'relative',
       px: 'one-x',
       py: 'three-quarter-x',
       fixed: true,
     },
   },
   {
-    label: 'This surface uses the primary palette to apply a background and border color',
+    label: 'This surface uses the primary variant to apply a background and border color',
     props: {
-      palette: 'primary',
+      variant: 'primary',
       display: 'inline-block',
       radius: 'soft',
-      p: 'two-x',
+      p: 'one-x',
       withBorder: true,
       borderWidth: 'sixteenth-x',
     },
   },
   {
-    label: 'This surface uses the secondary palette to apply a background and border color',
+    label: 'This surface uses the secondary variant to apply a background and border color',
     props: {
-      palette: 'secondary',
+      variant: 'secondary',
       display: 'inline-block',
       radius: 'soft',
-      p: 'two-x',
+      p: 'one-x',
       withBorder: true,
       borderWidth: 'sixteenth-x',
     },
diff --git a/src/components/surface/styles/CdrSurface.module.scss b/src/components/surface/styles/CdrSurface.module.scss
index 0abcbfe13..66abb1357 100644
--- a/src/components/surface/styles/CdrSurface.module.scss
+++ b/src/components/surface/styles/CdrSurface.module.scss
@@ -1,29 +1,9 @@
-@import '../../../styles/settings/index.scss';
-
-.cdr-surface--radius {
-  @include cdr-radius-mixin;
-}
-
-.cdr-surface--shadow {
-  @include cdr-shadow-mixin;
-}
-
-.cdr-surface--border {
-  @include cdr-border-mixin;
-}
-
-.cdr-surface--background {
-  @include cdr-background-mixin;
-}
-
-.cdr-surface--elevation {
-  @include cdr-elevation-mixin;
-}
-
-.cdr-surface--palette-primary {
-  @include cdr-palette-primary-mixin;
-}
-
-.cdr-surface--palette-secondary {
-  @include cdr-palette-secondary-mixin;
-}
+@import '../../../styles/settings/index.scss';
+@import './vars/CdrSurface.vars.scss';
+
+$variants: 'primary', 'secondary';
+$component: 'surface';
+
+@include cdr-surface-base-mixin($component);
+
+@include cdr-surface-variants-mixin($component, $variants);
diff --git a/src/components/surface/styles/vars/CdrSurface.vars.scss b/src/components/surface/styles/vars/CdrSurface.vars.scss
new file mode 100644
index 000000000..2d6494308
--- /dev/null
+++ b/src/components/surface/styles/vars/CdrSurface.vars.scss
@@ -0,0 +1,56 @@
+@import '../../../../styles/settings/index.scss';
+
+$surface-background-colors: (
+  'primary': $cdr-color-background-surface-primary,
+  'secondary': $cdr-color-background-surface-secondary,
+);
+
+$surface-border-colors: (
+  'primary': $cdr-color-border-surface-primary,
+  'secondary': $cdr-color-border-surface-secondary,
+);
+
+@mixin cdr-surface-base-mixin($component) {
+  @each $key, $value in $surface-background-colors {
+    .cdr-#{$component}--background-#{$key} {
+      @include cdr-background-mixin($surface-background-colors, $component, $key);
+    }
+  }
+
+  @each $key, $value in $surface-border-colors {
+    .cdr-#{$component}--border-color-#{$key} {
+      @include cdr-border-color-mixin($surface-border-colors, $component, $key);
+    }
+  }
+
+  @each $key, $value in $border-widths {
+    .cdr-#{$component}--border-width-#{$key} {
+      @include cdr-border-width-mixin($component, $key);
+    }
+  }
+
+  @each $key, $value in $radii {
+    .cdr-#{$component}--radius-#{$key} {
+      @include cdr-radius-mixin($component, $key);
+    }
+  }
+
+  @each $key, $value in $shadows {
+    .cdr-#{$component}--shadow-#{$key} {
+      @include cdr-shadow-mixin($component, $key);
+    }
+  }
+
+  .cdr-#{$component}--border {
+    @include cdr-border-mixin($component);
+  }
+}
+
+@mixin cdr-surface-variants-mixin($component, $variants) {
+  @each $key in $variants {
+    .cdr-#{$component}--variant-#{$key} {
+      @include cdr-background-mixin($surface-background-colors, $component, $key);
+      @include cdr-border-color-mixin($surface-border-colors, $component, $key);
+    }
+  }
+}
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 1a8926f89..47f447583 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import CdrSurface from '../surface/CdrSurface.vue';
 import { CdrSurfaceSelectionProps, HtmlAttributes } from '../../types/interfaces';
+import { getSurfaceProps } from '../../utils/surface';
 
 /** Component for buttons that may have a checked state */
 
@@ -10,32 +10,35 @@ defineOptions({ name: 'CdrSurfaceSelection' });
 
 const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   tag: 'button',
-  background: 'transparent',
+  variant: 'primary',
 });
 
 const style = useCssModule();
-const baseClass = 'cdr-surface-selection';
 
 // Manages the props passed along to CdrSurface
 const computedProps = computed(() => {
-  const { checked, ...otherProps } = props;
+  const { checked } = props;
+  const { inlineStyles, classes } = getSurfaceProps(props, 'cdr-surface-selection');
   const additionalProps: HtmlAttributes = {};
 
   // Add checked
   additionalProps['aria-checked'] = checked;
 
   return {
-    ...otherProps,
     ...additionalProps,
-    class: mapClasses(style, baseClass),
+    style: inlineStyles,
+    class: mapClasses(style, ...classes) || undefined,
   };
 });
 </script>
 
 <template>
-  <CdrSurface v-bind="computedProps">
+  <component
+    :is="tag"
+    v-bind="computedProps"
+  >
     <slot />
-  </CdrSurface>
+  </component>
 </template>
 
 <style lang="scss" module src="./styles/CdrSurfaceSelection.module.scss"></style>
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index 2e3a54ebd..8cf76b326 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -13,7 +13,6 @@ const chips = {
     px: 'one-x',
     py: 'half-x',
     radius: 'round',
-    palette: 'primary',
   },
 };
 const chipsValue = ref(1);
@@ -23,7 +22,6 @@ const toggle = {
   props: {
     p: 'one-x',
     radius: 'softer',
-    palette: 'primary',
     borderWidth: 'zero',
     withBorder: true,
     class: 'example__toggle-button',
@@ -37,18 +35,32 @@ const toggleValue = ref(1);
   <div class="example">
     <h2>SurfaceSelection</h2>
     <hr class="example__hr" />
-    <CdrSurfaceSelection>This is a blank SurfaceSelection</CdrSurfaceSelection>
+    <CdrSurfaceSelection v-bind="{ checked: false }">
+      This is a blank SurfaceSelection which uses the primary (default) variant
+    </CdrSurfaceSelection>
     <hr class="example__hr" />
     <CdrSurfaceSelection
-      v-bind="{ p: 'one-x', palette: 'primary', withBorder: true, borderWidth: 'sixteenth-x' }"
+      v-bind="{
+        p: 'one-x',
+        variant: 'primary',
+        withBorder: true,
+        borderWidth: 'sixteenth-x',
+        checked: false,
+      }"
     >
-      This surface uses the primary palette to apply a background and border color
+      This surface uses the primary variant and has a border
     </CdrSurfaceSelection>
     <hr class="example__hr" />
     <CdrSurfaceSelection
-      v-bind="{ p: 'one-x', palette: 'secondary', withBorder: true, borderWidth: 'sixteenth-x' }"
+      v-bind="{
+        p: 'one-x',
+        variant: 'secondary',
+        withBorder: true,
+        borderWidth: 'sixteenth-x',
+        checked: false,
+      }"
     >
-      This surface uses the secondary palette to apply a background and border color
+      This surface uses the secondary variant and has a border
     </CdrSurfaceSelection>
     <hr class="example__hr" />
     <h3 class="example__h3">Chips</h3>
@@ -72,7 +84,7 @@ const toggleValue = ref(1);
       border-width="sixteenth-x"
       p="quarter-x"
       radius="softer"
-      palette="secondary"
+      variant="secondary"
     >
       <CdrSurfaceSelection
         v-for="index in toggle.count"
@@ -110,10 +122,10 @@ const toggleValue = ref(1);
   }
 
   &__toggle-button {
-    --cdr-palette-background-rest: var(--cdr-color-border-transparent);
-    --cdr-palette-background-hover: #e3e0d8;
-    --cdr-palette-background-active: var(--cdr-color-background-primary);
-    --cdr-palette-background-checked: var(--cdr-color-background-primary);
+    --cdr-surface-selection-primary-background-color: var(--cdr-color-border-transparent);
+    --cdr-surface-selection-primary-background-color-hover: #e3e0d8;
+    --cdr-surface-selection-primary-background-color-active: var(--cdr-color-background-primary);
+    --cdr-surface-selection-primary-background-color-checked: var(--cdr-color-background-primary);
   }
 }
 </style>
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
index 98441c72c..6b38466ab 100644
--- a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
@@ -1,5 +1,13 @@
-@import './vars/CdrSurfaceSelection.vars.scss';
-
-.cdr-surface-selection {
-  @include cdr-surface-selection-base-mixin;
-}
+@import './vars/CdrSurfaceSelection.vars.scss';
+@import '../../surface/styles/vars/CdrSurface.vars.scss';
+
+$variants: 'primary', 'secondary';
+$component: 'surface-selection';
+
+@include cdr-surface-base-mixin($component);
+
+.cdr-surface-selection {
+  @include cdr-surface-selection-base-mixin($component);
+}
+
+@include cdr-surface-selection-states-mixin($component, $variants);
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index 56dd57764..7a8266e79 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -1,60 +1,135 @@
-@import '../../../../styles/settings/index.scss';
-
-@mixin cdr-surface-selection-base-mixin() {
-  @include cdr-text-utility-sans-300;
-  border: none;
-  cursor: pointer;
-  appearance: none;
-  text-align: left;
-  text-decoration: none;
-  touch-action: manipulation;
-  -webkit-tap-highlight-color: transparent;
-  padding-block: 0;
-  padding-inline: 0;
-  transition:
-    color var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
-    fill var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
-    background-color var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
-    box-shadow var(--cdr-duration-1-x) var(--cdr-timing-function-ease);
-
-  &:disabled,
-  &:disabled:hover,
-  &:disabled:focus {
-    --cdr-palette-background: var(--cdr-palette-background-disabled);
-    --cdr-palette-border-color: var(--cdr-palette-border-color-disabled);
-    --cdr-palette-text-color: var(--cdr-palette-text-color-disabled);
-    cursor: not-allowed !important;
-  }
-
-  &:hover:not([aria-pressed='true'], [aria-checked='true'], :disabled) {
-    --cdr-palette-background: var(--cdr-palette-background-hover);
-    --cdr-palette-border-color: var(--cdr-palette-border-color-hover);
-  }
-
-  &:focus,
-  &:active,
-  &[aria-pressed='true']:focus,
-  &[aria-pressed='true']:active,
-  &[aria-checked='true']:focus,
-  &[aria-checked='true']:active {
-    @include cdr-border-mixin;
-    outline: none;
-    --cdr-border-width: var(--cdr-action-border-width-active);
-    --cdr-palette-background: var(--cdr-palette-background-active);
-    --cdr-palette-border-color: var(--cdr-palette-border-color-active);
-  }
-
-  &[aria-pressed='true'],
-  &[aria-checked='true'] {
-    @include cdr-border-mixin;
-    --cdr-border-width: var(--cdr-action-border-width-checked);
-    --cdr-palette-background: var(--cdr-palette-background-checked);
-    --cdr-palette-border-color: var(--cdr-palette-border-color-checked);
-    @include cdr-text-utility-sans-strong-300;
-  }
-
-  &[aria-pressed='true']:not([role='checkbox']),
-  &[aria-checked='true']:not([role='checkbox']) {
-    cursor: default;
-  }
-}
+@import '../../../../styles/settings/index.scss';
+
+@mixin cdr-surface-selection-disabled-mixin() {
+  &:disabled,
+  &:disabled:hover,
+  &:disabled:focus {
+    @content;
+  }
+}
+
+@mixin cdr-surface-selection-hover-mixin() {
+  &:hover:not([aria-pressed='true'], [aria-checked='true'], :disabled) {
+    @content;
+  }
+}
+
+@mixin cdr-surface-selection-active-mixin() {
+  &:focus,
+  &:active,
+  &[aria-pressed='true']:focus,
+  &[aria-pressed='true']:active,
+  &[aria-checked='true']:focus,
+  &[aria-checked='true']:active {
+    @content;
+  }
+}
+
+@mixin cdr-surface-selection-checked-mixin() {
+  &[aria-pressed='true'],
+  &[aria-checked='true'] {
+    @content;
+  }
+}
+
+@mixin cdr-surface-selection-base-mixin($component) {
+  @include cdr-text-utility-sans-300;
+  border: none;
+  cursor: pointer;
+  appearance: none;
+  text-align: left;
+  text-decoration: none;
+  touch-action: manipulation;
+  -webkit-tap-highlight-color: transparent;
+  padding-block: 0;
+  padding-inline: 0;
+  transition:
+    color var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
+    fill var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
+    background-color var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
+    box-shadow var(--cdr-duration-1-x) var(--cdr-timing-function-ease);
+
+  @include cdr-surface-selection-disabled-mixin() {
+    cursor: not-allowed !important;
+  }
+
+  @include cdr-surface-selection-active-mixin() {
+    @include cdr-border-mixin($component);
+    outline: none;
+    --cdr-#{$component}-border-width-default: var(--cdr-space-inset-quarter-x);
+  }
+
+  @include cdr-surface-selection-checked-mixin() {
+    @include cdr-text-utility-sans-strong-300;
+    @include cdr-border-mixin($component);
+    --cdr-#{$component}-border-width-default: var(--cdr-space-inset-eighth-x);
+  }
+
+  &[aria-pressed='true']:not([role='checkbox']),
+  &[aria-checked='true']:not([role='checkbox']) {
+    cursor: default;
+  }
+}
+
+$surface-selection-background-colors: (
+  'primary': (
+    'rest': $cdr-color-background-primary,
+    'hover': #f4f2ed,
+    'active': #edeae3,
+    'checked': #dcd6cb,
+    'disabled': #ffffff,
+  ),
+  'secondary': (
+    'rest': $cdr-color-background-secondary,
+    'hover': #e3e0d8,
+    'active': #edeae3,
+    'checked': $cdr-color-background-secondary,
+    'disabled': #ffffff,
+  ),
+);
+
+$surface-selection-border-colors: (
+  'primary': (
+    'rest': $cdr-color-border-primary,
+    'hover': $cdr-color-border-secondary,
+    'active': $cdr-color-border-button-dark-active,
+    'checked': $cdr-color-border-button-dark-active,
+    'disabled': $cdr-color-border-primary,
+  ),
+  'secondary': (
+    'rest': $cdr-color-border-secondary,
+    'hover': $cdr-color-border-secondary,
+    'active': $cdr-color-border-button-dark-active,
+    'checked': $cdr-color-border-button-dark-active,
+    'disabled': $cdr-color-border-secondary,
+  ),
+);
+
+@mixin cdr-surface-selection-states-mixin($component, $variants) {
+  @each $key in $variants {
+    .cdr-#{$component}--variant-#{$key} {
+      @include cdr-background-mixin($surface-selection-background-colors, $component, $key);
+      @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key);
+
+      @include cdr-surface-selection-hover-mixin() {
+        @include cdr-background-mixin($surface-selection-background-colors, $component, $key, 'hover');
+        @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key, 'hover');
+      }
+
+      @include cdr-surface-selection-active-mixin() {
+        @include cdr-background-mixin($surface-selection-background-colors, $component, $key, 'active');
+        @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key, 'active');
+      }
+
+      @include cdr-surface-selection-checked-mixin() {
+        @include cdr-background-mixin($surface-selection-background-colors, $component, $key, 'checked');
+        @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key, 'checked');
+      }
+
+      @include cdr-surface-selection-disabled-mixin() {
+        @include cdr-background-mixin($surface-selection-background-colors, $component, $key, 'disabled');
+        @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key, 'disabled');
+      }
+    }
+  }
+}
diff --git a/src/dev/DevPage.vue b/src/dev/DevPage.vue
index 35ad31b70..1a4d408f0 100644
--- a/src/dev/DevPage.vue
+++ b/src/dev/DevPage.vue
@@ -102,6 +102,7 @@ export default {
 @import "../styles/main.scss";
 @import "@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss";
 @import "@rei/cdr-tokens/dist/rei-dot-com/css/cdr-tokens.css";
+
 .stack {
   margin-top: $cdr-space-one-x;
 }
diff --git a/src/dev/SinkWrapper.vue b/src/dev/SinkWrapper.vue
index b279e0b71..a567f3662 100644
--- a/src/dev/SinkWrapper.vue
+++ b/src/dev/SinkWrapper.vue
@@ -1,17 +1,24 @@
 <template>
-  <div>
-    Toggle background palette color:
-    <cdr-radio
-      v-for="pal in palettes"
-      :custom-value="pal"
-      :key="pal"
-      name="palette"
-      v-model="palette"
-      class="palette-toggle"
+  <div :data-palette="palette">
+    <div class="radios">
+      <div>Toggle palette:</div>
+      <cdr-radio
+        v-for="pal in palettes"
+        :custom-value="pal"
+        :key="pal"
+        name="palette"
+        v-model="palette"
+      >
+        {{ capitalize(pal) }}
+      </cdr-radio>
+    </div>
+    <cdr-surface
+      background="primary"
+      p="two-x"
+      :with-border="true"
+      border-width="sixteenth-x"
+      border-color="primary"
     >
-      {{ capitalize(pal) }}
-    </cdr-radio>
-    <cdr-surface :palette="palette">
       <slot />
     </cdr-surface>
   </div>
@@ -29,8 +36,8 @@ export default {
   },
   data() {
     return {
-      palette: this.$route.query.palette || 'primary',
-      palettes: ['primary', 'secondary'],
+      palette: this.$route.query.palette || 'default',
+      palettes: ['default', 'sandstone'],
     };
   },
   watch: {
@@ -52,8 +59,10 @@ export default {
 </script>
 
 <style>
-.palette-toggle {
-  display: inline-block;
-  margin: 0 8px;
+.radios {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 8px;
 }
 </style>
diff --git a/src/dev/router.js b/src/dev/router.js
index d0f868fc6..af9cc2415 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -33,7 +33,7 @@ const routes = [
   { path: '/choreographer', name: 'Choreographer', component: Examples.choreographer },
   { path: '/containers', name: 'Container', component: Examples.container },
   { path: '/formGroups', name: 'Form Groups', component: Examples.formGroup },
-  { path: '/fulfillmentTile', name: 'FulfillmentTile', component: Examples.fulfillmentTile },
+  // { path: '/fulfillmentTile', name: 'FulfillmentTile', component: Examples.fulfillmentTile },
   { path: '/grid', name: 'Grid', component: Examples.grid },
   { path: '/icons', name: 'Icons', component: Examples.icon },
   { path: '/images', name: 'Images', component: Examples.images },
diff --git a/src/lib.ts b/src/lib.ts
index 30f920ee6..3e059d0d9 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -13,7 +13,7 @@ export { default as CdrChipGroup } from './components/chip/CdrChipGroup.vue';
 export { default as CdrChoreographer } from './components/choreographer/CdrChoreographer.vue';
 export { default as CdrContainer } from './components/container/CdrContainer.vue';
 export { default as CdrFormGroup } from './components/formGroup/CdrFormGroup.vue';
-export { default as CdrFulfillmentTile } from './components/fulfillmentTile/CdrFulfillmentTile.vue';
+// export { default as CdrFulfillmentTile } from './components/fulfillmentTile/CdrFulfillmentTile.vue';
 export { default as CdrGrid } from './components/grid/CdrGrid.vue';
 export { default as CdrIcon } from './components/icon/CdrIcon.vue';
 export { default as CdrImg } from './components/image/CdrImg.vue';
@@ -53,3 +53,7 @@ export * from './components/text/presets/textPresets';
 /** Type exports */
 export * from './types/interfaces';
 export * from './types/other';
+
+/** Compile into dist/style folder */
+import "./styles/cdr-reset.scss";
+import "./styles/cdr-fonts.scss";
\ No newline at end of file
diff --git a/public/cdr-fonts.css b/src/styles/cdr-fonts.scss
similarity index 100%
rename from public/cdr-fonts.css
rename to src/styles/cdr-fonts.scss
diff --git a/public/cdr-reset.css b/src/styles/cdr-reset.scss
similarity index 56%
rename from public/cdr-reset.css
rename to src/styles/cdr-reset.scss
index fbce2b315..45540cb6c 100644
--- a/public/cdr-reset.css
+++ b/src/styles/cdr-reset.scss
@@ -1,3 +1,5 @@
+@import '../../node_modules/@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
 html {
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
@@ -25,7 +27,7 @@ html {
 
 body {
   /* cdr-text-default */
-  font-family: Graphik, "Helvetica Neue", sans-serif;
+  font-family: Graphik, 'Helvetica Neue', sans-serif;
   font-style: normal;
   font-weight: 400;
   letter-spacing: -0.16px;
@@ -38,18 +40,23 @@ body {
   background-color: #ffffff;
 }
 
-h1,h2,h3,h4,h5,h6 {
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
   text-wrap: balance;
 }
 
 p {
-  text-wrap: pretty
+  text-wrap: pretty;
 }
 
 a,
 area,
 button,
-[role="button"],
+[role='button'],
 input,
 label,
 select,
@@ -64,38 +71,45 @@ button:focus {
 }
 
 button,
-html [type="button"],
-[type="reset"],
-[type="submit"] {
+html [type='button'],
+[type='reset'],
+[type='submit'] {
   -webkit-appearance: button;
 }
 
 button::-moz-focus-inner,
-[type="button"]::-moz-focus-inner,
-[type="reset"]::-moz-focus-inner,
-[type="submit"]::-moz-focus-inner {
+[type='button']::-moz-focus-inner,
+[type='reset']::-moz-focus-inner,
+[type='submit']::-moz-focus-inner {
   padding: 0;
   border-style: none;
 }
 
-input[type="date"],
-input[type="time"],
-input[type="datetime-local"],
-input[type="month"] {
+input[type='date'],
+input[type='time'],
+input[type='datetime-local'],
+input[type='month'] {
   -webkit-appearance: listbox;
 }
 
-[type="number"]::-webkit-inner-spin-button,
-[type="number"]::-webkit-outer-spin-button {
+[type='number']::-webkit-inner-spin-button,
+[type='number']::-webkit-outer-spin-button {
   height: auto;
 }
 
-[type="search"] {
+[type='search'] {
   outline-offset: -0.2rem;
   -webkit-appearance: none;
 }
 
-[type="search"]::-webkit-search-cancel-button,
-[type="search"]::-webkit-search-decoration {
+[type='search']::-webkit-search-cancel-button,
+[type='search']::-webkit-search-decoration {
   -webkit-appearance: none;
 }
+
+[data-palette='sandstone'] {
+  --cdr-color-background-surface-primary: #{$cdr-color-background-secondary};
+  --cdr-color-background-surface-secondary: #dcd6cb;
+  --cdr-color-border-surface-primary: #{$cdr-color-border-secondary};
+  --cdr-color-border-surface-secondary: #726d64;
+}
diff --git a/src/styles/main.scss b/src/styles/main.scss
index 8d9cab904..dd8c8585a 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -5,4 +5,5 @@
 @import "./settings/index";
 
 /* Utilities */
-@import "../../public/cdr-reset.css";
+@import "./cdr-reset.scss";
+@import "./cdr-fonts.scss";
diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index b013e799d..1eee7c521 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -1,61 +1,146 @@
 $cdr-warn: false;
+@use 'sass:map';
+@use 'sass:list';
 @import '../../../node_modules/@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
 @import './alignment.vars';
 @import './options.vars';
 @import './visibility.vars';
 
+$cdr-space-zero: 0;
+$cdr-space-sixteenth-x: 0.1rem;
+$cdr-space-inset-zero: 0;
+$cdr-space-inset-sixteenth-x: 0.1rem;
+$cdr-color-background-transparent: transparent;
+$cdr-color-border-transparent: transparent;
+$cdr-color-border-dark: rgba(12, 11, 8, 0.75);
+
+$cdr-color-background-surface-primary: #ffffff;
+$cdr-color-background-surface-secondary: #f4f2ed;
+$cdr-color-border-surface-primary: #dcd6cb;
+$cdr-color-border-surface-secondary: #928b80;
+
+$cdr-color-background-surface-selection-primary: $cdr-color-background-primary;
+$cdr-color-background-surface-selection-primary-hover: #f4f2ed;
+$cdr-color-background-surface-selection-primary-active: #edeae3;
+$cdr-color-background-surface-selection-primary-checked: #dcd6cb;
+$cdr-color-background-surface-selection-primary-disabled: #ffffff;
+$cdr-color-background-surface-selection-secondary: $cdr-color-background-secondary;
+$cdr-color-background-surface-selection-secondary-hover: #e3e0d8;
+$cdr-color-background-surface-selection-secondary-active: #edeae3;
+$cdr-color-background-surface-selection-secondary-checked: $cdr-color-background-secondary;
+$cdr-color-background-surface-selection-secondary-disabled: #ffffff;
+$cdr-color-border-surface-selection-primary: $cdr-color-border-primary;
+$cdr-color-border-surface-selection-primary-hover: $cdr-color-border-secondary;
+$cdr-color-border-surface-selection-primary-active: $cdr-color-border-button-dark-active;
+$cdr-color-border-surface-selection-primary-checked: $cdr-color-border-button-dark-active;
+$cdr-color-border-surface-selection-primary-disabled: $cdr-color-border-primary;
+$cdr-color-border-surface-selection-secondary: $cdr-color-border-secondary;
+$cdr-color-border-surface-selection-secondary-hover: $cdr-color-border-secondary;
+$cdr-color-border-surface-selection-secondary-active: $cdr-color-border-button-dark-active;
+$cdr-color-border-surface-selection-secondary-checked: $cdr-color-border-button-dark-active;
+$cdr-color-border-surface-selection-secondary-disabled: $cdr-color-border-secondary;
+
 :root {
-  // New elevation tokens
-  --cdr-elevation-ground: 0;
-  --cdr-elevation-dropdown: 100;
-  --cdr-elevation-popover: 200;
-  --cdr-elevation-navigation: 300;
-  --cdr-elevation-sticky: 400;
-  --cdr-elevation-notification: 500;
-  --cdr-elevation-modal: 600;
-
-  // New color tokens
-  --cdr-color-background-transparent: transparent;
-  --cdr-color-border-transparent: transparent;
-  --cdr-color-border-dark: var(--cdr-color-text-primary);
-
-  // New spacing tokens
-  --cdr-space-inset-zero: 0;
-  --cdr-space-inset-sixteenth-x: 0.1rem;
-  --cdr-space-zero: 0;
-  --cdr-space-sixteenth-x: 0.1rem;
-
-  // Action globals
-  --cdr-action-border-width-rest: var(--cdr-space-inset-zero);
-  --cdr-action-border-width-hover: var(--cdr-space-inset-eighth-x);
-  --cdr-action-border-width-active: var(--cdr-space-inset-quarter-x);
-  --cdr-action-border-width-checked: var(--cdr-space-inset-eighth-x);
-
-  // Defaults are the least intrusive state of something
-  --cdr-border-width-default: var(--cdr-space-inset-zero);
-  --cdr-border-color-default: var(--cdr-color-border-primary);
-  --cdr-background-default: transparent;
-  --cdr-radius-default: var(--cdr-radius-sharp);
-  --cdr-shadow-default: var(--cdr-prominence-flat);
-  --cdr-elevation-default: var(--cdr-elevation-ground);
-  --cdr-position-default: relative;
+  --cdr-color-background-transparent: #{$cdr-color-background-transparent};
+  --cdr-color-border-transparent: #{$cdr-color-border-transparent};
+  --cdr-color-border-dark: #{$cdr-color-border-dark};
+  --cdr-space-inset-zero: #{$cdr-space-inset-zero};
+  --cdr-space-inset-sixteenth-x: #{$cdr-space-inset-sixteenth-x};
+  --cdr-space-zero: #{$cdr-space-zero};
+  --cdr-space-sixteenth-x: #{$cdr-space-sixteenth-x};
+
+  --cdr-color-background-surface-primary: #{$cdr-color-background-surface-primary};
+  --cdr-color-background-surface-secondary: #{$cdr-color-background-surface-secondary};
+  --cdr-color-border-surface-primary: #{$cdr-color-border-surface-primary};
+  --cdr-color-border-surface-secondary: #{$cdr-color-border-surface-secondary};
+
+  --cdr-color-background-surface-selection-primary: #{$cdr-color-background-surface-selection-primary};
+  --cdr-color-background-surface-selection-primary-hover: #{$cdr-color-background-surface-selection-primary-hover};
+  --cdr-color-background-surface-selection-primary-active: #{$cdr-color-background-surface-selection-primary-active};
+  --cdr-color-background-surface-selection-primary-checked: #{$cdr-color-background-surface-selection-primary-checked};
+  --cdr-color-background-surface-selection-primary-disabled: #{$cdr-color-background-surface-selection-primary-disabled};
+  --cdr-color-background-surface-selection-secondary: #{$cdr-color-background-surface-selection-secondary};
+  --cdr-color-background-surface-selection-secondary-hover: #{$cdr-color-background-surface-selection-secondary-hover};
+  --cdr-color-background-surface-selection-secondary-active: #{$cdr-color-background-surface-selection-secondary-active};
+  --cdr-color-background-surface-selection-secondary-checked: #{$cdr-color-background-surface-selection-secondary-checked};
+  --cdr-color-background-surface-selection-secondary-disabled: #{$cdr-color-background-surface-selection-secondary-disabled};
+  --cdr-color-border-surface-selection-primary: #{$cdr-color-border-surface-selection-primary};
+  --cdr-color-border-surface-selection-primary-hover: #{$cdr-color-border-surface-selection-primary-hover};
+  --cdr-color-border-surface-selection-primary-active: #{$cdr-color-border-surface-selection-primary-active};
+  --cdr-color-border-surface-selection-primary-checked: #{$cdr-color-border-surface-selection-primary-checked};
+  --cdr-color-border-surface-selection-primary-disabled: #{$cdr-color-border-surface-selection-primary-disabled};
+  --cdr-color-border-surface-selection-secondary: #{$cdr-color-border-surface-selection-secondary};
+  --cdr-color-border-surface-selection-secondary-hover: #{$cdr-color-border-surface-selection-secondary-hover};
+  --cdr-color-border-surface-selection-secondary-active: #{$cdr-color-border-surface-selection-secondary-active};
+  --cdr-color-border-surface-selection-secondary-checked: #{$cdr-color-border-surface-selection-secondary-checked};
+  --cdr-color-border-surface-selection-secondary-disabled: #{$cdr-color-border-surface-selection-secondary-disabled};
 }
 
-@mixin cdr-radius-mixin() {
-  border-radius: var(--cdr-radius, var(--cdr-radius-default));
-  overflow: hidden;
+$border-widths: (
+  'zero': $cdr-space-inset-zero,
+  'sixteenth-x': $cdr-space-inset-sixteenth-x,
+  'eighth-x': $cdr-space-inset-eighth-x,
+  'quarter-x': $cdr-space-inset-quarter-x,
+);
+
+$radii: (
+  'sharp': $cdr-radius-sharp,
+  'soft': $cdr-radius-soft,
+  'softer': $cdr-radius-softer,
+  'round': $cdr-radius-round,
+);
+
+$shadows: (
+  'flat': $cdr-prominence-flat,
+  'raised': $cdr-prominence-raised,
+  'elevated': $cdr-prominence-elevated,
+  'floating': $cdr-prominence-floating,
+  'lifted': $cdr-prominence-lifted,
+);
+
+@mixin cdr-background-mixin($options, $component, $key, $state: 'rest') {
+  @if $state == rest {
+    background: var(
+      --cdr-#{$component}-#{$key}-background-color,
+      var(--cdr-color-background-#{$component}-#{$key}, #{map.get($options, $key, $state)})
+    );
+  } @else {
+    background: var(
+      --cdr-#{$component}-#{$key}-background-color-#{$state},
+      var(
+        --cdr-color-background-#{$component}-#{$key}-#{$state},
+        #{map.get($options, $key, $state)}
+      )
+    );
+  }
+}
+
+@mixin cdr-border-color-mixin($options, $component, $key, $state: 'rest') {
+  @if $state == rest {
+    --cdr-#{$component}-border-color-default: var(
+      --cdr-#{$component}-#{$key}-border-color,
+      var(--cdr-color-border-#{$component}-#{$key}, #{map.get($options, $key, $state)})
+    );
+  } @else {
+    --cdr-#{$component}-border-color-default: var(
+      --cdr-#{$component}-#{$key}-border-color-#{$state},
+      var(--cdr-color-border-#{$component}-#{$key}-#{$state}, #{map.get($options, $key, $state)})
+    );
+  }
 }
 
-@mixin cdr-shadow-mixin() {
-  box-shadow: var(--cdr-shadow, var(--cdr-shadow-default));
+@mixin cdr-border-width-mixin($component, $key) {
+  --cdr-#{$component}-border-width-default: var(
+    --cdr-#{$component}-border-width,
+    var(--cdr-space-inset-#{$key}, #{map.get($border-widths, $key)})
+  );
 }
 
-@mixin cdr-border-mixin() {
-  --cdr-palette-border-color: initial;
+@mixin cdr-border-mixin($component) {
   position: relative;
 
   &::after {
-    @include cdr-radius-mixin;
+    border-radius: var(--cdr-#{$component}-radius-default);
     pointer-events: none;
     position: absolute;
     top: 0;
@@ -63,61 +148,23 @@ $cdr-warn: false;
     width: 100%;
     height: 100%;
     content: '';
-    box-shadow: inset 0 0 0 var(--cdr-border-width, var(--cdr-border-width-default))
-      var(--cdr-border-color, var(--cdr-palette-border-color, var(--cdr-border-color-default)));
+    box-shadow: inset 0 0 0 var(--cdr-#{$component}-border-width-default)
+      var(--cdr-#{$component}-border-color-default);
   }
 }
 
-@mixin cdr-background-mixin() {
-  --cdr-palette-background: initial;
-  background-color: var(
-    --cdr-background,
-    var(--cdr-palette-background, var(--cdr-background-default))
+@mixin cdr-radius-mixin($component, $key) {
+  --cdr-#{$component}-radius-default: var(
+    --cdr-#{$component}-radius,
+    var(--cdr-radius-#{$key}, #{map.get($radii, $key)})
   );
+  border-radius: var(--cdr-#{$component}-radius-default);
+  overflow: hidden;
 }
 
-@mixin cdr-elevation-mixin() {
-  z-index: var(--cdr-elevation, var(--cdr-elevation-default));
-  position: var(--cdr-position, var(--cdr-position-default));
-}
-
-@mixin cdr-palette-base-mixin() {
-  @include cdr-background-mixin();
-  @include cdr-border-mixin();
-  --cdr-palette-background: var(--cdr-palette-background-rest);
-  --cdr-palette-border-color: var(--cdr-palette-border-color-rest);
-  --cdr-palette-text-color: var(--cdr-palette-text-color-rest);
-  --cdr-text-color: var(--cdr-palette-text-color);
-}
-
-@mixin cdr-palette-primary-mixin() {
-  @include cdr-palette-base-mixin;
-  --cdr-palette-background-rest: var(--cdr-color-background-primary);
-  --cdr-palette-background-hover: #f4f2ed;
-  --cdr-palette-background-active: #edeae3;
-  --cdr-palette-background-checked: #dcd6cb;
-  --cdr-palette-background-disabled: #ffffff;
-  --cdr-palette-border-color-rest: #dcd6cb;
-  --cdr-palette-border-color-hover: #928b80;
-  --cdr-palette-border-color-active: #4e4d49;
-  --cdr-palette-border-color-checked: #4e4d49;
-  --cdr-palette-border-color-disabled: var(--cdr-color-border-primary);
-  --cdr-palette-text-color-rest: var(--cdr-color-text-primary);
-  --cdr-palette-text-color-disabled: var(--cdr-color-text-disabled);
-}
-
-@mixin cdr-palette-secondary-mixin() {
-  @include cdr-palette-base-mixin;
-  --cdr-palette-background-rest: var(--cdr-color-background-secondary);
-  --cdr-palette-background-hover: #e3e0d8;
-  --cdr-palette-background-active: #edeae3;
-  --cdr-palette-background-checked: var(--cdr-color-border-secondary);
-  --cdr-palette-background-disabled: #ffffff;
-  --cdr-palette-border-color-rest: #928b80;
-  --cdr-palette-border-color-hover: #928b80;
-  --cdr-palette-border-color-active: #4e4d49;
-  --cdr-palette-border-color-checked: #4e4d49;
-  --cdr-palette-border-color-disabled: var(--cdr-color-border-secondary);
-  --cdr-palette-text-color-rest: var(--cdr-color-text-primary);
-  --cdr-palette-text-color-disabled: var(--cdr-color-text-disabled);
+@mixin cdr-shadow-mixin($component, $key) {
+  box-shadow: var(
+    --cdr-#{$component}-shadow,
+    var(--cdr-prominence-#{$key}, #{map.get($shadows, $key)})
+  );
 }
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index c61b83178..7774545fb 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -5,9 +5,8 @@ import type {
   Shadow,
   Radius,
   BorderColor,
-  Elevation,
   Position,
-  Palette,
+  Variant,
   Background,
 } from './other';
 
@@ -163,16 +162,15 @@ export interface InlineCss {
  * @extends HtmlAttributes
  */
 export interface CdrSurfaceProps extends HtmlAttributes {
+  variant?: Variant;
   display?: Display;
   background?: Background;
-  palette?: Palette;
   tag?: Tag;
   shadow?: Shadow;
   radius?: Radius;
   withBorder?: boolean;
   borderWidth?: Space;
   borderColor?: BorderColor;
-  elevation?: Elevation;
   position?: Position;
   fixed?: boolean;
   m?: Space;
diff --git a/src/types/other.ts b/src/types/other.ts
index 0e7aa1da3..7ccece829 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -24,14 +24,6 @@ export type BorderColor =
   | 'warning'
   | 'error'
   | 'message-default-01';
-export type Elevation =
-  | 'ground'
-  | 'dropdown'
-  | 'popover'
-  | 'navigation'
-  | 'sticky'
-  | 'notification'
-  | 'modal';
 export type Position = CSS.Properties['position'];
-export type Palette = 'primary' | 'secondary';
+export type Variant = 'primary' | 'secondary';
 export type Display = CSS.Properties['display'];
\ No newline at end of file
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
new file mode 100644
index 000000000..788e17eaa
--- /dev/null
+++ b/src/utils/surface.ts
@@ -0,0 +1,82 @@
+import type { CdrSurfaceProps, InlineCss } from '../types/interfaces';
+
+// Map of margins and padding
+const marginsAndPaddingMap: Record<string, string> = {
+  m: 'margin',
+  mx: 'marginInline',
+  my: 'marginBlock',
+  ml: 'marginInlineStart',
+  mr: 'marginInlineEnd',
+  mt: 'marginTop',
+  mb: 'marginBottom',
+  p: 'padding',
+  px: 'paddingInline',
+  py: 'paddingBlock',
+  pl: 'paddingInlineStart',
+  pr: 'paddingInlineEnd',
+  pt: 'paddingTop',
+  pb: 'paddingBottom',
+};
+const marginAndPaddingKeys = Object.keys(marginsAndPaddingMap);
+
+// Manages the props passed along to all surfaces
+export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
+  const classes = [baseClass];
+  const inlineStyles: InlineCss = {};
+
+  // Add variant, which applies a background and border color,
+  // but does not apply a border width
+  if (props.variant) {
+    classes.push(`${baseClass}--variant-${props.variant}`);
+  }
+
+  // Add background
+  if (props.background) {
+    const backgroundClass = `${baseClass}--background-${props.background}`;
+    classes.push(backgroundClass);
+  }
+
+  // Add border
+  if (props.withBorder) {
+    if (props.borderWidth) {
+      const borderWidthClass = `${baseClass}--border-width-${props.borderWidth}`;
+      classes.push(borderWidthClass);
+    }
+
+    if (props.borderColor) {
+      const borderColorClass = `${baseClass}--border-color-${props.borderColor}`;
+      classes.push(borderColorClass);
+    }
+
+    classes.push(`${baseClass}--border`);
+  }
+
+  // Add radius
+  if (props.radius) {
+    const radiusClass = `${baseClass}--radius-${props.radius}`;
+    classes.push(radiusClass);
+  }
+
+  // Add shadow
+  if (props.shadow) {
+    const shadowClass = `${baseClass}--shadow-${props.shadow}`;
+    classes.push(shadowClass);
+  }
+
+  // Add display
+  if (props.display) {
+    inlineStyles['display'] = props.display;
+  }
+
+  // Add margin and padding
+  if (marginAndPaddingKeys.find((key) => props[key])) {
+    marginAndPaddingKeys.forEach((key) => {
+      if (props[key]) {
+        const cssProperty = marginsAndPaddingMap[key];
+        inlineStyles[cssProperty] = `var(--cdr-space-${props.fixed ? '' : 'scale-'}${props[key]})`;
+      }
+    });
+  }
+
+  return { classes, inlineStyles };
+};
diff --git a/test/e2e/specs/a11y.js b/test/e2e/specs/a11y.js
index 9df67ccde..ed64873e6 100644
--- a/test/e2e/specs/a11y.js
+++ b/test/e2e/specs/a11y.js
@@ -22,16 +22,16 @@ function runA11yTests(browser, path, target) {
 
 module.exports = {
   '@tags': ['accessibility'],
-  'Page Is Accessible: Primary Background, Part 1':function (browser) {
-    runA11yTests(browser, 'e2e-1?background=primary', '#kitchen-sink-1');
+  'Page Is Accessible: Primary Palette, Part 1':function (browser) {
+    runA11yTests(browser, 'e2e-1?palette=primary', '#kitchen-sink-1');
   },
-  'Page Is Accessible: Primary Background, Part 2':function (browser) {
-    runA11yTests(browser, 'e2e-2?background=primary', '#kitchen-sink-2');
+  'Page Is Accessible: Primary Palette, Part 2':function (browser) {
+    runA11yTests(browser, 'e2e-2?palette=primary', '#kitchen-sink-2');
   },
-  'Page Is Accessible: Secondary Background, Part 1': function (browser) {
-    runA11yTests(browser, 'e2e-1?background=secondary', '#kitchen-sink-1')
+  'Page Is Accessible: Secondary Palette, Part 1': function (browser) {
+    runA11yTests(browser, 'e2e-1?palette=secondary', '#kitchen-sink-1')
   },
-  'Page Is Accessible: Secondary Background, Part 2': function (browser) {
-    runA11yTests(browser, 'e2e-2?background=secondary', '#kitchen-sink-2')
+  'Page Is Accessible: Secondary Palette, Part 2': function (browser) {
+    runA11yTests(browser, 'e2e-2?palette=secondary', '#kitchen-sink-2')
   },
 };

From c51959ec383cc72c4ed2ff8018549ed28c41cbbf Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 20 Jun 2024 15:11:42 -0700
Subject: [PATCH 14/70] progress check

---
 src/components/examples.js                    |   4 +-
 .../fulfillmentTile/CdrFulfillmentTile.vue    |  91 +++++-----------
 .../CdrFulfillmentTileContent.vue             |  88 +++++++++++++++
 .../examples/FulfillmentTile.vue              |  74 ++++++-------
 .../styles/CdrFulfillmentTile.module.scss     |  35 ++++--
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  50 ++++-----
 src/components/surface/CdrSurface.vue         |   4 +-
 src/components/surface/examples/Surface.vue   |  11 +-
 .../surface/styles/CdrSurface.module.scss     |   4 +-
 .../surface/styles/vars/CdrSurface.vars.scss  |  39 ++++---
 .../surfaceSelection/CdrSurfaceSelection.vue  |   8 +-
 .../examples/SurfaceSelection.vue             |  12 +--
 .../styles/CdrSurfaceSelection.module.scss    |   4 +-
 .../styles/vars/CdrSurfaceSelection.vars.scss | 100 ++++++++++--------
 src/dev/router.js                             |   2 +-
 src/lib.ts                                    |   2 +-
 src/styles/settings/index.scss                |  44 ++++----
 src/types/interfaces.ts                       |   9 +-
 src/types/other.ts                            |   4 +-
 src/utils/surface.ts                          |  11 +-
 20 files changed, 333 insertions(+), 263 deletions(-)
 create mode 100644 src/components/fulfillmentTile/CdrFulfillmentTileContent.vue

diff --git a/src/components/examples.js b/src/components/examples.js
index d00e7c0d2..45cf2c1b4 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -10,7 +10,7 @@ import chip from 'componentsdir/chip/examples/Chip.vue';
 import choreographer from 'componentsdir/choreographer/examples/Choreographer.vue';
 import container from 'componentsdir/container/examples/Container.vue';
 import formGroup from 'componentsdir/formGroup/examples/FormGroup.vue';
-// import fulfillmentTile from 'componentsdir/fulfillmentTile/examples/FulfillmentTile.vue';
+import fulfillmentTile from 'componentsdir/fulfillmentTile/examples/FulfillmentTile.vue';
 import grid from 'componentsdir/grid/examples/Grid.vue';
 import icon from 'componentsdir/icon/examples/Icons.vue';
 import images from 'componentsdir/image/examples/Images.vue';
@@ -53,7 +53,7 @@ export default {
   chip,
   choreographer,
   container,
-  // fulfillmentTile,
+  fulfillmentTile,
   formGroup,
   grid,
   icon,
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index d006f5a1e..9157aef5c 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -1,88 +1,49 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
-import type * as CSS from 'csstype';
 import mapClasses from '../../utils/mapClasses';
-import CdrSurfaceSelection from '../surfaceSelection/CdrSurfaceSelection.vue';
-import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
-import CdrUtilitySans, { type utilitySansTextProps } from '../text/presets/CdrUtilitySans.vue';
-import { CdrFulfillmentTileProps } from '../../types/interfaces';
+import { CdrFulfillmentTileProps, HtmlAttributes } from '../../types/interfaces';
+import { getSurfaceProps } from '../../utils/surface';
 
-/** Tile component for displaying a button with optional icon at the top right */
+/** Tile component for displaying a button with optional icon in the header */
 
 defineOptions({ name: 'CdrFulfillmentTile' });
 
-const props = defineProps<CdrFulfillmentTileProps>();
+const props = withDefaults(defineProps<CdrFulfillmentTileProps>(), {
+  tag: 'button',
+  modifier: 'primary',
+  withBorder: true,
+  borderColor: 'primary',
+  borderWidth: 'sixteenth-x',
+  radius: 'softer',
+});
 
 const style = useCssModule();
 const baseClass = 'cdr-fulfillment-tile';
 
-// Manages the props passed along to CdrGenericButton
+// Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const classes = [baseClass];
-  const inlineStyles: CSS.Properties = {};
+  const { checked } = props;
+  const { inlineStyles, classes } = getSurfaceProps(props, baseClass);
+  const additionalProps: HtmlAttributes = {};
+
+  // Add checked
+  additionalProps['aria-checked'] = checked;
 
   return {
-    ...props,
+    ...additionalProps,
     style: inlineStyles,
-    class: mapClasses(style, ...classes),
+    class: mapClasses(style, ...classes) || undefined,
   };
 });
-
-const headerProps = computed(() => ({
-  class: style[`${baseClass}__header`],
-}));
-
-const bodyProps = computed<utilitySansTextProps>(() => ({
-  scale: '-1',
-  tag: 'div',
-  class: {
-    [style[`${baseClass}__content`]]: true,
-    [style[`${baseClass}__content--body`]]: true,
-  },
-}));
-
-const footerProps = computed<utilitySansTextProps>(() => ({
-  scale: '-1',
-  tag: 'div',
-  class: {
-    [style[`${baseClass}__content`]]: true,
-    [style[`${baseClass}__content--footer`]]: true,
-  },
-}));
 </script>
 
 <template>
-  <CdrSurfaceSelection v-bind="rootProps">
-    <CdrFulfillmentTileHeader v-bind="headerProps">
-      <template
-        v-if="$slots['icon-left']"
-        #icon-left
-      >
-        <slot name="icon-left" />
-      </template>
-      <template #label>
-        <slot name="label" />
-      </template>
-      <template
-        v-if="$slots['icon-right']"
-        #icon-right
-      >
-        <slot name="icon-right" />
-      </template>
-    </CdrFulfillmentTileHeader>
-    <CdrUtilitySans
-      v-if="$slots.body"
-      v-bind="bodyProps"
-    >
-      <slot name="body" />
-    </CdrUtilitySans>
-    <CdrUtilitySans
-      v-if="$slots.footer"
-      v-bind="footerProps"
-    >
-      <slot name="footer" />
-    </CdrUtilitySans>
-  </CdrSurfaceSelection>
+  <component
+    :is="tag"
+    v-bind="rootProps"
+  >
+    Test
+  </component>
 </template>
 
 <style lang="scss" module src="./styles/CdrFulfillmentTile.module.scss"></style>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
new file mode 100644
index 000000000..6bc4295ef
--- /dev/null
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
@@ -0,0 +1,88 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import mapClasses from '../../utils/mapClasses';
+import CdrSurfaceSelection from '../surfaceSelection/CdrSurfaceSelection.vue';
+import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
+import CdrUtilitySans, { type utilitySansTextProps } from '../text/presets/CdrUtilitySans.vue';
+import { CdrFulfillmentTileProps } from '../../types/interfaces';
+
+/** Tile component for displaying a button with optional icon in the header */
+
+defineOptions({ name: 'CdrFulfillmentTileContent' });
+
+interface CdrFulfillmentTileProps {
+  stretch: boolean;
+}
+
+const props = withDefaults(defineProps<CdrFulfillmentTileProps>(), {
+  stretch: false,
+});
+
+const style = useCssModule();
+const baseClass = 'cdr-fulfillment-tile-content';
+
+// Manages the props passed along to CdrSurfaceSelection
+const rootProps = computed(() => {
+  const classes = [baseClass];
+    baseClass,
+    [style[`${baseClass}__content`]]: true,
+    [style[`${baseClass}__content--stretch`]]: props.stretch,
+  };
+
+  if(props.stretch) {
+    classes.push(`${baseClass}--stretch`);
+  }
+
+  return {
+    tag: 'div',
+    scale: '-1',
+    class: mapClasses(style, ...classes) || undefined,
+  };
+});
+
+const headerProps = computed(() => ({ class: style[`${baseClass}__header`] }));
+
+const contentProps = computed<utilitySansTextProps>(() => ({}));
+
+const footerProps = computed<utilitySansTextProps>(() => ({
+  tag: 'div',
+  scale: '-1',
+  class: { [style[`${baseClass}__content`]]: true },
+}));
+</script>
+
+<template>
+  <CdrSurfaceSelection v-bind="rootProps">
+    <CdrFulfillmentTileHeader v-bind="headerProps">
+      <template
+        v-if="$slots['icon-left']"
+        #icon-left
+      >
+        <slot name="icon-left" />
+      </template>
+      <template #label>
+        <slot name="label" />
+      </template>
+      <template
+        v-if="$slots['icon-right']"
+        #icon-right
+      >
+        <slot name="icon-right" />
+      </template>
+    </CdrFulfillmentTileHeader>
+    <CdrUtilitySans
+      v-if="$slots.body"
+      v-bind="bodyProps"
+    >
+      <slot name="body" />
+    </CdrUtilitySans>
+    <CdrUtilitySans
+      v-if="$slots.footer"
+      v-bind="footerProps"
+    >
+      <slot name="footer" />
+    </CdrUtilitySans>
+  </CdrSurfaceSelection>
+</template>
+
+<style lang="scss" module src="./styles/CdrFulfillmentTile.module.scss"></style>
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index fca763143..87d51f4c3 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -362,48 +362,48 @@ const toggleCheckbox2 = (value: number) => {
     margin-bottom: var(--cdr-space-scale-half-x);
   }
 
-  &__checkout-tile-other-disabled {
-    --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-    --cdr-palette-background-rest: var(--cdr-color-background-button-default-disabled);
-    --cdr-palette-border-color: var(--cdr-color-border-primary);
+  // &__checkout-tile-other-disabled {
+  //   --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+  //   --cdr-palette-background-rest: var(--cdr-color-background-button-default-disabled);
+  //   --cdr-palette-border-color: var(--cdr-color-border-primary);
 
-    &[aria-pressed='true'],
-    &[aria-checked='true'] {
-      --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-      --cdr-palette-background-checked: var(--cdr-color-background-button-default-disabled);
-      --cdr-palette-border-color: var(--cdr-palette-border-color-checked);
-    }
-  }
+  //   &[aria-pressed='true'],
+  //   &[aria-checked='true'] {
+  //     --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+  //     --cdr-palette-background-checked: var(--cdr-color-background-button-default-disabled);
+  //     --cdr-palette-border-color: var(--cdr-palette-border-color-checked);
+  //   }
+  // }
 
-  &__search-tile-other {
-    @include cdr-fulfillment-tile-base-mixin;
-    gap: 0;
-    padding-top: 0;
-    padding-bottom: 0;
-  }
+  // &__search-tile-other {
+  //   @include cdr-fulfillment-tile-base-mixin;
+  //   gap: 0;
+  //   padding-top: 0;
+  //   padding-bottom: 0;
+  // }
 
-  &__search-tile-other-header-button {
-    --cdr-action-border-width-checked: 0;
-    padding: var(--cdr-space-scale-one-x) 0;
-    width: 100%;
-    @include tile-colors;
-  }
+  // &__search-tile-other-header-button {
+  //   --cdr-action-border-width-checked: 0;
+  //   padding: var(--cdr-space-scale-one-x) 0;
+  //   width: 100%;
+  //   @include tile-colors;
+  // }
 
-  &__search-tile-other-header-content {
-    @include cdr-fulfillment-tile-content-mixin;
-    margin-top: var(--cdr-space-scale-half-x);
-  }
+  // &__search-tile-other-header-content {
+  //   @include cdr-fulfillment-tile-content-mixin;
+  //   margin-top: var(--cdr-space-scale-half-x);
+  // }
 
-  &__search-tile-other-header-hr {
-    margin: 0;
-    border-top: var(--cdr-space-scale-sixteenth-x) solid initial;
-    width: 100%;
-  }
+  // &__search-tile-other-header-hr {
+  //   margin: 0;
+  //   border-top: var(--cdr-space-scale-sixteenth-x) solid initial;
+  //   width: 100%;
+  // }
 
-  &__change-store-other {
-    padding: var(--cdr-space-scale-three-quarter-x) var(--cdr-space-scale-one-x)
-      var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x);
-    justify-content: flex-start;
-  }
+  // &__change-store-other {
+  //   padding: var(--cdr-space-scale-three-quarter-x) var(--cdr-space-scale-one-x)
+  //     var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x);
+  //   justify-content: flex-start;
+  // }
 }
 </style>
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
index e3473b7ee..bdc33e1d3 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
@@ -1,9 +1,26 @@
-@import './vars/CdrFulfillmentTile.vars.scss';
-
-.cdr-fulfillment-tile {
-  @include cdr-fulfillment-tile-base-mixin;
-
-  &__content {
-    @include cdr-fulfillment-tile-content-mixin;
-  }
-}
+
+// $modifiers: 'primary', 'secondary';
+// $component: 'surface-selection';
+
+// .cdr-fulfillment-tile {
+//   @include cdr-fulfillment-tile-base-mixin($component);
+
+//   &__content {
+//     @include cdr-fulfillment-tile-content-mixin;
+//   }
+// }
+
+@import '../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
+@import '../../surface/styles/vars/CdrSurface.vars.scss';
+@import './vars/CdrFulfillmentTile.vars.scss';
+
+$component: 'fulfillment-tile';
+
+@include cdr-surface-base-mixin($component);
+
+.cdr-fulfillment-tile {
+  @include cdr-surface-selection-base-mixin($component);
+  @include cdr-fulfillment-tile-base-mixin($component);
+}
+
+@include cdr-surface-selection-states-mixin($component);
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index aa4cf42be..6077afbcf 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -1,16 +1,11 @@
 @import '../../../../styles/settings/index.scss';
+@import '../../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 
-@mixin cdr-fulfillment-tile-base-mixin() {
-  @include cdr-text-utility-sans-300;
-  @include cdr-border-mixin;
-  @include cdr-radius-mixin;
-  @include cdr-palette-primary-mixin;
-  --cdr-border-width-default: var(--cdr-space-inset-sixteenth-x);
-  --cdr-radius-default: var(--cdr-radius-softer);
-  --cdr-palette-border-color: var(--cdr-color-border-message-default-01);
-  --cdr-palette-background-checked: var(--cdr-color-background-primary);
-  --cdr-palette-background-disabled: var(--cdr-color-background-button-default-disabled);
-  --cdr-palette-text-color-disabled: var(--cdr-color-text-primary);
+@mixin cdr-fulfillment-tile-base-mixin($component) {
+  --cdr-fulfillment-tile-background-color-checked: var(--cdr-color-background-primary);
+  --cdr-fulfillment-tile-background-color-disabled: var(
+    --cdr-color-background-button-default-disabled
+  );
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
@@ -21,6 +16,21 @@
   padding: var(--cdr-space-scale-one-x) 0;
 }
 
+@mixin cdr-fulfillment-tile-content-mixin() {
+  padding: 0 var(--cdr-space-scale-one-x);
+  width: 100%;
+  flex: 0 0 auto;
+
+  &--stretch {
+    flex: 1 1 auto;
+  }
+
+  strong {
+    --cdr-utility-sans-font-weight: 600;
+    font-weight: var(--cdr-utility-sans-font-weight);
+  }
+}
+
 @mixin cdr-fulfillment-tile-header-mixin() {
   display: flex;
   align-items: center;
@@ -38,21 +48,3 @@
     flex: 1 1 auto;
   }
 }
-
-@mixin cdr-fulfillment-tile-content-mixin() {
-  padding: 0 var(--cdr-space-scale-one-x);
-  width: 100%;
-
-  strong {
-    --cdr-utility-sans-font-weight: 600;
-    font-weight: var(--cdr-utility-sans-font-weight);
-  }
-
-  &--body {
-    flex: 1 1 auto;
-  }
-
-  &--footer {
-    flex: 0 0 auto;
-  }
-}
diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index a78c2f716..eedf6230a 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -14,7 +14,7 @@ const props = withDefaults(defineProps<CdrSurfaceProps>(), {
 
 const style = useCssModule();
 
-const computedProps = computed(() => {
+const rootProps = computed(() => {
   const { inlineStyles, classes } = getSurfaceProps(props, 'cdr-surface');
   return { style: inlineStyles, class: mapClasses(style, ...classes) || undefined };
 });
@@ -23,7 +23,7 @@ const computedProps = computed(() => {
 <template>
   <component
     :is="tag"
-    v-bind="computedProps"
+    v-bind="rootProps"
   >
     <slot />
   </component>
diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index 2f90c797c..3e5134552 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import CdrSurface from '../CdrSurface.vue';
+import CdrText from '../../text/CdrText.vue';
 import type { CdrSurfaceProps } from '../../../types/interfaces';
 
 defineOptions({ name: 'Surface' });
@@ -39,9 +40,9 @@ const boxes: Example[] = [
     },
   },
   {
-    label: 'This surface uses the primary variant to apply a background and border color',
+    label: 'This surface uses the primary modifier to apply a background and border color',
     props: {
-      variant: 'primary',
+      modifier: 'primary',
       display: 'inline-block',
       radius: 'soft',
       p: 'one-x',
@@ -50,9 +51,9 @@ const boxes: Example[] = [
     },
   },
   {
-    label: 'This surface uses the secondary variant to apply a background and border color',
+    label: 'This surface uses the secondary modifier to apply a background and border color',
     props: {
-      variant: 'secondary',
+      modifier: 'secondary',
       display: 'inline-block',
       radius: 'soft',
       p: 'one-x',
@@ -69,7 +70,7 @@ const boxes: Example[] = [
     <template v-for="({ label, props }) in boxes" :key="label">
       <hr class="example__hr" />
       <CdrSurface v-bind="props">
-        {{ label }}
+        <CdrText>{{ label }}</CdrText>
       </CdrSurface>
     </template>
   </div>
diff --git a/src/components/surface/styles/CdrSurface.module.scss b/src/components/surface/styles/CdrSurface.module.scss
index 66abb1357..8523041c7 100644
--- a/src/components/surface/styles/CdrSurface.module.scss
+++ b/src/components/surface/styles/CdrSurface.module.scss
@@ -1,9 +1,9 @@
 @import '../../../styles/settings/index.scss';
 @import './vars/CdrSurface.vars.scss';
 
-$variants: 'primary', 'secondary';
+$modifiers: 'primary', 'secondary';
 $component: 'surface';
 
 @include cdr-surface-base-mixin($component);
 
-@include cdr-surface-variants-mixin($component, $variants);
+@include cdr-surface-modifiers-mixin($component, $modifiers);
diff --git a/src/components/surface/styles/vars/CdrSurface.vars.scss b/src/components/surface/styles/vars/CdrSurface.vars.scss
index 2d6494308..28e2c4ef5 100644
--- a/src/components/surface/styles/vars/CdrSurface.vars.scss
+++ b/src/components/surface/styles/vars/CdrSurface.vars.scss
@@ -1,25 +1,34 @@
+@use 'sass:map';
 @import '../../../../styles/settings/index.scss';
 
-$surface-background-colors: (
-  'primary': $cdr-color-background-surface-primary,
-  'secondary': $cdr-color-background-surface-secondary,
+$background-colors: (
+  'primary': (
+    'rest': $cdr-color-background-surface-primary,
+  ),
+  'secondary': (
+    'rest': $cdr-color-background-surface-secondary,
+  ),
 );
 
-$surface-border-colors: (
-  'primary': $cdr-color-border-surface-primary,
-  'secondary': $cdr-color-border-surface-secondary,
+$border-colors: (
+  'primary': (
+    'rest': $cdr-color-border-surface-primary,
+  ),
+  'secondary': (
+    'rest': $cdr-color-border-surface-secondary,
+  ),
 );
 
 @mixin cdr-surface-base-mixin($component) {
-  @each $key, $value in $surface-background-colors {
+  @each $key, $value in $background-colors {
     .cdr-#{$component}--background-#{$key} {
-      @include cdr-background-mixin($surface-background-colors, $component, $key);
+      @include cdr-background-mixin($background-colors, $component, $key);
     }
   }
 
-  @each $key, $value in $surface-border-colors {
+  @each $key, $value in $border-colors {
     .cdr-#{$component}--border-color-#{$key} {
-      @include cdr-border-color-mixin($surface-border-colors, $component, $key);
+      @include cdr-border-color-mixin($border-colors, $component, $key);
     }
   }
 
@@ -46,11 +55,11 @@ $surface-border-colors: (
   }
 }
 
-@mixin cdr-surface-variants-mixin($component, $variants) {
-  @each $key in $variants {
-    .cdr-#{$component}--variant-#{$key} {
-      @include cdr-background-mixin($surface-background-colors, $component, $key);
-      @include cdr-border-color-mixin($surface-border-colors, $component, $key);
+@mixin cdr-surface-modifiers-mixin($component, $modifiers) {
+  @each $key in $modifiers {
+    .cdr-#{$component}--modifier-#{$key} {
+      @include cdr-background-mixin($background-colors, $component, $key);
+      @include cdr-border-color-mixin($border-colors, $component, $key);
     }
   }
 }
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 47f447583..c34b54372 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -4,19 +4,19 @@ import mapClasses from '../../utils/mapClasses';
 import { CdrSurfaceSelectionProps, HtmlAttributes } from '../../types/interfaces';
 import { getSurfaceProps } from '../../utils/surface';
 
-/** Component for buttons that may have a checked state */
+/** Component for buttons that have a checked state */
 
 defineOptions({ name: 'CdrSurfaceSelection' });
 
 const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   tag: 'button',
-  variant: 'primary',
+  modifier: 'primary',
 });
 
 const style = useCssModule();
 
 // Manages the props passed along to CdrSurface
-const computedProps = computed(() => {
+const rootProps = computed(() => {
   const { checked } = props;
   const { inlineStyles, classes } = getSurfaceProps(props, 'cdr-surface-selection');
   const additionalProps: HtmlAttributes = {};
@@ -35,7 +35,7 @@ const computedProps = computed(() => {
 <template>
   <component
     :is="tag"
-    v-bind="computedProps"
+    v-bind="rootProps"
   >
     <slot />
   </component>
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index 8cf76b326..fd9c96fbd 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -36,31 +36,31 @@ const toggleValue = ref(1);
     <h2>SurfaceSelection</h2>
     <hr class="example__hr" />
     <CdrSurfaceSelection v-bind="{ checked: false }">
-      This is a blank SurfaceSelection which uses the primary (default) variant
+      This is a blank SurfaceSelection which uses the primary (default) modifier
     </CdrSurfaceSelection>
     <hr class="example__hr" />
     <CdrSurfaceSelection
       v-bind="{
         p: 'one-x',
-        variant: 'primary',
+        modifier: 'primary',
         withBorder: true,
         borderWidth: 'sixteenth-x',
         checked: false,
       }"
     >
-      This surface uses the primary variant and has a border
+      This surface uses the primary modifier and has a border
     </CdrSurfaceSelection>
     <hr class="example__hr" />
     <CdrSurfaceSelection
       v-bind="{
         p: 'one-x',
-        variant: 'secondary',
+        modifier: 'secondary',
         withBorder: true,
         borderWidth: 'sixteenth-x',
         checked: false,
       }"
     >
-      This surface uses the secondary variant and has a border
+      This surface uses the secondary modifier and has a border
     </CdrSurfaceSelection>
     <hr class="example__hr" />
     <h3 class="example__h3">Chips</h3>
@@ -84,7 +84,7 @@ const toggleValue = ref(1);
       border-width="sixteenth-x"
       p="quarter-x"
       radius="softer"
-      variant="secondary"
+      modifier="secondary"
     >
       <CdrSurfaceSelection
         v-for="index in toggle.count"
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
index 6b38466ab..54a8ed11b 100644
--- a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
@@ -1,7 +1,7 @@
 @import './vars/CdrSurfaceSelection.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
-$variants: 'primary', 'secondary';
+$modifiers: 'primary', 'secondary';
 $component: 'surface-selection';
 
 @include cdr-surface-base-mixin($component);
@@ -10,4 +10,4 @@ $component: 'surface-selection';
   @include cdr-surface-selection-base-mixin($component);
 }
 
-@include cdr-surface-selection-states-mixin($component, $variants);
+@include cdr-surface-selection-states-mixin($component, $modifiers);
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index 7a8266e79..e489013fc 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -71,64 +71,80 @@
   }
 }
 
-$surface-selection-background-colors: (
+$background-colors: (
   'primary': (
-    'rest': $cdr-color-background-primary,
-    'hover': #f4f2ed,
-    'active': #edeae3,
-    'checked': #dcd6cb,
-    'disabled': #ffffff,
+    'rest': $cdr-color-background-surface-selection-primary,
+    'hover': $cdr-color-background-surface-selection-primary-hover,
+    'active': $cdr-color-background-surface-selection-primary-active,
+    'checked': $cdr-color-background-surface-selection-primary-checked,
+    'disabled': $cdr-color-background-surface-selection-primary-disabled,
   ),
   'secondary': (
-    'rest': $cdr-color-background-secondary,
-    'hover': #e3e0d8,
-    'active': #edeae3,
-    'checked': $cdr-color-background-secondary,
-    'disabled': #ffffff,
+    'rest': $cdr-color-background-surface-selection-secondary,
+    'hover': $cdr-color-background-surface-selection-secondary-hover,
+    'active': $cdr-color-background-surface-selection-secondary-active,
+    'checked': $cdr-color-background-surface-selection-secondary-checked,
+    'disabled': $cdr-color-background-surface-selection-secondary-disabled,
   ),
 );
 
-$surface-selection-border-colors: (
+$border-colors: (
   'primary': (
-    'rest': $cdr-color-border-primary,
-    'hover': $cdr-color-border-secondary,
-    'active': $cdr-color-border-button-dark-active,
-    'checked': $cdr-color-border-button-dark-active,
-    'disabled': $cdr-color-border-primary,
+    'rest': $cdr-color-border-surface-selection-primary,
+    'hover': $cdr-color-border-surface-selection-primary-hover,
+    'active': $cdr-color-border-surface-selection-primary-active,
+    'checked': $cdr-color-border-surface-selection-primary-checked,
+    'disabled': $cdr-color-border-surface-selection-primary-disabled,
   ),
   'secondary': (
-    'rest': $cdr-color-border-secondary,
-    'hover': $cdr-color-border-secondary,
-    'active': $cdr-color-border-button-dark-active,
-    'checked': $cdr-color-border-button-dark-active,
-    'disabled': $cdr-color-border-secondary,
+    'rest': $cdr-color-border-surface-selection-secondary,
+    'hover': $cdr-color-border-surface-selection-secondary-hover,
+    'active': $cdr-color-border-surface-selection-secondary-active,
+    'checked': $cdr-color-border-surface-selection-secondary-checked,
+    'disabled': $cdr-color-border-surface-selection-secondary-disabled,
   ),
 );
 
-@mixin cdr-surface-selection-states-mixin($component, $variants) {
-  @each $key in $variants {
-    .cdr-#{$component}--variant-#{$key} {
-      @include cdr-background-mixin($surface-selection-background-colors, $component, $key);
-      @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key);
+@mixin cdr-surface-selection-states-inner-mixin($component, $key) {
+  @include cdr-background-mixin($background-colors, $component, $key);
+  @include cdr-border-color-mixin($border-colors, $component, $key);
 
-      @include cdr-surface-selection-hover-mixin() {
-        @include cdr-background-mixin($surface-selection-background-colors, $component, $key, 'hover');
-        @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key, 'hover');
-      }
+  @include cdr-surface-selection-hover-mixin() {
+    $state: 'hover';
+    @include cdr-background-mixin($background-colors, $component, $key, $state);
+    @include cdr-border-color-mixin($border-colors, $component, $key, $state);
+  }
 
-      @include cdr-surface-selection-active-mixin() {
-        @include cdr-background-mixin($surface-selection-background-colors, $component, $key, 'active');
-        @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key, 'active');
-      }
+  @include cdr-surface-selection-active-mixin() {
+    $state: 'active';
+    @include cdr-background-mixin($background-colors, $component, $key, $state);
+    @include cdr-border-color-mixin($border-colors, $component, $key, $state);
+  }
 
-      @include cdr-surface-selection-checked-mixin() {
-        @include cdr-background-mixin($surface-selection-background-colors, $component, $key, 'checked');
-        @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key, 'checked');
-      }
+  @include cdr-surface-selection-checked-mixin() {
+    $state: 'checked';
+    @include cdr-background-mixin($background-colors, $component, $key, $state);
+    @include cdr-border-color-mixin($border-colors, $component, $key, $state);
+  }
 
-      @include cdr-surface-selection-disabled-mixin() {
-        @include cdr-background-mixin($surface-selection-background-colors, $component, $key, 'disabled');
-        @include cdr-border-color-mixin($surface-selection-border-colors, $component, $key, 'disabled');
+  @include cdr-surface-selection-disabled-mixin() {
+    $state: 'disabled';
+    @include cdr-background-mixin($background-colors, $component, $key, $state);
+    @include cdr-border-color-mixin($border-colors, $component, $key, $state);
+  }
+}
+
+@mixin cdr-surface-selection-states-mixin($component, $modifiers: null) {
+  @if $modifiers == null {
+    $key: 'primary';
+
+    .cdr-#{$component}--modifier-#{$key} {
+      @include cdr-surface-selection-states-inner-mixin($component, $key);
+    }
+  } @else {
+    @each $key in $modifiers {
+      .cdr-#{$component}--modifier-#{$key} {
+        @include cdr-surface-selection-states-inner-mixin($component, $key);
       }
     }
   }
diff --git a/src/dev/router.js b/src/dev/router.js
index af9cc2415..d0f868fc6 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -33,7 +33,7 @@ const routes = [
   { path: '/choreographer', name: 'Choreographer', component: Examples.choreographer },
   { path: '/containers', name: 'Container', component: Examples.container },
   { path: '/formGroups', name: 'Form Groups', component: Examples.formGroup },
-  // { path: '/fulfillmentTile', name: 'FulfillmentTile', component: Examples.fulfillmentTile },
+  { path: '/fulfillmentTile', name: 'FulfillmentTile', component: Examples.fulfillmentTile },
   { path: '/grid', name: 'Grid', component: Examples.grid },
   { path: '/icons', name: 'Icons', component: Examples.icon },
   { path: '/images', name: 'Images', component: Examples.images },
diff --git a/src/lib.ts b/src/lib.ts
index 3e059d0d9..1f88ac4c6 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -13,7 +13,7 @@ export { default as CdrChipGroup } from './components/chip/CdrChipGroup.vue';
 export { default as CdrChoreographer } from './components/choreographer/CdrChoreographer.vue';
 export { default as CdrContainer } from './components/container/CdrContainer.vue';
 export { default as CdrFormGroup } from './components/formGroup/CdrFormGroup.vue';
-// export { default as CdrFulfillmentTile } from './components/fulfillmentTile/CdrFulfillmentTile.vue';
+export { default as CdrFulfillmentTile } from './components/fulfillmentTile/CdrFulfillmentTile.vue';
 export { default as CdrGrid } from './components/grid/CdrGrid.vue';
 export { default as CdrIcon } from './components/icon/CdrIcon.vue';
 export { default as CdrImg } from './components/image/CdrImg.vue';
diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index 1eee7c521..f747512bc 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -99,34 +99,32 @@ $shadows: (
 );
 
 @mixin cdr-background-mixin($options, $component, $key, $state: 'rest') {
-  @if $state == rest {
-    background: var(
-      --cdr-#{$component}-#{$key}-background-color,
-      var(--cdr-color-background-#{$component}-#{$key}, #{map.get($options, $key, $state)})
-    );
-  } @else {
-    background: var(
-      --cdr-#{$component}-#{$key}-background-color-#{$state},
-      var(
-        --cdr-color-background-#{$component}-#{$key}-#{$state},
-        #{map.get($options, $key, $state)}
-      )
-    );
+  $statePart: '';
+
+  @if $state != 'rest' {
+    $statePart: -#{$state};
   }
+
+  background: var(
+    --cdr-#{$component}-#{$key}-background-color#{$statePart},
+    var(
+      --cdr-color-background-#{$component}-#{$key}#{$statePart},
+      #{map.get($options, $key, $state)}
+    )
+  );
 }
 
 @mixin cdr-border-color-mixin($options, $component, $key, $state: 'rest') {
-  @if $state == rest {
-    --cdr-#{$component}-border-color-default: var(
-      --cdr-#{$component}-#{$key}-border-color,
-      var(--cdr-color-border-#{$component}-#{$key}, #{map.get($options, $key, $state)})
-    );
-  } @else {
-    --cdr-#{$component}-border-color-default: var(
-      --cdr-#{$component}-#{$key}-border-color-#{$state},
-      var(--cdr-color-border-#{$component}-#{$key}-#{$state}, #{map.get($options, $key, $state)})
-    );
+  $statePart: '';
+
+  @if $state != 'rest' {
+    $statePart: -#{$state};
   }
+
+  --cdr-#{$component}-border-color-default: var(
+    --cdr-#{$component}-#{$key}-border-color#{$statePart},
+    var(--cdr-color-border-#{$component}-#{$key}#{$statePart}, #{map.get($options, $key, $state)})
+  );
 }
 
 @mixin cdr-border-width-mixin($component, $key) {
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 7774545fb..a2671e1fc 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -1,12 +1,10 @@
 import type {
-  Display,
   Tag,
   Space,
   Shadow,
   Radius,
   BorderColor,
-  Position,
-  Variant,
+  Modifier,
   Background,
 } from './other';
 
@@ -162,8 +160,7 @@ export interface InlineCss {
  * @extends HtmlAttributes
  */
 export interface CdrSurfaceProps extends HtmlAttributes {
-  variant?: Variant;
-  display?: Display;
+  modifier?: Modifier;
   background?: Background;
   tag?: Tag;
   shadow?: Shadow;
@@ -171,7 +168,6 @@ export interface CdrSurfaceProps extends HtmlAttributes {
   withBorder?: boolean;
   borderWidth?: Space;
   borderColor?: BorderColor;
-  position?: Position;
   fixed?: boolean;
   m?: Space;
   mx?: Space;
@@ -196,5 +192,4 @@ export interface CdrSurfaceSelectionProps extends CdrSurfaceProps {
 
 export interface CdrFulfillmentTileProps extends CdrSurfaceSelectionProps {
   loading?: boolean;
-  typeScale?: '-1' | '0' | '1' | '2' | '3';
 }
\ No newline at end of file
diff --git a/src/types/other.ts b/src/types/other.ts
index 7ccece829..5fef31033 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -24,6 +24,4 @@ export type BorderColor =
   | 'warning'
   | 'error'
   | 'message-default-01';
-export type Position = CSS.Properties['position'];
-export type Variant = 'primary' | 'secondary';
-export type Display = CSS.Properties['display'];
\ No newline at end of file
+export type Modifier = 'primary' | 'secondary';
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index 788e17eaa..c7e2f9332 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -24,10 +24,10 @@ export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
   const classes = [baseClass];
   const inlineStyles: InlineCss = {};
 
-  // Add variant, which applies a background and border color,
+  // Add modifier, which applies a background and border color,
   // but does not apply a border width
-  if (props.variant) {
-    classes.push(`${baseClass}--variant-${props.variant}`);
+  if (props.modifier) {
+    classes.push(`${baseClass}--modifier-${props.modifier}`);
   }
 
   // Add background
@@ -63,11 +63,6 @@ export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
     classes.push(shadowClass);
   }
 
-  // Add display
-  if (props.display) {
-    inlineStyles['display'] = props.display;
-  }
-
   // Add margin and padding
   if (marginAndPaddingKeys.find((key) => props[key])) {
     marginAndPaddingKeys.forEach((key) => {

From b57035ed4c687a217279b05bbc7a5b182469624f Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 25 Jun 2024 11:53:24 -0700
Subject: [PATCH 15/70] progress check

---
 .../fulfillmentTile/CdrFulfillmentTile.vue    |  35 ++++-
 .../CdrFulfillmentTileContent.vue             |  78 ++---------
 .../styles/CdrFulfillmentTile.module.scss     |  31 ++---
 .../CdrFulfillmentTileContent.module.scss     |   5 +
 .../CdrFulfillmentTileHeader.module.scss      |  10 +-
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  57 +++-----
 .../vars/CdrFulfillmentTileContent.vars.scss  |  16 +++
 .../vars/CdrFulfillmentTileHeader.vars.scss   |  19 +++
 .../surface/styles/CdrSurface.module.scss     |  12 +-
 .../surface/styles/vars/CdrSurface.vars.scss  |  31 ++---
 .../styles/CdrSurfaceSelection.module.scss    |  18 ++-
 .../styles/vars/CdrSurfaceSelection.vars.scss | 122 ++++++++++--------
 src/styles/settings/index.scss                |  24 +++-
 13 files changed, 236 insertions(+), 222 deletions(-)
 create mode 100644 src/components/fulfillmentTile/styles/CdrFulfillmentTileContent.module.scss
 create mode 100644 src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss
 create mode 100644 src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 9157aef5c..acb20e571 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -3,6 +3,8 @@ import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
 import { CdrFulfillmentTileProps, HtmlAttributes } from '../../types/interfaces';
 import { getSurfaceProps } from '../../utils/surface';
+import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
+import CdrFulfillmentTileContent from './CdrFulfillmentTileContent.vue';
 
 /** Tile component for displaying a button with optional icon in the header */
 
@@ -10,11 +12,6 @@ defineOptions({ name: 'CdrFulfillmentTile' });
 
 const props = withDefaults(defineProps<CdrFulfillmentTileProps>(), {
   tag: 'button',
-  modifier: 'primary',
-  withBorder: true,
-  borderColor: 'primary',
-  borderWidth: 'sixteenth-x',
-  radius: 'softer',
 });
 
 const style = useCssModule();
@@ -42,7 +39,33 @@ const rootProps = computed(() => {
     :is="tag"
     v-bind="rootProps"
   >
-    Test
+    <CdrFulfillmentTileHeader>
+      <template
+        v-if="$slots['icon-left']"
+        #icon-left
+      >
+        <slot name="icon-left" />
+      </template>
+      <template #label>
+        <slot name="label" />
+      </template>
+      <template
+        v-if="$slots['icon-right']"
+        #icon-right
+      >
+        <slot name="icon-right" />
+      </template>
+    </CdrFulfillmentTileHeader>
+    <template v-if="$slots['body']">
+      <CdrFulfillmentTileContent>
+        <slot name="body" />
+      </CdrFulfillmentTileContent>
+    </template>
+    <template v-if="$slots['footer']">
+      <CdrFulfillmentTileContent :stretch="true">
+        <slot name="footer" />
+      </CdrFulfillmentTileContent>
+    </template>
   </component>
 </template>
 
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
index 6bc4295ef..f8a58fd31 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
@@ -1,88 +1,36 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
-import mapClasses from '../../utils/mapClasses';
-import CdrSurfaceSelection from '../surfaceSelection/CdrSurfaceSelection.vue';
-import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
 import CdrUtilitySans, { type utilitySansTextProps } from '../text/presets/CdrUtilitySans.vue';
-import { CdrFulfillmentTileProps } from '../../types/interfaces';
 
-/** Tile component for displaying a button with optional icon in the header */
+/** Content component for fulfillment tile */
 
 defineOptions({ name: 'CdrFulfillmentTileContent' });
 
-interface CdrFulfillmentTileProps {
-  stretch: boolean;
+interface CdrFulfillmentTileContentProps {
+  stretch?: boolean;
 }
 
-const props = withDefaults(defineProps<CdrFulfillmentTileProps>(), {
+const props = withDefaults(defineProps<CdrFulfillmentTileContentProps>(), {
   stretch: false,
 });
 
 const style = useCssModule();
 const baseClass = 'cdr-fulfillment-tile-content';
 
-// Manages the props passed along to CdrSurfaceSelection
-const rootProps = computed(() => {
-  const classes = [baseClass];
-    baseClass,
-    [style[`${baseClass}__content`]]: true,
-    [style[`${baseClass}__content--stretch`]]: props.stretch,
-  };
-
-  if(props.stretch) {
-    classes.push(`${baseClass}--stretch`);
-  }
-
-  return {
-    tag: 'div',
-    scale: '-1',
-    class: mapClasses(style, ...classes) || undefined,
-  };
-});
-
-const headerProps = computed(() => ({ class: style[`${baseClass}__header`] }));
-
-const contentProps = computed<utilitySansTextProps>(() => ({}));
-
-const footerProps = computed<utilitySansTextProps>(() => ({
+const rootProps = computed<utilitySansTextProps>(() => ({
   tag: 'div',
   scale: '-1',
-  class: { [style[`${baseClass}__content`]]: true },
+  class: {
+    baseClass: true,
+    [style[`${baseClass}__stretch`]]: props.stretch,
+  },
 }));
 </script>
 
 <template>
-  <CdrSurfaceSelection v-bind="rootProps">
-    <CdrFulfillmentTileHeader v-bind="headerProps">
-      <template
-        v-if="$slots['icon-left']"
-        #icon-left
-      >
-        <slot name="icon-left" />
-      </template>
-      <template #label>
-        <slot name="label" />
-      </template>
-      <template
-        v-if="$slots['icon-right']"
-        #icon-right
-      >
-        <slot name="icon-right" />
-      </template>
-    </CdrFulfillmentTileHeader>
-    <CdrUtilitySans
-      v-if="$slots.body"
-      v-bind="bodyProps"
-    >
-      <slot name="body" />
-    </CdrUtilitySans>
-    <CdrUtilitySans
-      v-if="$slots.footer"
-      v-bind="footerProps"
-    >
-      <slot name="footer" />
-    </CdrUtilitySans>
-  </CdrSurfaceSelection>
+  <CdrUtilitySans v-bind="rootProps">
+    <slot />
+  </CdrUtilitySans>
 </template>
 
-<style lang="scss" module src="./styles/CdrFulfillmentTile.module.scss"></style>
+<style lang="scss" module src="./styles/CdrFulfillmentTileContent.module.scss"></style>
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
index bdc33e1d3..0b49e39b2 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
@@ -1,26 +1,19 @@
-
-// $modifiers: 'primary', 'secondary';
-// $component: 'surface-selection';
-
-// .cdr-fulfillment-tile {
-//   @include cdr-fulfillment-tile-base-mixin($component);
-
-//   &__content {
-//     @include cdr-fulfillment-tile-content-mixin;
-//   }
-// }
-
 @import '../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 @import './vars/CdrFulfillmentTile.vars.scss';
 
-$component: 'fulfillment-tile';
-
-@include cdr-surface-base-mixin($component);
+@include cdr-surface-base-mixin(
+  $fulfillment-tile-background-colors,
+  $fulfillment-tile-border-colors,
+  $fulfillment-tile-component
+);
 
 .cdr-fulfillment-tile {
-  @include cdr-surface-selection-base-mixin($component);
-  @include cdr-fulfillment-tile-base-mixin($component);
+  @include cdr-surface-selection-base-mixin($fulfillment-tile-component);
+  @include cdr-fulfillment-tile-base-mixin();
+  @include cdr-surface-selection-states-mixin(
+    $fulfillment-tile-background-colors,
+    $fulfillment-tile-border-colors,
+    $fulfillment-tile-component
+  );
 }
-
-@include cdr-surface-selection-states-mixin($component);
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileContent.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileContent.module.scss
new file mode 100644
index 000000000..3f84fd473
--- /dev/null
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileContent.module.scss
@@ -0,0 +1,5 @@
+@import './vars/CdrFulfillmentTileContent.vars.scss';
+
+.cdr-fulfillment-tile-content {
+  @include cdr-fulfillment-tile-content-mixin;
+}
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
index 010a6a9a1..035b04716 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
@@ -1,5 +1,5 @@
-@import './vars/CdrFulfillmentTile.vars.scss';
-
-.cdr-fulfillment-tile-header {
-  @include cdr-fulfillment-tile-header-mixin;
-}
+@import './vars/CdrFulfillmentTileHeader.vars.scss';
+
+.cdr-fulfillment-tile-header {
+  @include cdr-fulfillment-tile-header-mixin;
+}
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index 6077afbcf..d79241517 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -1,11 +1,26 @@
+@use 'sass:map';
 @import '../../../../styles/settings/index.scss';
 @import '../../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 
-@mixin cdr-fulfillment-tile-base-mixin($component) {
-  --cdr-fulfillment-tile-background-color-checked: var(--cdr-color-background-primary);
-  --cdr-fulfillment-tile-background-color-disabled: var(
-    --cdr-color-background-button-default-disabled
-  );
+$fulfillment-tile-component: 'fulfillment-tile';
+$fulfillment-tile-background-colors: (
+  'default': (
+    'rest': map.get($surface-selection-background-colors, 'primary', 'rest'),
+    'hover': map.get($surface-selection-background-colors, 'primary', 'hover'),
+    'active': map.get($surface-selection-background-colors, 'primary', 'active'),
+    'checked': $cdr-color-background-primary,
+    'disabled': $cdr-color-background-button-default-disabled,
+  ),
+);
+$fulfillment-tile-border-colors: (
+  'default': map.get($surface-selection-border-colors, 'primary'),
+);
+
+@mixin cdr-fulfillment-tile-base-mixin() {
+  @include cdr-border-width-mixin($fulfillment-tile-component, 'sixteenth-x');
+  @include cdr-border-mixin($fulfillment-tile-component);
+  @include cdr-border-color-mixin($fulfillment-tile-border-colors, $fulfillment-tile-component);
+  @include cdr-radius-mixin($fulfillment-tile-component, 'softer');
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
@@ -16,35 +31,3 @@
   padding: var(--cdr-space-scale-one-x) 0;
 }
 
-@mixin cdr-fulfillment-tile-content-mixin() {
-  padding: 0 var(--cdr-space-scale-one-x);
-  width: 100%;
-  flex: 0 0 auto;
-
-  &--stretch {
-    flex: 1 1 auto;
-  }
-
-  strong {
-    --cdr-utility-sans-font-weight: 600;
-    font-weight: var(--cdr-utility-sans-font-weight);
-  }
-}
-
-@mixin cdr-fulfillment-tile-header-mixin() {
-  display: flex;
-  align-items: center;
-  gap: var(--cdr-space-scale-three-quarter-x);
-  width: 100%;
-  height: $cdr-space-one-and-a-half-x;
-  padding: 0 var(--cdr-space-scale-one-x);
-
-  &__icon {
-    flex: 0 0 auto;
-    fill: var(--cdr-fulfillment-tile-icon-fill);
-  }
-
-  &__label {
-    flex: 1 1 auto;
-  }
-}
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss
new file mode 100644
index 000000000..2bcfb47b2
--- /dev/null
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss
@@ -0,0 +1,16 @@
+@import '../../../../styles/settings/index.scss';
+
+@mixin cdr-fulfillment-tile-content-mixin() {
+  padding: 0 var(--cdr-space-scale-one-x);
+  width: 100%;
+  flex: 0 0 auto;
+
+  &--stretch {
+    flex: 1 1 auto;
+  }
+
+  strong {
+    --cdr-utility-sans-font-weight: 600;
+    font-weight: var(--cdr-utility-sans-font-weight);
+  }
+}
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
new file mode 100644
index 000000000..022c31001
--- /dev/null
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
@@ -0,0 +1,19 @@
+@import '../../../../styles/settings/index.scss';
+
+@mixin cdr-fulfillment-tile-header-mixin() {
+  display: flex;
+  align-items: center;
+  gap: var(--cdr-space-scale-three-quarter-x);
+  width: 100%;
+  height: $cdr-space-one-and-a-half-x;
+  padding: 0 var(--cdr-space-scale-one-x);
+
+  &__icon {
+    flex: 0 0 auto;
+    fill: var(--cdr-fulfillment-tile-icon-fill);
+  }
+
+  &__label {
+    flex: 1 1 auto;
+  }
+}
diff --git a/src/components/surface/styles/CdrSurface.module.scss b/src/components/surface/styles/CdrSurface.module.scss
index 8523041c7..f65d376e5 100644
--- a/src/components/surface/styles/CdrSurface.module.scss
+++ b/src/components/surface/styles/CdrSurface.module.scss
@@ -1,9 +1,11 @@
 @import '../../../styles/settings/index.scss';
 @import './vars/CdrSurface.vars.scss';
 
-$modifiers: 'primary', 'secondary';
-$component: 'surface';
+@include cdr-surface-base-mixin($surface-background-colors, $surface-border-colors, $surface-component);
 
-@include cdr-surface-base-mixin($component);
-
-@include cdr-surface-modifiers-mixin($component, $modifiers);
+@include cdr-surface-modifiers-mixin(
+  $surface-background-colors,
+  $surface-border-colors,
+  $surface-component,
+  $surface-modifiers
+);
diff --git a/src/components/surface/styles/vars/CdrSurface.vars.scss b/src/components/surface/styles/vars/CdrSurface.vars.scss
index 28e2c4ef5..9a9e4aaa8 100644
--- a/src/components/surface/styles/vars/CdrSurface.vars.scss
+++ b/src/components/surface/styles/vars/CdrSurface.vars.scss
@@ -1,7 +1,9 @@
 @use 'sass:map';
 @import '../../../../styles/settings/index.scss';
 
-$background-colors: (
+$surface-modifiers: 'primary', 'secondary';
+$surface-component: 'surface';
+$surface-background-colors: (
   'primary': (
     'rest': $cdr-color-background-surface-primary,
   ),
@@ -9,8 +11,7 @@ $background-colors: (
     'rest': $cdr-color-background-surface-secondary,
   ),
 );
-
-$border-colors: (
+$surface-border-colors: (
   'primary': (
     'rest': $cdr-color-border-surface-primary,
   ),
@@ -19,16 +20,16 @@ $border-colors: (
   ),
 );
 
-@mixin cdr-surface-base-mixin($component) {
-  @each $key, $value in $background-colors {
-    .cdr-#{$component}--background-#{$key} {
-      @include cdr-background-mixin($background-colors, $component, $key);
+@mixin cdr-surface-base-mixin($background-colors, $border-colors, $component) {
+  @each $modifier, $value in $background-colors {
+    .cdr-#{$component}--background-#{$modifier} {
+      @include cdr-background-mixin($background-colors, $component, $modifier);
     }
   }
 
-  @each $key, $value in $border-colors {
-    .cdr-#{$component}--border-color-#{$key} {
-      @include cdr-border-color-mixin($border-colors, $component, $key);
+  @each $modifier, $value in $border-colors {
+    .cdr-#{$component}--border-color-#{$modifier} {
+      @include cdr-border-color-mixin($border-colors, $component, $modifier);
     }
   }
 
@@ -55,11 +56,11 @@ $border-colors: (
   }
 }
 
-@mixin cdr-surface-modifiers-mixin($component, $modifiers) {
-  @each $key in $modifiers {
-    .cdr-#{$component}--modifier-#{$key} {
-      @include cdr-background-mixin($background-colors, $component, $key);
-      @include cdr-border-color-mixin($border-colors, $component, $key);
+@mixin cdr-surface-modifiers-mixin($background-colors, $border-colors, $component, $modifiers) {
+  @each $modifier in $modifiers {
+    .cdr-#{$component}--modifier-#{$modifier} {
+      @include cdr-background-mixin($background-colors, $component, $modifier);
+      @include cdr-border-color-mixin($border-colors, $component, $modifier);
     }
   }
 }
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
index 54a8ed11b..794819a86 100644
--- a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
@@ -1,13 +1,19 @@
 @import './vars/CdrSurfaceSelection.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
-$modifiers: 'primary', 'secondary';
-$component: 'surface-selection';
-
-@include cdr-surface-base-mixin($component);
+@include cdr-surface-base-mixin(
+  $surface-selection-background-colors,
+  $surface-selection-border-colors,
+  $surface-selection-component
+);
 
 .cdr-surface-selection {
-  @include cdr-surface-selection-base-mixin($component);
+  @include cdr-surface-selection-base-mixin($surface-selection-component);
 }
 
-@include cdr-surface-selection-states-mixin($component, $modifiers);
+@include cdr-surface-selection-states-modifiers-mixin(
+  $surface-selection-background-colors,
+  $surface-selection-border-colors,
+  $surface-selection-component,
+  $surface-selection-modifiers
+);
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index e489013fc..95f82fad8 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -1,5 +1,40 @@
 @import '../../../../styles/settings/index.scss';
 
+$surface-selection-modifiers: 'primary', 'secondary';
+$surface-selection-component: 'surface-selection';
+$surface-selection-background-colors: (
+  'primary': (
+    'rest': '$cdr-color-background-surface-selection-primary',
+    'hover': $cdr-color-background-surface-selection-primary-hover,
+    'active': $cdr-color-background-surface-selection-primary-active,
+    'checked': $cdr-color-background-surface-selection-primary-checked,
+    'disabled': $cdr-color-background-surface-selection-primary-disabled,
+  ),
+  'secondary': (
+    'rest': $cdr-color-background-surface-selection-secondary,
+    'hover': $cdr-color-background-surface-selection-secondary-hover,
+    'active': $cdr-color-background-surface-selection-secondary-active,
+    'checked': $cdr-color-background-surface-selection-secondary-checked,
+    'disabled': $cdr-color-background-surface-selection-secondary-disabled,
+  ),
+);
+$surface-selection-border-colors: (
+  'primary': (
+    'rest': $cdr-color-border-surface-selection-primary,
+    'hover': $cdr-color-border-surface-selection-primary-hover,
+    'active': $cdr-color-border-surface-selection-primary-active,
+    'checked': $cdr-color-border-surface-selection-primary-checked,
+    'disabled': $cdr-color-border-surface-selection-primary-disabled,
+  ),
+  'secondary': (
+    'rest': $cdr-color-border-surface-selection-secondary,
+    'hover': $cdr-color-border-surface-selection-secondary-hover,
+    'active': $cdr-color-border-surface-selection-secondary-active,
+    'checked': $cdr-color-border-surface-selection-secondary-checked,
+    'disabled': $cdr-color-border-surface-selection-secondary-disabled,
+  ),
+);
+
 @mixin cdr-surface-selection-disabled-mixin() {
   &:disabled,
   &:disabled:hover,
@@ -71,81 +106,54 @@
   }
 }
 
-$background-colors: (
-  'primary': (
-    'rest': $cdr-color-background-surface-selection-primary,
-    'hover': $cdr-color-background-surface-selection-primary-hover,
-    'active': $cdr-color-background-surface-selection-primary-active,
-    'checked': $cdr-color-background-surface-selection-primary-checked,
-    'disabled': $cdr-color-background-surface-selection-primary-disabled,
-  ),
-  'secondary': (
-    'rest': $cdr-color-background-surface-selection-secondary,
-    'hover': $cdr-color-background-surface-selection-secondary-hover,
-    'active': $cdr-color-background-surface-selection-secondary-active,
-    'checked': $cdr-color-background-surface-selection-secondary-checked,
-    'disabled': $cdr-color-background-surface-selection-secondary-disabled,
-  ),
-);
-
-$border-colors: (
-  'primary': (
-    'rest': $cdr-color-border-surface-selection-primary,
-    'hover': $cdr-color-border-surface-selection-primary-hover,
-    'active': $cdr-color-border-surface-selection-primary-active,
-    'checked': $cdr-color-border-surface-selection-primary-checked,
-    'disabled': $cdr-color-border-surface-selection-primary-disabled,
-  ),
-  'secondary': (
-    'rest': $cdr-color-border-surface-selection-secondary,
-    'hover': $cdr-color-border-surface-selection-secondary-hover,
-    'active': $cdr-color-border-surface-selection-secondary-active,
-    'checked': $cdr-color-border-surface-selection-secondary-checked,
-    'disabled': $cdr-color-border-surface-selection-secondary-disabled,
-  ),
-);
-
-@mixin cdr-surface-selection-states-inner-mixin($component, $key) {
-  @include cdr-background-mixin($background-colors, $component, $key);
-  @include cdr-border-color-mixin($border-colors, $component, $key);
+@mixin cdr-surface-selection-states-mixin(
+  $background-colors,
+  $border-colors,
+  $component,
+  $modifier: 'default'
+) {
+  @include cdr-background-mixin($background-colors, $component, $modifier);
+  @include cdr-border-color-mixin($border-colors, $component, $modifier);
 
   @include cdr-surface-selection-hover-mixin() {
     $state: 'hover';
-    @include cdr-background-mixin($background-colors, $component, $key, $state);
-    @include cdr-border-color-mixin($border-colors, $component, $key, $state);
+    @include cdr-background-mixin($background-colors, $component, $modifier, $state);
+    @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
   @include cdr-surface-selection-active-mixin() {
     $state: 'active';
-    @include cdr-background-mixin($background-colors, $component, $key, $state);
-    @include cdr-border-color-mixin($border-colors, $component, $key, $state);
+    @include cdr-background-mixin($background-colors, $component, $modifier, $state);
+    @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
   @include cdr-surface-selection-checked-mixin() {
     $state: 'checked';
-    @include cdr-background-mixin($background-colors, $component, $key, $state);
-    @include cdr-border-color-mixin($border-colors, $component, $key, $state);
+    @include cdr-background-mixin($background-colors, $component, $modifier, $state);
+    @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
   @include cdr-surface-selection-disabled-mixin() {
     $state: 'disabled';
-    @include cdr-background-mixin($background-colors, $component, $key, $state);
-    @include cdr-border-color-mixin($border-colors, $component, $key, $state);
+    @include cdr-background-mixin($background-colors, $component, $modifier, $state);
+    @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 }
 
-@mixin cdr-surface-selection-states-mixin($component, $modifiers: null) {
-  @if $modifiers == null {
-    $key: 'primary';
-
-    .cdr-#{$component}--modifier-#{$key} {
-      @include cdr-surface-selection-states-inner-mixin($component, $key);
-    }
-  } @else {
-    @each $key in $modifiers {
-      .cdr-#{$component}--modifier-#{$key} {
-        @include cdr-surface-selection-states-inner-mixin($component, $key);
-      }
+@mixin cdr-surface-selection-states-modifiers-mixin(
+  $background-colors,
+  $border-colors,
+  $component,
+  $modifiers
+) {
+  @each $modifier in $modifiers {
+    .cdr-#{$component}--modifier-#{$modifier} {
+      @include cdr-surface-selection-states-mixin(
+        $background-colors,
+        $border-colors,
+        $component,
+        $modifier
+      );
     }
   }
 }
diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index f747512bc..64312e0ca 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -98,32 +98,42 @@ $shadows: (
   'lifted': $cdr-prominence-lifted,
 );
 
-@mixin cdr-background-mixin($options, $component, $key, $state: 'rest') {
+@mixin cdr-background-mixin($options, $component, $modifier: 'default', $state: 'rest') {
   $statePart: '';
+  $modifierPart: '';
 
   @if $state != 'rest' {
     $statePart: -#{$state};
   }
 
+  @if $modifier != 'default' {
+    $modifierPart: -#{$modifier};
+  }
+
   background: var(
-    --cdr-#{$component}-#{$key}-background-color#{$statePart},
+    --cdr-#{$component}#{$modifierPart}-background-color#{$statePart},
     var(
-      --cdr-color-background-#{$component}-#{$key}#{$statePart},
-      #{map.get($options, $key, $state)}
+      --cdr-color-background-#{$component}#{$modifierPart}#{$statePart},
+      #{map.get($options, $modifier, $state)}
     )
   );
 }
 
-@mixin cdr-border-color-mixin($options, $component, $key, $state: 'rest') {
+@mixin cdr-border-color-mixin($options, $component, $modifier: 'default', $state: 'rest') {
   $statePart: '';
+  $modifierPart: '';
 
   @if $state != 'rest' {
     $statePart: -#{$state};
   }
 
+  @if $modifier != 'default' {
+    $modifierPart: -#{$modifier};
+  }
+
   --cdr-#{$component}-border-color-default: var(
-    --cdr-#{$component}-#{$key}-border-color#{$statePart},
-    var(--cdr-color-border-#{$component}-#{$key}#{$statePart}, #{map.get($options, $key, $state)})
+    --cdr-#{$component}#{$modifierPart}-border-color#{$statePart},
+    var(--cdr-color-border-#{$component}#{$modifierPart}#{$statePart}, #{map.get($options, $modifier, $state)})
   );
 }
 

From 8e00b52c60d2fa888024384078fb6ba5ae0c5ea2 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 2 Jul 2024 09:41:04 -0700
Subject: [PATCH 16/70] progress check

---
 .../fulfillmentTile/CdrFulfillmentTile.vue    |   4 +-
 .../CdrFulfillmentTileContent.vue             |   4 +-
 .../__tests__/CdrFulfillmentTile.spec.js      |  82 ++++-
 .../CdrFulfillmentTile.spec.js.snap           | 280 ++++++++++++++++--
 .../CdrFulfillmentTileHeader.spec.js.snap     |  43 ---
 .../examples/FulfillmentTile.vue              |  85 +++---
 .../styles/vars/CdrFulfillmentTile.vars.scss  |   1 -
 .../surface/__tests__/CdrSurface.spec.js      |  32 +-
 .../__tests__/CdrSurfaceSelection.spec.js     |  84 ++++++
 .../CdrSurfaceSelection.spec.js.snap          |  51 ++++
 .../styles/vars/CdrSurfaceSelection.vars.scss |   2 +-
 src/types/other.ts                            |   2 -
 12 files changed, 523 insertions(+), 147 deletions(-)
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
 create mode 100644 src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
 create mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index acb20e571..b4505d1df 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -57,12 +57,12 @@ const rootProps = computed(() => {
       </template>
     </CdrFulfillmentTileHeader>
     <template v-if="$slots['body']">
-      <CdrFulfillmentTileContent>
+      <CdrFulfillmentTileContent :stretch="true">
         <slot name="body" />
       </CdrFulfillmentTileContent>
     </template>
     <template v-if="$slots['footer']">
-      <CdrFulfillmentTileContent :stretch="true">
+      <CdrFulfillmentTileContent>
         <slot name="footer" />
       </CdrFulfillmentTileContent>
     </template>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
index f8a58fd31..502f21ee2 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
@@ -21,8 +21,8 @@ const rootProps = computed<utilitySansTextProps>(() => ({
   tag: 'div',
   scale: '-1',
   class: {
-    baseClass: true,
-    [style[`${baseClass}__stretch`]]: props.stretch,
+    [style[baseClass]]: true,
+    [style[`${baseClass}--stretch`]]: props.stretch,
   },
 }));
 </script>
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
index adf49a8a7..d72add90d 100644
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
@@ -1,27 +1,95 @@
-import { shallowMount } from '../../../../test/vue-jest-style-workaround.js';
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
 import CdrFulfillmentTile from '../CdrFulfillmentTile.vue';
 
 describe('CdrFulfillmentTile', () => {
-  it('icon left configuration', () => {
-    const wrapper = shallowMount(CdrFulfillmentTile, {
+  describe('snapshot test', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrFulfillmentTile, { props: { checked: false } });
+    });
+    it('renders correctly', () => {
+      expect(wrapper.element).toMatchSnapshot();
+    });
+  });
+
+  describe('component unit tests', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrFulfillmentTile, { props: { checked: false } });
+    });
+
+    describe('default component with no configuration', () => {
+      it('renders correctly', () => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
+      it('sets the default tag prop correctly', () => {
+        expect(wrapper.element.tagName).toBe('BUTTON');
+      });
+      it('base classes only', () => {
+        expect(wrapper.classes()).toEqual(['cdr-fulfillment-tile']);
+      });
+    });
+  });
+
+  it('supports icon left configuration', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
       slots: {
         'icon-left': 'X',
         label: 'Label slot',
         body: 'Body slot',
         footer: 'Footer slot',
-      }
+      },
     });
     expect(wrapper.element).toMatchSnapshot();
   });
-  it('icon right configuration', () => {
-    const wrapper = shallowMount(CdrFulfillmentTile, {
+
+  it('supports  icon right configuration', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
       slots: {
         'icon-right': 'X',
         label: 'Label slot',
         body: 'Body slot',
         footer: 'Footer slot',
-      }
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('shows header', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
+      slots: {
+        label: 'Label slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-fulfillment-tile-header').text()).toBe('Label slot');
+  });
+
+  it('shows body', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
+      slots: {
+        label: 'Label slot',
+        body: 'Body slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-fulfillment-tile-content--stretch').text()).toBe('Body slot');
+
+  });
+
+  it('shows footer', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
+      slots: {
+        label: 'Label slot',
+        footer: 'Footer slot',
+      },
     });
+    expect(wrapper.find('.cdr-fulfillment-tile-content').text()).toBe('Footer slot');
     expect(wrapper.element).toMatchSnapshot();
   });
 });
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
index 0bea2911e..8de26fe82 100644
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -1,25 +1,269 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`CdrFulfillmentTile > icon left configuration 1`] = `
-<cdr-surface-selection-stub
-  background="transparent"
-  checked="false"
+exports[`CdrFulfillmentTile > component unit tests > default component with no configuration > renders correctly 1`] = `
+<button
+  aria-checked="false"
   class="cdr-fulfillment-tile"
-  fixed="false"
-  loading="false"
-  tag="button"
-  withborder="false"
-/>
+>
+  <div
+    class="cdr-fulfillment-tile-header"
+  >
+    <!--v-if-->
+    <span
+      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    >
+      
+      
+    </span>
+    <!--v-if-->
+  </div>
+  <!--v-if-->
+  <!--v-if-->
+</button>
 `;
 
-exports[`CdrFulfillmentTile > icon right configuration 1`] = `
-<cdr-surface-selection-stub
-  background="transparent"
-  checked="false"
+exports[`CdrFulfillmentTile > shows body 1`] = `
+<button
+  aria-checked="false"
   class="cdr-fulfillment-tile"
-  fixed="false"
-  loading="false"
-  tag="button"
-  withborder="false"
-/>
+>
+  <div
+    class="cdr-fulfillment-tile-header"
+  >
+    <!--v-if-->
+    <span
+      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    >
+      
+      
+      
+      Label slot
+      
+      
+      
+    </span>
+    <!--v-if-->
+  </div>
+  <div
+    class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+  >
+    
+    
+    
+    Body slot
+    
+    
+    
+  </div>
+  <!--v-if-->
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows footer 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile"
+>
+  <div
+    class="cdr-fulfillment-tile-header"
+  >
+    <!--v-if-->
+    <span
+      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    >
+      
+      
+      
+      Label slot
+      
+      
+      
+    </span>
+    <!--v-if-->
+  </div>
+  <!--v-if-->
+  <div
+    class="cdr-utility-sans cdr-fulfillment-tile-content"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+  >
+    
+    
+    
+    Footer slot
+    
+    
+    
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows header 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile"
+>
+  <div
+    class="cdr-fulfillment-tile-header"
+  >
+    <!--v-if-->
+    <span
+      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    >
+      
+      
+      
+      Label slot
+      
+      
+      
+    </span>
+    <!--v-if-->
+  </div>
+  <!--v-if-->
+  <!--v-if-->
+</button>
+`;
+
+exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile"
+>
+  <div
+    class="cdr-fulfillment-tile-header"
+  >
+    <!--v-if-->
+    <span
+      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    >
+      
+      
+    </span>
+    <!--v-if-->
+  </div>
+  <!--v-if-->
+  <!--v-if-->
+</button>
+`;
+
+exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile"
+>
+  <div
+    class="cdr-fulfillment-tile-header"
+  >
+    <!--v-if-->
+    <span
+      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    >
+      
+      
+      
+      Label slot
+      
+      
+      
+    </span>
+    <span
+      class="cdr-fulfillment-tile-header__icon"
+    >
+      
+      
+      X
+      
+      
+    </span>
+  </div>
+  <div
+    class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+  >
+    
+    
+    
+    Body slot
+    
+    
+    
+  </div>
+  <div
+    class="cdr-utility-sans cdr-fulfillment-tile-content"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+  >
+    
+    
+    
+    Footer slot
+    
+    
+    
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile"
+>
+  <div
+    class="cdr-fulfillment-tile-header"
+  >
+    <span
+      class="cdr-fulfillment-tile-header__icon"
+    >
+      
+      
+      X
+      
+      
+    </span>
+    <span
+      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    >
+      
+      
+      
+      Label slot
+      
+      
+      
+    </span>
+    <!--v-if-->
+  </div>
+  <div
+    class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+  >
+    
+    
+    
+    Body slot
+    
+    
+    
+  </div>
+  <div
+    class="cdr-utility-sans cdr-fulfillment-tile-content"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+  >
+    
+    
+    
+    Footer slot
+    
+    
+    
+  </div>
+</button>
 `;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
deleted file mode 100644
index 77cc463ff..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
+++ /dev/null
@@ -1,43 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-header"
->
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    
-    X
-    
-  </span>
-  <cdr-utility-sans-stub
-    class="cdr-fulfillment-tile-header__label"
-    scale="-1"
-    strong="true"
-    tag="span"
-  />
-  <!--v-if-->
-</div>
-`;
-
-exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-header"
->
-  <!--v-if-->
-  <cdr-utility-sans-stub
-    class="cdr-fulfillment-tile-header__label"
-    scale="-1"
-    strong="true"
-    tag="span"
-  />
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    
-    X
-    
-  </span>
-</div>
-`;
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 87d51f4c3..711680676 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -2,6 +2,7 @@
 import { ref } from 'vue';
 import CdrFulfillmentTile from '../CdrFulfillmentTile.vue';
 import CdrFulfillmentTileHeader from '../CdrFulfillmentTileHeader.vue';
+import CdrFulfillmentTileContent from '../CdrFulfillmentTileContent.vue';
 import { IconCheckFill, IconErrorFill, IconXFill } from '../../icon';
 import CdrButton from '../../button/CdrButton.vue';
 import CdrSurface from '../../surface/CdrSurface.vue';
@@ -250,6 +251,8 @@ const toggleCheckbox2 = (value: number) => {
         class="example__search-tile-other"
         :border-width="checkbox2.includes(1) ? 'eighth-x' : 'sixteenth-x'"
         :with-border="true"
+        :border-color="checkbox2.includes(1) ? 'secondary' : 'primary'"
+        radius="softer"
       >
         <CdrSurfaceSelection
           class="example__search-tile-other-header-button"
@@ -280,20 +283,17 @@ const toggleCheckbox2 = (value: number) => {
             </template>
             <template #label>Store Pickup (32)</template>
           </CdrFulfillmentTileHeader>
-          <CdrUtilitySans
-            class="example__search-tile-other-header-content"
-            scale="-1"
-            tag="div"
-          >
+          <CdrFulfillmentTileContent class="example__search-tile-other-header-content">
             In stock at
             <strong>Encinitas</strong>
-          </CdrUtilitySans>
+          </CdrFulfillmentTileContent>
         </CdrSurfaceSelection>
         <hr class="example__search-tile-other-header-hr" />
         <CdrButton
           class="example__change-store-other"
           :full-width="true"
           modifier="link"
+          size="small"
         >
           Change store
         </CdrButton>
@@ -305,6 +305,7 @@ const toggleCheckbox2 = (value: number) => {
 <style lang="scss">
 @import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
 @import '../styles/vars/CdrFulfillmentTile.vars.scss';
+@import '../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 
 @mixin tile-colors() {
   &[aria-pressed='true'],
@@ -362,48 +363,46 @@ const toggleCheckbox2 = (value: number) => {
     margin-bottom: var(--cdr-space-scale-half-x);
   }
 
-  // &__checkout-tile-other-disabled {
-  //   --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-  //   --cdr-palette-background-rest: var(--cdr-color-background-button-default-disabled);
-  //   --cdr-palette-border-color: var(--cdr-color-border-primary);
+  &__checkout-tile-other-disabled {
+    --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
+    --cdr-color-background-fulfillment-tile: var(--cdr-color-background-button-default-disabled);
+    --cdr-color-background-fulfillment-tile-checked: var(
+      --cdr-color-background-button-default-disabled
+    );
+  }
 
-  //   &[aria-pressed='true'],
-  //   &[aria-checked='true'] {
-  //     --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-  //     --cdr-palette-background-checked: var(--cdr-color-background-button-default-disabled);
-  //     --cdr-palette-border-color: var(--cdr-palette-border-color-checked);
-  //   }
-  // }
+  &__search-tile-other {
+    gap: 0;
+    padding-top: 0;
+    padding-bottom: 0;
+  }
 
-  // &__search-tile-other {
-  //   @include cdr-fulfillment-tile-base-mixin;
-  //   gap: 0;
-  //   padding-top: 0;
-  //   padding-bottom: 0;
-  // }
+  &__search-tile-other-header-button {
+    --cdr-surface-selection-border-width-default: 0;
+    --cdr-color-background-surface-selection-primary-checked: var(--cdr-color-background-primary);
+    padding: var(--cdr-space-scale-one-x) 0;
+    width: 100%;
+    @include tile-colors;
 
-  // &__search-tile-other-header-button {
-  //   --cdr-action-border-width-checked: 0;
-  //   padding: var(--cdr-space-scale-one-x) 0;
-  //   width: 100%;
-  //   @include tile-colors;
-  // }
+    @include cdr-surface-selection-checked-mixin() {
+      --cdr-surface-selection-border-width-default: 0;
+    }
+  }
 
-  // &__search-tile-other-header-content {
-  //   @include cdr-fulfillment-tile-content-mixin;
-  //   margin-top: var(--cdr-space-scale-half-x);
-  // }
+  &__search-tile-other-header-content {
+    margin-top: var(--cdr-space-scale-half-x);
+  }
 
-  // &__search-tile-other-header-hr {
-  //   margin: 0;
-  //   border-top: var(--cdr-space-scale-sixteenth-x) solid initial;
-  //   width: 100%;
-  // }
+  &__search-tile-other-header-hr {
+    margin: 0;
+    border-top: var(--cdr-space-scale-sixteenth-x) solid initial;
+    width: 100%;
+  }
 
-  // &__change-store-other {
-  //   padding: var(--cdr-space-scale-three-quarter-x) var(--cdr-space-scale-one-x)
-  //     var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x);
-  //   justify-content: flex-start;
-  // }
+  &__change-store-other {
+    padding: var(--cdr-space-scale-three-quarter-x) var(--cdr-space-scale-one-x)
+      var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x);
+    justify-content: flex-start;
+  }
 }
 </style>
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index d79241517..02ea6e66a 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -19,7 +19,6 @@ $fulfillment-tile-border-colors: (
 @mixin cdr-fulfillment-tile-base-mixin() {
   @include cdr-border-width-mixin($fulfillment-tile-component, 'sixteenth-x');
   @include cdr-border-mixin($fulfillment-tile-component);
-  @include cdr-border-color-mixin($fulfillment-tile-border-colors, $fulfillment-tile-component);
   @include cdr-radius-mixin($fulfillment-tile-component, 'softer');
   display: flex;
   align-items: flex-start;
diff --git a/src/components/surface/__tests__/CdrSurface.spec.js b/src/components/surface/__tests__/CdrSurface.spec.js
index a077a66cd..5c849054c 100644
--- a/src/components/surface/__tests__/CdrSurface.spec.js
+++ b/src/components/surface/__tests__/CdrSurface.spec.js
@@ -1,6 +1,5 @@
-import { shallowMount, mount } from '../../../../test/vue-jest-style-workaround.js';
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
 import CdrSurface from '../CdrSurface.vue';
-import sinon from 'sinon'
 
 describe('CdrSurface', () => {
   describe('snapshot test', () => {
@@ -10,13 +9,10 @@ describe('CdrSurface', () => {
     })
     it('renders correctly', () => {
       wrapper.setProps({
-        display: 'flex',
-        background: 'secondary',
-        palette: 'secondary',
+        modifier: 'primary',
         radius: 'soft',
         withBorder: true,
         borderWidth: 'one-x',
-        position: 'absolute',
         p: 'three-x',
         m: 'one-x',
       })
@@ -27,7 +23,7 @@ describe('CdrSurface', () => {
   describe('component unit tests', () => {
     let wrapper;
     beforeEach(() => {
-      wrapper = shallowMount(CdrSurface);
+      wrapper = mount(CdrSurface);
     });
 
     describe('default component with no configuration', () => {
@@ -53,25 +49,5 @@ describe('CdrSurface', () => {
         expect(wrapper.element.tagName).toBe('A');
       });
     })
-
-    // describe('when "iconOnly" and "withBackground" is set to true', () => {
-    //   beforeEach(() => {
-    //     wrapper.setProps({
-    //       iconOnly: true,
-    //       withBackground: true,
-    //     });
-    //   });
-    //   it('renders correctly', () => {
-    //     expect(wrapper.element).toMatchSnapshot();
-    //   });
-    //   it('adds class for icon only', () => {
-    //     expect(wrapper.classes()).toContain('cdr-button--icon-only');
-    //   });
-
-    //   it('adds class for icon background', () => {
-    //     expect(wrapper.classes()).toContain('cdr-button--with-background');
-    //   });
-    // })
-
   })
-});
\ No newline at end of file
+});
diff --git a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
new file mode 100644
index 000000000..2fad1b880
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
@@ -0,0 +1,84 @@
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
+
+describe('CdrSurfaceSelection', () => {
+  describe('snapshot test', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
+    });
+    it('renders correctly', () => {
+      wrapper.setProps({
+        checked: true,
+        modifier: 'primary',
+        radius: 'soft',
+        withBorder: true,
+        borderWidth: 'one-x',
+        p: 'three-x',
+        m: 'one-x',
+      });
+      expect(wrapper.element).toMatchSnapshot();
+    });
+  });
+
+  describe('component unit tests', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
+    });
+
+    describe('default component with no configuration', () => {
+      it('renders correctly', () => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
+      it('sets the default tag prop correctly', () => {
+        expect(wrapper.element.tagName).toBe('BUTTON');
+      });
+      it('base classes only', () => {
+        expect(wrapper.classes()).toEqual([
+          'cdr-surface-selection',
+          'cdr-surface-selection--modifier-primary',
+        ]);
+      });
+    });
+
+    describe('aria attribute correct when checked', () => {
+      beforeEach(() => {
+        wrapper.setProps({ checked: true });
+      });
+      it('renders correctly', () => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
+      it('renders aria checked', () => {
+        expect(wrapper.attributes('aria-checked')).toBe('true');
+      });
+    });
+
+    describe('aria attribute correct when not checked', () => {
+      beforeEach(() => {
+        wrapper.setProps({ checked: false });
+      });
+      it('renders correctly', () => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
+      it('renders aria not checked', () => {
+        expect(wrapper.attributes('aria-checked')).toBe('false');
+      });
+    });
+
+    describe('correct class with secondary modifier', () => {
+      beforeEach(() => {
+        wrapper.setProps({ modifier: 'secondary' });
+      });
+      it('renders correctly', () => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
+      it('correct classes', () => {
+        expect(wrapper.classes()).toEqual([
+          'cdr-surface-selection',
+          'cdr-surface-selection--modifier-secondary',
+        ]);
+      });
+    });
+  });
+});
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
new file mode 100644
index 000000000..774d1acf7
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -0,0 +1,51 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurfaceSelection > component unit tests > aria attribute correct when checked > renders correctly 1`] = `
+<button
+  aria-checked="true"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+>
+  
+  
+</button>
+`;
+
+exports[`CdrSurfaceSelection > component unit tests > aria attribute correct when not checked > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+>
+  
+  
+</button>
+`;
+
+exports[`CdrSurfaceSelection > component unit tests > correct class with secondary modifier > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-secondary"
+>
+  
+  
+</button>
+`;
+
+exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+>
+  
+  
+</button>
+`;
+
+exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+>
+  
+  
+</button>
+`;
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index 95f82fad8..6e46e908f 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -4,7 +4,7 @@ $surface-selection-modifiers: 'primary', 'secondary';
 $surface-selection-component: 'surface-selection';
 $surface-selection-background-colors: (
   'primary': (
-    'rest': '$cdr-color-background-surface-selection-primary',
+    'rest': $cdr-color-background-surface-selection-primary,
     'hover': $cdr-color-background-surface-selection-primary-hover,
     'active': $cdr-color-background-surface-selection-primary-active,
     'checked': $cdr-color-background-surface-selection-primary-checked,
diff --git a/src/types/other.ts b/src/types/other.ts
index 5fef31033..043407937 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -1,5 +1,3 @@
-import type * as CSS from 'csstype';
-
 export type Tag = keyof HTMLElementTagNameMap;
 export type Space =
   | 'zero'

From c338043f78b808dc2ca6e940009fcbe7f50f0b30 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 2 Jul 2024 15:05:18 -0700
Subject: [PATCH 17/70] progress check

---
 .../CdrFulfillmentTileContent.spec.js         | 32 +++++++++
 .../CdrFulfillmentTileHeader.spec.js          | 21 ++++--
 .../CdrFulfillmentTileContent.spec.js.snap    | 27 +++++++
 .../CdrFulfillmentTileHeader.spec.js.snap     | 70 +++++++++++++++++++
 .../examples/FulfillmentTile.vue              | 27 ++++++-
 5 files changed, 170 insertions(+), 7 deletions(-)
 create mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap

diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
new file mode 100644
index 000000000..7da8aa845
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
@@ -0,0 +1,32 @@
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrFulfillmentTileContent from '../CdrFulfillmentTileContent.vue';
+
+describe('CdrFulfillmentTileContent', () => {
+  it('shows content', () => {
+    const wrapper = mount(CdrFulfillmentTileContent, {
+      slots: {
+        default: 'Default slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.classes()).toEqual(['cdr-utility-sans', 'cdr-fulfillment-tile-content']);
+    expect(wrapper.text()).toBe('Default slot');
+  });
+
+  it('is stretch', () => {
+    const wrapper = mount(CdrFulfillmentTileContent, {
+      props: {
+        stretch: true,
+      },
+      slots: {
+        default: 'Default slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.classes()).toEqual([
+      'cdr-utility-sans',
+      'cdr-fulfillment-tile-content',
+      'cdr-fulfillment-tile-content--stretch',
+    ]);
+  });
+});
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
index 21dbccff1..376e8bb8e 100644
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
@@ -1,23 +1,34 @@
-import { shallowMount } from '../../../../test/vue-jest-style-workaround.js';
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
 import CdrFulfillmentTileHeader from '../CdrFulfillmentTileHeader.vue';
 
 describe('CdrFulfillmentTileHeader', () => {
   it('icon left configuration', () => {
-    const wrapper = shallowMount(CdrFulfillmentTileHeader, {
+    const wrapper = mount(CdrFulfillmentTileHeader, {
       slots: {
         'icon-left': 'X',
         label: 'Label slot',
-      }
+      },
     });
     expect(wrapper.element).toMatchSnapshot();
   });
+
   it('icon right configuration', () => {
-    const wrapper = shallowMount(CdrFulfillmentTileHeader, {
+    const wrapper = mount(CdrFulfillmentTileHeader, {
       slots: {
         'icon-right': 'X',
         label: 'Label slot',
-      }
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('shows label', () => {
+    const wrapper = mount(CdrFulfillmentTileHeader, {
+      slots: {
+        label: 'Label slot',
+      },
     });
     expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-fulfillment-tile-header__label').text()).toBe('Label slot');
   });
 });
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
new file mode 100644
index 000000000..61d1ddd97
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
@@ -0,0 +1,27 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileContent > is stretch 1`] = `
+<div
+  class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+  style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+>
+  
+  
+  Default slot
+  
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileContent > shows content 1`] = `
+<div
+  class="cdr-utility-sans cdr-fulfillment-tile-content"
+  style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+>
+  
+  
+  Default slot
+  
+  
+</div>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
new file mode 100644
index 000000000..3830d3639
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
@@ -0,0 +1,70 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-header"
+>
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    
+    X
+    
+  </span>
+  <span
+    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+  >
+    
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-header"
+>
+  <!--v-if-->
+  <span
+    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+  >
+    
+    
+    Label slot
+    
+    
+  </span>
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    
+    X
+    
+  </span>
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > shows label 1`] = `
+<div
+  class="cdr-fulfillment-tile-header"
+>
+  <!--v-if-->
+  <span
+    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+  >
+    
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+</div>
+`;
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 711680676..3019027f7 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -7,7 +7,6 @@ import { IconCheckFill, IconErrorFill, IconXFill } from '../../icon';
 import CdrButton from '../../button/CdrButton.vue';
 import CdrSurface from '../../surface/CdrSurface.vue';
 import CdrSurfaceSelection from '../../surfaceSelection/CdrSurfaceSelection.vue';
-import CdrUtilitySans from '../../text/presets/CdrUtilitySans.vue';
 
 defineOptions({ name: 'FulfillmentTile' });
 
@@ -100,6 +99,30 @@ const toggleCheckbox2 = (value: number) => {
           <strong>content</strong>
         </template>
       </CdrFulfillmentTile>
+      <CdrFulfillmentTile
+        class="example__checkout-tile"
+        :checked="radio1 === 3"
+        tabindex="0"
+        role="radio"
+        :loading="true"
+        @click="radio1 = 3"
+      >
+        <template
+          v-if="radio1 === 3"
+          #icon-right
+        >
+          <IconCheckFill inherit-color />
+        </template>
+        <template #label>Loading option</template>
+        <template #body>
+          Body
+          <strong>content</strong>
+        </template>
+        <template #footer>
+          Footer
+          <strong>content</strong>
+        </template>
+      </CdrFulfillmentTile>
     </div>
     <br />
     <div
@@ -332,7 +355,7 @@ const toggleCheckbox2 = (value: number) => {
   &__row {
     display: grid;
     gap: var(--cdr-space-scale-three-quarter-x);
-    grid-template-columns: 230px 230px 230px;
+    grid-template-columns: 230px 230px 230px 230px;
   }
 
   &__checkout-tile {

From a0e9fe7d6d56d6cf0c6e486f4a437ab7f2b7f0b9 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Wed, 10 Jul 2024 09:41:58 -0700
Subject: [PATCH 18/70] test complete

---
 .../fulfillmentTile/CdrFulfillmentTile.vue    | 59 +++++++++-------
 .../__tests__/CdrFulfillmentTile.spec.js      | 14 ++++
 .../CdrFulfillmentTile.spec.js.snap           | 37 ++++++++++
 .../CdrFulfillmentTileContent.spec.js.snap    | 27 -------
 .../CdrFulfillmentTileHeader.spec.js.snap     | 70 -------------------
 .../examples/FulfillmentTile.vue              |  4 --
 .../styles/CdrFulfillmentTile.module.scss     |  4 ++
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  3 +
 8 files changed, 93 insertions(+), 125 deletions(-)
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index b4505d1df..d3942e5eb 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
+import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
+import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 import mapClasses from '../../utils/mapClasses';
 import { CdrFulfillmentTileProps, HtmlAttributes } from '../../types/interfaces';
 import { getSurfaceProps } from '../../utils/surface';
@@ -12,6 +14,7 @@ defineOptions({ name: 'CdrFulfillmentTile' });
 
 const props = withDefaults(defineProps<CdrFulfillmentTileProps>(), {
   tag: 'button',
+  loading: false,
 });
 
 const style = useCssModule();
@@ -39,32 +42,40 @@ const rootProps = computed(() => {
     :is="tag"
     v-bind="rootProps"
   >
-    <CdrFulfillmentTileHeader>
-      <template
-        v-if="$slots['icon-left']"
-        #icon-left
-      >
-        <slot name="icon-left" />
-      </template>
-      <template #label>
-        <slot name="label" />
+    <template v-if="loading">
+      <CdrSkeleton :class="style['cdr-fulfillment-tile__loading']">
+        <CdrSkeletonBone type="line" />
+        <CdrSkeletonBone type="line" />
+      </CdrSkeleton>
+    </template>
+    <template v-else>
+      <CdrFulfillmentTileHeader>
+        <template
+          v-if="$slots['icon-left']"
+          #icon-left
+        >
+          <slot name="icon-left" />
+        </template>
+        <template #label>
+          <slot name="label" />
+        </template>
+        <template
+          v-if="$slots['icon-right']"
+          #icon-right
+        >
+          <slot name="icon-right" />
+        </template>
+      </CdrFulfillmentTileHeader>
+      <template v-if="$slots['body']">
+        <CdrFulfillmentTileContent :stretch="true">
+          <slot name="body" />
+        </CdrFulfillmentTileContent>
       </template>
-      <template
-        v-if="$slots['icon-right']"
-        #icon-right
-      >
-        <slot name="icon-right" />
+      <template v-if="$slots['footer']">
+        <CdrFulfillmentTileContent>
+          <slot name="footer" />
+        </CdrFulfillmentTileContent>
       </template>
-    </CdrFulfillmentTileHeader>
-    <template v-if="$slots['body']">
-      <CdrFulfillmentTileContent :stretch="true">
-        <slot name="body" />
-      </CdrFulfillmentTileContent>
-    </template>
-    <template v-if="$slots['footer']">
-      <CdrFulfillmentTileContent>
-        <slot name="footer" />
-      </CdrFulfillmentTileContent>
     </template>
   </component>
 </template>
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
index d72add90d..cb0eb6418 100644
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
@@ -92,4 +92,18 @@ describe('CdrFulfillmentTile', () => {
     expect(wrapper.find('.cdr-fulfillment-tile-content').text()).toBe('Footer slot');
     expect(wrapper.element).toMatchSnapshot();
   });
+
+  it('is loading', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false, loading: true },
+      slots: {
+        label: 'Label slot',
+        footer: 'Footer slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-fulfillment-tile__loading').exists()).toBe(true);
+    expect(wrapper.find('.cdr-fulfillment-tile-header').exists()).toBe(false);
+    expect(wrapper.find('.cdr-fulfillment-tile-content').exists()).toBe(false);
+  });
 });
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
index 8de26fe82..7b9108b5e 100644
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -5,6 +5,7 @@ exports[`CdrFulfillmentTile > component unit tests > default component with no c
   aria-checked="false"
   class="cdr-fulfillment-tile"
 >
+  
   <div
     class="cdr-fulfillment-tile-header"
   >
@@ -20,6 +21,30 @@ exports[`CdrFulfillmentTile > component unit tests > default component with no c
   </div>
   <!--v-if-->
   <!--v-if-->
+  
+</button>
+`;
+
+exports[`CdrFulfillmentTile > is loading 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile"
+>
+  <div
+    aria-busy="true"
+    aria-live="polite"
+    class="cdr-skeleton cdr-fulfillment-tile__loading"
+  >
+    <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+    
+    <div
+      class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+    />
+    <div
+      class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+    />
+    
+  </div>
 </button>
 `;
 
@@ -28,6 +53,7 @@ exports[`CdrFulfillmentTile > shows body 1`] = `
   aria-checked="false"
   class="cdr-fulfillment-tile"
 >
+  
   <div
     class="cdr-fulfillment-tile-header"
   >
@@ -59,6 +85,7 @@ exports[`CdrFulfillmentTile > shows body 1`] = `
     
   </div>
   <!--v-if-->
+  
 </button>
 `;
 
@@ -67,6 +94,7 @@ exports[`CdrFulfillmentTile > shows footer 1`] = `
   aria-checked="false"
   class="cdr-fulfillment-tile"
 >
+  
   <div
     class="cdr-fulfillment-tile-header"
   >
@@ -98,6 +126,7 @@ exports[`CdrFulfillmentTile > shows footer 1`] = `
     
     
   </div>
+  
 </button>
 `;
 
@@ -106,6 +135,7 @@ exports[`CdrFulfillmentTile > shows header 1`] = `
   aria-checked="false"
   class="cdr-fulfillment-tile"
 >
+  
   <div
     class="cdr-fulfillment-tile-header"
   >
@@ -126,6 +156,7 @@ exports[`CdrFulfillmentTile > shows header 1`] = `
   </div>
   <!--v-if-->
   <!--v-if-->
+  
 </button>
 `;
 
@@ -134,6 +165,7 @@ exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
   aria-checked="false"
   class="cdr-fulfillment-tile"
 >
+  
   <div
     class="cdr-fulfillment-tile-header"
   >
@@ -149,6 +181,7 @@ exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
   </div>
   <!--v-if-->
   <!--v-if-->
+  
 </button>
 `;
 
@@ -157,6 +190,7 @@ exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
   aria-checked="false"
   class="cdr-fulfillment-tile"
 >
+  
   <div
     class="cdr-fulfillment-tile-header"
   >
@@ -207,6 +241,7 @@ exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
     
     
   </div>
+  
 </button>
 `;
 
@@ -215,6 +250,7 @@ exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
   aria-checked="false"
   class="cdr-fulfillment-tile"
 >
+  
   <div
     class="cdr-fulfillment-tile-header"
   >
@@ -265,5 +301,6 @@ exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
     
     
   </div>
+  
 </button>
 `;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
deleted file mode 100644
index 61d1ddd97..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
+++ /dev/null
@@ -1,27 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTileContent > is stretch 1`] = `
-<div
-  class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-  style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
->
-  
-  
-  Default slot
-  
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileContent > shows content 1`] = `
-<div
-  class="cdr-utility-sans cdr-fulfillment-tile-content"
-  style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
->
-  
-  
-  Default slot
-  
-  
-</div>
-`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
deleted file mode 100644
index 3830d3639..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
+++ /dev/null
@@ -1,70 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-header"
->
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    
-    X
-    
-  </span>
-  <span
-    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
-  >
-    
-    
-    Label slot
-    
-    
-  </span>
-  <!--v-if-->
-</div>
-`;
-
-exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-header"
->
-  <!--v-if-->
-  <span
-    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
-  >
-    
-    
-    Label slot
-    
-    
-  </span>
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    
-    X
-    
-  </span>
-</div>
-`;
-
-exports[`CdrFulfillmentTileHeader > shows label 1`] = `
-<div
-  class="cdr-fulfillment-tile-header"
->
-  <!--v-if-->
-  <span
-    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
-  >
-    
-    
-    Label slot
-    
-    
-  </span>
-  <!--v-if-->
-</div>
-`;
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 3019027f7..4f64dc28d 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -118,10 +118,6 @@ const toggleCheckbox2 = (value: number) => {
           Body
           <strong>content</strong>
         </template>
-        <template #footer>
-          Footer
-          <strong>content</strong>
-        </template>
       </CdrFulfillmentTile>
     </div>
     <br />
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
index 0b49e39b2..a51cceeed 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
@@ -16,4 +16,8 @@
     $fulfillment-tile-border-colors,
     $fulfillment-tile-component
   );
+
+  &__loading {
+    @include cdr-fulfillment-tile-loading-mixin();
+  }
 }
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index 02ea6e66a..b45f31891 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -30,3 +30,6 @@ $fulfillment-tile-border-colors: (
   padding: var(--cdr-space-scale-one-x) 0;
 }
 
+@mixin cdr-fulfillment-tile-loading-mixin() {
+  padding: 0 var(--cdr-space-scale-one-x);
+}

From f740d08708bbe25da4c7a081f74b481541fc27fa Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 25 Jul 2024 14:40:27 -0700
Subject: [PATCH 19/70] progress

---
 .../CdrFulfillmentTileContent.spec.js.snap    | 27 ++++++
 .../CdrFulfillmentTileHeader.spec.js.snap     | 70 ++++++++++++++++
 .../surface/__tests__/CdrSurface.spec.js      |  4 +-
 .../__snapshots__/CdrSurface.spec.js.snap     | 12 ++-
 .../__tests__/CdrSurfaceSelection.spec.js     | 84 -------------------
 .../CdrSurfaceSelection.spec.js.snap          | 51 -----------
 src/styles/cdr-reset.scss                     |  2 +-
 src/styles/main.scss                          |  4 +-
 8 files changed, 111 insertions(+), 143 deletions(-)
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
 delete mode 100644 src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
 delete mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap

diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
new file mode 100644
index 000000000..61d1ddd97
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
@@ -0,0 +1,27 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileContent > is stretch 1`] = `
+<div
+  class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+  style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+>
+  
+  
+  Default slot
+  
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileContent > shows content 1`] = `
+<div
+  class="cdr-utility-sans cdr-fulfillment-tile-content"
+  style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+>
+  
+  
+  Default slot
+  
+  
+</div>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
new file mode 100644
index 000000000..3830d3639
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
@@ -0,0 +1,70 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-header"
+>
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    
+    X
+    
+  </span>
+  <span
+    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+  >
+    
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-header"
+>
+  <!--v-if-->
+  <span
+    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+  >
+    
+    
+    Label slot
+    
+    
+  </span>
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    
+    X
+    
+  </span>
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > shows label 1`] = `
+<div
+  class="cdr-fulfillment-tile-header"
+>
+  <!--v-if-->
+  <span
+    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
+    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+  >
+    
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+</div>
+`;
diff --git a/src/components/surface/__tests__/CdrSurface.spec.js b/src/components/surface/__tests__/CdrSurface.spec.js
index 5c849054c..357e2a174 100644
--- a/src/components/surface/__tests__/CdrSurface.spec.js
+++ b/src/components/surface/__tests__/CdrSurface.spec.js
@@ -33,8 +33,8 @@ describe('CdrSurface', () => {
       it('sets the default tag prop correctly', () => {
         expect(wrapper.element.tagName).toBe('DIV');
       });
-      it('no class added', () => {
-        expect(wrapper.classes()).toEqual([]);
+      it('default class added', () => {
+        expect(wrapper.classes()).toEqual(['cdr-surface']);
       });
     })
 
diff --git a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
index 904441ada..9991b2440 100644
--- a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
+++ b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
@@ -1,21 +1,27 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`CdrSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
-<div>
+<div
+  class="cdr-surface"
+>
   
   
 </div>
 `;
 
 exports[`CdrSurface > component unit tests > when "tag" is set to "a" > renders correctly 1`] = `
-<a>
+<a
+  class="cdr-surface"
+>
   
   
 </a>
 `;
 
 exports[`CdrSurface > snapshot test > renders correctly 1`] = `
-<div>
+<div
+  class="cdr-surface"
+>
   
   
 </div>
diff --git a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
deleted file mode 100644
index 2fad1b880..000000000
--- a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
+++ /dev/null
@@ -1,84 +0,0 @@
-import { mount } from '../../../../test/vue-jest-style-workaround.js';
-import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
-
-describe('CdrSurfaceSelection', () => {
-  describe('snapshot test', () => {
-    let wrapper;
-    beforeEach(() => {
-      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
-    });
-    it('renders correctly', () => {
-      wrapper.setProps({
-        checked: true,
-        modifier: 'primary',
-        radius: 'soft',
-        withBorder: true,
-        borderWidth: 'one-x',
-        p: 'three-x',
-        m: 'one-x',
-      });
-      expect(wrapper.element).toMatchSnapshot();
-    });
-  });
-
-  describe('component unit tests', () => {
-    let wrapper;
-    beforeEach(() => {
-      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
-    });
-
-    describe('default component with no configuration', () => {
-      it('renders correctly', () => {
-        expect(wrapper.element).toMatchSnapshot();
-      });
-      it('sets the default tag prop correctly', () => {
-        expect(wrapper.element.tagName).toBe('BUTTON');
-      });
-      it('base classes only', () => {
-        expect(wrapper.classes()).toEqual([
-          'cdr-surface-selection',
-          'cdr-surface-selection--modifier-primary',
-        ]);
-      });
-    });
-
-    describe('aria attribute correct when checked', () => {
-      beforeEach(() => {
-        wrapper.setProps({ checked: true });
-      });
-      it('renders correctly', () => {
-        expect(wrapper.element).toMatchSnapshot();
-      });
-      it('renders aria checked', () => {
-        expect(wrapper.attributes('aria-checked')).toBe('true');
-      });
-    });
-
-    describe('aria attribute correct when not checked', () => {
-      beforeEach(() => {
-        wrapper.setProps({ checked: false });
-      });
-      it('renders correctly', () => {
-        expect(wrapper.element).toMatchSnapshot();
-      });
-      it('renders aria not checked', () => {
-        expect(wrapper.attributes('aria-checked')).toBe('false');
-      });
-    });
-
-    describe('correct class with secondary modifier', () => {
-      beforeEach(() => {
-        wrapper.setProps({ modifier: 'secondary' });
-      });
-      it('renders correctly', () => {
-        expect(wrapper.element).toMatchSnapshot();
-      });
-      it('correct classes', () => {
-        expect(wrapper.classes()).toEqual([
-          'cdr-surface-selection',
-          'cdr-surface-selection--modifier-secondary',
-        ]);
-      });
-    });
-  });
-});
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
deleted file mode 100644
index 774d1acf7..000000000
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ /dev/null
@@ -1,51 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrSurfaceSelection > component unit tests > aria attribute correct when checked > renders correctly 1`] = `
-<button
-  aria-checked="true"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
->
-  
-  
-</button>
-`;
-
-exports[`CdrSurfaceSelection > component unit tests > aria attribute correct when not checked > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
->
-  
-  
-</button>
-`;
-
-exports[`CdrSurfaceSelection > component unit tests > correct class with secondary modifier > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-secondary"
->
-  
-  
-</button>
-`;
-
-exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
->
-  
-  
-</button>
-`;
-
-exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
->
-  
-  
-</button>
-`;
diff --git a/src/styles/cdr-reset.scss b/src/styles/cdr-reset.scss
index 488ff41bc..11a720fad 100644
--- a/src/styles/cdr-reset.scss
+++ b/src/styles/cdr-reset.scss
@@ -1,4 +1,4 @@
-@import '../../node_modules/@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+@import '../../node_modules/@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens';
 
 html {
   -webkit-box-sizing: border-box;
diff --git a/src/styles/main.scss b/src/styles/main.scss
index dd8c8585a..de7f84791 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -5,5 +5,5 @@
 @import "./settings/index";
 
 /* Utilities */
-@import "./cdr-reset.scss";
-@import "./cdr-fonts.scss";
+@import "./cdr-reset";
+@import "./cdr-fonts";

From 1a3ac56e61344777fe3311d6ed66a48df298c634 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 30 Jul 2024 11:56:54 -0700
Subject: [PATCH 20/70] progress

---
 .../fulfillmentTile/CdrFulfillmentTile.vue    | 115 +++++++-----
 .../CdrFulfillmentTileHeader.vue              |   8 +-
 .../CdrFulfillmentTileLayout.vue              |  39 +++++
 .../examples/FulfillmentTile.vue              |  14 +-
 .../styles/CdrFulfillmentTile.module.scss     |  17 +-
 .../CdrFulfillmentTileLayout.module.scss      |   6 +
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  27 +--
 .../vars/CdrFulfillmentTileContent.vars.scss  |   1 -
 .../vars/CdrFulfillmentTileHeader.vars.scss   |   3 -
 src/components/surface/examples/Surface.vue   |  10 +-
 .../surface/styles/CdrSurface.module.scss     |  21 ++-
 .../surface/styles/vars/CdrSurface.vars.scss  |  20 ++-
 .../surfaceSelection/CdrSurfaceSelection.vue  |  35 +++-
 .../CdrSurfaceSelectionLayout.vue             |  39 +++++
 .../examples/SurfaceSelection.vue             | 165 ++++++++----------
 .../styles/CdrSurfaceSelection.module.scss    |  24 ++-
 .../CdrSurfaceSelectionLayout.module.scss     |   6 +
 .../styles/vars/CdrSurfaceSelection.vars.scss |  69 ++++++--
 .../vars/CdrSurfaceSelectionLayout.vars.scss  |  14 ++
 src/styles/main.scss                          |   8 +-
 src/styles/settings/index.scss                |  79 ++++++---
 src/types/interfaces.ts                       |  10 +-
 src/types/other.ts                            |  20 ++-
 src/utils/surface.ts                          |  36 +++-
 24 files changed, 508 insertions(+), 278 deletions(-)
 create mode 100644 src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
 create mode 100644 src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
 create mode 100644 src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
 create mode 100644 src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss
 create mode 100644 src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index d3942e5eb..4fe3d3431 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -1,20 +1,25 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
-import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
-import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 import mapClasses from '../../utils/mapClasses';
-import { CdrFulfillmentTileProps, HtmlAttributes } from '../../types/interfaces';
-import { getSurfaceProps } from '../../utils/surface';
+import { CdrSurfaceSelectionProps } from '../../types/interfaces';
+import { getSurfaceSelectionProps } from '../../utils/surface';
+import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
 import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
 import CdrFulfillmentTileContent from './CdrFulfillmentTileContent.vue';
+import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
+import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 
 /** Tile component for displaying a button with optional icon in the header */
 
 defineOptions({ name: 'CdrFulfillmentTile' });
 
-const props = withDefaults(defineProps<CdrFulfillmentTileProps>(), {
+const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   tag: 'button',
+  modifier: 'primary',
+  checked: false,
+  type: 'button',
   loading: false,
+  orientation: 'vertical',
 });
 
 const style = useCssModule();
@@ -22,12 +27,7 @@ const baseClass = 'cdr-fulfillment-tile';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { checked } = props;
-  const { inlineStyles, classes } = getSurfaceProps(props, baseClass);
-  const additionalProps: HtmlAttributes = {};
-
-  // Add checked
-  additionalProps['aria-checked'] = checked;
+  const { inlineStyles, classes, additionalProps } = getSurfaceSelectionProps(props, baseClass);
 
   return {
     ...additionalProps,
@@ -42,41 +42,74 @@ const rootProps = computed(() => {
     :is="tag"
     v-bind="rootProps"
   >
-    <template v-if="loading">
-      <CdrSkeleton :class="style['cdr-fulfillment-tile__loading']">
-        <CdrSkeletonBone type="line" />
-        <CdrSkeletonBone type="line" />
-      </CdrSkeleton>
-    </template>
-    <template v-else>
-      <CdrFulfillmentTileHeader>
-        <template
-          v-if="$slots['icon-left']"
-          #icon-left
-        >
-          <slot name="icon-left" />
+    <div :class="style['cdr-fulfillment-tile__inner']">
+      <CdrFulfillmentTileLayout
+        :orientation="orientation"
+        :class="style['cdr-fulfillment-tile__layout']"
+      >
+        <CdrFulfillmentTileHeader>
+          <template
+            v-if="$slots['icon-left']"
+            #icon-left
+          >
+            <slot name="icon-left" />
+          </template>
+          <template #label>
+            <slot name="label" />
+          </template>
+          <template
+            v-if="$slots['icon-right']"
+            #icon-right
+          >
+            <slot name="icon-right" />
+          </template>
+        </CdrFulfillmentTileHeader>
+        <template v-if="$slots['body']">
+          <CdrFulfillmentTileContent :stretch="true">
+            <slot name="body" />
+          </CdrFulfillmentTileContent>
         </template>
-        <template #label>
-          <slot name="label" />
+        <template v-if="$slots['footer']">
+          <CdrFulfillmentTileContent>
+            <slot name="footer" />
+          </CdrFulfillmentTileContent>
         </template>
-        <template
-          v-if="$slots['icon-right']"
-          #icon-right
-        >
-          <slot name="icon-right" />
-        </template>
-      </CdrFulfillmentTileHeader>
-      <template v-if="$slots['body']">
-        <CdrFulfillmentTileContent :stretch="true">
-          <slot name="body" />
-        </CdrFulfillmentTileContent>
+      </CdrFulfillmentTileLayout>
+      <div :class="style['cdr-fulfillment-tile__loading']">
+        <slot name="loading">
+          <CdrSkeleton>
+            <CdrSkeletonBone type="line" />
+          </CdrSkeleton>
+        </slot>
+      </div>
+    </div>
+    <!-- <CdrFulfillmentTileHeader>
+      <template
+        v-if="$slots['icon-left']"
+        #icon-left
+      >
+        <slot name="icon-left" />
+      </template>
+      <template #label>
+        <slot name="label" />
       </template>
-      <template v-if="$slots['footer']">
-        <CdrFulfillmentTileContent>
-          <slot name="footer" />
-        </CdrFulfillmentTileContent>
+      <template
+        v-if="$slots['icon-right']"
+        #icon-right
+      >
+        <slot name="icon-right" />
       </template>
+    </CdrFulfillmentTileHeader>
+    <template v-if="$slots['body']">
+      <CdrFulfillmentTileContent :stretch="true">
+        <slot name="body" />
+      </CdrFulfillmentTileContent>
     </template>
+    <template v-if="$slots['footer']">
+      <CdrFulfillmentTileContent>
+        <slot name="footer" />
+      </CdrFulfillmentTileContent>
+    </template> -->
   </component>
 </template>
 
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
index ebb97ba40..d128fbe93 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { useCssModule } from 'vue';
 import CdrUtilitySans from '../text/presets/CdrUtilitySans.vue';
+import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
 
 /** Fulfillment tile header component */
 
@@ -10,7 +11,10 @@ const style = useCssModule();
 </script>
 
 <template>
-  <div :class="style['cdr-fulfillment-tile-header']">
+  <CdrFulfillmentTileLayout
+    orientation="horizontal"
+    :class="style['cdr-fulfillment-tile-header']"
+  >
     <span
       v-if="$slots['icon-left']"
       :class="style['cdr-fulfillment-tile-header__icon']"
@@ -31,7 +35,7 @@ const style = useCssModule();
     >
       <slot name="icon-right" />
     </span>
-  </div>
+  </CdrFulfillmentTileLayout>
 </template>
 
 <style lang="scss" module src="./styles/CdrFulfillmentTileHeader.module.scss"></style>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
new file mode 100644
index 000000000..602b6400f
--- /dev/null
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
@@ -0,0 +1,39 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import mapClasses from '../../utils/mapClasses';
+import { Orientation } from '../../types/other';
+
+/** Component for layout of a surface selection */
+
+defineOptions({ name: 'CdrFulfillmentTileLayout' });
+
+interface CdrFulfillmentTileLayoutProps {
+  orientation?: Orientation;
+}
+
+const props = withDefaults(defineProps<CdrFulfillmentTileLayoutProps>(), {
+  orientation: 'horizontal',
+});
+
+const style = useCssModule();
+const baseClass = 'cdr-fulfillment-tile-layout';
+
+// Manages the props passed along to root
+const rootProps = computed(() => {
+  const { orientation } = props;
+  const classes = [baseClass];
+
+  // Add orientation
+  classes.push(`${baseClass}--${orientation}`);
+
+  return { class: mapClasses(style, ...classes) };
+});
+</script>
+
+<template>
+  <div v-bind="rootProps">
+    <slot />
+  </div>
+</template>
+
+<style lang="scss" module src="./styles/CdrFulfillmentTileLayout.module.scss"></style>
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 4f64dc28d..02f4ec67c 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -350,7 +350,7 @@ const toggleCheckbox2 = (value: number) => {
 
   &__row {
     display: grid;
-    gap: var(--cdr-space-scale-three-quarter-x);
+    gap: var(--cdr-space-three-quarter-x);
     grid-template-columns: 230px 230px 230px 230px;
   }
 
@@ -379,7 +379,7 @@ const toggleCheckbox2 = (value: number) => {
   &__change-store {
     padding-left: 0;
     padding-right: 0;
-    margin-bottom: var(--cdr-space-scale-half-x);
+    margin-bottom: var(--cdr-space-half-x);
   }
 
   &__checkout-tile-other-disabled {
@@ -399,7 +399,7 @@ const toggleCheckbox2 = (value: number) => {
   &__search-tile-other-header-button {
     --cdr-surface-selection-border-width-default: 0;
     --cdr-color-background-surface-selection-primary-checked: var(--cdr-color-background-primary);
-    padding: var(--cdr-space-scale-one-x) 0;
+    padding: var(--cdr-space-one-x) 0;
     width: 100%;
     @include tile-colors;
 
@@ -409,18 +409,18 @@ const toggleCheckbox2 = (value: number) => {
   }
 
   &__search-tile-other-header-content {
-    margin-top: var(--cdr-space-scale-half-x);
+    margin-top: var(--cdr-space-half-x);
   }
 
   &__search-tile-other-header-hr {
     margin: 0;
-    border-top: var(--cdr-space-scale-sixteenth-x) solid initial;
+    border-top: var(--cdr-space-sixteenth-x) solid initial;
     width: 100%;
   }
 
   &__change-store-other {
-    padding: var(--cdr-space-scale-three-quarter-x) var(--cdr-space-scale-one-x)
-      var(--cdr-space-scale-one-x) var(--cdr-space-scale-one-x);
+    padding: var(--cdr-space-three-quarter-x) var(--cdr-space-one-x)
+      var(--cdr-space-one-x) var(--cdr-space-one-x);
     justify-content: flex-start;
   }
 }
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
index a51cceeed..c088da5cd 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
@@ -2,22 +2,17 @@
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 @import './vars/CdrFulfillmentTile.vars.scss';
 
-@include cdr-surface-base-mixin(
-  $fulfillment-tile-background-colors,
-  $fulfillment-tile-border-colors,
-  $fulfillment-tile-component
-);
-
 .cdr-fulfillment-tile {
+  @include cdr-surface-base-mixin(
+    $fulfillment-tile-background-colors,
+    $fulfillment-tile-border-colors,
+    $fulfillment-tile-component
+  );
   @include cdr-surface-selection-base-mixin($fulfillment-tile-component);
-  @include cdr-fulfillment-tile-base-mixin();
   @include cdr-surface-selection-states-mixin(
     $fulfillment-tile-background-colors,
     $fulfillment-tile-border-colors,
     $fulfillment-tile-component
   );
-
-  &__loading {
-    @include cdr-fulfillment-tile-loading-mixin();
-  }
+  @include cdr-fulfillment-tile-base-mixin();
 }
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
new file mode 100644
index 000000000..b0cac0f28
--- /dev/null
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
@@ -0,0 +1,6 @@
+@import '../../surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss';
+@import '../../surface/styles/vars/CdrSurface.vars.scss';
+
+.cdr-fulfillment-tile-layout {
+  @include cdr-surface-selection-layout-base-mixin();
+}
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index b45f31891..aef196cd9 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -4,32 +4,15 @@
 
 $fulfillment-tile-component: 'fulfillment-tile';
 $fulfillment-tile-background-colors: (
-  'default': (
-    'rest': map.get($surface-selection-background-colors, 'primary', 'rest'),
-    'hover': map.get($surface-selection-background-colors, 'primary', 'hover'),
-    'active': map.get($surface-selection-background-colors, 'primary', 'active'),
-    'checked': $cdr-color-background-primary,
-    'disabled': $cdr-color-background-button-default-disabled,
-  ),
+  'default': map.get($surface-selection-background-colors, 'primary'),
 );
 $fulfillment-tile-border-colors: (
   'default': map.get($surface-selection-border-colors, 'primary'),
 );
 
 @mixin cdr-fulfillment-tile-base-mixin() {
-  @include cdr-border-width-mixin($fulfillment-tile-component, 'sixteenth-x');
-  @include cdr-border-mixin($fulfillment-tile-component);
-  @include cdr-radius-mixin($fulfillment-tile-component, 'softer');
-  display: flex;
-  align-items: flex-start;
-  justify-content: space-between;
-  flex-direction: column;
-  flex: 1 1 auto;
-  width: 100%;
-  gap: var(--cdr-space-scale-half-x);
-  padding: var(--cdr-space-scale-one-x) 0;
-}
-
-@mixin cdr-fulfillment-tile-loading-mixin() {
-  padding: 0 var(--cdr-space-scale-one-x);
+  &__layout {
+    height: 100%;
+    justify-content: space-between;
+  }
 }
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss
index 2bcfb47b2..1e5683ec3 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss
@@ -1,7 +1,6 @@
 @import '../../../../styles/settings/index.scss';
 
 @mixin cdr-fulfillment-tile-content-mixin() {
-  padding: 0 var(--cdr-space-scale-one-x);
   width: 100%;
   flex: 0 0 auto;
 
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
index 022c31001..bca1cdfbc 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
@@ -1,12 +1,9 @@
 @import '../../../../styles/settings/index.scss';
 
 @mixin cdr-fulfillment-tile-header-mixin() {
-  display: flex;
   align-items: center;
-  gap: var(--cdr-space-scale-three-quarter-x);
   width: 100%;
   height: $cdr-space-one-and-a-half-x;
-  padding: 0 var(--cdr-space-scale-one-x);
 
   &__icon {
     flex: 0 0 auto;
diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index 3e5134552..3b9ac03a8 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -31,12 +31,10 @@ const boxes: Example[] = [
       display: 'inline-block',
       radius: 'round',
       withBorder: true,
-      borderWidth: 'sixteenth-x',
       borderColor: 'primary',
       background: 'secondary',
       px: 'one-x',
       py: 'three-quarter-x',
-      fixed: true,
     },
   },
   {
@@ -47,7 +45,6 @@ const boxes: Example[] = [
       radius: 'soft',
       p: 'one-x',
       withBorder: true,
-      borderWidth: 'sixteenth-x',
     },
   },
   {
@@ -58,7 +55,7 @@ const boxes: Example[] = [
       radius: 'soft',
       p: 'one-x',
       withBorder: true,
-      borderWidth: 'sixteenth-x',
+      borderStyle: 'dashed',
     },
   },
 ];
@@ -67,7 +64,10 @@ const boxes: Example[] = [
 <template>
   <div class="example">
     <h2>Surface</h2>
-    <template v-for="({ label, props }) in boxes" :key="label">
+    <template
+      v-for="{ label, props } in boxes"
+      :key="label"
+    >
       <hr class="example__hr" />
       <CdrSurface v-bind="props">
         <CdrText>{{ label }}</CdrText>
diff --git a/src/components/surface/styles/CdrSurface.module.scss b/src/components/surface/styles/CdrSurface.module.scss
index f65d376e5..4e7bf86d8 100644
--- a/src/components/surface/styles/CdrSurface.module.scss
+++ b/src/components/surface/styles/CdrSurface.module.scss
@@ -1,11 +1,16 @@
 @import '../../../styles/settings/index.scss';
 @import './vars/CdrSurface.vars.scss';
 
-@include cdr-surface-base-mixin($surface-background-colors, $surface-border-colors, $surface-component);
-
-@include cdr-surface-modifiers-mixin(
-  $surface-background-colors,
-  $surface-border-colors,
-  $surface-component,
-  $surface-modifiers
-);
+.cdr-surface {
+  @include cdr-surface-base-mixin(
+    $surface-background-colors,
+    $surface-border-colors,
+    $surface-component
+  );
+  @include cdr-surface-modifiers-mixin(
+    $surface-background-colors,
+    $surface-border-colors,
+    $surface-component,
+    $surface-modifiers
+  );
+}
diff --git a/src/components/surface/styles/vars/CdrSurface.vars.scss b/src/components/surface/styles/vars/CdrSurface.vars.scss
index 9a9e4aaa8..022ea96f8 100644
--- a/src/components/surface/styles/vars/CdrSurface.vars.scss
+++ b/src/components/surface/styles/vars/CdrSurface.vars.scss
@@ -22,43 +22,49 @@ $surface-border-colors: (
 
 @mixin cdr-surface-base-mixin($background-colors, $border-colors, $component) {
   @each $modifier, $value in $background-colors {
-    .cdr-#{$component}--background-#{$modifier} {
+    &--background-#{$modifier} {
       @include cdr-background-mixin($background-colors, $component, $modifier);
     }
   }
 
   @each $modifier, $value in $border-colors {
-    .cdr-#{$component}--border-color-#{$modifier} {
+    &--border-color-#{$modifier} {
       @include cdr-border-color-mixin($border-colors, $component, $modifier);
     }
   }
 
   @each $key, $value in $border-widths {
-    .cdr-#{$component}--border-width-#{$key} {
+    &--border-width-#{$key} {
       @include cdr-border-width-mixin($component, $key);
     }
   }
 
+  @each $key in $border-styles {
+    &--border-style-#{$key} {
+      @include cdr-border-style-mixin($component, $key);
+    }
+  }
+
   @each $key, $value in $radii {
-    .cdr-#{$component}--radius-#{$key} {
+    &--radius-#{$key} {
       @include cdr-radius-mixin($component, $key);
     }
   }
 
   @each $key, $value in $shadows {
-    .cdr-#{$component}--shadow-#{$key} {
+    &--shadow-#{$key} {
       @include cdr-shadow-mixin($component, $key);
     }
   }
 
-  .cdr-#{$component}--border {
+  &--border {
     @include cdr-border-mixin($component);
   }
 }
 
 @mixin cdr-surface-modifiers-mixin($background-colors, $border-colors, $component, $modifiers) {
   @each $modifier in $modifiers {
-    .cdr-#{$component}--modifier-#{$modifier} {
+    &--modifier-#{$modifier} {
       @include cdr-background-mixin($background-colors, $component, $modifier);
       @include cdr-border-color-mixin($border-colors, $component, $modifier);
     }
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index c34b54372..1f28942f5 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -1,8 +1,11 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
+import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
+import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 import mapClasses from '../../utils/mapClasses';
-import { CdrSurfaceSelectionProps, HtmlAttributes } from '../../types/interfaces';
-import { getSurfaceProps } from '../../utils/surface';
+import { CdrSurfaceSelectionProps } from '../../types/interfaces';
+import { getSurfaceSelectionProps } from '../../utils/surface';
+import CdrSelectionLayout from './CdrSurfaceSelectionLayout.vue';
 
 /** Component for buttons that have a checked state */
 
@@ -11,18 +14,18 @@ defineOptions({ name: 'CdrSurfaceSelection' });
 const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   tag: 'button',
   modifier: 'primary',
+  checked: false,
+  type: 'button',
+  loading: false,
+  orientation: 'horizontal',
 });
 
 const style = useCssModule();
+const baseClass = 'cdr-surface-selection';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { checked } = props;
-  const { inlineStyles, classes } = getSurfaceProps(props, 'cdr-surface-selection');
-  const additionalProps: HtmlAttributes = {};
-
-  // Add checked
-  additionalProps['aria-checked'] = checked;
+  const { inlineStyles, classes, additionalProps } = getSurfaceSelectionProps(props, baseClass);
 
   return {
     ...additionalProps,
@@ -37,7 +40,21 @@ const rootProps = computed(() => {
     :is="tag"
     v-bind="rootProps"
   >
-    <slot />
+    <div :class="style['cdr-surface-selection__inner']">
+      <CdrSelectionLayout
+        :orientation="orientation"
+        :class="style['cdr-surface-selection__layout']"
+      >
+        <slot />
+      </CdrSelectionLayout>
+      <div :class="style['cdr-surface-selection__loading']">
+        <slot name="loading">
+          <CdrSkeleton>
+            <CdrSkeletonBone type="line" />
+          </CdrSkeleton>
+        </slot>
+      </div>
+    </div>
   </component>
 </template>
 
diff --git a/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
new file mode 100644
index 000000000..a370aa56c
--- /dev/null
+++ b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
@@ -0,0 +1,39 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import mapClasses from '../../utils/mapClasses';
+import { Orientation } from '../../types/other';
+
+/** Component for layout of a surface selection */
+
+defineOptions({ name: 'CdrSurfaceSelectionLayout' });
+
+interface CdrSurfaceSelectionLayoutProps {
+  orientation?: Orientation;
+}
+
+const props = withDefaults(defineProps<CdrSurfaceSelectionLayoutProps>(), {
+  orientation: 'horizontal',
+});
+
+const style = useCssModule();
+const baseClass = 'cdr-surface-selection-layout';
+
+// Manages the props passed along to root
+const rootProps = computed(() => {
+  const { orientation } = props;
+  const classes = [baseClass];
+
+  // Add orientation
+  classes.push(`${baseClass}--${orientation}`);
+
+  return { class: mapClasses(style, ...classes) };
+});
+</script>
+
+<template>
+  <div v-bind="rootProps">
+    <slot />
+  </div>
+</template>
+
+<style lang="scss" module src="./styles/CdrSurfaceSelectionLayout.module.scss"></style>
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index fd9c96fbd..9a385a865 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -1,101 +1,69 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
-import CdrSurface from '../../surface/CdrSurface.vue';
+import CdrSwitch from '../../switch/CdrSwitch.vue';
+import CdrSelect from '../../select/CdrSelect.vue';
 
 defineOptions({ name: 'SurfaceSelection' });
 
-const chips = {
-  count: 4,
-  props: {
-    withBorder: true,
-    borderWidth: 'eighth-x',
-    px: 'one-x',
-    py: 'half-x',
-    radius: 'round',
-  },
-};
-const chipsValue = ref(1);
-
-const toggle = {
-  count: 2,
-  props: {
-    p: 'one-x',
-    radius: 'softer',
-    borderWidth: 'zero',
-    withBorder: true,
-    class: 'example__toggle-button',
-  },
-};
-
-const toggleValue = ref(1);
+const loading = ref(false);
+const modifier = ref('primary');
 </script>
 
 <template>
   <div class="example">
     <h2>SurfaceSelection</h2>
     <hr class="example__hr" />
-    <CdrSurfaceSelection v-bind="{ checked: false }">
-      This is a blank SurfaceSelection which uses the primary (default) modifier
-    </CdrSurfaceSelection>
-    <hr class="example__hr" />
-    <CdrSurfaceSelection
-      v-bind="{
-        p: 'one-x',
-        modifier: 'primary',
-        withBorder: true,
-        borderWidth: 'sixteenth-x',
-        checked: false,
-      }"
-    >
-      This surface uses the primary modifier and has a border
-    </CdrSurfaceSelection>
-    <hr class="example__hr" />
-    <CdrSurfaceSelection
-      v-bind="{
-        p: 'one-x',
-        modifier: 'secondary',
-        withBorder: true,
-        borderWidth: 'sixteenth-x',
-        checked: false,
-      }"
-    >
-      This surface uses the secondary modifier and has a border
-    </CdrSurfaceSelection>
-    <hr class="example__hr" />
-    <h3 class="example__h3">Chips</h3>
-    <div class="example__chips">
-      <CdrSurfaceSelection
-        v-for="index in chips.count"
-        :key="index"
-        v-bind="chips.props"
-        :checked="index === chipsValue"
-        :disabled="index === 2"
-        @click="chipsValue = index"
+    <div class="example__options">
+      <CdrSwitch
+        id="loading"
+        v-model="loading"
       >
-        Chip {{ index }}
+        Toggle loading
+      </CdrSwitch>
+      <CdrSelect
+        id="modifier"
+        v-model="modifier"
+        label=""
+        :options="['primary', 'secondary']"
+      >
+        Modifier
+      </CdrSelect>
+    </div>
+    <hr class="example__hr" />
+    <div class="example__demos">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading }">
+        This is default
+      </CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="{ checked: true, modifier, loading }">
+        This is checked
+      </CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading: !loading }">
+        This is loading
+      </CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, disabled: true }">
+        This is disabled
       </CdrSurfaceSelection>
     </div>
     <hr class="example__hr" />
-    <h3 class="example__h3">Toggle</h3>
-    <CdrSurface
-      class="example__toggle"
-      :with-border="true"
-      border-width="sixteenth-x"
-      p="quarter-x"
-      radius="softer"
-      modifier="secondary"
-    >
-      <CdrSurfaceSelection
-        v-for="index in toggle.count"
-        :key="index"
-        v-bind="toggle.props"
-        :checked="index === toggleValue"
-        @click="toggleValue = index"
-      >
-        Toggle {{ index }}
+    <div class="example__demos2">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading }">
+        Custom loading
+        <template #loading>...</template>
+      </CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading }">
+        <div>Auto</div>
+        <div>Auto</div>
+      </CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, class: 'example__wide' }">
+        <div>Auto</div>
+        <div class="example__100">100%</div>
       </CdrSurfaceSelection>
-    </CdrSurface>
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, orientation: 'vertical' }">
+        <div>orientation</div>
+        <div>vertical</div>
+      </CdrSurfaceSelection>
+    </div>
   </div>
 </template>
 
@@ -107,25 +75,34 @@ const toggleValue = ref(1);
     margin: $cdr-space-two-x 0;
   }
 
-  &__h3 {
-    margin: $cdr-space-two-x 0 $cdr-space-one-x 0;
+  &__options {
+    gap: $cdr-space-one-x;
+    display: flex;
+  }
+
+  &__demos {
+    gap: $cdr-space-one-x;
+    display: flex;
+    flex-direction: column;
+    max-width: 200px;
   }
 
-  &__chips {
-    display: inline-flex;
-    gap: $cdr-space-quarter-x;
+  &__demos2 {
+    gap: $cdr-space-one-x;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
   }
 
-  &__toggle {
-    display: inline-flex;
-    gap: $cdr-space-quarter-x;
+  &__wide {
+    width: 200px;
   }
 
-  &__toggle-button {
-    --cdr-surface-selection-primary-background-color: var(--cdr-color-border-transparent);
-    --cdr-surface-selection-primary-background-color-hover: #e3e0d8;
-    --cdr-surface-selection-primary-background-color-active: var(--cdr-color-background-primary);
-    --cdr-surface-selection-primary-background-color-checked: var(--cdr-color-background-primary);
+  &__100 {
+    width: 100%;
+    background: grey;
+    color: white;
+    text-align: center;
   }
 }
 </style>
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
index 794819a86..27e1c21ce 100644
--- a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
@@ -1,19 +1,17 @@
 @import './vars/CdrSurfaceSelection.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
-@include cdr-surface-base-mixin(
-  $surface-selection-background-colors,
-  $surface-selection-border-colors,
-  $surface-selection-component
-);
-
 .cdr-surface-selection {
+  @include cdr-surface-base-mixin(
+    $surface-selection-background-colors,
+    $surface-selection-border-colors,
+    $surface-selection-component
+  );
   @include cdr-surface-selection-base-mixin($surface-selection-component);
+  @include cdr-surface-selection-states-modifiers-mixin(
+    $surface-selection-background-colors,
+    $surface-selection-border-colors,
+    $surface-selection-component,
+    $surface-selection-modifiers
+  );
 }
-
-@include cdr-surface-selection-states-modifiers-mixin(
-  $surface-selection-background-colors,
-  $surface-selection-border-colors,
-  $surface-selection-component,
-  $surface-selection-modifiers
-);
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss
new file mode 100644
index 000000000..242582f0c
--- /dev/null
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss
@@ -0,0 +1,6 @@
+@import './vars/CdrSurfaceSelectionLayout.vars.scss';
+@import '../../surface/styles/vars/CdrSurface.vars.scss';
+
+.cdr-surface-selection-layout {
+  @include cdr-surface-selection-layout-base-mixin();
+}
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index 6e46e908f..7a35fbb24 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -9,6 +9,7 @@ $surface-selection-background-colors: (
     'active': $cdr-color-background-surface-selection-primary-active,
     'checked': $cdr-color-background-surface-selection-primary-checked,
     'disabled': $cdr-color-background-surface-selection-primary-disabled,
+    'loading': $cdr-color-background-surface-selection-primary-loading,
   ),
   'secondary': (
     'rest': $cdr-color-background-surface-selection-secondary,
@@ -16,6 +17,7 @@ $surface-selection-background-colors: (
     'active': $cdr-color-background-surface-selection-secondary-active,
     'checked': $cdr-color-background-surface-selection-secondary-checked,
     'disabled': $cdr-color-background-surface-selection-secondary-disabled,
+    'loading': $cdr-color-background-surface-selection-secondary-loading,
   ),
 );
 $surface-selection-border-colors: (
@@ -25,6 +27,7 @@ $surface-selection-border-colors: (
     'active': $cdr-color-border-surface-selection-primary-active,
     'checked': $cdr-color-border-surface-selection-primary-checked,
     'disabled': $cdr-color-border-surface-selection-primary-disabled,
+    'loading': $cdr-color-border-surface-selection-primary-loading,
   ),
   'secondary': (
     'rest': $cdr-color-border-surface-selection-secondary,
@@ -32,6 +35,7 @@ $surface-selection-border-colors: (
     'active': $cdr-color-border-surface-selection-secondary-active,
     'checked': $cdr-color-border-surface-selection-secondary-checked,
     'disabled': $cdr-color-border-surface-selection-secondary-disabled,
+    'loading': $cdr-color-border-surface-selection-secondary-loading,
   ),
 );
 
@@ -67,8 +71,18 @@ $surface-selection-border-colors: (
   }
 }
 
+@mixin cdr-surface-selection-loading-mixin() {
+  &[data-loading='true'] {
+    @content;
+  }
+}
+
 @mixin cdr-surface-selection-base-mixin($component) {
   @include cdr-text-utility-sans-300;
+  @include cdr-border-mixin($component);
+  @include cdr-border-width-mixin($component, 'sixteenth-x');
+  @include cdr-border-style-mixin($component, 'solid');
+  @include cdr-radius-mixin($component, 'softest');
   border: none;
   cursor: pointer;
   appearance: none;
@@ -76,28 +90,52 @@ $surface-selection-border-colors: (
   text-decoration: none;
   touch-action: manipulation;
   -webkit-tap-highlight-color: transparent;
-  padding-block: 0;
-  padding-inline: 0;
-  transition:
-    color var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
-    fill var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
-    background-color var(--cdr-duration-1-x) var(--cdr-timing-function-ease),
-    box-shadow var(--cdr-duration-1-x) var(--cdr-timing-function-ease);
+  padding: $cdr-space-inset-half-x-stretch;
+  transition: all var(--cdr-duration-1-x) var(--cdr-timing-function-ease);
+
+  @include cdr-surface-selection-loading-mixin() {
+    pointer-events: none;
+
+    .cdr-#{$component}__layout {
+      opacity: 0;
+    }
+
+    .cdr-#{$component}__loading {
+      opacity: 1;
+    }
+  }
+
+  &__inner {
+    position: relative;
+    height: 100%;
+  }
+
+  &__layout {
+    opacity: 1;
+  }
+
+  &__loading {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    opacity: 0;
+    transition: all var(--cdr-duration-1-x) var(--cdr-timing-function-ease);
+    pointer-events: none;
+  }
 
   @include cdr-surface-selection-disabled-mixin() {
     cursor: not-allowed !important;
+    @include cdr-border-style-mixin($component, 'dashed');
   }
 
   @include cdr-surface-selection-active-mixin() {
-    @include cdr-border-mixin($component);
     outline: none;
-    --cdr-#{$component}-border-width-default: var(--cdr-space-inset-quarter-x);
+    @include cdr-border-width-mixin($component, 'third-x');
   }
 
   @include cdr-surface-selection-checked-mixin() {
-    @include cdr-text-utility-sans-strong-300;
-    @include cdr-border-mixin($component);
-    --cdr-#{$component}-border-width-default: var(--cdr-space-inset-eighth-x);
+    @include cdr-border-width-mixin($component, 'third-x');
   }
 
   &[aria-pressed='true']:not([role='checkbox']),
@@ -138,6 +176,11 @@ $surface-selection-border-colors: (
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
     @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
+
+  @include cdr-surface-selection-loading-mixin() {
+    $state: 'loading';
+    @include cdr-background-mixin($background-colors, $component, $modifier, $state);
+  }
 }
 
 @mixin cdr-surface-selection-states-modifiers-mixin(
@@ -147,7 +190,7 @@ $surface-selection-border-colors: (
   $modifiers
 ) {
   @each $modifier in $modifiers {
-    .cdr-#{$component}--modifier-#{$modifier} {
+    &--modifier-#{$modifier} {
       @include cdr-surface-selection-states-mixin(
         $background-colors,
         $border-colors,
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss
new file mode 100644
index 000000000..8dc6cc9ec
--- /dev/null
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss
@@ -0,0 +1,14 @@
+@import '../../../../styles/settings/index.scss';
+
+@mixin cdr-surface-selection-layout-base-mixin() {
+  display: flex;
+  gap: $cdr-space-two-third-x;
+
+  &--horizontal {
+    flex-direction: row;
+  }
+
+  &--vertical {
+    flex-direction: column;
+  }
+}
diff --git a/src/styles/main.scss b/src/styles/main.scss
index de7f84791..26017897d 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -1,9 +1,9 @@
 /* Tokens */
-@import "/node_modules/@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens";
+@import '/node_modules/@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens';
 
 /* Settings */
-@import "./settings/index";
+@import './settings/index';
 
 /* Utilities */
-@import "./cdr-reset";
-@import "./cdr-fonts";
+@import './cdr-reset';
+@import './cdr-fonts';
diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index 64312e0ca..095edf6f7 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -5,49 +5,64 @@ $cdr-warn: false;
 @import './alignment.vars';
 @import './options.vars';
 @import './visibility.vars';
+@import './fluid.vars';
 
 $cdr-space-zero: 0;
 $cdr-space-sixteenth-x: 0.1rem;
+$cdr-space-third-x: 0.3rem;
+$cdr-space-two-third-x: 0.6rem;
 $cdr-space-inset-zero: 0;
 $cdr-space-inset-sixteenth-x: 0.1rem;
+$cdr-space-inset-third-x: 0.3rem;
+$cdr-space-inset-two-third-x: 0.6rem;
 $cdr-color-background-transparent: transparent;
 $cdr-color-border-transparent: transparent;
 $cdr-color-border-dark: rgba(12, 11, 8, 0.75);
+$cdr-radius-softest: 0.6rem;
 
 $cdr-color-background-surface-primary: #ffffff;
 $cdr-color-background-surface-secondary: #f4f2ed;
 $cdr-color-border-surface-primary: #dcd6cb;
 $cdr-color-border-surface-secondary: #928b80;
 
-$cdr-color-background-surface-selection-primary: $cdr-color-background-primary;
-$cdr-color-background-surface-selection-primary-hover: #f4f2ed;
-$cdr-color-background-surface-selection-primary-active: #edeae3;
-$cdr-color-background-surface-selection-primary-checked: #dcd6cb;
-$cdr-color-background-surface-selection-primary-disabled: #ffffff;
-$cdr-color-background-surface-selection-secondary: $cdr-color-background-secondary;
-$cdr-color-background-surface-selection-secondary-hover: #e3e0d8;
-$cdr-color-background-surface-selection-secondary-active: #edeae3;
-$cdr-color-background-surface-selection-secondary-checked: $cdr-color-background-secondary;
-$cdr-color-background-surface-selection-secondary-disabled: #ffffff;
-$cdr-color-border-surface-selection-primary: $cdr-color-border-primary;
-$cdr-color-border-surface-selection-primary-hover: $cdr-color-border-secondary;
-$cdr-color-border-surface-selection-primary-active: $cdr-color-border-button-dark-active;
-$cdr-color-border-surface-selection-primary-checked: $cdr-color-border-button-dark-active;
-$cdr-color-border-surface-selection-primary-disabled: $cdr-color-border-primary;
-$cdr-color-border-surface-selection-secondary: $cdr-color-border-secondary;
-$cdr-color-border-surface-selection-secondary-hover: $cdr-color-border-secondary;
-$cdr-color-border-surface-selection-secondary-active: $cdr-color-border-button-dark-active;
-$cdr-color-border-surface-selection-secondary-checked: $cdr-color-border-button-dark-active;
-$cdr-color-border-surface-selection-secondary-disabled: $cdr-color-border-secondary;
+$cdr-color-background-surface-selection-primary: #fff;
+$cdr-color-background-surface-selection-primary-hover: #fff;
+$cdr-color-background-surface-selection-primary-active: #fff;
+$cdr-color-background-surface-selection-primary-checked: #fff;
+$cdr-color-background-surface-selection-primary-disabled: #F7F5F3;
+$cdr-color-background-surface-selection-primary-loading: #FBFAF9;
+$cdr-color-background-surface-selection-secondary: #f4f2ed;
+$cdr-color-background-surface-selection-secondary-hover: #f4f2ed;
+$cdr-color-background-surface-selection-secondary-active: #f4f2ed;
+$cdr-color-background-surface-selection-secondary-checked: #f4f2ed;
+$cdr-color-background-surface-selection-secondary-disabled: #dcd6cb;
+$cdr-color-background-surface-selection-secondary-loading: #dcd6cb;
+$cdr-color-border-surface-selection-primary: #958E83;
+$cdr-color-border-surface-selection-primary-hover: #958E83;
+$cdr-color-border-surface-selection-primary-active: #958E83;
+$cdr-color-border-surface-selection-primary-checked: #2E2E2B;
+$cdr-color-border-surface-selection-primary-disabled: #958E83;
+$cdr-color-border-surface-selection-primary-loading: #958E83;
+$cdr-color-border-surface-selection-secondary: rgba(66, 59, 47, 0.75);
+$cdr-color-border-surface-selection-secondary-hover: rgba(66, 59, 47, 0.75);
+$cdr-color-border-surface-selection-secondary-active: rgba(66, 59, 47, 0.75);
+$cdr-color-border-surface-selection-secondary-checked: rgba(3, 3, 1, 0.9);
+$cdr-color-border-surface-selection-secondary-disabled: rgba(66, 59, 47, 0.75);
+$cdr-color-border-surface-selection-secondary-loading: rgba(66, 59, 47, 0.75);
 
 :root {
   --cdr-color-background-transparent: #{$cdr-color-background-transparent};
   --cdr-color-border-transparent: #{$cdr-color-border-transparent};
   --cdr-color-border-dark: #{$cdr-color-border-dark};
+  --cdr-radius-softest: #{$cdr-radius-softest};
   --cdr-space-inset-zero: #{$cdr-space-inset-zero};
   --cdr-space-inset-sixteenth-x: #{$cdr-space-inset-sixteenth-x};
+  --cdr-space-inset-third-x: #{$cdr-space-inset-third-x};
+  --cdr-space-inset-two-third-x: #{$cdr-space-inset-two-third-x};
   --cdr-space-zero: #{$cdr-space-zero};
   --cdr-space-sixteenth-x: #{$cdr-space-sixteenth-x};
+  --cdr-space-third-x: #{$cdr-space-third-x};
+  --cdr-space-two-third-x: #{$cdr-space-two-third-x};
 
   --cdr-color-background-surface-primary: #{$cdr-color-background-surface-primary};
   --cdr-color-background-surface-secondary: #{$cdr-color-background-surface-secondary};
@@ -59,21 +74,24 @@ $cdr-color-border-surface-selection-secondary-disabled: $cdr-color-border-second
   --cdr-color-background-surface-selection-primary-active: #{$cdr-color-background-surface-selection-primary-active};
   --cdr-color-background-surface-selection-primary-checked: #{$cdr-color-background-surface-selection-primary-checked};
   --cdr-color-background-surface-selection-primary-disabled: #{$cdr-color-background-surface-selection-primary-disabled};
+  --cdr-color-background-surface-selection-primary-loading: #{$cdr-color-background-surface-selection-primary-loading};
   --cdr-color-background-surface-selection-secondary: #{$cdr-color-background-surface-selection-secondary};
   --cdr-color-background-surface-selection-secondary-hover: #{$cdr-color-background-surface-selection-secondary-hover};
   --cdr-color-background-surface-selection-secondary-active: #{$cdr-color-background-surface-selection-secondary-active};
   --cdr-color-background-surface-selection-secondary-checked: #{$cdr-color-background-surface-selection-secondary-checked};
   --cdr-color-background-surface-selection-secondary-disabled: #{$cdr-color-background-surface-selection-secondary-disabled};
+  --cdr-color-background-surface-selection-secondary-loading: #{$cdr-color-background-surface-selection-secondary-loading};
   --cdr-color-border-surface-selection-primary: #{$cdr-color-border-surface-selection-primary};
   --cdr-color-border-surface-selection-primary-hover: #{$cdr-color-border-surface-selection-primary-hover};
   --cdr-color-border-surface-selection-primary-active: #{$cdr-color-border-surface-selection-primary-active};
   --cdr-color-border-surface-selection-primary-checked: #{$cdr-color-border-surface-selection-primary-checked};
   --cdr-color-border-surface-selection-primary-disabled: #{$cdr-color-border-surface-selection-primary-disabled};
+  --cdr-color-border-surface-selection-primary-loading: #{$cdr-color-border-surface-selection-primary-loading};
   --cdr-color-border-surface-selection-secondary: #{$cdr-color-border-surface-selection-secondary};
   --cdr-color-border-surface-selection-secondary-hover: #{$cdr-color-border-surface-selection-secondary-hover};
   --cdr-color-border-surface-selection-secondary-active: #{$cdr-color-border-surface-selection-secondary-active};
   --cdr-color-border-surface-selection-secondary-checked: #{$cdr-color-border-surface-selection-secondary-checked};
-  --cdr-color-border-surface-selection-secondary-disabled: #{$cdr-color-border-surface-selection-secondary-disabled};
+  --cdr-color-border-surface-selection-secondary-loading: #{$cdr-color-border-surface-selection-secondary-loading};
 }
 
 $border-widths: (
@@ -83,10 +101,13 @@ $border-widths: (
   'quarter-x': $cdr-space-inset-quarter-x,
 );
 
+$border-styles: 'dotted', 'dashed', 'solid';
+
 $radii: (
   'sharp': $cdr-radius-sharp,
   'soft': $cdr-radius-soft,
   'softer': $cdr-radius-softer,
+  'softest': $cdr-radius-softest,
   'round': $cdr-radius-round,
 );
 
@@ -133,7 +154,10 @@ $shadows: (
 
   --cdr-#{$component}-border-color-default: var(
     --cdr-#{$component}#{$modifierPart}-border-color#{$statePart},
-    var(--cdr-color-border-#{$component}#{$modifierPart}#{$statePart}, #{map.get($options, $modifier, $state)})
+    var(
+      --cdr-color-border-#{$component}#{$modifierPart}#{$statePart},
+      #{map.get($options, $modifier, $state)}
+    )
   );
 }
 
@@ -144,6 +168,13 @@ $shadows: (
   );
 }
 
+@mixin cdr-border-style-mixin($component, $key) {
+  --cdr-#{$component}-border-style-default: var(
+    --cdr-#{$component}-border-style,
+    var(--cdr-border-style-#{$key}, #{$key})
+  );
+}
+
 @mixin cdr-border-mixin($component) {
   position: relative;
 
@@ -156,8 +187,8 @@ $shadows: (
     width: 100%;
     height: 100%;
     content: '';
-    box-shadow: inset 0 0 0 var(--cdr-#{$component}-border-width-default)
-      var(--cdr-#{$component}-border-color-default);
+    border: var(--cdr-#{$component}-border-width-default)
+      var(--cdr-#{$component}-border-style-default) var(--cdr-#{$component}-border-color-default);
   }
 }
 
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index a2671e1fc..0df0f94f1 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -4,8 +4,10 @@ import type {
   Shadow,
   Radius,
   BorderColor,
+  BorderStyle,
   Modifier,
   Background,
+  Orientation,
 } from './other';
 
 /**
@@ -168,7 +170,7 @@ export interface CdrSurfaceProps extends HtmlAttributes {
   withBorder?: boolean;
   borderWidth?: Space;
   borderColor?: BorderColor;
-  fixed?: boolean;
+  borderStyle?: BorderStyle;
   m?: Space;
   mx?: Space;
   my?: Space;
@@ -188,8 +190,6 @@ export interface CdrSurfaceProps extends HtmlAttributes {
 export interface CdrSurfaceSelectionProps extends CdrSurfaceProps {
   checked: boolean;
   type?: 'button' | 'reset' | 'submit' | undefined;
-}
-
-export interface CdrFulfillmentTileProps extends CdrSurfaceSelectionProps {
   loading?: boolean;
-}
\ No newline at end of file
+  orientation?: Orientation;
+}
diff --git a/src/types/other.ts b/src/types/other.ts
index 043407937..e2648bce0 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -1,19 +1,33 @@
 export type Tag = keyof HTMLElementTagNameMap;
-export type Space =
+export type SpaceFixed =
   | 'zero'
   | 'sixteenth-x'
   | 'eighth-x'
   | 'quarter-x'
+  | 'third-x'
   | 'half-x'
+  | 'two-third-x'
   | 'three-quarter-x'
   | 'one-x'
   | 'one-and-a-half-x'
   | 'two-x'
   | 'three-x'
   | 'four-x';
+export type SpaceFluid =
+  | 'scale-0'
+  | 'scale-1'
+  | 'scale-2'
+  | 'scale-3'
+  | 'scale-4'
+  | 'scale-5'
+  | 'scale-6'
+  | 'scale-7'
+  | 'scale-8';
+export type SpaceScale = 'scale-0--1' | 'scale-3--4' | 'scale-3--5';
+export type Space = SpaceFixed | SpaceFluid | SpaceScale;
 export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
 export type Background = 'transparent' | 'primary' | 'secondary' | 'brand-spruce';
-export type Radius = 'sharp' | 'soft' | 'softer' | 'round';
+export type Radius = 'sharp' | 'soft' | 'softer' | 'softest' | 'round';
 export type BorderColor =
   | 'transparent'
   | 'primary'
@@ -22,4 +36,6 @@ export type BorderColor =
   | 'warning'
   | 'error'
   | 'message-default-01';
+export type BorderStyle = 'solid' | 'dotted' | 'dashed';
 export type Modifier = 'primary' | 'secondary';
+export type Orientation = 'vertical' | 'horizontal';
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index c7e2f9332..7a8a0dbe9 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -1,4 +1,9 @@
-import type { CdrSurfaceProps, InlineCss } from '../types/interfaces';
+import type {
+  CdrSurfaceProps,
+  CdrSurfaceSelectionProps,
+  InlineCss,
+  HtmlAttributes,
+} from '../types/interfaces';
 
 // Map of margins and padding
 const marginsAndPaddingMap: Record<string, string> = {
@@ -38,16 +43,17 @@ export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
 
   // Add border
   if (props.withBorder) {
-    if (props.borderWidth) {
-      const borderWidthClass = `${baseClass}--border-width-${props.borderWidth}`;
-      classes.push(borderWidthClass);
-    }
-
     if (props.borderColor) {
       const borderColorClass = `${baseClass}--border-color-${props.borderColor}`;
       classes.push(borderColorClass);
     }
 
+    const borderWidthClass = `${baseClass}--border-width-${props.borderWidth || 'sixteenth-x'}`;
+    classes.push(borderWidthClass);
+
+    const borderStyleClass = `${baseClass}--border-style-${props.borderStyle || 'solid'}`;
+    classes.push(borderStyleClass);
+
     classes.push(`${baseClass}--border`);
   }
 
@@ -68,10 +74,26 @@ export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
     marginAndPaddingKeys.forEach((key) => {
       if (props[key]) {
         const cssProperty = marginsAndPaddingMap[key];
-        inlineStyles[cssProperty] = `var(--cdr-space-${props.fixed ? '' : 'scale-'}${props[key]})`;
+        inlineStyles[cssProperty] = `var(--cdr-space-${props[key]})`;
       }
     });
   }
 
   return { classes, inlineStyles };
 };
+
+export const getSurfaceSelectionProps = (props: CdrSurfaceSelectionProps, baseClass: string) => {
+  const { classes, inlineStyles } = getSurfaceProps(props, baseClass);
+  const { checked, loading } = props;
+  const additionalProps: HtmlAttributes = {};
+
+  // Add checked
+  additionalProps['aria-checked'] = checked;
+
+  // Add loading
+  if (loading) {
+    additionalProps['data-loading'] = loading;
+  }
+
+  return { classes, inlineStyles, additionalProps };
+};

From beee45d6f2eb915fe395ac4354ae6e56d8ed6181 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Wed, 31 Jul 2024 15:13:08 -0700
Subject: [PATCH 21/70] progress

---
 src/components/banner/CdrBanner.vue           |  42 ++++----
 src/components/banner/examples/Banner.vue     |   2 +-
 .../banner/styles/CdrBanner.module.scss       |  33 +-----
 src/components/examples.js                    |   2 +
 .../fulfillmentTile/CdrFulfillmentTile.vue    | 101 +++++++-----------
 .../CdrFulfillmentTileContent.vue             |  12 ++-
 .../CdrFulfillmentTileHeader.vue              |   6 +-
 .../examples/FulfillmentTile.vue              |   2 +-
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  16 ++-
 .../vars/CdrFulfillmentTileHeader.vars.scss   |   1 +
 src/components/statusIcon/CdrStatusIcon.vue   |  33 ++++++
 .../statusIcon/examples/StatusIcon.vue        |  74 +++++++++++++
 .../styles/CdrStatusIcon.module.scss          |  26 +++++
 .../styles/vars/CdrStatusIcon.vars.scss       |  45 ++++++++
 src/components/surface/examples/Surface.vue   |   2 +-
 .../examples/SurfaceSelection.vue             |   2 +-
 src/components/text/presets/CdrBody.vue       |   4 +-
 .../text/presets/CdrSubheadingSans.vue        |   2 +-
 src/dev/router.js                             |   1 +
 src/lib.ts                                    |   1 +
 src/styles/settings/fluid.vars.scss           |   5 +-
 src/types/interfaces.ts                       |  18 ++--
 src/types/other.ts                            |   1 +
 23 files changed, 287 insertions(+), 144 deletions(-)
 create mode 100644 src/components/statusIcon/CdrStatusIcon.vue
 create mode 100644 src/components/statusIcon/examples/StatusIcon.vue
 create mode 100644 src/components/statusIcon/styles/CdrStatusIcon.module.scss
 create mode 100644 src/components/statusIcon/styles/vars/CdrStatusIcon.vars.scss

diff --git a/src/components/banner/CdrBanner.vue b/src/components/banner/CdrBanner.vue
index b3eeb9ec1..4ad4d8f1c 100644
--- a/src/components/banner/CdrBanner.vue
+++ b/src/components/banner/CdrBanner.vue
@@ -1,36 +1,32 @@
 <script setup lang="ts">
 import { useCssModule, computed, useSlots } from 'vue';
-import propValidator from '../../utils/propValidator';
+import CdrStatusIcon from '../statusIcon/CdrStatusIcon.vue';
+import { Status } from '../../types/other';
 
 /** Provides contextual feedback messages for typical user actions */
 
-defineOptions({
-  name: 'CdrBanner',
-});
+defineOptions({ name: 'CdrBanner' });
 
-const props = defineProps({
+export interface CdrStatusIconProps {
   /**
    * Sets the banner style.
    * @demoSelectMultiple false
    * @values info, warning, success, error, default
- */
-  type: {
-    type: String,
-    validator: (value: string) => propValidator(
-      value,
-      ['info', 'warning', 'success', 'error', 'default'],
-    ),
-    default: 'default',
-  },
+   */
+  type?: Status;
+}
+
+const props = withDefaults(defineProps<CdrStatusIconProps>(), {
+  type: 'default',
 });
 
 const slots = useSlots();
 const style = useCssModule();
 const baseClass = 'cdr-banner';
 const typeClass = computed(() => `${baseClass}--${props.type}`);
-const prominenceClass = computed(() => (slots['message-body']
-  ? `${baseClass}__wrapper--prominence`
-  : ''));
+const prominenceClass = computed(() =>
+  slots['message-body'] ? `${baseClass}__wrapper--prominence` : '',
+);
 const hasIconLeft = slots['icon-left'];
 const hasIconRight = slots['icon-right'];
 const hasMessageBody = slots['message-body'];
@@ -41,24 +37,25 @@ const hasInfoAction = slots['info-action'];
   <div :class="[style[baseClass], style[typeClass]]">
     <div :class="[style['cdr-banner__wrapper'], style[prominenceClass]]">
       <div :class="[style['cdr-banner__main']]">
-        <div
+        <CdrStatusIcon
           v-if="hasIconLeft"
+          :type="type"
           :class="[style['cdr-banner__icon-left']]"
         >
           <!-- @slot Icon matching banner type -->
           <slot name="icon-left" />
-        </div>
+        </CdrStatusIcon>
         <span :class="[style['cdr-banner__message']]">
           <!-- @slot Primary message content -->
           <slot />
         </span>
-        <div
+        <CdrStatusIcon
           v-if="hasIconRight"
           :class="[style['cdr-banner__icon-right']]"
         >
           <!-- @slot Additional icon -->
           <slot name="icon-right" />
-        </div>
+        </CdrStatusIcon>
       </div>
       <div
         v-if="hasMessageBody"
@@ -78,5 +75,4 @@ const hasInfoAction = slots['info-action'];
   </div>
 </template>
 
-<style lang="scss" module src="./styles/CdrBanner.module.scss">
-</style>
+<style lang="scss" module src="./styles/CdrBanner.module.scss"></style>
diff --git a/src/components/banner/examples/Banner.vue b/src/components/banner/examples/Banner.vue
index bef46c13e..ea0f2f273 100644
--- a/src/components/banner/examples/Banner.vue
+++ b/src/components/banner/examples/Banner.vue
@@ -54,7 +54,7 @@
 
     <cdr-banner type="success">
       <template #icon-left>
-        <icon-check-fill />
+        <icon-check-fill inherit-color />
       </template>
       This is a banner with an icon-right slot, typically used to close the banner.
       <template #icon-right>
diff --git a/src/components/banner/styles/CdrBanner.module.scss b/src/components/banner/styles/CdrBanner.module.scss
index 3ba94782a..9f68e2dd6 100644
--- a/src/components/banner/styles/CdrBanner.module.scss
+++ b/src/components/banner/styles/CdrBanner.module.scss
@@ -5,7 +5,7 @@
   @include cdr-banner-base-mixin;
   display: grid;
   grid-template-columns: 1fr auto;
-  grid-template-areas: 
+  grid-template-areas:
   "main info-action"
   "message-body info-action"
   ;
@@ -26,15 +26,6 @@
     display: inherit;
     align-items: center;
     justify-items: center;
-    & svg {
-      max-height: 2.2rem;
-      max-width: 2.2rem;
-      stroke: white;
-      stroke-width: 0.4rem;
-      paint-order: stroke fill;
-      margin: $cdr-space-quarter-x;
-  
-    }
   }
   &__message {
     display: inherit;
@@ -79,10 +70,6 @@
       & .cdr-banner__icon-left {
           //ITEM_DOC: Left icon background color for default banner
           background-color: var(--cdr-banner-default-icon-left-background-color, var(--cdr-color-background-message-default-02, #{$cdr-color-background-message-default-02}));
-          svg {
-            //ITEM_DOC: Left icon fill color for default banner
-            fill: var(--cdr-banner-default-icon-left-fill, var(--cdr-color-icon-message-default, #{$cdr-color-icon-message-default}));
-          }
         }
       }
       & .cdr-banner__wrapper {
@@ -98,10 +85,6 @@
       & .cdr-banner__icon-left {
         //ITEM_DOC: Left icon background color for info banner
         background-color: var(--cdr-banner-info-icon-left-background-color, var(--cdr-color-background-message-info-02, #{$cdr-color-background-message-info-02}));
-        svg {
-          //ITEM_DOC: Left icon fill color for info banner
-          fill: var(--cdr-banner-info-icon-left-fill, var(--cdr-color-icon-message-info, #{$cdr-color-icon-message-info}));
-        }
       }
     }
     & .cdr-banner__wrapper {
@@ -117,10 +100,6 @@
       & .cdr-banner__icon-left {
         //ITEM_DOC: Left icon background color for warning banner
         background-color: var(--cdr-banner-warning-icon-left-background-color, var(--cdr-color-background-message-warning-02, #{$cdr-color-background-message-warning-02}));
-        svg {
-          //ITEM_DOC: Left icon fill color for warning banner
-          fill: var(--cdr-banner-warning-icon-left-fill, var(--cdr-color-icon-message-warning, #{$cdr-color-icon-message-warning}));
-        }
       }
     }
     & .cdr-banner__wrapper {
@@ -136,10 +115,6 @@
       & .cdr-banner__icon-left {
         //ITEM_DOC: Left icon background color for success banner
         background-color: var(--cdr-banner-success-icon-left-background-color, var(--cdr-color-background-message-success-02, #{$cdr-color-background-message-success-02}));
-        svg {
-          //ITEM_DOC: Left icon fill color for success banner
-          fill: var(--cdr-banner-success-icon-left-fill, var(--cdr-color-icon-message-success, #{$cdr-color-icon-message-success}));
-        }
       }
     }
     & .cdr-banner__wrapper {
@@ -155,16 +130,12 @@
       & .cdr-banner__icon-left {
         //ITEM_DOC: Left icon background color for error banner
         background-color: var(--cdr-banner-error-icon-left-background-color, var(--cdr-color-background-message-error-02, #{$cdr-color-background-message-error-02}));
-        svg {
-          //ITEM_DOC: Left icon fill color for error banner
-          fill: var(--cdr-banner-error-icon-left-fill, var(--cdr-color-icon-message-error, #{$cdr-color-icon-message-error}));
-        }
       }
     }
     & .cdr-banner__wrapper {
       border-left: $left-border;
       //ITEM_DOC: Wrapper border left color for error banner
-      border-left-color: var(--cdr-banner-error-wrapper-border-left-color, var(--cdr-color-border-message-error-01, #{$cdr-color-border-message-error-01}));      
+      border-left-color: var(--cdr-banner-error-wrapper-border-left-color, var(--cdr-color-border-message-error-01, #{$cdr-color-border-message-error-01}));
     }
   }
 }
diff --git a/src/components/examples.js b/src/components/examples.js
index cc621401d..719ab0c1e 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -30,6 +30,7 @@ import rating from 'componentsdir/rating/examples/Ratings.vue';
 import selects from 'componentsdir/select/examples/Selects.vue';
 import skeleton from 'componentsdir/skeleton/examples/Skeleton.vue';
 import splitSurface from 'componentsdir/splitSurface/examples/SplitSurface.vue';
+import statusIcon from 'componentsdir/statusIcon/examples/StatusIcon.vue';
 import surface from 'componentsdir/surface/examples/Surface.vue';
 import surfaceSelection from 'componentsdir/surfaceSelection/examples/SurfaceSelection.vue';
 import tables from 'componentsdir/table/examples/Table.vue';
@@ -75,6 +76,7 @@ export default {
   selects,
   skeleton,
   splitSurface,
+  statusIcon,
   surface,
   surfaceSelection,
   tables,
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 4fe3d3431..2622e1f64 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -43,73 +43,48 @@ const rootProps = computed(() => {
     v-bind="rootProps"
   >
     <div :class="style['cdr-fulfillment-tile__inner']">
-      <CdrFulfillmentTileLayout
-        :orientation="orientation"
-        :class="style['cdr-fulfillment-tile__layout']"
-      >
-        <CdrFulfillmentTileHeader>
-          <template
-            v-if="$slots['icon-left']"
-            #icon-left
-          >
-            <slot name="icon-left" />
-          </template>
-          <template #label>
-            <slot name="label" />
-          </template>
-          <template
-            v-if="$slots['icon-right']"
-            #icon-right
-          >
-            <slot name="icon-right" />
-          </template>
-        </CdrFulfillmentTileHeader>
-        <template v-if="$slots['body']">
-          <CdrFulfillmentTileContent :stretch="true">
-            <slot name="body" />
-          </CdrFulfillmentTileContent>
+      <CdrFulfillmentTileHeader>
+        <template
+          v-if="$slots['icon-left']"
+          #icon-left
+        >
+          <slot name="icon-left" />
         </template>
-        <template v-if="$slots['footer']">
-          <CdrFulfillmentTileContent>
-            <slot name="footer" />
-          </CdrFulfillmentTileContent>
+        <template #label>
+          <slot name="label" />
         </template>
-      </CdrFulfillmentTileLayout>
-      <div :class="style['cdr-fulfillment-tile__loading']">
-        <slot name="loading">
-          <CdrSkeleton>
-            <CdrSkeletonBone type="line" />
-          </CdrSkeleton>
-        </slot>
+        <template
+          v-if="$slots['icon-right']"
+          #icon-right
+        >
+          <slot name="icon-right" />
+        </template>
+      </CdrFulfillmentTileHeader>
+      <div :class="style['cdr-fulfillment-tile__main']">
+        <CdrFulfillmentTileLayout
+          :orientation="orientation"
+          :class="style['cdr-fulfillment-tile__layout']"
+        >
+          <template v-if="$slots['body']">
+            <CdrFulfillmentTileContent :stretch="true">
+              <slot name="body" />
+            </CdrFulfillmentTileContent>
+          </template>
+          <template v-if="$slots['footer']">
+            <CdrFulfillmentTileContent scale="-1">
+              <slot name="footer" />
+            </CdrFulfillmentTileContent>
+          </template>
+        </CdrFulfillmentTileLayout>
+        <div :class="style['cdr-fulfillment-tile__loading']">
+          <slot name="loading">
+            <CdrSkeleton>
+              <CdrSkeletonBone type="line" />
+            </CdrSkeleton>
+          </slot>
+        </div>
       </div>
     </div>
-    <!-- <CdrFulfillmentTileHeader>
-      <template
-        v-if="$slots['icon-left']"
-        #icon-left
-      >
-        <slot name="icon-left" />
-      </template>
-      <template #label>
-        <slot name="label" />
-      </template>
-      <template
-        v-if="$slots['icon-right']"
-        #icon-right
-      >
-        <slot name="icon-right" />
-      </template>
-    </CdrFulfillmentTileHeader>
-    <template v-if="$slots['body']">
-      <CdrFulfillmentTileContent :stretch="true">
-        <slot name="body" />
-      </CdrFulfillmentTileContent>
-    </template>
-    <template v-if="$slots['footer']">
-      <CdrFulfillmentTileContent>
-        <slot name="footer" />
-      </CdrFulfillmentTileContent>
-    </template> -->
   </component>
 </template>
 
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
index 502f21ee2..c83df98be 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
-import CdrUtilitySans, { type utilitySansTextProps } from '../text/presets/CdrUtilitySans.vue';
+import CdrBody, { type bodyTextProps } from '../text/presets/CdrBody.vue';
 
 /** Content component for fulfillment tile */
 
@@ -8,18 +8,20 @@ defineOptions({ name: 'CdrFulfillmentTileContent' });
 
 interface CdrFulfillmentTileContentProps {
   stretch?: boolean;
+  scale?: bodyTextProps['scale'];
 }
 
 const props = withDefaults(defineProps<CdrFulfillmentTileContentProps>(), {
   stretch: false,
+  scale: '-2',
 });
 
 const style = useCssModule();
 const baseClass = 'cdr-fulfillment-tile-content';
 
-const rootProps = computed<utilitySansTextProps>(() => ({
+const rootProps = computed((): bodyTextProps => ({
   tag: 'div',
-  scale: '-1',
+  scale: props.scale,
   class: {
     [style[baseClass]]: true,
     [style[`${baseClass}--stretch`]]: props.stretch,
@@ -28,9 +30,9 @@ const rootProps = computed<utilitySansTextProps>(() => ({
 </script>
 
 <template>
-  <CdrUtilitySans v-bind="rootProps">
+  <CdrBody v-bind="rootProps">
     <slot />
-  </CdrUtilitySans>
+  </CdrBody>
 </template>
 
 <style lang="scss" module src="./styles/CdrFulfillmentTileContent.module.scss"></style>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
index d128fbe93..c5ccad9bc 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useCssModule } from 'vue';
-import CdrUtilitySans from '../text/presets/CdrUtilitySans.vue';
+import CdrSubheadingSans from '../text/presets/CdrSubheadingSans.vue';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
 
 /** Fulfillment tile header component */
@@ -21,14 +21,14 @@ const style = useCssModule();
     >
       <slot name="icon-left" />
     </span>
-    <CdrUtilitySans
+    <CdrSubheadingSans
       :strong="true"
       scale="-1"
       tag="span"
       :class="style['cdr-fulfillment-tile-header__label']"
     >
       <slot name="label" />
-    </CdrUtilitySans>
+    </CdrSubheadingSans>
     <span
       v-if="$slots['icon-right']"
       :class="style['cdr-fulfillment-tile-header__icon']"
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 02f4ec67c..81f9d4529 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -321,7 +321,7 @@ const toggleCheckbox2 = (value: number) => {
   </div>
 </template>
 
-<style lang="scss">
+<style lang="scss" scoped>
 @import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
 @import '../styles/vars/CdrFulfillmentTile.vars.scss';
 @import '../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index aef196cd9..60bc44e84 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -11,8 +11,22 @@ $fulfillment-tile-border-colors: (
 );
 
 @mixin cdr-fulfillment-tile-base-mixin() {
+  &__inner {
+    display: flex;
+    flex-direction: column;
+  }
+
+  &__main {
+    position: relative;
+    height: 100%;
+  }
+
   &__layout {
     height: 100%;
-    justify-content: space-between;
+    justify-content: flex-end;
+  }
+
+  &__loading {
+    margin-top: $cdr-space-quarter-x;
   }
 }
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
index bca1cdfbc..4f313cf63 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
@@ -4,6 +4,7 @@
   align-items: center;
   width: 100%;
   height: $cdr-space-one-and-a-half-x;
+  flex: 0 0 auto;
 
   &__icon {
     flex: 0 0 auto;
diff --git a/src/components/statusIcon/CdrStatusIcon.vue b/src/components/statusIcon/CdrStatusIcon.vue
new file mode 100644
index 000000000..09fe54687
--- /dev/null
+++ b/src/components/statusIcon/CdrStatusIcon.vue
@@ -0,0 +1,33 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import { Status } from '../../types/other';
+
+/** Provides stylized icons for typical notifications */
+
+defineOptions({ name: 'CdrStatusIcon' });
+
+export interface CdrStatusIconProps {
+  /**
+   * Sets the icon style.
+   * @demoSelectMultiple false
+   * @values info, warning, success, error, default
+   */
+  type?: Status;
+}
+
+const props = withDefaults(defineProps<CdrStatusIconProps>(), {
+  type: 'default',
+});
+
+const style = useCssModule();
+const baseClass = 'cdr-status-icon';
+const typeClass = computed(() => `${baseClass}--${props.type}`);
+</script>
+
+<template>
+  <span :class="[style[baseClass], style[typeClass]]">
+    <slot />
+  </span>
+</template>
+
+<style lang="scss" module src="./styles/CdrStatusIcon.module.scss"></style>
diff --git a/src/components/statusIcon/examples/StatusIcon.vue b/src/components/statusIcon/examples/StatusIcon.vue
new file mode 100644
index 000000000..2ec0d72da
--- /dev/null
+++ b/src/components/statusIcon/examples/StatusIcon.vue
@@ -0,0 +1,74 @@
+<script setup lang="ts">
+import CdrStatusIcon from '../CdrStatusIcon.vue';
+import CdrText from '../../text/CdrText.vue';
+import type { CdrStatusIconProps } from '../CdrStatusIcon.vue';
+import {
+  IconInformationFill,
+  IconWarningFill,
+  IconCheckFill,
+  IconErrorFill,
+  IconQuestionFill,
+} from '../../icon';
+
+defineOptions({ name: 'StatusIcon' });
+
+interface Example extends CdrStatusIconProps {
+  icon: Object;
+}
+
+const examples: Example[] = [
+  { type: 'default', icon: IconInformationFill },
+  { type: 'warning', icon: IconWarningFill },
+  { type: 'success', icon: IconCheckFill },
+  { type: 'error', icon: IconErrorFill },
+  { type: 'info', icon: IconQuestionFill },
+];
+</script>
+
+<template>
+  <div class="example">
+    <h2>Status Icon</h2>
+    <ul>
+      <li
+        v-for="{ type, icon } in examples"
+        :key="type"
+      >
+        <CdrStatusIcon :type="type">
+          <component
+            :is="icon"
+            inherit-color
+          />
+        </CdrStatusIcon>
+        <CdrText>{{ type }}</CdrText>
+      </li>
+      <li>
+        <CdrStatusIcon type="default">
+          <IconErrorFill inherit-color />
+        </CdrStatusIcon>
+        <CdrText>default color with error icon</CdrText>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
+.example {
+  & ul {
+    margin: 0;
+    background: $cdr-color-background-secondary;
+    padding: $cdr-space-two-x;
+  }
+
+  & li {
+    display: flex;
+    align-items: center;
+    gap: $cdr-space-one-x;
+
+    &:not(:first-child) {
+      margin-top: $cdr-space-two-x;
+    }
+  }
+}
+</style>
diff --git a/src/components/statusIcon/styles/CdrStatusIcon.module.scss b/src/components/statusIcon/styles/CdrStatusIcon.module.scss
new file mode 100644
index 000000000..ab500d7ab
--- /dev/null
+++ b/src/components/statusIcon/styles/CdrStatusIcon.module.scss
@@ -0,0 +1,26 @@
+@import '../../../styles/settings/index.scss';
+@import './vars/CdrStatusIcon.vars.scss';
+
+.cdr-status-icon {
+  @include cdr-status-icon-base-mixin;
+
+  &--default {
+    @include cdr-status-icon-default-mixin;
+  }
+
+  &--info {
+    @include cdr-status-icon-info-mixin;
+  }
+
+  &--warning {
+    @include cdr-status-icon-warning-mixin;
+  }
+
+  &--success {
+    @include cdr-status-icon-success-mixin;
+  }
+
+  &--error {
+    @include cdr-status-icon-error-mixin;
+  }
+}
diff --git a/src/components/statusIcon/styles/vars/CdrStatusIcon.vars.scss b/src/components/statusIcon/styles/vars/CdrStatusIcon.vars.scss
new file mode 100644
index 000000000..99f8584b5
--- /dev/null
+++ b/src/components/statusIcon/styles/vars/CdrStatusIcon.vars.scss
@@ -0,0 +1,45 @@
+@mixin cdr-status-icon-base-mixin() {
+  svg {
+    max-height: 2.2rem;
+    max-width: 2.2rem;
+    stroke: white;
+    stroke-width: 0.4rem;
+    paint-order: stroke fill;
+    margin: $cdr-space-quarter-x;
+  }
+}
+
+@mixin cdr-status-icon-default-mixin() {
+  fill: var(
+    --cdr-status-icon-default-icon-fill,
+    var(--cdr-color-icon-message-default, #{$cdr-color-icon-message-default})
+  );
+}
+
+@mixin cdr-status-icon-info-mixin() {
+  fill: var(
+    --cdr-status-icon-default-icon-fill,
+    var(--cdr-color-border-message-info-01, #{$cdr-color-border-message-info-01})
+  );
+}
+
+@mixin cdr-status-icon-warning-mixin() {
+  fill: var(
+    --cdr-status-icon-default-icon-fill,
+    var(--cdr-color-border-message-warning-01, #{$cdr-color-border-message-warning-01})
+  );
+}
+
+@mixin cdr-status-icon-success-mixin() {
+  fill: var(
+    --cdr-status-icon-default-icon-fill,
+    var(--cdr-color-icon-message-success, #{$cdr-color-icon-message-success})
+  );
+}
+
+@mixin cdr-status-icon-error-mixin() {
+  fill: var(
+    --cdr-status-icon-default-icon-fill,
+    var(--cdr-color-border-message-error-01, #{$cdr-color-border-message-error-01})
+  );
+}
diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index 3b9ac03a8..4010116fb 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -76,7 +76,7 @@ const boxes: Example[] = [
   </div>
 </template>
 
-<style lang="scss">
+<style lang="scss" scoped>
 @import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
 
 .example {
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index 9a385a865..8a52ce2e4 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -67,7 +67,7 @@ const modifier = ref('primary');
   </div>
 </template>
 
-<style lang="scss">
+<style lang="scss" scoped>
 @import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
 
 .example {
diff --git a/src/components/text/presets/CdrBody.vue b/src/components/text/presets/CdrBody.vue
index 293c1b0ad..fe94116db 100644
--- a/src/components/text/presets/CdrBody.vue
+++ b/src/components/text/presets/CdrBody.vue
@@ -6,13 +6,13 @@ defineOptions({
   name: 'CdrBody',
 });
 
-interface bodyTextProps extends baseTextProps {
+export interface bodyTextProps extends baseTextProps {
    /** 
    * Sets the type scale
    * @type scaleValue
    * @values 0, 1
    */
-  scale?: '0'|'1',
+  scale?: '-2' | '-1' | '0' | '1',
   /** Toggles the strong variant */
   strong?: boolean,
 }
diff --git a/src/components/text/presets/CdrSubheadingSans.vue b/src/components/text/presets/CdrSubheadingSans.vue
index 804e0e9ef..f959f2b40 100644
--- a/src/components/text/presets/CdrSubheadingSans.vue
+++ b/src/components/text/presets/CdrSubheadingSans.vue
@@ -12,7 +12,7 @@ interface subheadingSansTextProps extends baseTextProps {
      * @type scaleValue
      * @values 0,1,2
    */
-  scale?: '0'|'1'|'2',
+  scale?: '-1' | '0'|'1'|'2',
 }
 
 const props = withDefaults(defineProps<subheadingSansTextProps>(), {
diff --git a/src/dev/router.js b/src/dev/router.js
index bc730e18f..49cb34d05 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -53,6 +53,7 @@ const routes = [
   { path: '/selects', name: 'Selects', component: Examples.selects },
   { path: '/skeleton', name: 'Skeleton', component: Examples.skeleton },
   { path: '/split-surface', name: 'Split Surface', component: Examples.splitSurface },
+  { path: '/statusIcon', name: 'Status Icon', component: Examples.statusIcon },
   { path: '/surface', name: 'Surface', component: Examples.surface },
   { path: '/surfaceSelection', name: 'SurfaceSelection', component: Examples.surfaceSelection },
   { path: '/tables', name: 'Tables', component: Examples.tables },
diff --git a/src/lib.ts b/src/lib.ts
index 1f88ac4c6..fc27ad18a 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -33,6 +33,7 @@ export { default as CdrSelect } from './components/select/CdrSelect.vue';
 export { default as CdrSkeleton } from './components/skeleton/CdrSkeleton.vue';
 export { default as CdrSkeletonBone } from './components/skeleton/CdrSkeletonBone.vue';
 export { default as CdrSplitSurface } from './components/splitSurface/CdrSplitSurface.vue';
+export { default as CdrStatusIcon } from './components/statusIcon/CdrStatusIcon.vue';
 export { default as CdrSurface } from './components/surface/CdrSurface.vue';
 export { default as CdrSurfaceSelection } from './components/surfaceSelection/CdrSurfaceSelection.vue';
 export { default as CdrTable } from './components/table/CdrTable.vue';
diff --git a/src/styles/settings/fluid.vars.scss b/src/styles/settings/fluid.vars.scss
index eb583d497..b7af5425d 100644
--- a/src/styles/settings/fluid.vars.scss
+++ b/src/styles/settings/fluid.vars.scss
@@ -16,11 +16,12 @@
 }
 
 // the clamp is comprized of 3 numbers representing the min value, the preferred size expression, and the max value
-// in order the valuse are: min spacing | base spacing + container-growth | max spacing 
+// in order the valuse are: min spacing | base spacing + container-growth | max spacing
 
 @supports(container-type: inline-size) {
   :root {
     // type
+    --cdr-type-scale--2: clamp(1.3rem, 0.29cqw + 1.24rem, 1.4rem);
     --cdr-type-scale--1: clamp(1.33rem, 0.29cqw + 1.24rem, 1.6rem);
     --cdr-type-scale-0: clamp(1.6rem, 0.44cqw + 1.46rem, 2rem);
     --cdr-type-scale-1: clamp(1.92rem, 0.64cqw + 1.72rem, 2.5rem);
@@ -46,7 +47,7 @@
     --cdr-space-scale-3--4: clamp(0.4rem, 0.2rem + 0.66cqi, 1rem);
     --cdr-space-scale-3--5: clamp(0.8rem, 0.1404px + 1.21cqi, 1.6rem);
 
-    
+
 
   }
   /** Remove once Safari < 16 is no longer a target */
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 0df0f94f1..89fd54a7d 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -10,6 +10,14 @@ import type {
   Orientation,
 } from './other';
 
+/**
+ * HtmlAttributes data object for allowing any HTML attribute
+ * @interface HtmlAttributes
+ */
+export interface HtmlAttributes {
+  [key: string]: any;
+}
+
 /**
  * Breadcrumb data object
  *
@@ -135,19 +143,11 @@ export interface pictureSourceObject {
  * Text component properties
  * @interface baseTextProps
  */
-export interface baseTextProps {
+export interface baseTextProps extends HtmlAttributes {
   /** Sets the HTML tag (p, span, h1, h2, etc) */
   tag?: string;
 }
 
-/**
- * HtmlAttributes data object for allowing any HTML attribute
- * @interface HtmlAttributes
- */
-export interface HtmlAttributes {
-  [key: string]: any;
-}
-
 /**
  * InlineCss data object for allowing any CSS attribute, including CSS variables
  * @interface InlineCss
diff --git a/src/types/other.ts b/src/types/other.ts
index e2648bce0..c59a819d1 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -39,3 +39,4 @@ export type BorderColor =
 export type BorderStyle = 'solid' | 'dotted' | 'dashed';
 export type Modifier = 'primary' | 'secondary';
 export type Orientation = 'vertical' | 'horizontal';
+export type Status = 'info' | 'warning' | 'success' | 'error' | 'default';
\ No newline at end of file

From 41e8d48884cde0ea11627d42999c5a9fd26ff981 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 5 Aug 2024 14:55:11 -0700
Subject: [PATCH 22/70] progress

---
 src/components/banner/CdrBanner.vue           |  42 +-
 .../banner/styles/CdrBanner.module.scss       |  29 +
 src/components/examples.js                    |   2 -
 .../fulfillmentTile/CdrFulfillmentTile.vue    |   1 +
 .../CdrFulfillmentTileHeader.vue              |  27 +-
 .../CdrFulfillmentTileIcon.vue                |  28 +
 .../CdrFulfillmentTileLayout.vue              |   3 +-
 .../__tests__/CdrFulfillmentTile.spec.js      |  21 +-
 .../CdrFulfillmentTileContent.spec.js         |   4 +-
 .../CdrFulfillmentTile.spec.js.snap           | 691 ++++++++++++------
 .../CdrFulfillmentTileContent.spec.js.snap    |   8 +-
 .../CdrFulfillmentTileHeader.spec.js.snap     |  27 +-
 .../examples/FulfillmentTile.vue              | 147 ++--
 .../CdrFulfillmentTileHeader.module.scss      |   2 +-
 .../styles/CdrFulfillmentTileIcon.module.scss |  26 +
 .../vars/CdrFulfillmentTileHeader.vars.scss   |   2 +-
 .../vars/CdrFulfillmentTileIcon.vars.scss     |  66 ++
 src/components/statusIcon/CdrStatusIcon.vue   |  33 -
 .../statusIcon/examples/StatusIcon.vue        |  74 --
 .../styles/CdrStatusIcon.module.scss          |  26 -
 .../styles/vars/CdrStatusIcon.vars.scss       |  45 --
 .../surfaceSelection/CdrSurfaceSelection.vue  |   1 +
 .../__tests__/CdrSurfaceSelection.spec.js     |  71 ++
 .../CdrSurfaceSelectionLayout.spec.js         |  35 +
 .../CdrSurfaceSelection.spec.js.snap          | 191 +++++
 .../CdrSurfaceSelectionLayout.spec.js.snap    |  28 +
 src/lib.ts                                    |   1 -
 src/types/interfaces.ts                       |   1 +
 src/types/other.ts                            |   2 +-
 src/utils/surface.ts                          |   7 +-
 30 files changed, 1124 insertions(+), 517 deletions(-)
 create mode 100644 src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue
 create mode 100644 src/components/fulfillmentTile/styles/CdrFulfillmentTileIcon.module.scss
 create mode 100644 src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileIcon.vars.scss
 delete mode 100644 src/components/statusIcon/CdrStatusIcon.vue
 delete mode 100644 src/components/statusIcon/examples/StatusIcon.vue
 delete mode 100644 src/components/statusIcon/styles/CdrStatusIcon.module.scss
 delete mode 100644 src/components/statusIcon/styles/vars/CdrStatusIcon.vars.scss
 create mode 100644 src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
 create mode 100644 src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js
 create mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
 create mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap

diff --git a/src/components/banner/CdrBanner.vue b/src/components/banner/CdrBanner.vue
index 4ad4d8f1c..b3eeb9ec1 100644
--- a/src/components/banner/CdrBanner.vue
+++ b/src/components/banner/CdrBanner.vue
@@ -1,32 +1,36 @@
 <script setup lang="ts">
 import { useCssModule, computed, useSlots } from 'vue';
-import CdrStatusIcon from '../statusIcon/CdrStatusIcon.vue';
-import { Status } from '../../types/other';
+import propValidator from '../../utils/propValidator';
 
 /** Provides contextual feedback messages for typical user actions */
 
-defineOptions({ name: 'CdrBanner' });
+defineOptions({
+  name: 'CdrBanner',
+});
 
-export interface CdrStatusIconProps {
+const props = defineProps({
   /**
    * Sets the banner style.
    * @demoSelectMultiple false
    * @values info, warning, success, error, default
-   */
-  type?: Status;
-}
-
-const props = withDefaults(defineProps<CdrStatusIconProps>(), {
-  type: 'default',
+ */
+  type: {
+    type: String,
+    validator: (value: string) => propValidator(
+      value,
+      ['info', 'warning', 'success', 'error', 'default'],
+    ),
+    default: 'default',
+  },
 });
 
 const slots = useSlots();
 const style = useCssModule();
 const baseClass = 'cdr-banner';
 const typeClass = computed(() => `${baseClass}--${props.type}`);
-const prominenceClass = computed(() =>
-  slots['message-body'] ? `${baseClass}__wrapper--prominence` : '',
-);
+const prominenceClass = computed(() => (slots['message-body']
+  ? `${baseClass}__wrapper--prominence`
+  : ''));
 const hasIconLeft = slots['icon-left'];
 const hasIconRight = slots['icon-right'];
 const hasMessageBody = slots['message-body'];
@@ -37,25 +41,24 @@ const hasInfoAction = slots['info-action'];
   <div :class="[style[baseClass], style[typeClass]]">
     <div :class="[style['cdr-banner__wrapper'], style[prominenceClass]]">
       <div :class="[style['cdr-banner__main']]">
-        <CdrStatusIcon
+        <div
           v-if="hasIconLeft"
-          :type="type"
           :class="[style['cdr-banner__icon-left']]"
         >
           <!-- @slot Icon matching banner type -->
           <slot name="icon-left" />
-        </CdrStatusIcon>
+        </div>
         <span :class="[style['cdr-banner__message']]">
           <!-- @slot Primary message content -->
           <slot />
         </span>
-        <CdrStatusIcon
+        <div
           v-if="hasIconRight"
           :class="[style['cdr-banner__icon-right']]"
         >
           <!-- @slot Additional icon -->
           <slot name="icon-right" />
-        </CdrStatusIcon>
+        </div>
       </div>
       <div
         v-if="hasMessageBody"
@@ -75,4 +78,5 @@ const hasInfoAction = slots['info-action'];
   </div>
 </template>
 
-<style lang="scss" module src="./styles/CdrBanner.module.scss"></style>
+<style lang="scss" module src="./styles/CdrBanner.module.scss">
+</style>
diff --git a/src/components/banner/styles/CdrBanner.module.scss b/src/components/banner/styles/CdrBanner.module.scss
index 9f68e2dd6..0977c9482 100644
--- a/src/components/banner/styles/CdrBanner.module.scss
+++ b/src/components/banner/styles/CdrBanner.module.scss
@@ -26,6 +26,15 @@
     display: inherit;
     align-items: center;
     justify-items: center;
+    & svg {
+      max-height: 2.2rem;
+      max-width: 2.2rem;
+      stroke: white;
+      stroke-width: 0.4rem;
+      paint-order: stroke fill;
+      margin: $cdr-space-quarter-x;
+
+    }
   }
   &__message {
     display: inherit;
@@ -70,6 +79,10 @@
       & .cdr-banner__icon-left {
           //ITEM_DOC: Left icon background color for default banner
           background-color: var(--cdr-banner-default-icon-left-background-color, var(--cdr-color-background-message-default-02, #{$cdr-color-background-message-default-02}));
+          svg {
+            //ITEM_DOC: Left icon fill color for default banner
+            fill: var(--cdr-banner-default-icon-left-fill, var(--cdr-color-icon-message-default, #{$cdr-color-icon-message-default}));
+          }
         }
       }
       & .cdr-banner__wrapper {
@@ -85,6 +98,10 @@
       & .cdr-banner__icon-left {
         //ITEM_DOC: Left icon background color for info banner
         background-color: var(--cdr-banner-info-icon-left-background-color, var(--cdr-color-background-message-info-02, #{$cdr-color-background-message-info-02}));
+        svg {
+          //ITEM_DOC: Left icon fill color for info banner
+          fill: var(--cdr-banner-info-icon-left-fill, var(--cdr-color-icon-message-info, #{$cdr-color-icon-message-info}));
+        }
       }
     }
     & .cdr-banner__wrapper {
@@ -100,6 +117,10 @@
       & .cdr-banner__icon-left {
         //ITEM_DOC: Left icon background color for warning banner
         background-color: var(--cdr-banner-warning-icon-left-background-color, var(--cdr-color-background-message-warning-02, #{$cdr-color-background-message-warning-02}));
+        svg {
+          //ITEM_DOC: Left icon fill color for warning banner
+          fill: var(--cdr-banner-warning-icon-left-fill, var(--cdr-color-icon-message-warning, #{$cdr-color-icon-message-warning}));
+        }
       }
     }
     & .cdr-banner__wrapper {
@@ -115,6 +136,10 @@
       & .cdr-banner__icon-left {
         //ITEM_DOC: Left icon background color for success banner
         background-color: var(--cdr-banner-success-icon-left-background-color, var(--cdr-color-background-message-success-02, #{$cdr-color-background-message-success-02}));
+        svg {
+          //ITEM_DOC: Left icon fill color for success banner
+          fill: var(--cdr-banner-success-icon-left-fill, var(--cdr-color-icon-message-success, #{$cdr-color-icon-message-success}));
+        }
       }
     }
     & .cdr-banner__wrapper {
@@ -130,6 +155,10 @@
       & .cdr-banner__icon-left {
         //ITEM_DOC: Left icon background color for error banner
         background-color: var(--cdr-banner-error-icon-left-background-color, var(--cdr-color-background-message-error-02, #{$cdr-color-background-message-error-02}));
+        svg {
+          //ITEM_DOC: Left icon fill color for error banner
+          fill: var(--cdr-banner-error-icon-left-fill, var(--cdr-color-icon-message-error, #{$cdr-color-icon-message-error}));
+        }
       }
     }
     & .cdr-banner__wrapper {
diff --git a/src/components/examples.js b/src/components/examples.js
index 719ab0c1e..cc621401d 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -30,7 +30,6 @@ import rating from 'componentsdir/rating/examples/Ratings.vue';
 import selects from 'componentsdir/select/examples/Selects.vue';
 import skeleton from 'componentsdir/skeleton/examples/Skeleton.vue';
 import splitSurface from 'componentsdir/splitSurface/examples/SplitSurface.vue';
-import statusIcon from 'componentsdir/statusIcon/examples/StatusIcon.vue';
 import surface from 'componentsdir/surface/examples/Surface.vue';
 import surfaceSelection from 'componentsdir/surfaceSelection/examples/SurfaceSelection.vue';
 import tables from 'componentsdir/table/examples/Table.vue';
@@ -76,7 +75,6 @@ export default {
   selects,
   skeleton,
   splitSurface,
-  statusIcon,
   surface,
   surfaceSelection,
   tables,
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 2622e1f64..2ce64de4a 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -17,6 +17,7 @@ const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   tag: 'button',
   modifier: 'primary',
   checked: false,
+  disabled: false,
   type: 'button',
   loading: false,
   orientation: 'vertical',
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
index c5ccad9bc..d034fd3e9 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -1,20 +1,37 @@
 <script setup lang="ts">
-import { useCssModule } from 'vue';
+import { useCssModule, computed } from 'vue';
 import CdrSubheadingSans from '../text/presets/CdrSubheadingSans.vue';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
+import type { CdrFulfillmentTileLayoutProps } from './CdrFulfillmentTileLayout.vue';
 
 /** Fulfillment tile header component */
 
 defineOptions({ name: 'CdrFulfillmentTileHeader' });
 
+export interface CdrFulfillmentTileHeaderProps {
+  disabled?: boolean;
+}
+
+const props = withDefaults(defineProps<CdrFulfillmentTileHeaderProps>(), {
+  disabled: false,
+});
+
 const style = useCssModule();
+const baseClass = 'cdr-fulfillment-tile-header';
+
+const rootProps = computed(
+  (): CdrFulfillmentTileLayoutProps => ({
+    orientation: 'horizontal',
+    class: {
+      [style[baseClass]]: true,
+      [style[`${baseClass}--disabled`]]: props.disabled,
+    },
+  }),
+);
 </script>
 
 <template>
-  <CdrFulfillmentTileLayout
-    orientation="horizontal"
-    :class="style['cdr-fulfillment-tile-header']"
-  >
+  <CdrFulfillmentTileLayout v-bind="rootProps">
     <span
       v-if="$slots['icon-left']"
       :class="style['cdr-fulfillment-tile-header__icon']"
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue b/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue
new file mode 100644
index 000000000..96b74e826
--- /dev/null
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue
@@ -0,0 +1,28 @@
+<script setup lang="ts">
+import { useCssModule, computed } from 'vue';
+import { StatusType } from '../../types/other';
+
+/** Provides stylized icons for typical notifications */
+
+defineOptions({ name: 'CdrFulfillmentTileIcon' });
+
+export interface CdrFulfillmentTileIconProps {
+  type?: StatusType;
+}
+
+const props = withDefaults(defineProps<CdrFulfillmentTileIconProps>(), {
+  type: 'default',
+});
+
+const style = useCssModule();
+const baseClass = 'cdr-fulfillment-tile-icon';
+const typeClass = computed(() => `${baseClass}--${props.type}`);
+</script>
+
+<template>
+  <span :class="[style[baseClass], style[typeClass]]">
+    <slot />
+  </span>
+</template>
+
+<style lang="scss" module src="./styles/CdrFulfillmentTileIcon.module.scss"></style>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
index 602b6400f..2c75ced1c 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
@@ -2,12 +2,13 @@
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
 import { Orientation } from '../../types/other';
+import { HtmlAttributes } from '../../types/interfaces';
 
 /** Component for layout of a surface selection */
 
 defineOptions({ name: 'CdrFulfillmentTileLayout' });
 
-interface CdrFulfillmentTileLayoutProps {
+export interface CdrFulfillmentTileLayoutProps extends HtmlAttributes {
   orientation?: Orientation;
 }
 
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
index cb0eb6418..9537d6009 100644
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
@@ -26,7 +26,10 @@ describe('CdrFulfillmentTile', () => {
         expect(wrapper.element.tagName).toBe('BUTTON');
       });
       it('base classes only', () => {
-        expect(wrapper.classes()).toEqual(['cdr-fulfillment-tile']);
+        expect(wrapper.classes()).toEqual([
+          'cdr-fulfillment-tile',
+          'cdr-fulfillment-tile--modifier-primary',
+        ]);
       });
     });
   });
@@ -78,7 +81,6 @@ describe('CdrFulfillmentTile', () => {
     });
     expect(wrapper.element).toMatchSnapshot();
     expect(wrapper.find('.cdr-fulfillment-tile-content--stretch').text()).toBe('Body slot');
-
   });
 
   it('shows footer', () => {
@@ -102,8 +104,17 @@ describe('CdrFulfillmentTile', () => {
       },
     });
     expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find('.cdr-fulfillment-tile__loading').exists()).toBe(true);
-    expect(wrapper.find('.cdr-fulfillment-tile-header').exists()).toBe(false);
-    expect(wrapper.find('.cdr-fulfillment-tile-content').exists()).toBe(false);
+    expect(wrapper.find('.cdr-fulfillment-tile').attributes('data-loading')).toBe('true');
+  });
+
+  it('is not loading', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false, loading: false },
+      slots: {
+        label: 'Label slot',
+        footer: 'Footer slot',
+      },
+    });
+    expect(wrapper.find('.cdr-fulfillment-tile').attributes('data-loading')).toBe(undefined);
   });
 });
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
index 7da8aa845..c73bc02e5 100644
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
@@ -9,7 +9,7 @@ describe('CdrFulfillmentTileContent', () => {
       },
     });
     expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.classes()).toEqual(['cdr-utility-sans', 'cdr-fulfillment-tile-content']);
+    expect(wrapper.classes()).toEqual(['cdr-body', 'cdr-fulfillment-tile-content']);
     expect(wrapper.text()).toBe('Default slot');
   });
 
@@ -24,7 +24,7 @@ describe('CdrFulfillmentTileContent', () => {
     });
     expect(wrapper.element).toMatchSnapshot();
     expect(wrapper.classes()).toEqual([
-      'cdr-utility-sans',
+      'cdr-body',
       'cdr-fulfillment-tile-content',
       'cdr-fulfillment-tile-content--stretch',
     ]);
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
index 7b9108b5e..730e2a7ff 100644
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -3,47 +3,130 @@
 exports[`CdrFulfillmentTile > component unit tests > default component with no configuration > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
 >
-  
   <div
-    class="cdr-fulfillment-tile-header"
+    class="cdr-fulfillment-tile__inner"
   >
-    <!--v-if-->
-    <span
-      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
     >
       
-      
-    </span>
-    <!--v-if-->
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
   </div>
-  <!--v-if-->
-  <!--v-if-->
-  
 </button>
 `;
 
 exports[`CdrFulfillmentTile > is loading 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  data-loading="true"
 >
   <div
-    aria-busy="true"
-    aria-live="polite"
-    class="cdr-skeleton cdr-fulfillment-tile__loading"
+    class="cdr-fulfillment-tile__inner"
   >
-    <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-    
     <div
-      class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-    />
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
     <div
-      class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-    />
-    
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <!--v-if-->
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
   </div>
 </button>
 `;
@@ -51,256 +134,450 @@ exports[`CdrFulfillmentTile > is loading 1`] = `
 exports[`CdrFulfillmentTile > shows body 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
 >
-  
   <div
-    class="cdr-fulfillment-tile-header"
+    class="cdr-fulfillment-tile__inner"
   >
-    <!--v-if-->
-    <span
-      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
     >
       
-      
-      
-      Label slot
-      
-      
-      
-    </span>
-    <!--v-if-->
-  </div>
-  <div
-    class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
-  >
-    
-    
-    
-    Body slot
-    
-    
-    
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Body slot
+          
+          
+          
+        </div>
+        <!--v-if-->
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
   </div>
-  <!--v-if-->
-  
 </button>
 `;
 
 exports[`CdrFulfillmentTile > shows footer 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
 >
-  
   <div
-    class="cdr-fulfillment-tile-header"
+    class="cdr-fulfillment-tile__inner"
   >
-    <!--v-if-->
-    <span
-      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
     >
       
-      
-      
-      Label slot
-      
-      
-      
-    </span>
-    <!--v-if-->
-  </div>
-  <!--v-if-->
-  <div
-    class="cdr-utility-sans cdr-fulfillment-tile-content"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
-  >
-    
-    
-    
-    Footer slot
-    
-    
-    
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <!--v-if-->
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
   </div>
-  
 </button>
 `;
 
 exports[`CdrFulfillmentTile > shows header 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
 >
-  
   <div
-    class="cdr-fulfillment-tile-header"
+    class="cdr-fulfillment-tile__inner"
   >
-    <!--v-if-->
-    <span
-      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
     >
       
-      
-      
-      Label slot
-      
-      
-      
-    </span>
-    <!--v-if-->
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
   </div>
-  <!--v-if-->
-  <!--v-if-->
-  
 </button>
 `;
 
 exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
 >
-  
   <div
-    class="cdr-fulfillment-tile-header"
+    class="cdr-fulfillment-tile__inner"
   >
-    <!--v-if-->
-    <span
-      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
     >
       
-      
-    </span>
-    <!--v-if-->
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
   </div>
-  <!--v-if-->
-  <!--v-if-->
-  
 </button>
 `;
 
 exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
 >
-  
   <div
-    class="cdr-fulfillment-tile-header"
+    class="cdr-fulfillment-tile__inner"
   >
-    <!--v-if-->
-    <span
-      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
     >
       
-      
-      
-      Label slot
-      
-      
-      
-    </span>
-    <span
-      class="cdr-fulfillment-tile-header__icon"
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <span
+        class="cdr-fulfillment-tile-header__icon"
+      >
+        
+        
+        X
+        
+        
+      </span>
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
     >
-      
-      
-      X
-      
-      
-    </span>
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Body slot
+          
+          
+          
+        </div>
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
   </div>
-  <div
-    class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
-  >
-    
-    
-    
-    Body slot
-    
-    
-    
-  </div>
-  <div
-    class="cdr-utility-sans cdr-fulfillment-tile-content"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
-  >
-    
-    
-    
-    Footer slot
-    
-    
-    
-  </div>
-  
 </button>
 `;
 
 exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
 >
-  
   <div
-    class="cdr-fulfillment-tile-header"
+    class="cdr-fulfillment-tile__inner"
   >
-    <span
-      class="cdr-fulfillment-tile-header__icon"
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
     >
       
-      
-      X
-      
-      
-    </span>
-    <span
-      class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-      style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+      <span
+        class="cdr-fulfillment-tile-header__icon"
+      >
+        
+        
+        X
+        
+        
+      </span>
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
     >
-      
-      
-      
-      Label slot
-      
-      
-      
-    </span>
-    <!--v-if-->
-  </div>
-  <div
-    class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
-  >
-    
-    
-    
-    Body slot
-    
-    
-    
-  </div>
-  <div
-    class="cdr-utility-sans cdr-fulfillment-tile-content"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
-  >
-    
-    
-    
-    Footer slot
-    
-    
-    
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Body slot
+          
+          
+          
+        </div>
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
   </div>
-  
 </button>
 `;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
index 61d1ddd97..9b37dd1f2 100644
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
@@ -2,8 +2,8 @@
 
 exports[`CdrFulfillmentTileContent > is stretch 1`] = `
 <div
-  class="cdr-utility-sans cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-  style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+  class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
 >
   
   
@@ -15,8 +15,8 @@ exports[`CdrFulfillmentTileContent > is stretch 1`] = `
 
 exports[`CdrFulfillmentTileContent > shows content 1`] = `
 <div
-  class="cdr-utility-sans cdr-fulfillment-tile-content"
-  style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 400;"
+  class="cdr-body cdr-fulfillment-tile-content"
+  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
 >
   
   
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
index 3830d3639..50fe0c0ad 100644
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
@@ -2,8 +2,9 @@
 
 exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
 <div
-  class="cdr-fulfillment-tile-header"
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
 >
+  
   <span
     class="cdr-fulfillment-tile-header__icon"
   >
@@ -12,8 +13,9 @@ exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
     
   </span>
   <span
-    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
   >
     
     
@@ -22,17 +24,20 @@ exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
     
   </span>
   <!--v-if-->
+  
 </div>
 `;
 
 exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
 <div
-  class="cdr-fulfillment-tile-header"
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
 >
+  
   <!--v-if-->
   <span
-    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
   >
     
     
@@ -47,17 +52,20 @@ exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
     X
     
   </span>
+  
 </div>
 `;
 
 exports[`CdrFulfillmentTileHeader > shows label 1`] = `
 <div
-  class="cdr-fulfillment-tile-header"
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
 >
+  
   <!--v-if-->
   <span
-    class="cdr-utility-sans cdr-fulfillment-tile-header__label"
-    style="--cdr-utility-sans-font-size: var(--cdr-type-scale--1); --cdr-utility-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-utility-sans-line-height-ratio)); --cdr-utility-sans-font-weight: 600;"
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
   >
     
     
@@ -66,5 +74,6 @@ exports[`CdrFulfillmentTileHeader > shows label 1`] = `
     
   </span>
   <!--v-if-->
+  
 </div>
 `;
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 81f9d4529..30846f551 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -7,6 +7,7 @@ import { IconCheckFill, IconErrorFill, IconXFill } from '../../icon';
 import CdrButton from '../../button/CdrButton.vue';
 import CdrSurface from '../../surface/CdrSurface.vue';
 import CdrSurfaceSelection from '../../surfaceSelection/CdrSurfaceSelection.vue';
+import CdrFulfillmentTileIcon from '../CdrFulfillmentTileIcon.vue';
 
 defineOptions({ name: 'FulfillmentTile' });
 
@@ -55,7 +56,9 @@ const toggleCheckbox2 = (value: number) => {
         :checked="false"
       >
         <template #icon-right>
-          <IconErrorFill inherit-color />
+          <CdrFulfillmentTileIcon type="default">
+            <IconErrorFill inherit-color />
+          </CdrFulfillmentTileIcon>
         </template>
         <template #label>Pick up</template>
         <template #body>Not offered</template>
@@ -71,7 +74,9 @@ const toggleCheckbox2 = (value: number) => {
           v-if="radio1 === 1"
           #icon-right
         >
-          <IconCheckFill inherit-color />
+          <CdrFulfillmentTileIcon type="success">
+            <IconCheckFill inherit-color />
+          </CdrFulfillmentTileIcon>
         </template>
         <template #label>Ship to address</template>
         <template #body>Today after 2pm</template>
@@ -91,7 +96,9 @@ const toggleCheckbox2 = (value: number) => {
           v-if="radio1 === 2"
           #icon-right
         >
-          <IconCheckFill inherit-color />
+          <CdrFulfillmentTileIcon type="success">
+            <IconCheckFill inherit-color />
+          </CdrFulfillmentTileIcon>
         </template>
         <template #label>Another option</template>
         <template #footer>
@@ -111,7 +118,9 @@ const toggleCheckbox2 = (value: number) => {
           v-if="radio1 === 3"
           #icon-right
         >
-          <IconCheckFill inherit-color />
+          <CdrFulfillmentTileIcon type="success">
+            <IconCheckFill inherit-color />
+          </CdrFulfillmentTileIcon>
         </template>
         <template #label>Loading option</template>
         <template #body>
@@ -141,24 +150,9 @@ const toggleCheckbox2 = (value: number) => {
           @click="toggleCheckbox1(1)"
         >
           <template #icon-left>
-            <IconCheckFill
-              v-if="checkbox1.includes(1)"
-              inherit-color
+            <div
+              :class="{ example__icon: true, 'example__icon--checked': checkbox1.includes(1) }"
             />
-            <svg
-              v-else
-              xmlns="http://www.w3.org/2000/svg"
-              viewBox="0 0 24 24"
-              class="example__icon"
-            >
-              <g>
-                <path
-                  fill-rule="evenodd"
-                  d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 11-16 0 8 8 0 0116 0z"
-                  clip-rule="evenodd"
-                ></path>
-              </g>
-            </svg>
           </template>
           <template #label>Store Pickup (32)</template>
           <template #footer>
@@ -181,24 +175,7 @@ const toggleCheckbox2 = (value: number) => {
         @click="toggleCheckbox1(2)"
       >
         <template #icon-left>
-          <IconCheckFill
-            v-if="checkbox1.includes(2)"
-            inherit-color
-          />
-          <svg
-            v-else
-            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
-            class="example__icon"
-          >
-            <g>
-              <path
-                fill-rule="evenodd"
-                d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 11-16 0 8 8 0 0116 0z"
-                clip-rule="evenodd"
-              ></path>
-            </g>
-          </svg>
+          <div :class="{ example__icon: true, 'example__icon--checked': checkbox1.includes(2) }" />
         </template>
         <template #label>Ship to address (32)</template>
       </CdrFulfillmentTile>
@@ -225,7 +202,9 @@ const toggleCheckbox2 = (value: number) => {
           v-if="radio2 === 0"
           #icon-right
         >
-          <IconXFill inherit-color />
+          <CdrFulfillmentTileIcon type="default">
+            <IconXFill inherit-color />
+          </CdrFulfillmentTileIcon>
         </template>
         <template #label>Pick up</template>
         <template #body>Not offered</template>
@@ -240,7 +219,9 @@ const toggleCheckbox2 = (value: number) => {
           v-if="radio2 === 1"
           #icon-right
         >
-          <IconCheckFill inherit-color />
+          <CdrFulfillmentTileIcon type="success">
+            <IconCheckFill inherit-color />
+          </CdrFulfillmentTileIcon>
         </template>
         <template #label>Ship to address</template>
         <template #body>
@@ -268,9 +249,7 @@ const toggleCheckbox2 = (value: number) => {
     >
       <CdrSurface
         class="example__search-tile-other"
-        :border-width="checkbox2.includes(1) ? 'eighth-x' : 'sixteenth-x'"
-        :with-border="true"
-        :border-color="checkbox2.includes(1) ? 'secondary' : 'primary'"
+        :data-store-checked="checkbox2.includes(1)"
         radius="softer"
       >
         <CdrSurfaceSelection
@@ -281,28 +260,13 @@ const toggleCheckbox2 = (value: number) => {
         >
           <CdrFulfillmentTileHeader>
             <template #icon-left>
-              <IconCheckFill
-                v-if="checkbox2.includes(1)"
-                inherit-color
+              <div
+                :class="{ example__icon: true, 'example__icon--checked': checkbox2.includes(1) }"
               />
-              <svg
-                v-else
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 24 24"
-                class="example__icon"
-              >
-                <g>
-                  <path
-                    fill-rule="evenodd"
-                    d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 11-16 0 8 8 0 0116 0z"
-                    clip-rule="evenodd"
-                  ></path>
-                </g>
-              </svg>
             </template>
             <template #label>Store Pickup (32)</template>
           </CdrFulfillmentTileHeader>
-          <CdrFulfillmentTileContent class="example__search-tile-other-header-content">
+          <CdrFulfillmentTileContent>
             In stock at
             <strong>Encinitas</strong>
           </CdrFulfillmentTileContent>
@@ -326,6 +290,8 @@ const toggleCheckbox2 = (value: number) => {
 @import '../styles/vars/CdrFulfillmentTile.vars.scss';
 @import '../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 
+$component: 'fulfillment-tile';
+
 @mixin tile-colors() {
   &[aria-pressed='true'],
   &[aria-checked='true'] {
@@ -349,9 +315,14 @@ const toggleCheckbox2 = (value: number) => {
   }
 
   &__row {
-    display: grid;
+    display: flex;
     gap: var(--cdr-space-three-quarter-x);
-    grid-template-columns: 230px 230px 230px 230px;
+    flex-wrap: wrap;
+
+    > * {
+      width: 230px;
+      flex: 0 0 auto;
+    }
   }
 
   &__checkout-tile {
@@ -365,15 +336,23 @@ const toggleCheckbox2 = (value: number) => {
 
   &__search-tile {
     @include tile-colors;
+    width: 100%;
   }
 
   &__icon {
     display: inline-block;
     vertical-align: middle;
     flex: 0 0 auto;
-    width: 2.4rem;
-    height: 2.4rem;
+    width: 1.8rem;
+    height: 1.8rem;
+    margin: $cdr-space-eighth-x;
     fill: inherit;
+    border-radius: $cdr-radius-round;
+    border: $cdr-space-sixteenth-x solid #2e2e2b;
+
+    &--checked {
+      border-width: 0.7rem;
+    }
   }
 
   &__change-store {
@@ -384,22 +363,34 @@ const toggleCheckbox2 = (value: number) => {
 
   &__checkout-tile-other-disabled {
     --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-    --cdr-color-background-fulfillment-tile: var(--cdr-color-background-button-default-disabled);
-    --cdr-color-background-fulfillment-tile-checked: var(
-      --cdr-color-background-button-default-disabled
-    );
+    #{--cdr-color-background-fulfillment-tile}: $cdr-color-background-surface-selection-primary-disabled;
+    #{--cdr-color-background-fulfillment-tile-checked}: $cdr-color-background-surface-selection-primary-disabled;
+    @include cdr-border-style-mixin($component, 'dashed');
   }
 
   &__search-tile-other {
-    gap: 0;
-    padding-top: 0;
-    padding-bottom: 0;
+    $modifier: 'default';
+    @include cdr-border-mixin($component);
+    @include cdr-border-style-mixin($component, 'solid');
+    @include cdr-border-width-mixin($component, 'sixteenth-x');
+    @include cdr-border-color-mixin($fulfillment-tile-border-colors, $component, $modifier);
+    @include cdr-radius-mixin($component, 'softest');
+
+    &[data-store-checked='true'] {
+      $state: 'checked';
+      @include cdr-border-width-mixin($component, 'third-x');
+      @include cdr-border-color-mixin(
+        $fulfillment-tile-border-colors,
+        $component,
+        $modifier,
+        $state
+      );
+    }
   }
 
   &__search-tile-other-header-button {
     --cdr-surface-selection-border-width-default: 0;
     --cdr-color-background-surface-selection-primary-checked: var(--cdr-color-background-primary);
-    padding: var(--cdr-space-one-x) 0;
     width: 100%;
     @include tile-colors;
 
@@ -408,10 +399,6 @@ const toggleCheckbox2 = (value: number) => {
     }
   }
 
-  &__search-tile-other-header-content {
-    margin-top: var(--cdr-space-half-x);
-  }
-
   &__search-tile-other-header-hr {
     margin: 0;
     border-top: var(--cdr-space-sixteenth-x) solid initial;
@@ -419,8 +406,8 @@ const toggleCheckbox2 = (value: number) => {
   }
 
   &__change-store-other {
-    padding: var(--cdr-space-three-quarter-x) var(--cdr-space-one-x)
-      var(--cdr-space-one-x) var(--cdr-space-one-x);
+    padding: var(--cdr-space-three-quarter-x) var(--cdr-space-one-x) var(--cdr-space-one-x)
+      var(--cdr-space-one-x);
     justify-content: flex-start;
   }
 }
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
index 035b04716..79b4870c8 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileHeader.module.scss
@@ -1,5 +1,5 @@
 @import './vars/CdrFulfillmentTileHeader.vars.scss';
 
 .cdr-fulfillment-tile-header {
-  @include cdr-fulfillment-tile-header-mixin;
+  @include cdr-fulfillment-tile-header-base-mixin;
 }
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileIcon.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileIcon.module.scss
new file mode 100644
index 000000000..bb116d0f3
--- /dev/null
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileIcon.module.scss
@@ -0,0 +1,26 @@
+@import '../../../styles/settings/index.scss';
+@import './vars/CdrFulfillmentTileIcon.vars.scss';
+
+.cdr-fulfillment-tile-icon {
+  @include cdr-fulfillment-tile-icon-base-mixin;
+
+  &--default {
+    @include cdr-fulfillment-tile-icon-default-mixin;
+  }
+
+  &--info {
+    @include cdr-fulfillment-tile-icon-info-mixin;
+  }
+
+  &--warning {
+    @include cdr-fulfillment-tile-icon-warning-mixin;
+  }
+
+  &--success {
+    @include cdr-fulfillment-tile-icon-success-mixin;
+  }
+
+  &--error {
+    @include cdr-fulfillment-tile-icon-error-mixin;
+  }
+}
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
index 4f313cf63..dbd7fca04 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
@@ -1,6 +1,6 @@
 @import '../../../../styles/settings/index.scss';
 
-@mixin cdr-fulfillment-tile-header-mixin() {
+@mixin cdr-fulfillment-tile-header-base-mixin() {
   align-items: center;
   width: 100%;
   height: $cdr-space-one-and-a-half-x;
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileIcon.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileIcon.vars.scss
new file mode 100644
index 000000000..c4c5d356f
--- /dev/null
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileIcon.vars.scss
@@ -0,0 +1,66 @@
+@mixin cdr-fulfillment-tile-icon-base-mixin() {
+  width: 2.2rem;
+  height: 2.2rem;
+  background: white;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: $cdr-radius-round;
+  position: relative;
+
+  &:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    border-radius: inherit;
+    box-shadow: inset 0 0 0 $cdr-space-eighth-x var(--cdr-fulfillment-tile-icon-fill);
+    opacity: 0.3;
+  }
+
+  svg {
+    max-height: 2rem;
+    max-width: 2rem;
+    stroke: white;
+    stroke-width: $cdr-space-eighth-x;
+    paint-order: stroke fill;
+    margin: $cdr-space-quarter-x;
+  }
+}
+
+@mixin cdr-fulfillment-tile-icon-default-mixin() {
+  --cdr-fulfillment-tile-icon-fill: var(
+    --cdr-fulfillment-tile-icon-default-icon-fill,
+    var(--cdr-color-icon-message-default, #{$cdr-color-icon-message-default})
+  );
+}
+
+@mixin cdr-fulfillment-tile-icon-info-mixin() {
+  --cdr-fulfillment-tile-icon-fill: var(
+    --cdr-fulfillment-tile-icon-info-icon-fill,
+    var(--cdr-color-border-message-info-01, #{$cdr-color-border-message-info-01})
+  );
+}
+
+@mixin cdr-fulfillment-tile-icon-warning-mixin() {
+  --cdr-fulfillment-tile-icon-fill: var(
+    --cdr-fulfillment-tile-icon-warning-icon-fill,
+    var(--cdr-color-border-message-warning-01, #{$cdr-color-border-message-warning-01})
+  );
+}
+
+@mixin cdr-fulfillment-tile-icon-success-mixin() {
+  --cdr-fulfillment-tile-icon-fill: var(
+    --cdr-fulfillment-tile-icon-success-icon-fill,
+    var(--cdr-color-icon-message-success, #{$cdr-color-icon-message-success})
+  );
+}
+
+@mixin cdr-fulfillment-tile-icon-error-mixin() {
+  --cdr-fulfillment-tile-icon-fill: var(
+    --cdr-fulfillment-tile-icon-error-icon-fill,
+    var(--cdr-color-border-message-error-01, #{$cdr-color-border-message-error-01})
+  );
+}
diff --git a/src/components/statusIcon/CdrStatusIcon.vue b/src/components/statusIcon/CdrStatusIcon.vue
deleted file mode 100644
index 09fe54687..000000000
--- a/src/components/statusIcon/CdrStatusIcon.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<script setup lang="ts">
-import { useCssModule, computed } from 'vue';
-import { Status } from '../../types/other';
-
-/** Provides stylized icons for typical notifications */
-
-defineOptions({ name: 'CdrStatusIcon' });
-
-export interface CdrStatusIconProps {
-  /**
-   * Sets the icon style.
-   * @demoSelectMultiple false
-   * @values info, warning, success, error, default
-   */
-  type?: Status;
-}
-
-const props = withDefaults(defineProps<CdrStatusIconProps>(), {
-  type: 'default',
-});
-
-const style = useCssModule();
-const baseClass = 'cdr-status-icon';
-const typeClass = computed(() => `${baseClass}--${props.type}`);
-</script>
-
-<template>
-  <span :class="[style[baseClass], style[typeClass]]">
-    <slot />
-  </span>
-</template>
-
-<style lang="scss" module src="./styles/CdrStatusIcon.module.scss"></style>
diff --git a/src/components/statusIcon/examples/StatusIcon.vue b/src/components/statusIcon/examples/StatusIcon.vue
deleted file mode 100644
index 2ec0d72da..000000000
--- a/src/components/statusIcon/examples/StatusIcon.vue
+++ /dev/null
@@ -1,74 +0,0 @@
-<script setup lang="ts">
-import CdrStatusIcon from '../CdrStatusIcon.vue';
-import CdrText from '../../text/CdrText.vue';
-import type { CdrStatusIconProps } from '../CdrStatusIcon.vue';
-import {
-  IconInformationFill,
-  IconWarningFill,
-  IconCheckFill,
-  IconErrorFill,
-  IconQuestionFill,
-} from '../../icon';
-
-defineOptions({ name: 'StatusIcon' });
-
-interface Example extends CdrStatusIconProps {
-  icon: Object;
-}
-
-const examples: Example[] = [
-  { type: 'default', icon: IconInformationFill },
-  { type: 'warning', icon: IconWarningFill },
-  { type: 'success', icon: IconCheckFill },
-  { type: 'error', icon: IconErrorFill },
-  { type: 'info', icon: IconQuestionFill },
-];
-</script>
-
-<template>
-  <div class="example">
-    <h2>Status Icon</h2>
-    <ul>
-      <li
-        v-for="{ type, icon } in examples"
-        :key="type"
-      >
-        <CdrStatusIcon :type="type">
-          <component
-            :is="icon"
-            inherit-color
-          />
-        </CdrStatusIcon>
-        <CdrText>{{ type }}</CdrText>
-      </li>
-      <li>
-        <CdrStatusIcon type="default">
-          <IconErrorFill inherit-color />
-        </CdrStatusIcon>
-        <CdrText>default color with error icon</CdrText>
-      </li>
-    </ul>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
-
-.example {
-  & ul {
-    margin: 0;
-    background: $cdr-color-background-secondary;
-    padding: $cdr-space-two-x;
-  }
-
-  & li {
-    display: flex;
-    align-items: center;
-    gap: $cdr-space-one-x;
-
-    &:not(:first-child) {
-      margin-top: $cdr-space-two-x;
-    }
-  }
-}
-</style>
diff --git a/src/components/statusIcon/styles/CdrStatusIcon.module.scss b/src/components/statusIcon/styles/CdrStatusIcon.module.scss
deleted file mode 100644
index ab500d7ab..000000000
--- a/src/components/statusIcon/styles/CdrStatusIcon.module.scss
+++ /dev/null
@@ -1,26 +0,0 @@
-@import '../../../styles/settings/index.scss';
-@import './vars/CdrStatusIcon.vars.scss';
-
-.cdr-status-icon {
-  @include cdr-status-icon-base-mixin;
-
-  &--default {
-    @include cdr-status-icon-default-mixin;
-  }
-
-  &--info {
-    @include cdr-status-icon-info-mixin;
-  }
-
-  &--warning {
-    @include cdr-status-icon-warning-mixin;
-  }
-
-  &--success {
-    @include cdr-status-icon-success-mixin;
-  }
-
-  &--error {
-    @include cdr-status-icon-error-mixin;
-  }
-}
diff --git a/src/components/statusIcon/styles/vars/CdrStatusIcon.vars.scss b/src/components/statusIcon/styles/vars/CdrStatusIcon.vars.scss
deleted file mode 100644
index 99f8584b5..000000000
--- a/src/components/statusIcon/styles/vars/CdrStatusIcon.vars.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-@mixin cdr-status-icon-base-mixin() {
-  svg {
-    max-height: 2.2rem;
-    max-width: 2.2rem;
-    stroke: white;
-    stroke-width: 0.4rem;
-    paint-order: stroke fill;
-    margin: $cdr-space-quarter-x;
-  }
-}
-
-@mixin cdr-status-icon-default-mixin() {
-  fill: var(
-    --cdr-status-icon-default-icon-fill,
-    var(--cdr-color-icon-message-default, #{$cdr-color-icon-message-default})
-  );
-}
-
-@mixin cdr-status-icon-info-mixin() {
-  fill: var(
-    --cdr-status-icon-default-icon-fill,
-    var(--cdr-color-border-message-info-01, #{$cdr-color-border-message-info-01})
-  );
-}
-
-@mixin cdr-status-icon-warning-mixin() {
-  fill: var(
-    --cdr-status-icon-default-icon-fill,
-    var(--cdr-color-border-message-warning-01, #{$cdr-color-border-message-warning-01})
-  );
-}
-
-@mixin cdr-status-icon-success-mixin() {
-  fill: var(
-    --cdr-status-icon-default-icon-fill,
-    var(--cdr-color-icon-message-success, #{$cdr-color-icon-message-success})
-  );
-}
-
-@mixin cdr-status-icon-error-mixin() {
-  fill: var(
-    --cdr-status-icon-default-icon-fill,
-    var(--cdr-color-border-message-error-01, #{$cdr-color-border-message-error-01})
-  );
-}
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 1f28942f5..4492734ec 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -15,6 +15,7 @@ const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   tag: 'button',
   modifier: 'primary',
   checked: false,
+  disabled: false,
   type: 'button',
   loading: false,
   orientation: 'horizontal',
diff --git a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
new file mode 100644
index 000000000..23a8cf0f9
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
@@ -0,0 +1,71 @@
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
+
+describe('CdrSurfaceSelection', () => {
+  describe('snapshot test', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
+    });
+    it('renders correctly', () => {
+      expect(wrapper.element).toMatchSnapshot();
+    });
+  });
+
+  describe('component unit tests', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
+    });
+
+    describe('default component with no configuration', () => {
+      it('renders correctly', () => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
+      it('sets the default tag prop correctly', () => {
+        expect(wrapper.element.tagName).toBe('BUTTON');
+      });
+      it('base classes only', () => {
+        expect(wrapper.classes()).toEqual([
+          'cdr-surface-selection',
+          'cdr-surface-selection--modifier-primary',
+        ]);
+      });
+    });
+  });
+
+  it('shows default', () => {
+    const wrapper = mount(CdrSurfaceSelection, {
+      props: { checked: false },
+      slots: { default: 'Default slot' },
+    });
+    expect(wrapper.find('.cdr-surface-selection').text()).toBe('Default slot');
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('is loading', () => {
+    const wrapper = mount(CdrSurfaceSelection, {
+      props: { checked: false, loading: true },
+      slots: { default: 'Default slot' },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-surface-selection').attributes('data-loading')).toBe('true');
+  });
+
+  it('is not loading', () => {
+    const wrapper = mount(CdrSurfaceSelection, {
+      props: { checked: false, loading: false },
+      slots: { default: 'Default slot' },
+    });
+    expect(wrapper.find('.cdr-surface-selection').attributes('data-loading')).toBe(undefined);
+  });
+
+  it('is checked', () => {
+    const wrapper = mount(CdrSurfaceSelection, {
+      props: { checked: true },
+      slots: { default: 'Default slot' },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-surface-selection').attributes('aria-checked')).toBe('true');
+  });
+});
diff --git a/src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js b/src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js
new file mode 100644
index 000000000..73bf5772e
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js
@@ -0,0 +1,35 @@
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrSurfaceSelectionLayout from '../CdrSurfaceSelectionLayout.vue';
+
+describe('CdrSurfaceSelectionLayout', () => {
+  describe('snapshot test', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrSurfaceSelectionLayout, { props: { orientation: 'horizontal' } });
+    });
+
+    it('renders correctly', () => {
+      expect(wrapper.element).toMatchSnapshot();
+    });
+  });
+
+  describe('orientation test', () => {
+    it('shows horizontal', () => {
+      const wrapper = mount(CdrSurfaceSelectionLayout, { props: { orientation: 'horizontal' } });
+      expect(wrapper.element).toMatchSnapshot();
+      expect(wrapper.classes()).toEqual([
+        'cdr-surface-selection-layout',
+        'cdr-surface-selection-layout--horizontal',
+      ]);
+    });
+
+    it('shows vertical', () => {
+      const wrapper = mount(CdrSurfaceSelectionLayout, { props: { orientation: 'vertical' } });
+      expect(wrapper.element).toMatchSnapshot();
+      expect(wrapper.classes()).toEqual([
+        'cdr-surface-selection-layout',
+        'cdr-surface-selection-layout--vertical',
+      ]);
+    });
+  });
+});
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
new file mode 100644
index 000000000..0e815d9d8
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -0,0 +1,191 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > is checked 1`] = `
+<button
+  aria-checked="true"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      
+      Default slot
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > is loading 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  data-loading="true"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      
+      Default slot
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > shows default 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      
+      Default slot
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
new file mode 100644
index 000000000..35105992d
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
@@ -0,0 +1,28 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurfaceSelectionLayout > orientation test > shows horizontal 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+>
+  
+  
+</div>
+`;
+
+exports[`CdrSurfaceSelectionLayout > orientation test > shows vertical 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--vertical"
+>
+  
+  
+</div>
+`;
+
+exports[`CdrSurfaceSelectionLayout > snapshot test > renders correctly 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+>
+  
+  
+</div>
+`;
diff --git a/src/lib.ts b/src/lib.ts
index fc27ad18a..1f88ac4c6 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -33,7 +33,6 @@ export { default as CdrSelect } from './components/select/CdrSelect.vue';
 export { default as CdrSkeleton } from './components/skeleton/CdrSkeleton.vue';
 export { default as CdrSkeletonBone } from './components/skeleton/CdrSkeletonBone.vue';
 export { default as CdrSplitSurface } from './components/splitSurface/CdrSplitSurface.vue';
-export { default as CdrStatusIcon } from './components/statusIcon/CdrStatusIcon.vue';
 export { default as CdrSurface } from './components/surface/CdrSurface.vue';
 export { default as CdrSurfaceSelection } from './components/surfaceSelection/CdrSurfaceSelection.vue';
 export { default as CdrTable } from './components/table/CdrTable.vue';
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 89fd54a7d..8b965c745 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -188,6 +188,7 @@ export interface CdrSurfaceProps extends HtmlAttributes {
 }
 
 export interface CdrSurfaceSelectionProps extends CdrSurfaceProps {
+  disabled?: boolean;
   checked: boolean;
   type?: 'button' | 'reset' | 'submit' | undefined;
   loading?: boolean;
diff --git a/src/types/other.ts b/src/types/other.ts
index c59a819d1..e6d11a76c 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -39,4 +39,4 @@ export type BorderColor =
 export type BorderStyle = 'solid' | 'dotted' | 'dashed';
 export type Modifier = 'primary' | 'secondary';
 export type Orientation = 'vertical' | 'horizontal';
-export type Status = 'info' | 'warning' | 'success' | 'error' | 'default';
\ No newline at end of file
+export type StatusType = 'info' | 'warning' | 'success' | 'error' | 'default';
\ No newline at end of file
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index 7a8a0dbe9..bad3a4075 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -84,12 +84,17 @@ export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
 
 export const getSurfaceSelectionProps = (props: CdrSurfaceSelectionProps, baseClass: string) => {
   const { classes, inlineStyles } = getSurfaceProps(props, baseClass);
-  const { checked, loading } = props;
+  const { checked, loading, disabled } = props;
   const additionalProps: HtmlAttributes = {};
 
   // Add checked
   additionalProps['aria-checked'] = checked;
 
+  // Add disabled
+  if (disabled) {
+    additionalProps['disabled'] = disabled;
+  }
+
   // Add loading
   if (loading) {
     additionalProps['data-loading'] = loading;

From 3939f2812ad57964bc72e2839f5600320dd72767 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 5 Aug 2024 16:16:31 -0700
Subject: [PATCH 23/70] progress

---
 README.md                                     |     2 +
 package-lock.json                             | 16396 +++-------------
 package.json                                  |     7 +-
 .../fulfillmentTile/CdrFulfillmentTile.vue    |     1 +
 .../surfaceSelection/CdrSurfaceSelection.vue  |     1 +
 .../examples/SurfaceSelection.vue             |    20 +-
 src/dev/router.js                             |     2 +-
 src/types/interfaces.ts                       |     1 +
 src/utils/surface.ts                          |     4 +-
 test/e2e/nightwatch.conf.js                   |     4 +-
 10 files changed, 2660 insertions(+), 13778 deletions(-)

diff --git a/README.md b/README.md
index 504ce592a..b145ac455 100644
--- a/README.md
+++ b/README.md
@@ -43,6 +43,8 @@ Runs unit tests in watch mode. This also allows you to inspect snapshot discrepa
 
 Runs [Nightwatch](http://nightwatchjs.org/) end-to-end tests and Axe a11y tests.
 
+Tests run using Chromedriver. To upgrade Chromedriver, determine the latest version of Chrome and Puppeteer that are compatible by visiting [this](https://pptr.dev/supported-browsers) page.
+
 `npm run test`
 
 Runs both unit and e2e/accessibility tests.
diff --git a/package-lock.json b/package-lock.json
index 243c41d66..aa4a0b6b7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,7 +1,7 @@
 {
   "name": "@rei/cedar",
   "version": "15.1.0",
-  "lockfileVersion": 2,
+  "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
@@ -26,7 +26,7 @@
         "autoprefixer": "^10.2.5",
         "c8": "^7.11.0",
         "chalk": "^4.1.0",
-        "chromedriver": "^126.0.4",
+        "chromedriver": "127",
         "concat": "^1.0.3",
         "cross-env": "^7.0.3",
         "csstype": "^3.1.3",
@@ -53,7 +53,7 @@
         "postcss-calc": "^8.0.0",
         "postcss-pxtorem": "^6.0.0",
         "postcss-scss": "^4.0.0",
-        "puppeteer": "^22.10.0",
+        "puppeteer": "22.15.0",
         "sass": "^1.32.11",
         "sinon": "^11.1.0",
         "stylelint": "^16.1.0",
@@ -67,7 +67,7 @@
         "vue-docgen-cli": "^4.79.0",
         "vue-eslint-parser": "^9.3.0",
         "vue-router": "^4.0.10",
-        "vue-tsc": "^1.6.5"
+        "vue-tsc": "^2.0.29"
       },
       "engines": {
         "node": ">= 20.0.0",
@@ -78,145 +78,59 @@
         "vue": "^3.3.4"
       }
     },
-    "node_modules/@aashutoshrathi/word-wrap": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz",
-      "integrity": "sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==",
-      "dev": true,
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/@ampproject/remapping": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.2.1.tgz",
-      "integrity": "sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
+      "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
       "dev": true,
       "peer": true,
       "dependencies": {
-        "@jridgewell/gen-mapping": "^0.3.0",
-        "@jridgewell/trace-mapping": "^0.3.9"
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
       },
       "engines": {
         "node": ">=6.0.0"
       }
     },
-    "node_modules/@assemblyscript/loader": {
-      "version": "0.10.1",
-      "resolved": "https://registry.npmjs.org/@assemblyscript/loader/-/loader-0.10.1.tgz",
-      "integrity": "sha512-H71nDOOL8Y7kWRLqf6Sums+01Q5msqBW2KhDUTemh1tvY04eSkSXrK0uj/4mmY0Xr16/3zyZmsrxN7CKuRbNRg==",
-      "dev": true
-    },
     "node_modules/@babel/code-frame": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.23.5.tgz",
-      "integrity": "sha512-CgH3s1a96LipHCmSUmYFPwY7MNx8C3avkq7i4Wl3cfa662ldtUe4VM1TPXX70pfmrlWTb6jLqTYrZyT2ZTJBgA==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.24.7.tgz",
+      "integrity": "sha512-BcYH1CVJBO9tvyIZ2jVeXgSIMvGZ2FDRvDdOIVQyuklNKSsx+eppDEBq/g47Ayw+RqNFE+URvOShmf+f/qwAlA==",
       "dev": true,
       "dependencies": {
-        "@babel/highlight": "^7.23.4",
-        "chalk": "^2.4.2"
+        "@babel/highlight": "^7.24.7",
+        "picocolors": "^1.0.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
-    "node_modules/@babel/code-frame/node_modules/ansi-styles": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
-      "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-      "dev": true,
-      "dependencies": {
-        "color-convert": "^1.9.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/@babel/code-frame/node_modules/chalk": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-      "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-      "dev": true,
-      "dependencies": {
-        "ansi-styles": "^3.2.1",
-        "escape-string-regexp": "^1.0.5",
-        "supports-color": "^5.3.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/@babel/code-frame/node_modules/color-convert": {
-      "version": "1.9.3",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
-      "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-      "dev": true,
-      "dependencies": {
-        "color-name": "1.1.3"
-      }
-    },
-    "node_modules/@babel/code-frame/node_modules/color-name": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
-      "dev": true
-    },
-    "node_modules/@babel/code-frame/node_modules/escape-string-regexp": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
-      "dev": true,
-      "engines": {
-        "node": ">=0.8.0"
-      }
-    },
-    "node_modules/@babel/code-frame/node_modules/has-flag": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-      "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
-      "dev": true,
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/@babel/code-frame/node_modules/supports-color": {
-      "version": "5.5.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
-      "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-      "dev": true,
-      "dependencies": {
-        "has-flag": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/@babel/compat-data": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.23.5.tgz",
-      "integrity": "sha512-uU27kfDRlhfKl+w1U6vp16IuvSLtjAxdArVXPa9BvLkrr7CYIsxH5adpHObeAGY/41+syctUWOZ140a2Rvkgjw==",
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.25.2.tgz",
+      "integrity": "sha512-bYcppcpKBvX4znYaPEeFau03bp89ShqNMLs+rmdptMw+heSZh9+z84d2YG+K7cYLbWwzdjtDoW/uqZmPjulClQ==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/core": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.23.5.tgz",
-      "integrity": "sha512-Cwc2XjUrG4ilcfOw4wBAK+enbdgwAcAJCfGUItPBKR7Mjw4aEfAFYrLxeRp4jWgtNIKn3n2AlBOfwwafl+42/g==",
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.25.2.tgz",
+      "integrity": "sha512-BBt3opiCOxUr9euZ5/ro/Xv8/V7yJ5bjYMqG/C1YAo8MIKAnumZalCN+msbci3Pigy4lIQfPUpfMM27HMGaYEA==",
       "dev": true,
       "peer": true,
       "dependencies": {
         "@ampproject/remapping": "^2.2.0",
-        "@babel/code-frame": "^7.23.5",
-        "@babel/generator": "^7.23.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helpers": "^7.23.5",
-        "@babel/parser": "^7.23.5",
-        "@babel/template": "^7.22.15",
-        "@babel/traverse": "^7.23.5",
-        "@babel/types": "^7.23.5",
+        "@babel/code-frame": "^7.24.7",
+        "@babel/generator": "^7.25.0",
+        "@babel/helper-compilation-targets": "^7.25.2",
+        "@babel/helper-module-transforms": "^7.25.2",
+        "@babel/helpers": "^7.25.0",
+        "@babel/parser": "^7.25.0",
+        "@babel/template": "^7.25.0",
+        "@babel/traverse": "^7.25.2",
+        "@babel/types": "^7.25.2",
         "convert-source-map": "^2.0.0",
         "debug": "^4.1.0",
         "gensync": "^1.0.0-beta.2",
@@ -232,15 +146,14 @@
       }
     },
     "node_modules/@babel/generator": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.5.tgz",
-      "integrity": "sha512-BPssCHrBD+0YrxviOa3QzpqwhNIXKEtOa2jQrm4FlmkC2apYgRnQcmPWiGZDlGxiNtltnUFolMe8497Esry+jA==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.25.0.tgz",
+      "integrity": "sha512-3LEEcj3PVW8pW2R1SR1M89g/qrYk/m/mB/tLqn7dn4sbBUQyTqnlod+II2U4dqiGtUmkcnAmkMDralTFZttRiw==",
       "dev": true,
-      "peer": true,
       "dependencies": {
-        "@babel/types": "^7.23.5",
-        "@jridgewell/gen-mapping": "^0.3.2",
-        "@jridgewell/trace-mapping": "^0.3.17",
+        "@babel/types": "^7.25.0",
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.25",
         "jsesc": "^2.5.1"
       },
       "engines": {
@@ -248,38 +161,39 @@
       }
     },
     "node_modules/@babel/helper-annotate-as-pure": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.22.5.tgz",
-      "integrity": "sha512-LvBTxu8bQSQkcyKOU+a1btnNFQ1dMAd0R6PyW3arXes06F6QLWLIrd681bxRPIXlrMGR3XYnW9JyML7dP3qgxg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.24.7.tgz",
+      "integrity": "sha512-BaDeOonYvhdKw+JoMVkAixAAJzG2jVPIwWoKBPdYuY9b452e2rPuI9QPYh3KpofZ3pW2akOmwZLOiOsHMiqRAg==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.22.5"
+        "@babel/types": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-builder-binary-assignment-operator-visitor": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.22.15.tgz",
-      "integrity": "sha512-QkBXwGgaoC2GtGZRoma6kv7Szfv06khvhFav67ZExau2RaXzy8MpHSMO2PNoP2XtmQphJQRHFfg77Bq731Yizw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.24.7.tgz",
+      "integrity": "sha512-xZeCVVdwb4MsDBkkyZ64tReWYrLRHlMN72vP7Bdm3OUOuyFZExhsHUUnuWnm2/XOlAJzR0LfPpB56WXZn0X/lA==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.22.15"
+        "@babel/traverse": "^7.24.7",
+        "@babel/types": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-compilation-targets": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.15.tgz",
-      "integrity": "sha512-y6EEzULok0Qvz8yyLkCvVX+02ic+By2UdOhylwUOvOn9dvYc9mKICJuuU1n1XBI02YWsNsnrY1kc6DVbjcXbtw==",
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.25.2.tgz",
+      "integrity": "sha512-U2U5LsSaZ7TAt3cfaymQ8WHh0pxvdHoEk6HVpaexxixjyEquMh0L0YNJNM6CTGKMXV1iksi0iZkGw4AcFkPaaw==",
       "dev": true,
       "dependencies": {
-        "@babel/compat-data": "^7.22.9",
-        "@babel/helper-validator-option": "^7.22.15",
-        "browserslist": "^4.21.9",
+        "@babel/compat-data": "^7.25.2",
+        "@babel/helper-validator-option": "^7.24.8",
+        "browserslist": "^4.23.1",
         "lru-cache": "^5.1.1",
         "semver": "^6.3.1"
       },
@@ -288,19 +202,17 @@
       }
     },
     "node_modules/@babel/helper-create-class-features-plugin": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.23.5.tgz",
-      "integrity": "sha512-QELlRWxSpgdwdJzSJn4WAhKC+hvw/AtHbbrIoncKHkhKKR/luAlKkgBDcri1EzWAo8f8VvYVryEHN4tax/V67A==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-member-expression-to-functions": "^7.23.0",
-        "@babel/helper-optimise-call-expression": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
-        "@babel/helper-split-export-declaration": "^7.22.6",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.25.0.tgz",
+      "integrity": "sha512-GYM6BxeQsETc9mnct+nIIpf63SAyzvyYN7UB/IlTyd+MBg06afFGp0mIeUqGyWgS2mxad6vqbMrHVlaL3m70sQ==",
+      "dev": true,
+      "dependencies": {
+        "@babel/helper-annotate-as-pure": "^7.24.7",
+        "@babel/helper-member-expression-to-functions": "^7.24.8",
+        "@babel/helper-optimise-call-expression": "^7.24.7",
+        "@babel/helper-replace-supers": "^7.25.0",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
+        "@babel/traverse": "^7.25.0",
         "semver": "^6.3.1"
       },
       "engines": {
@@ -311,12 +223,12 @@
       }
     },
     "node_modules/@babel/helper-create-regexp-features-plugin": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.22.15.tgz",
-      "integrity": "sha512-29FkPLFjn4TPEa3RE7GpW+qbE8tlsu3jntNYNfcGsc49LphF1PQIiD+vMZ1z1xVOKt+93khA9tc2JBs3kBjA7w==",
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.25.2.tgz",
+      "integrity": "sha512-+wqVGP+DFmqwFD3EH6TMTfUNeqDehV3E/dl+Sd54eaXqm17tEUNbEIn4sVivVowbvUpOtIGxdo3GoXyDH9N/9g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
+        "@babel/helper-annotate-as-pure": "^7.24.7",
         "regexpu-core": "^5.3.1",
         "semver": "^6.3.1"
       },
@@ -328,9 +240,9 @@
       }
     },
     "node_modules/@babel/helper-define-polyfill-provider": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.4.3.tgz",
-      "integrity": "sha512-WBrLmuPP47n7PNwsZ57pqam6G/RGo1vw/87b0Blc53tZNGZ4x7YvZ6HgQe2vo1W/FR20OgjeZuGXzudPiXHFug==",
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.6.2.tgz",
+      "integrity": "sha512-LV76g+C502biUK6AyZ3LK10vDpDyCzZnhZFXkH1L75zHPj68+qc8Zfpx2th+gzwA2MzyK+1g/3EPl62yFnVttQ==",
       "dev": true,
       "dependencies": {
         "@babel/helper-compilation-targets": "^7.22.6",
@@ -343,75 +255,42 @@
         "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
       }
     },
-    "node_modules/@babel/helper-environment-visitor": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz",
-      "integrity": "sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==",
-      "dev": true,
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/helper-function-name": {
-      "version": "7.23.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz",
-      "integrity": "sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/template": "^7.22.15",
-        "@babel/types": "^7.23.0"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/helper-hoist-variables": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz",
-      "integrity": "sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/types": "^7.22.5"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/@babel/helper-member-expression-to-functions": {
-      "version": "7.23.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.23.0.tgz",
-      "integrity": "sha512-6gfrPwh7OuT6gZyJZvd6WbTfrqAo7vm4xCzAXOusKqq/vWdKXphTpj5klHKNmRUU6/QRGlBsyU9mAIPaWHlqJA==",
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.24.8.tgz",
+      "integrity": "sha512-LABppdt+Lp/RlBxqrh4qgf1oEH/WxdzQNDJIu5gC/W1GyvPVrOBiItmmM8wan2fm4oYqFuFfkXmlGpLQhPY8CA==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.23.0"
+        "@babel/traverse": "^7.24.8",
+        "@babel/types": "^7.24.8"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-module-imports": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz",
-      "integrity": "sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.24.7.tgz",
+      "integrity": "sha512-8AyH3C+74cgCVVXow/myrynrAGv+nTVg5vKu2nZph9x7RcRwzmh0VFallJuFTZ9mx6u4eSdXZfcOzSqTUm0HCA==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.22.15"
+        "@babel/traverse": "^7.24.7",
+        "@babel/types": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-module-transforms": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.23.3.tgz",
-      "integrity": "sha512-7bBs4ED9OmswdfDzpz4MpWgSrV7FXlc3zIagvLFjS5H+Mk7Snr21vQ6QwrsoCGMfNC4e4LQPdoULEt4ykz0SRQ==",
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.25.2.tgz",
+      "integrity": "sha512-BjyRAbix6j/wv83ftcVJmBt72QtHI56C7JXZoG2xATiLpmoC7dpd8WnkikExHDVPpi/3qCmO6WY1EaXOluiecQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-module-imports": "^7.22.15",
-        "@babel/helper-simple-access": "^7.22.5",
-        "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/helper-validator-identifier": "^7.22.20"
+        "@babel/helper-module-imports": "^7.24.7",
+        "@babel/helper-simple-access": "^7.24.7",
+        "@babel/helper-validator-identifier": "^7.24.7",
+        "@babel/traverse": "^7.25.2"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -421,35 +300,35 @@
       }
     },
     "node_modules/@babel/helper-optimise-call-expression": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.22.5.tgz",
-      "integrity": "sha512-HBwaojN0xFRx4yIvpwGqxiV2tUfl7401jlok564NgB9EHS1y6QT17FmKWm4ztqjeVdXLuC4fSvHc5ePpQjoTbw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.24.7.tgz",
+      "integrity": "sha512-jKiTsW2xmWwxT1ixIdfXUZp+P5yURx2suzLZr5Hi64rURpDYdMW0pv+Uf17EYk2Rd428Lx4tLsnjGJzYKDM/6A==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.22.5"
+        "@babel/types": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-plugin-utils": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz",
-      "integrity": "sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==",
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.24.8.tgz",
+      "integrity": "sha512-FFWx5142D8h2Mgr/iPVGH5G7w6jDn4jUSpZTyDnQO0Yn7Ks2Kuz6Pci8H6MPCoUJegd/UZQ3tAvfLCxQSnWWwg==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-remap-async-to-generator": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.22.20.tgz",
-      "integrity": "sha512-pBGyV4uBqOns+0UvhsTO8qgl8hO89PmiDYv+/COyp1aeMcmfrfruz+/nCMFiYyFF/Knn0yfrC85ZzNFjembFTw==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.25.0.tgz",
+      "integrity": "sha512-NhavI2eWEIz/H9dbrG0TuOicDhNexze43i5z7lEqwYm0WEZVTwnPpA0EafUTP7+6/W79HWIP2cTe3Z5NiSTVpw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-wrap-function": "^7.22.20"
+        "@babel/helper-annotate-as-pure": "^7.24.7",
+        "@babel/helper-wrap-function": "^7.25.0",
+        "@babel/traverse": "^7.25.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -459,14 +338,14 @@
       }
     },
     "node_modules/@babel/helper-replace-supers": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.22.20.tgz",
-      "integrity": "sha512-qsW0In3dbwQUbK8kejJ4R7IHVGwHJlV6lpG6UA7a9hSa2YEiAib+N1T2kr6PEeUT+Fl7najmSOS6SmAwCHK6Tw==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.25.0.tgz",
+      "integrity": "sha512-q688zIvQVYtZu+i2PsdIu/uWGRpfxzr5WESsfpShfZECkO+d2o+WROWezCi/Q6kJ0tfPa5+pUGUlfx2HhrA3Bg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-member-expression-to-functions": "^7.22.15",
-        "@babel/helper-optimise-call-expression": "^7.22.5"
+        "@babel/helper-member-expression-to-functions": "^7.24.8",
+        "@babel/helper-optimise-call-expression": "^7.24.7",
+        "@babel/traverse": "^7.25.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -476,106 +355,94 @@
       }
     },
     "node_modules/@babel/helper-simple-access": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.22.5.tgz",
-      "integrity": "sha512-n0H99E/K+Bika3++WNL17POvo4rKWZ7lZEp1Q+fStVbUi8nxPQEBOlTmCOxW/0JsS56SKKQ+ojAe2pHKJHN35w==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.24.7.tgz",
+      "integrity": "sha512-zBAIvbCMh5Ts+b86r/CjU+4XGYIs+R1j951gxI3KmmxBMhCg4oQMsv6ZXQ64XOm/cvzfU1FmoCyt6+owc5QMYg==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.22.5"
+        "@babel/traverse": "^7.24.7",
+        "@babel/types": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-skip-transparent-expression-wrappers": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.22.5.tgz",
-      "integrity": "sha512-tK14r66JZKiC43p8Ki33yLBVJKlQDFoA8GYN67lWCDCqoL6EMMSuM9b+Iff2jHaM/RRFYl7K+iiru7hbRqNx8Q==",
-      "dev": true,
-      "dependencies": {
-        "@babel/types": "^7.22.5"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/helper-split-export-declaration": {
-      "version": "7.22.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz",
-      "integrity": "sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.24.7.tgz",
+      "integrity": "sha512-IO+DLT3LQUElMbpzlatRASEyQtfhSE0+m465v++3jyyXeBTBUjtVZg28/gHeV5mrTJqvEKhKroBGAvhW+qPHiQ==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.22.5"
+        "@babel/traverse": "^7.24.7",
+        "@babel/types": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-string-parser": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.23.4.tgz",
-      "integrity": "sha512-803gmbQdqwdf4olxrX4AJyFBV/RTr3rSmOj0rKwesmzlfhYNDEs+/iOcznzpNWlJlIlTJC2QfPFcHB6DlzdVLQ==",
-      "dev": true,
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.8.tgz",
+      "integrity": "sha512-pO9KhhRcuUyGnJWwyEgnRJTSIZHiT+vMD0kPeD+so0l7mxkMT19g3pjY9GTnHySck/hDzq+dtW/4VgnMkippsQ==",
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-validator-identifier": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz",
-      "integrity": "sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==",
-      "dev": true,
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.24.7.tgz",
+      "integrity": "sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w==",
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-validator-option": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.23.5.tgz",
-      "integrity": "sha512-85ttAOMLsr53VgXkTbkx8oA6YTfT4q7/HzXSLEYmjcSTJPMPQtvq1BD79Byep5xMUYbGRzEpDsjUf3dyp54IKw==",
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.24.8.tgz",
+      "integrity": "sha512-xb8t9tD1MHLungh/AIoWYN+gVHaB9kwlu8gffXGSt3FFEIT7RjS+xWbc2vUD1UTZdIpKj/ab3rdqJ7ufngyi2Q==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-wrap-function": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-wrap-function/-/helper-wrap-function-7.22.20.tgz",
-      "integrity": "sha512-pms/UwkOpnQe/PDAEdV/d7dVCoBbB+R4FvYoHGZz+4VPcg7RtYy2KP7S2lbuWM6FCSgob5wshfGESbC/hzNXZw==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-wrap-function/-/helper-wrap-function-7.25.0.tgz",
+      "integrity": "sha512-s6Q1ebqutSiZnEjaofc/UKDyC4SbzV5n5SrA2Gq8UawLycr3i04f1dX4OzoQVnexm6aOCh37SQNYlJ/8Ku+PMQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-function-name": "^7.22.5",
-        "@babel/template": "^7.22.15",
-        "@babel/types": "^7.22.19"
+        "@babel/template": "^7.25.0",
+        "@babel/traverse": "^7.25.0",
+        "@babel/types": "^7.25.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helpers": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.23.5.tgz",
-      "integrity": "sha512-oO7us8FzTEsG3U6ag9MfdF1iA/7Z6dz+MtFhifZk8C8o453rGJFFWUP1t+ULM9TUIAzC9uxXEiXjOiVMyd7QPg==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.25.0.tgz",
+      "integrity": "sha512-MjgLZ42aCm0oGjJj8CtSM3DB8NOOf8h2l7DCTePJs29u+v7yO/RBX9nShlKMgFnRks/Q4tBAe7Hxnov9VkGwLw==",
       "dev": true,
       "peer": true,
       "dependencies": {
-        "@babel/template": "^7.22.15",
-        "@babel/traverse": "^7.23.5",
-        "@babel/types": "^7.23.5"
+        "@babel/template": "^7.25.0",
+        "@babel/types": "^7.25.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/highlight": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.23.4.tgz",
-      "integrity": "sha512-acGdbYSfp2WheJoJm/EBBBLh/ID8KDc64ISZ9DYtBmC8/Q204PZJLHyzeB5qMzJ5trcOkybd78M4x2KWsUq++A==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.24.7.tgz",
+      "integrity": "sha512-EStJpq4OuY8xYfhGVXngigBJRWxftKX9ksiGDnmlY3o7B/V7KIAc9X4oiK87uPJSc/vs5L869bem5fhZa8caZw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-validator-identifier": "^7.22.20",
+        "@babel/helper-validator-identifier": "^7.24.7",
         "chalk": "^2.4.2",
-        "js-tokens": "^4.0.0"
+        "js-tokens": "^4.0.0",
+        "picocolors": "^1.0.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -653,9 +520,12 @@
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.5.tgz",
-      "integrity": "sha512-hOOqoiNXrmGdFbhgCzu6GiURxUgM27Xwd/aPuu8RfHEZPBzL1Z54okAHAQjXfcQNwvrlkAmAp4SlRTZ45vlthQ==",
+      "version": "7.25.3",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.25.3.tgz",
+      "integrity": "sha512-iLTJKDbJ4hMvFPgQwwsVoxtHyWpKKPBrxkANrSYewDPaPpT5py5yeVkgPIJ7XYXhndxJpaA3PyALSXQ7u8e/Dw==",
+      "dependencies": {
+        "@babel/types": "^7.25.2"
+      },
       "bin": {
         "parser": "bin/babel-parser.js"
       },
@@ -663,13 +533,44 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@babel/plugin-bugfix-firefox-class-in-computed-class-key": {
+      "version": "7.25.3",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-firefox-class-in-computed-class-key/-/plugin-bugfix-firefox-class-in-computed-class-key-7.25.3.tgz",
+      "integrity": "sha512-wUrcsxZg6rqBXG05HG1FPYgsP6EvwF4WpBbxIpWIIYnH8wG0gzx3yZY3dtEHas4sTAOGkbTsc9EGPxwff8lRoA==",
+      "dev": true,
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.24.8",
+        "@babel/traverse": "^7.25.3"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
+    "node_modules/@babel/plugin-bugfix-safari-class-field-initializer-scope": {
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-class-field-initializer-scope/-/plugin-bugfix-safari-class-field-initializer-scope-7.25.0.tgz",
+      "integrity": "sha512-Bm4bH2qsX880b/3ziJ8KD711LT7z4u8CFudmjqle65AZj/HNUFhEf90dqYv6O86buWvSBmeQDjv0Tn2aF/bIBA==",
+      "dev": true,
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.24.8"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
     "node_modules/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.23.3.tgz",
-      "integrity": "sha512-iRkKcCqb7iGnq9+3G6rZ+Ciz5VywC4XNRHe57lKM+jOeYAoR0lVqdeeDRfh0tQcTfw/+vBhHn926FmQhLtlFLQ==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.25.0.tgz",
+      "integrity": "sha512-lXwdNZtTmeVOOFtwM/WDe7yg1PL8sYhRk/XH0FzbR2HDQ0xC+EnQ/JHeoMYSavtU115tnUk0q9CDyq8si+LMAA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.8"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -679,14 +580,14 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.23.3.tgz",
-      "integrity": "sha512-WwlxbfMNdVEpQjZmK5mhm7oSwD3dS6eU+Iwsi4Knl9wAletWem7kaRsGOG+8UEbRyqxY4SS5zvtfXwX+jMxUwQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.24.7.tgz",
+      "integrity": "sha512-+izXIbke1T33mY4MSNnrqhPXDz01WYhEf3yF5NbnUtkiNnm+XBZJl3kNfoK6NKmYlz/D07+l2GWVK/QfDkNCuQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
-        "@babel/plugin-transform-optional-chaining": "^7.23.3"
+        "@babel/helper-plugin-utils": "^7.24.7",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
+        "@babel/plugin-transform-optional-chaining": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -696,13 +597,13 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.23.3.tgz",
-      "integrity": "sha512-XaJak1qcityzrX0/IU5nKHb34VaibwP3saKqG6a/tppelgllOH13LUann4ZCIBcVOeE6H18K4Vx9QKkVww3z/w==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.25.0.tgz",
+      "integrity": "sha512-tggFrk1AIShG/RUQbEwt2Tr/E+ObkfwrPjR6BjbRvsx24+PSjK8zrq0GWPNCjo8qpRx4DuJzlcvWJqlm+0h3kw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.8",
+        "@babel/traverse": "^7.25.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -787,12 +688,12 @@
       }
     },
     "node_modules/@babel/plugin-syntax-import-assertions": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.23.3.tgz",
-      "integrity": "sha512-lPgDSU+SJLK3xmFDTV2ZRQAiM7UuUjGidwBywFavObCiZc1BeAAcMtHJKUya92hPHO+at63JJPLygilZard8jw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.24.7.tgz",
+      "integrity": "sha512-Ec3NRUMoi8gskrkBe3fNmEQfxDvY8bgfQpz6jlk/41kX9eUjvpyqWU7PBP/pLAvMaSQjbMNKJmvX57jP+M6bPg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -802,12 +703,12 @@
       }
     },
     "node_modules/@babel/plugin-syntax-import-attributes": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.23.3.tgz",
-      "integrity": "sha512-pawnE0P9g10xgoP7yKr6CK63K2FMsTE+FZidZO/1PwRdzmAPVs+HS1mAURUsgaoxammTJvULUdIkEK0gOcU2tA==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.24.7.tgz",
+      "integrity": "sha512-hbX+lKKeUMGihnK8nvKqmXBInriT3GVjzXKFriV3YC6APGxMbP8RZNFwy91+hocLXq90Mta+HshoB31802bb8A==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -959,12 +860,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-arrow-functions": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.23.3.tgz",
-      "integrity": "sha512-NzQcQrzaQPkaEwoTm4Mhyl8jI1huEL/WWIEvudjTCMJ9aBZNpsJbMASx7EQECtQQPS/DcnFpo0FIh3LvEO9cxQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.24.7.tgz",
+      "integrity": "sha512-Dt9LQs6iEY++gXUwY03DNFat5C2NbO48jj+j/bSAz6b3HgPs39qcPiYt77fDObIcFwj3/C2ICX9YMwGflUoSHQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -974,15 +875,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-async-generator-functions": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.23.4.tgz",
-      "integrity": "sha512-efdkfPhHYTtn0G6n2ddrESE91fgXxjlqLsnUtPWnJs4a4mZIbUaK7ffqKIIUKXSHwcDvaCVX6GXkaJJFqtX7jw==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.25.0.tgz",
+      "integrity": "sha512-uaIi2FdqzjpAMvVqvB51S42oC2JEVgh0LDsGfZVDysWE8LrJtQC2jvKmOqEYThKyB7bDEb7BP1GYWDm7tABA0Q==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-remap-async-to-generator": "^7.22.20",
-        "@babel/plugin-syntax-async-generators": "^7.8.4"
+        "@babel/helper-plugin-utils": "^7.24.8",
+        "@babel/helper-remap-async-to-generator": "^7.25.0",
+        "@babel/plugin-syntax-async-generators": "^7.8.4",
+        "@babel/traverse": "^7.25.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -992,14 +893,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-async-to-generator": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.23.3.tgz",
-      "integrity": "sha512-A7LFsKi4U4fomjqXJlZg/u0ft/n8/7n7lpffUP/ZULx/DtV9SGlNKZolHH6PE8Xl1ngCc0M11OaeZptXVkfKSw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.24.7.tgz",
+      "integrity": "sha512-SQY01PcJfmQ+4Ash7NE+rpbLFbmqA2GPIgqzxfFTL4t1FKRq4zTms/7htKpoCUI9OcFYgzqfmCdH53s6/jn5fA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-module-imports": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-remap-async-to-generator": "^7.22.20"
+        "@babel/helper-module-imports": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7",
+        "@babel/helper-remap-async-to-generator": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1009,12 +910,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-block-scoped-functions": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.23.3.tgz",
-      "integrity": "sha512-vI+0sIaPIO6CNuM9Kk5VmXcMVRiOpDh7w2zZt9GXzmE/9KD70CUEVhvPR/etAeNK/FAEkhxQtXOzVF3EuRL41A==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.24.7.tgz",
+      "integrity": "sha512-yO7RAz6EsVQDaBH18IDJcMB1HnrUn2FJ/Jslc/WtPPWcjhpUJXU/rjbwmluzp7v/ZzWcEhTMXELnnsz8djWDwQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1024,12 +925,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-block-scoping": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.23.4.tgz",
-      "integrity": "sha512-0QqbP6B6HOh7/8iNR4CQU2Th/bbRtBp4KS9vcaZd1fZ0wSh5Fyssg0UCIHwxh+ka+pNDREbVLQnHCMHKZfPwfw==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.25.0.tgz",
+      "integrity": "sha512-yBQjYoOjXlFv9nlXb3f1casSHOZkWr29NX+zChVanLg5Nc157CrbEX9D7hxxtTpuFy7Q0YzmmWfJxzvps4kXrQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.8"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1039,13 +940,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-class-properties": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.23.3.tgz",
-      "integrity": "sha512-uM+AN8yCIjDPccsKGlw271xjJtGii+xQIF/uMPS8H15L12jZTsLfF4o5vNO7d/oUguOyfdikHGc/yi9ge4SGIg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.24.7.tgz",
+      "integrity": "sha512-vKbfawVYayKcSeSR5YYzzyXvsDFWU2mD8U5TFeXtbCPLFUqe7GyCgvO6XDHzje862ODrOwy6WCPmKeWHbCFJ4w==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-create-class-features-plugin": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1055,13 +956,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-class-static-block": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.23.4.tgz",
-      "integrity": "sha512-nsWu/1M+ggti1SOALj3hfx5FXzAY06fwPJsUZD4/A5e1bWi46VUIWtD+kOX6/IdhXGsXBWllLFDSnqSCdUNydQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.24.7.tgz",
+      "integrity": "sha512-HMXK3WbBPpZQufbMG4B46A90PkuuhN9vBCb5T8+VAHqvAqvcLi+2cKoukcpmUYkszLhScU3l1iudhrks3DggRQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-create-class-features-plugin": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-class-static-block": "^7.14.5"
       },
       "engines": {
@@ -1072,19 +973,16 @@
       }
     },
     "node_modules/@babel/plugin-transform-classes": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.23.5.tgz",
-      "integrity": "sha512-jvOTR4nicqYC9yzOHIhXG5emiFEOpappSJAl73SDSEDcybD+Puuze8Tnpb9p9qEyYup24tq891gkaygIFvWDqg==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.25.0.tgz",
+      "integrity": "sha512-xyi6qjr/fYU304fiRwFbekzkqVJZ6A7hOjWZd+89FVcBqPV3S9Wuozz82xdpLspckeaafntbzglaW4pqpzvtSw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-optimise-call-expression": "^7.22.5",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20",
-        "@babel/helper-split-export-declaration": "^7.22.6",
+        "@babel/helper-annotate-as-pure": "^7.24.7",
+        "@babel/helper-compilation-targets": "^7.24.8",
+        "@babel/helper-plugin-utils": "^7.24.8",
+        "@babel/helper-replace-supers": "^7.25.0",
+        "@babel/traverse": "^7.25.0",
         "globals": "^11.1.0"
       },
       "engines": {
@@ -1095,13 +993,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-computed-properties": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.23.3.tgz",
-      "integrity": "sha512-dTj83UVTLw/+nbiHqQSFdwO9CbTtwq1DsDqm3CUEtDrZNET5rT5E6bIdTlOftDTDLMYxvxHNEYO4B9SLl8SLZw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.24.7.tgz",
+      "integrity": "sha512-25cS7v+707Gu6Ds2oY6tCkUwsJ9YIDbggd9+cu9jzzDgiNq7hR/8dkzxWfKWnTic26vsI3EsCXNd4iEB6e8esQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/template": "^7.22.15"
+        "@babel/helper-plugin-utils": "^7.24.7",
+        "@babel/template": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1111,12 +1009,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-destructuring": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.23.3.tgz",
-      "integrity": "sha512-n225npDqjDIr967cMScVKHXJs7rout1q+tt50inyBCPkyZ8KxeI6d+GIbSBTT/w/9WdlWDOej3V9HE5Lgk57gw==",
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.24.8.tgz",
+      "integrity": "sha512-36e87mfY8TnRxc7yc6M9g9gOB7rKgSahqkIKwLpz4Ppk2+zC2Cy1is0uwtuSG6AE4zlTOUa+7JGz9jCJGLqQFQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.8"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1126,13 +1024,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-dotall-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.23.3.tgz",
-      "integrity": "sha512-vgnFYDHAKzFaTVp+mneDsIEbnJ2Np/9ng9iviHw3P/KVcgONxpNULEW/51Z/BaFojG2GI2GwwXck5uV1+1NOYQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.24.7.tgz",
+      "integrity": "sha512-ZOA3W+1RRTSWvyqcMJDLqbchh7U4NRGqwRfFSVbOLS/ePIP4vHB5e8T8eXcuqyN1QkgKyj5wuW0lcS85v4CrSw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1142,12 +1040,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-duplicate-keys": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.23.3.tgz",
-      "integrity": "sha512-RrqQ+BQmU3Oyav3J+7/myfvRCq7Tbz+kKLLshUmMwNlDHExbGL7ARhajvoBJEvc+fCguPPu887N+3RRXBVKZUA==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.24.7.tgz",
+      "integrity": "sha512-JdYfXyCRihAe46jUIliuL2/s0x0wObgwwiGxw/UbgJBr20gQBThrokO4nYKgWkD7uBaqM7+9x5TU7NkExZJyzw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1156,13 +1054,29 @@
         "@babel/core": "^7.0.0-0"
       }
     },
+    "node_modules/@babel/plugin-transform-duplicate-named-capturing-groups-regex": {
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-named-capturing-groups-regex/-/plugin-transform-duplicate-named-capturing-groups-regex-7.25.0.tgz",
+      "integrity": "sha512-YLpb4LlYSc3sCUa35un84poXoraOiQucUTTu8X1j18JV+gNa8E0nyUf/CjZ171IRGr4jEguF+vzJU66QZhn29g==",
+      "dev": true,
+      "dependencies": {
+        "@babel/helper-create-regexp-features-plugin": "^7.25.0",
+        "@babel/helper-plugin-utils": "^7.24.8"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
     "node_modules/@babel/plugin-transform-dynamic-import": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.23.4.tgz",
-      "integrity": "sha512-V6jIbLhdJK86MaLh4Jpghi8ho5fGzt3imHOBu/x0jlBaPYqDoWz4RDXjmMOfnh+JWNaQleEAByZLV0QzBT4YQQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.24.7.tgz",
+      "integrity": "sha512-sc3X26PhZQDb3JhORmakcbvkeInvxz+A8oda99lj7J60QRuPZvNAk9wQlTBS1ZynelDrDmTU4pw1tyc5d5ZMUg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-dynamic-import": "^7.8.3"
       },
       "engines": {
@@ -1173,13 +1087,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-exponentiation-operator": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.23.3.tgz",
-      "integrity": "sha512-5fhCsl1odX96u7ILKHBj4/Y8vipoqwsJMh4csSA8qFfxrZDEA4Ssku2DyNvMJSmZNOEBT750LfFPbtrnTP90BQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.24.7.tgz",
+      "integrity": "sha512-Rqe/vSc9OYgDajNIK35u7ot+KeCoetqQYFXM4Epf7M7ez3lWlOjrDjrwMei6caCVhfdw+mIKD4cgdGNy5JQotQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-builder-binary-assignment-operator-visitor": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-builder-binary-assignment-operator-visitor": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1189,12 +1103,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-export-namespace-from": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.23.4.tgz",
-      "integrity": "sha512-GzuSBcKkx62dGzZI1WVgTWvkkz84FZO5TC5T8dl/Tht/rAla6Dg/Mz9Yhypg+ezVACf/rgDuQt3kbWEv7LdUDQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.24.7.tgz",
+      "integrity": "sha512-v0K9uNYsPL3oXZ/7F9NNIbAj2jv1whUEtyA6aujhekLs56R++JDQuzRcP2/z4WX5Vg/c5lE9uWZA0/iUoFhLTA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-export-namespace-from": "^7.8.3"
       },
       "engines": {
@@ -1205,12 +1119,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-for-of": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.23.3.tgz",
-      "integrity": "sha512-X8jSm8X1CMwxmK878qsUGJRmbysKNbdpTv/O1/v0LuY/ZkZrng5WYiekYSdg9m09OTmDDUWeEDsTE+17WYbAZw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.24.7.tgz",
+      "integrity": "sha512-wo9ogrDG1ITTTBsy46oGiN1dS9A7MROBTcYsfS8DtsImMkHk9JXJ3EWQM6X2SUw4x80uGPlwj0o00Uoc6nEE3g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1220,14 +1135,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-function-name": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.23.3.tgz",
-      "integrity": "sha512-I1QXp1LxIvt8yLaib49dRW5Okt7Q4oaxao6tFVKS/anCdEOMtYwWVKoiOA1p34GOWIZjUK0E+zCp7+l1pfQyiw==",
+      "version": "7.25.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.25.1.tgz",
+      "integrity": "sha512-TVVJVdW9RKMNgJJlLtHsKDTydjZAbwIsn6ySBPQaEAUU5+gVvlJt/9nRmqVbsV/IBanRjzWoaAQKLoamWVOUuA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-compilation-targets": "^7.24.8",
+        "@babel/helper-plugin-utils": "^7.24.8",
+        "@babel/traverse": "^7.25.1"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1237,12 +1152,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-json-strings": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.23.4.tgz",
-      "integrity": "sha512-81nTOqM1dMwZ/aRXQ59zVubN9wHGqk6UtqRK+/q+ciXmRy8fSolhGVvG09HHRGo4l6fr/c4ZhXUQH0uFW7PZbg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.24.7.tgz",
+      "integrity": "sha512-2yFnBGDvRuxAaE/f0vfBKvtnvvqU8tGpMHqMNpTN2oWMKIR3NqFkjaAgGwawhqK/pIN2T3XdjGPdaG0vDhOBGw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-json-strings": "^7.8.3"
       },
       "engines": {
@@ -1253,12 +1168,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-literals/-/plugin-transform-literals-7.23.3.tgz",
-      "integrity": "sha512-wZ0PIXRxnwZvl9AYpqNUxpZ5BiTGrYt7kueGQ+N5FiQ7RCOD4cm8iShd6S6ggfVIWaJf2EMk8eRzAh52RfP4rQ==",
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-literals/-/plugin-transform-literals-7.25.2.tgz",
+      "integrity": "sha512-HQI+HcTbm9ur3Z2DkO+jgESMAMcYLuN/A7NRw9juzxAezN9AvqvUTnpKP/9kkYANz6u7dFlAyOu44ejuGySlfw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.8"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1268,12 +1183,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-logical-assignment-operators": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.23.4.tgz",
-      "integrity": "sha512-Mc/ALf1rmZTP4JKKEhUwiORU+vcfarFVLfcFiolKUo6sewoxSEgl36ak5t+4WamRsNr6nzjZXQjM35WsU+9vbg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.24.7.tgz",
+      "integrity": "sha512-4D2tpwlQ1odXmTEIFWy9ELJcZHqrStlzK/dAOWYyxX3zT0iXQB6banjgeOJQXzEc4S0E0a5A+hahxPaEFYftsw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-logical-assignment-operators": "^7.10.4"
       },
       "engines": {
@@ -1284,12 +1199,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-member-expression-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.23.3.tgz",
-      "integrity": "sha512-sC3LdDBDi5x96LA+Ytekz2ZPk8i/Ck+DEuDbRAll5rknJ5XRTSaPKEYwomLcs1AA8wg9b3KjIQRsnApj+q51Ag==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.24.7.tgz",
+      "integrity": "sha512-T/hRC1uqrzXMKLQ6UCwMT85S3EvqaBXDGf0FaMf4446Qx9vKwlghvee0+uuZcDUCZU5RuNi4781UQ7R308zzBw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1299,13 +1214,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-amd": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.23.3.tgz",
-      "integrity": "sha512-vJYQGxeKM4t8hYCKVBlZX/gtIY2I7mRGFNcm85sgXGMTBcoV3QdVtdpbcWEbzbfUIUZKwvgFT82mRvaQIebZzw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.24.7.tgz",
+      "integrity": "sha512-9+pB1qxV3vs/8Hdmz/CulFB8w2tuu6EB94JZFsjdqxQokwGa9Unap7Bo2gGBGIvPmDIVvQrom7r5m/TCDMURhg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-module-transforms": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1315,14 +1230,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-commonjs": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.23.3.tgz",
-      "integrity": "sha512-aVS0F65LKsdNOtcz6FRCpE4OgsP2OFnW46qNxNIX9h3wuzaNcSQsJysuMwqSibC98HPrf2vCgtxKNwS0DAlgcA==",
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.24.8.tgz",
+      "integrity": "sha512-WHsk9H8XxRs3JXKWFiqtQebdh9b/pTk4EgueygFzYlTKAg0Ud985mSevdNjdXdFBATSKVJGQXP1tv6aGbssLKA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-simple-access": "^7.22.5"
+        "@babel/helper-module-transforms": "^7.24.8",
+        "@babel/helper-plugin-utils": "^7.24.8",
+        "@babel/helper-simple-access": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1332,15 +1247,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-systemjs": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.23.3.tgz",
-      "integrity": "sha512-ZxyKGTkF9xT9YJuKQRo19ewf3pXpopuYQd8cDXqNzc3mUNbOME0RKMoZxviQk74hwzfQsEe66dE92MaZbdHKNQ==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.25.0.tgz",
+      "integrity": "sha512-YPJfjQPDXxyQWg/0+jHKj1llnY5f/R6a0p/vP4lPymxLu7Lvl4k2WMitqi08yxwQcCVUUdG9LCUj4TNEgAp3Jw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-hoist-variables": "^7.22.5",
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-validator-identifier": "^7.22.20"
+        "@babel/helper-module-transforms": "^7.25.0",
+        "@babel/helper-plugin-utils": "^7.24.8",
+        "@babel/helper-validator-identifier": "^7.24.7",
+        "@babel/traverse": "^7.25.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1350,13 +1265,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-umd": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.23.3.tgz",
-      "integrity": "sha512-zHsy9iXX2nIsCBFPud3jKn1IRPWg3Ing1qOZgeKV39m1ZgIdpJqvlWVeiHBZC6ITRG0MfskhYe9cLgntfSFPIg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.24.7.tgz",
+      "integrity": "sha512-3aytQvqJ/h9z4g8AsKPLvD4Zqi2qT+L3j7XoFFu1XBlZWEl2/1kWnhmAbxpLgPrHSY0M6UA02jyTiwUVtiKR6A==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-module-transforms": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1366,13 +1281,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-named-capturing-groups-regex": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.22.5.tgz",
-      "integrity": "sha512-YgLLKmS3aUBhHaxp5hi1WJTgOUb/NCuDHzGT9z9WTt3YG+CPRhJs6nprbStx6DnWM4dh6gt7SU3sZodbZ08adQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.24.7.tgz",
+      "integrity": "sha512-/jr7h/EWeJtk1U/uz2jlsCioHkZk1JJZVcc8oQsJ1dUlaJD83f4/6Zeh2aHt9BIFokHIsSeDfhUmju0+1GPd6g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.5",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1382,12 +1297,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-new-target": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.23.3.tgz",
-      "integrity": "sha512-YJ3xKqtJMAT5/TIZnpAR3I+K+WaDowYbN3xyxI8zxx/Gsypwf9B9h0VB+1Nh6ACAAPRS5NSRje0uVv5i79HYGQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.24.7.tgz",
+      "integrity": "sha512-RNKwfRIXg4Ls/8mMTza5oPF5RkOW8Wy/WgMAp1/F1yZ8mMbtwXW+HDoJiOsagWrAhI5f57Vncrmr9XeT4CVapA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1397,12 +1312,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-nullish-coalescing-operator": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.23.4.tgz",
-      "integrity": "sha512-jHE9EVVqHKAQx+VePv5LLGHjmHSJR76vawFPTdlxR/LVJPfOEGxREQwQfjuZEOPTwG92X3LINSh3M40Rv4zpVA==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.24.7.tgz",
+      "integrity": "sha512-Ts7xQVk1OEocqzm8rHMXHlxvsfZ0cEF2yomUqpKENHWMF4zKk175Y4q8H5knJes6PgYad50uuRmt3UJuhBw8pQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.3"
       },
       "engines": {
@@ -1413,12 +1328,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-numeric-separator": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.23.4.tgz",
-      "integrity": "sha512-mps6auzgwjRrwKEZA05cOwuDc9FAzoyFS4ZsG/8F43bTLf/TgkJg7QXOrPO1JO599iA3qgK9MXdMGOEC8O1h6Q==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.24.7.tgz",
+      "integrity": "sha512-e6q1TiVUzvH9KRvicuxdBTUj4AdKSRwzIyFFnfnezpCfP2/7Qmbb8qbU2j7GODbl4JMkblitCQjKYUaX/qkkwA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-numeric-separator": "^7.10.4"
       },
       "engines": {
@@ -1429,16 +1344,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-object-rest-spread": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.23.4.tgz",
-      "integrity": "sha512-9x9K1YyeQVw0iOXJlIzwm8ltobIIv7j2iLyP2jIhEbqPRQ7ScNgwQufU2I0Gq11VjyG4gI4yMXt2VFags+1N3g==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.24.7.tgz",
+      "integrity": "sha512-4QrHAr0aXQCEFni2q4DqKLD31n2DL+RxcwnNjDFkSG0eNQ/xCavnRkfCUjsyqGC2OviNJvZOF/mQqZBw7i2C5Q==",
       "dev": true,
       "dependencies": {
-        "@babel/compat-data": "^7.23.3",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-compilation-targets": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
-        "@babel/plugin-transform-parameters": "^7.23.3"
+        "@babel/plugin-transform-parameters": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1448,13 +1362,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-object-super": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.23.3.tgz",
-      "integrity": "sha512-BwQ8q0x2JG+3lxCVFohg+KbQM7plfpBwThdW9A6TMtWwLsbDA01Ek2Zb/AgDN39BiZsExm4qrXxjk+P1/fzGrA==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.24.7.tgz",
+      "integrity": "sha512-A/vVLwN6lBrMFmMDmPPz0jnE6ZGx7Jq7d6sT/Ev4H65RER6pZ+kczlf1DthF5N0qaPHBsI7UXiE8Zy66nmAovg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20"
+        "@babel/helper-plugin-utils": "^7.24.7",
+        "@babel/helper-replace-supers": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1464,12 +1378,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-optional-catch-binding": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.23.4.tgz",
-      "integrity": "sha512-XIq8t0rJPHf6Wvmbn9nFxU6ao4c7WhghTR5WyV8SrJfUFzyxhCm4nhC+iAp3HFhbAKLfYpgzhJ6t4XCtVwqO5A==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.24.7.tgz",
+      "integrity": "sha512-uLEndKqP5BfBbC/5jTwPxLh9kqPWWgzN/f8w6UwAIirAEqiIVJWWY312X72Eub09g5KF9+Zn7+hT7sDxmhRuKA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-optional-catch-binding": "^7.8.3"
       },
       "engines": {
@@ -1480,13 +1394,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-optional-chaining": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.23.4.tgz",
-      "integrity": "sha512-ZU8y5zWOfjM5vZ+asjgAPwDaBjJzgufjES89Rs4Lpq63O300R/kOz30WCLo6BxxX6QVEilwSlpClnG5cZaikTA==",
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.24.8.tgz",
+      "integrity": "sha512-5cTOLSMs9eypEy8JUVvIKOu6NgvbJMnpG62VpIHrTmROdQ+L5mDAaI40g25k5vXti55JWNX5jCkq3HZxXBQANw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.8",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
         "@babel/plugin-syntax-optional-chaining": "^7.8.3"
       },
       "engines": {
@@ -1497,12 +1411,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-parameters": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.23.3.tgz",
-      "integrity": "sha512-09lMt6UsUb3/34BbECKVbVwrT9bO6lILWln237z7sLaWnMsTi7Yc9fhX5DLpkJzAGfaReXI22wP41SZmnAA3Vw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.24.7.tgz",
+      "integrity": "sha512-yGWW5Rr+sQOhK0Ot8hjDJuxU3XLRQGflvT4lhlSY0DFvdb3TwKaY26CJzHtYllU0vT9j58hc37ndFPsqT1SrzA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1512,13 +1426,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-private-methods": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.23.3.tgz",
-      "integrity": "sha512-UzqRcRtWsDMTLrRWFvUBDwmw06tCQH9Rl1uAjfh6ijMSmGYQ+fpdB+cnqRC8EMh5tuuxSv0/TejGL+7vyj+50g==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.24.7.tgz",
+      "integrity": "sha512-COTCOkG2hn4JKGEKBADkA8WNb35TGkkRbI5iT845dB+NyqgO8Hn+ajPbSnIQznneJTa3d30scb6iz/DhH8GsJQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-create-class-features-plugin": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1528,14 +1442,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-private-property-in-object": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.23.4.tgz",
-      "integrity": "sha512-9G3K1YqTq3F4Vt88Djx1UZ79PDyj+yKRnUy7cZGSMe+a7jkwD259uKKuUzQlPkGam7R+8RJwh5z4xO27fA1o2A==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.24.7.tgz",
+      "integrity": "sha512-9z76mxwnwFxMyxZWEgdgECQglF2Q7cFLm0kMf8pGwt+GSJsY0cONKj/UuO4bOH0w/uAel3ekS4ra5CEAyJRmDA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-annotate-as-pure": "^7.24.7",
+        "@babel/helper-create-class-features-plugin": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "@babel/plugin-syntax-private-property-in-object": "^7.14.5"
       },
       "engines": {
@@ -1546,12 +1460,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-property-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.23.3.tgz",
-      "integrity": "sha512-jR3Jn3y7cZp4oEWPFAlRsSWjxKe4PZILGBSd4nis1TsC5qeSpb+nrtihJuDhNI7QHiVbUaiXa0X2RZY3/TI6Nw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.24.7.tgz",
+      "integrity": "sha512-EMi4MLQSHfd2nrCqQEWxFdha2gBCqU4ZcCng4WBGZ5CJL4bBRW0ptdqqDdeirGZcpALazVVNJqRmsO8/+oNCBA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1561,12 +1475,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-regenerator": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.23.3.tgz",
-      "integrity": "sha512-KP+75h0KghBMcVpuKisx3XTu9Ncut8Q8TuvGO4IhY+9D5DFEckQefOuIsB/gQ2tG71lCke4NMrtIPS8pOj18BQ==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.24.7.tgz",
+      "integrity": "sha512-lq3fvXPdimDrlg6LWBoqj+r/DEWgONuwjuOuQCSYgRroXDH/IdM1C0IZf59fL5cHLpjEH/O6opIRBbqv7ELnuA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.7",
         "regenerator-transform": "^0.15.2"
       },
       "engines": {
@@ -1577,12 +1491,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-reserved-words": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.23.3.tgz",
-      "integrity": "sha512-QnNTazY54YqgGxwIexMZva9gqbPa15t/x9VS+0fsEFWplwVpXYZivtgl43Z1vMpc1bdPP2PP8siFeVcnFvA3Cg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.24.7.tgz",
+      "integrity": "sha512-0DUq0pHcPKbjFZCfTss/pGkYMfy3vFWydkUBd9r0GHpIyfs2eCDENvqadMycRS9wZCXR41wucAfJHJmwA0UmoQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1592,12 +1506,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-shorthand-properties": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.23.3.tgz",
-      "integrity": "sha512-ED2fgqZLmexWiN+YNFX26fx4gh5qHDhn1O2gvEhreLW2iI63Sqm4llRLCXALKrCnbN4Jy0VcMQZl/SAzqug/jg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.24.7.tgz",
+      "integrity": "sha512-KsDsevZMDsigzbA09+vacnLpmPH4aWjcZjXdyFKGzpplxhbeB4wYtury3vglQkg6KM/xEPKt73eCjPPf1PgXBA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1607,13 +1521,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-spread": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.23.3.tgz",
-      "integrity": "sha512-VvfVYlrlBVu+77xVTOAoxQ6mZbnIq5FM0aGBSFEcIh03qHf+zNqA4DC/3XMUozTg7bZV3e3mZQ0i13VB6v5yUg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.24.7.tgz",
+      "integrity": "sha512-x96oO0I09dgMDxJaANcRyD4ellXFLLiWhuwDxKZX5g2rWP1bTPkBSwCYv96VDXVT1bD9aPj8tppr5ITIh8hBng==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1623,12 +1537,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-sticky-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.23.3.tgz",
-      "integrity": "sha512-HZOyN9g+rtvnOU3Yh7kSxXrKbzgrm5X4GncPY1QOquu7epga5MxKHVpYu2hvQnry/H+JjckSYRb93iNfsioAGg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.24.7.tgz",
+      "integrity": "sha512-kHPSIJc9v24zEml5geKg9Mjx5ULpfncj0wRpYtxbvKyTtHCYDkVE3aHQ03FrpEo4gEe2vrJJS1Y9CJTaThA52g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1638,12 +1552,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-template-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.23.3.tgz",
-      "integrity": "sha512-Flok06AYNp7GV2oJPZZcP9vZdszev6vPBkHLwxwSpaIqx75wn6mUd3UFWsSsA0l8nXAKkyCmL/sR02m8RYGeHg==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.24.7.tgz",
+      "integrity": "sha512-AfDTQmClklHCOLxtGoP7HkeMw56k1/bTQjwsfhL6pppo/M4TOBSq+jjBUBLmV/4oeFg4GWMavIl44ZeCtmmZTw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1653,12 +1567,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-typeof-symbol": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.23.3.tgz",
-      "integrity": "sha512-4t15ViVnaFdrPC74be1gXBSMzXk3B4Us9lP7uLRQHTFpV5Dvt33pn+2MyyNxmN3VTTm3oTrZVMUmuw3oBnQ2oQ==",
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.24.8.tgz",
+      "integrity": "sha512-adNTUpDCVnmAE58VEqKlAA6ZBlNkMnWD0ZcW76lyNFN3MJniyGFZfNwERVk8Ap56MCnXztmDr19T4mPTztcuaw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.8"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1668,12 +1582,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-escapes": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.23.3.tgz",
-      "integrity": "sha512-OMCUx/bU6ChE3r4+ZdylEqAjaQgHAgipgW8nsCfu5pGqDcFytVd91AwRvUJSBZDz0exPGgnjoqhgRYLRjFZc9Q==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.24.7.tgz",
+      "integrity": "sha512-U3ap1gm5+4edc2Q/P+9VrBNhGkfnf+8ZqppY71Bo/pzZmXhhLdqgaUl6cuB07O1+AQJtCLfaOmswiNbSQ9ivhw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1683,13 +1597,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-property-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.23.3.tgz",
-      "integrity": "sha512-KcLIm+pDZkWZQAFJ9pdfmh89EwVfmNovFBcXko8szpBeF8z68kWIPeKlmSOkT9BXJxs2C0uk+5LxoxIv62MROA==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.24.7.tgz",
+      "integrity": "sha512-uH2O4OV5M9FZYQrwc7NdVmMxQJOCCzFeYudlZSzUAHRFeOujQefa92E74TQDVskNHCzOXoigEuoyzHDhaEaK5w==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1699,13 +1613,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.23.3.tgz",
-      "integrity": "sha512-wMHpNA4x2cIA32b/ci3AfwNgheiva2W0WUKWTK7vBHBhDKfPsc5cFGNWm69WBqpwd86u1qwZ9PWevKqm1A3yAw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.24.7.tgz",
+      "integrity": "sha512-hlQ96MBZSAXUq7ltkjtu3FJCCSMx/j629ns3hA3pXnBXjanNP0LHi+JpPeA81zaWgVK1VGH95Xuy7u0RyQ8kMg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1715,13 +1629,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-sets-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.23.3.tgz",
-      "integrity": "sha512-W7lliA/v9bNR83Qc3q1ip9CQMZ09CcHDbHfbLRDNuAhn1Mvkr1ZNF7hPmztMQvtTGVLJ9m8IZqWsTkXOml8dbw==",
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.24.7.tgz",
+      "integrity": "sha512-2G8aAvF4wy1w/AGZkemprdGMRg5o6zPNhbHVImRz3lss55TYCBd6xStN19rt8XJHq20sqV0JbyWjOWwQRwV/wg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.24.7"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1731,26 +1645,28 @@
       }
     },
     "node_modules/@babel/preset-env": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.23.5.tgz",
-      "integrity": "sha512-0d/uxVD6tFGWXGDSfyMD1p2otoaKmu6+GD+NfAx0tMaH+dxORnp7T9TaVQ6mKyya7iBtCIVxHjWT7MuzzM9z+A==",
-      "dev": true,
-      "dependencies": {
-        "@babel/compat-data": "^7.23.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-validator-option": "^7.23.5",
-        "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.23.3",
-        "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.23.3",
-        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.23.3",
+      "version": "7.25.3",
+      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.25.3.tgz",
+      "integrity": "sha512-QsYW7UeAaXvLPX9tdVliMJE7MD7M6MLYVTovRTIwhoYQVFHR1rM4wO8wqAezYi3/BpSD+NzVCZ69R6smWiIi8g==",
+      "dev": true,
+      "dependencies": {
+        "@babel/compat-data": "^7.25.2",
+        "@babel/helper-compilation-targets": "^7.25.2",
+        "@babel/helper-plugin-utils": "^7.24.8",
+        "@babel/helper-validator-option": "^7.24.8",
+        "@babel/plugin-bugfix-firefox-class-in-computed-class-key": "^7.25.3",
+        "@babel/plugin-bugfix-safari-class-field-initializer-scope": "^7.25.0",
+        "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.25.0",
+        "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.24.7",
+        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.25.0",
         "@babel/plugin-proposal-private-property-in-object": "7.21.0-placeholder-for-preset-env.2",
         "@babel/plugin-syntax-async-generators": "^7.8.4",
         "@babel/plugin-syntax-class-properties": "^7.12.13",
         "@babel/plugin-syntax-class-static-block": "^7.14.5",
         "@babel/plugin-syntax-dynamic-import": "^7.8.3",
         "@babel/plugin-syntax-export-namespace-from": "^7.8.3",
-        "@babel/plugin-syntax-import-assertions": "^7.23.3",
-        "@babel/plugin-syntax-import-attributes": "^7.23.3",
+        "@babel/plugin-syntax-import-assertions": "^7.24.7",
+        "@babel/plugin-syntax-import-attributes": "^7.24.7",
         "@babel/plugin-syntax-import-meta": "^7.10.4",
         "@babel/plugin-syntax-json-strings": "^7.8.3",
         "@babel/plugin-syntax-logical-assignment-operators": "^7.10.4",
@@ -1762,59 +1678,60 @@
         "@babel/plugin-syntax-private-property-in-object": "^7.14.5",
         "@babel/plugin-syntax-top-level-await": "^7.14.5",
         "@babel/plugin-syntax-unicode-sets-regex": "^7.18.6",
-        "@babel/plugin-transform-arrow-functions": "^7.23.3",
-        "@babel/plugin-transform-async-generator-functions": "^7.23.4",
-        "@babel/plugin-transform-async-to-generator": "^7.23.3",
-        "@babel/plugin-transform-block-scoped-functions": "^7.23.3",
-        "@babel/plugin-transform-block-scoping": "^7.23.4",
-        "@babel/plugin-transform-class-properties": "^7.23.3",
-        "@babel/plugin-transform-class-static-block": "^7.23.4",
-        "@babel/plugin-transform-classes": "^7.23.5",
-        "@babel/plugin-transform-computed-properties": "^7.23.3",
-        "@babel/plugin-transform-destructuring": "^7.23.3",
-        "@babel/plugin-transform-dotall-regex": "^7.23.3",
-        "@babel/plugin-transform-duplicate-keys": "^7.23.3",
-        "@babel/plugin-transform-dynamic-import": "^7.23.4",
-        "@babel/plugin-transform-exponentiation-operator": "^7.23.3",
-        "@babel/plugin-transform-export-namespace-from": "^7.23.4",
-        "@babel/plugin-transform-for-of": "^7.23.3",
-        "@babel/plugin-transform-function-name": "^7.23.3",
-        "@babel/plugin-transform-json-strings": "^7.23.4",
-        "@babel/plugin-transform-literals": "^7.23.3",
-        "@babel/plugin-transform-logical-assignment-operators": "^7.23.4",
-        "@babel/plugin-transform-member-expression-literals": "^7.23.3",
-        "@babel/plugin-transform-modules-amd": "^7.23.3",
-        "@babel/plugin-transform-modules-commonjs": "^7.23.3",
-        "@babel/plugin-transform-modules-systemjs": "^7.23.3",
-        "@babel/plugin-transform-modules-umd": "^7.23.3",
-        "@babel/plugin-transform-named-capturing-groups-regex": "^7.22.5",
-        "@babel/plugin-transform-new-target": "^7.23.3",
-        "@babel/plugin-transform-nullish-coalescing-operator": "^7.23.4",
-        "@babel/plugin-transform-numeric-separator": "^7.23.4",
-        "@babel/plugin-transform-object-rest-spread": "^7.23.4",
-        "@babel/plugin-transform-object-super": "^7.23.3",
-        "@babel/plugin-transform-optional-catch-binding": "^7.23.4",
-        "@babel/plugin-transform-optional-chaining": "^7.23.4",
-        "@babel/plugin-transform-parameters": "^7.23.3",
-        "@babel/plugin-transform-private-methods": "^7.23.3",
-        "@babel/plugin-transform-private-property-in-object": "^7.23.4",
-        "@babel/plugin-transform-property-literals": "^7.23.3",
-        "@babel/plugin-transform-regenerator": "^7.23.3",
-        "@babel/plugin-transform-reserved-words": "^7.23.3",
-        "@babel/plugin-transform-shorthand-properties": "^7.23.3",
-        "@babel/plugin-transform-spread": "^7.23.3",
-        "@babel/plugin-transform-sticky-regex": "^7.23.3",
-        "@babel/plugin-transform-template-literals": "^7.23.3",
-        "@babel/plugin-transform-typeof-symbol": "^7.23.3",
-        "@babel/plugin-transform-unicode-escapes": "^7.23.3",
-        "@babel/plugin-transform-unicode-property-regex": "^7.23.3",
-        "@babel/plugin-transform-unicode-regex": "^7.23.3",
-        "@babel/plugin-transform-unicode-sets-regex": "^7.23.3",
+        "@babel/plugin-transform-arrow-functions": "^7.24.7",
+        "@babel/plugin-transform-async-generator-functions": "^7.25.0",
+        "@babel/plugin-transform-async-to-generator": "^7.24.7",
+        "@babel/plugin-transform-block-scoped-functions": "^7.24.7",
+        "@babel/plugin-transform-block-scoping": "^7.25.0",
+        "@babel/plugin-transform-class-properties": "^7.24.7",
+        "@babel/plugin-transform-class-static-block": "^7.24.7",
+        "@babel/plugin-transform-classes": "^7.25.0",
+        "@babel/plugin-transform-computed-properties": "^7.24.7",
+        "@babel/plugin-transform-destructuring": "^7.24.8",
+        "@babel/plugin-transform-dotall-regex": "^7.24.7",
+        "@babel/plugin-transform-duplicate-keys": "^7.24.7",
+        "@babel/plugin-transform-duplicate-named-capturing-groups-regex": "^7.25.0",
+        "@babel/plugin-transform-dynamic-import": "^7.24.7",
+        "@babel/plugin-transform-exponentiation-operator": "^7.24.7",
+        "@babel/plugin-transform-export-namespace-from": "^7.24.7",
+        "@babel/plugin-transform-for-of": "^7.24.7",
+        "@babel/plugin-transform-function-name": "^7.25.1",
+        "@babel/plugin-transform-json-strings": "^7.24.7",
+        "@babel/plugin-transform-literals": "^7.25.2",
+        "@babel/plugin-transform-logical-assignment-operators": "^7.24.7",
+        "@babel/plugin-transform-member-expression-literals": "^7.24.7",
+        "@babel/plugin-transform-modules-amd": "^7.24.7",
+        "@babel/plugin-transform-modules-commonjs": "^7.24.8",
+        "@babel/plugin-transform-modules-systemjs": "^7.25.0",
+        "@babel/plugin-transform-modules-umd": "^7.24.7",
+        "@babel/plugin-transform-named-capturing-groups-regex": "^7.24.7",
+        "@babel/plugin-transform-new-target": "^7.24.7",
+        "@babel/plugin-transform-nullish-coalescing-operator": "^7.24.7",
+        "@babel/plugin-transform-numeric-separator": "^7.24.7",
+        "@babel/plugin-transform-object-rest-spread": "^7.24.7",
+        "@babel/plugin-transform-object-super": "^7.24.7",
+        "@babel/plugin-transform-optional-catch-binding": "^7.24.7",
+        "@babel/plugin-transform-optional-chaining": "^7.24.8",
+        "@babel/plugin-transform-parameters": "^7.24.7",
+        "@babel/plugin-transform-private-methods": "^7.24.7",
+        "@babel/plugin-transform-private-property-in-object": "^7.24.7",
+        "@babel/plugin-transform-property-literals": "^7.24.7",
+        "@babel/plugin-transform-regenerator": "^7.24.7",
+        "@babel/plugin-transform-reserved-words": "^7.24.7",
+        "@babel/plugin-transform-shorthand-properties": "^7.24.7",
+        "@babel/plugin-transform-spread": "^7.24.7",
+        "@babel/plugin-transform-sticky-regex": "^7.24.7",
+        "@babel/plugin-transform-template-literals": "^7.24.7",
+        "@babel/plugin-transform-typeof-symbol": "^7.24.8",
+        "@babel/plugin-transform-unicode-escapes": "^7.24.7",
+        "@babel/plugin-transform-unicode-property-regex": "^7.24.7",
+        "@babel/plugin-transform-unicode-regex": "^7.24.7",
+        "@babel/plugin-transform-unicode-sets-regex": "^7.24.7",
         "@babel/preset-modules": "0.1.6-no-external-plugins",
-        "babel-plugin-polyfill-corejs2": "^0.4.6",
-        "babel-plugin-polyfill-corejs3": "^0.8.5",
-        "babel-plugin-polyfill-regenerator": "^0.5.3",
-        "core-js-compat": "^3.31.0",
+        "babel-plugin-polyfill-corejs2": "^0.4.10",
+        "babel-plugin-polyfill-corejs3": "^0.10.4",
+        "babel-plugin-polyfill-regenerator": "^0.6.1",
+        "core-js-compat": "^3.37.1",
         "semver": "^6.3.1"
       },
       "engines": {
@@ -1845,9 +1762,9 @@
       "dev": true
     },
     "node_modules/@babel/runtime": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.5.tgz",
-      "integrity": "sha512-NdUTHcPe4C99WxPub+K9l9tK5/lV4UXIoaHSYgzco9BCyjKAAwzdBI+wWtYqHt7LJdbo74ZjRPJgzVweq1sz0w==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.0.tgz",
+      "integrity": "sha512-7dRy4DwXwtzBrPbZflqxnvfxLF8kdZXPkhymtDeFoFqE6ldzjQFgYTtYIFARcLEYDrqfBfYcZt1WqFxRoyC9Rw==",
       "dev": true,
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
@@ -1857,35 +1774,31 @@
       }
     },
     "node_modules/@babel/template": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz",
-      "integrity": "sha512-QPErUVm4uyJa60rkI73qneDacvdvzxshT3kksGqlGWYdOTIUOwJ7RDUL8sGqslY1uXWSL6xMFKEXDS3ox2uF0w==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.25.0.tgz",
+      "integrity": "sha512-aOOgh1/5XzKvg1jvVz7AVrx2piJ2XBi227DHmbY6y+bM9H2FlN+IfecYu4Xl0cNiiVejlsCri89LUsbj8vJD9Q==",
       "dev": true,
       "dependencies": {
-        "@babel/code-frame": "^7.22.13",
-        "@babel/parser": "^7.22.15",
-        "@babel/types": "^7.22.15"
+        "@babel/code-frame": "^7.24.7",
+        "@babel/parser": "^7.25.0",
+        "@babel/types": "^7.25.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/traverse": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.5.tgz",
-      "integrity": "sha512-czx7Xy5a6sapWWRx61m1Ke1Ra4vczu1mCTtJam5zRTBOonfdJ+S/B6HYmGYu3fJtr8GGET3si6IhgWVBhJ/m8w==",
+      "version": "7.25.3",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.25.3.tgz",
+      "integrity": "sha512-HefgyP1x754oGCsKmV5reSmtV7IXj/kpaE1XYY+D9G5PvKKoFfSbiS4M77MdjuwlZKDIKFCffq9rPU+H/s3ZdQ==",
       "dev": true,
-      "peer": true,
       "dependencies": {
-        "@babel/code-frame": "^7.23.5",
-        "@babel/generator": "^7.23.5",
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-hoist-variables": "^7.22.5",
-        "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/parser": "^7.23.5",
-        "@babel/types": "^7.23.5",
-        "debug": "^4.1.0",
+        "@babel/code-frame": "^7.24.7",
+        "@babel/generator": "^7.25.0",
+        "@babel/parser": "^7.25.3",
+        "@babel/template": "^7.25.0",
+        "@babel/types": "^7.25.2",
+        "debug": "^4.3.1",
         "globals": "^11.1.0"
       },
       "engines": {
@@ -1893,13 +1806,12 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.23.5.tgz",
-      "integrity": "sha512-ON5kSOJwVO6xXVRTvOI0eOnWe7VdUcIpsovGo9U/Br4Ie4UVFQTboO2cYnDhAGU6Fp+UxSiT+pMft0SMHfuq6w==",
-      "dev": true,
+      "version": "7.25.2",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.25.2.tgz",
+      "integrity": "sha512-YTnYtra7W9e6/oAZEHj0bJehPRUlLH9/fbpT5LfB0NhQXyALCRkRs3zH9v07IYhkgpqX6Z78FnuccZr/l4Fs4Q==",
       "dependencies": {
-        "@babel/helper-string-parser": "^7.23.4",
-        "@babel/helper-validator-identifier": "^7.22.20",
+        "@babel/helper-string-parser": "^7.24.8",
+        "@babel/helper-validator-identifier": "^7.24.7",
         "to-fast-properties": "^2.0.0"
       },
       "engines": {
@@ -1923,13 +1835,13 @@
       }
     },
     "node_modules/@commitlint/config-validator": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/config-validator/-/config-validator-18.4.3.tgz",
-      "integrity": "sha512-FPZZmTJBARPCyef9ohRC9EANiQEKSWIdatx5OlgeHKu878dWwpyeFauVkhzuBRJFcCA4Uvz/FDtlDKs008IHcA==",
+      "version": "19.0.3",
+      "resolved": "https://registry.npmjs.org/@commitlint/config-validator/-/config-validator-19.0.3.tgz",
+      "integrity": "sha512-2D3r4PKjoo59zBc2auodrSCaUnCSALCx54yveOFwwP/i2kfEAQrygwOleFWswLqK0UL/F9r07MFi5ev2ohyM4Q==",
       "dev": true,
       "optional": true,
       "dependencies": {
-        "@commitlint/types": "^18.4.3",
+        "@commitlint/types": "^19.0.3",
         "ajv": "^8.11.0"
       },
       "engines": {
@@ -1937,9 +1849,9 @@
       }
     },
     "node_modules/@commitlint/execute-rule": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/execute-rule/-/execute-rule-18.4.3.tgz",
-      "integrity": "sha512-t7FM4c+BdX9WWZCPrrbV5+0SWLgT3kCq7e7/GhHCreYifg3V8qyvO127HF796vyFql75n4TFF+5v1asOOWkV1Q==",
+      "version": "19.0.0",
+      "resolved": "https://registry.npmjs.org/@commitlint/execute-rule/-/execute-rule-19.0.0.tgz",
+      "integrity": "sha512-mtsdpY1qyWgAO/iOK0L6gSGeR7GFcdW7tIjcNFxcWkfLDF5qVbPHKuGATFqRMsxcO8OUKNj0+3WOHB7EHm4Jdw==",
       "dev": true,
       "optional": true,
       "engines": {
@@ -1947,70 +1859,85 @@
       }
     },
     "node_modules/@commitlint/load": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/load/-/load-18.4.3.tgz",
-      "integrity": "sha512-v6j2WhvRQJrcJaj5D+EyES2WKTxPpxENmNpNG3Ww8MZGik3jWRXtph0QTzia5ZJyPh2ib5aC/6BIDymkUUM58Q==",
+      "version": "19.2.0",
+      "resolved": "https://registry.npmjs.org/@commitlint/load/-/load-19.2.0.tgz",
+      "integrity": "sha512-XvxxLJTKqZojCxaBQ7u92qQLFMMZc4+p9qrIq/9kJDy8DOrEa7P1yx7Tjdc2u2JxIalqT4KOGraVgCE7eCYJyQ==",
       "dev": true,
       "optional": true,
       "dependencies": {
-        "@commitlint/config-validator": "^18.4.3",
-        "@commitlint/execute-rule": "^18.4.3",
-        "@commitlint/resolve-extends": "^18.4.3",
-        "@commitlint/types": "^18.4.3",
-        "@types/node": "^18.11.9",
-        "chalk": "^4.1.0",
-        "cosmiconfig": "^8.3.6",
+        "@commitlint/config-validator": "^19.0.3",
+        "@commitlint/execute-rule": "^19.0.0",
+        "@commitlint/resolve-extends": "^19.1.0",
+        "@commitlint/types": "^19.0.3",
+        "chalk": "^5.3.0",
+        "cosmiconfig": "^9.0.0",
         "cosmiconfig-typescript-loader": "^5.0.0",
         "lodash.isplainobject": "^4.0.6",
         "lodash.merge": "^4.6.2",
-        "lodash.uniq": "^4.5.0",
-        "resolve-from": "^5.0.0"
+        "lodash.uniq": "^4.5.0"
       },
       "engines": {
         "node": ">=v18"
       }
     },
-    "node_modules/@commitlint/load/node_modules/@types/node": {
-      "version": "18.19.1",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.1.tgz",
-      "integrity": "sha512-mZJ9V11gG5Vp0Ox2oERpeFDl+JvCwK24PGy76vVY/UgBtjwJWc5rYBThFxmbnYOm9UPZNm6wEl/sxHt2SU7x9A==",
+    "node_modules/@commitlint/load/node_modules/chalk": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.3.0.tgz",
+      "integrity": "sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==",
       "dev": true,
       "optional": true,
-      "dependencies": {
-        "undici-types": "~5.26.4"
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
     "node_modules/@commitlint/resolve-extends": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/resolve-extends/-/resolve-extends-18.4.3.tgz",
-      "integrity": "sha512-30sk04LZWf8+SDgJrbJCjM90gTg2LxsD9cykCFeFu+JFHvBFq5ugzp2eO/DJGylAdVaqxej3c7eTSE64hR/lnw==",
+      "version": "19.1.0",
+      "resolved": "https://registry.npmjs.org/@commitlint/resolve-extends/-/resolve-extends-19.1.0.tgz",
+      "integrity": "sha512-z2riI+8G3CET5CPgXJPlzftH+RiWYLMYv4C9tSLdLXdr6pBNimSKukYP9MS27ejmscqCTVA4almdLh0ODD2KYg==",
       "dev": true,
       "optional": true,
       "dependencies": {
-        "@commitlint/config-validator": "^18.4.3",
-        "@commitlint/types": "^18.4.3",
-        "import-fresh": "^3.0.0",
+        "@commitlint/config-validator": "^19.0.3",
+        "@commitlint/types": "^19.0.3",
+        "global-directory": "^4.0.1",
+        "import-meta-resolve": "^4.0.0",
         "lodash.mergewith": "^4.6.2",
-        "resolve-from": "^5.0.0",
-        "resolve-global": "^1.0.0"
+        "resolve-from": "^5.0.0"
       },
       "engines": {
         "node": ">=v18"
       }
     },
     "node_modules/@commitlint/types": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/types/-/types-18.4.3.tgz",
-      "integrity": "sha512-cvzx+vtY/I2hVBZHCLrpoh+sA0hfuzHwDc+BAFPimYLjJkpHnghQM+z8W/KyLGkygJh3BtI3xXXq+dKjnSWEmA==",
+      "version": "19.0.3",
+      "resolved": "https://registry.npmjs.org/@commitlint/types/-/types-19.0.3.tgz",
+      "integrity": "sha512-tpyc+7i6bPG9mvaBbtKUeghfyZSDgWquIDfMgqYtTbmZ9Y9VzEm2je9EYcQ0aoz5o7NvGS+rcDec93yO08MHYA==",
       "dev": true,
       "optional": true,
       "dependencies": {
-        "chalk": "^4.1.0"
+        "@types/conventional-commits-parser": "^5.0.0",
+        "chalk": "^5.3.0"
       },
       "engines": {
         "node": ">=v18"
       }
     },
+    "node_modules/@commitlint/types/node_modules/chalk": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.3.0.tgz",
+      "integrity": "sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==",
+      "dev": true,
+      "optional": true,
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
     "node_modules/@cspotcode/source-map-support": {
       "version": "0.8.1",
       "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz",
@@ -2034,9 +1961,9 @@
       }
     },
     "node_modules/@csstools/css-parser-algorithms": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.5.0.tgz",
-      "integrity": "sha512-abypo6m9re3clXA00eu5syw+oaPHbJTPapu9C4pzNsJ4hdZDzushT50Zhu+iIYXgEe1CxnRMn7ngsbV+MLrlpQ==",
+      "version": "2.7.1",
+      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.7.1.tgz",
+      "integrity": "sha512-2SJS42gxmACHgikc1WGesXLIT8d/q2l0UFM7TaEeIzdFCE/FPMtTiizcPGGJtlPo2xuQzY09OhrLTzRxqJqwGw==",
       "dev": true,
       "funding": [
         {
@@ -2052,13 +1979,13 @@
         "node": "^14 || ^16 || >=18"
       },
       "peerDependencies": {
-        "@csstools/css-tokenizer": "^2.2.3"
+        "@csstools/css-tokenizer": "^2.4.1"
       }
     },
     "node_modules/@csstools/css-tokenizer": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.3.tgz",
-      "integrity": "sha512-pp//EvZ9dUmGuGtG1p+n17gTHEOqu9jO+FiCUjNN3BDmyhdA2Jq9QsVeR7K8/2QCK17HSsioPlTW9ZkzoWb3Lg==",
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.4.1.tgz",
+      "integrity": "sha512-eQ9DIktFJBhGjioABJRtUucoWR2mwllurfnM8LuNGAqX3ViZXaUchqk+1s7jjtkFiT9ySdACsFEA3etErkALUg==",
       "dev": true,
       "funding": [
         {
@@ -2075,9 +2002,9 @@
       }
     },
     "node_modules/@csstools/media-query-list-parser": {
-      "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.7.tgz",
-      "integrity": "sha512-lHPKJDkPUECsyAvD60joYfDmp8UERYxHGkFfyLJFTVK/ERJe0sVlIFLXU5XFxdjNDTerp5L4KeaKG+Z5S94qxQ==",
+      "version": "2.1.13",
+      "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.13.tgz",
+      "integrity": "sha512-XaHr+16KRU9Gf8XLi3q8kDlI18d5vzKSKCY510Vrtc9iNR0NJzbY9hhTmwhzYZj/ZwGL4VmB3TA9hJW0Um2qFA==",
       "dev": true,
       "funding": [
         {
@@ -2093,14 +2020,14 @@
         "node": "^14 || ^16 || >=18"
       },
       "peerDependencies": {
-        "@csstools/css-parser-algorithms": "^2.5.0",
-        "@csstools/css-tokenizer": "^2.2.3"
+        "@csstools/css-parser-algorithms": "^2.7.1",
+        "@csstools/css-tokenizer": "^2.4.1"
       }
     },
     "node_modules/@csstools/selector-specificity": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-3.0.1.tgz",
-      "integrity": "sha512-NPljRHkq4a14YzZ3YD406uaxh7s0g6eAq3L9aLOWywoqe8PkYamAvtsh7KNX6c++ihDrJ0RiU+/z7rGnhlZ5ww==",
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-3.1.1.tgz",
+      "integrity": "sha512-a7cxGcJ2wIlMFLlh8z2ONm+715QkPHiyJcxwQlKOz/03GPw1COpfhcmC9wm4xlZfp//jWHNNMwzjtqHXVWU9KA==",
       "dev": true,
       "funding": [
         {
@@ -2119,25 +2046,35 @@
         "postcss-selector-parser": "^6.0.13"
       }
     },
+    "node_modules/@dual-bundle/import-meta-resolve": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/@dual-bundle/import-meta-resolve/-/import-meta-resolve-4.1.0.tgz",
+      "integrity": "sha512-+nxncfwHM5SgAtrVzgpzJOI1ol0PkumhVo469KCf9lUi21IGcY90G98VuHm9VRrUypmAzawAHO9bs6hqeADaVg==",
+      "dev": true,
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/@emotion/is-prop-valid": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.1.tgz",
-      "integrity": "sha512-61Mf7Ufx4aDxx1xlDeOm8aFFigGHE4z+0sKCa+IHCeZKiyP9RLD0Mmx7m8b9/Cf37f7NAvQOOJAbQQGVr5uERw==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.3.0.tgz",
+      "integrity": "sha512-SHetuSLvJDzuNbOdtPVbq6yMMMlLoW5Q94uDqJZqy50gcmAjxFkVqmzqSGEFq9gT2iMuIeKV1PXVWmvUhuZLlQ==",
       "dev": true,
       "dependencies": {
-        "@emotion/memoize": "^0.8.1"
+        "@emotion/memoize": "^0.9.0"
       }
     },
     "node_modules/@emotion/memoize": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz",
-      "integrity": "sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==",
+      "version": "0.9.0",
+      "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz",
+      "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==",
       "dev": true
     },
     "node_modules/@esbuild/aix-ppc64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.19.11.tgz",
-      "integrity": "sha512-FnzU0LyE3ySQk7UntJO4+qIiQgI7KoODnZg5xzXIrFJlKd2P2gwHsHY4927xj9y5PJmJSzULiUCWmv7iWnNa7g==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
+      "integrity": "sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==",
       "cpu": [
         "ppc64"
       ],
@@ -2151,9 +2088,9 @@
       }
     },
     "node_modules/@esbuild/android-arm": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.19.11.tgz",
-      "integrity": "sha512-5OVapq0ClabvKvQ58Bws8+wkLCV+Rxg7tUVbo9xu034Nm536QTII4YzhaFriQ7rMrorfnFKUsArD2lqKbFY4vw==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.21.5.tgz",
+      "integrity": "sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==",
       "cpu": [
         "arm"
       ],
@@ -2167,9 +2104,9 @@
       }
     },
     "node_modules/@esbuild/android-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.19.11.tgz",
-      "integrity": "sha512-aiu7K/5JnLj//KOnOfEZ0D90obUkRzDMyqd/wNAUQ34m4YUPVhRZpnqKV9uqDGxT7cToSDnIHsGooyIczu9T+Q==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz",
+      "integrity": "sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==",
       "cpu": [
         "arm64"
       ],
@@ -2183,9 +2120,9 @@
       }
     },
     "node_modules/@esbuild/android-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.19.11.tgz",
-      "integrity": "sha512-eccxjlfGw43WYoY9QgB82SgGgDbibcqyDTlk3l3C0jOVHKxrjdc9CTwDUQd0vkvYg5um0OH+GpxYvp39r+IPOg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.21.5.tgz",
+      "integrity": "sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==",
       "cpu": [
         "x64"
       ],
@@ -2199,9 +2136,9 @@
       }
     },
     "node_modules/@esbuild/darwin-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.19.11.tgz",
-      "integrity": "sha512-ETp87DRWuSt9KdDVkqSoKoLFHYTrkyz2+65fj9nfXsaV3bMhTCjtQfw3y+um88vGRKRiF7erPrh/ZuIdLUIVxQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz",
+      "integrity": "sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==",
       "cpu": [
         "arm64"
       ],
@@ -2215,9 +2152,9 @@
       }
     },
     "node_modules/@esbuild/darwin-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.19.11.tgz",
-      "integrity": "sha512-fkFUiS6IUK9WYUO/+22omwetaSNl5/A8giXvQlcinLIjVkxwTLSktbF5f/kJMftM2MJp9+fXqZ5ezS7+SALp4g==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz",
+      "integrity": "sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==",
       "cpu": [
         "x64"
       ],
@@ -2231,9 +2168,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.19.11.tgz",
-      "integrity": "sha512-lhoSp5K6bxKRNdXUtHoNc5HhbXVCS8V0iZmDvyWvYq9S5WSfTIHU2UGjcGt7UeS6iEYp9eeymIl5mJBn0yiuxA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz",
+      "integrity": "sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==",
       "cpu": [
         "arm64"
       ],
@@ -2247,9 +2184,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.19.11.tgz",
-      "integrity": "sha512-JkUqn44AffGXitVI6/AbQdoYAq0TEullFdqcMY/PCUZ36xJ9ZJRtQabzMA+Vi7r78+25ZIBosLTOKnUXBSi1Kw==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz",
+      "integrity": "sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==",
       "cpu": [
         "x64"
       ],
@@ -2263,9 +2200,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.19.11.tgz",
-      "integrity": "sha512-3CRkr9+vCV2XJbjwgzjPtO8T0SZUmRZla+UL1jw+XqHZPkPgZiyWvbDvl9rqAN8Zl7qJF0O/9ycMtjU67HN9/Q==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz",
+      "integrity": "sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==",
       "cpu": [
         "arm"
       ],
@@ -2279,9 +2216,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.19.11.tgz",
-      "integrity": "sha512-LneLg3ypEeveBSMuoa0kwMpCGmpu8XQUh+mL8XXwoYZ6Be2qBnVtcDI5azSvh7vioMDhoJFZzp9GWp9IWpYoUg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz",
+      "integrity": "sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==",
       "cpu": [
         "arm64"
       ],
@@ -2295,9 +2232,9 @@
       }
     },
     "node_modules/@esbuild/linux-ia32": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.19.11.tgz",
-      "integrity": "sha512-caHy++CsD8Bgq2V5CodbJjFPEiDPq8JJmBdeyZ8GWVQMjRD0sU548nNdwPNvKjVpamYYVL40AORekgfIubwHoA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz",
+      "integrity": "sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==",
       "cpu": [
         "ia32"
       ],
@@ -2311,9 +2248,9 @@
       }
     },
     "node_modules/@esbuild/linux-loong64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.19.11.tgz",
-      "integrity": "sha512-ppZSSLVpPrwHccvC6nQVZaSHlFsvCQyjnvirnVjbKSHuE5N24Yl8F3UwYUUR1UEPaFObGD2tSvVKbvR+uT1Nrg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz",
+      "integrity": "sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==",
       "cpu": [
         "loong64"
       ],
@@ -2327,9 +2264,9 @@
       }
     },
     "node_modules/@esbuild/linux-mips64el": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.19.11.tgz",
-      "integrity": "sha512-B5x9j0OgjG+v1dF2DkH34lr+7Gmv0kzX6/V0afF41FkPMMqaQ77pH7CrhWeR22aEeHKaeZVtZ6yFwlxOKPVFyg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz",
+      "integrity": "sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==",
       "cpu": [
         "mips64el"
       ],
@@ -2343,9 +2280,9 @@
       }
     },
     "node_modules/@esbuild/linux-ppc64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.19.11.tgz",
-      "integrity": "sha512-MHrZYLeCG8vXblMetWyttkdVRjQlQUb/oMgBNurVEnhj4YWOr4G5lmBfZjHYQHHN0g6yDmCAQRR8MUHldvvRDA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz",
+      "integrity": "sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==",
       "cpu": [
         "ppc64"
       ],
@@ -2359,9 +2296,9 @@
       }
     },
     "node_modules/@esbuild/linux-riscv64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.19.11.tgz",
-      "integrity": "sha512-f3DY++t94uVg141dozDu4CCUkYW+09rWtaWfnb3bqe4w5NqmZd6nPVBm+qbz7WaHZCoqXqHz5p6CM6qv3qnSSQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz",
+      "integrity": "sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==",
       "cpu": [
         "riscv64"
       ],
@@ -2375,9 +2312,9 @@
       }
     },
     "node_modules/@esbuild/linux-s390x": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.19.11.tgz",
-      "integrity": "sha512-A5xdUoyWJHMMlcSMcPGVLzYzpcY8QP1RtYzX5/bS4dvjBGVxdhuiYyFwp7z74ocV7WDc0n1harxmpq2ePOjI0Q==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz",
+      "integrity": "sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==",
       "cpu": [
         "s390x"
       ],
@@ -2391,9 +2328,9 @@
       }
     },
     "node_modules/@esbuild/linux-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.19.11.tgz",
-      "integrity": "sha512-grbyMlVCvJSfxFQUndw5mCtWs5LO1gUlwP4CDi4iJBbVpZcqLVT29FxgGuBJGSzyOxotFG4LoO5X+M1350zmPA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz",
+      "integrity": "sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==",
       "cpu": [
         "x64"
       ],
@@ -2407,9 +2344,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.19.11.tgz",
-      "integrity": "sha512-13jvrQZJc3P230OhU8xgwUnDeuC/9egsjTkXN49b3GcS5BKvJqZn86aGM8W9pd14Kd+u7HuFBMVtrNGhh6fHEQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz",
+      "integrity": "sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==",
       "cpu": [
         "x64"
       ],
@@ -2423,9 +2360,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.19.11.tgz",
-      "integrity": "sha512-ysyOGZuTp6SNKPE11INDUeFVVQFrhcNDVUgSQVDzqsqX38DjhPEPATpid04LCoUr2WXhQTEZ8ct/EgJCUDpyNw==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz",
+      "integrity": "sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==",
       "cpu": [
         "x64"
       ],
@@ -2439,9 +2376,9 @@
       }
     },
     "node_modules/@esbuild/sunos-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.19.11.tgz",
-      "integrity": "sha512-Hf+Sad9nVwvtxy4DXCZQqLpgmRTQqyFyhT3bZ4F2XlJCjxGmRFF0Shwn9rzhOYRB61w9VMXUkxlBy56dk9JJiQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz",
+      "integrity": "sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==",
       "cpu": [
         "x64"
       ],
@@ -2455,9 +2392,9 @@
       }
     },
     "node_modules/@esbuild/win32-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.19.11.tgz",
-      "integrity": "sha512-0P58Sbi0LctOMOQbpEOvOL44Ne0sqbS0XWHMvvrg6NE5jQ1xguCSSw9jQeUk2lfrXYsKDdOe6K+oZiwKPilYPQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz",
+      "integrity": "sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==",
       "cpu": [
         "arm64"
       ],
@@ -2471,9 +2408,9 @@
       }
     },
     "node_modules/@esbuild/win32-ia32": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.19.11.tgz",
-      "integrity": "sha512-6YOrWS+sDJDmshdBIQU+Uoyh7pQKrdykdefC1avn76ss5c+RN6gut3LZA4E2cH5xUEp5/cA0+YxRaVtRAb0xBg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz",
+      "integrity": "sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==",
       "cpu": [
         "ia32"
       ],
@@ -2487,9 +2424,9 @@
       }
     },
     "node_modules/@esbuild/win32-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.19.11.tgz",
-      "integrity": "sha512-vfkhltrjCAb603XaFhqhAF4LGDi2M4OrCRrFusyQ+iTLQ/o60QQXxc9cZC/FFpihBI9N1Grn6SMKVJ4KP7Fuiw==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz",
+      "integrity": "sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==",
       "cpu": [
         "x64"
       ],
@@ -2518,9 +2455,9 @@
       }
     },
     "node_modules/@eslint-community/regexpp": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.10.0.tgz",
-      "integrity": "sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==",
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.11.0.tgz",
+      "integrity": "sha512-G/M/tIiMrTAxEWRfLfQJMmGNX28IxBg4PBz8XqQhqUHLFI6TL2htpIB1iQCj144V5ee/JaKyT9/WZ0MGZWfA7A==",
       "dev": true,
       "engines": {
         "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
@@ -2566,9 +2503,9 @@
       }
     },
     "node_modules/@eslint/eslintrc/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
       "dependencies": {
         "type-fest": "^0.20.2"
@@ -2599,22 +2536,23 @@
       }
     },
     "node_modules/@eslint/js": {
-      "version": "8.55.0",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.55.0.tgz",
-      "integrity": "sha512-qQfo2mxH5yVom1kacMtZZJFVdW+E70mqHMJvVg6WTLo+VBuQJ4TojZlfWBjK0ve5BdEeNAVxOsl/nvNMpJOaJA==",
+      "version": "8.57.0",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.0.tgz",
+      "integrity": "sha512-Ys+3g2TaW7gADOJzPt83SJtCDhMjndcDMFVQ/Tj9iA1BfJzFKD9mAUXT3OenpuPHbI6P/myECxRJrofUsDx/5g==",
       "dev": true,
       "engines": {
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       }
     },
     "node_modules/@humanwhocodes/config-array": {
-      "version": "0.11.13",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.13.tgz",
-      "integrity": "sha512-JSBDMiDKSzQVngfRjOdFXgFfklaXI4K9nLF49Auh21lmBWRLIK3+xTErTWD4KU54pb6coM6ESE7Awz/FNU3zgQ==",
+      "version": "0.11.14",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.14.tgz",
+      "integrity": "sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==",
+      "deprecated": "Use @eslint/config-array instead",
       "dev": true,
       "dependencies": {
-        "@humanwhocodes/object-schema": "^2.0.1",
-        "debug": "^4.1.1",
+        "@humanwhocodes/object-schema": "^2.0.2",
+        "debug": "^4.3.1",
         "minimatch": "^3.0.5"
       },
       "engines": {
@@ -2635,9 +2573,10 @@
       }
     },
     "node_modules/@humanwhocodes/object-schema": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-2.0.1.tgz",
-      "integrity": "sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-2.0.3.tgz",
+      "integrity": "sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA==",
+      "deprecated": "Use @eslint/object-schema instead",
       "dev": true
     },
     "node_modules/@isaacs/cliui": {
@@ -2758,48 +2697,46 @@
       }
     },
     "node_modules/@jridgewell/gen-mapping": {
-      "version": "0.3.3",
-      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
-      "integrity": "sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==",
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
+      "integrity": "sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==",
       "dev": true,
-      "peer": true,
       "dependencies": {
-        "@jridgewell/set-array": "^1.0.1",
+        "@jridgewell/set-array": "^1.2.1",
         "@jridgewell/sourcemap-codec": "^1.4.10",
-        "@jridgewell/trace-mapping": "^0.3.9"
+        "@jridgewell/trace-mapping": "^0.3.24"
       },
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/@jridgewell/resolve-uri": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.1.tgz",
-      "integrity": "sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
       "dev": true,
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/@jridgewell/set-array": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz",
-      "integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
+      "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
       "dev": true,
-      "peer": true,
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/@jridgewell/sourcemap-codec": {
-      "version": "1.4.15",
-      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
-      "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
+      "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ=="
     },
     "node_modules/@jridgewell/trace-mapping": {
-      "version": "0.3.20",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.20.tgz",
-      "integrity": "sha512-R8LcPeWZol2zR8mmH3JeKQ6QRCFb7XgUhV9ZlGhHLGyg4wpPiPZNQOOWhFZhxKw8u//yTbNGI42Bx/3paXEQ+Q==",
+      "version": "0.3.25",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
+      "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
       "dev": true,
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.1.0",
@@ -2807,37 +2744,38 @@
       }
     },
     "node_modules/@microsoft/api-extractor": {
-      "version": "7.38.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-7.38.3.tgz",
-      "integrity": "sha512-xt9iYyC5f39281j77JTA9C3ISJpW1XWkCcnw+2vM78CPnro6KhPfwQdPDfwS5JCPNuq0grm8cMdPUOPvrchDWw==",
+      "version": "7.43.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-7.43.0.tgz",
+      "integrity": "sha512-GFhTcJpB+MI6FhvXEI9b2K0snulNLWHqC/BbcJtyNYcKUiw7l3Lgis5ApsYncJ0leALX7/of4XfmXk+maT111w==",
       "dev": true,
       "dependencies": {
-        "@microsoft/api-extractor-model": "7.28.2",
+        "@microsoft/api-extractor-model": "7.28.13",
         "@microsoft/tsdoc": "0.14.2",
         "@microsoft/tsdoc-config": "~0.16.1",
-        "@rushstack/node-core-library": "3.61.0",
-        "@rushstack/rig-package": "0.5.1",
-        "@rushstack/ts-command-line": "4.17.1",
-        "colors": "~1.2.1",
+        "@rushstack/node-core-library": "4.0.2",
+        "@rushstack/rig-package": "0.5.2",
+        "@rushstack/terminal": "0.10.0",
+        "@rushstack/ts-command-line": "4.19.1",
         "lodash": "~4.17.15",
+        "minimatch": "~3.0.3",
         "resolve": "~1.22.1",
         "semver": "~7.5.4",
         "source-map": "~0.6.1",
-        "typescript": "~5.0.4"
+        "typescript": "5.4.2"
       },
       "bin": {
         "api-extractor": "bin/api-extractor"
       }
     },
     "node_modules/@microsoft/api-extractor-model": {
-      "version": "7.28.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor-model/-/api-extractor-model-7.28.2.tgz",
-      "integrity": "sha512-vkojrM2fo3q4n4oPh4uUZdjJ2DxQ2+RnDQL/xhTWSRUNPF6P4QyrvY357HBxbnltKcYu+nNNolVqc6TIGQ73Ig==",
+      "version": "7.28.13",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor-model/-/api-extractor-model-7.28.13.tgz",
+      "integrity": "sha512-39v/JyldX4MS9uzHcdfmjjfS6cYGAoXV+io8B5a338pkHiSt+gy2eXQ0Q7cGFJ7quSa1VqqlMdlPrB6sLR/cAw==",
       "dev": true,
       "dependencies": {
         "@microsoft/tsdoc": "0.14.2",
         "@microsoft/tsdoc-config": "~0.16.1",
-        "@rushstack/node-core-library": "3.61.0"
+        "@rushstack/node-core-library": "4.0.2"
       }
     },
     "node_modules/@microsoft/api-extractor/node_modules/lru-cache": {
@@ -2852,6 +2790,18 @@
         "node": ">=10"
       }
     },
+    "node_modules/@microsoft/api-extractor/node_modules/minimatch": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.8.tgz",
+      "integrity": "sha512-6FsRAQsxQ61mw+qP1ZzbL9Bc78x2p5OqNgNpnoAFLTrX8n5Kxph0CsnhmKKNXTWjXqU5L0pGPR7hYk+XWZr60Q==",
+      "dev": true,
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/@microsoft/api-extractor/node_modules/semver": {
       "version": "7.5.4",
       "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
@@ -2868,16 +2818,16 @@
       }
     },
     "node_modules/@microsoft/api-extractor/node_modules/typescript": {
-      "version": "5.0.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz",
-      "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==",
+      "version": "5.4.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.2.tgz",
+      "integrity": "sha512-+2/g0Fds1ERlP6JsakQQDXjZdZMM+rqpamFZJEKh4kwTIn3iDkgKtby0CeNd5ATNZ4Ry1ax15TMx0W2V+miizQ==",
       "dev": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
       },
       "engines": {
-        "node": ">=12.20"
+        "node": ">=14.17"
       }
     },
     "node_modules/@microsoft/api-extractor/node_modules/yallist": {
@@ -2940,15 +2890,15 @@
       }
     },
     "node_modules/@nightwatch/chai": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/@nightwatch/chai/-/chai-5.0.2.tgz",
-      "integrity": "sha512-yzILJFCcE75OPoRfBlJ80Y3Ky06ljsdrK4Ld92yhmM477vxO2GEguwnd+ldl7pdSYTcg1gSJ1bPPQrA+/Hrn+A==",
+      "version": "5.0.3",
+      "resolved": "https://registry.npmjs.org/@nightwatch/chai/-/chai-5.0.3.tgz",
+      "integrity": "sha512-1OIkOf/7jswOC3/t+Add/HVQO8ib75kz6BVYSNeWGghTlmHUqYEfNJ6vcACbXrn/4v3+9iRlWixuhFkxXkU/RQ==",
       "dev": true,
       "dependencies": {
         "assertion-error": "1.1.0",
         "check-error": "1.0.2",
         "deep-eql": "4.0.1",
-        "loupe": "2.3.4",
+        "loupe": "^2.3.7",
         "pathval": "1.1.1",
         "type-detect": "4.0.8"
       },
@@ -2957,9 +2907,9 @@
       }
     },
     "node_modules/@nightwatch/html-reporter-template": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/@nightwatch/html-reporter-template/-/html-reporter-template-0.2.1.tgz",
-      "integrity": "sha512-GEBeGoXVmTYPtNC4Yq34vfgxf6mlFyEagxpsfH18Qe5BvctF2rprX+wI5dKBm9p5IqHo6ZOcXHCufOeP3cjuOw==",
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/@nightwatch/html-reporter-template/-/html-reporter-template-0.3.0.tgz",
+      "integrity": "sha512-Mze1z6pmUz2O8N9w1/h3QWz1lzMig45PGyh8PrL9ERs3FxVnIX0RCn37vjZUYiV4wgjZOg41JjdcpriZ3dJxkA==",
       "dev": true
     },
     "node_modules/@nightwatch/nightwatch-inspector": {
@@ -3024,19 +2974,19 @@
       }
     },
     "node_modules/@puppeteer/browsers": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/@puppeteer/browsers/-/browsers-2.2.3.tgz",
-      "integrity": "sha512-bJ0UBsk0ESOs6RFcLXOt99a3yTDcOKlzfjad+rhFwdaG1Lu/Wzq58GHYCDTlZ9z6mldf4g+NTb+TXEfe0PpnsQ==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@puppeteer/browsers/-/browsers-2.3.0.tgz",
+      "integrity": "sha512-ioXoq9gPxkss4MYhD+SFaU9p1IHFUX0ILAWFPyjGaBdjLsYAlZw6j1iLA0N/m12uVHLFDfSYNF7EQccjinIMDA==",
       "dev": true,
       "dependencies": {
-        "debug": "4.3.4",
-        "extract-zip": "2.0.1",
-        "progress": "2.0.3",
-        "proxy-agent": "6.4.0",
-        "semver": "7.6.0",
-        "tar-fs": "3.0.5",
-        "unbzip2-stream": "1.4.3",
-        "yargs": "17.7.2"
+        "debug": "^4.3.5",
+        "extract-zip": "^2.0.1",
+        "progress": "^2.0.3",
+        "proxy-agent": "^6.4.0",
+        "semver": "^7.6.3",
+        "tar-fs": "^3.0.6",
+        "unbzip2-stream": "^1.4.3",
+        "yargs": "^17.7.2"
       },
       "bin": {
         "browsers": "lib/cjs/main-cli.js"
@@ -3059,26 +3009,11 @@
         "node": ">=12"
       }
     },
-    "node_modules/@puppeteer/browsers/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/@puppeteer/browsers/node_modules/semver": {
-      "version": "7.6.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
-      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -3103,12 +3038,6 @@
         "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
-    "node_modules/@puppeteer/browsers/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/@puppeteer/browsers/node_modules/yargs": {
       "version": "17.7.2",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
@@ -3204,9 +3133,9 @@
       }
     },
     "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.2.tgz",
-      "integrity": "sha512-RKzxFxBHq9ysZ83fn8Iduv3A283K7zPPYuhL/z9CQuyFrjwpErJx0h4aeb/bnJ+q29GRLgJpY66ceQ/Wcsn3wA==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.20.0.tgz",
+      "integrity": "sha512-TSpWzflCc4VGAUJZlPpgAJE1+V60MePDQnBd7PPkpuEmOy8i87aL6tinFGKBFKuEDikYpig72QzdT3QPYIi+oA==",
       "cpu": [
         "arm"
       ],
@@ -3217,9 +3146,9 @@
       ]
     },
     "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.9.2.tgz",
-      "integrity": "sha512-yZ+MUbnwf3SHNWQKJyWh88ii2HbuHCFQnAYTeeO1Nb8SyEiWASEi5dQUygt3ClHWtA9My9RQAYkjvrsZ0WK8Xg==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.20.0.tgz",
+      "integrity": "sha512-u00Ro/nok7oGzVuh/FMYfNoGqxU5CPWz1mxV85S2w9LxHR8OoMQBuSk+3BKVIDYgkpeOET5yXkx90OYFc+ytpQ==",
       "cpu": [
         "arm64"
       ],
@@ -3230,9 +3159,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.9.2.tgz",
-      "integrity": "sha512-vqJ/pAUh95FLc/G/3+xPqlSBgilPnauVf2EXOQCZzhZJCXDXt/5A8mH/OzU6iWhb3CNk5hPJrh8pqJUPldN5zw==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.20.0.tgz",
+      "integrity": "sha512-uFVfvzvsdGtlSLuL0ZlvPJvl6ZmrH4CBwLGEFPe7hUmf7htGAN+aXo43R/V6LATyxlKVC/m6UsLb7jbG+LG39Q==",
       "cpu": [
         "arm64"
       ],
@@ -3243,9 +3172,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.9.2.tgz",
-      "integrity": "sha512-otPHsN5LlvedOprd3SdfrRNhOahhVBwJpepVKUN58L0RnC29vOAej1vMEaVU6DadnpjivVsNTM5eNt0CcwTahw==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.20.0.tgz",
+      "integrity": "sha512-xbrMDdlev53vNXexEa6l0LffojxhqDTBeL+VUxuuIXys4x6xyvbKq5XqTXBCEUA8ty8iEJblHvFaWRJTk/icAQ==",
       "cpu": [
         "x64"
       ],
@@ -3256,9 +3185,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.9.2.tgz",
-      "integrity": "sha512-ewG5yJSp+zYKBYQLbd1CUA7b1lSfIdo9zJShNTyc2ZP1rcPrqyZcNlsHgs7v1zhgfdS+kW0p5frc0aVqhZCiYQ==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.20.0.tgz",
+      "integrity": "sha512-jMYvxZwGmoHFBTbr12Xc6wOdc2xA5tF5F2q6t7Rcfab68TT0n+r7dgawD4qhPEvasDsVpQi+MgDzj2faOLsZjA==",
       "cpu": [
         "arm"
       ],
@@ -3268,12 +3197,12 @@
         "linux"
       ]
     },
-    "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.9.2.tgz",
-      "integrity": "sha512-pL6QtV26W52aCWTG1IuFV3FMPL1m4wbsRG+qijIvgFO/VBsiXJjDPE/uiMdHBAO6YcpV4KvpKtd0v3WFbaxBtg==",
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.20.0.tgz",
+      "integrity": "sha512-1asSTl4HKuIHIB1GcdFHNNZhxAYEdqML/MW4QmPS4G0ivbEcBr1JKlFLKsIRqjSwOBkdItn3/ZDlyvZ/N6KPlw==",
       "cpu": [
-        "arm64"
+        "arm"
       ],
       "dev": true,
       "optional": true,
@@ -3281,10 +3210,10 @@
         "linux"
       ]
     },
-    "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.9.2.tgz",
-      "integrity": "sha512-On+cc5EpOaTwPSNetHXBuqylDW+765G/oqB9xGmWU3npEhCh8xu0xqHGUA+4xwZLqBbIZNcBlKSIYfkBm6ko7g==",
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.20.0.tgz",
+      "integrity": "sha512-COBb8Bkx56KldOYJfMf6wKeYJrtJ9vEgBRAOkfw6Ens0tnmzPqvlpjZiLgkhg6cA3DGzCmLmmd319pmHvKWWlQ==",
       "cpu": [
         "arm64"
       ],
@@ -3294,10 +3223,36 @@
         "linux"
       ]
     },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.20.0.tgz",
+      "integrity": "sha512-+it+mBSyMslVQa8wSPvBx53fYuZK/oLTu5RJoXogjk6x7Q7sz1GNRsXWjn6SwyJm8E/oMjNVwPhmNdIjwP135Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.20.0.tgz",
+      "integrity": "sha512-yAMvqhPfGKsAxHN8I4+jE0CpLWD8cv4z7CK7BMmhjDuz606Q2tFKkWRY8bHR9JQXYcoLfopo5TTqzxgPUjUMfw==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.9.2.tgz",
-      "integrity": "sha512-Wnx/IVMSZ31D/cO9HSsU46FjrPWHqtdF8+0eyZ1zIB5a6hXaZXghUKpRrC4D5DcRTZOjml2oBhXoqfGYyXKipw==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.20.0.tgz",
+      "integrity": "sha512-qmuxFpfmi/2SUkAw95TtNq/w/I7Gpjurx609OOOV7U4vhvUhBcftcmXwl3rqAek+ADBwSjIC4IVNLiszoj3dPA==",
       "cpu": [
         "riscv64"
       ],
@@ -3307,10 +3262,23 @@
         "linux"
       ]
     },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.20.0.tgz",
+      "integrity": "sha512-I0BtGXddHSHjV1mqTNkgUZLnS3WtsqebAXv11D5BZE/gfw5KoyXSAXVqyJximQXNvNzUo4GKlCK/dIwXlz+jlg==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.9.2.tgz",
-      "integrity": "sha512-ym5x1cj4mUAMBummxxRkI4pG5Vht1QMsJexwGP8547TZ0sox9fCLDHw9KCH9c1FO5d9GopvkaJsBIOkTKxksdw==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.20.0.tgz",
+      "integrity": "sha512-y+eoL2I3iphUg9tN9GB6ku1FA8kOfmF4oUEWhztDJ4KXJy1agk/9+pejOuZkNFhRwHAOxMsBPLbXPd6mJiCwew==",
       "cpu": [
         "x64"
       ],
@@ -3321,9 +3289,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.9.2.tgz",
-      "integrity": "sha512-m0hYELHGXdYx64D6IDDg/1vOJEaiV8f1G/iO+tejvRCJNSwK4jJ15e38JQy5Q6dGkn1M/9KcyEOwqmlZ2kqaZg==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.20.0.tgz",
+      "integrity": "sha512-hM3nhW40kBNYUkZb/r9k2FKK+/MnKglX7UYd4ZUy5DJs8/sMsIbqWK2piZtVGE3kcXVNj3B2IrUYROJMMCikNg==",
       "cpu": [
         "x64"
       ],
@@ -3334,9 +3302,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.9.2.tgz",
-      "integrity": "sha512-x1CWburlbN5JjG+juenuNa4KdedBdXLjZMp56nHFSHTOsb/MI2DYiGzLtRGHNMyydPGffGId+VgjOMrcltOksA==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.20.0.tgz",
+      "integrity": "sha512-psegMvP+Ik/Bg7QRJbv8w8PAytPA7Uo8fpFjXyCRHWm6Nt42L+JtoqH8eDQ5hRP7/XW2UiIriy1Z46jf0Oa1kA==",
       "cpu": [
         "arm64"
       ],
@@ -3347,9 +3315,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.9.2.tgz",
-      "integrity": "sha512-VVzCB5yXR1QlfsH1Xw1zdzQ4Pxuzv+CPr5qpElpKhVxlxD3CRdfubAG9mJROl6/dmj5gVYDDWk8sC+j9BI9/kQ==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.20.0.tgz",
+      "integrity": "sha512-GabekH3w4lgAJpVxkk7hUzUf2hICSQO0a/BLFA11/RMxQT92MabKAqyubzDZmMOC/hcJNlc+rrypzNzYl4Dx7A==",
       "cpu": [
         "ia32"
       ],
@@ -3360,9 +3328,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.9.2.tgz",
-      "integrity": "sha512-SYRedJi+mweatroB+6TTnJYLts0L0bosg531xnQWtklOI6dezEagx4Q0qDyvRdK+qgdA3YZpjjGuPFtxBmddBA==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.20.0.tgz",
+      "integrity": "sha512-aJ1EJSuTdGnM6qbVC4B5DSmozPTqIag9fSzXRNNo+humQLG89XpPgdt16Ia56ORD7s+H8Pmyx44uczDQ0yDzpg==",
       "cpu": [
         "x64"
       ],
@@ -3373,12 +3341,11 @@
       ]
     },
     "node_modules/@rushstack/node-core-library": {
-      "version": "3.61.0",
-      "resolved": "https://registry.npmjs.org/@rushstack/node-core-library/-/node-core-library-3.61.0.tgz",
-      "integrity": "sha512-tdOjdErme+/YOu4gPed3sFS72GhtWCgNV9oDsHDnoLY5oDfwjKUc9Z+JOZZ37uAxcm/OCahDHfuu2ugqrfWAVQ==",
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@rushstack/node-core-library/-/node-core-library-4.0.2.tgz",
+      "integrity": "sha512-hyES82QVpkfQMeBMteQUnrhASL/KHPhd7iJ8euduwNJG4mu2GSOKybf0rOEjOm1Wz7CwJEUm9y0yD7jg2C1bfg==",
       "dev": true,
       "dependencies": {
-        "colors": "~1.2.1",
         "fs-extra": "~7.0.1",
         "import-lazy": "~4.0.0",
         "jju": "~1.4.0",
@@ -3461,24 +3428,57 @@
       "dev": true
     },
     "node_modules/@rushstack/rig-package": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/@rushstack/rig-package/-/rig-package-0.5.1.tgz",
-      "integrity": "sha512-pXRYSe29TjRw7rqxD4WS3HN/sRSbfr+tJs4a9uuaSIBAITbUggygdhuG0VrO0EO+QqH91GhYMN4S6KRtOEmGVA==",
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/@rushstack/rig-package/-/rig-package-0.5.2.tgz",
+      "integrity": "sha512-mUDecIJeH3yYGZs2a48k+pbhM6JYwWlgjs2Ca5f2n1G2/kgdgP9D/07oglEGf6mRyXEnazhEENeYTSNDRCwdqA==",
       "dev": true,
       "dependencies": {
         "resolve": "~1.22.1",
         "strip-json-comments": "~3.1.1"
       }
     },
+    "node_modules/@rushstack/terminal": {
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/@rushstack/terminal/-/terminal-0.10.0.tgz",
+      "integrity": "sha512-UbELbXnUdc7EKwfH2sb8ChqNgapUOdqcCIdQP4NGxBpTZV2sQyeekuK3zmfQSa/MN+/7b4kBogl2wq0vpkpYGw==",
+      "dev": true,
+      "dependencies": {
+        "@rushstack/node-core-library": "4.0.2",
+        "supports-color": "~8.1.1"
+      },
+      "peerDependencies": {
+        "@types/node": "*"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@rushstack/terminal/node_modules/supports-color": {
+      "version": "8.1.1",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
+      "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
+      "dev": true,
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/supports-color?sponsor=1"
+      }
+    },
     "node_modules/@rushstack/ts-command-line": {
-      "version": "4.17.1",
-      "resolved": "https://registry.npmjs.org/@rushstack/ts-command-line/-/ts-command-line-4.17.1.tgz",
-      "integrity": "sha512-2jweO1O57BYP5qdBGl6apJLB+aRIn5ccIRTPDyULh0KMwVzFqWtw6IZWt1qtUoZD/pD2RNkIOosH6Cq45rIYeg==",
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/@rushstack/ts-command-line/-/ts-command-line-4.19.1.tgz",
+      "integrity": "sha512-J7H768dgcpG60d7skZ5uSSwyCZs/S2HrWP1Ds8d1qYAyaaeJmpmmLr9BVw97RjFzmQPOYnoXcKA4GkqDCkduQg==",
       "dev": true,
       "dependencies": {
+        "@rushstack/terminal": "0.10.0",
         "@types/argparse": "1.0.38",
         "argparse": "~1.0.9",
-        "colors": "~1.2.1",
         "string-argv": "~0.3.1"
       }
     },
@@ -3491,6 +3491,12 @@
         "sprintf-js": "~1.0.2"
       }
     },
+    "node_modules/@rushstack/ts-command-line/node_modules/sprintf-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+      "integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==",
+      "dev": true
+    },
     "node_modules/@sinclair/typebox": {
       "version": "0.27.8",
       "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.27.8.tgz",
@@ -3554,9 +3560,9 @@
       "dev": true
     },
     "node_modules/@tsconfig/node10": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.9.tgz",
-      "integrity": "sha512-jNsYVVxU8v5g43Erja32laIDHXeoNvFEpX33OK4d6hljo3jDhCBDhx5dhCCTMWUojscpAagGiRkBKxpdl9fxqA==",
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.11.tgz",
+      "integrity": "sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==",
       "dev": true
     },
     "node_modules/@tsconfig/node12": {
@@ -3584,11 +3590,21 @@
       "dev": true
     },
     "node_modules/@types/chai": {
-      "version": "4.3.11",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.3.11.tgz",
-      "integrity": "sha512-qQR1dr2rGIHYlJulmr8Ioq3De0Le9E4MJ5AiaeAETJJpndT1uUNHsGFK3L/UIu+rbkQSdj8J/w2bCsBZc/Y5fQ==",
+      "version": "4.3.17",
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.3.17.tgz",
+      "integrity": "sha512-zmZ21EWzR71B4Sscphjief5djsLre50M6lI622OSySTmn9DB3j+C3kWroHfBQWXbOBwbgg/M8CG/hUxDLIloow==",
       "dev": true
     },
+    "node_modules/@types/conventional-commits-parser": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@types/conventional-commits-parser/-/conventional-commits-parser-5.0.0.tgz",
+      "integrity": "sha512-loB369iXNmAZglwWATL+WRe+CRMmmBPtpolYzIebFaX4YA3x+BEfLqhUAV9WanycKI3TG1IMr5bMJDajDKLlUQ==",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "@types/node": "*"
+      }
+    },
     "node_modules/@types/estree": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz",
@@ -3614,12 +3630,12 @@
       "dev": true
     },
     "node_modules/@types/node": {
-      "version": "20.10.2",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.10.2.tgz",
-      "integrity": "sha512-37MXfxkb0vuIlRKHNxwCkb60PNBpR94u4efQuN4JgIAm66zfCDXGSAFCef9XUWFovX2R1ok6Z7MHhtdVXXkkIw==",
+      "version": "22.1.0",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-22.1.0.tgz",
+      "integrity": "sha512-AOmuRF0R2/5j1knA3c6G3HOk523Ga+l+ZXltX8SF1+5oqcXijjfTd8fY3XRZqSihEu9XhtQnKYLmkFaoxgsJHw==",
       "dev": true,
       "dependencies": {
-        "undici-types": "~5.26.4"
+        "undici-types": "~6.13.0"
       }
     },
     "node_modules/@types/parse-json": {
@@ -3629,18 +3645,19 @@
       "dev": true
     },
     "node_modules/@types/selenium-webdriver": {
-      "version": "4.1.20",
-      "resolved": "https://registry.npmjs.org/@types/selenium-webdriver/-/selenium-webdriver-4.1.20.tgz",
-      "integrity": "sha512-WxzARWDZVTbXlJgwYGhNoiV4OuHDabctSQmK5V88LqjW9TJiLETcknxRZ2xB1toecQnu0T2jt1pPXnSYkaWYiw==",
+      "version": "4.1.24",
+      "resolved": "https://registry.npmjs.org/@types/selenium-webdriver/-/selenium-webdriver-4.1.24.tgz",
+      "integrity": "sha512-oR5MVATv+P2dmhceZJPDm99MmOC9yAK8YpIgJbHEFQ/MbSPC1lA6Ohw441WNUcQ6B1fMAOMu0u59fRKKj9AGGg==",
       "dev": true,
       "dependencies": {
+        "@types/node": "*",
         "@types/ws": "*"
       }
     },
     "node_modules/@types/semver": {
-      "version": "7.5.6",
-      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.6.tgz",
-      "integrity": "sha512-dn1l8LaMea/IjDoHNd9J52uBbInB796CDffS6VdIxvqYCPSG0V0DzHp76GpaWnlhg88uYyPbXCDIowa86ybd5A==",
+      "version": "7.5.8",
+      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.8.tgz",
+      "integrity": "sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==",
       "dev": true
     },
     "node_modules/@types/tabbable": {
@@ -3650,9 +3667,9 @@
       "dev": true
     },
     "node_modules/@types/ws": {
-      "version": "8.5.10",
-      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.10.tgz",
-      "integrity": "sha512-vmQSUcfalpIq0R9q7uTo2lXs6eGIpt9wtnLdMv9LVpIjCA/+ufZRozlVoVelIYixx1ugCBKDhn89vnsEGOCx9A==",
+      "version": "8.5.12",
+      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.12.tgz",
+      "integrity": "sha512-3tPRkv1EtkDpzlgyKyI8pGsGZAGPEaXeu0DOj5DI25Ja91bdAYddYHbADRYVrZMRbfW+1l5YwXVDKohDJNQxkQ==",
       "dev": true,
       "dependencies": {
         "@types/node": "*"
@@ -3702,26 +3719,11 @@
         }
       }
     },
-    "node_modules/@typescript-eslint/eslint-plugin/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/@typescript-eslint/eslint-plugin/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -3729,12 +3731,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/@typescript-eslint/eslint-plugin/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/@typescript-eslint/parser": {
       "version": "5.62.0",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.62.0.tgz",
@@ -3846,26 +3842,11 @@
         }
       }
     },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -3873,12 +3854,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/@typescript-eslint/utils": {
       "version": "5.62.0",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.62.0.tgz",
@@ -3905,26 +3880,11 @@
         "eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
       }
     },
-    "node_modules/@typescript-eslint/utils/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/@typescript-eslint/utils/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -3932,12 +3892,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/@typescript-eslint/utils/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/@typescript-eslint/visitor-keys": {
       "version": "5.62.0",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.62.0.tgz",
@@ -3962,9 +3916,9 @@
       "dev": true
     },
     "node_modules/@vitejs/plugin-vue": {
-      "version": "4.5.1",
-      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.5.1.tgz",
-      "integrity": "sha512-DaUzYFr+2UGDG7VSSdShKa9sIWYBa1LL8KC0MNOf2H5LjcTPjob0x8LbkqXWmAtbANJCkpiQTj66UVcQkN2s3g==",
+      "version": "4.6.2",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.6.2.tgz",
+      "integrity": "sha512-kqf7SGFoG+80aZG6Pf+gsZIVvGSCKE98JbiWqcCV9cThtg91Jav0yvYFC9Zb+jKetNGF6ZKeoaxgZfND21fWKw==",
       "dev": true,
       "engines": {
         "node": "^14.18.0 || >=16.0.0"
@@ -3975,13 +3929,13 @@
       }
     },
     "node_modules/@vitest/expect": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-1.1.1.tgz",
-      "integrity": "sha512-Qpw01C2Hyb3085jBkOJLQ7HRX0Ncnh2qV4p+xWmmhcIUlMykUF69zsnZ1vPmAjZpomw9+5tWEGOQ0GTfR8U+kA==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-1.6.0.tgz",
+      "integrity": "sha512-ixEvFVQjycy/oNgHjqsL6AZCDduC+tflRluaHIzKIsdbzkLn2U/iBnVeJwB6HsIjQBdfMR8Z0tRxKUsvFJEeWQ==",
       "dev": true,
       "dependencies": {
-        "@vitest/spy": "1.1.1",
-        "@vitest/utils": "1.1.1",
+        "@vitest/spy": "1.6.0",
+        "@vitest/utils": "1.6.0",
         "chai": "^4.3.10"
       },
       "funding": {
@@ -3989,12 +3943,12 @@
       }
     },
     "node_modules/@vitest/runner": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-1.1.1.tgz",
-      "integrity": "sha512-8HokyJo1SnSi3uPFKfWm/Oq1qDwLC4QDcVsqpXIXwsRPAg3gIDh8EbZ1ri8cmQkBxdOu62aOF9B4xcqJhvt4xQ==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-1.6.0.tgz",
+      "integrity": "sha512-P4xgwPjwesuBiHisAVz/LSSZtDjOTPYZVmNAnpHHSR6ONrf8eCJOFRvUwdHn30F5M1fxhqtl7QZQUk2dprIXAg==",
       "dev": true,
       "dependencies": {
-        "@vitest/utils": "1.1.1",
+        "@vitest/utils": "1.6.0",
         "p-limit": "^5.0.0",
         "pathe": "^1.1.1"
       },
@@ -4018,9 +3972,9 @@
       }
     },
     "node_modules/@vitest/runner/node_modules/yocto-queue": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.0.0.tgz",
-      "integrity": "sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.1.1.tgz",
+      "integrity": "sha512-b4JR1PFR10y1mKjhHY9LaGo6tmrgjit7hxVIeAmyMw3jegXR4dhYqLaQF5zMXZxY7tLpMyJeLjr1C4rLmkVe8g==",
       "dev": true,
       "engines": {
         "node": ">=12.20"
@@ -4030,9 +3984,9 @@
       }
     },
     "node_modules/@vitest/snapshot": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-1.1.1.tgz",
-      "integrity": "sha512-WnMHjv4VdHLbFGgCdVVvyRkRPnOKN75JJg+LLTdr6ah7YnL75W+7CTIMdzPEPzaDxA8r5yvSVlc1d8lH3yE28w==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-1.6.0.tgz",
+      "integrity": "sha512-+Hx43f8Chus+DCmygqqfetcAZrDJwvTj0ymqjQq4CvmpKFSTVteEOBzCusu1x2tt4OJcvBflyHUE0DZSLgEMtQ==",
       "dev": true,
       "dependencies": {
         "magic-string": "^0.30.5",
@@ -4044,9 +3998,9 @@
       }
     },
     "node_modules/@vitest/spy": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-1.1.1.tgz",
-      "integrity": "sha512-hDU2KkOTfFp4WFFPWwHFauddwcKuGQ7gF6Un/ZZkCogoAiTMN7/7YKvUDbywPZZ754iCQGjdUmXN3t4k0jm1IQ==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-1.6.0.tgz",
+      "integrity": "sha512-leUTap6B/cqi/bQkXUu6bQV5TZPx7pmMBKBQiI0rJA8c3pB56ZsaTbREnF7CJfmvAS4V2cXIBAh/3rVwrrCYgw==",
       "dev": true,
       "dependencies": {
         "tinyspy": "^2.2.0"
@@ -4056,12 +4010,13 @@
       }
     },
     "node_modules/@vitest/utils": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-1.1.1.tgz",
-      "integrity": "sha512-E9LedH093vST/JuBSyHLFMpxJKW3dLhe/flUSPFedoyj4wKiFX7Jm8gYLtOIiin59dgrssfmFv0BJ1u8P/LC/A==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-1.6.0.tgz",
+      "integrity": "sha512-21cPiuGMoMZwiOHa2i4LXkMkMkCGzA+MVFV70jRwHo95dL4x/ts5GZhML1QWuy7yfp3WzK3lRvZi3JnXTYqrBw==",
       "dev": true,
       "dependencies": {
         "diff-sequences": "^29.6.3",
+        "estree-walker": "^3.0.3",
         "loupe": "^2.3.7",
         "pretty-format": "^29.7.0"
       },
@@ -4069,13 +4024,13 @@
         "url": "https://opencollective.com/vitest"
       }
     },
-    "node_modules/@vitest/utils/node_modules/loupe": {
-      "version": "2.3.7",
-      "resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.7.tgz",
-      "integrity": "sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==",
+    "node_modules/@vitest/utils/node_modules/estree-walker": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz",
+      "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
       "dev": true,
       "dependencies": {
-        "get-func-name": "^2.0.1"
+        "@types/estree": "^1.0.0"
       }
     },
     "node_modules/@volar/language-core": {
@@ -4097,65 +4052,102 @@
       }
     },
     "node_modules/@volar/typescript": {
-      "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-1.11.1.tgz",
-      "integrity": "sha512-iU+t2mas/4lYierSnoFOeRFQUhAEMgsFuQxoxvwn5EdQopw43j+J27a4lt9LMInx1gLJBC6qL14WYGlgymaSMQ==",
+      "version": "2.4.0-alpha.18",
+      "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-2.4.0-alpha.18.tgz",
+      "integrity": "sha512-sXh5Y8sqGUkgxpMWUGvRXggxYHAVxg0Pa1C42lQZuPDrW6vHJPR0VCK8Sr7WJsAW530HuNQT/ZIskmXtxjybMQ==",
       "dev": true,
       "dependencies": {
-        "@volar/language-core": "1.11.1",
-        "path-browserify": "^1.0.1"
+        "@volar/language-core": "2.4.0-alpha.18",
+        "path-browserify": "^1.0.1",
+        "vscode-uri": "^3.0.8"
+      }
+    },
+    "node_modules/@volar/typescript/node_modules/@volar/language-core": {
+      "version": "2.4.0-alpha.18",
+      "resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-2.4.0-alpha.18.tgz",
+      "integrity": "sha512-JAYeJvYQQROmVRtSBIczaPjP3DX4QW1fOqW1Ebs0d3Y3EwSNRglz03dSv0Dm61dzd0Yx3WgTW3hndDnTQqgmyg==",
+      "dev": true,
+      "dependencies": {
+        "@volar/source-map": "2.4.0-alpha.18"
       }
     },
+    "node_modules/@volar/typescript/node_modules/@volar/source-map": {
+      "version": "2.4.0-alpha.18",
+      "resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-2.4.0-alpha.18.tgz",
+      "integrity": "sha512-MTeCV9MUwwsH0sNFiZwKtFrrVZUK6p8ioZs3xFzHc2cvDXHWlYN3bChdQtwKX+FY2HG6H3CfAu1pKijolzIQ8g==",
+      "dev": true
+    },
     "node_modules/@vue/compiler-core": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.3.9.tgz",
-      "integrity": "sha512-+/Lf68Vr/nFBA6ol4xOtJrW+BQWv3QWKfRwGSm70jtXwfhZNF4R/eRgyVJYoxFRhdCTk/F6g99BP0ffPgZihfQ==",
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.35.tgz",
+      "integrity": "sha512-gKp0zGoLnMYtw4uS/SJRRO7rsVggLjvot3mcctlMXunYNsX+aRJDqqw/lV5/gHK91nvaAAlWFgdVl020AW1Prg==",
       "dependencies": {
-        "@babel/parser": "^7.23.3",
-        "@vue/shared": "3.3.9",
+        "@babel/parser": "^7.24.7",
+        "@vue/shared": "3.4.35",
+        "entities": "^4.5.0",
         "estree-walker": "^2.0.2",
-        "source-map-js": "^1.0.2"
+        "source-map-js": "^1.2.0"
+      }
+    },
+    "node_modules/@vue/compiler-core/node_modules/entities": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+      "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
       }
     },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.3.9.tgz",
-      "integrity": "sha512-nfWubTtLXuT4iBeDSZ5J3m218MjOy42Vp2pmKVuBKo2/BLcrFUX8nCSr/bKRFiJ32R8qbdnnnBgRn9AdU5v0Sg==",
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.35.tgz",
+      "integrity": "sha512-pWIZRL76/oE/VMhdv/ovZfmuooEni6JPG1BFe7oLk5DZRo/ImydXijoZl/4kh2406boRQ7lxTYzbZEEXEhj9NQ==",
       "dependencies": {
-        "@vue/compiler-core": "3.3.9",
-        "@vue/shared": "3.3.9"
+        "@vue/compiler-core": "3.4.35",
+        "@vue/shared": "3.4.35"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.3.9.tgz",
-      "integrity": "sha512-wy0CNc8z4ihoDzjASCOCsQuzW0A/HP27+0MDSSICMjVIFzk/rFViezkR3dzH+miS2NDEz8ywMdbjO5ylhOLI2A==",
-      "dependencies": {
-        "@babel/parser": "^7.23.3",
-        "@vue/compiler-core": "3.3.9",
-        "@vue/compiler-dom": "3.3.9",
-        "@vue/compiler-ssr": "3.3.9",
-        "@vue/reactivity-transform": "3.3.9",
-        "@vue/shared": "3.3.9",
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.35.tgz",
+      "integrity": "sha512-xacnRS/h/FCsjsMfxBkzjoNxyxEyKyZfBch/P4vkLRvYJwe5ChXmZZrj8Dsed/752H2Q3JE8kYu9Uyha9J6PgA==",
+      "dependencies": {
+        "@babel/parser": "^7.24.7",
+        "@vue/compiler-core": "3.4.35",
+        "@vue/compiler-dom": "3.4.35",
+        "@vue/compiler-ssr": "3.4.35",
+        "@vue/shared": "3.4.35",
         "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.5",
-        "postcss": "^8.4.31",
-        "source-map-js": "^1.0.2"
+        "magic-string": "^0.30.10",
+        "postcss": "^8.4.40",
+        "source-map-js": "^1.2.0"
       }
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.3.9.tgz",
-      "integrity": "sha512-NO5oobAw78R0G4SODY5A502MGnDNiDjf6qvhn7zD7TJGc8XDeIEw4fg6JU705jZ/YhuokBKz0A5a/FL/XZU73g==",
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.35.tgz",
+      "integrity": "sha512-7iynB+0KB1AAJKk/biENTV5cRGHRdbdaD7Mx3nWcm1W8bVD6QmnH3B4AHhQQ1qZHhqFwzEzMwiytXm3PX1e60A==",
+      "dependencies": {
+        "@vue/compiler-dom": "3.4.35",
+        "@vue/shared": "3.4.35"
+      }
+    },
+    "node_modules/@vue/compiler-vue2": {
+      "version": "2.7.16",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-vue2/-/compiler-vue2-2.7.16.tgz",
+      "integrity": "sha512-qYC3Psj9S/mfu9uVi5WvNZIzq+xnXMhOwbTFKKDD7b1lhpnn71jXSFdTQ+WsIEk0ONCd7VV2IMm7ONl6tbQ86A==",
+      "dev": true,
       "dependencies": {
-        "@vue/compiler-dom": "3.3.9",
-        "@vue/shared": "3.3.9"
+        "de-indent": "^1.0.2",
+        "he": "^1.2.0"
       }
     },
     "node_modules/@vue/devtools-api": {
-      "version": "6.5.1",
-      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.1.tgz",
-      "integrity": "sha512-+KpckaAQyfbvshdDW5xQylLni1asvNSGme1JFs8I1+/H5pHEhqUKMEQD/qn3Nx5+/nycBq11qAEi8lk+LXI2dA==",
+      "version": "6.6.3",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.3.tgz",
+      "integrity": "sha512-0MiMsFma/HqA6g3KLKn+AGpL1kgKhFWszC9U29NfpWK5LE7bjeXxySWJrOJ77hBz+TBrBQ7o4QJqbPbqbs8rJw==",
       "dev": true
     },
     "node_modules/@vue/eslint-config-typescript": {
@@ -4183,9 +4175,9 @@
       }
     },
     "node_modules/@vue/language-core": {
-      "version": "1.8.24",
-      "resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-1.8.24.tgz",
-      "integrity": "sha512-2ClHvij0WlsDWryPzXJCSpPc6rusZFNoVtRZGgGGkKCmKuIREDDKmH8j+1tYyxPYyH0qL6pZ6+IHD8KIm5nWAw==",
+      "version": "1.8.27",
+      "resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-1.8.27.tgz",
+      "integrity": "sha512-L8Kc27VdQserNaCUNiSFdDl9LWT24ly8Hpwf1ECy3aFb9m6bDhBGQYOujDm21N7EW3moKIOKEanQwe1q5BK+mA==",
       "dev": true,
       "dependencies": {
         "@volar/language-core": "~1.11.1",
@@ -4217,9 +4209,9 @@
       }
     },
     "node_modules/@vue/language-core/node_modules/minimatch": {
-      "version": "9.0.3",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
-      "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
       "dependencies": {
         "brace-expansion": "^2.0.1"
@@ -4232,82 +4224,62 @@
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.3.9.tgz",
-      "integrity": "sha512-VmpIqlNp+aYDg2X0xQhJqHx9YguOmz2UxuUJDckBdQCNkipJvfk9yA75woLWElCa0Jtyec3lAAt49GO0izsphw==",
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.35.tgz",
+      "integrity": "sha512-Ggtz7ZZHakriKioveJtPlStYardwQH6VCs9V13/4qjHSQb/teE30LVJNrbBVs4+aoYGtTQKJbTe4CWGxVZrvEw==",
       "peer": true,
       "dependencies": {
-        "@vue/shared": "3.3.9"
-      }
-    },
-    "node_modules/@vue/reactivity-transform": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.3.9.tgz",
-      "integrity": "sha512-HnUFm7Ry6dFa4Lp63DAxTixUp8opMtQr6RxQCpDI1vlh12rkGIeYqMvJtK+IKyEfEOa2I9oCkD1mmsPdaGpdVg==",
-      "dependencies": {
-        "@babel/parser": "^7.23.3",
-        "@vue/compiler-core": "3.3.9",
-        "@vue/shared": "3.3.9",
-        "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.5"
+        "@vue/shared": "3.4.35"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.3.9.tgz",
-      "integrity": "sha512-xxaG9KvPm3GTRuM4ZyU8Tc+pMVzcu6eeoSRQJ9IE7NmCcClW6z4B3Ij6L4EDl80sxe/arTtQ6YmgiO4UZqRc+w==",
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.35.tgz",
+      "integrity": "sha512-D+BAjFoWwT5wtITpSxwqfWZiBClhBbR+bm0VQlWYFOadUUXFo+5wbe9ErXhLvwguPiLZdEF13QAWi2vP3ZD5tA==",
       "peer": true,
       "dependencies": {
-        "@vue/reactivity": "3.3.9",
-        "@vue/shared": "3.3.9"
+        "@vue/reactivity": "3.4.35",
+        "@vue/shared": "3.4.35"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.3.9.tgz",
-      "integrity": "sha512-e7LIfcxYSWbV6BK1wQv9qJyxprC75EvSqF/kQKe6bdZEDNValzeRXEVgiX7AHI6hZ59HA4h7WT5CGvm69vzJTQ==",
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.35.tgz",
+      "integrity": "sha512-yGOlbos+MVhlS5NWBF2HDNgblG8e2MY3+GigHEyR/dREAluvI5tuUUgie3/9XeqhPE4LF0i2wjlduh5thnfOqw==",
       "peer": true,
       "dependencies": {
-        "@vue/runtime-core": "3.3.9",
-        "@vue/shared": "3.3.9",
-        "csstype": "^3.1.2"
+        "@vue/reactivity": "3.4.35",
+        "@vue/runtime-core": "3.4.35",
+        "@vue/shared": "3.4.35",
+        "csstype": "^3.1.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.3.9.tgz",
-      "integrity": "sha512-w0zT/s5l3Oa3ZjtLW88eO4uV6AQFqU8X5GOgzq7SkQQu6vVr+8tfm+OI2kDBplS/W/XgCBuFXiPw6T5EdwXP0A==",
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.35.tgz",
+      "integrity": "sha512-iZ0e/u9mRE4T8tNhlo0tbA+gzVkgv8r5BX6s1kRbOZqfpq14qoIvCZ5gIgraOmYkMYrSEZgkkojFPr+Nyq/Mnw==",
       "peer": true,
       "dependencies": {
-        "@vue/compiler-ssr": "3.3.9",
-        "@vue/shared": "3.3.9"
+        "@vue/compiler-ssr": "3.4.35",
+        "@vue/shared": "3.4.35"
       },
       "peerDependencies": {
-        "vue": "3.3.9"
+        "vue": "3.4.35"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.3.9.tgz",
-      "integrity": "sha512-ZE0VTIR0LmYgeyhurPTpy4KzKsuDyQbMSdM49eKkMnT5X4VfFBLysMzjIZhLEFQYjjOVVfbvUDHckwjDFiO2eA=="
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.35.tgz",
+      "integrity": "sha512-hvuhBYYDe+b1G8KHxsQ0diDqDMA8D9laxWZhNAjE83VZb5UDaXl9Xnz7cGdDSyiHM90qqI/CyGMcpBpiDy6VVQ=="
     },
     "node_modules/@vue/test-utils": {
-      "version": "2.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/test-utils/-/test-utils-2.4.3.tgz",
-      "integrity": "sha512-F4K7mF+ad++VlTrxMJVRnenKSJmO6fkQt2wpRDiKDesQMkfpniGWsqEi/JevxGBo2qEkwwjvTUAoiGJLNx++CA==",
+      "version": "2.4.6",
+      "resolved": "https://registry.npmjs.org/@vue/test-utils/-/test-utils-2.4.6.tgz",
+      "integrity": "sha512-FMxEjOpYNYiFe0GkaHsnJPXFHxQ6m4t8vI/ElPGpMWxZKpmRvQ33OIrvRXemy6yha03RxhOlQuy+gZMC3CQSow==",
       "dev": true,
       "dependencies": {
         "js-beautify": "^1.14.9",
-        "vue-component-type-helpers": "^1.8.21"
-      },
-      "peerDependencies": {
-        "@vue/server-renderer": "^3.0.1",
-        "vue": "^3.0.1"
-      },
-      "peerDependenciesMeta": {
-        "@vue/server-renderer": {
-          "optional": true
-        }
+        "vue-component-type-helpers": "^2.0.0"
       }
     },
     "node_modules/abab": {
@@ -4327,9 +4299,9 @@
       }
     },
     "node_modules/acorn": {
-      "version": "8.11.2",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.2.tgz",
-      "integrity": "sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==",
+      "version": "8.12.1",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz",
+      "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==",
       "dev": true,
       "bin": {
         "acorn": "bin/acorn"
@@ -4391,15 +4363,15 @@
       }
     },
     "node_modules/ajv": {
-      "version": "8.12.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.12.0.tgz",
-      "integrity": "sha512-sRu1kpcO9yLtYxBKvqfTeh9KzZEwO3STyX1HT+4CaDzC6HpTGYhIhPIzj9XuKU7KYDwnaeh5hcOwjy1QuJzBPA==",
+      "version": "8.17.1",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
+      "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
       "dev": true,
       "dependencies": {
-        "fast-deep-equal": "^3.1.1",
+        "fast-deep-equal": "^3.1.3",
+        "fast-uri": "^3.0.1",
         "json-schema-traverse": "^1.0.0",
-        "require-from-string": "^2.0.2",
-        "uri-js": "^4.2.2"
+        "require-from-string": "^2.0.2"
       },
       "funding": {
         "type": "github",
@@ -4588,28 +4560,32 @@
       }
     },
     "node_modules/array-buffer-byte-length": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.0.tgz",
-      "integrity": "sha512-LPuwb2P+NrQw3XhxGc36+XSvuBPopovXYTR9Ew++Du9Yb/bx5AzBfrIsBoj0EZUifjQU+sHL21sseZ3jerWO/A==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz",
+      "integrity": "sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "is-array-buffer": "^3.0.1"
+        "call-bind": "^1.0.5",
+        "is-array-buffer": "^3.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/array-includes": {
-      "version": "3.1.7",
-      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.7.tgz",
-      "integrity": "sha512-dlcsNBIiWhPkHdOEEKnehA+RNUWDc4UqFtnIXU4uuYDPtA4LDkr7qip2p0VvFAEXNDr0yWZ9PJyIRiGjRLQzwQ==",
+      "version": "3.1.8",
+      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.8.tgz",
+      "integrity": "sha512-itaWrbYbqpGXkGhZPGUulwnhVf5Hpy1xiCFsGqyIGglbBxmG5vSjxQen3/WGOjPpNEv1RtBLKxbmVXm8HpJStQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1",
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.4",
         "is-string": "^1.0.7"
       },
       "engines": {
@@ -4629,16 +4605,17 @@
       }
     },
     "node_modules/array.prototype.findlastindex": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.3.tgz",
-      "integrity": "sha512-LzLoiOMAxvy+Gd3BAq3B7VeIgPdo+Q8hthvKtXybMvRV0jrXfJM/t8mw7nNlpEcVlVUnCnM2KSX4XU5HmpodOA==",
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.5.tgz",
+      "integrity": "sha512-zfETvRFA8o7EiNn++N5f/kaCw221hrpGsDmcpndVupkPzEc1Wuf3VgC0qby1BbHs7f5DVYjgtEU2LLh5bqeGfQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "es-shim-unscopables": "^1.0.0",
-        "get-intrinsic": "^1.2.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "es-shim-unscopables": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -4684,17 +4661,18 @@
       }
     },
     "node_modules/arraybuffer.prototype.slice": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.2.tgz",
-      "integrity": "sha512-yMBKppFur/fbHu9/6USUe03bZ4knMYiwFBcyiaXB8Go0qNehwX6inYPzK9U0NeQvGxKthcmHcaR8P5MStSRBAw==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.3.tgz",
+      "integrity": "sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A==",
       "dev": true,
       "dependencies": {
-        "array-buffer-byte-length": "^1.0.0",
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1",
-        "is-array-buffer": "^3.0.2",
+        "array-buffer-byte-length": "^1.0.1",
+        "call-bind": "^1.0.5",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.22.3",
+        "es-errors": "^1.2.1",
+        "get-intrinsic": "^1.2.3",
+        "is-array-buffer": "^3.0.4",
         "is-shared-array-buffer": "^1.0.2"
       },
       "engines": {
@@ -4711,9 +4689,9 @@
       "dev": true
     },
     "node_modules/assert-never": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/assert-never/-/assert-never-1.2.1.tgz",
-      "integrity": "sha512-TaTivMB6pYI1kXwrFlEhLeGfOqoDNdTxjCdwRfFFkEA30Eu+k48W34nlok2EYWJfFFzqaEmichdNM7th6M5HNw==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/assert-never/-/assert-never-1.3.0.tgz",
+      "integrity": "sha512-9Z3vxQ+berkL/JJo0dK+EY3Lp0s3NtSnP3VCLsh5HDcZPrh0M+KQRK5sWhUeyPPH+/RCxZqOxLMR+YC6vlviEQ==",
       "dev": true
     },
     "node_modules/assertion-error": {
@@ -4726,9 +4704,9 @@
       }
     },
     "node_modules/ast-types": {
-      "version": "0.16.1",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.16.1.tgz",
-      "integrity": "sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==",
+      "version": "0.13.4",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.13.4.tgz",
+      "integrity": "sha512-x1FCFnFifvYDDzTaLII71vG5uvDwgtmDTEVWAxrgeiR8VjMONcCXJx7E+USjDtHlwFmt9MysbqgF9b9Vjr6w+w==",
       "dev": true,
       "dependencies": {
         "tslib": "^2.0.1"
@@ -4768,9 +4746,9 @@
       }
     },
     "node_modules/autoprefixer": {
-      "version": "10.4.16",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz",
-      "integrity": "sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ==",
+      "version": "10.4.20",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.20.tgz",
+      "integrity": "sha512-XY25y5xSv/wEoqzDyXXME4AFfkZI0P23z6Fs3YgymDnKJkCGOnkL0iTxCa85UTqaSgfcqyf3UA6+c7wUvx/16g==",
       "dev": true,
       "funding": [
         {
@@ -4787,11 +4765,11 @@
         }
       ],
       "dependencies": {
-        "browserslist": "^4.21.10",
-        "caniuse-lite": "^1.0.30001538",
-        "fraction.js": "^4.3.6",
+        "browserslist": "^4.23.3",
+        "caniuse-lite": "^1.0.30001646",
+        "fraction.js": "^4.3.7",
         "normalize-range": "^0.1.2",
-        "picocolors": "^1.0.0",
+        "picocolors": "^1.0.1",
         "postcss-value-parser": "^4.2.0"
       },
       "bin": {
@@ -4805,10 +4783,13 @@
       }
     },
     "node_modules/available-typed-arrays": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz",
-      "integrity": "sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
+      "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==",
       "dev": true,
+      "dependencies": {
+        "possible-typed-array-names": "^1.0.0"
+      },
       "engines": {
         "node": ">= 0.4"
       },
@@ -4817,21 +4798,21 @@
       }
     },
     "node_modules/axe-core": {
-      "version": "4.8.2",
-      "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.8.2.tgz",
-      "integrity": "sha512-/dlp0fxyM3R8YW7MFzaHWXrf4zzbr0vaYb23VBFCl83R7nWNPg/yaQw2Dc8jzCMmDVLhSdzH8MjrsuIUuvX+6g==",
+      "version": "4.10.0",
+      "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.10.0.tgz",
+      "integrity": "sha512-Mr2ZakwQ7XUAjp7pAwQWRhhK8mQQ6JAaNWSjmjxil0R8BPioMtQsTLOolGYkji1rcL++3dCqZA3zWqpT+9Ew6g==",
       "dev": true,
       "engines": {
         "node": ">=4"
       }
     },
     "node_modules/axios": {
-      "version": "1.6.7",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.7.tgz",
-      "integrity": "sha512-/hDJGff6/c7u0hDkvkGxR/oy6CbCs8ziCsC7SqmhjfozqiJGc8Z11wrv9z9lYfY4K8l+H9TpjcMDX0xOZmx+RA==",
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.3.tgz",
+      "integrity": "sha512-Ar7ND9pU99eJ9GpoGQKhKf58GpUOgnzuaB7ueNQ5BMi0p+LZ5oaEnfF999fAArcTIBwXTCHAmGcHOZJaWPq9Nw==",
       "dev": true,
       "dependencies": {
-        "follow-redirects": "^1.15.4",
+        "follow-redirects": "^1.15.6",
         "form-data": "^4.0.0",
         "proxy-from-env": "^1.1.0"
       }
@@ -4843,13 +4824,13 @@
       "dev": true
     },
     "node_modules/babel-plugin-polyfill-corejs2": {
-      "version": "0.4.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.6.tgz",
-      "integrity": "sha512-jhHiWVZIlnPbEUKSSNb9YoWcQGdlTLq7z1GHL4AjFxaoOUMuuEVJ+Y4pAaQUGOGk93YsVCKPbqbfw3m0SM6H8Q==",
+      "version": "0.4.11",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.11.tgz",
+      "integrity": "sha512-sMEJ27L0gRHShOh5G54uAAPaiCOygY/5ratXuiyb2G46FmlSpc9eFCzYVyDiPxfNbwzA7mYahmjQc5q+CZQ09Q==",
       "dev": true,
       "dependencies": {
         "@babel/compat-data": "^7.22.6",
-        "@babel/helper-define-polyfill-provider": "^0.4.3",
+        "@babel/helper-define-polyfill-provider": "^0.6.2",
         "semver": "^6.3.1"
       },
       "peerDependencies": {
@@ -4857,25 +4838,25 @@
       }
     },
     "node_modules/babel-plugin-polyfill-corejs3": {
-      "version": "0.8.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.8.6.tgz",
-      "integrity": "sha512-leDIc4l4tUgU7str5BWLS2h8q2N4Nf6lGZP6UrNDxdtfF2g69eJ5L0H7S8A5Ln/arfFAfHor5InAdZuIOwZdgQ==",
+      "version": "0.10.6",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.10.6.tgz",
+      "integrity": "sha512-b37+KR2i/khY5sKmWNVQAnitvquQbNdWy6lJdsr0kmquCKEEUgMKK4SboVM3HtfnZilfjr4MMQ7vY58FVWDtIA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.4.3",
-        "core-js-compat": "^3.33.1"
+        "@babel/helper-define-polyfill-provider": "^0.6.2",
+        "core-js-compat": "^3.38.0"
       },
       "peerDependencies": {
         "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
       }
     },
     "node_modules/babel-plugin-polyfill-regenerator": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.5.3.tgz",
-      "integrity": "sha512-8sHeDOmXC8csczMrYEOf0UTNa4yE2SxV5JGeT/LP1n0OYVDUUFPxG9vdk2AlDlIit4t+Kf0xCtpgXPBwnn/9pw==",
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.6.2.tgz",
+      "integrity": "sha512-2R25rQZWP63nGwaAswvDazbPXfrM3HwVoBXK6HcqeKrSrL/JqcC/rDcf95l4r7LXLyxDXc8uQDa064GubtCABg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.4.3"
+        "@babel/helper-define-polyfill-provider": "^0.6.2"
       },
       "peerDependencies": {
         "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
@@ -4900,9 +4881,9 @@
       "dev": true
     },
     "node_modules/bare-events": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.3.1.tgz",
-      "integrity": "sha512-sJnSOTVESURZ61XgEleqmP255T6zTYwHPwE4r6SssIh0U9/uDvfpdoJYpVUerJJZH2fueO+CdT8ZT+OC/7aZDA==",
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.4.2.tgz",
+      "integrity": "sha512-qMKFd2qG/36aA4GwvKq8MxnPgCQAmBWmSyLWsJcbn8v03wvIPQ/hG1Ms8bPzndZxMDoHpxez5VOS+gC9Yi24/Q==",
       "dev": true,
       "optional": true
     },
@@ -4919,9 +4900,9 @@
       }
     },
     "node_modules/bare-os": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-2.3.0.tgz",
-      "integrity": "sha512-oPb8oMM1xZbhRQBngTgpcQ5gXw6kjOaRsSWsIeNyRxGed2w/ARyP7ScBYpWR1qfX2E5rS3gBw6OWcSQo+s+kUg==",
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-2.4.0.tgz",
+      "integrity": "sha512-v8DTT08AS/G0F9xrhyLtepoo9EJBJ85FRSMbu1pQUlAf6A8T0tEEQGMVObWeqpjhSPXsE0VGlluFBJu2fdoTNg==",
       "dev": true,
       "optional": true
     },
@@ -4936,9 +4917,9 @@
       }
     },
     "node_modules/bare-stream": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/bare-stream/-/bare-stream-2.0.1.tgz",
-      "integrity": "sha512-ubLyoDqPnUf5o0kSFp709HC0WRZuxVuh4pbte5eY95Xvx5bdvz07c2JFmXBfqqe60q+9PJ8S4X5GRvmcNSKMxg==",
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/bare-stream/-/bare-stream-2.1.3.tgz",
+      "integrity": "sha512-tiDAH9H/kP+tvNO5sczyn9ZAA7utrSMobyDchsnyyXBuUe2FSQWbxhtuHB8jwpHYYevVo2UJpcmvvjrbHboUUQ==",
       "dev": true,
       "optional": true,
       "dependencies": {
@@ -4975,12 +4956,15 @@
       }
     },
     "node_modules/binary-extensions": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
-      "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
+      "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
       "dev": true,
       "engines": {
         "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/bl": {
@@ -5062,12 +5046,12 @@
       }
     },
     "node_modules/braces": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
-      "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
+      "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
       "dev": true,
       "dependencies": {
-        "fill-range": "^7.0.1"
+        "fill-range": "^7.1.1"
       },
       "engines": {
         "node": ">=8"
@@ -5086,9 +5070,9 @@
       "dev": true
     },
     "node_modules/browserslist": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.1.tgz",
-      "integrity": "sha512-FEVc202+2iuClEhZhrWy6ZiAcRLvNMyYcxZ8raemul1DYVOVdFsbqckWLdsixQZCpJlwe77Z3UTalE7jsjnKfQ==",
+      "version": "4.23.3",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.3.tgz",
+      "integrity": "sha512-btwCFJVjI4YWDNfau8RhZ+B1Q/VLoUITrm3RlP6y1tYGWIOa+InuYiRGXUBXo8nA1qKmHMyLB/iVQg5TT4eFoA==",
       "dev": true,
       "funding": [
         {
@@ -5105,10 +5089,10 @@
         }
       ],
       "dependencies": {
-        "caniuse-lite": "^1.0.30001541",
-        "electron-to-chromium": "^1.4.535",
-        "node-releases": "^2.0.13",
-        "update-browserslist-db": "^1.0.13"
+        "caniuse-lite": "^1.0.30001646",
+        "electron-to-chromium": "^1.5.4",
+        "node-releases": "^2.0.18",
+        "update-browserslist-db": "^1.1.0"
       },
       "bin": {
         "browserslist": "cli.js"
@@ -5195,14 +5179,19 @@
       }
     },
     "node_modules/call-bind": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.5.tgz",
-      "integrity": "sha512-C3nQxfFZxFRVoJoGKKI8y3MOEo129NQ+FgQ08iye+Mk4zNZZGdjfs06bVTr+DBSlA66Q2VEcMki/cUCP4SercQ==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz",
+      "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==",
       "dev": true,
       "dependencies": {
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
         "function-bind": "^1.1.2",
-        "get-intrinsic": "^1.2.1",
-        "set-function-length": "^1.1.1"
+        "get-intrinsic": "^1.2.4",
+        "set-function-length": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -5230,9 +5219,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001565",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001565.tgz",
-      "integrity": "sha512-xrE//a3O7TP0vaJ8ikzkD2c2NgcVUvsEe2IvFTntV4Yd1Z9FVzh+gW+enX96L0psrbaFMcVcH2l90xNuGDWc8w==",
+      "version": "1.0.30001649",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001649.tgz",
+      "integrity": "sha512-fJegqZZ0ZX8HOWr6rcafGr72+xcgJKI9oWfDW5DrD7ExUtgZC7a7R7ZYmZqplh7XDocFdGeIFn7roAxhOeYrPQ==",
       "dev": true,
       "funding": [
         {
@@ -5250,9 +5239,9 @@
       ]
     },
     "node_modules/chai": {
-      "version": "4.3.10",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-4.3.10.tgz",
-      "integrity": "sha512-0UXG04VuVbruMUYbJ6JctvH0YnC/4q3/AkT18q4NaITo91CUm0liMS9VqzT9vZhVQ/1eqPanMWjBM+Juhfb/9g==",
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-4.5.0.tgz",
+      "integrity": "sha512-RITGBfijLkBddZvnn8jdqoTypxvqbOLYQkGGxXzeFjVHvudaPw0HNFD9x928/eUwYWd2dPCugVqspGALTZZQKw==",
       "dev": true,
       "dependencies": {
         "assertion-error": "^1.1.0",
@@ -5261,7 +5250,7 @@
         "get-func-name": "^2.0.2",
         "loupe": "^2.3.6",
         "pathval": "^1.1.1",
-        "type-detect": "^4.0.8"
+        "type-detect": "^4.1.0"
       },
       "engines": {
         "node": ">=4"
@@ -5292,9 +5281,9 @@
       }
     },
     "node_modules/chai/node_modules/deep-eql": {
-      "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-4.1.3.tgz",
-      "integrity": "sha512-WaEtAOpRA1MQ0eohqZjpGD8zdI0Ovsm8mmFhaDN8dvDZzyoUMcYDnf5Y6iu7HTXxf8JDS23qWa4a+hKCDyOPzw==",
+      "version": "4.1.4",
+      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-4.1.4.tgz",
+      "integrity": "sha512-SUwdGfqdKOwxCPeVYjwSyRpJ7Z+fhpwIAtmCUdZIWZ/YP5R9WAsyuSgpLVDi9bjWoN2LXHNss/dk3urXtdQxGg==",
       "dev": true,
       "dependencies": {
         "type-detect": "^4.0.0"
@@ -5303,13 +5292,13 @@
         "node": ">=6"
       }
     },
-    "node_modules/chai/node_modules/loupe": {
-      "version": "2.3.7",
-      "resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.7.tgz",
-      "integrity": "sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==",
+    "node_modules/chai/node_modules/type-detect": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.1.0.tgz",
+      "integrity": "sha512-Acylog8/luQ8L7il+geoSxhEkazvkslg7PSNKOX59mbB9cOveP5aq9h74Y7YU8yDpJwetzQQrfIwtf4Wp4LKcw==",
       "dev": true,
-      "dependencies": {
-        "get-func-name": "^2.0.1"
+      "engines": {
+        "node": ">=4"
       }
     },
     "node_modules/chalk": {
@@ -5392,9 +5381,9 @@
       }
     },
     "node_modules/chromedriver": {
-      "version": "126.0.5",
-      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-126.0.5.tgz",
-      "integrity": "sha512-xXVxwxd8CJ6yg2KEvFqLQi7V0RvF78xFnLB+xo9g9MoJNHMQccD7b4OWaxtKDy5RXrMgQ6Jb6vUN3SjTYXHLEQ==",
+      "version": "127.0.1",
+      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-127.0.1.tgz",
+      "integrity": "sha512-j57OWXsxdhwK+faTWA2pi+8hf052qVjZjP0wXnjqY/QglHtlOXWhRj4s7/+ybJRNgs1zQ5csfOyV6sQQdH+Fnw==",
       "dev": true,
       "hasInstallScript": true,
       "dependencies": {
@@ -5414,14 +5403,14 @@
       }
     },
     "node_modules/chromium-bidi": {
-      "version": "0.5.19",
-      "resolved": "https://registry.npmjs.org/chromium-bidi/-/chromium-bidi-0.5.19.tgz",
-      "integrity": "sha512-UA6zL77b7RYCjJkZBsZ0wlvCTD+jTjllZ8f6wdO4buevXgTZYjV+XLB9CiEa2OuuTGGTLnI7eN9I60YxuALGQg==",
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/chromium-bidi/-/chromium-bidi-0.6.3.tgz",
+      "integrity": "sha512-qXlsCmpCZJAnoTYI83Iu6EdYQpMYdVkCfq08KDh2pmlVqK5t5IA9mGs4/LwCwp4fqisSOMXZxP3HIh8w8aRn0A==",
       "dev": true,
       "dependencies": {
         "mitt": "3.0.1",
         "urlpattern-polyfill": "10.0.0",
-        "zod": "3.22.4"
+        "zod": "3.23.8"
       },
       "peerDependencies": {
         "devtools-protocol": "*"
@@ -5470,9 +5459,9 @@
       }
     },
     "node_modules/cli-table3": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/cli-table3/-/cli-table3-0.6.3.tgz",
-      "integrity": "sha512-w5Jac5SykAeZJKntOxJCrm63Eg5/4dhMWIcuTbo9rpE+brgaSZo0RuNJZeOyMgsUdhDeojvgyQLmjI+K50ZGyg==",
+      "version": "0.6.5",
+      "resolved": "https://registry.npmjs.org/cli-table3/-/cli-table3-0.6.5.tgz",
+      "integrity": "sha512-+W/5efTR7y5HRD7gACw9yQjqMVvEMLBHmboM/kPWam+H+Hmyrgjh6YncVKK122YZkXrLudzTuAukUw9FnMf7IQ==",
       "dev": true,
       "dependencies": {
         "string-width": "^4.2.0"
@@ -5554,15 +5543,6 @@
       "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==",
       "dev": true
     },
-    "node_modules/colors": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.2.5.tgz",
-      "integrity": "sha512-erNRLao/Y3Fv54qUa0LBB+//Uf3YwMUmdJinN20yMXm9zdKKqH9wt7R9IIVZ+K7ShzfpLV/Zg8+VyrBJYB4lpg==",
-      "dev": true,
-      "engines": {
-        "node": ">=0.1.90"
-      }
-    },
     "node_modules/combined-stream": {
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
@@ -5670,9 +5650,9 @@
       }
     },
     "node_modules/compare-versions": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-6.1.0.tgz",
-      "integrity": "sha512-LNZQXhqUvqUTotpZ00qLSaify3b4VFD588aRr8MKFw4CMUr98ytzCW5wDH5qx/DEY5kCDXcbcRuCqL0szEf2tg==",
+      "version": "6.1.1",
+      "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-6.1.1.tgz",
+      "integrity": "sha512-4hm4VPpIecmlg59CHXnRDnqGplJFrbLG4aFEl5vl6cK1u76ws3LLvX7ikFnTDl5vo39sjWD6AaDPYodJp/NNHg==",
       "dev": true
     },
     "node_modules/compress-commons": {
@@ -5717,6 +5697,12 @@
       "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
       "dev": true
     },
+    "node_modules/confbox": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.1.7.tgz",
+      "integrity": "sha512-uJcB/FKZtBMCJpK8MQji6bJHgu1tixKPxRLeGkNzBoOZzpnZUJm0jm2/sBDWcuBx1dYgxV4JU+g5hmNxCyAmdA==",
+      "dev": true
+    },
     "node_modules/config-chain": {
       "version": "1.1.13",
       "resolved": "https://registry.npmjs.org/config-chain/-/config-chain-1.1.13.tgz",
@@ -5727,6 +5713,12 @@
         "proto-list": "~1.2.1"
       }
     },
+    "node_modules/config-chain/node_modules/ini": {
+      "version": "1.3.8",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
+      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
+      "dev": true
+    },
     "node_modules/constantinople": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/constantinople/-/constantinople-4.0.1.tgz",
@@ -5750,9 +5742,9 @@
       "dev": true
     },
     "node_modules/core-js": {
-      "version": "3.33.3",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.33.3.tgz",
-      "integrity": "sha512-lo0kOocUlLKmm6kv/FswQL8zbkH7mVsLJ/FULClOhv8WRVmKLVcs6XPNQAzstfeJTCHMyButEwG+z1kHxHoDZw==",
+      "version": "3.38.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.38.0.tgz",
+      "integrity": "sha512-XPpwqEodRljce9KswjZShh95qJ1URisBeKCjUdq27YdenkslVe7OO0ZJhlYXAChW7OhXaRLl8AAba7IBfoIHug==",
       "hasInstallScript": true,
       "peer": true,
       "funding": {
@@ -5761,12 +5753,12 @@
       }
     },
     "node_modules/core-js-compat": {
-      "version": "3.33.3",
-      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.33.3.tgz",
-      "integrity": "sha512-cNzGqFsh3Ot+529GIXacjTJ7kegdt5fPXxCBVS1G0iaZpuo/tBz399ymceLJveQhFFZ8qThHiP3fzuoQjKN2ow==",
+      "version": "3.38.0",
+      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.38.0.tgz",
+      "integrity": "sha512-75LAicdLa4OJVwFxFbQR3NdnZjNgX6ILpVcVzcC4T2smerB5lELMrJQQQoWV6TiuC/vlaFqgU2tKQx9w5s0e0A==",
       "dev": true,
       "dependencies": {
-        "browserslist": "^4.22.1"
+        "browserslist": "^4.23.3"
       },
       "funding": {
         "type": "opencollective",
@@ -5780,16 +5772,15 @@
       "dev": true
     },
     "node_modules/cosmiconfig": {
-      "version": "8.3.6",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.3.6.tgz",
-      "integrity": "sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==",
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
+      "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
       "dev": true,
-      "optional": true,
       "dependencies": {
+        "env-paths": "^2.2.1",
         "import-fresh": "^3.3.0",
         "js-yaml": "^4.1.0",
-        "parse-json": "^5.2.0",
-        "path-type": "^4.0.0"
+        "parse-json": "^5.2.0"
       },
       "engines": {
         "node": ">=14"
@@ -5888,9 +5879,9 @@
       }
     },
     "node_modules/css-functions-list": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/css-functions-list/-/css-functions-list-3.2.1.tgz",
-      "integrity": "sha512-Nj5YcaGgBtuUmn1D7oHqPW0c9iui7xsTsj5lIX8ZgevdfhmjFfKB3r8moHJtNJnctnYXJyYX5I1pp90HM4TPgQ==",
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/css-functions-list/-/css-functions-list-3.2.2.tgz",
+      "integrity": "sha512-c+N0v6wbKVxTu5gOBBFkr9BEdBWaqqjQeiJ8QvSRIJOf+UxlJh930m8e6/WNeODIK0mYLFkoONrnj16i2EcvfQ==",
       "dev": true,
       "engines": {
         "node": ">=12 || >=16"
@@ -6064,6 +6055,57 @@
         "node": ">=10"
       }
     },
+    "node_modules/data-view-buffer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.1.tgz",
+      "integrity": "sha512-0lht7OugA5x3iJLOWFhWK/5ehONdprk0ISXqVFn/NFrDu+cuc8iADFrGQz5BnRK7LLU3JmkbXSxaqX+/mXYtUA==",
+      "dev": true,
+      "dependencies": {
+        "call-bind": "^1.0.6",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/data-view-byte-length": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.1.tgz",
+      "integrity": "sha512-4J7wRJD3ABAzr8wP+OcIcqq2dlUKp4DVflx++hs5h5ZKydWMI6/D/fAot+yh6g2tHh8fLFTvNOaVN357NvSrOQ==",
+      "dev": true,
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/data-view-byte-offset": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.0.tgz",
+      "integrity": "sha512-t/Ygsytq+R995EJ5PZlD4Cu56sWa8InXySaViRzw9apusqsOO2bQP+SbYzAhR0pFKoB+43lYy8rWban9JSuXnA==",
+      "dev": true,
+      "dependencies": {
+        "call-bind": "^1.0.6",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/de-indent": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
@@ -6071,9 +6113,9 @@
       "dev": true
     },
     "node_modules/debug": {
-      "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
-      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "version": "4.3.6",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.6.tgz",
+      "integrity": "sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg==",
       "dev": true,
       "dependencies": {
         "ms": "2.1.2"
@@ -6087,6 +6129,18 @@
         }
       }
     },
+    "node_modules/decamelize": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-4.0.0.tgz",
+      "integrity": "sha512-9iE1PgSik9HeIIw2JO94IidnE3eBoQrFJ3w7sFuzSX4DpmZ3v5sZpUiV5Swcf6mQEF+Y0ru8Neo+p+nyh2J+hQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/decimal.js": {
       "version": "10.4.3",
       "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.4.3.tgz",
@@ -6162,17 +6216,20 @@
       }
     },
     "node_modules/define-data-property": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.1.tgz",
-      "integrity": "sha512-E7uGkTzkk1d0ByLeSc6ZsFS79Axg+m1P/VsgYsxHgiuc3tFSj+MjMIwe90FC4lOAZzNBdY7kkO2P2wKdsQ1vgQ==",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz",
+      "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==",
       "dev": true,
       "dependencies": {
-        "get-intrinsic": "^1.2.1",
-        "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0"
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.0.1"
       },
       "engines": {
         "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/define-lazy-prop": {
@@ -6215,18 +6272,6 @@
         "node": ">= 14"
       }
     },
-    "node_modules/degenerator/node_modules/ast-types": {
-      "version": "0.13.4",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.13.4.tgz",
-      "integrity": "sha512-x1FCFnFifvYDDzTaLII71vG5uvDwgtmDTEVWAxrgeiR8VjMONcCXJx7E+USjDtHlwFmt9MysbqgF9b9Vjr6w+w==",
-      "dev": true,
-      "dependencies": {
-        "tslib": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/delayed-stream": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@@ -6390,18 +6435,6 @@
         "node": ">=14"
       }
     },
-    "node_modules/editorconfig/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/editorconfig/node_modules/minimatch": {
       "version": "9.0.1",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.1.tgz",
@@ -6418,13 +6451,10 @@
       }
     },
     "node_modules/editorconfig/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -6432,16 +6462,10 @@
         "node": ">=10"
       }
     },
-    "node_modules/editorconfig/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/ejs": {
-      "version": "3.1.8",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.8.tgz",
-      "integrity": "sha512-/sXZeMlhS0ArkfX2Aw780gJzXSMPnKjtspYZv+f3NiKLlubezAHDU5+9xz6gd3/NhG3txQCo6xlglmTS+oTGEQ==",
+      "version": "3.1.10",
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.10.tgz",
+      "integrity": "sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==",
       "dev": true,
       "dependencies": {
         "jake": "^10.8.5"
@@ -6454,9 +6478,9 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.4.601",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.601.tgz",
-      "integrity": "sha512-SpwUMDWe9tQu8JX5QCO1+p/hChAi9AE9UpoC3rcHVc+gdCGlbT3SGb5I1klgb952HRIyvt9wZhSz9bNBYz9swA==",
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.4.tgz",
+      "integrity": "sha512-orzA81VqLyIGUEA77YkVA1D+N+nNfl2isJVjjmOyrlxuooZ19ynb+dOlaDTqd/idKRS9lDCSBmtzM+kyCsMnkA==",
       "dev": true
     },
     "node_modules/emoji-regex": {
@@ -6514,50 +6538,57 @@
       }
     },
     "node_modules/es-abstract": {
-      "version": "1.22.3",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.22.3.tgz",
-      "integrity": "sha512-eiiY8HQeYfYH2Con2berK+To6GrK2RxbPawDkGq4UiCQQfZHb6wX9qQqkbpPqaxQFcl8d9QzZqo0tGE0VcrdwA==",
-      "dev": true,
-      "dependencies": {
-        "array-buffer-byte-length": "^1.0.0",
-        "arraybuffer.prototype.slice": "^1.0.2",
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.5",
-        "es-set-tostringtag": "^2.0.1",
+      "version": "1.23.3",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.3.tgz",
+      "integrity": "sha512-e+HfNH61Bj1X9/jLc5v1owaLYuHdeHHSQlkhCBiTK8rBvKaULl/beGMxwrMXjpYrv4pz22BlY570vVePA2ho4A==",
+      "dev": true,
+      "dependencies": {
+        "array-buffer-byte-length": "^1.0.1",
+        "arraybuffer.prototype.slice": "^1.0.3",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.7",
+        "data-view-buffer": "^1.0.1",
+        "data-view-byte-length": "^1.0.1",
+        "data-view-byte-offset": "^1.0.0",
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "es-set-tostringtag": "^2.0.3",
         "es-to-primitive": "^1.2.1",
         "function.prototype.name": "^1.1.6",
-        "get-intrinsic": "^1.2.2",
-        "get-symbol-description": "^1.0.0",
+        "get-intrinsic": "^1.2.4",
+        "get-symbol-description": "^1.0.2",
         "globalthis": "^1.0.3",
         "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0",
-        "has-proto": "^1.0.1",
+        "has-property-descriptors": "^1.0.2",
+        "has-proto": "^1.0.3",
         "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0",
-        "internal-slot": "^1.0.5",
-        "is-array-buffer": "^3.0.2",
+        "hasown": "^2.0.2",
+        "internal-slot": "^1.0.7",
+        "is-array-buffer": "^3.0.4",
         "is-callable": "^1.2.7",
-        "is-negative-zero": "^2.0.2",
+        "is-data-view": "^1.0.1",
+        "is-negative-zero": "^2.0.3",
         "is-regex": "^1.1.4",
-        "is-shared-array-buffer": "^1.0.2",
+        "is-shared-array-buffer": "^1.0.3",
         "is-string": "^1.0.7",
-        "is-typed-array": "^1.1.12",
+        "is-typed-array": "^1.1.13",
         "is-weakref": "^1.0.2",
         "object-inspect": "^1.13.1",
         "object-keys": "^1.1.1",
-        "object.assign": "^4.1.4",
-        "regexp.prototype.flags": "^1.5.1",
-        "safe-array-concat": "^1.0.1",
-        "safe-regex-test": "^1.0.0",
-        "string.prototype.trim": "^1.2.8",
-        "string.prototype.trimend": "^1.0.7",
-        "string.prototype.trimstart": "^1.0.7",
-        "typed-array-buffer": "^1.0.0",
-        "typed-array-byte-length": "^1.0.0",
-        "typed-array-byte-offset": "^1.0.0",
-        "typed-array-length": "^1.0.4",
+        "object.assign": "^4.1.5",
+        "regexp.prototype.flags": "^1.5.2",
+        "safe-array-concat": "^1.1.2",
+        "safe-regex-test": "^1.0.3",
+        "string.prototype.trim": "^1.2.9",
+        "string.prototype.trimend": "^1.0.8",
+        "string.prototype.trimstart": "^1.0.8",
+        "typed-array-buffer": "^1.0.2",
+        "typed-array-byte-length": "^1.0.1",
+        "typed-array-byte-offset": "^1.0.2",
+        "typed-array-length": "^1.0.6",
         "unbox-primitive": "^1.0.2",
-        "which-typed-array": "^1.1.13"
+        "which-typed-array": "^1.1.15"
       },
       "engines": {
         "node": ">= 0.4"
@@ -6566,6 +6597,27 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/es-define-property": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz",
+      "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==",
+      "dev": true,
+      "dependencies": {
+        "get-intrinsic": "^1.2.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "dev": true,
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/es-get-iterator": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/es-get-iterator/-/es-get-iterator-1.1.3.tgz",
@@ -6586,15 +6638,27 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/es-object-atoms": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.0.0.tgz",
+      "integrity": "sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==",
+      "dev": true,
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/es-set-tostringtag": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.2.tgz",
-      "integrity": "sha512-BuDyupZt65P9D2D2vA/zqcI3G5xRsklm5N3xCwuiy+/vKy8i0ifdsQP1sLgO4tZDSCaQUSnmC48khknGMV3D2Q==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz",
+      "integrity": "sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==",
       "dev": true,
       "dependencies": {
-        "get-intrinsic": "^1.2.2",
-        "has-tostringtag": "^1.0.0",
-        "hasown": "^2.0.0"
+        "get-intrinsic": "^1.2.4",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -6627,9 +6691,9 @@
       }
     },
     "node_modules/esbuild": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.19.11.tgz",
-      "integrity": "sha512-HJ96Hev2hX/6i5cDVwcqiJBBtuo9+FeIJOtZ9W1kA5M6AMJRHUZlpYZ1/SbEwtO0ioNAW8rUooVpC/WehY2SfA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz",
+      "integrity": "sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==",
       "dev": true,
       "hasInstallScript": true,
       "bin": {
@@ -6639,35 +6703,35 @@
         "node": ">=12"
       },
       "optionalDependencies": {
-        "@esbuild/aix-ppc64": "0.19.11",
-        "@esbuild/android-arm": "0.19.11",
-        "@esbuild/android-arm64": "0.19.11",
-        "@esbuild/android-x64": "0.19.11",
-        "@esbuild/darwin-arm64": "0.19.11",
-        "@esbuild/darwin-x64": "0.19.11",
-        "@esbuild/freebsd-arm64": "0.19.11",
-        "@esbuild/freebsd-x64": "0.19.11",
-        "@esbuild/linux-arm": "0.19.11",
-        "@esbuild/linux-arm64": "0.19.11",
-        "@esbuild/linux-ia32": "0.19.11",
-        "@esbuild/linux-loong64": "0.19.11",
-        "@esbuild/linux-mips64el": "0.19.11",
-        "@esbuild/linux-ppc64": "0.19.11",
-        "@esbuild/linux-riscv64": "0.19.11",
-        "@esbuild/linux-s390x": "0.19.11",
-        "@esbuild/linux-x64": "0.19.11",
-        "@esbuild/netbsd-x64": "0.19.11",
-        "@esbuild/openbsd-x64": "0.19.11",
-        "@esbuild/sunos-x64": "0.19.11",
-        "@esbuild/win32-arm64": "0.19.11",
-        "@esbuild/win32-ia32": "0.19.11",
-        "@esbuild/win32-x64": "0.19.11"
+        "@esbuild/aix-ppc64": "0.21.5",
+        "@esbuild/android-arm": "0.21.5",
+        "@esbuild/android-arm64": "0.21.5",
+        "@esbuild/android-x64": "0.21.5",
+        "@esbuild/darwin-arm64": "0.21.5",
+        "@esbuild/darwin-x64": "0.21.5",
+        "@esbuild/freebsd-arm64": "0.21.5",
+        "@esbuild/freebsd-x64": "0.21.5",
+        "@esbuild/linux-arm": "0.21.5",
+        "@esbuild/linux-arm64": "0.21.5",
+        "@esbuild/linux-ia32": "0.21.5",
+        "@esbuild/linux-loong64": "0.21.5",
+        "@esbuild/linux-mips64el": "0.21.5",
+        "@esbuild/linux-ppc64": "0.21.5",
+        "@esbuild/linux-riscv64": "0.21.5",
+        "@esbuild/linux-s390x": "0.21.5",
+        "@esbuild/linux-x64": "0.21.5",
+        "@esbuild/netbsd-x64": "0.21.5",
+        "@esbuild/openbsd-x64": "0.21.5",
+        "@esbuild/sunos-x64": "0.21.5",
+        "@esbuild/win32-arm64": "0.21.5",
+        "@esbuild/win32-ia32": "0.21.5",
+        "@esbuild/win32-x64": "0.21.5"
       }
     },
     "node_modules/escalade": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
-      "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
+      "integrity": "sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==",
       "dev": true,
       "engines": {
         "node": ">=6"
@@ -6716,16 +6780,16 @@
       }
     },
     "node_modules/eslint": {
-      "version": "8.55.0",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.55.0.tgz",
-      "integrity": "sha512-iyUUAM0PCKj5QpwGfmCAG9XXbZCWsqP/eWAWrG/W0umvjuLRBECwSFdt+rCntju0xEH7teIABPwXpahftIaTdA==",
+      "version": "8.57.0",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.0.tgz",
+      "integrity": "sha512-dZ6+mexnaTIbSBZWgou51U6OmzIhYM2VcNdtiTtI7qPNZm35Akpr0f6vtw3w1Kmn5PYo+tZVfh13WrhpS6oLqQ==",
       "dev": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
         "@eslint/eslintrc": "^2.1.4",
-        "@eslint/js": "8.55.0",
-        "@humanwhocodes/config-array": "^0.11.13",
+        "@eslint/js": "8.57.0",
+        "@humanwhocodes/config-array": "^0.11.14",
         "@humanwhocodes/module-importer": "^1.0.1",
         "@nodelib/fs.walk": "^1.2.8",
         "@ungap/structured-clone": "^1.2.0",
@@ -6815,9 +6879,9 @@
       }
     },
     "node_modules/eslint-module-utils": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.8.0.tgz",
-      "integrity": "sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==",
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.8.1.tgz",
+      "integrity": "sha512-rXDXR3h7cs7dy9RNpUlQf80nX31XWJEyGq1tRMo+6GsO5VmTe4UTwtmonAD4ZkAsrfMVDA2wlGJ3790Ys+D49Q==",
       "dev": true,
       "dependencies": {
         "debug": "^3.2.7"
@@ -6841,9 +6905,9 @@
       }
     },
     "node_modules/eslint-plugin-import": {
-      "version": "2.29.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.29.0.tgz",
-      "integrity": "sha512-QPOO5NO6Odv5lpoTkddtutccQjysJuFxoPS7fAHO+9m9udNHvTCPSAMW9zGAYj8lAIdr40I8yPCdUYrncXtrwg==",
+      "version": "2.29.1",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.29.1.tgz",
+      "integrity": "sha512-BbPC0cuExzhiMo4Ff1BTVwHpjjv28C5R+btTOGaCRC7UEz801up0JadwkeSk5Ued6TG34uaczuVuH6qyy5YUxw==",
       "dev": true,
       "dependencies": {
         "array-includes": "^3.1.7",
@@ -6862,7 +6926,7 @@
         "object.groupby": "^1.0.1",
         "object.values": "^1.1.7",
         "semver": "^6.3.1",
-        "tsconfig-paths": "^3.14.2"
+        "tsconfig-paths": "^3.15.0"
       },
       "engines": {
         "node": ">=4"
@@ -6914,55 +6978,56 @@
       }
     },
     "node_modules/eslint-plugin-tree-shaking": {
-      "version": "1.12.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-tree-shaking/-/eslint-plugin-tree-shaking-1.12.0.tgz",
-      "integrity": "sha512-lFecPz4OZ4AUK+HghIjndXY6SY7rKCbROH28BM+6F/LEd6d3yCvklHuzpoyfkdn0/z1H4GcSz+6JArzVPgKd6Q==",
+      "version": "1.12.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-tree-shaking/-/eslint-plugin-tree-shaking-1.12.2.tgz",
+      "integrity": "sha512-D3MBKjH9EaGZg1gxqezGmjCeWzHs/O0jRFajpuXLYKeOCh3ycgoXeZ1ceKaD2QnK+v18ly+XjNDUCgss4vKbWg==",
       "dev": true,
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/eslint-plugin-vue": {
-      "version": "9.19.2",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.19.2.tgz",
-      "integrity": "sha512-CPDqTOG2K4Ni2o4J5wixkLVNwgctKXFu6oBpVJlpNq7f38lh9I80pRTouZSJ2MAebPJlINU/KTFSXyQfBUlymA==",
+      "version": "9.27.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.27.0.tgz",
+      "integrity": "sha512-5Dw3yxEyuBSXTzT5/Ge1X5kIkRTQ3nvBn/VwPwInNiZBSJOO/timWMUaflONnFBzU6NhB68lxnCda7ULV5N7LA==",
       "dev": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.4.0",
+        "globals": "^13.24.0",
         "natural-compare": "^1.4.0",
         "nth-check": "^2.1.1",
-        "postcss-selector-parser": "^6.0.13",
-        "semver": "^7.5.4",
-        "vue-eslint-parser": "^9.3.1",
+        "postcss-selector-parser": "^6.0.15",
+        "semver": "^7.6.0",
+        "vue-eslint-parser": "^9.4.3",
         "xml-name-validator": "^4.0.0"
       },
       "engines": {
         "node": "^14.17.0 || >=16.0.0"
       },
       "peerDependencies": {
-        "eslint": "^6.2.0 || ^7.0.0 || ^8.0.0"
+        "eslint": "^6.2.0 || ^7.0.0 || ^8.0.0 || ^9.0.0"
       }
     },
-    "node_modules/eslint-plugin-vue/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+    "node_modules/eslint-plugin-vue/node_modules/globals": {
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
       "dependencies": {
-        "yallist": "^4.0.0"
+        "type-fest": "^0.20.2"
       },
       "engines": {
-        "node": ">=10"
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/eslint-plugin-vue/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -6970,11 +7035,17 @@
         "node": ">=10"
       }
     },
-    "node_modules/eslint-plugin-vue/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
+    "node_modules/eslint-plugin-vue/node_modules/type-fest": {
+      "version": "0.20.2",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
+      "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
     },
     "node_modules/eslint-scope": {
       "version": "5.1.1",
@@ -7043,9 +7114,9 @@
       }
     },
     "node_modules/eslint/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
       "dependencies": {
         "type-fest": "^0.20.2"
@@ -7112,9 +7183,9 @@
       }
     },
     "node_modules/esquery": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.5.0.tgz",
-      "integrity": "sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.6.0.tgz",
+      "integrity": "sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==",
       "dev": true,
       "dependencies": {
         "estraverse": "^5.1.0"
@@ -7176,12 +7247,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/eventemitter-asyncresource": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/eventemitter-asyncresource/-/eventemitter-asyncresource-1.0.0.tgz",
-      "integrity": "sha512-39F7TBIV0G7gTelxwbEqnwhp90eqCPON1k0NwNfwhgKn4Co4ybUbj2pECcXT0B3ztRKZ7Pw1JujUUgmQJHcVAQ==",
-      "dev": true
-    },
     "node_modules/execa": {
       "version": "8.0.1",
       "resolved": "https://registry.npmjs.org/execa/-/execa-8.0.1.tgz",
@@ -7360,6 +7425,12 @@
       "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
       "dev": true
     },
+    "node_modules/fast-uri": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.0.1.tgz",
+      "integrity": "sha512-MWipKbbYiYI0UC7cl8m/i/IWTqfC8YXsqjzybjddLsFjStroQzsHXkc73JutMvBiXmOvapk+axIl79ig5t55Bw==",
+      "dev": true
+    },
     "node_modules/fastest-levenshtein": {
       "version": "1.0.16",
       "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz",
@@ -7370,9 +7441,9 @@
       }
     },
     "node_modules/fastq": {
-      "version": "1.15.0",
-      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.15.0.tgz",
-      "integrity": "sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==",
+      "version": "1.17.1",
+      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
+      "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==",
       "dev": true,
       "dependencies": {
         "reusify": "^1.0.4"
@@ -7454,9 +7525,9 @@
       }
     },
     "node_modules/fill-range": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
-      "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
+      "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
       "dev": true,
       "dependencies": {
         "to-regex-range": "^5.0.1"
@@ -7551,15 +7622,15 @@
       }
     },
     "node_modules/flatted": {
-      "version": "3.2.9",
-      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.2.9.tgz",
-      "integrity": "sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==",
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.1.tgz",
+      "integrity": "sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==",
       "dev": true
     },
     "node_modules/follow-redirects": {
-      "version": "1.15.5",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.5.tgz",
-      "integrity": "sha512-vSFWUON1B+yAw1VN4xMfxgn5fTUiaOzAJCKBwIIgT/+7CuGy9+r+5gITvP62j3RmaD5Ph65UaERdOSRGUzZtgw==",
+      "version": "1.15.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
+      "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
       "dev": true,
       "funding": [
         {
@@ -7730,16 +7801,20 @@
       }
     },
     "node_modules/get-intrinsic": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.2.tgz",
-      "integrity": "sha512-0gSo4ml/0j98Y3lngkFEot/zhiCeWsbYIlZ+uZOVgzLyLaUw7wxUL+nCTP0XJvJg1AXulJRI3UJi8GsbDuxdGA==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
+      "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==",
       "dev": true,
       "dependencies": {
+        "es-errors": "^1.3.0",
         "function-bind": "^1.1.2",
         "has-proto": "^1.0.1",
         "has-symbols": "^1.0.3",
         "hasown": "^2.0.0"
       },
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -7760,13 +7835,14 @@
       }
     },
     "node_modules/get-symbol-description": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.0.tgz",
-      "integrity": "sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.2.tgz",
+      "integrity": "sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.1"
+        "call-bind": "^1.0.5",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.4"
       },
       "engines": {
         "node": ">= 0.4"
@@ -7808,6 +7884,7 @@
       "version": "7.2.3",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
       "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
+      "deprecated": "Glob versions prior to v9 are no longer supported",
       "dev": true,
       "dependencies": {
         "fs.realpath": "^1.0.0",
@@ -7836,17 +7913,20 @@
         "node": ">=10.13.0"
       }
     },
-    "node_modules/global-dirs": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/global-dirs/-/global-dirs-0.1.1.tgz",
-      "integrity": "sha512-NknMLn7F2J7aflwFOlGdNIuCDpN3VGoSoB+aap3KABFWbHVn1TCgFC+np23J8W2BiZbjfEw3BFBycSMv1AFblg==",
+    "node_modules/global-directory": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/global-directory/-/global-directory-4.0.1.tgz",
+      "integrity": "sha512-wHTUcDUoZ1H5/0iVqEudYW4/kAlN5cZ3j/bXn0Dpbizl9iaUVeWSHqiOjsgk6OW2bkLclbBjzewBz6weQ1zA2Q==",
       "dev": true,
       "optional": true,
       "dependencies": {
-        "ini": "^1.3.4"
+        "ini": "4.1.1"
       },
       "engines": {
-        "node": ">=4"
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/global-modules": {
@@ -7879,6 +7959,12 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/global-prefix/node_modules/ini": {
+      "version": "1.3.8",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
+      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
+      "dev": true
+    },
     "node_modules/global-prefix/node_modules/which": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
@@ -7901,12 +7987,13 @@
       }
     },
     "node_modules/globalthis": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.3.tgz",
-      "integrity": "sha512-sFdI5LyBiNTHjRd7cGPWapiHWMOXKyuBNX/cWJ3NfzrZQVa8GI/8cofCl74AOVqq9W5kNmguTIzJ/1s2gyI9wA==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.4.tgz",
+      "integrity": "sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==",
       "dev": true,
       "dependencies": {
-        "define-properties": "^1.1.3"
+        "define-properties": "^1.2.1",
+        "gopd": "^1.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -7984,21 +8071,21 @@
       }
     },
     "node_modules/has-property-descriptors": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.1.tgz",
-      "integrity": "sha512-VsX8eaIewvas0xnvinAe9bw4WfIeODpGYikiWYLH+dma0Jw6KHYqWiWfhQlgOVK8D6PvjubK5Uc4P0iIhIcNVg==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz",
+      "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==",
       "dev": true,
       "dependencies": {
-        "get-intrinsic": "^1.2.2"
+        "es-define-property": "^1.0.0"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/has-proto": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.1.tgz",
-      "integrity": "sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz",
+      "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==",
       "dev": true,
       "engines": {
         "node": ">= 0.4"
@@ -8020,12 +8107,12 @@
       }
     },
     "node_modules/has-tostringtag": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.0.tgz",
-      "integrity": "sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
+      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
       "dev": true,
       "dependencies": {
-        "has-symbols": "^1.0.2"
+        "has-symbols": "^1.0.3"
       },
       "engines": {
         "node": ">= 0.4"
@@ -8041,9 +8128,9 @@
       "dev": true
     },
     "node_modules/hasown": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.0.tgz",
-      "integrity": "sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
+      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
       "dev": true,
       "dependencies": {
         "function-bind": "^1.1.2"
@@ -8052,23 +8139,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/hdr-histogram-js": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/hdr-histogram-js/-/hdr-histogram-js-2.0.3.tgz",
-      "integrity": "sha512-Hkn78wwzWHNCp2uarhzQ2SGFLU3JY8SBDDd3TAABK4fc30wm+MuPOrg5QVFVfkKOQd6Bfz3ukJEI+q9sXEkK1g==",
-      "dev": true,
-      "dependencies": {
-        "@assemblyscript/loader": "^0.10.1",
-        "base64-js": "^1.2.0",
-        "pako": "^1.0.3"
-      }
-    },
-    "node_modules/hdr-histogram-percentiles-obj": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/hdr-histogram-percentiles-obj/-/hdr-histogram-percentiles-obj-3.0.0.tgz",
-      "integrity": "sha512-7kIufnBqdsBGcSZLPJwqHT3yhk1QTsSlFsVD3kx5ixH/AlgBs9yM1q6DPhXZ8f8gtdqgh7N7/5btRLpQsS2gHw==",
-      "dev": true
-    },
     "node_modules/he": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
@@ -8247,9 +8317,9 @@
       ]
     },
     "node_modules/ignore": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.0.tgz",
-      "integrity": "sha512-g7dmpshy+gD7mh88OC9NwSGTKoc3kyLAZQRU1mt53Aw/vnvfXnbC+F/7F7QoYVKbV+KNvJx8wArewKy1vXMtlg==",
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.1.tgz",
+      "integrity": "sha512-5Fytz/IraMjqpwfd34ke28PTVMjZjJG2MPn5t7OE4eUCUNf8BAa7b5WUS9/Qvr6mwOQS7Mk6vdsMno5he+T8Xw==",
       "dev": true,
       "engines": {
         "node": ">= 4"
@@ -8262,9 +8332,9 @@
       "dev": true
     },
     "node_modules/immutable": {
-      "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.4.tgz",
-      "integrity": "sha512-fsXeu4J4i6WNWSikpI88v/PcVflZz+6kMhUfIwc5SY+poQRPnaf5V7qds6SUyUN3cVxEzuCab7QIoLOQ+DQ1wA==",
+      "version": "4.3.7",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.7.tgz",
+      "integrity": "sha512-1hqclzwYwjRDFLjcFxOM5AYkkG0rpFPpr1RLPMEuGczoS7YA8gLhy8SWXYRAA/XwfEHpfo3cw5JGioS32fnMRw==",
       "dev": true
     },
     "node_modules/import-fresh": {
@@ -8301,6 +8371,17 @@
         "node": ">=8"
       }
     },
+    "node_modules/import-meta-resolve": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.1.0.tgz",
+      "integrity": "sha512-I6fiaX09Xivtk+THaMfAwnA3MVA5Big1WHF1Dfx9hFuvNIWpXnorlkzhcQf6ehrqQiiZECRt1poOAkPmer3ruw==",
+      "dev": true,
+      "optional": true,
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/imurmurhash": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
@@ -8314,6 +8395,7 @@
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
       "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==",
+      "deprecated": "This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.",
       "dev": true,
       "dependencies": {
         "once": "^1.3.0",
@@ -8327,10 +8409,14 @@
       "dev": true
     },
     "node_modules/ini": {
-      "version": "1.3.8",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
-      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
-      "dev": true
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-4.1.1.tgz",
+      "integrity": "sha512-QQnnxNyfvmHFIsj7gkPcYymR8Jdw/o7mp5ZFihxn6h8Ci6fh3Dx4E1gPjpQEpIuPo9XVNY/ZUwh4BPMjGyL01g==",
+      "dev": true,
+      "optional": true,
+      "engines": {
+        "node": "^14.17.0 || ^16.13.0 || >=18.0.0"
+      }
     },
     "node_modules/inquirer": {
       "version": "8.2.6",
@@ -8359,12 +8445,12 @@
       }
     },
     "node_modules/internal-slot": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.6.tgz",
-      "integrity": "sha512-Xj6dv+PsbtwyPpEflsejS+oIZxmMlV44zAhG479uYu89MsjcYOhCFnNyKrkJrihbsiasQyY0afoCl/9BLR65bg==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.7.tgz",
+      "integrity": "sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==",
       "dev": true,
       "dependencies": {
-        "get-intrinsic": "^1.2.2",
+        "es-errors": "^1.3.0",
         "hasown": "^2.0.0",
         "side-channel": "^1.0.4"
       },
@@ -8385,12 +8471,6 @@
         "node": ">= 12"
       }
     },
-    "node_modules/ip-address/node_modules/sprintf-js": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.3.tgz",
-      "integrity": "sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA==",
-      "dev": true
-    },
     "node_modules/ip-regex": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ip-regex/-/ip-regex-4.3.0.tgz",
@@ -8417,14 +8497,16 @@
       }
     },
     "node_modules/is-array-buffer": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.2.tgz",
-      "integrity": "sha512-y+FyyR/w8vfIRq4eQcM1EYgSTnmHXPqaF+IgzgraytCFq5Xh8lllDVmAZolPJiZttZLeFSINPYMaEJ7/vWUa1w==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
+      "integrity": "sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==",
       "dev": true,
       "dependencies": {
         "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.0",
-        "is-typed-array": "^1.1.10"
+        "get-intrinsic": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -8489,12 +8571,30 @@
       }
     },
     "node_modules/is-core-module": {
-      "version": "2.13.1",
-      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.1.tgz",
-      "integrity": "sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==",
+      "version": "2.15.0",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.15.0.tgz",
+      "integrity": "sha512-Dd+Lb2/zvk9SKy1TGCt1wFJFo/MWBPMX5x7KcvLajWTGuomczdQX61PvY5yK6SVACwpoexWo81IfFyoKY2QnTA==",
       "dev": true,
       "dependencies": {
-        "hasown": "^2.0.0"
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-data-view": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.1.tgz",
+      "integrity": "sha512-AHkaJrsUVW6wq6JS8y3JnM/GJF/9cf+k20+iDzlSaJrinEo5+7vRiteOSwBhHRiAyQATN1AmY4hwzxJKPmYf+w==",
+      "dev": true,
+      "dependencies": {
+        "is-typed-array": "^1.1.13"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -8592,18 +8692,21 @@
       }
     },
     "node_modules/is-map": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.2.tgz",
-      "integrity": "sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.3.tgz",
+      "integrity": "sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==",
       "dev": true,
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/is-negative-zero": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.2.tgz",
-      "integrity": "sha512-dqJvarLawXsFbNDeJW7zAz8ItJ9cd28YufuuFzh0G8pNHjJMnY08Dv7sYX2uF5UpQOwieAeOExEYAWWfu7ZZUA==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz",
+      "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==",
       "dev": true,
       "engines": {
         "node": ">= 0.4"
@@ -8645,6 +8748,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/is-plain-obj": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-2.1.0.tgz",
+      "integrity": "sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA==",
+      "dev": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/is-plain-object": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz",
@@ -8683,21 +8795,27 @@
       }
     },
     "node_modules/is-set": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.2.tgz",
-      "integrity": "sha512-+2cnTEZeY5z/iXGbLhPrOAaK/Mau5k5eXq9j14CpRTftq0pAJu2MwVRSZhyZWBzx3o6X795Lz6Bpb6R0GKf37g==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.3.tgz",
+      "integrity": "sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==",
       "dev": true,
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/is-shared-array-buffer": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.2.tgz",
-      "integrity": "sha512-sqN2UDu1/0y6uvXyStCOzyhAjCSlHceFoMKJW8W9EU9cvic/QdsZ0kEU93HEy3IUEFZIiH/3w+AH/UQbPHNdhA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz",
+      "integrity": "sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2"
+        "call-bind": "^1.0.7"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -8746,12 +8864,12 @@
       }
     },
     "node_modules/is-typed-array": {
-      "version": "1.1.12",
-      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.12.tgz",
-      "integrity": "sha512-Z14TF2JNG8Lss5/HMqt0//T9JeHXttXy5pH/DBU4vi98ozO2btxzq9MwYDZYnKwU8nRsz/+GVFVRDq3DkVuSPg==",
+      "version": "1.1.13",
+      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz",
+      "integrity": "sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==",
       "dev": true,
       "dependencies": {
-        "which-typed-array": "^1.1.11"
+        "which-typed-array": "^1.1.14"
       },
       "engines": {
         "node": ">= 0.4"
@@ -8785,10 +8903,13 @@
       "dev": true
     },
     "node_modules/is-weakmap": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.1.tgz",
-      "integrity": "sha512-NSBR4kH5oVj1Uwvv970ruUkCV7O1mzgVFO4/rev2cLRda9Tm9HrL70ZPut4rOHgY0FNrUu9BCbXA2sdQ+x0chA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.2.tgz",
+      "integrity": "sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==",
       "dev": true,
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -8806,13 +8927,16 @@
       }
     },
     "node_modules/is-weakset": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.2.tgz",
-      "integrity": "sha512-t2yVvttHkQktwnNNmBQ98AhENLdPUTDTE21uPqAQ0ARwQfGeQKRVS0NNurH7bTf7RrvcVn1OOge45CnBeHCSmg==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.3.tgz",
+      "integrity": "sha512-LvIm3/KWzS9oRFHugab7d+M/GcBXuXX5xZkzPmN+NxihdQlZUQ4dWuSV1xR/sq6upL1TJEDrfBgRepHFdBtSNQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.1"
+        "call-bind": "^1.0.7",
+        "get-intrinsic": "^1.2.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -8889,9 +9013,9 @@
       }
     },
     "node_modules/istanbul-reports": {
-      "version": "3.1.6",
-      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-3.1.6.tgz",
-      "integrity": "sha512-TLgnMkKg3iTDsQ9PbPTdpfAK2DzjF9mqUG7RMgcQl8oFjad8ob4laGxv5XV5U9MAfx8D6tSJiUyuAwzLicaxlg==",
+      "version": "3.1.7",
+      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-3.1.7.tgz",
+      "integrity": "sha512-BewmUXImeuRk2YY0PVbxgKAysvhRPUQE0h5QRM++nVWyubKGV0l8qQ5op8+B2DOmwSe63Jivj0BjkPQVf8fP5g==",
       "dev": true,
       "dependencies": {
         "html-escaper": "^2.0.0",
@@ -8902,16 +9026,13 @@
       }
     },
     "node_modules/jackspeak": {
-      "version": "2.3.6",
-      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-2.3.6.tgz",
-      "integrity": "sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==",
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
+      "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
       "dev": true,
       "dependencies": {
         "@isaacs/cliui": "^8.0.2"
       },
-      "engines": {
-        "node": ">=14"
-      },
       "funding": {
         "url": "https://github.com/sponsors/isaacs"
       },
@@ -8920,9 +9041,9 @@
       }
     },
     "node_modules/jake": {
-      "version": "10.8.7",
-      "resolved": "https://registry.npmjs.org/jake/-/jake-10.8.7.tgz",
-      "integrity": "sha512-ZDi3aP+fG/LchyBzUM804VjddnwfSfsdeYkwt8NcbKRvo4rFkjhs456iLFn3k2ZUWvNe4i48WACDbza8fhq2+w==",
+      "version": "10.9.2",
+      "resolved": "https://registry.npmjs.org/jake/-/jake-10.9.2.tgz",
+      "integrity": "sha512-2P4SQ0HrLQ+fw6llpLnOaGAvN2Zu6778SJMrCUwns4fOoG9ayrTiZk3VV8sCPkVZF8ab0zksVpS8FDY5pRCNBA==",
       "dev": true,
       "dependencies": {
         "async": "^3.2.3",
@@ -8938,9 +9059,9 @@
       }
     },
     "node_modules/jiti": {
-      "version": "1.21.0",
-      "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.0.tgz",
-      "integrity": "sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==",
+      "version": "1.21.6",
+      "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz",
+      "integrity": "sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==",
       "dev": true,
       "optional": true,
       "bin": {
@@ -8954,14 +9075,15 @@
       "dev": true
     },
     "node_modules/js-beautify": {
-      "version": "1.14.11",
-      "resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.14.11.tgz",
-      "integrity": "sha512-rPogWqAfoYh1Ryqqh2agUpVfbxAhbjuN1SmU86dskQUKouRiggUTCO4+2ym9UPXllc2WAp0J+T5qxn7Um3lCdw==",
+      "version": "1.15.1",
+      "resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.15.1.tgz",
+      "integrity": "sha512-ESjNzSlt/sWE8sciZH8kBF8BPlwXPwhR6pWKAw8bw4Bwj+iZcnKW6ONWUutJ7eObuBZQpiIb8S7OYspWrKt7rA==",
       "dev": true,
       "dependencies": {
         "config-chain": "^1.1.13",
-        "editorconfig": "^1.0.3",
+        "editorconfig": "^1.0.4",
         "glob": "^10.3.3",
+        "js-cookie": "^3.0.5",
         "nopt": "^7.2.0"
       },
       "bin": {
@@ -8983,9 +9105,9 @@
       }
     },
     "node_modules/js-beautify/node_modules/foreground-child": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.1.1.tgz",
-      "integrity": "sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==",
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.2.1.tgz",
+      "integrity": "sha512-PXUUyLqrR2XCWICfv6ukppP96sdFwWbNEnfEMt7jNsISjMsvaLNinAHNDYyvkyU+SZG2BTSbT5NjG+vZslfGTA==",
       "dev": true,
       "dependencies": {
         "cross-spawn": "^7.0.0",
@@ -8999,31 +9121,29 @@
       }
     },
     "node_modules/js-beautify/node_modules/glob": {
-      "version": "10.3.10",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz",
-      "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==",
+      "version": "10.4.5",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
+      "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
       "dev": true,
       "dependencies": {
         "foreground-child": "^3.1.0",
-        "jackspeak": "^2.3.5",
-        "minimatch": "^9.0.1",
-        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0",
-        "path-scurry": "^1.10.1"
+        "jackspeak": "^3.1.2",
+        "minimatch": "^9.0.4",
+        "minipass": "^7.1.2",
+        "package-json-from-dist": "^1.0.0",
+        "path-scurry": "^1.11.1"
       },
       "bin": {
         "glob": "dist/esm/bin.mjs"
       },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
       "funding": {
         "url": "https://github.com/sponsors/isaacs"
       }
     },
     "node_modules/js-beautify/node_modules/minimatch": {
-      "version": "9.0.3",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
-      "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
       "dependencies": {
         "brace-expansion": "^2.0.1"
@@ -9047,6 +9167,15 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
+    "node_modules/js-cookie": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.5.tgz",
+      "integrity": "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==",
+      "dev": true,
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/js-stringify": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/js-stringify/-/js-stringify-1.0.2.tgz",
@@ -9157,7 +9286,6 @@
       "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz",
       "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
       "dev": true,
-      "peer": true,
       "bin": {
         "jsesc": "bin/jsesc"
       },
@@ -9208,12 +9336,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/jsonc-parser": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.0.tgz",
-      "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==",
-      "dev": true
-    },
     "node_modules/jsonfile": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
@@ -9285,9 +9407,9 @@
       }
     },
     "node_modules/just-extend": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-4.2.1.tgz",
-      "integrity": "sha512-g3UB796vUFIY90VIv/WX3L2c8CS2MdWUww3CNrYmqza1Fg0DURc2K/O4YrnklBdQarSJ/y8JnJYDGc+1iumQjg==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-6.2.0.tgz",
+      "integrity": "sha512-cYofQu2Xpom82S6qD778jBDpwvvy39s1l/hrYij2u9AMdQcGRpaBu6kY4mVhuno5kJVi1DAz4aiphA2WI1/OAw==",
       "dev": true
     },
     "node_modules/keyv": {
@@ -9318,9 +9440,9 @@
       }
     },
     "node_modules/known-css-properties": {
-      "version": "0.29.0",
-      "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.29.0.tgz",
-      "integrity": "sha512-Ne7wqW7/9Cz54PDt4I3tcV+hAyat8ypyOGzYRJQfdxnnjeWsTxt1cy8pjvvKeI5kfXuyvULyeeAvwvvtAX3ayQ==",
+      "version": "0.34.0",
+      "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.34.0.tgz",
+      "integrity": "sha512-tBECoUqNFbyAY4RrbqsBQqDFpGXAEbdD5QKr8kACx3+rnArmuuR22nKQWKazvp07N9yjTyDZaw/20UIH8tL9DQ==",
       "dev": true
     },
     "node_modules/kolorist": {
@@ -9485,83 +9607,6 @@
       "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
       "dev": true
     },
-    "node_modules/lodash._arraycopy": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz",
-      "integrity": "sha512-RHShTDnPKP7aWxlvXKiDT6IX2jCs6YZLCtNhOru/OX2Q/tzX295vVBK5oX1ECtN+2r86S0Ogy8ykP1sgCZAN0A==",
-      "dev": true
-    },
-    "node_modules/lodash._arrayeach": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz",
-      "integrity": "sha512-Mn7HidOVcl3mkQtbPsuKR0Fj0N6Q6DQB77CtYncZcJc0bx5qv2q4Gl6a0LC1AN+GSxpnBDNnK3CKEm9XNA4zqQ==",
-      "dev": true
-    },
-    "node_modules/lodash._baseassign": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz",
-      "integrity": "sha512-t3N26QR2IdSN+gqSy9Ds9pBu/J1EAFEshKlUHpJG3rvyJOYgcELIxcIeKKfZk7sjOz11cFfzJRsyFry/JyabJQ==",
-      "dev": true,
-      "dependencies": {
-        "lodash._basecopy": "^3.0.0",
-        "lodash.keys": "^3.0.0"
-      }
-    },
-    "node_modules/lodash._baseclone": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz",
-      "integrity": "sha512-1K0dntf2dFQ5my0WoGKkduewR6+pTNaqX03kvs45y7G5bzl4B3kTR4hDfJIc2aCQDeLyQHhS280tc814m1QC1Q==",
-      "dev": true,
-      "dependencies": {
-        "lodash._arraycopy": "^3.0.0",
-        "lodash._arrayeach": "^3.0.0",
-        "lodash._baseassign": "^3.0.0",
-        "lodash._basefor": "^3.0.0",
-        "lodash.isarray": "^3.0.0",
-        "lodash.keys": "^3.0.0"
-      }
-    },
-    "node_modules/lodash._basecopy": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
-      "integrity": "sha512-rFR6Vpm4HeCK1WPGvjZSJ+7yik8d8PVUdCJx5rT2pogG4Ve/2ZS7kfmO5l5T2o5V2mqlNIfSF5MZlr1+xOoYQQ==",
-      "dev": true
-    },
-    "node_modules/lodash._basefor": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz",
-      "integrity": "sha512-6bc3b8grkpMgDcVJv9JYZAk/mHgcqMljzm7OsbmcE2FGUMmmLQTPHlh/dFqR8LA0GQ7z4K67JSotVKu5058v1A==",
-      "dev": true
-    },
-    "node_modules/lodash._bindcallback": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz",
-      "integrity": "sha512-2wlI0JRAGX8WEf4Gm1p/mv/SZ+jLijpj0jyaE/AXeuQphzCgD8ZQW4oSpoN8JAopujOFGU3KMuq7qfHBWlGpjQ==",
-      "dev": true
-    },
-    "node_modules/lodash._getnative": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
-      "integrity": "sha512-RrL9VxMEPyDMHOd9uFbvMe8X55X16/cGM5IgOKgRElQZutpX89iS6vwl64duTV1/16w5JY7tuFNXqoekmh1EmA==",
-      "dev": true
-    },
-    "node_modules/lodash._isiterateecall": {
-      "version": "3.0.9",
-      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
-      "integrity": "sha512-De+ZbrMu6eThFti/CSzhRvTKMgQToLxbij58LMfM8JnYDNSOjkjTCIaa8ixglOeGh2nyPlakbt5bJWJ7gvpYlQ==",
-      "dev": true
-    },
-    "node_modules/lodash.clone": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-3.0.3.tgz",
-      "integrity": "sha512-yVYPpFTdZDCLG2p07gVRTvcwN5X04oj2hu4gG6r0fer58JA08wAVxXzWM+CmmxO2bzOH8u8BkZTZqgX6juVF7A==",
-      "dev": true,
-      "dependencies": {
-        "lodash._baseclone": "^3.0.0",
-        "lodash._bindcallback": "^3.0.0",
-        "lodash._isiterateecall": "^3.0.0"
-      }
-    },
     "node_modules/lodash.debounce": {
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@@ -9574,24 +9619,12 @@
       "integrity": "sha512-qjxPLHd3r5DnsdGacqOMU6pb/avJzdh9tFX2ymgoZE27BmjXrNy/y4LoaiTeAb+O3gL8AfpJGtqfX/ae2leYYQ==",
       "dev": true
     },
-    "node_modules/lodash.defaultsdeep": {
-      "version": "4.6.1",
-      "resolved": "https://registry.npmjs.org/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.1.tgz",
-      "integrity": "sha512-3j8wdDzYuWO3lM3Reg03MuQR957t287Rpcxp1njpEa8oDrikb+FwGdW3n+FELh/A6qib6yPit0j/pv9G/yeAqA==",
-      "dev": true
-    },
     "node_modules/lodash.difference": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.difference/-/lodash.difference-4.5.0.tgz",
       "integrity": "sha512-dS2j+W26TQ7taQBGN8Lbbq04ssV3emRw4NY58WErlTO29pIqS0HmoT5aJ9+TUQ1N3G+JOZSji4eugsWwGp9yPA==",
       "dev": true
     },
-    "node_modules/lodash.escape": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-4.0.1.tgz",
-      "integrity": "sha512-nXEOnb/jK9g0DYMr1/Xvq6l5xMD7GDG55+GSYIYmS0G4tBk/hURD4JR9WCavs04t33WmJx9kCyp9vJ+mr4BOUw==",
-      "dev": true
-    },
     "node_modules/lodash.flatten": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
@@ -9604,18 +9637,6 @@
       "integrity": "sha512-z+Uw/vLuy6gQe8cfaFWD7p0wVv8fJl3mbzXh33RS+0oW2wvUqiRXiQ69gLWSLpgB5/6sU+r6BlQR0MBILadqTQ==",
       "dev": true
     },
-    "node_modules/lodash.isarguments": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
-      "integrity": "sha512-chi4NHZlZqZD18a0imDHnZPrDeBbTtVN7GXMwuGdRH9qotxAjYs3aVLKc7zNOG9eddR5Ksd8rvFEBc9SsggPpg==",
-      "dev": true
-    },
-    "node_modules/lodash.isarray": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
-      "integrity": "sha512-JwObCrNJuT0Nnbuecmqr5DgtuBppuCvGD9lxjFpAzwnVtdGoDQ1zig+5W8k5/6Gcn0gZ3936HDAlGd28i7sOGQ==",
-      "dev": true
-    },
     "node_modules/lodash.isequal": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
@@ -9628,17 +9649,6 @@
       "integrity": "sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA==",
       "dev": true
     },
-    "node_modules/lodash.keys": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
-      "integrity": "sha512-CuBsapFjcubOGMn3VD+24HOAPxM79tH+V6ivJL3CHYjtrawauDJHUk//Yew9Hvc6e9rbCrURGk8z6PC+8WJBfQ==",
-      "dev": true,
-      "dependencies": {
-        "lodash._getnative": "^3.0.0",
-        "lodash.isarguments": "^3.0.0",
-        "lodash.isarray": "^3.0.0"
-      }
-    },
     "node_modules/lodash.map": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz",
@@ -9664,12 +9674,6 @@
       "dev": true,
       "optional": true
     },
-    "node_modules/lodash.pick": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
-      "integrity": "sha512-hXt6Ul/5yWjfklSGvLQl8vM//l3FtyHZeuelpzK6mm99pNvN9yTDruNZPEJZD1oWrqo+izBmB7oUfWgcCX7s4Q==",
-      "dev": true
-    },
     "node_modules/lodash.truncate": {
       "version": "4.4.2",
       "resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz",
@@ -9706,9 +9710,9 @@
       }
     },
     "node_modules/loglevel": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.8.1.tgz",
-      "integrity": "sha512-tCRIJM51SHjAayKwC+QAg8hT8vg6z7GSgLJKGvzuPb1Wc+hLzqtuVLxp6/HzSPOozuK+8ErAhy7U/sVzw8Dgfg==",
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.9.1.tgz",
+      "integrity": "sha512-hP3I3kCrDIMuRwAwHltphhDM1r8i55H33GgqjXbrisuJhF4kRhW1dNuxsRklp4bXl8DSdLaNLuiL4A/LWRfxvg==",
       "dev": true,
       "engines": {
         "node": ">= 0.6.0"
@@ -9728,12 +9732,12 @@
       }
     },
     "node_modules/loupe": {
-      "version": "2.3.4",
-      "resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.4.tgz",
-      "integrity": "sha512-OvKfgCC2Ndby6aSTREl5aCCPTNIzlDfQZvZxNUrBrihDhL3xcrYegTblhmEiCrg2kKQz4XsFIaemE5BF4ybSaQ==",
+      "version": "2.3.7",
+      "resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.7.tgz",
+      "integrity": "sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==",
       "dev": true,
       "dependencies": {
-        "get-func-name": "^2.0.0"
+        "get-func-name": "^2.0.1"
       }
     },
     "node_modules/lru-cache": {
@@ -9746,14 +9750,11 @@
       }
     },
     "node_modules/magic-string": {
-      "version": "0.30.5",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.5.tgz",
-      "integrity": "sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==",
+      "version": "0.30.11",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.11.tgz",
+      "integrity": "sha512-+Wri9p0QHMy+545hKww7YAu5NyzF8iomPL/RQazugQ9+Ez4Ic3mERMd8ZTX5rfK944j+560ZJi8iAwgak1Ac7A==",
       "dependencies": {
-        "@jridgewell/sourcemap-codec": "^1.4.15"
-      },
-      "engines": {
-        "node": ">=12"
+        "@jridgewell/sourcemap-codec": "^1.5.0"
       }
     },
     "node_modules/make-dir": {
@@ -9771,26 +9772,11 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/make-dir/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/make-dir/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -9798,12 +9784,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/make-dir/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/make-error": {
       "version": "1.3.6",
       "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
@@ -9836,9 +9816,9 @@
       }
     },
     "node_modules/meow": {
-      "version": "13.0.0",
-      "resolved": "https://registry.npmjs.org/meow/-/meow-13.0.0.tgz",
-      "integrity": "sha512-4Hu+75Vo7EOR+8C9RmkabfLijuwd9SrzQ8f0SyC4qZZwU6BlxeOt5ulF3PGCpcMJX4hI+ktpJhea0P6PN1RiWw==",
+      "version": "13.2.0",
+      "resolved": "https://registry.npmjs.org/meow/-/meow-13.2.0.tgz",
+      "integrity": "sha512-pxQJQzB6djGPXh08dacEloMFopsOqGVRKFPYvPOt9XDZ1HasbgDZA74CJGreSU4G3Ak7EFJGoiH2auq+yXISgA==",
       "dev": true,
       "engines": {
         "node": ">=18"
@@ -9869,12 +9849,12 @@
       }
     },
     "node_modules/micromatch": {
-      "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz",
-      "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==",
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz",
+      "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
       "dev": true,
       "dependencies": {
-        "braces": "^3.0.2",
+        "braces": "^3.0.3",
         "picomatch": "^2.3.1"
       },
       "engines": {
@@ -9933,9 +9913,9 @@
       }
     },
     "node_modules/minipass": {
-      "version": "7.0.4",
-      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.0.4.tgz",
-      "integrity": "sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==",
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
+      "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
       "dev": true,
       "engines": {
         "node": ">=16 || 14 >=14.17"
@@ -9948,21 +9928,21 @@
       "dev": true
     },
     "node_modules/mlly": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.4.2.tgz",
-      "integrity": "sha512-i/Ykufi2t1EZ6NaPLdfnZk2AX8cs0d+mTzVKuPfqPKPatxLApaBoxJQ9x1/uckXtrS/U5oisPMDkNs0yQTaBRg==",
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.7.1.tgz",
+      "integrity": "sha512-rrVRZRELyQzrIUAVMHxP97kv+G786pHmOKzuFII8zDYahFBS7qnHh2AlYSl1GAHhaMPCz6/oHjVMcfFYgFYHgA==",
       "dev": true,
       "dependencies": {
-        "acorn": "^8.10.0",
-        "pathe": "^1.1.1",
-        "pkg-types": "^1.0.3",
-        "ufo": "^1.3.0"
+        "acorn": "^8.11.3",
+        "pathe": "^1.1.2",
+        "pkg-types": "^1.1.1",
+        "ufo": "^1.5.3"
       }
     },
     "node_modules/mocha": {
-      "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/mocha/-/mocha-10.2.0.tgz",
-      "integrity": "sha512-IDY7fl/BecMwFHzoqF2sg/SHHANeBoMMXFlS9r0OXKDssYE1M5O43wUY/9BVPeIvfH2zmEbBfseqN9gBQZzXkg==",
+      "version": "10.3.0",
+      "resolved": "https://registry.npmjs.org/mocha/-/mocha-10.3.0.tgz",
+      "integrity": "sha512-uF2XJs+7xSLsrmIvn37i/wnc91nw7XjOQB8ccyx5aEgdnohr7n+rEiZP23WkCYHjilR6+EboEnbq/ZQDz4LSbg==",
       "dev": true,
       "dependencies": {
         "ansi-colors": "4.1.1",
@@ -9972,13 +9952,12 @@
         "diff": "5.0.0",
         "escape-string-regexp": "4.0.0",
         "find-up": "5.0.0",
-        "glob": "7.2.0",
+        "glob": "8.1.0",
         "he": "1.2.0",
         "js-yaml": "4.1.0",
         "log-symbols": "4.1.0",
         "minimatch": "5.0.1",
         "ms": "2.1.3",
-        "nanoid": "3.3.3",
         "serialize-javascript": "6.0.0",
         "strip-json-comments": "3.1.1",
         "supports-color": "8.1.1",
@@ -9993,44 +9972,60 @@
       },
       "engines": {
         "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/mocha/node_modules/brace-expansion": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "dev": true,
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/mocha/node_modules/debug": {
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "dev": true,
+      "dependencies": {
+        "ms": "2.1.2"
       },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/mochajs"
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
       }
     },
+    "node_modules/mocha/node_modules/debug/node_modules/ms": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
+      "dev": true
+    },
     "node_modules/mocha/node_modules/glob": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.0.tgz",
-      "integrity": "sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==",
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz",
+      "integrity": "sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==",
+      "deprecated": "Glob versions prior to v9 are no longer supported",
       "dev": true,
       "dependencies": {
         "fs.realpath": "^1.0.0",
         "inflight": "^1.0.4",
         "inherits": "2",
-        "minimatch": "^3.0.4",
-        "once": "^1.3.0",
-        "path-is-absolute": "^1.0.0"
+        "minimatch": "^5.0.1",
+        "once": "^1.3.0"
       },
       "engines": {
-        "node": "*"
+        "node": ">=12"
       },
       "funding": {
         "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/mocha/node_modules/glob/node_modules/minimatch": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
-      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
-      "dev": true,
-      "dependencies": {
-        "brace-expansion": "^1.1.7"
-      },
-      "engines": {
-        "node": "*"
-      }
-    },
     "node_modules/mocha/node_modules/minimatch": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.0.1.tgz",
@@ -10043,15 +10038,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/mocha/node_modules/minimatch/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-      "dev": true,
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
     "node_modules/mocha/node_modules/ms": {
       "version": "2.1.3",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
@@ -10101,10 +10087,15 @@
       "dev": true
     },
     "node_modules/nanoid": {
-      "version": "3.3.3",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.3.tgz",
-      "integrity": "sha512-p1sjXuopFs0xg+fPASzQ28agW1oHD7xDsd9Xkf3T15H3c/cifrFHVwrh74PdoklAPi+i7MdRsE47vm2r6JoB+w==",
-      "dev": true,
+      "version": "3.3.7",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
+      "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
       "bin": {
         "nanoid": "bin/nanoid.cjs"
       },
@@ -10155,13 +10146,13 @@
       "dev": true
     },
     "node_modules/nightwatch": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/nightwatch/-/nightwatch-3.3.2.tgz",
-      "integrity": "sha512-qi/1glgvJjWrtHBm1vQJfLc4XocqfSqJ3E27Rlg8ofeYC5mLBnKqmJg4u268voIUg+4fQkMm0UYKDtF/0Es4Ag==",
+      "version": "3.7.0",
+      "resolved": "https://registry.npmjs.org/nightwatch/-/nightwatch-3.7.0.tgz",
+      "integrity": "sha512-KtMXBbs3eEdPDZ7fuKmk+upBD0IT8u9XVikigJQFjHKKpWfKQSXDXZ4umIT6OM6yWLnGwvab7PwZp2xfdmZPww==",
       "dev": true,
       "dependencies": {
-        "@nightwatch/chai": "5.0.2",
-        "@nightwatch/html-reporter-template": "0.2.1",
+        "@nightwatch/chai": "5.0.3",
+        "@nightwatch/html-reporter-template": "^0.3.0",
         "@nightwatch/nightwatch-inspector": "^1.0.1",
         "@types/chai": "^4.3.5",
         "@types/selenium-webdriver": "^4.1.14",
@@ -10176,23 +10167,19 @@
         "devtools-protocol": "^0.0.1140464",
         "didyoumean": "^1.2.2",
         "dotenv": "16.3.1",
-        "ejs": "3.1.8",
+        "ejs": "^3.1.10",
         "envinfo": "7.11.0",
         "glob": "7.2.3",
-        "jsdom": "21.1.2",
-        "lodash.clone": "3.0.3",
-        "lodash.defaultsdeep": "4.6.1",
-        "lodash.escape": "4.0.1",
-        "lodash.merge": "4.6.2",
-        "lodash.pick": "4.4.0",
+        "jsdom": "^24.1.0",
+        "lodash": "^4.17.21",
         "minimatch": "3.1.2",
         "minimist": "1.2.6",
-        "mocha": "10.2.0",
-        "nightwatch-axe-verbose": "^2.2.2",
+        "mocha": "10.3.0",
+        "nightwatch-axe-verbose": "^2.3.0",
         "open": "8.4.2",
         "ora": "5.4.1",
-        "piscina": "3.2.0",
-        "selenium-webdriver": "4.14.0",
+        "piscina": "^4.3.1",
+        "selenium-webdriver": "4.22.0",
         "semver": "7.5.4",
         "stacktrace-parser": "0.1.10",
         "strip-ansi": "6.0.1",
@@ -10221,40 +10208,24 @@
       }
     },
     "node_modules/nightwatch-axe-verbose": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/nightwatch-axe-verbose/-/nightwatch-axe-verbose-2.2.2.tgz",
-      "integrity": "sha512-MvCrQb9D/ixtGtyN5fh7YCkelXuPup3X9D2Zhhk1PWyALtkdYCFadnIGif1irpQ1BLNSlqC+FDNnsNald7KHYA==",
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/nightwatch-axe-verbose/-/nightwatch-axe-verbose-2.3.1.tgz",
+      "integrity": "sha512-C6N95bwPHsRnv04eVIwJ6w5m6X1+Pddvo6nzpzOHQlO0j+pYRVU7zaQmFUJ0L4cqeUxReNEXyTUg/R9WWfHk7w==",
       "dev": true,
       "dependencies": {
-        "axe-core": "^4.7.2"
-      }
-    },
-    "node_modules/nightwatch/node_modules/@tootallnate/once": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz",
-      "integrity": "sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==",
-      "dev": true,
-      "engines": {
-        "node": ">= 10"
+        "axe-core": "^4.9.1"
       }
     },
-    "node_modules/nightwatch/node_modules/acorn-globals": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-7.0.1.tgz",
-      "integrity": "sha512-umOSDSDrfHbTNPuNpC2NSnnA3LUrqpevPb4T9jRx4MagXNS0rs+gwiTcAvqCRmsD6utzsrzNt+ebm00SNWiC3Q==",
+    "node_modules/nightwatch/node_modules/agent-base": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.1.tgz",
+      "integrity": "sha512-H0TSyFNDMomMNJQBn8wFV5YC/2eJ+VXECwOadZJT554xP6cODZHPX3H9QMQECxvrgiSOP1pHjy1sMWQVYJOUOA==",
       "dev": true,
       "dependencies": {
-        "acorn": "^8.1.0",
-        "acorn-walk": "^8.0.2"
-      }
-    },
-    "node_modules/nightwatch/node_modules/acorn-walk": {
-      "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.0.tgz",
-      "integrity": "sha512-FS7hV565M5l1R08MXqo8odwMTB02C2UqzB17RVgu9EyuYFBqJZ3/ZY97sQD5FewVu1UyDFc1yztUDrAwT0EypA==",
-      "dev": true,
+        "debug": "^4.3.4"
+      },
       "engines": {
-        "node": ">=0.4.0"
+        "node": ">= 14"
       }
     },
     "node_modules/nightwatch/node_modules/ci-info": {
@@ -10264,42 +10235,34 @@
       "dev": true
     },
     "node_modules/nightwatch/node_modules/cssstyle": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-3.0.0.tgz",
-      "integrity": "sha512-N4u2ABATi3Qplzf0hWbVCdjenim8F3ojEXpBDF5hBpjzW182MjNGLqfmQ0SkSPeQ+V86ZXgeH8aXj6kayd4jgg==",
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.0.1.tgz",
+      "integrity": "sha512-8ZYiJ3A/3OkDd093CBT/0UKDWry7ak4BdPTFP2+QEP7cmhouyq/Up709ASSj2cK02BbZiMgk7kYjZNS4QP5qrQ==",
       "dev": true,
       "dependencies": {
         "rrweb-cssom": "^0.6.0"
       },
       "engines": {
-        "node": ">=14"
+        "node": ">=18"
       }
     },
-    "node_modules/nightwatch/node_modules/data-urls": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-4.0.0.tgz",
-      "integrity": "sha512-/mMTei/JXPqvFqQtfyTowxmJVwr2PVAeCcDxyFf6LhoOu/09TX2OX3kb2wzi4DMXcfj4OItwDOnhl5oziPnT6g==",
-      "dev": true,
-      "dependencies": {
-        "abab": "^2.0.6",
-        "whatwg-mimetype": "^3.0.0",
-        "whatwg-url": "^12.0.0"
-      },
-      "engines": {
-        "node": ">=14"
-      }
+    "node_modules/nightwatch/node_modules/cssstyle/node_modules/rrweb-cssom": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.6.0.tgz",
+      "integrity": "sha512-APM0Gt1KoXBz0iIkkdB/kfvGOwC4UuJFeG/c+yV7wSc7q96cG/kJ0HiYCnzivD9SB53cLV1MlHFNfOuPaadYSw==",
+      "dev": true
     },
-    "node_modules/nightwatch/node_modules/domexception": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/domexception/-/domexception-4.0.0.tgz",
-      "integrity": "sha512-A2is4PLG+eeSfoTMA95/s4pvAoSo2mKtiM5jlHkAVewmiO8ISFTFKZjH7UAM1Atli/OT/7JHOrJRJiMKUZKYBw==",
-      "deprecated": "Use your platform's native DOMException instead",
+    "node_modules/nightwatch/node_modules/data-urls": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-5.0.0.tgz",
+      "integrity": "sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==",
       "dev": true,
       "dependencies": {
-        "webidl-conversions": "^7.0.0"
+        "whatwg-mimetype": "^4.0.0",
+        "whatwg-url": "^14.0.0"
       },
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/nightwatch/node_modules/entities": {
@@ -10315,29 +10278,41 @@
       }
     },
     "node_modules/nightwatch/node_modules/html-encoding-sniffer": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz",
-      "integrity": "sha512-oWv4T4yJ52iKrufjnyZPkrN0CH3QnrUqdB6In1g5Fe1mia8GmF36gnfNySxoZtxD5+NmYw1EElVXiBk93UeskA==",
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
+      "integrity": "sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==",
       "dev": true,
       "dependencies": {
-        "whatwg-encoding": "^2.0.0"
+        "whatwg-encoding": "^3.1.1"
       },
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/nightwatch/node_modules/http-proxy-agent": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-5.0.0.tgz",
-      "integrity": "sha512-n2hY8YdoRE1i7r6M0w9DIw5GgZN0G25P8zLCRQ8rjXtTU3vsNFBI/vWK/UIeE6g5MUUz6avwAPXmL6Fy9D/90w==",
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
+      "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
       "dev": true,
       "dependencies": {
-        "@tootallnate/once": "2",
-        "agent-base": "6",
+        "agent-base": "^7.1.0",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/nightwatch/node_modules/https-proxy-agent": {
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.5.tgz",
+      "integrity": "sha512-1e4Wqeblerz+tMKPIq2EMGiiWW1dIjZOksyHWSUm1rmuvw/how9hBHZ38lAGj5ID4Ik6EdkOw7NmWPy6LAwalw==",
+      "dev": true,
+      "dependencies": {
+        "agent-base": "^7.0.2",
         "debug": "4"
       },
       "engines": {
-        "node": ">= 6"
+        "node": ">= 14"
       }
     },
     "node_modules/nightwatch/node_modules/iconv-lite": {
@@ -10353,43 +10328,38 @@
       }
     },
     "node_modules/nightwatch/node_modules/jsdom": {
-      "version": "21.1.2",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-21.1.2.tgz",
-      "integrity": "sha512-sCpFmK2jv+1sjff4u7fzft+pUh2KSUbUrEHYHyfSIbGTIcmnjyp83qg6qLwdJ/I3LpTXx33ACxeRL7Lsyc6lGQ==",
+      "version": "24.1.1",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-24.1.1.tgz",
+      "integrity": "sha512-5O1wWV99Jhq4DV7rCLIoZ/UIhyQeDR7wHVyZAHAshbrvZsLs+Xzz7gtwnlJTJDjleiTKh54F4dXrX70vJQTyJQ==",
       "dev": true,
       "dependencies": {
-        "abab": "^2.0.6",
-        "acorn": "^8.8.2",
-        "acorn-globals": "^7.0.0",
-        "cssstyle": "^3.0.0",
-        "data-urls": "^4.0.0",
+        "cssstyle": "^4.0.1",
+        "data-urls": "^5.0.0",
         "decimal.js": "^10.4.3",
-        "domexception": "^4.0.0",
-        "escodegen": "^2.0.0",
         "form-data": "^4.0.0",
-        "html-encoding-sniffer": "^3.0.0",
-        "http-proxy-agent": "^5.0.0",
-        "https-proxy-agent": "^5.0.1",
+        "html-encoding-sniffer": "^4.0.0",
+        "http-proxy-agent": "^7.0.2",
+        "https-proxy-agent": "^7.0.5",
         "is-potential-custom-element-name": "^1.0.1",
-        "nwsapi": "^2.2.4",
+        "nwsapi": "^2.2.12",
         "parse5": "^7.1.2",
-        "rrweb-cssom": "^0.6.0",
+        "rrweb-cssom": "^0.7.1",
         "saxes": "^6.0.0",
         "symbol-tree": "^3.2.4",
-        "tough-cookie": "^4.1.2",
-        "w3c-xmlserializer": "^4.0.0",
+        "tough-cookie": "^4.1.4",
+        "w3c-xmlserializer": "^5.0.0",
         "webidl-conversions": "^7.0.0",
-        "whatwg-encoding": "^2.0.0",
-        "whatwg-mimetype": "^3.0.0",
-        "whatwg-url": "^12.0.1",
-        "ws": "^8.13.0",
-        "xml-name-validator": "^4.0.0"
+        "whatwg-encoding": "^3.1.1",
+        "whatwg-mimetype": "^4.0.0",
+        "whatwg-url": "^14.0.0",
+        "ws": "^8.18.0",
+        "xml-name-validator": "^5.0.0"
       },
       "engines": {
-        "node": ">=14"
+        "node": ">=18"
       },
       "peerDependencies": {
-        "canvas": "^2.5.0"
+        "canvas": "^2.11.2"
       },
       "peerDependenciesMeta": {
         "canvas": {
@@ -10455,27 +10425,27 @@
       }
     },
     "node_modules/nightwatch/node_modules/tr46": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/tr46/-/tr46-4.1.1.tgz",
-      "integrity": "sha512-2lv/66T7e5yNyhAAC4NaKe5nVavzuGJQVVtRYLyQ2OI8tsJ61PMLlelehb0wi2Hx6+hT/OJUWZcw8MjlSRnxvw==",
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.0.0.tgz",
+      "integrity": "sha512-tk2G5R2KRwBd+ZN0zaEXpmzdKyOYksXwywulIX95MBODjSzMIuQnQ3m8JxgbhnL1LeVo7lqQKsYa1O3Htl7K5g==",
       "dev": true,
       "dependencies": {
-        "punycode": "^2.3.0"
+        "punycode": "^2.3.1"
       },
       "engines": {
-        "node": ">=14"
+        "node": ">=18"
       }
     },
     "node_modules/nightwatch/node_modules/w3c-xmlserializer": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz",
-      "integrity": "sha512-d+BFHzbiCx6zGfz0HyQ6Rg69w9k19nviJspaj4yNscGjrHu94sVP+aRm75yEbCh+r2/yR+7q6hux9LVtbuTGBw==",
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",
+      "integrity": "sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==",
       "dev": true,
       "dependencies": {
-        "xml-name-validator": "^4.0.0"
+        "xml-name-validator": "^5.0.0"
       },
       "engines": {
-        "node": ">=14"
+        "node": ">=18"
       }
     },
     "node_modules/nightwatch/node_modules/webidl-conversions": {
@@ -10488,43 +10458,43 @@
       }
     },
     "node_modules/nightwatch/node_modules/whatwg-encoding": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz",
-      "integrity": "sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==",
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
+      "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
       "dev": true,
       "dependencies": {
         "iconv-lite": "0.6.3"
       },
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/nightwatch/node_modules/whatwg-mimetype": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz",
-      "integrity": "sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==",
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
+      "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
       "dev": true,
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/nightwatch/node_modules/whatwg-url": {
-      "version": "12.0.1",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-12.0.1.tgz",
-      "integrity": "sha512-Ed/LrqB8EPlGxjS+TrsXcpUond1mhccS3pchLhzSgPCnTimUCKj3IZE75pAs5m6heB2U2TMerKFUXheyHY+VDQ==",
+      "version": "14.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.0.0.tgz",
+      "integrity": "sha512-1lfMEm2IEr7RIV+f4lUNPOqfFL+pO+Xw3fJSqmjX9AbXcXcYOkCe1P6+9VBZB6n94af16NfZf+sSk0JCBZC9aw==",
       "dev": true,
       "dependencies": {
-        "tr46": "^4.1.1",
+        "tr46": "^5.0.0",
         "webidl-conversions": "^7.0.0"
       },
       "engines": {
-        "node": ">=14"
+        "node": ">=18"
       }
     },
     "node_modules/nightwatch/node_modules/ws": {
-      "version": "8.14.2",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.14.2.tgz",
-      "integrity": "sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g==",
+      "version": "8.18.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz",
+      "integrity": "sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==",
       "dev": true,
       "engines": {
         "node": ">=10.0.0"
@@ -10542,6 +10512,15 @@
         }
       }
     },
+    "node_modules/nightwatch/node_modules/xml-name-validator": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-5.0.0.tgz",
+      "integrity": "sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==",
+      "dev": true,
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/nightwatch/node_modules/yallist": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
@@ -10549,45 +10528,36 @@
       "dev": true
     },
     "node_modules/nise": {
-      "version": "5.1.5",
-      "resolved": "https://registry.npmjs.org/nise/-/nise-5.1.5.tgz",
-      "integrity": "sha512-VJuPIfUFaXNRzETTQEEItTOP8Y171ijr+JLq42wHes3DiryR8vT+1TXQW/Rx8JNUhyYYWyIvjXTU6dOhJcs9Nw==",
+      "version": "5.1.9",
+      "resolved": "https://registry.npmjs.org/nise/-/nise-5.1.9.tgz",
+      "integrity": "sha512-qOnoujW4SV6e40dYxJOb3uvuoPHtmLzIk4TFo+j0jPJoC+5Z9xja5qH5JZobEPsa8+YYphMrOSwnrshEhG2qww==",
       "dev": true,
       "dependencies": {
-        "@sinonjs/commons": "^2.0.0",
-        "@sinonjs/fake-timers": "^10.0.2",
-        "@sinonjs/text-encoding": "^0.7.1",
-        "just-extend": "^4.0.2",
-        "path-to-regexp": "^1.7.0"
+        "@sinonjs/commons": "^3.0.0",
+        "@sinonjs/fake-timers": "^11.2.2",
+        "@sinonjs/text-encoding": "^0.7.2",
+        "just-extend": "^6.2.0",
+        "path-to-regexp": "^6.2.1"
       }
     },
     "node_modules/nise/node_modules/@sinonjs/commons": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-2.0.0.tgz",
-      "integrity": "sha512-uLa0j859mMrg2slwQYdO/AkrOfmH+X6LTVmNTS9CqexuE2IvVORIkSpJLqePAbEnKJ77aMmCwr1NUZ57120Xcg==",
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.1.tgz",
+      "integrity": "sha512-K3mCHKQ9sVh8o1C9cxkwxaOmXoAMlDxC1mYyHrjqOWEcBjYr76t96zL2zlj5dUGZ3HSw240X1qgH3Mjf1yJWpQ==",
       "dev": true,
       "dependencies": {
         "type-detect": "4.0.8"
       }
     },
     "node_modules/nise/node_modules/@sinonjs/fake-timers": {
-      "version": "10.3.0",
-      "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-10.3.0.tgz",
-      "integrity": "sha512-V4BG07kuYSUkTCSBHG8G8TNhM+F19jXFWnQtzj+we8DrkpSBCee9Z3Ms8yiGer/dlmhe35/Xdgyo3/0rQKg7YA==",
+      "version": "11.2.2",
+      "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-11.2.2.tgz",
+      "integrity": "sha512-G2piCSxQ7oWOxwGSAyFHfPIsyeJGXYtc6mFbnFA+kRXkiEnTl8c/8jul2S329iFBnDI9HGoeWWAZvuvOkZccgw==",
       "dev": true,
       "dependencies": {
         "@sinonjs/commons": "^3.0.0"
       }
     },
-    "node_modules/nise/node_modules/@sinonjs/fake-timers/node_modules/@sinonjs/commons": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.0.tgz",
-      "integrity": "sha512-jXBtWAF4vmdNmZgD5FoKsVLv3rPgDnLgPbU84LIJ3otV44vJlDRokVng5v8NFJdCf/da9legHcKaRuZs4L7faA==",
-      "dev": true,
-      "dependencies": {
-        "type-detect": "4.0.8"
-      }
-    },
     "node_modules/node-addon-api": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-3.2.1.tgz",
@@ -10596,9 +10566,9 @@
       "optional": true
     },
     "node_modules/node-gyp-build": {
-      "version": "4.7.1",
-      "resolved": "https://registry.npmjs.org/node-gyp-build/-/node-gyp-build-4.7.1.tgz",
-      "integrity": "sha512-wTSrZ+8lsRRa3I3H8Xr65dLWSgCvY2l4AOnaeKdPA9TB/WYMPaTcrzf3rXvFoVvjKNVnu0CcWSx54qq9GKRUYg==",
+      "version": "4.8.1",
+      "resolved": "https://registry.npmjs.org/node-gyp-build/-/node-gyp-build-4.8.1.tgz",
+      "integrity": "sha512-OSs33Z9yWr148JZcbZd5WiAXhh/n9z8TxQcdMhIOlpN9AhWpLfvVFO73+m77bBABQMaY9XSvIa+qk0jlI7Gcaw==",
       "dev": true,
       "optional": true,
       "bin": {
@@ -10608,15 +10578,15 @@
       }
     },
     "node_modules/node-releases": {
-      "version": "2.0.14",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz",
-      "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==",
+      "version": "2.0.18",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.18.tgz",
+      "integrity": "sha512-d9VeXT4SJ7ZeOqGX6R5EM022wpL+eWPooLI+5UpWn2jCT1aosUQEhQP214x33Wkwx3JQMvIm+tIoVOdodFS40g==",
       "dev": true
     },
     "node_modules/nopt": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/nopt/-/nopt-7.2.0.tgz",
-      "integrity": "sha512-CVDtwCdhYIvnAzFoJ6NJ6dX3oga9/HyciQDnG1vQDjSLMeKLJ4A93ZqYKDrgYSr1FBY5/hMYC+2VCi24pgpkGA==",
+      "version": "7.2.1",
+      "resolved": "https://registry.npmjs.org/nopt/-/nopt-7.2.1.tgz",
+      "integrity": "sha512-taM24ViiimT/XntxbPyJQzCG+p4EKOpgD3mxFwW38mGjVUrfERQOeY4EDHjdnptttfHuHQXFx+lTP08Q+mLa/w==",
       "dev": true,
       "dependencies": {
         "abbrev": "^2.0.0"
@@ -10855,9 +10825,9 @@
       }
     },
     "node_modules/npm-run-path": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.2.0.tgz",
-      "integrity": "sha512-W4/tgAXFqFA0iL7fk0+uQ3g7wkL8xJmx3XdK0VGb4cHW//eZTtKGvFBBoRKVTpY7n6ze4NL9ly7rgXcHufqXKg==",
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.3.0.tgz",
+      "integrity": "sha512-ppwTtiJZq0O/ai0z7yfudtBpWIoxM8yE6nHi1X47eFR2EWORqfbu6CnPlNsjeN683eT0qG6H/Pyf9fCcvjnnnQ==",
       "dev": true,
       "dependencies": {
         "path-key": "^4.0.0"
@@ -10894,9 +10864,9 @@
       }
     },
     "node_modules/nwsapi": {
-      "version": "2.2.7",
-      "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.7.tgz",
-      "integrity": "sha512-ub5E4+FBPKwAZx0UwIQOjYWGHTEq5sPqHQNRN8Z9e4A7u3Tj1weLJsL59yH9vmvqEtBHaOmT6cYQKIZOxp35FQ==",
+      "version": "2.2.12",
+      "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.12.tgz",
+      "integrity": "sha512-qXDmcVlZV4XRtKFzddidpfVP4oMSGhga+xdMc25mv8kaLUHtgzCDhUxkrN8exkGdTlLNaXj7CV3GtON7zuGZ+w==",
       "dev": true
     },
     "node_modules/object-assign": {
@@ -10909,22 +10879,25 @@
       }
     },
     "node_modules/object-inspect": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz",
-      "integrity": "sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==",
+      "version": "1.13.2",
+      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.2.tgz",
+      "integrity": "sha512-IRZSRuzJiynemAXPYtPe5BoI/RESNYR7TYm50MC5Mqbd3Jmw5y790sErYw3V6SryFJD64b74qQQs9wn5Bg/k3g==",
       "dev": true,
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/object-is": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.5.tgz",
-      "integrity": "sha512-3cyDsyHgtmi7I7DfSSI2LDp6SK2lwvtbg0p0R1e0RvTqF5ceGx+K2dfSjm1bKDMVCFEDAQvy+o8c6a7VujOddw==",
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.6.tgz",
+      "integrity": "sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.1.3"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -10961,14 +10934,15 @@
       }
     },
     "node_modules/object.fromentries": {
-      "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.7.tgz",
-      "integrity": "sha512-UPbPHML6sL8PI/mOqPwsH4G6iyXcCGzLin8KvEPenOZN5lpCNBZZQ+V62vdjB1mQHrmqGQt5/OJzemUA+KJmEA==",
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.8.tgz",
+      "integrity": "sha512-k6E21FzySsSK5a21KRADBd/NGneRegFO5pLHfdQLpRDETUNJueLXs3WCzyQ3tFRDYgbq3KHGXfTbi2bs8WQ6rQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -10978,26 +10952,28 @@
       }
     },
     "node_modules/object.groupby": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/object.groupby/-/object.groupby-1.0.1.tgz",
-      "integrity": "sha512-HqaQtqLnp/8Bn4GL16cj+CUYbnpe1bh0TtEaWvybszDG4tgxCJuRpV8VGuvNaI1fAnI4lUJzDG55MXcOH4JZcQ==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/object.groupby/-/object.groupby-1.0.3.tgz",
+      "integrity": "sha512-+Lhy3TQTuzXI5hevh8sBGqbmurHbbIjAi0Z4S63nthVLmLxfbj4T54a4CfZrXIrt9iP4mVAPYMo/v99taj3wjQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
       }
     },
     "node_modules/object.values": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.1.7.tgz",
-      "integrity": "sha512-aU6xnDFYT3x17e/f0IiiwlGPTy2jzMySGfUB4fq6z7CV8l85CWHDk5ErhyhpfDHhrOMwGFhSQkhMGHaIotA6Ng==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.0.tgz",
+      "integrity": "sha512-yBYjY9QX2hnRmZHAjG/f13MzmBzxzYgQhFrke06TTyKY5zSTEqkOeukBzIdVA3j3ulu8Qa3MbVFShV7T2RmGtQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -11057,17 +11033,17 @@
       }
     },
     "node_modules/optionator": {
-      "version": "0.9.3",
-      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz",
-      "integrity": "sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==",
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
+      "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==",
       "dev": true,
       "dependencies": {
-        "@aashutoshrathi/word-wrap": "^1.2.3",
         "deep-is": "^0.1.3",
         "fast-levenshtein": "^2.0.6",
         "levn": "^0.4.1",
         "prelude-ls": "^1.2.1",
-        "type-check": "^0.4.0"
+        "type-check": "^0.4.0",
+        "word-wrap": "^1.2.5"
       },
       "engines": {
         "node": ">= 0.8.0"
@@ -11136,9 +11112,9 @@
       }
     },
     "node_modules/pac-proxy-agent": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/pac-proxy-agent/-/pac-proxy-agent-7.0.1.tgz",
-      "integrity": "sha512-ASV8yU4LLKBAjqIPMbrgtaKIvxQri/yh2OpI+S6hVa9JRkUI3Y3NPFbfngDtY7oFtSMD3w31Xns89mDa3Feo5A==",
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/pac-proxy-agent/-/pac-proxy-agent-7.0.2.tgz",
+      "integrity": "sha512-BFi3vZnO9X5Qt6NRz7ZOaPja3ic0PhlsmCRYLOpN11+mWBCR6XJDqW5RF3j8jm4WGGQZtBA+bTfxYzeKW73eHg==",
       "dev": true,
       "dependencies": {
         "@tootallnate/quickjs-emscripten": "^0.23.0",
@@ -11146,18 +11122,18 @@
         "debug": "^4.3.4",
         "get-uri": "^6.0.1",
         "http-proxy-agent": "^7.0.0",
-        "https-proxy-agent": "^7.0.2",
-        "pac-resolver": "^7.0.0",
-        "socks-proxy-agent": "^8.0.2"
+        "https-proxy-agent": "^7.0.5",
+        "pac-resolver": "^7.0.1",
+        "socks-proxy-agent": "^8.0.4"
       },
       "engines": {
         "node": ">= 14"
       }
     },
     "node_modules/pac-proxy-agent/node_modules/agent-base": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
-      "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.1.tgz",
+      "integrity": "sha512-H0TSyFNDMomMNJQBn8wFV5YC/2eJ+VXECwOadZJT554xP6cODZHPX3H9QMQECxvrgiSOP1pHjy1sMWQVYJOUOA==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4"
@@ -11180,9 +11156,9 @@
       }
     },
     "node_modules/pac-proxy-agent/node_modules/https-proxy-agent": {
-      "version": "7.0.4",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.4.tgz",
-      "integrity": "sha512-wlwpilI7YdjSkWaQ/7omYBMTliDcmCN8OLihO6I9B86g06lMyAoqgoDpV0XqoaPOKj+0DIdAvnsWfyAAhmimcg==",
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.5.tgz",
+      "integrity": "sha512-1e4Wqeblerz+tMKPIq2EMGiiWW1dIjZOksyHWSUm1rmuvw/how9hBHZ38lAGj5ID4Ik6EdkOw7NmWPy6LAwalw==",
       "dev": true,
       "dependencies": {
         "agent-base": "^7.0.2",
@@ -11205,6 +11181,12 @@
         "node": ">= 14"
       }
     },
+    "node_modules/package-json-from-dist": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.0.tgz",
+      "integrity": "sha512-dATvCeZN/8wQsGywez1mzHtTlP22H8OEfPrVMLNr4/eGa+ijtLn/6M5f0dY8UKNrC2O9UCU6SSoG3qRKnt7STw==",
+      "dev": true
+    },
     "node_modules/pako": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
@@ -11296,43 +11278,31 @@
       "dev": true
     },
     "node_modules/path-scurry": {
-      "version": "1.10.1",
-      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.10.1.tgz",
-      "integrity": "sha512-MkhCqzzBEpPvxxQ71Md0b1Kk51W01lrYvlMzSUaIzNsODdd7mqhiimSZlr+VegAz5Z6Vzt9Xg2ttE//XBhH3EQ==",
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
+      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
       "dev": true,
       "dependencies": {
-        "lru-cache": "^9.1.1 || ^10.0.0",
+        "lru-cache": "^10.2.0",
         "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
       },
       "engines": {
-        "node": ">=16 || 14 >=14.17"
+        "node": ">=16 || 14 >=14.18"
       },
       "funding": {
         "url": "https://github.com/sponsors/isaacs"
       }
     },
     "node_modules/path-scurry/node_modules/lru-cache": {
-      "version": "10.1.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.1.0.tgz",
-      "integrity": "sha512-/1clY/ui8CzjKFyjdvwPWJUYKiFVXG2I2cY0ssG7h4+hwk+XOIX7ZSG9Q7TW8TW3Kp3BUSqgFWBLgL4PJ+Blag==",
-      "dev": true,
-      "engines": {
-        "node": "14 || >=16.14"
-      }
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+      "dev": true
     },
     "node_modules/path-to-regexp": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz",
-      "integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==",
-      "dev": true,
-      "dependencies": {
-        "isarray": "0.0.1"
-      }
-    },
-    "node_modules/path-to-regexp/node_modules/isarray": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-      "integrity": "sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ==",
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.2.2.tgz",
+      "integrity": "sha512-GQX3SSMokngb36+whdpRXE+3f9V8UzyAorlYvOGx87ufGHehNTn5lCxrKtLyZ4Yl/wEKnNnr98ZzOwwDZV5ogw==",
       "dev": true
     },
     "node_modules/path-type": {
@@ -11345,9 +11315,9 @@
       }
     },
     "node_modules/pathe": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/pathe/-/pathe-1.1.1.tgz",
-      "integrity": "sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q==",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/pathe/-/pathe-1.1.2.tgz",
+      "integrity": "sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==",
       "dev": true
     },
     "node_modules/pathval": {
@@ -11366,9 +11336,9 @@
       "dev": true
     },
     "node_modules/picocolors": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
-      "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz",
+      "integrity": "sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew=="
     },
     "node_modules/picomatch": {
       "version": "2.3.1",
@@ -11404,15 +11374,10 @@
       }
     },
     "node_modules/piscina": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/piscina/-/piscina-3.2.0.tgz",
-      "integrity": "sha512-yn/jMdHRw+q2ZJhFhyqsmANcbF6V2QwmD84c6xRau+QpQOmtrBCoRGdvTfeuFDYXB5W2m6MfLkjkvQa9lUSmIA==",
+      "version": "4.6.1",
+      "resolved": "https://registry.npmjs.org/piscina/-/piscina-4.6.1.tgz",
+      "integrity": "sha512-z30AwWGtQE+Apr+2WBZensP2lIvwoaMcOPkQlIEmSGMJNUvaYACylPYrQM6wSdUNJlnDVMSpLv7xTMJqlVshOA==",
       "dev": true,
-      "dependencies": {
-        "eventemitter-asyncresource": "^1.0.0",
-        "hdr-histogram-js": "^2.0.1",
-        "hdr-histogram-percentiles-obj": "^3.0.0"
-      },
       "optionalDependencies": {
         "nice-napi": "^1.0.2"
       }
@@ -11430,14 +11395,14 @@
       }
     },
     "node_modules/pkg-types": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.0.3.tgz",
-      "integrity": "sha512-nN7pYi0AQqJnoLPC9eHFQ8AcyaixBUOwvqc5TDnIKCMEE6I0y8P7OKA7fPexsXGCGxQDl/cmrLAp26LhcwxZ4A==",
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.1.3.tgz",
+      "integrity": "sha512-+JrgthZG6m3ckicaOB74TwQ+tBWsFl3qVQg7mN8ulwSOElJ7gBhKzj2VkCPnZ4NlF6kEquYU+RIYNVAvzd54UA==",
       "dev": true,
       "dependencies": {
-        "jsonc-parser": "^3.2.0",
-        "mlly": "^1.2.0",
-        "pathe": "^1.1.0"
+        "confbox": "^0.1.7",
+        "mlly": "^1.7.1",
+        "pathe": "^1.1.2"
       }
     },
     "node_modules/please-upgrade-node": {
@@ -11449,10 +11414,19 @@
         "semver-compare": "^1.0.0"
       }
     },
+    "node_modules/possible-typed-array-names": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz",
+      "integrity": "sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==",
+      "dev": true,
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/postcss": {
-      "version": "8.4.32",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.32.tgz",
-      "integrity": "sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==",
+      "version": "8.4.40",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.40.tgz",
+      "integrity": "sha512-YF2kKIUzAofPMpfH6hOi2cGnv/HrUlfucspc7pDyvv7kGdqXrfj8SCl/t8owkEgKEuu8ZcRjSOxFxVLqwChZ2Q==",
       "funding": [
         {
           "type": "opencollective",
@@ -11469,8 +11443,8 @@
       ],
       "dependencies": {
         "nanoid": "^3.3.7",
-        "picocolors": "^1.0.0",
-        "source-map-js": "^1.0.2"
+        "picocolors": "^1.0.1",
+        "source-map-js": "^1.2.0"
       },
       "engines": {
         "node": "^10 || ^12 || >=14"
@@ -11496,18 +11470,18 @@
       "dev": true
     },
     "node_modules/postcss-pxtorem": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-pxtorem/-/postcss-pxtorem-6.0.0.tgz",
-      "integrity": "sha512-ZRXrD7MLLjLk2RNGV6UA4f5Y7gy+a/j1EqjAfp9NdcNYVjUMvg5HTYduTjSkKBkRkfqbg/iKrjMO70V4g1LZeg==",
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-pxtorem/-/postcss-pxtorem-6.1.0.tgz",
+      "integrity": "sha512-ROODSNci9ADal3zUcPHOF/K83TiCgNSPXQFSbwyPHNV8ioHIE4SaC+FPOufd8jsr5jV2uIz29v1Uqy1c4ov42g==",
       "dev": true,
       "peerDependencies": {
         "postcss": "^8.0.0"
       }
     },
     "node_modules/postcss-resolve-nested-selector": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz",
-      "integrity": "sha512-HvExULSwLqHLgUy1rl3ANIqCsvMS0WHss2UOsXhXnQaZ9VCc2oBvIpXrl00IUFT5ZDITME0o6oiXeiHr2SAIfw==",
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.4.tgz",
+      "integrity": "sha512-R6vHqZWgVnTAPq0C+xjyHfEZqfIYboCBVSy24MjxEDm+tIh1BU4O6o7DP7AA7kHzf136d+Qc5duI4tlpHjixDw==",
       "dev": true
     },
     "node_modules/postcss-safe-parser": {
@@ -11563,9 +11537,9 @@
       }
     },
     "node_modules/postcss-selector-parser": {
-      "version": "6.0.13",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
-      "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
+      "version": "6.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.1.tgz",
+      "integrity": "sha512-b4dlw/9V8A71rLIDsSwVmak9z2DuBUB7CA1/wSdelNEzqsjoSPeADTWNO09lpH49Diy3/JIZ2bSPB1dI3LJCHg==",
       "dev": true,
       "dependencies": {
         "cssesc": "^3.0.0",
@@ -11581,23 +11555,6 @@
       "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
       "dev": true
     },
-    "node_modules/postcss/node_modules/nanoid": {
-      "version": "3.3.7",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
-      "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
-      "bin": {
-        "nanoid": "bin/nanoid.cjs"
-      },
-      "engines": {
-        "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
-      }
-    },
     "node_modules/prelude-ls": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
@@ -11608,9 +11565,9 @@
       }
     },
     "node_modules/prettier": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.1.0.tgz",
-      "integrity": "sha512-TQLvXjq5IAibjh8EpBIkNKxO749UEWABoiIZehEPiY4GNpVdhaFKqSTu+QrlU6D2dPAfubRmtJTi4K4YkQ5eXw==",
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
+      "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
       "dev": true,
       "peer": true,
       "bin": {
@@ -11711,9 +11668,9 @@
       }
     },
     "node_modules/proxy-agent/node_modules/agent-base": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
-      "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.1.tgz",
+      "integrity": "sha512-H0TSyFNDMomMNJQBn8wFV5YC/2eJ+VXECwOadZJT554xP6cODZHPX3H9QMQECxvrgiSOP1pHjy1sMWQVYJOUOA==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4"
@@ -11736,9 +11693,9 @@
       }
     },
     "node_modules/proxy-agent/node_modules/https-proxy-agent": {
-      "version": "7.0.4",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.4.tgz",
-      "integrity": "sha512-wlwpilI7YdjSkWaQ/7omYBMTliDcmCN8OLihO6I9B86g06lMyAoqgoDpV0XqoaPOKj+0DIdAvnsWfyAAhmimcg==",
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.5.tgz",
+      "integrity": "sha512-1e4Wqeblerz+tMKPIq2EMGiiWW1dIjZOksyHWSUm1rmuvw/how9hBHZ38lAGj5ID4Ik6EdkOw7NmWPy6LAwalw==",
       "dev": true,
       "dependencies": {
         "agent-base": "^7.0.2",
@@ -11913,16 +11870,16 @@
       }
     },
     "node_modules/puppeteer": {
-      "version": "22.10.0",
-      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.10.0.tgz",
-      "integrity": "sha512-ZOkZd6a6t0BdKcWb0wAYHWQqCfdlN1PPnXOmg/XNrbo6gJhYWFX4qCNb6ahSn8TpAqBqLCoD4Q010F7GwOM7mA==",
+      "version": "22.15.0",
+      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.15.0.tgz",
+      "integrity": "sha512-XjCY1SiSEi1T7iSYuxS82ft85kwDJUS7wj1Z0eGVXKdtr5g4xnVcbjwxhq5xBnpK/E7x1VZZoJDxpjAOasHT4Q==",
       "dev": true,
       "hasInstallScript": true,
       "dependencies": {
-        "@puppeteer/browsers": "2.2.3",
-        "cosmiconfig": "9.0.0",
-        "devtools-protocol": "0.0.1286932",
-        "puppeteer-core": "22.10.0"
+        "@puppeteer/browsers": "2.3.0",
+        "cosmiconfig": "^9.0.0",
+        "devtools-protocol": "0.0.1312386",
+        "puppeteer-core": "22.15.0"
       },
       "bin": {
         "puppeteer": "lib/esm/puppeteer/node/cli.js"
@@ -11932,31 +11889,31 @@
       }
     },
     "node_modules/puppeteer-core": {
-      "version": "22.10.0",
-      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.10.0.tgz",
-      "integrity": "sha512-I54J4Vy4I07UHsgB1QSmuFoF7KNQjJWcvFBPhtY+ezMdBfwgGDr8dzYrJa11aPgP9kxIUHjhktcMmmfJkOAtTw==",
+      "version": "22.15.0",
+      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.15.0.tgz",
+      "integrity": "sha512-cHArnywCiAAVXa3t4GGL2vttNxh7GqXtIYGym99egkNJ3oG//wL9LkvO4WE8W1TJe95t1F1ocu9X4xWaGsOKOA==",
       "dev": true,
       "dependencies": {
-        "@puppeteer/browsers": "2.2.3",
-        "chromium-bidi": "0.5.19",
-        "debug": "4.3.4",
-        "devtools-protocol": "0.0.1286932",
-        "ws": "8.17.0"
+        "@puppeteer/browsers": "2.3.0",
+        "chromium-bidi": "0.6.3",
+        "debug": "^4.3.6",
+        "devtools-protocol": "0.0.1312386",
+        "ws": "^8.18.0"
       },
       "engines": {
         "node": ">=18"
       }
     },
     "node_modules/puppeteer-core/node_modules/devtools-protocol": {
-      "version": "0.0.1286932",
-      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1286932.tgz",
-      "integrity": "sha512-wu58HMQll9voDjR4NlPyoDEw1syfzaBNHymMMZ/QOXiHRNluOnDgu9hp1yHOKYoMlxCh4lSSiugLITe6Fvu1eA==",
+      "version": "0.0.1312386",
+      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1312386.tgz",
+      "integrity": "sha512-DPnhUXvmvKT2dFA/j7B+riVLUt9Q6RKJlcppojL5CoRywJJKLDYnRlw0gTFKfgDPHP5E04UoB71SxoJlVZy8FA==",
       "dev": true
     },
     "node_modules/puppeteer-core/node_modules/ws": {
-      "version": "8.17.0",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz",
-      "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==",
+      "version": "8.18.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz",
+      "integrity": "sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==",
       "dev": true,
       "engines": {
         "node": ">=10.0.0"
@@ -11974,36 +11931,10 @@
         }
       }
     },
-    "node_modules/puppeteer/node_modules/cosmiconfig": {
-      "version": "9.0.0",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
-      "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
-      "dev": true,
-      "dependencies": {
-        "env-paths": "^2.2.1",
-        "import-fresh": "^3.3.0",
-        "js-yaml": "^4.1.0",
-        "parse-json": "^5.2.0"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/d-fischer"
-      },
-      "peerDependencies": {
-        "typescript": ">=4.9.5"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/puppeteer/node_modules/devtools-protocol": {
-      "version": "0.0.1286932",
-      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1286932.tgz",
-      "integrity": "sha512-wu58HMQll9voDjR4NlPyoDEw1syfzaBNHymMMZ/QOXiHRNluOnDgu9hp1yHOKYoMlxCh4lSSiugLITe6Fvu1eA==",
+      "version": "0.0.1312386",
+      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1312386.tgz",
+      "integrity": "sha512-DPnhUXvmvKT2dFA/j7B+riVLUt9Q6RKJlcppojL5CoRywJJKLDYnRlw0gTFKfgDPHP5E04UoB71SxoJlVZy8FA==",
       "dev": true
     },
     "node_modules/querystringify": {
@@ -12048,9 +11979,9 @@
       }
     },
     "node_modules/react-is": {
-      "version": "18.2.0",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
-      "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==",
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+      "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
       "dev": true
     },
     "node_modules/read-pkg": {
@@ -12151,6 +12082,18 @@
         "node": ">= 4"
       }
     },
+    "node_modules/recast/node_modules/ast-types": {
+      "version": "0.16.1",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.16.1.tgz",
+      "integrity": "sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==",
+      "dev": true,
+      "dependencies": {
+        "tslib": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/regenerate": {
       "version": "1.4.2",
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",
@@ -12170,9 +12113,9 @@
       }
     },
     "node_modules/regenerator-runtime": {
-      "version": "0.14.0",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz",
-      "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==",
+      "version": "0.14.1",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
+      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==",
       "dev": true
     },
     "node_modules/regenerator-transform": {
@@ -12185,14 +12128,15 @@
       }
     },
     "node_modules/regexp.prototype.flags": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz",
-      "integrity": "sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==",
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.2.tgz",
+      "integrity": "sha512-NcDiDkTLuPR+++OCKB0nWafEmhg/Da8aUPLPMQbK+bxKKCm1/S5he+AqYa4PlMCVBalb4/yxIRub6qkEx5yJbw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "set-function-name": "^2.0.0"
+        "call-bind": "^1.0.6",
+        "define-properties": "^1.2.1",
+        "es-errors": "^1.3.0",
+        "set-function-name": "^2.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -12302,19 +12246,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/resolve-global": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/resolve-global/-/resolve-global-1.0.0.tgz",
-      "integrity": "sha512-zFa12V4OLtT5XUX/Q4VLvTfBf+Ok0SPc1FNGM/z9ctUdiU618qwKpWnd0CHs3+RqROfyEg/DhuHbMWYqcgljEw==",
-      "dev": true,
-      "optional": true,
-      "dependencies": {
-        "global-dirs": "^0.1.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/restore-cursor": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-3.1.0.tgz",
@@ -12342,6 +12273,7 @@
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
       "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+      "deprecated": "Rimraf versions prior to v4 are no longer supported",
       "dev": true,
       "dependencies": {
         "glob": "^7.1.3"
@@ -12354,10 +12286,13 @@
       }
     },
     "node_modules/rollup": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.9.2.tgz",
-      "integrity": "sha512-66RB8OtFKUTozmVEh3qyNfH+b+z2RXBVloqO2KCC/pjFaGaHtxP9fVfOQKPSGXg2mElmjmxjW/fZ7iKrEpMH5Q==",
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.20.0.tgz",
+      "integrity": "sha512-6rbWBChcnSGzIlXeIdNIZTopKYad8ZG8ajhl78lGRLsI2rX8IkaotQhVas2Ma+GPxJav19wrSzvRvuiv0YKzWw==",
       "dev": true,
+      "dependencies": {
+        "@types/estree": "1.0.5"
+      },
       "bin": {
         "rollup": "dist/bin/rollup"
       },
@@ -12366,26 +12301,29 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.9.2",
-        "@rollup/rollup-android-arm64": "4.9.2",
-        "@rollup/rollup-darwin-arm64": "4.9.2",
-        "@rollup/rollup-darwin-x64": "4.9.2",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.9.2",
-        "@rollup/rollup-linux-arm64-gnu": "4.9.2",
-        "@rollup/rollup-linux-arm64-musl": "4.9.2",
-        "@rollup/rollup-linux-riscv64-gnu": "4.9.2",
-        "@rollup/rollup-linux-x64-gnu": "4.9.2",
-        "@rollup/rollup-linux-x64-musl": "4.9.2",
-        "@rollup/rollup-win32-arm64-msvc": "4.9.2",
-        "@rollup/rollup-win32-ia32-msvc": "4.9.2",
-        "@rollup/rollup-win32-x64-msvc": "4.9.2",
+        "@rollup/rollup-android-arm-eabi": "4.20.0",
+        "@rollup/rollup-android-arm64": "4.20.0",
+        "@rollup/rollup-darwin-arm64": "4.20.0",
+        "@rollup/rollup-darwin-x64": "4.20.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.20.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.20.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.20.0",
+        "@rollup/rollup-linux-arm64-musl": "4.20.0",
+        "@rollup/rollup-linux-powerpc64le-gnu": "4.20.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.20.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.20.0",
+        "@rollup/rollup-linux-x64-gnu": "4.20.0",
+        "@rollup/rollup-linux-x64-musl": "4.20.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.20.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.20.0",
+        "@rollup/rollup-win32-x64-msvc": "4.20.0",
         "fsevents": "~2.3.2"
       }
     },
     "node_modules/rrweb-cssom": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.6.0.tgz",
-      "integrity": "sha512-APM0Gt1KoXBz0iIkkdB/kfvGOwC4UuJFeG/c+yV7wSc7q96cG/kJ0HiYCnzivD9SB53cLV1MlHFNfOuPaadYSw==",
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.7.1.tgz",
+      "integrity": "sha512-TrEMa7JGdVm0UThDJSx7ddw5nVm3UJS9o9CCIZ72B1vSyEZoziDqBYP3XIoi/12lKrJR8rE3jeFHMok2F/Mnsg==",
       "dev": true
     },
     "node_modules/run-async": {
@@ -12430,13 +12368,13 @@
       }
     },
     "node_modules/safe-array-concat": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.0.1.tgz",
-      "integrity": "sha512-6XbUAseYE2KtOuGueyeobCySj9L4+66Tn6KQMOPQJrAJEowYKW/YR/MGJZl7FdydUdaFu4LYyDZjxf4/Nmo23Q==",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz",
+      "integrity": "sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.1",
+        "call-bind": "^1.0.7",
+        "get-intrinsic": "^1.2.4",
         "has-symbols": "^1.0.3",
         "isarray": "^2.0.5"
       },
@@ -12468,17 +12406,20 @@
       ]
     },
     "node_modules/safe-regex-test": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.0.tgz",
-      "integrity": "sha512-JBUUzyOgEwXQY1NuPtvcj/qcBDbDmEvWufhlnXZIm75DEHp+afM1r1ujJpJsV/gSM4t59tpDyPi1sd6ZaPFfsA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz",
+      "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.3",
+        "call-bind": "^1.0.6",
+        "es-errors": "^1.3.0",
         "is-regex": "^1.1.4"
       },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/safer-buffer": {
@@ -12488,9 +12429,9 @@
       "dev": true
     },
     "node_modules/sass": {
-      "version": "1.69.5",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.69.5.tgz",
-      "integrity": "sha512-qg2+UCJibLr2LCVOt3OlPhr/dqVHWOa9XtZf2OjbLs/T4VPSJ00udtgJxH3neXZm+QqX8B+3cU7RaLqp1iVfcQ==",
+      "version": "1.77.8",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.8.tgz",
+      "integrity": "sha512-4UHg6prsrycW20fqLGPShtEvo/WyHRVRHwOP4DzkUrObWoWI05QBSfzU71TVB7PFaL104TwNaHpjlWXAZbQiNQ==",
       "dev": true,
       "dependencies": {
         "chokidar": ">=3.0.0 <4.0.0",
@@ -12517,35 +12458,32 @@
       }
     },
     "node_modules/selenium-webdriver": {
-      "version": "4.14.0",
-      "resolved": "https://registry.npmjs.org/selenium-webdriver/-/selenium-webdriver-4.14.0.tgz",
-      "integrity": "sha512-637rs8anqMKHbWxcBZpyG3Gcs+rBUtAUiqk0O/knUqH4Paj3MFUZrz88/pVGOLNryEVy2z92fZomT8p1ENl1gA==",
+      "version": "4.22.0",
+      "resolved": "https://registry.npmjs.org/selenium-webdriver/-/selenium-webdriver-4.22.0.tgz",
+      "integrity": "sha512-GNbrkCHmy249ai885wgXqTfqL2lZnclUH/P8pwTDIqzyFxU3YhDiN7p/c9tMFA4NhgRdEBO2QCG+CWmG7xr/Mw==",
       "dev": true,
       "dependencies": {
         "jszip": "^3.10.1",
-        "tmp": "^0.2.1",
-        "ws": ">=8.14.2"
+        "tmp": "^0.2.3",
+        "ws": ">=8.16.0"
       },
       "engines": {
-        "node": ">= 14.20.0"
+        "node": ">= 14.21.0"
       }
     },
     "node_modules/selenium-webdriver/node_modules/tmp": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.1.tgz",
-      "integrity": "sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==",
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.3.tgz",
+      "integrity": "sha512-nZD7m9iCPC5g0pYmcaxogYKggSfLsdxl8of3Q/oIbqCqLLIO9IAF0GWjX1z9NZRHPiXv8Wex4yDCaZsgEw0Y8w==",
       "dev": true,
-      "dependencies": {
-        "rimraf": "^3.0.0"
-      },
       "engines": {
-        "node": ">=8.17.0"
+        "node": ">=14.14"
       }
     },
     "node_modules/selenium-webdriver/node_modules/ws": {
-      "version": "8.14.2",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.14.2.tgz",
-      "integrity": "sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g==",
+      "version": "8.18.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz",
+      "integrity": "sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==",
       "dev": true,
       "engines": {
         "node": ">=10.0.0"
@@ -12600,29 +12538,32 @@
       }
     },
     "node_modules/set-function-length": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.1.1.tgz",
-      "integrity": "sha512-VoaqjbBJKiWtg4yRcKBQ7g7wnGnLV3M8oLvVWwOk2PdYY6PEFegR1vezXR0tw6fZGF9csVakIRjrJiy2veSBFQ==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
+      "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==",
       "dev": true,
       "dependencies": {
-        "define-data-property": "^1.1.1",
-        "get-intrinsic": "^1.2.1",
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2",
+        "get-intrinsic": "^1.2.4",
         "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0"
+        "has-property-descriptors": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/set-function-name": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.1.tgz",
-      "integrity": "sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz",
+      "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==",
       "dev": true,
       "dependencies": {
-        "define-data-property": "^1.0.1",
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
         "functions-have-names": "^1.2.3",
-        "has-property-descriptors": "^1.0.0"
+        "has-property-descriptors": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -12665,14 +12606,18 @@
       }
     },
     "node_modules/side-channel": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
-      "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz",
+      "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.0",
-        "get-intrinsic": "^1.0.2",
-        "object-inspect": "^1.9.0"
+        "call-bind": "^1.0.7",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.4",
+        "object-inspect": "^1.13.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -12746,9 +12691,9 @@
       }
     },
     "node_modules/socks": {
-      "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/socks/-/socks-2.8.1.tgz",
-      "integrity": "sha512-B6w7tkwNid7ToxjZ08rQMT8M9BJAf8DKx8Ft4NivzH0zBUfd6jldGcisJn/RLgxcX3FPNDdNQCUEMMT79b+oCQ==",
+      "version": "2.8.3",
+      "resolved": "https://registry.npmjs.org/socks/-/socks-2.8.3.tgz",
+      "integrity": "sha512-l5x7VUUWbjVFbafGLxPWkYsHIhEvmF85tbIeFZWc8ZPtoMyybuEhL7Jye/ooC4/d48FgOjSJXgsF/AJPYCW8Zw==",
       "dev": true,
       "dependencies": {
         "ip-address": "^9.0.5",
@@ -12760,23 +12705,23 @@
       }
     },
     "node_modules/socks-proxy-agent": {
-      "version": "8.0.2",
-      "resolved": "https://registry.npmjs.org/socks-proxy-agent/-/socks-proxy-agent-8.0.2.tgz",
-      "integrity": "sha512-8zuqoLv1aP/66PHF5TqwJ7Czm3Yv32urJQHrVyhD7mmA6d61Zv8cIXQYPTWwmg6qlupnPvs/QKDmfa4P/qct2g==",
+      "version": "8.0.4",
+      "resolved": "https://registry.npmjs.org/socks-proxy-agent/-/socks-proxy-agent-8.0.4.tgz",
+      "integrity": "sha512-GNAq/eg8Udq2x0eNiFkr9gRg5bA7PXEWagQdeRX4cPSG+X/8V38v637gim9bjFptMk1QWsCTr0ttrJEiXbNnRw==",
       "dev": true,
       "dependencies": {
-        "agent-base": "^7.0.2",
+        "agent-base": "^7.1.1",
         "debug": "^4.3.4",
-        "socks": "^2.7.1"
+        "socks": "^2.8.3"
       },
       "engines": {
         "node": ">= 14"
       }
     },
     "node_modules/socks-proxy-agent/node_modules/agent-base": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
-      "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.1.tgz",
+      "integrity": "sha512-H0TSyFNDMomMNJQBn8wFV5YC/2eJ+VXECwOadZJT554xP6cODZHPX3H9QMQECxvrgiSOP1pHjy1sMWQVYJOUOA==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4"
@@ -12795,9 +12740,9 @@
       }
     },
     "node_modules/source-map-js": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
-      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
+      "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -12813,9 +12758,9 @@
       }
     },
     "node_modules/spdx-exceptions": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz",
-      "integrity": "sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A==",
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.5.0.tgz",
+      "integrity": "sha512-PiU42r+xO4UbUS1buo3LPJkjlO7430Xn5SVAhdpzzsPHsjbYVflnnFdATgabnLude+Cqu25p6N+g2lw/PFsa4w==",
       "dev": true
     },
     "node_modules/spdx-expression-parse": {
@@ -12829,15 +12774,15 @@
       }
     },
     "node_modules/spdx-license-ids": {
-      "version": "3.0.16",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.16.tgz",
-      "integrity": "sha512-eWN+LnM3GR6gPu35WxNgbGl8rmY1AEmoMDvL/QD6zYmPWgywxWqJWNdLGT+ke8dKNWrcYgYjPpG5gbTfghP8rw==",
+      "version": "3.0.18",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.18.tgz",
+      "integrity": "sha512-xxRs31BqRYHwiMzudOrpSiHtZ8i/GeionCBDSilhYRj+9gIcI8wCZTlXZKu9vZIVqViP3dcp9qE5G6AlIaD+TQ==",
       "dev": true
     },
     "node_modules/sprintf-js": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-      "integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==",
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.3.tgz",
+      "integrity": "sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA==",
       "dev": true
     },
     "node_modules/stackback": {
@@ -12947,14 +12892,15 @@
       }
     },
     "node_modules/string.prototype.padend": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/string.prototype.padend/-/string.prototype.padend-3.1.5.tgz",
-      "integrity": "sha512-DOB27b/2UTTD+4myKUFh+/fXWcu/UDyASIXfg+7VzoCNNGOfWvoyU/x5pvVHr++ztyt/oSYI1BcWBBG/hmlNjA==",
+      "version": "3.1.6",
+      "resolved": "https://registry.npmjs.org/string.prototype.padend/-/string.prototype.padend-3.1.6.tgz",
+      "integrity": "sha512-XZpspuSB7vJWhvJc9DLSlrXl1mcA2BdoY5jjnS135ydXqLoqhs96JjDtCkjJEQHvfqZIp9hBuBMgI589peyx9Q==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -12964,14 +12910,15 @@
       }
     },
     "node_modules/string.prototype.trim": {
-      "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.8.tgz",
-      "integrity": "sha512-lfjY4HcixfQXOfaqCvcBuOIapyaroTXhbkfJN3gcB1OtyupngWK4sEET9Knd0cXd28kTUqu/kHoV4HKSJdnjiQ==",
+      "version": "1.2.9",
+      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.9.tgz",
+      "integrity": "sha512-klHuCNxiMZ8MlsOihJhJEBJAiMVqU3Z2nEXWfWnIqjN0gEFS9J9+IxKozWWtQGcgoa1WUZzLjKPTr4ZHNFTFxw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.0",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -12981,28 +12928,31 @@
       }
     },
     "node_modules/string.prototype.trimend": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.7.tgz",
-      "integrity": "sha512-Ni79DqeB72ZFq1uH/L6zJ+DKZTkOtPIHovb3YZHQViE+HDouuU4mBrLOLDn5Dde3RF8qw5qVETEjhu9locMLvA==",
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.8.tgz",
+      "integrity": "sha512-p73uL5VCHCO2BZZ6krwwQE3kCzM7NKmis8S//xEC6fQonchbum4eP6kR4DLEjQFO3Wnj3Fuo8NM0kOSjVdHjZQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/string.prototype.trimstart": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.7.tgz",
-      "integrity": "sha512-NGhtDFu3jCEm7B4Fy0DpLewdJQOZcQ0rGbwQ/+stjnrp2i+rlKeCvos9hOIeCmqwratM47OBxY7uFZzjxHXmrg==",
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.8.tgz",
+      "integrity": "sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -13067,60 +13017,77 @@
       }
     },
     "node_modules/strip-literal": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/strip-literal/-/strip-literal-1.3.0.tgz",
-      "integrity": "sha512-PugKzOsyXpArk0yWmUwqOZecSO0GH0bPoctLcqNDH9J04pVW3lflYE0ujElBGTloevcxF5MofAOZ7C5l2b+wLg==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/strip-literal/-/strip-literal-2.1.0.tgz",
+      "integrity": "sha512-Op+UycaUt/8FbN/Z2TWPBLge3jWrP3xj10f3fnYxf052bKuS3EKs1ZQcVGjnEMdsNVAM+plXRdmjrZ/KgG3Skw==",
       "dev": true,
       "dependencies": {
-        "acorn": "^8.10.0"
+        "js-tokens": "^9.0.0"
       },
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
     },
+    "node_modules/strip-literal/node_modules/js-tokens": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-9.0.0.tgz",
+      "integrity": "sha512-WriZw1luRMlmV3LGJaR6QOJjWwgLUTf89OwT2lUOyjX2dJGBwgmIkbcz+7WFZjrZM635JOIR517++e/67CP9dQ==",
+      "dev": true
+    },
     "node_modules/stylelint": {
-      "version": "16.1.0",
-      "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.1.0.tgz",
-      "integrity": "sha512-Sh1rRV0lN1qxz/QsuuooLWsIZ/ona7NKw/fRZd6y6PyXYdD2W0EAzJ8yJcwSx4Iw/muz0CF09VZ+z4EiTAcKmg==",
+      "version": "16.8.1",
+      "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.8.1.tgz",
+      "integrity": "sha512-O8aDyfdODSDNz/B3gW2HQ+8kv8pfhSu7ZR7xskQ93+vI6FhKKGUJMQ03Ydu+w3OvXXE0/u4hWU4hCPNOyld+OA==",
       "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/stylelint"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/stylelint"
+        }
+      ],
       "dependencies": {
-        "@csstools/css-parser-algorithms": "^2.4.0",
-        "@csstools/css-tokenizer": "^2.2.2",
-        "@csstools/media-query-list-parser": "^2.1.6",
-        "@csstools/selector-specificity": "^3.0.1",
+        "@csstools/css-parser-algorithms": "^2.7.1",
+        "@csstools/css-tokenizer": "^2.4.1",
+        "@csstools/media-query-list-parser": "^2.1.13",
+        "@csstools/selector-specificity": "^3.1.1",
+        "@dual-bundle/import-meta-resolve": "^4.1.0",
         "balanced-match": "^2.0.0",
         "colord": "^2.9.3",
         "cosmiconfig": "^9.0.0",
-        "css-functions-list": "^3.2.1",
+        "css-functions-list": "^3.2.2",
         "css-tree": "^2.3.1",
-        "debug": "^4.3.4",
+        "debug": "^4.3.6",
         "fast-glob": "^3.3.2",
         "fastest-levenshtein": "^1.0.16",
-        "file-entry-cache": "^8.0.0",
+        "file-entry-cache": "^9.0.0",
         "global-modules": "^2.0.0",
         "globby": "^11.1.0",
         "globjoin": "^0.1.4",
         "html-tags": "^3.3.1",
-        "ignore": "^5.3.0",
+        "ignore": "^5.3.1",
         "imurmurhash": "^0.1.4",
         "is-plain-object": "^5.0.0",
-        "known-css-properties": "^0.29.0",
+        "known-css-properties": "^0.34.0",
         "mathml-tag-names": "^2.1.3",
-        "meow": "^13.0.0",
-        "micromatch": "^4.0.5",
+        "meow": "^13.2.0",
+        "micromatch": "^4.0.7",
         "normalize-path": "^3.0.0",
-        "picocolors": "^1.0.0",
-        "postcss": "^8.4.32",
-        "postcss-resolve-nested-selector": "^0.1.1",
+        "picocolors": "^1.0.1",
+        "postcss": "^8.4.40",
+        "postcss-resolve-nested-selector": "^0.1.4",
         "postcss-safe-parser": "^7.0.0",
-        "postcss-selector-parser": "^6.0.13",
+        "postcss-selector-parser": "^6.1.1",
         "postcss-value-parser": "^4.2.0",
         "resolve-from": "^5.0.0",
         "string-width": "^4.2.3",
         "strip-ansi": "^7.1.0",
         "supports-hyperlinks": "^3.0.0",
         "svg-tags": "^1.0.0",
-        "table": "^6.8.1",
+        "table": "^6.8.2",
         "write-file-atomic": "^5.0.1"
       },
       "bin": {
@@ -13128,40 +13095,46 @@
       },
       "engines": {
         "node": ">=18.12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/stylelint"
       }
     },
     "node_modules/stylelint-config-recommended": {
-      "version": "14.0.0",
-      "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-14.0.0.tgz",
-      "integrity": "sha512-jSkx290CglS8StmrLp2TxAppIajzIBZKYm3IxT89Kg6fGlxbPiTiyH9PS5YUuVAFwaJLl1ikiXX0QWjI0jmgZQ==",
+      "version": "14.0.1",
+      "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-14.0.1.tgz",
+      "integrity": "sha512-bLvc1WOz/14aPImu/cufKAZYfXs/A/owZfSMZ4N+16WGXLoX5lOir53M6odBxvhgmgdxCVnNySJmZKx73T93cg==",
       "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/stylelint"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/stylelint"
+        }
+      ],
       "engines": {
         "node": ">=18.12.0"
       },
       "peerDependencies": {
-        "stylelint": "^16.0.0"
+        "stylelint": "^16.1.0"
       }
     },
     "node_modules/stylelint-config-recommended-scss": {
-      "version": "14.0.0",
-      "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-14.0.0.tgz",
-      "integrity": "sha512-HDvpoOAQ1RpF+sPbDOT2Q2/YrBDEJDnUymmVmZ7mMCeNiFSdhRdyGEimBkz06wsN+HaFwUh249gDR+I9JR7Onw==",
+      "version": "14.1.0",
+      "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-14.1.0.tgz",
+      "integrity": "sha512-bhaMhh1u5dQqSsf6ri2GVWWQW5iUjBYgcHkh7SgDDn92ijoItC/cfO/W+fpXshgTQWhwFkP1rVcewcv4jaftRg==",
       "dev": true,
       "dependencies": {
         "postcss-scss": "^4.0.9",
-        "stylelint-config-recommended": "^14.0.0",
-        "stylelint-scss": "^6.0.0"
+        "stylelint-config-recommended": "^14.0.1",
+        "stylelint-scss": "^6.4.0"
       },
       "engines": {
         "node": ">=18.12.0"
       },
       "peerDependencies": {
         "postcss": "^8.3.3",
-        "stylelint": "^16.0.2"
+        "stylelint": "^16.6.1"
       },
       "peerDependenciesMeta": {
         "postcss": {
@@ -13170,15 +13143,17 @@
       }
     },
     "node_modules/stylelint-scss": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-6.0.0.tgz",
-      "integrity": "sha512-N1xV/Ef5PNRQQt9E45unzGvBUN1KZxCI8B4FgN/pMfmyRYbZGVN4y9qWlvOMdScU17c8VVCnjIHTVn38Bb6qSA==",
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-6.5.0.tgz",
+      "integrity": "sha512-yOnYlr71wrTPT3rYyUurgTj6Rw7JUtzsZQsiPEjvs+k/yqoYHdweqpw6XN/ARpxjAuvJpddoMUvV8aAIpvUwTg==",
       "dev": true,
       "dependencies": {
-        "known-css-properties": "^0.29.0",
+        "css-tree": "2.3.1",
+        "is-plain-object": "5.0.0",
+        "known-css-properties": "^0.34.0",
         "postcss-media-query-parser": "^0.2.3",
-        "postcss-resolve-nested-selector": "^0.1.1",
-        "postcss-selector-parser": "^6.0.13",
+        "postcss-resolve-nested-selector": "^0.1.4",
+        "postcss-selector-parser": "^6.1.1",
         "postcss-value-parser": "^4.2.0"
       },
       "engines": {
@@ -13206,109 +13181,29 @@
       "integrity": "sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==",
       "dev": true
     },
-    "node_modules/stylelint/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-      "dev": true,
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/stylelint/node_modules/brace-expansion/node_modules/balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true
-    },
-    "node_modules/stylelint/node_modules/cosmiconfig": {
-      "version": "9.0.0",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
-      "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
-      "dev": true,
-      "dependencies": {
-        "env-paths": "^2.2.1",
-        "import-fresh": "^3.3.0",
-        "js-yaml": "^4.1.0",
-        "parse-json": "^5.2.0"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/d-fischer"
-      },
-      "peerDependencies": {
-        "typescript": ">=4.9.5"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/stylelint/node_modules/file-entry-cache": {
-      "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
-      "integrity": "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==",
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-9.0.0.tgz",
+      "integrity": "sha512-6MgEugi8p2tiUhqO7GnPsmbCCzj0YRCwwaTbpGRyKZesjRSzkqkAE9fPp7V2yMs5hwfgbQLgdvSSkGNg1s5Uvw==",
       "dev": true,
       "dependencies": {
-        "flat-cache": "^4.0.0"
+        "flat-cache": "^5.0.0"
       },
       "engines": {
-        "node": ">=16.0.0"
+        "node": ">=18"
       }
     },
     "node_modules/stylelint/node_modules/flat-cache": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.0.tgz",
-      "integrity": "sha512-EryKbCE/wxpxKniQlyas6PY1I9vwtF3uCBweX+N8KYTCn3Y12RTGtQAJ/bd5pl7kxUAc8v/R3Ake/N17OZiFqA==",
-      "dev": true,
-      "dependencies": {
-        "flatted": "^3.2.9",
-        "keyv": "^4.5.4",
-        "rimraf": "^5.0.5"
-      },
-      "engines": {
-        "node": ">=16"
-      }
-    },
-    "node_modules/stylelint/node_modules/foreground-child": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.1.1.tgz",
-      "integrity": "sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==",
-      "dev": true,
-      "dependencies": {
-        "cross-spawn": "^7.0.0",
-        "signal-exit": "^4.0.1"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/stylelint/node_modules/glob": {
-      "version": "10.3.10",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz",
-      "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==",
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-5.0.0.tgz",
+      "integrity": "sha512-JrqFmyUl2PnPi1OvLyTVHnQvwQ0S+e6lGSwu8OkAZlSaNIZciTY2H/cOOROxsBA1m/LZNHDsqAgDZt6akWcjsQ==",
       "dev": true,
       "dependencies": {
-        "foreground-child": "^3.1.0",
-        "jackspeak": "^2.3.5",
-        "minimatch": "^9.0.1",
-        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0",
-        "path-scurry": "^1.10.1"
-      },
-      "bin": {
-        "glob": "dist/esm/bin.mjs"
+        "flatted": "^3.3.1",
+        "keyv": "^4.5.4"
       },
       "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
+        "node": ">=18"
       }
     },
     "node_modules/stylelint/node_modules/global-modules": {
@@ -13337,50 +13232,11 @@
         "node": ">=6"
       }
     },
-    "node_modules/stylelint/node_modules/minimatch": {
-      "version": "9.0.3",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
-      "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
-      "dev": true,
-      "dependencies": {
-        "brace-expansion": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/stylelint/node_modules/rimraf": {
-      "version": "5.0.5",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.5.tgz",
-      "integrity": "sha512-CqDakW+hMe/Bz202FPEymy68P+G50RfMQK+Qo5YUqc9SPipvbGjCGKd0RSKEelbsfQuw3g5NZDSrlZZAJurH1A==",
-      "dev": true,
-      "dependencies": {
-        "glob": "^10.3.7"
-      },
-      "bin": {
-        "rimraf": "dist/esm/bin.mjs"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/stylelint/node_modules/signal-exit": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-      "dev": true,
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
+    "node_modules/stylelint/node_modules/ini": {
+      "version": "1.3.8",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
+      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
+      "dev": true
     },
     "node_modules/stylelint/node_modules/strip-ansi": {
       "version": "7.1.0",
@@ -13409,44 +13265,6 @@
         "which": "bin/which"
       }
     },
-    "node_modules/sugarss": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/sugarss/-/sugarss-2.0.0.tgz",
-      "integrity": "sha512-WfxjozUk0UVA4jm+U1d736AUpzSrNsQcIbyOkoE364GrtWmIrFdk5lksEupgWMD4VaT/0kVx1dobpiDumSgmJQ==",
-      "dev": true,
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "postcss": "^7.0.2"
-      }
-    },
-    "node_modules/sugarss/node_modules/picocolors": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
-      "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==",
-      "dev": true,
-      "optional": true,
-      "peer": true
-    },
-    "node_modules/sugarss/node_modules/postcss": {
-      "version": "7.0.39",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.39.tgz",
-      "integrity": "sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==",
-      "dev": true,
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "picocolors": "^0.2.1",
-        "source-map": "^0.6.1"
-      },
-      "engines": {
-        "node": ">=6.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/postcss/"
-      }
-    },
     "node_modules/supports-color": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -13502,9 +13320,9 @@
       "integrity": "sha512-H1XoH1URcBOa/rZZWxLxHCtOdVUEev+9vo5YdYhC9tCY4wnybX+VQrCYuy9ubkg69fCBxCONJOSLGfw0DWMffQ=="
     },
     "node_modules/table": {
-      "version": "6.8.1",
-      "resolved": "https://registry.npmjs.org/table/-/table-6.8.1.tgz",
-      "integrity": "sha512-Y4X9zqrCftUhMeH2EptSSERdVKt/nEdijTOacGD/97EKjhQ/Qs8RTlEGABSJNNN8lac9kheH+af7yAkEWlgneA==",
+      "version": "6.8.2",
+      "resolved": "https://registry.npmjs.org/table/-/table-6.8.2.tgz",
+      "integrity": "sha512-w2sfv80nrAh2VCbqR5AK27wswXhqcck2AhfnNW76beQXskGZ1V12GwS//yYVa3d3fcvAip2OUnbDAjW2k3v9fA==",
       "dev": true,
       "dependencies": {
         "ajv": "^8.0.1",
@@ -13518,9 +13336,9 @@
       }
     },
     "node_modules/tar-fs": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.5.tgz",
-      "integrity": "sha512-JOgGAmZyMgbqpLwct7ZV8VzkEB6pxXFBVErLtb+XCOqzc6w1xiWKI9GVd6bwk68EX7eJ4DWmfXVmq8K2ziZTGg==",
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.6.tgz",
+      "integrity": "sha512-iokBDQQkUyeXhgPYaZxmczGPhnhXZ0CmrqI+MOb/WFGS9DW5wnfrLgtjUJBvz50vQ3qfRwJ62QVoCFu8mPVu5w==",
       "dev": true,
       "dependencies": {
         "pump": "^3.0.0",
@@ -13600,9 +13418,9 @@
       }
     },
     "node_modules/text-decoder": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/text-decoder/-/text-decoder-1.1.0.tgz",
-      "integrity": "sha512-TmLJNj6UgX8xcUZo4UDStGQtDiTzF7BzWlzn9g7UWrjkpHr5uJTK1ld16wZ3LXb2vb6jH8qU89dW5whuMdXYdw==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/text-decoder/-/text-decoder-1.1.1.tgz",
+      "integrity": "sha512-8zll7REEv4GDD3x4/0pW+ppIxSNs7H1J10IKFZsuOMscumCdM2a+toDGLPA3T+1+fLBql4zbt5z83GEQGGV5VA==",
       "dev": true,
       "dependencies": {
         "b4a": "^1.6.4"
@@ -13627,24 +13445,24 @@
       "dev": true
     },
     "node_modules/tinybench": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.5.1.tgz",
-      "integrity": "sha512-65NKvSuAVDP/n4CqH+a9w2kTlLReS9vhsAP06MWx+/89nMinJyB2icyl58RIcqCmIggpojIGeuJGhjU1aGMBSg==",
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz",
+      "integrity": "sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==",
       "dev": true
     },
     "node_modules/tinypool": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/tinypool/-/tinypool-0.8.1.tgz",
-      "integrity": "sha512-zBTCK0cCgRROxvs9c0CGK838sPkeokNGdQVUUwHAbynHFlmyJYj825f/oRs528HaIJ97lo0pLIlDUzwN+IorWg==",
+      "version": "0.8.4",
+      "resolved": "https://registry.npmjs.org/tinypool/-/tinypool-0.8.4.tgz",
+      "integrity": "sha512-i11VH5gS6IFeLY3gMBQ00/MmLncVP7JLXOw1vlgkytLmJK7QnEr7NXf0LBdxfmNPAeyetukOk0bOYrJrFGjYJQ==",
       "dev": true,
       "engines": {
         "node": ">=14.0.0"
       }
     },
     "node_modules/tinyspy": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/tinyspy/-/tinyspy-2.2.0.tgz",
-      "integrity": "sha512-d2eda04AN/cPOR89F7Xv5bK/jrQEhmcLFe6HFldoeO9AJtps+fqEnh486vnT/8y4bw38pSyxDcTCAq+Ks2aJTg==",
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/tinyspy/-/tinyspy-2.2.1.tgz",
+      "integrity": "sha512-KYad6Vy5VDWV4GH3fjpseMQ/XU2BhIYP7Vzd0LG44qRWm/Yt2WCOTicFdvmgo6gWaqooMQCawTtILVQJupKu7A==",
       "dev": true,
       "engines": {
         "node": ">=14.0.0"
@@ -13666,7 +13484,6 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
       "integrity": "sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==",
-      "dev": true,
       "engines": {
         "node": ">=4"
       }
@@ -13690,9 +13507,9 @@
       "dev": true
     },
     "node_modules/tough-cookie": {
-      "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.3.tgz",
-      "integrity": "sha512-aX/y5pVRkfRnfmuX+OdbSdXvPe6ieKX/G2s7e98f4poJHnqH3281gDPm/metm6E/WRamfx7WC4HUqkWHfQHprw==",
+      "version": "4.1.4",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.4.tgz",
+      "integrity": "sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==",
       "dev": true,
       "dependencies": {
         "psl": "^1.1.33",
@@ -13732,9 +13549,9 @@
       "dev": true
     },
     "node_modules/ts-node": {
-      "version": "10.9.1",
-      "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.1.tgz",
-      "integrity": "sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==",
+      "version": "10.9.2",
+      "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.2.tgz",
+      "integrity": "sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==",
       "dev": true,
       "dependencies": {
         "@cspotcode/source-map-support": "^0.8.0",
@@ -13775,10 +13592,13 @@
       }
     },
     "node_modules/ts-node/node_modules/acorn-walk": {
-      "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.0.tgz",
-      "integrity": "sha512-FS7hV565M5l1R08MXqo8odwMTB02C2UqzB17RVgu9EyuYFBqJZ3/ZY97sQD5FewVu1UyDFc1yztUDrAwT0EypA==",
+      "version": "8.3.3",
+      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.3.tgz",
+      "integrity": "sha512-MxXdReSRhGO7VlFe1bRG/oI7/mdLV9B9JJT0N8vZOhF7gFRR5l3M8W9G8JxmKV+JC5mGqJ0QvqfSOLsCPa4nUw==",
       "dev": true,
+      "dependencies": {
+        "acorn": "^8.11.0"
+      },
       "engines": {
         "node": ">=0.4.0"
       }
@@ -13793,9 +13613,9 @@
       }
     },
     "node_modules/tsconfig-paths": {
-      "version": "3.14.2",
-      "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.2.tgz",
-      "integrity": "sha512-o/9iXgCYc5L/JxCHPe3Hvh8Q/2xm5Z+p18PESBU6Ff33695QnCHBEjcytY2q19ua7Mbl/DavtBOLq+oG0RCL+g==",
+      "version": "3.15.0",
+      "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.15.0.tgz",
+      "integrity": "sha512-2Ac2RgzDe/cn48GvOe3M+o82pEFewD3UPbyoUHHdKasHwJKjds4fLXWf/Ux5kATBKN20oaFGu+jbElp1pos0mg==",
       "dev": true,
       "dependencies": {
         "@types/json5": "^0.0.29",
@@ -13826,9 +13646,9 @@
       }
     },
     "node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==",
+      "version": "2.6.3",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.3.tgz",
+      "integrity": "sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ==",
       "dev": true
     },
     "node_modules/tsutils": {
@@ -13886,29 +13706,30 @@
       }
     },
     "node_modules/typed-array-buffer": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.0.tgz",
-      "integrity": "sha512-Y8KTSIglk9OZEr8zywiIHG/kmQ7KWyjseXs1CbSo8vC42w7hg2HgYTxSWwP0+is7bWDc1H+Fo026CpHFwm8tkw==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.2.tgz",
+      "integrity": "sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.1",
-        "is-typed-array": "^1.1.10"
+        "call-bind": "^1.0.7",
+        "es-errors": "^1.3.0",
+        "is-typed-array": "^1.1.13"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/typed-array-byte-length": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.0.tgz",
-      "integrity": "sha512-Or/+kvLxNpeQ9DtSydonMxCx+9ZXOswtwJn17SNLvhptaXYDJvkFFP5zbfU/uLmvnBJlI4yrnXRxpdWH/M5tNA==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.1.tgz",
+      "integrity": "sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
-        "has-proto": "^1.0.1",
-        "is-typed-array": "^1.1.10"
+        "gopd": "^1.0.1",
+        "has-proto": "^1.0.3",
+        "is-typed-array": "^1.1.13"
       },
       "engines": {
         "node": ">= 0.4"
@@ -13918,16 +13739,17 @@
       }
     },
     "node_modules/typed-array-byte-offset": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.0.tgz",
-      "integrity": "sha512-RD97prjEt9EL8YgAgpOkf3O4IF9lhJFr9g0htQkm0rchFp/Vx7LW5Q8fSXXub7BXAODyUQohRMyOc3faCPd0hg==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.2.tgz",
+      "integrity": "sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA==",
       "dev": true,
       "dependencies": {
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.2",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
-        "has-proto": "^1.0.1",
-        "is-typed-array": "^1.1.10"
+        "gopd": "^1.0.1",
+        "has-proto": "^1.0.3",
+        "is-typed-array": "^1.1.13"
       },
       "engines": {
         "node": ">= 0.4"
@@ -13937,23 +13759,29 @@
       }
     },
     "node_modules/typed-array-length": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.4.tgz",
-      "integrity": "sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.6.tgz",
+      "integrity": "sha512-/OxDN6OtAk5KBpGb28T+HZc2M+ADtvRxXrKKbUwtsLgdoxgX13hyy7ek6bFRl5+aBs2yZzB0c4CnQfAtVypW/g==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
-        "is-typed-array": "^1.1.9"
+        "gopd": "^1.0.1",
+        "has-proto": "^1.0.3",
+        "is-typed-array": "^1.1.13",
+        "possible-typed-array-names": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/typescript": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.2.tgz",
-      "integrity": "sha512-6l+RyNy7oAHDfxC4FzSJcz9vnjTKxrLpDG5M2Vu4SHRVNg6xzqZp6LYSR9zjqQTu8DU/f5xwxUdADOkbrIX2gQ==",
+      "version": "5.5.4",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.4.tgz",
+      "integrity": "sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==",
       "devOptional": true,
       "bin": {
         "tsc": "bin/tsc",
@@ -13964,9 +13792,9 @@
       }
     },
     "node_modules/ufo": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.3.2.tgz",
-      "integrity": "sha512-o+ORpgGwaYQXgqGDwd+hkS4PuZ3QnmqMMxRuajK/a38L6fTpcE5GPIfrf+L/KemFzfUpeUQc1rRS1iDBozvnFA==",
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.5.4.tgz",
+      "integrity": "sha512-UsUk3byDzKd04EyoZ7U4DOlxQaD14JUKQl6/P7wiX4FNvUfm3XL246n9W5AmqwW5RSFJ27NAuM0iLscAOYUiGQ==",
       "dev": true
     },
     "node_modules/unbox-primitive": {
@@ -13995,9 +13823,9 @@
       }
     },
     "node_modules/undici-types": {
-      "version": "5.26.5",
-      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
-      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.13.0.tgz",
+      "integrity": "sha512-xtFJHudx8S2DSoujjMd1WeWvn7KKWFRESZTMeL1RptAYERu29D6jphMjjY+vn96jvN3kVPDNxU/E13VTaXj6jg==",
       "dev": true
     },
     "node_modules/unicode-canonical-property-names-ecmascript": {
@@ -14059,9 +13887,9 @@
       }
     },
     "node_modules/update-browserslist-db": {
-      "version": "1.0.13",
-      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz",
-      "integrity": "sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.0.tgz",
+      "integrity": "sha512-EdRAaAyk2cUE1wOf2DkEhzxqOQvFOoRJFNS6NeyJ01Gp2beMRpBAINjM2iDXE3KCuKhwnvHIQCJm6ThL2Z+HzQ==",
       "dev": true,
       "funding": [
         {
@@ -14078,8 +13906,8 @@
         }
       ],
       "dependencies": {
-        "escalade": "^3.1.1",
-        "picocolors": "^1.0.0"
+        "escalade": "^3.1.2",
+        "picocolors": "^1.0.1"
       },
       "bin": {
         "update-browserslist-db": "cli.js"
@@ -14135,9 +13963,9 @@
       "dev": true
     },
     "node_modules/v8-to-istanbul": {
-      "version": "9.2.0",
-      "resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.2.0.tgz",
-      "integrity": "sha512-/EH/sDgxU2eGxajKdwLCDmQ4FWq+kpi3uCmBGpw1xJtnAxEjlD8j8PEiGWpCIMIs3ciNAgH0d3TTJiUkYzyZjA==",
+      "version": "9.3.0",
+      "resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.3.0.tgz",
+      "integrity": "sha512-kiGUalWN+rgBJ/1OHZsBtU4rXZOfj/7rKQxULKlIzwzQSvMJUUNgPwJEEh7gU6xEVxC0ahoOBvN2YI8GH6FNgA==",
       "dev": true,
       "dependencies": {
         "@jridgewell/trace-mapping": "^0.3.12",
@@ -14159,23 +13987,23 @@
       }
     },
     "node_modules/validator": {
-      "version": "13.11.0",
-      "resolved": "https://registry.npmjs.org/validator/-/validator-13.11.0.tgz",
-      "integrity": "sha512-Ii+sehpSfZy+At5nPdnyMhx78fEoPDkR2XW/zimHEL3MyGJQOCQ7WeP20jPYRz7ZCpcKLB21NxuXHF3bxjStBQ==",
+      "version": "13.12.0",
+      "resolved": "https://registry.npmjs.org/validator/-/validator-13.12.0.tgz",
+      "integrity": "sha512-c1Q0mCiPlgdTVVVIJIrBuxNicYE+t/7oKeI9MWLj3fh/uq2Pxh/3eeWbVZ4OcGW1TUf53At0njHw5SMdA3tmMg==",
       "dev": true,
       "engines": {
         "node": ">= 0.10"
       }
     },
     "node_modules/vite": {
-      "version": "5.0.10",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-5.0.10.tgz",
-      "integrity": "sha512-2P8J7WWgmc355HUMlFrwofacvr98DAjoE52BfdbwQtyLH06XKwaL/FMnmKM2crF0iX4MpmMKoDlNCB1ok7zHCw==",
+      "version": "5.3.5",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.5.tgz",
+      "integrity": "sha512-MdjglKR6AQXQb9JGiS7Rc2wC6uMjcm7Go/NHNO63EwiJXfuk9PgqiP/n5IDJCziMkfw9n4Ubp7lttNwz+8ZVKA==",
       "dev": true,
       "dependencies": {
-        "esbuild": "^0.19.3",
-        "postcss": "^8.4.32",
-        "rollup": "^4.2.0"
+        "esbuild": "^0.21.3",
+        "postcss": "^8.4.39",
+        "rollup": "^4.13.0"
       },
       "bin": {
         "vite": "bin/vite.js"
@@ -14223,9 +14051,9 @@
       }
     },
     "node_modules/vite-node": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/vite-node/-/vite-node-1.1.1.tgz",
-      "integrity": "sha512-2bGE5w4jvym5v8llF6Gu1oBrmImoNSs4WmRVcavnG2me6+8UQntTqLiAMFyiAobp+ZXhj5ZFhI7SmLiFr/jrow==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/vite-node/-/vite-node-1.6.0.tgz",
+      "integrity": "sha512-de6HJgzC+TFzOu0NTC4RAIsyf/DY/ibWDYQUcuEA84EMHhcefTUGkjFHKKEJhQN4A+6I0u++kr3l36ZF2d7XRw==",
       "dev": true,
       "dependencies": {
         "cac": "^6.7.14",
@@ -14245,17 +14073,18 @@
       }
     },
     "node_modules/vite-plugin-dts": {
-      "version": "3.6.4",
-      "resolved": "https://registry.npmjs.org/vite-plugin-dts/-/vite-plugin-dts-3.6.4.tgz",
-      "integrity": "sha512-yOVhUI/kQhtS6lCXRYYLv2UUf9bftcwQK9ROxCX2ul17poLQs02ctWX7+vXB8GPRzH8VCK3jebEFtPqqijXx6w==",
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/vite-plugin-dts/-/vite-plugin-dts-3.9.1.tgz",
+      "integrity": "sha512-rVp2KM9Ue22NGWB8dNtWEr+KekN3rIgz1tWD050QnRGlriUCmaDwa7qA5zDEjbXg5lAXhYMSBJtx3q3hQIJZSg==",
       "dev": true,
       "dependencies": {
-        "@microsoft/api-extractor": "^7.38.0",
-        "@rollup/pluginutils": "^5.0.5",
-        "@vue/language-core": "^1.8.20",
+        "@microsoft/api-extractor": "7.43.0",
+        "@rollup/pluginutils": "^5.1.0",
+        "@vue/language-core": "^1.8.27",
         "debug": "^4.3.4",
         "kolorist": "^1.8.0",
-        "vue-tsc": "^1.8.20"
+        "magic-string": "^0.30.8",
+        "vue-tsc": "^1.8.27"
       },
       "engines": {
         "node": "^14.18.0 || >=16.0.0"
@@ -14270,19 +14099,57 @@
         }
       }
     },
+    "node_modules/vite-plugin-dts/node_modules/@volar/typescript": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-1.11.1.tgz",
+      "integrity": "sha512-iU+t2mas/4lYierSnoFOeRFQUhAEMgsFuQxoxvwn5EdQopw43j+J27a4lt9LMInx1gLJBC6qL14WYGlgymaSMQ==",
+      "dev": true,
+      "dependencies": {
+        "@volar/language-core": "1.11.1",
+        "path-browserify": "^1.0.1"
+      }
+    },
+    "node_modules/vite-plugin-dts/node_modules/semver": {
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+      "dev": true,
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/vite-plugin-dts/node_modules/vue-tsc": {
+      "version": "1.8.27",
+      "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-1.8.27.tgz",
+      "integrity": "sha512-WesKCAZCRAbmmhuGl3+VrdWItEvfoFIPXOvUJkjULi+x+6G/Dy69yO3TBRJDr9eUlmsNAwVmxsNZxvHKzbkKdg==",
+      "dev": true,
+      "dependencies": {
+        "@volar/typescript": "~1.11.1",
+        "@vue/language-core": "1.8.27",
+        "semver": "^7.5.4"
+      },
+      "bin": {
+        "vue-tsc": "bin/vue-tsc.js"
+      },
+      "peerDependencies": {
+        "typescript": "*"
+      }
+    },
     "node_modules/vitest": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/vitest/-/vitest-1.1.1.tgz",
-      "integrity": "sha512-Ry2qs4UOu/KjpXVfOCfQkTnwSXYGrqTbBZxw6reIYEFjSy1QUARRg5pxiI5BEXy+kBVntxUYNMlq4Co+2vD3fQ==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/vitest/-/vitest-1.6.0.tgz",
+      "integrity": "sha512-H5r/dN06swuFnzNFhq/dnz37bPXnq8xB2xB5JOVk8K09rUtoeNN+LHWkoQ0A/i3hvbUKKcCei9KpbxqHMLhLLA==",
       "dev": true,
       "dependencies": {
-        "@vitest/expect": "1.1.1",
-        "@vitest/runner": "1.1.1",
-        "@vitest/snapshot": "1.1.1",
-        "@vitest/spy": "1.1.1",
-        "@vitest/utils": "1.1.1",
-        "acorn-walk": "^8.3.0",
-        "cac": "^6.7.14",
+        "@vitest/expect": "1.6.0",
+        "@vitest/runner": "1.6.0",
+        "@vitest/snapshot": "1.6.0",
+        "@vitest/spy": "1.6.0",
+        "@vitest/utils": "1.6.0",
+        "acorn-walk": "^8.3.2",
         "chai": "^4.3.10",
         "debug": "^4.3.4",
         "execa": "^8.0.1",
@@ -14291,11 +14158,11 @@
         "pathe": "^1.1.1",
         "picocolors": "^1.0.0",
         "std-env": "^3.5.0",
-        "strip-literal": "^1.3.0",
+        "strip-literal": "^2.0.0",
         "tinybench": "^2.5.1",
-        "tinypool": "^0.8.1",
+        "tinypool": "^0.8.3",
         "vite": "^5.0.0",
-        "vite-node": "1.1.1",
+        "vite-node": "1.6.0",
         "why-is-node-running": "^2.2.2"
       },
       "bin": {
@@ -14310,8 +14177,8 @@
       "peerDependencies": {
         "@edge-runtime/vm": "*",
         "@types/node": "^18.0.0 || >=20.0.0",
-        "@vitest/browser": "^1.0.0",
-        "@vitest/ui": "^1.0.0",
+        "@vitest/browser": "1.6.0",
+        "@vitest/ui": "1.6.0",
         "happy-dom": "*",
         "jsdom": "*"
       },
@@ -14337,10 +14204,13 @@
       }
     },
     "node_modules/vitest/node_modules/acorn-walk": {
-      "version": "8.3.1",
-      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.1.tgz",
-      "integrity": "sha512-TgUZgYvqZprrl7YldZNoa9OciCAyZR+Ejm9eXzKCmjsF5IKp/wgQ7Z/ZpjpGTIUPwrHQIcYeI8qDh4PsEwxMbw==",
+      "version": "8.3.3",
+      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.3.tgz",
+      "integrity": "sha512-MxXdReSRhGO7VlFe1bRG/oI7/mdLV9B9JJT0N8vZOhF7gFRR5l3M8W9G8JxmKV+JC5mGqJ0QvqfSOLsCPa4nUw==",
       "dev": true,
+      "dependencies": {
+        "acorn": "^8.11.0"
+      },
       "engines": {
         "node": ">=0.4.0"
       }
@@ -14354,17 +14224,23 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/vscode-uri": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/vscode-uri/-/vscode-uri-3.0.8.tgz",
+      "integrity": "sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw==",
+      "dev": true
+    },
     "node_modules/vue": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.3.9.tgz",
-      "integrity": "sha512-sy5sLCTR8m6tvUk1/ijri3Yqzgpdsmxgj6n6yl7GXXCXqVbmW2RCXe9atE4cEI6Iv7L89v5f35fZRRr5dChP9w==",
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.35.tgz",
+      "integrity": "sha512-+fl/GLmI4GPileHftVlCdB7fUL4aziPcqTudpTGXCT8s+iZWuOCeNEB5haX6Uz2IpRrbEXOgIFbe+XciCuGbNQ==",
       "peer": true,
       "dependencies": {
-        "@vue/compiler-dom": "3.3.9",
-        "@vue/compiler-sfc": "3.3.9",
-        "@vue/runtime-dom": "3.3.9",
-        "@vue/server-renderer": "3.3.9",
-        "@vue/shared": "3.3.9"
+        "@vue/compiler-dom": "3.4.35",
+        "@vue/compiler-sfc": "3.4.35",
+        "@vue/runtime-dom": "3.4.35",
+        "@vue/server-renderer": "3.4.35",
+        "@vue/shared": "3.4.35"
       },
       "peerDependencies": {
         "typescript": "*"
@@ -14376,19 +14252,19 @@
       }
     },
     "node_modules/vue-component-type-helpers": {
-      "version": "1.8.24",
-      "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-1.8.24.tgz",
-      "integrity": "sha512-lqWs/7fdRXoSBAlbouHBX+LNuaY6gI9xWW34m/ZIz9zVPYHEyw0b2/zaCBwlKx0NtKTeF/6pOpvrxVkh7nhIYg==",
+      "version": "2.0.29",
+      "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-2.0.29.tgz",
+      "integrity": "sha512-58i+ZhUAUpwQ+9h5Hck0D+jr1qbYl4voRt5KffBx8qzELViQ4XdT/Tuo+mzq8u63teAG8K0lLaOiL5ofqW38rg==",
       "dev": true
     },
     "node_modules/vue-docgen-api": {
-      "version": "4.78.0",
-      "resolved": "https://registry.npmjs.org/vue-docgen-api/-/vue-docgen-api-4.78.0.tgz",
-      "integrity": "sha512-RsZf+qzTttCCAN9v7AKmBykc2QWmO8csVk1c2aXeOktomSOu0NA7sgK4ObuRB5lpmtOvTnwuxssyYmxXxABr+A==",
+      "version": "4.79.2",
+      "resolved": "https://registry.npmjs.org/vue-docgen-api/-/vue-docgen-api-4.79.2.tgz",
+      "integrity": "sha512-n9ENAcs+40awPZMsas7STqjkZiVlIjxIKgiJr5rSohDP0/JCrD9VtlzNojafsA1MChm/hz2h3PDtUedx3lbgfA==",
       "dev": true,
       "dependencies": {
-        "@babel/parser": "^7.21.4",
-        "@babel/types": "^7.21.4",
+        "@babel/parser": "^7.24.7",
+        "@babel/types": "^7.24.7",
         "@vue/compiler-dom": "^3.2.0",
         "@vue/compiler-sfc": "^3.2.0",
         "ast-types": "^0.16.1",
@@ -14404,6 +14280,18 @@
         "vue": ">=2"
       }
     },
+    "node_modules/vue-docgen-api/node_modules/ast-types": {
+      "version": "0.16.1",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.16.1.tgz",
+      "integrity": "sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==",
+      "dev": true,
+      "dependencies": {
+        "tslib": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/vue-docgen-api/node_modules/lru-cache": {
       "version": "8.0.5",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-8.0.5.tgz",
@@ -14451,9 +14339,9 @@
       }
     },
     "node_modules/vue-eslint-parser": {
-      "version": "9.3.2",
-      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.3.2.tgz",
-      "integrity": "sha512-q7tWyCVaV9f8iQyIA5Mkj/S6AoJ9KBN8IeUSf3XEmBrOtxOZnfTg5s4KClbZBCK3GtnT/+RyCLZyDHuZwTuBjg==",
+      "version": "9.4.3",
+      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.4.3.tgz",
+      "integrity": "sha512-2rYRLWlIpaiN8xbPiDyXZXRgLGOtWxERV7ND5fFAv5qo1D2N9Fu9MNajBNc6o13lZ+24DAWCkQCvj4klgmcITg==",
       "dev": true,
       "dependencies": {
         "debug": "^4.3.4",
@@ -14499,26 +14387,11 @@
         "node": ">=4.0"
       }
     },
-    "node_modules/vue-eslint-parser/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/vue-eslint-parser/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -14526,12 +14399,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/vue-eslint-parser/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/vue-inbrowser-compiler-independent-utils": {
       "version": "4.71.1",
       "resolved": "https://registry.npmjs.org/vue-inbrowser-compiler-independent-utils/-/vue-inbrowser-compiler-independent-utils-4.71.1.tgz",
@@ -14542,12 +14409,12 @@
       }
     },
     "node_modules/vue-router": {
-      "version": "4.2.5",
-      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.2.5.tgz",
-      "integrity": "sha512-DIUpKcyg4+PTQKfFPX88UWhlagBEBEfJ5A8XDXRJLUnZOvcpMF8o/dnL90vpVkGaPbjvXazV/rC1qBKrZlFugw==",
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.4.2.tgz",
+      "integrity": "sha512-1qNybkn2L7QsLzaXs8nvlQmRKp8XF8DCxZys/Jr1JpQcHsKUxTKzTxCVA1G7NfBfwRIBgCJPoujOG5lHCCNUxw==",
       "dev": true,
       "dependencies": {
-        "@vue/devtools-api": "^6.5.0"
+        "@vue/devtools-api": "^6.6.3"
       },
       "funding": {
         "url": "https://github.com/sponsors/posva"
@@ -14557,9 +14424,9 @@
       }
     },
     "node_modules/vue-template-compiler": {
-      "version": "2.7.15",
-      "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.15.tgz",
-      "integrity": "sha512-yQxjxMptBL7UAog00O8sANud99C6wJF+7kgbcwqkvA38vCGF7HWE66w0ZFnS/kX5gSoJr/PQ4/oS3Ne2pW37Og==",
+      "version": "2.7.16",
+      "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.16.tgz",
+      "integrity": "sha512-AYbUWAJHLGGQM7+cNTELw+KsOG9nl2CnSv467WobS5Cv9uk3wFcnr1Etsz2sEIHEZvw1U+o9mRlEO6QbZvUPGQ==",
       "dev": true,
       "dependencies": {
         "de-indent": "^1.0.2",
@@ -14567,42 +14434,96 @@
       }
     },
     "node_modules/vue-tsc": {
-      "version": "1.8.24",
-      "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-1.8.24.tgz",
-      "integrity": "sha512-eH1CSj231OzVEY5Hi7wS6ubzyOEwgr5jCptR0Ddf2SitGcaXIsPVDvrprm3eolCdyhDt3WS1Eb2F4fGX9BsUUw==",
+      "version": "2.0.29",
+      "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-2.0.29.tgz",
+      "integrity": "sha512-MHhsfyxO3mYShZCGYNziSbc63x7cQ5g9kvijV7dRe1TTXBRLxXyL0FnXWpUF1xII2mJ86mwYpYsUmMwkmerq7Q==",
       "dev": true,
       "dependencies": {
-        "@volar/typescript": "~1.11.1",
-        "@vue/language-core": "1.8.24",
+        "@volar/typescript": "~2.4.0-alpha.18",
+        "@vue/language-core": "2.0.29",
         "semver": "^7.5.4"
       },
       "bin": {
         "vue-tsc": "bin/vue-tsc.js"
       },
+      "peerDependencies": {
+        "typescript": ">=5.0.0"
+      }
+    },
+    "node_modules/vue-tsc/node_modules/@volar/language-core": {
+      "version": "2.4.0-alpha.18",
+      "resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-2.4.0-alpha.18.tgz",
+      "integrity": "sha512-JAYeJvYQQROmVRtSBIczaPjP3DX4QW1fOqW1Ebs0d3Y3EwSNRglz03dSv0Dm61dzd0Yx3WgTW3hndDnTQqgmyg==",
+      "dev": true,
+      "dependencies": {
+        "@volar/source-map": "2.4.0-alpha.18"
+      }
+    },
+    "node_modules/vue-tsc/node_modules/@volar/source-map": {
+      "version": "2.4.0-alpha.18",
+      "resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-2.4.0-alpha.18.tgz",
+      "integrity": "sha512-MTeCV9MUwwsH0sNFiZwKtFrrVZUK6p8ioZs3xFzHc2cvDXHWlYN3bChdQtwKX+FY2HG6H3CfAu1pKijolzIQ8g==",
+      "dev": true
+    },
+    "node_modules/vue-tsc/node_modules/@vue/language-core": {
+      "version": "2.0.29",
+      "resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-2.0.29.tgz",
+      "integrity": "sha512-o2qz9JPjhdoVj8D2+9bDXbaI4q2uZTHQA/dbyZT4Bj1FR9viZxDJnLcKVHfxdn6wsOzRgpqIzJEEmSSvgMvDTQ==",
+      "dev": true,
+      "dependencies": {
+        "@volar/language-core": "~2.4.0-alpha.18",
+        "@vue/compiler-dom": "^3.4.0",
+        "@vue/compiler-vue2": "^2.7.16",
+        "@vue/shared": "^3.4.0",
+        "computeds": "^0.0.1",
+        "minimatch": "^9.0.3",
+        "muggle-string": "^0.4.1",
+        "path-browserify": "^1.0.1"
+      },
       "peerDependencies": {
         "typescript": "*"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
       }
     },
-    "node_modules/vue-tsc/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+    "node_modules/vue-tsc/node_modules/brace-expansion": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
       "dev": true,
       "dependencies": {
-        "yallist": "^4.0.0"
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/vue-tsc/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "dev": true,
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
       },
       "engines": {
-        "node": ">=10"
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
+    "node_modules/vue-tsc/node_modules/muggle-string": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/muggle-string/-/muggle-string-0.4.1.tgz",
+      "integrity": "sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==",
+      "dev": true
+    },
     "node_modules/vue-tsc/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -14610,12 +14531,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/vue-tsc/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/w3c-hr-time": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz",
@@ -14723,15 +14638,18 @@
       }
     },
     "node_modules/which-collection": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.1.tgz",
-      "integrity": "sha512-W8xeTUwaln8i3K/cY1nGXzdnVZlidBcagyNFtBdD5kxnb4TvGKR7FfSIS3mYpwWS1QUCutfKz8IY8RjftB0+1A==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.2.tgz",
+      "integrity": "sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==",
       "dev": true,
       "dependencies": {
-        "is-map": "^2.0.1",
-        "is-set": "^2.0.1",
-        "is-weakmap": "^2.0.1",
-        "is-weakset": "^2.0.1"
+        "is-map": "^2.0.3",
+        "is-set": "^2.0.3",
+        "is-weakmap": "^2.0.2",
+        "is-weakset": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -14747,16 +14665,16 @@
       }
     },
     "node_modules/which-typed-array": {
-      "version": "1.1.13",
-      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.13.tgz",
-      "integrity": "sha512-P5Nra0qjSncduVPEAr7xhoF5guty49ArDTwzJ/yNuPIbZppyRxFQsRCWrocxIY+CnMVG+qfbU2FmDKyvSGClow==",
+      "version": "1.1.15",
+      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.15.tgz",
+      "integrity": "sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==",
       "dev": true,
       "dependencies": {
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.4",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
         "gopd": "^1.0.1",
-        "has-tostringtag": "^1.0.0"
+        "has-tostringtag": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -14766,9 +14684,9 @@
       }
     },
     "node_modules/why-is-node-running": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-2.2.2.tgz",
-      "integrity": "sha512-6tSwToZxTOcotxHeA+qGCq1mVzKR3CwcJGmVcY+QE8SHy6TnpFnh8PAvPNHYr7EcuVeG0QSMxtYCuO1ta/G/oA==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-2.3.0.tgz",
+      "integrity": "sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==",
       "dev": true,
       "dependencies": {
         "siginfo": "^2.0.0",
@@ -14887,9 +14805,9 @@
       }
     },
     "node_modules/ws": {
-      "version": "7.5.9",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.9.tgz",
-      "integrity": "sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==",
+      "version": "7.5.10",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.10.tgz",
+      "integrity": "sha512-+dbF1tHwZpXcbOJdVOkzLDxZP1ailvSxM6ZweXTegylPny803bFhA+vqBYw4s31NSAk4S2Qz+AKXK9a4wkdjcQ==",
       "dev": true,
       "engines": {
         "node": ">=8.3.0"
@@ -14988,27 +14906,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/yargs-unparser/node_modules/decamelize": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-4.0.0.tgz",
-      "integrity": "sha512-9iE1PgSik9HeIIw2JO94IidnE3eBoQrFJ3w7sFuzSX4DpmZ3v5sZpUiV5Swcf6mQEF+Y0ru8Neo+p+nyh2J+hQ==",
-      "dev": true,
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/yargs-unparser/node_modules/is-plain-obj": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-2.1.0.tgz",
-      "integrity": "sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA==",
-      "dev": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/yauzl": {
       "version": "2.10.0",
       "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.10.0.tgz",
@@ -15106,11032 +15003,13 @@
       }
     },
     "node_modules/zod": {
-      "version": "3.22.4",
-      "resolved": "https://registry.npmjs.org/zod/-/zod-3.22.4.tgz",
-      "integrity": "sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==",
+      "version": "3.23.8",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-3.23.8.tgz",
+      "integrity": "sha512-XBx9AXhXktjUqnepgTiE5flcKIYWi/rme0Eaj+5Y0lftuGBq+jyRu/md4WnuxqgP1ubdpNCsYEYPxrzVHD8d6g==",
       "dev": true,
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }
     }
-  },
-  "dependencies": {
-    "@aashutoshrathi/word-wrap": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz",
-      "integrity": "sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==",
-      "dev": true
-    },
-    "@ampproject/remapping": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.2.1.tgz",
-      "integrity": "sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==",
-      "dev": true,
-      "peer": true,
-      "requires": {
-        "@jridgewell/gen-mapping": "^0.3.0",
-        "@jridgewell/trace-mapping": "^0.3.9"
-      }
-    },
-    "@assemblyscript/loader": {
-      "version": "0.10.1",
-      "resolved": "https://registry.npmjs.org/@assemblyscript/loader/-/loader-0.10.1.tgz",
-      "integrity": "sha512-H71nDOOL8Y7kWRLqf6Sums+01Q5msqBW2KhDUTemh1tvY04eSkSXrK0uj/4mmY0Xr16/3zyZmsrxN7CKuRbNRg==",
-      "dev": true
-    },
-    "@babel/code-frame": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.23.5.tgz",
-      "integrity": "sha512-CgH3s1a96LipHCmSUmYFPwY7MNx8C3avkq7i4Wl3cfa662ldtUe4VM1TPXX70pfmrlWTb6jLqTYrZyT2ZTJBgA==",
-      "dev": true,
-      "requires": {
-        "@babel/highlight": "^7.23.4",
-        "chalk": "^2.4.2"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
-          "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-          "dev": true,
-          "requires": {
-            "color-convert": "^1.9.0"
-          }
-        },
-        "chalk": {
-          "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-          "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^3.2.1",
-            "escape-string-regexp": "^1.0.5",
-            "supports-color": "^5.3.0"
-          }
-        },
-        "color-convert": {
-          "version": "1.9.3",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
-          "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-          "dev": true,
-          "requires": {
-            "color-name": "1.1.3"
-          }
-        },
-        "color-name": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-          "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
-          "dev": true
-        },
-        "escape-string-regexp": {
-          "version": "1.0.5",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-          "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
-          "dev": true
-        },
-        "has-flag": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-          "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
-          "dev": true
-        },
-        "supports-color": {
-          "version": "5.5.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
-          "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-          "dev": true,
-          "requires": {
-            "has-flag": "^3.0.0"
-          }
-        }
-      }
-    },
-    "@babel/compat-data": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.23.5.tgz",
-      "integrity": "sha512-uU27kfDRlhfKl+w1U6vp16IuvSLtjAxdArVXPa9BvLkrr7CYIsxH5adpHObeAGY/41+syctUWOZ140a2Rvkgjw==",
-      "dev": true
-    },
-    "@babel/core": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.23.5.tgz",
-      "integrity": "sha512-Cwc2XjUrG4ilcfOw4wBAK+enbdgwAcAJCfGUItPBKR7Mjw4aEfAFYrLxeRp4jWgtNIKn3n2AlBOfwwafl+42/g==",
-      "dev": true,
-      "peer": true,
-      "requires": {
-        "@ampproject/remapping": "^2.2.0",
-        "@babel/code-frame": "^7.23.5",
-        "@babel/generator": "^7.23.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helpers": "^7.23.5",
-        "@babel/parser": "^7.23.5",
-        "@babel/template": "^7.22.15",
-        "@babel/traverse": "^7.23.5",
-        "@babel/types": "^7.23.5",
-        "convert-source-map": "^2.0.0",
-        "debug": "^4.1.0",
-        "gensync": "^1.0.0-beta.2",
-        "json5": "^2.2.3",
-        "semver": "^6.3.1"
-      }
-    },
-    "@babel/generator": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.5.tgz",
-      "integrity": "sha512-BPssCHrBD+0YrxviOa3QzpqwhNIXKEtOa2jQrm4FlmkC2apYgRnQcmPWiGZDlGxiNtltnUFolMe8497Esry+jA==",
-      "dev": true,
-      "peer": true,
-      "requires": {
-        "@babel/types": "^7.23.5",
-        "@jridgewell/gen-mapping": "^0.3.2",
-        "@jridgewell/trace-mapping": "^0.3.17",
-        "jsesc": "^2.5.1"
-      }
-    },
-    "@babel/helper-annotate-as-pure": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.22.5.tgz",
-      "integrity": "sha512-LvBTxu8bQSQkcyKOU+a1btnNFQ1dMAd0R6PyW3arXes06F6QLWLIrd681bxRPIXlrMGR3XYnW9JyML7dP3qgxg==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.22.5"
-      }
-    },
-    "@babel/helper-builder-binary-assignment-operator-visitor": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.22.15.tgz",
-      "integrity": "sha512-QkBXwGgaoC2GtGZRoma6kv7Szfv06khvhFav67ZExau2RaXzy8MpHSMO2PNoP2XtmQphJQRHFfg77Bq731Yizw==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.22.15"
-      }
-    },
-    "@babel/helper-compilation-targets": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.15.tgz",
-      "integrity": "sha512-y6EEzULok0Qvz8yyLkCvVX+02ic+By2UdOhylwUOvOn9dvYc9mKICJuuU1n1XBI02YWsNsnrY1kc6DVbjcXbtw==",
-      "dev": true,
-      "requires": {
-        "@babel/compat-data": "^7.22.9",
-        "@babel/helper-validator-option": "^7.22.15",
-        "browserslist": "^4.21.9",
-        "lru-cache": "^5.1.1",
-        "semver": "^6.3.1"
-      }
-    },
-    "@babel/helper-create-class-features-plugin": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.23.5.tgz",
-      "integrity": "sha512-QELlRWxSpgdwdJzSJn4WAhKC+hvw/AtHbbrIoncKHkhKKR/luAlKkgBDcri1EzWAo8f8VvYVryEHN4tax/V67A==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-member-expression-to-functions": "^7.23.0",
-        "@babel/helper-optimise-call-expression": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
-        "@babel/helper-split-export-declaration": "^7.22.6",
-        "semver": "^6.3.1"
-      }
-    },
-    "@babel/helper-create-regexp-features-plugin": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.22.15.tgz",
-      "integrity": "sha512-29FkPLFjn4TPEa3RE7GpW+qbE8tlsu3jntNYNfcGsc49LphF1PQIiD+vMZ1z1xVOKt+93khA9tc2JBs3kBjA7w==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
-        "regexpu-core": "^5.3.1",
-        "semver": "^6.3.1"
-      }
-    },
-    "@babel/helper-define-polyfill-provider": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.4.3.tgz",
-      "integrity": "sha512-WBrLmuPP47n7PNwsZ57pqam6G/RGo1vw/87b0Blc53tZNGZ4x7YvZ6HgQe2vo1W/FR20OgjeZuGXzudPiXHFug==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-compilation-targets": "^7.22.6",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "debug": "^4.1.1",
-        "lodash.debounce": "^4.0.8",
-        "resolve": "^1.14.2"
-      }
-    },
-    "@babel/helper-environment-visitor": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz",
-      "integrity": "sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==",
-      "dev": true
-    },
-    "@babel/helper-function-name": {
-      "version": "7.23.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz",
-      "integrity": "sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==",
-      "dev": true,
-      "requires": {
-        "@babel/template": "^7.22.15",
-        "@babel/types": "^7.23.0"
-      }
-    },
-    "@babel/helper-hoist-variables": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz",
-      "integrity": "sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.22.5"
-      }
-    },
-    "@babel/helper-member-expression-to-functions": {
-      "version": "7.23.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.23.0.tgz",
-      "integrity": "sha512-6gfrPwh7OuT6gZyJZvd6WbTfrqAo7vm4xCzAXOusKqq/vWdKXphTpj5klHKNmRUU6/QRGlBsyU9mAIPaWHlqJA==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.23.0"
-      }
-    },
-    "@babel/helper-module-imports": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz",
-      "integrity": "sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.22.15"
-      }
-    },
-    "@babel/helper-module-transforms": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.23.3.tgz",
-      "integrity": "sha512-7bBs4ED9OmswdfDzpz4MpWgSrV7FXlc3zIagvLFjS5H+Mk7Snr21vQ6QwrsoCGMfNC4e4LQPdoULEt4ykz0SRQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-module-imports": "^7.22.15",
-        "@babel/helper-simple-access": "^7.22.5",
-        "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/helper-validator-identifier": "^7.22.20"
-      }
-    },
-    "@babel/helper-optimise-call-expression": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.22.5.tgz",
-      "integrity": "sha512-HBwaojN0xFRx4yIvpwGqxiV2tUfl7401jlok564NgB9EHS1y6QT17FmKWm4ztqjeVdXLuC4fSvHc5ePpQjoTbw==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.22.5"
-      }
-    },
-    "@babel/helper-plugin-utils": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz",
-      "integrity": "sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==",
-      "dev": true
-    },
-    "@babel/helper-remap-async-to-generator": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.22.20.tgz",
-      "integrity": "sha512-pBGyV4uBqOns+0UvhsTO8qgl8hO89PmiDYv+/COyp1aeMcmfrfruz+/nCMFiYyFF/Knn0yfrC85ZzNFjembFTw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-wrap-function": "^7.22.20"
-      }
-    },
-    "@babel/helper-replace-supers": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.22.20.tgz",
-      "integrity": "sha512-qsW0In3dbwQUbK8kejJ4R7IHVGwHJlV6lpG6UA7a9hSa2YEiAib+N1T2kr6PEeUT+Fl7najmSOS6SmAwCHK6Tw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-member-expression-to-functions": "^7.22.15",
-        "@babel/helper-optimise-call-expression": "^7.22.5"
-      }
-    },
-    "@babel/helper-simple-access": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.22.5.tgz",
-      "integrity": "sha512-n0H99E/K+Bika3++WNL17POvo4rKWZ7lZEp1Q+fStVbUi8nxPQEBOlTmCOxW/0JsS56SKKQ+ojAe2pHKJHN35w==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.22.5"
-      }
-    },
-    "@babel/helper-skip-transparent-expression-wrappers": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.22.5.tgz",
-      "integrity": "sha512-tK14r66JZKiC43p8Ki33yLBVJKlQDFoA8GYN67lWCDCqoL6EMMSuM9b+Iff2jHaM/RRFYl7K+iiru7hbRqNx8Q==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.22.5"
-      }
-    },
-    "@babel/helper-split-export-declaration": {
-      "version": "7.22.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz",
-      "integrity": "sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.22.5"
-      }
-    },
-    "@babel/helper-string-parser": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.23.4.tgz",
-      "integrity": "sha512-803gmbQdqwdf4olxrX4AJyFBV/RTr3rSmOj0rKwesmzlfhYNDEs+/iOcznzpNWlJlIlTJC2QfPFcHB6DlzdVLQ==",
-      "dev": true
-    },
-    "@babel/helper-validator-identifier": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz",
-      "integrity": "sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==",
-      "dev": true
-    },
-    "@babel/helper-validator-option": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.23.5.tgz",
-      "integrity": "sha512-85ttAOMLsr53VgXkTbkx8oA6YTfT4q7/HzXSLEYmjcSTJPMPQtvq1BD79Byep5xMUYbGRzEpDsjUf3dyp54IKw==",
-      "dev": true
-    },
-    "@babel/helper-wrap-function": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-wrap-function/-/helper-wrap-function-7.22.20.tgz",
-      "integrity": "sha512-pms/UwkOpnQe/PDAEdV/d7dVCoBbB+R4FvYoHGZz+4VPcg7RtYy2KP7S2lbuWM6FCSgob5wshfGESbC/hzNXZw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-function-name": "^7.22.5",
-        "@babel/template": "^7.22.15",
-        "@babel/types": "^7.22.19"
-      }
-    },
-    "@babel/helpers": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.23.5.tgz",
-      "integrity": "sha512-oO7us8FzTEsG3U6ag9MfdF1iA/7Z6dz+MtFhifZk8C8o453rGJFFWUP1t+ULM9TUIAzC9uxXEiXjOiVMyd7QPg==",
-      "dev": true,
-      "peer": true,
-      "requires": {
-        "@babel/template": "^7.22.15",
-        "@babel/traverse": "^7.23.5",
-        "@babel/types": "^7.23.5"
-      }
-    },
-    "@babel/highlight": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.23.4.tgz",
-      "integrity": "sha512-acGdbYSfp2WheJoJm/EBBBLh/ID8KDc64ISZ9DYtBmC8/Q204PZJLHyzeB5qMzJ5trcOkybd78M4x2KWsUq++A==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-validator-identifier": "^7.22.20",
-        "chalk": "^2.4.2",
-        "js-tokens": "^4.0.0"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
-          "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-          "dev": true,
-          "requires": {
-            "color-convert": "^1.9.0"
-          }
-        },
-        "chalk": {
-          "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-          "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^3.2.1",
-            "escape-string-regexp": "^1.0.5",
-            "supports-color": "^5.3.0"
-          }
-        },
-        "color-convert": {
-          "version": "1.9.3",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
-          "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-          "dev": true,
-          "requires": {
-            "color-name": "1.1.3"
-          }
-        },
-        "color-name": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-          "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
-          "dev": true
-        },
-        "escape-string-regexp": {
-          "version": "1.0.5",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-          "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
-          "dev": true
-        },
-        "has-flag": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-          "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
-          "dev": true
-        },
-        "supports-color": {
-          "version": "5.5.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
-          "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-          "dev": true,
-          "requires": {
-            "has-flag": "^3.0.0"
-          }
-        }
-      }
-    },
-    "@babel/parser": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.5.tgz",
-      "integrity": "sha512-hOOqoiNXrmGdFbhgCzu6GiURxUgM27Xwd/aPuu8RfHEZPBzL1Z54okAHAQjXfcQNwvrlkAmAp4SlRTZ45vlthQ=="
-    },
-    "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.23.3.tgz",
-      "integrity": "sha512-iRkKcCqb7iGnq9+3G6rZ+Ciz5VywC4XNRHe57lKM+jOeYAoR0lVqdeeDRfh0tQcTfw/+vBhHn926FmQhLtlFLQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.23.3.tgz",
-      "integrity": "sha512-WwlxbfMNdVEpQjZmK5mhm7oSwD3dS6eU+Iwsi4Knl9wAletWem7kaRsGOG+8UEbRyqxY4SS5zvtfXwX+jMxUwQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
-        "@babel/plugin-transform-optional-chaining": "^7.23.3"
-      }
-    },
-    "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.23.3.tgz",
-      "integrity": "sha512-XaJak1qcityzrX0/IU5nKHb34VaibwP3saKqG6a/tppelgllOH13LUann4ZCIBcVOeE6H18K4Vx9QKkVww3z/w==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-proposal-private-property-in-object": {
-      "version": "7.21.0-placeholder-for-preset-env.2",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0-placeholder-for-preset-env.2.tgz",
-      "integrity": "sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==",
-      "dev": true,
-      "requires": {}
-    },
-    "@babel/plugin-syntax-async-generators": {
-      "version": "7.8.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-async-generators/-/plugin-syntax-async-generators-7.8.4.tgz",
-      "integrity": "sha512-tycmZxkGfZaxhMRbXlPXuVFpdWlXpir2W4AMhSJgRKzk/eDlIXOhb2LHWoLpDF7TEHylV5zNhykX6KAgHJmTNw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      }
-    },
-    "@babel/plugin-syntax-class-properties": {
-      "version": "7.12.13",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-properties-7.12.13.tgz",
-      "integrity": "sha512-fm4idjKla0YahUNgFNLCB0qySdsoPiZP3iQE3rky0mBUtMZ23yDJ9SJdg6dXTSDnulOVqiF3Hgr9nbXvXTQZYA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.12.13"
-      }
-    },
-    "@babel/plugin-syntax-class-static-block": {
-      "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-class-static-block/-/plugin-syntax-class-static-block-7.14.5.tgz",
-      "integrity": "sha512-b+YyPmr6ldyNnM6sqYeMWE+bgJcJpO6yS4QD7ymxgH34GBPNDM/THBh8iunyvKIZztiwLH4CJZ0RxTk9emgpjw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.14.5"
-      }
-    },
-    "@babel/plugin-syntax-dynamic-import": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.8.3.tgz",
-      "integrity": "sha512-5gdGbFon+PszYzqs83S3E5mpi7/y/8M9eC90MRTZfduQOYW76ig6SOSPNe41IG5LoP3FGBn2N0RjVDSQiS94kQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      }
-    },
-    "@babel/plugin-syntax-export-namespace-from": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-export-namespace-from/-/plugin-syntax-export-namespace-from-7.8.3.tgz",
-      "integrity": "sha512-MXf5laXo6c1IbEbegDmzGPwGNTsHZmEy6QGznu5Sh2UCWvueywb2ee+CCE4zQiZstxU9BMoQO9i6zUFSY0Kj0Q==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.8.3"
-      }
-    },
-    "@babel/plugin-syntax-import-assertions": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.23.3.tgz",
-      "integrity": "sha512-lPgDSU+SJLK3xmFDTV2ZRQAiM7UuUjGidwBywFavObCiZc1BeAAcMtHJKUya92hPHO+at63JJPLygilZard8jw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-syntax-import-attributes": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.23.3.tgz",
-      "integrity": "sha512-pawnE0P9g10xgoP7yKr6CK63K2FMsTE+FZidZO/1PwRdzmAPVs+HS1mAURUsgaoxammTJvULUdIkEK0gOcU2tA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-syntax-import-meta": {
-      "version": "7.10.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-meta/-/plugin-syntax-import-meta-7.10.4.tgz",
-      "integrity": "sha512-Yqfm+XDx0+Prh3VSeEQCPU81yC+JWZ2pDPFSS4ZdpfZhp4MkFMaDC1UqseovEKwSUpnIL7+vK+Clp7bfh0iD7g==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.10.4"
-      }
-    },
-    "@babel/plugin-syntax-json-strings": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.8.3.tgz",
-      "integrity": "sha512-lY6kdGpWHvjoe2vk4WrAapEuBR69EMxZl+RoGRhrFGNYVK8mOPAW8VfbT/ZgrFbXlDNiiaxQnAtgVCZ6jv30EA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      }
-    },
-    "@babel/plugin-syntax-logical-assignment-operators": {
-      "version": "7.10.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-logical-assignment-operators/-/plugin-syntax-logical-assignment-operators-7.10.4.tgz",
-      "integrity": "sha512-d8waShlpFDinQ5MtvGU9xDAOzKH47+FFoney2baFIoMr952hKOLp1HR7VszoZvOsV/4+RRszNY7D17ba0te0ig==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.10.4"
-      }
-    },
-    "@babel/plugin-syntax-nullish-coalescing-operator": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-nullish-coalescing-operator/-/plugin-syntax-nullish-coalescing-operator-7.8.3.tgz",
-      "integrity": "sha512-aSff4zPII1u2QD7y+F8oDsz19ew4IGEJg9SVW+bqwpwtfFleiQDMdzA/R+UlWDzfnHFCxxleFT0PMIrR36XLNQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      }
-    },
-    "@babel/plugin-syntax-numeric-separator": {
-      "version": "7.10.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-numeric-separator/-/plugin-syntax-numeric-separator-7.10.4.tgz",
-      "integrity": "sha512-9H6YdfkcK/uOnY/K7/aA2xpzaAgkQn37yzWUMRK7OaPOqOpGS1+n0H5hxT9AUw9EsSjPW8SVyMJwYRtWs3X3ug==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.10.4"
-      }
-    },
-    "@babel/plugin-syntax-object-rest-spread": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-object-rest-spread/-/plugin-syntax-object-rest-spread-7.8.3.tgz",
-      "integrity": "sha512-XoqMijGZb9y3y2XskN+P1wUGiVwWZ5JmoDRwx5+3GmEplNyVM2s2Dg8ILFQm8rWM48orGy5YpI5Bl8U1y7ydlA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      }
-    },
-    "@babel/plugin-syntax-optional-catch-binding": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-optional-catch-binding/-/plugin-syntax-optional-catch-binding-7.8.3.tgz",
-      "integrity": "sha512-6VPD0Pc1lpTqw0aKoeRTMiB+kWhAoT24PA+ksWSBrFtl5SIRVpZlwN3NNPQjehA2E/91FV3RjLWoVTglWcSV3Q==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      }
-    },
-    "@babel/plugin-syntax-optional-chaining": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-optional-chaining/-/plugin-syntax-optional-chaining-7.8.3.tgz",
-      "integrity": "sha512-KoK9ErH1MBlCPxV0VANkXW2/dw4vlbGDrFgz8bmUsBGYkFRcbRwMh6cIJubdPrkxRwuGdtCk0v/wPTKbQgBjkg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      }
-    },
-    "@babel/plugin-syntax-private-property-in-object": {
-      "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-private-property-in-object/-/plugin-syntax-private-property-in-object-7.14.5.tgz",
-      "integrity": "sha512-0wVnp9dxJ72ZUJDV27ZfbSj6iHLoytYZmh3rFcxNnvsJF3ktkzLDZPy/mA17HGsaQT3/DQsWYX1f1QGWkCoVUg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.14.5"
-      }
-    },
-    "@babel/plugin-syntax-top-level-await": {
-      "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-top-level-await/-/plugin-syntax-top-level-await-7.14.5.tgz",
-      "integrity": "sha512-hx++upLv5U1rgYfwe1xBQUhRmU41NEvpUvrp8jkrSCdvGSnM5/qdRMtylJ6PG5OFkBaHkbTAKTnd3/YyESRHFw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.14.5"
-      }
-    },
-    "@babel/plugin-syntax-unicode-sets-regex": {
-      "version": "7.18.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-unicode-sets-regex/-/plugin-syntax-unicode-sets-regex-7.18.6.tgz",
-      "integrity": "sha512-727YkEAPwSIQTv5im8QHz3upqp92JTWhidIC81Tdx4VJYIte/VndKf1qKrfnnhPLiPghStWfvC/iFaMCQu7Nqg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-regexp-features-plugin": "^7.18.6",
-        "@babel/helper-plugin-utils": "^7.18.6"
-      }
-    },
-    "@babel/plugin-transform-arrow-functions": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.23.3.tgz",
-      "integrity": "sha512-NzQcQrzaQPkaEwoTm4Mhyl8jI1huEL/WWIEvudjTCMJ9aBZNpsJbMASx7EQECtQQPS/DcnFpo0FIh3LvEO9cxQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-async-generator-functions": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.23.4.tgz",
-      "integrity": "sha512-efdkfPhHYTtn0G6n2ddrESE91fgXxjlqLsnUtPWnJs4a4mZIbUaK7ffqKIIUKXSHwcDvaCVX6GXkaJJFqtX7jw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-remap-async-to-generator": "^7.22.20",
-        "@babel/plugin-syntax-async-generators": "^7.8.4"
-      }
-    },
-    "@babel/plugin-transform-async-to-generator": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.23.3.tgz",
-      "integrity": "sha512-A7LFsKi4U4fomjqXJlZg/u0ft/n8/7n7lpffUP/ZULx/DtV9SGlNKZolHH6PE8Xl1ngCc0M11OaeZptXVkfKSw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-module-imports": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-remap-async-to-generator": "^7.22.20"
-      }
-    },
-    "@babel/plugin-transform-block-scoped-functions": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.23.3.tgz",
-      "integrity": "sha512-vI+0sIaPIO6CNuM9Kk5VmXcMVRiOpDh7w2zZt9GXzmE/9KD70CUEVhvPR/etAeNK/FAEkhxQtXOzVF3EuRL41A==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-block-scoping": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.23.4.tgz",
-      "integrity": "sha512-0QqbP6B6HOh7/8iNR4CQU2Th/bbRtBp4KS9vcaZd1fZ0wSh5Fyssg0UCIHwxh+ka+pNDREbVLQnHCMHKZfPwfw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-class-properties": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.23.3.tgz",
-      "integrity": "sha512-uM+AN8yCIjDPccsKGlw271xjJtGii+xQIF/uMPS8H15L12jZTsLfF4o5vNO7d/oUguOyfdikHGc/yi9ge4SGIg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-class-static-block": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.23.4.tgz",
-      "integrity": "sha512-nsWu/1M+ggti1SOALj3hfx5FXzAY06fwPJsUZD4/A5e1bWi46VUIWtD+kOX6/IdhXGsXBWllLFDSnqSCdUNydQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-class-static-block": "^7.14.5"
-      }
-    },
-    "@babel/plugin-transform-classes": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.23.5.tgz",
-      "integrity": "sha512-jvOTR4nicqYC9yzOHIhXG5emiFEOpappSJAl73SDSEDcybD+Puuze8Tnpb9p9qEyYup24tq891gkaygIFvWDqg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-optimise-call-expression": "^7.22.5",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20",
-        "@babel/helper-split-export-declaration": "^7.22.6",
-        "globals": "^11.1.0"
-      }
-    },
-    "@babel/plugin-transform-computed-properties": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.23.3.tgz",
-      "integrity": "sha512-dTj83UVTLw/+nbiHqQSFdwO9CbTtwq1DsDqm3CUEtDrZNET5rT5E6bIdTlOftDTDLMYxvxHNEYO4B9SLl8SLZw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/template": "^7.22.15"
-      }
-    },
-    "@babel/plugin-transform-destructuring": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.23.3.tgz",
-      "integrity": "sha512-n225npDqjDIr967cMScVKHXJs7rout1q+tt50inyBCPkyZ8KxeI6d+GIbSBTT/w/9WdlWDOej3V9HE5Lgk57gw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-dotall-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.23.3.tgz",
-      "integrity": "sha512-vgnFYDHAKzFaTVp+mneDsIEbnJ2Np/9ng9iviHw3P/KVcgONxpNULEW/51Z/BaFojG2GI2GwwXck5uV1+1NOYQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-duplicate-keys": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.23.3.tgz",
-      "integrity": "sha512-RrqQ+BQmU3Oyav3J+7/myfvRCq7Tbz+kKLLshUmMwNlDHExbGL7ARhajvoBJEvc+fCguPPu887N+3RRXBVKZUA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-dynamic-import": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.23.4.tgz",
-      "integrity": "sha512-V6jIbLhdJK86MaLh4Jpghi8ho5fGzt3imHOBu/x0jlBaPYqDoWz4RDXjmMOfnh+JWNaQleEAByZLV0QzBT4YQQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-dynamic-import": "^7.8.3"
-      }
-    },
-    "@babel/plugin-transform-exponentiation-operator": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.23.3.tgz",
-      "integrity": "sha512-5fhCsl1odX96u7ILKHBj4/Y8vipoqwsJMh4csSA8qFfxrZDEA4Ssku2DyNvMJSmZNOEBT750LfFPbtrnTP90BQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-builder-binary-assignment-operator-visitor": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-export-namespace-from": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.23.4.tgz",
-      "integrity": "sha512-GzuSBcKkx62dGzZI1WVgTWvkkz84FZO5TC5T8dl/Tht/rAla6Dg/Mz9Yhypg+ezVACf/rgDuQt3kbWEv7LdUDQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-export-namespace-from": "^7.8.3"
-      }
-    },
-    "@babel/plugin-transform-for-of": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.23.3.tgz",
-      "integrity": "sha512-X8jSm8X1CMwxmK878qsUGJRmbysKNbdpTv/O1/v0LuY/ZkZrng5WYiekYSdg9m09OTmDDUWeEDsTE+17WYbAZw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-function-name": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.23.3.tgz",
-      "integrity": "sha512-I1QXp1LxIvt8yLaib49dRW5Okt7Q4oaxao6tFVKS/anCdEOMtYwWVKoiOA1p34GOWIZjUK0E+zCp7+l1pfQyiw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-json-strings": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.23.4.tgz",
-      "integrity": "sha512-81nTOqM1dMwZ/aRXQ59zVubN9wHGqk6UtqRK+/q+ciXmRy8fSolhGVvG09HHRGo4l6fr/c4ZhXUQH0uFW7PZbg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-json-strings": "^7.8.3"
-      }
-    },
-    "@babel/plugin-transform-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-literals/-/plugin-transform-literals-7.23.3.tgz",
-      "integrity": "sha512-wZ0PIXRxnwZvl9AYpqNUxpZ5BiTGrYt7kueGQ+N5FiQ7RCOD4cm8iShd6S6ggfVIWaJf2EMk8eRzAh52RfP4rQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-logical-assignment-operators": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.23.4.tgz",
-      "integrity": "sha512-Mc/ALf1rmZTP4JKKEhUwiORU+vcfarFVLfcFiolKUo6sewoxSEgl36ak5t+4WamRsNr6nzjZXQjM35WsU+9vbg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-logical-assignment-operators": "^7.10.4"
-      }
-    },
-    "@babel/plugin-transform-member-expression-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.23.3.tgz",
-      "integrity": "sha512-sC3LdDBDi5x96LA+Ytekz2ZPk8i/Ck+DEuDbRAll5rknJ5XRTSaPKEYwomLcs1AA8wg9b3KjIQRsnApj+q51Ag==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-modules-amd": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.23.3.tgz",
-      "integrity": "sha512-vJYQGxeKM4t8hYCKVBlZX/gtIY2I7mRGFNcm85sgXGMTBcoV3QdVtdpbcWEbzbfUIUZKwvgFT82mRvaQIebZzw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-modules-commonjs": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.23.3.tgz",
-      "integrity": "sha512-aVS0F65LKsdNOtcz6FRCpE4OgsP2OFnW46qNxNIX9h3wuzaNcSQsJysuMwqSibC98HPrf2vCgtxKNwS0DAlgcA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-simple-access": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-modules-systemjs": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.23.3.tgz",
-      "integrity": "sha512-ZxyKGTkF9xT9YJuKQRo19ewf3pXpopuYQd8cDXqNzc3mUNbOME0RKMoZxviQk74hwzfQsEe66dE92MaZbdHKNQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-hoist-variables": "^7.22.5",
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-validator-identifier": "^7.22.20"
-      }
-    },
-    "@babel/plugin-transform-modules-umd": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.23.3.tgz",
-      "integrity": "sha512-zHsy9iXX2nIsCBFPud3jKn1IRPWg3Ing1qOZgeKV39m1ZgIdpJqvlWVeiHBZC6ITRG0MfskhYe9cLgntfSFPIg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-named-capturing-groups-regex": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.22.5.tgz",
-      "integrity": "sha512-YgLLKmS3aUBhHaxp5hi1WJTgOUb/NCuDHzGT9z9WTt3YG+CPRhJs6nprbStx6DnWM4dh6gt7SU3sZodbZ08adQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.5",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-new-target": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.23.3.tgz",
-      "integrity": "sha512-YJ3xKqtJMAT5/TIZnpAR3I+K+WaDowYbN3xyxI8zxx/Gsypwf9B9h0VB+1Nh6ACAAPRS5NSRje0uVv5i79HYGQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-nullish-coalescing-operator": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.23.4.tgz",
-      "integrity": "sha512-jHE9EVVqHKAQx+VePv5LLGHjmHSJR76vawFPTdlxR/LVJPfOEGxREQwQfjuZEOPTwG92X3LINSh3M40Rv4zpVA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.3"
-      }
-    },
-    "@babel/plugin-transform-numeric-separator": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.23.4.tgz",
-      "integrity": "sha512-mps6auzgwjRrwKEZA05cOwuDc9FAzoyFS4ZsG/8F43bTLf/TgkJg7QXOrPO1JO599iA3qgK9MXdMGOEC8O1h6Q==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-numeric-separator": "^7.10.4"
-      }
-    },
-    "@babel/plugin-transform-object-rest-spread": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.23.4.tgz",
-      "integrity": "sha512-9x9K1YyeQVw0iOXJlIzwm8ltobIIv7j2iLyP2jIhEbqPRQ7ScNgwQufU2I0Gq11VjyG4gI4yMXt2VFags+1N3g==",
-      "dev": true,
-      "requires": {
-        "@babel/compat-data": "^7.23.3",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
-        "@babel/plugin-transform-parameters": "^7.23.3"
-      }
-    },
-    "@babel/plugin-transform-object-super": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.23.3.tgz",
-      "integrity": "sha512-BwQ8q0x2JG+3lxCVFohg+KbQM7plfpBwThdW9A6TMtWwLsbDA01Ek2Zb/AgDN39BiZsExm4qrXxjk+P1/fzGrA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20"
-      }
-    },
-    "@babel/plugin-transform-optional-catch-binding": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.23.4.tgz",
-      "integrity": "sha512-XIq8t0rJPHf6Wvmbn9nFxU6ao4c7WhghTR5WyV8SrJfUFzyxhCm4nhC+iAp3HFhbAKLfYpgzhJ6t4XCtVwqO5A==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-optional-catch-binding": "^7.8.3"
-      }
-    },
-    "@babel/plugin-transform-optional-chaining": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.23.4.tgz",
-      "integrity": "sha512-ZU8y5zWOfjM5vZ+asjgAPwDaBjJzgufjES89Rs4Lpq63O300R/kOz30WCLo6BxxX6QVEilwSlpClnG5cZaikTA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
-        "@babel/plugin-syntax-optional-chaining": "^7.8.3"
-      }
-    },
-    "@babel/plugin-transform-parameters": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.23.3.tgz",
-      "integrity": "sha512-09lMt6UsUb3/34BbECKVbVwrT9bO6lILWln237z7sLaWnMsTi7Yc9fhX5DLpkJzAGfaReXI22wP41SZmnAA3Vw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-private-methods": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.23.3.tgz",
-      "integrity": "sha512-UzqRcRtWsDMTLrRWFvUBDwmw06tCQH9Rl1uAjfh6ijMSmGYQ+fpdB+cnqRC8EMh5tuuxSv0/TejGL+7vyj+50g==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-private-property-in-object": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.23.4.tgz",
-      "integrity": "sha512-9G3K1YqTq3F4Vt88Djx1UZ79PDyj+yKRnUy7cZGSMe+a7jkwD259uKKuUzQlPkGam7R+8RJwh5z4xO27fA1o2A==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/plugin-syntax-private-property-in-object": "^7.14.5"
-      }
-    },
-    "@babel/plugin-transform-property-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.23.3.tgz",
-      "integrity": "sha512-jR3Jn3y7cZp4oEWPFAlRsSWjxKe4PZILGBSd4nis1TsC5qeSpb+nrtihJuDhNI7QHiVbUaiXa0X2RZY3/TI6Nw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-regenerator": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.23.3.tgz",
-      "integrity": "sha512-KP+75h0KghBMcVpuKisx3XTu9Ncut8Q8TuvGO4IhY+9D5DFEckQefOuIsB/gQ2tG71lCke4NMrtIPS8pOj18BQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "regenerator-transform": "^0.15.2"
-      }
-    },
-    "@babel/plugin-transform-reserved-words": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.23.3.tgz",
-      "integrity": "sha512-QnNTazY54YqgGxwIexMZva9gqbPa15t/x9VS+0fsEFWplwVpXYZivtgl43Z1vMpc1bdPP2PP8siFeVcnFvA3Cg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-shorthand-properties": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.23.3.tgz",
-      "integrity": "sha512-ED2fgqZLmexWiN+YNFX26fx4gh5qHDhn1O2gvEhreLW2iI63Sqm4llRLCXALKrCnbN4Jy0VcMQZl/SAzqug/jg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-spread": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.23.3.tgz",
-      "integrity": "sha512-VvfVYlrlBVu+77xVTOAoxQ6mZbnIq5FM0aGBSFEcIh03qHf+zNqA4DC/3XMUozTg7bZV3e3mZQ0i13VB6v5yUg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-sticky-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.23.3.tgz",
-      "integrity": "sha512-HZOyN9g+rtvnOU3Yh7kSxXrKbzgrm5X4GncPY1QOquu7epga5MxKHVpYu2hvQnry/H+JjckSYRb93iNfsioAGg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-template-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.23.3.tgz",
-      "integrity": "sha512-Flok06AYNp7GV2oJPZZcP9vZdszev6vPBkHLwxwSpaIqx75wn6mUd3UFWsSsA0l8nXAKkyCmL/sR02m8RYGeHg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-typeof-symbol": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.23.3.tgz",
-      "integrity": "sha512-4t15ViVnaFdrPC74be1gXBSMzXk3B4Us9lP7uLRQHTFpV5Dvt33pn+2MyyNxmN3VTTm3oTrZVMUmuw3oBnQ2oQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-unicode-escapes": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.23.3.tgz",
-      "integrity": "sha512-OMCUx/bU6ChE3r4+ZdylEqAjaQgHAgipgW8nsCfu5pGqDcFytVd91AwRvUJSBZDz0exPGgnjoqhgRYLRjFZc9Q==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-unicode-property-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.23.3.tgz",
-      "integrity": "sha512-KcLIm+pDZkWZQAFJ9pdfmh89EwVfmNovFBcXko8szpBeF8z68kWIPeKlmSOkT9BXJxs2C0uk+5LxoxIv62MROA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-unicode-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.23.3.tgz",
-      "integrity": "sha512-wMHpNA4x2cIA32b/ci3AfwNgheiva2W0WUKWTK7vBHBhDKfPsc5cFGNWm69WBqpwd86u1qwZ9PWevKqm1A3yAw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/plugin-transform-unicode-sets-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.23.3.tgz",
-      "integrity": "sha512-W7lliA/v9bNR83Qc3q1ip9CQMZ09CcHDbHfbLRDNuAhn1Mvkr1ZNF7hPmztMQvtTGVLJ9m8IZqWsTkXOml8dbw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
-      }
-    },
-    "@babel/preset-env": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.23.5.tgz",
-      "integrity": "sha512-0d/uxVD6tFGWXGDSfyMD1p2otoaKmu6+GD+NfAx0tMaH+dxORnp7T9TaVQ6mKyya7iBtCIVxHjWT7MuzzM9z+A==",
-      "dev": true,
-      "requires": {
-        "@babel/compat-data": "^7.23.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-validator-option": "^7.23.5",
-        "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.23.3",
-        "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.23.3",
-        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.23.3",
-        "@babel/plugin-proposal-private-property-in-object": "7.21.0-placeholder-for-preset-env.2",
-        "@babel/plugin-syntax-async-generators": "^7.8.4",
-        "@babel/plugin-syntax-class-properties": "^7.12.13",
-        "@babel/plugin-syntax-class-static-block": "^7.14.5",
-        "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-        "@babel/plugin-syntax-export-namespace-from": "^7.8.3",
-        "@babel/plugin-syntax-import-assertions": "^7.23.3",
-        "@babel/plugin-syntax-import-attributes": "^7.23.3",
-        "@babel/plugin-syntax-import-meta": "^7.10.4",
-        "@babel/plugin-syntax-json-strings": "^7.8.3",
-        "@babel/plugin-syntax-logical-assignment-operators": "^7.10.4",
-        "@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.3",
-        "@babel/plugin-syntax-numeric-separator": "^7.10.4",
-        "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
-        "@babel/plugin-syntax-optional-catch-binding": "^7.8.3",
-        "@babel/plugin-syntax-optional-chaining": "^7.8.3",
-        "@babel/plugin-syntax-private-property-in-object": "^7.14.5",
-        "@babel/plugin-syntax-top-level-await": "^7.14.5",
-        "@babel/plugin-syntax-unicode-sets-regex": "^7.18.6",
-        "@babel/plugin-transform-arrow-functions": "^7.23.3",
-        "@babel/plugin-transform-async-generator-functions": "^7.23.4",
-        "@babel/plugin-transform-async-to-generator": "^7.23.3",
-        "@babel/plugin-transform-block-scoped-functions": "^7.23.3",
-        "@babel/plugin-transform-block-scoping": "^7.23.4",
-        "@babel/plugin-transform-class-properties": "^7.23.3",
-        "@babel/plugin-transform-class-static-block": "^7.23.4",
-        "@babel/plugin-transform-classes": "^7.23.5",
-        "@babel/plugin-transform-computed-properties": "^7.23.3",
-        "@babel/plugin-transform-destructuring": "^7.23.3",
-        "@babel/plugin-transform-dotall-regex": "^7.23.3",
-        "@babel/plugin-transform-duplicate-keys": "^7.23.3",
-        "@babel/plugin-transform-dynamic-import": "^7.23.4",
-        "@babel/plugin-transform-exponentiation-operator": "^7.23.3",
-        "@babel/plugin-transform-export-namespace-from": "^7.23.4",
-        "@babel/plugin-transform-for-of": "^7.23.3",
-        "@babel/plugin-transform-function-name": "^7.23.3",
-        "@babel/plugin-transform-json-strings": "^7.23.4",
-        "@babel/plugin-transform-literals": "^7.23.3",
-        "@babel/plugin-transform-logical-assignment-operators": "^7.23.4",
-        "@babel/plugin-transform-member-expression-literals": "^7.23.3",
-        "@babel/plugin-transform-modules-amd": "^7.23.3",
-        "@babel/plugin-transform-modules-commonjs": "^7.23.3",
-        "@babel/plugin-transform-modules-systemjs": "^7.23.3",
-        "@babel/plugin-transform-modules-umd": "^7.23.3",
-        "@babel/plugin-transform-named-capturing-groups-regex": "^7.22.5",
-        "@babel/plugin-transform-new-target": "^7.23.3",
-        "@babel/plugin-transform-nullish-coalescing-operator": "^7.23.4",
-        "@babel/plugin-transform-numeric-separator": "^7.23.4",
-        "@babel/plugin-transform-object-rest-spread": "^7.23.4",
-        "@babel/plugin-transform-object-super": "^7.23.3",
-        "@babel/plugin-transform-optional-catch-binding": "^7.23.4",
-        "@babel/plugin-transform-optional-chaining": "^7.23.4",
-        "@babel/plugin-transform-parameters": "^7.23.3",
-        "@babel/plugin-transform-private-methods": "^7.23.3",
-        "@babel/plugin-transform-private-property-in-object": "^7.23.4",
-        "@babel/plugin-transform-property-literals": "^7.23.3",
-        "@babel/plugin-transform-regenerator": "^7.23.3",
-        "@babel/plugin-transform-reserved-words": "^7.23.3",
-        "@babel/plugin-transform-shorthand-properties": "^7.23.3",
-        "@babel/plugin-transform-spread": "^7.23.3",
-        "@babel/plugin-transform-sticky-regex": "^7.23.3",
-        "@babel/plugin-transform-template-literals": "^7.23.3",
-        "@babel/plugin-transform-typeof-symbol": "^7.23.3",
-        "@babel/plugin-transform-unicode-escapes": "^7.23.3",
-        "@babel/plugin-transform-unicode-property-regex": "^7.23.3",
-        "@babel/plugin-transform-unicode-regex": "^7.23.3",
-        "@babel/plugin-transform-unicode-sets-regex": "^7.23.3",
-        "@babel/preset-modules": "0.1.6-no-external-plugins",
-        "babel-plugin-polyfill-corejs2": "^0.4.6",
-        "babel-plugin-polyfill-corejs3": "^0.8.5",
-        "babel-plugin-polyfill-regenerator": "^0.5.3",
-        "core-js-compat": "^3.31.0",
-        "semver": "^6.3.1"
-      }
-    },
-    "@babel/preset-modules": {
-      "version": "0.1.6-no-external-plugins",
-      "resolved": "https://registry.npmjs.org/@babel/preset-modules/-/preset-modules-0.1.6-no-external-plugins.tgz",
-      "integrity": "sha512-HrcgcIESLm9aIR842yhJ5RWan/gebQUJ6E/E5+rf0y9o6oj7w0Br+sWuL6kEQ/o/AdfvR1Je9jG18/gnpwjEyA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.0.0",
-        "@babel/types": "^7.4.4",
-        "esutils": "^2.0.2"
-      }
-    },
-    "@babel/regjsgen": {
-      "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/@babel/regjsgen/-/regjsgen-0.8.0.tgz",
-      "integrity": "sha512-x/rqGMdzj+fWZvCOYForTghzbtqPDZ5gPwaoNGHdgDfF2QA/XZbCBp4Moo5scrkAMPhB7z26XM/AaHuIJdgauA==",
-      "dev": true
-    },
-    "@babel/runtime": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.5.tgz",
-      "integrity": "sha512-NdUTHcPe4C99WxPub+K9l9tK5/lV4UXIoaHSYgzco9BCyjKAAwzdBI+wWtYqHt7LJdbo74ZjRPJgzVweq1sz0w==",
-      "dev": true,
-      "requires": {
-        "regenerator-runtime": "^0.14.0"
-      }
-    },
-    "@babel/template": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz",
-      "integrity": "sha512-QPErUVm4uyJa60rkI73qneDacvdvzxshT3kksGqlGWYdOTIUOwJ7RDUL8sGqslY1uXWSL6xMFKEXDS3ox2uF0w==",
-      "dev": true,
-      "requires": {
-        "@babel/code-frame": "^7.22.13",
-        "@babel/parser": "^7.22.15",
-        "@babel/types": "^7.22.15"
-      }
-    },
-    "@babel/traverse": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.5.tgz",
-      "integrity": "sha512-czx7Xy5a6sapWWRx61m1Ke1Ra4vczu1mCTtJam5zRTBOonfdJ+S/B6HYmGYu3fJtr8GGET3si6IhgWVBhJ/m8w==",
-      "dev": true,
-      "peer": true,
-      "requires": {
-        "@babel/code-frame": "^7.23.5",
-        "@babel/generator": "^7.23.5",
-        "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-hoist-variables": "^7.22.5",
-        "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/parser": "^7.23.5",
-        "@babel/types": "^7.23.5",
-        "debug": "^4.1.0",
-        "globals": "^11.1.0"
-      }
-    },
-    "@babel/types": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.23.5.tgz",
-      "integrity": "sha512-ON5kSOJwVO6xXVRTvOI0eOnWe7VdUcIpsovGo9U/Br4Ie4UVFQTboO2cYnDhAGU6Fp+UxSiT+pMft0SMHfuq6w==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-string-parser": "^7.23.4",
-        "@babel/helper-validator-identifier": "^7.22.20",
-        "to-fast-properties": "^2.0.0"
-      }
-    },
-    "@bcoe/v8-coverage": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz",
-      "integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==",
-      "dev": true
-    },
-    "@colors/colors": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz",
-      "integrity": "sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==",
-      "dev": true,
-      "optional": true
-    },
-    "@commitlint/config-validator": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/config-validator/-/config-validator-18.4.3.tgz",
-      "integrity": "sha512-FPZZmTJBARPCyef9ohRC9EANiQEKSWIdatx5OlgeHKu878dWwpyeFauVkhzuBRJFcCA4Uvz/FDtlDKs008IHcA==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "@commitlint/types": "^18.4.3",
-        "ajv": "^8.11.0"
-      }
-    },
-    "@commitlint/execute-rule": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/execute-rule/-/execute-rule-18.4.3.tgz",
-      "integrity": "sha512-t7FM4c+BdX9WWZCPrrbV5+0SWLgT3kCq7e7/GhHCreYifg3V8qyvO127HF796vyFql75n4TFF+5v1asOOWkV1Q==",
-      "dev": true,
-      "optional": true
-    },
-    "@commitlint/load": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/load/-/load-18.4.3.tgz",
-      "integrity": "sha512-v6j2WhvRQJrcJaj5D+EyES2WKTxPpxENmNpNG3Ww8MZGik3jWRXtph0QTzia5ZJyPh2ib5aC/6BIDymkUUM58Q==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "@commitlint/config-validator": "^18.4.3",
-        "@commitlint/execute-rule": "^18.4.3",
-        "@commitlint/resolve-extends": "^18.4.3",
-        "@commitlint/types": "^18.4.3",
-        "@types/node": "^18.11.9",
-        "chalk": "^4.1.0",
-        "cosmiconfig": "^8.3.6",
-        "cosmiconfig-typescript-loader": "^5.0.0",
-        "lodash.isplainobject": "^4.0.6",
-        "lodash.merge": "^4.6.2",
-        "lodash.uniq": "^4.5.0",
-        "resolve-from": "^5.0.0"
-      },
-      "dependencies": {
-        "@types/node": {
-          "version": "18.19.1",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.1.tgz",
-          "integrity": "sha512-mZJ9V11gG5Vp0Ox2oERpeFDl+JvCwK24PGy76vVY/UgBtjwJWc5rYBThFxmbnYOm9UPZNm6wEl/sxHt2SU7x9A==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "undici-types": "~5.26.4"
-          }
-        }
-      }
-    },
-    "@commitlint/resolve-extends": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/resolve-extends/-/resolve-extends-18.4.3.tgz",
-      "integrity": "sha512-30sk04LZWf8+SDgJrbJCjM90gTg2LxsD9cykCFeFu+JFHvBFq5ugzp2eO/DJGylAdVaqxej3c7eTSE64hR/lnw==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "@commitlint/config-validator": "^18.4.3",
-        "@commitlint/types": "^18.4.3",
-        "import-fresh": "^3.0.0",
-        "lodash.mergewith": "^4.6.2",
-        "resolve-from": "^5.0.0",
-        "resolve-global": "^1.0.0"
-      }
-    },
-    "@commitlint/types": {
-      "version": "18.4.3",
-      "resolved": "https://registry.npmjs.org/@commitlint/types/-/types-18.4.3.tgz",
-      "integrity": "sha512-cvzx+vtY/I2hVBZHCLrpoh+sA0hfuzHwDc+BAFPimYLjJkpHnghQM+z8W/KyLGkygJh3BtI3xXXq+dKjnSWEmA==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "chalk": "^4.1.0"
-      }
-    },
-    "@cspotcode/source-map-support": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz",
-      "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==",
-      "dev": true,
-      "requires": {
-        "@jridgewell/trace-mapping": "0.3.9"
-      },
-      "dependencies": {
-        "@jridgewell/trace-mapping": {
-          "version": "0.3.9",
-          "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz",
-          "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==",
-          "dev": true,
-          "requires": {
-            "@jridgewell/resolve-uri": "^3.0.3",
-            "@jridgewell/sourcemap-codec": "^1.4.10"
-          }
-        }
-      }
-    },
-    "@csstools/css-parser-algorithms": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.5.0.tgz",
-      "integrity": "sha512-abypo6m9re3clXA00eu5syw+oaPHbJTPapu9C4pzNsJ4hdZDzushT50Zhu+iIYXgEe1CxnRMn7ngsbV+MLrlpQ==",
-      "dev": true,
-      "requires": {}
-    },
-    "@csstools/css-tokenizer": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.3.tgz",
-      "integrity": "sha512-pp//EvZ9dUmGuGtG1p+n17gTHEOqu9jO+FiCUjNN3BDmyhdA2Jq9QsVeR7K8/2QCK17HSsioPlTW9ZkzoWb3Lg==",
-      "dev": true
-    },
-    "@csstools/media-query-list-parser": {
-      "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.7.tgz",
-      "integrity": "sha512-lHPKJDkPUECsyAvD60joYfDmp8UERYxHGkFfyLJFTVK/ERJe0sVlIFLXU5XFxdjNDTerp5L4KeaKG+Z5S94qxQ==",
-      "dev": true,
-      "requires": {}
-    },
-    "@csstools/selector-specificity": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-3.0.1.tgz",
-      "integrity": "sha512-NPljRHkq4a14YzZ3YD406uaxh7s0g6eAq3L9aLOWywoqe8PkYamAvtsh7KNX6c++ihDrJ0RiU+/z7rGnhlZ5ww==",
-      "dev": true,
-      "requires": {}
-    },
-    "@emotion/is-prop-valid": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.1.tgz",
-      "integrity": "sha512-61Mf7Ufx4aDxx1xlDeOm8aFFigGHE4z+0sKCa+IHCeZKiyP9RLD0Mmx7m8b9/Cf37f7NAvQOOJAbQQGVr5uERw==",
-      "dev": true,
-      "requires": {
-        "@emotion/memoize": "^0.8.1"
-      }
-    },
-    "@emotion/memoize": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz",
-      "integrity": "sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==",
-      "dev": true
-    },
-    "@esbuild/aix-ppc64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.19.11.tgz",
-      "integrity": "sha512-FnzU0LyE3ySQk7UntJO4+qIiQgI7KoODnZg5xzXIrFJlKd2P2gwHsHY4927xj9y5PJmJSzULiUCWmv7iWnNa7g==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/android-arm": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.19.11.tgz",
-      "integrity": "sha512-5OVapq0ClabvKvQ58Bws8+wkLCV+Rxg7tUVbo9xu034Nm536QTII4YzhaFriQ7rMrorfnFKUsArD2lqKbFY4vw==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/android-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.19.11.tgz",
-      "integrity": "sha512-aiu7K/5JnLj//KOnOfEZ0D90obUkRzDMyqd/wNAUQ34m4YUPVhRZpnqKV9uqDGxT7cToSDnIHsGooyIczu9T+Q==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/android-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.19.11.tgz",
-      "integrity": "sha512-eccxjlfGw43WYoY9QgB82SgGgDbibcqyDTlk3l3C0jOVHKxrjdc9CTwDUQd0vkvYg5um0OH+GpxYvp39r+IPOg==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/darwin-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.19.11.tgz",
-      "integrity": "sha512-ETp87DRWuSt9KdDVkqSoKoLFHYTrkyz2+65fj9nfXsaV3bMhTCjtQfw3y+um88vGRKRiF7erPrh/ZuIdLUIVxQ==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/darwin-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.19.11.tgz",
-      "integrity": "sha512-fkFUiS6IUK9WYUO/+22omwetaSNl5/A8giXvQlcinLIjVkxwTLSktbF5f/kJMftM2MJp9+fXqZ5ezS7+SALp4g==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/freebsd-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.19.11.tgz",
-      "integrity": "sha512-lhoSp5K6bxKRNdXUtHoNc5HhbXVCS8V0iZmDvyWvYq9S5WSfTIHU2UGjcGt7UeS6iEYp9eeymIl5mJBn0yiuxA==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/freebsd-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.19.11.tgz",
-      "integrity": "sha512-JkUqn44AffGXitVI6/AbQdoYAq0TEullFdqcMY/PCUZ36xJ9ZJRtQabzMA+Vi7r78+25ZIBosLTOKnUXBSi1Kw==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/linux-arm": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.19.11.tgz",
-      "integrity": "sha512-3CRkr9+vCV2XJbjwgzjPtO8T0SZUmRZla+UL1jw+XqHZPkPgZiyWvbDvl9rqAN8Zl7qJF0O/9ycMtjU67HN9/Q==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/linux-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.19.11.tgz",
-      "integrity": "sha512-LneLg3ypEeveBSMuoa0kwMpCGmpu8XQUh+mL8XXwoYZ6Be2qBnVtcDI5azSvh7vioMDhoJFZzp9GWp9IWpYoUg==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/linux-ia32": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.19.11.tgz",
-      "integrity": "sha512-caHy++CsD8Bgq2V5CodbJjFPEiDPq8JJmBdeyZ8GWVQMjRD0sU548nNdwPNvKjVpamYYVL40AORekgfIubwHoA==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/linux-loong64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.19.11.tgz",
-      "integrity": "sha512-ppZSSLVpPrwHccvC6nQVZaSHlFsvCQyjnvirnVjbKSHuE5N24Yl8F3UwYUUR1UEPaFObGD2tSvVKbvR+uT1Nrg==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/linux-mips64el": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.19.11.tgz",
-      "integrity": "sha512-B5x9j0OgjG+v1dF2DkH34lr+7Gmv0kzX6/V0afF41FkPMMqaQ77pH7CrhWeR22aEeHKaeZVtZ6yFwlxOKPVFyg==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/linux-ppc64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.19.11.tgz",
-      "integrity": "sha512-MHrZYLeCG8vXblMetWyttkdVRjQlQUb/oMgBNurVEnhj4YWOr4G5lmBfZjHYQHHN0g6yDmCAQRR8MUHldvvRDA==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/linux-riscv64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.19.11.tgz",
-      "integrity": "sha512-f3DY++t94uVg141dozDu4CCUkYW+09rWtaWfnb3bqe4w5NqmZd6nPVBm+qbz7WaHZCoqXqHz5p6CM6qv3qnSSQ==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/linux-s390x": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.19.11.tgz",
-      "integrity": "sha512-A5xdUoyWJHMMlcSMcPGVLzYzpcY8QP1RtYzX5/bS4dvjBGVxdhuiYyFwp7z74ocV7WDc0n1harxmpq2ePOjI0Q==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/linux-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.19.11.tgz",
-      "integrity": "sha512-grbyMlVCvJSfxFQUndw5mCtWs5LO1gUlwP4CDi4iJBbVpZcqLVT29FxgGuBJGSzyOxotFG4LoO5X+M1350zmPA==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/netbsd-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.19.11.tgz",
-      "integrity": "sha512-13jvrQZJc3P230OhU8xgwUnDeuC/9egsjTkXN49b3GcS5BKvJqZn86aGM8W9pd14Kd+u7HuFBMVtrNGhh6fHEQ==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/openbsd-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.19.11.tgz",
-      "integrity": "sha512-ysyOGZuTp6SNKPE11INDUeFVVQFrhcNDVUgSQVDzqsqX38DjhPEPATpid04LCoUr2WXhQTEZ8ct/EgJCUDpyNw==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/sunos-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.19.11.tgz",
-      "integrity": "sha512-Hf+Sad9nVwvtxy4DXCZQqLpgmRTQqyFyhT3bZ4F2XlJCjxGmRFF0Shwn9rzhOYRB61w9VMXUkxlBy56dk9JJiQ==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/win32-arm64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.19.11.tgz",
-      "integrity": "sha512-0P58Sbi0LctOMOQbpEOvOL44Ne0sqbS0XWHMvvrg6NE5jQ1xguCSSw9jQeUk2lfrXYsKDdOe6K+oZiwKPilYPQ==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/win32-ia32": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.19.11.tgz",
-      "integrity": "sha512-6YOrWS+sDJDmshdBIQU+Uoyh7pQKrdykdefC1avn76ss5c+RN6gut3LZA4E2cH5xUEp5/cA0+YxRaVtRAb0xBg==",
-      "dev": true,
-      "optional": true
-    },
-    "@esbuild/win32-x64": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.19.11.tgz",
-      "integrity": "sha512-vfkhltrjCAb603XaFhqhAF4LGDi2M4OrCRrFusyQ+iTLQ/o60QQXxc9cZC/FFpihBI9N1Grn6SMKVJ4KP7Fuiw==",
-      "dev": true,
-      "optional": true
-    },
-    "@eslint-community/eslint-utils": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
-      "integrity": "sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==",
-      "dev": true,
-      "requires": {
-        "eslint-visitor-keys": "^3.3.0"
-      }
-    },
-    "@eslint-community/regexpp": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.10.0.tgz",
-      "integrity": "sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==",
-      "dev": true
-    },
-    "@eslint/eslintrc": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.4.tgz",
-      "integrity": "sha512-269Z39MS6wVJtsoUl10L60WdkhJVdPG24Q4eZTH3nnF6lpvSShEK3wQjDX9JRWAUPvPh7COouPpU9IrqaZFvtQ==",
-      "dev": true,
-      "requires": {
-        "ajv": "^6.12.4",
-        "debug": "^4.3.2",
-        "espree": "^9.6.0",
-        "globals": "^13.19.0",
-        "ignore": "^5.2.0",
-        "import-fresh": "^3.2.1",
-        "js-yaml": "^4.1.0",
-        "minimatch": "^3.1.2",
-        "strip-json-comments": "^3.1.1"
-      },
-      "dependencies": {
-        "ajv": {
-          "version": "6.12.6",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
-          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
-          "dev": true,
-          "requires": {
-            "fast-deep-equal": "^3.1.1",
-            "fast-json-stable-stringify": "^2.0.0",
-            "json-schema-traverse": "^0.4.1",
-            "uri-js": "^4.2.2"
-          }
-        },
-        "globals": {
-          "version": "13.23.0",
-          "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-          "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
-          "dev": true,
-          "requires": {
-            "type-fest": "^0.20.2"
-          }
-        },
-        "json-schema-traverse": {
-          "version": "0.4.1",
-          "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
-          "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
-          "dev": true
-        },
-        "type-fest": {
-          "version": "0.20.2",
-          "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
-          "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
-          "dev": true
-        }
-      }
-    },
-    "@eslint/js": {
-      "version": "8.55.0",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.55.0.tgz",
-      "integrity": "sha512-qQfo2mxH5yVom1kacMtZZJFVdW+E70mqHMJvVg6WTLo+VBuQJ4TojZlfWBjK0ve5BdEeNAVxOsl/nvNMpJOaJA==",
-      "dev": true
-    },
-    "@humanwhocodes/config-array": {
-      "version": "0.11.13",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.13.tgz",
-      "integrity": "sha512-JSBDMiDKSzQVngfRjOdFXgFfklaXI4K9nLF49Auh21lmBWRLIK3+xTErTWD4KU54pb6coM6ESE7Awz/FNU3zgQ==",
-      "dev": true,
-      "requires": {
-        "@humanwhocodes/object-schema": "^2.0.1",
-        "debug": "^4.1.1",
-        "minimatch": "^3.0.5"
-      }
-    },
-    "@humanwhocodes/module-importer": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz",
-      "integrity": "sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==",
-      "dev": true
-    },
-    "@humanwhocodes/object-schema": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-2.0.1.tgz",
-      "integrity": "sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==",
-      "dev": true
-    },
-    "@isaacs/cliui": {
-      "version": "8.0.2",
-      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
-      "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
-      "dev": true,
-      "requires": {
-        "string-width": "^5.1.2",
-        "string-width-cjs": "npm:string-width@^4.2.0",
-        "strip-ansi": "^7.0.1",
-        "strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
-        "wrap-ansi": "^8.1.0",
-        "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
-      },
-      "dependencies": {
-        "ansi-regex": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz",
-          "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==",
-          "dev": true
-        },
-        "ansi-styles": {
-          "version": "6.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
-          "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
-          "dev": true
-        },
-        "emoji-regex": {
-          "version": "9.2.2",
-          "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
-          "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
-          "dev": true
-        },
-        "string-width": {
-          "version": "5.1.2",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
-          "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
-          "dev": true,
-          "requires": {
-            "eastasianwidth": "^0.2.0",
-            "emoji-regex": "^9.2.2",
-            "strip-ansi": "^7.0.1"
-          }
-        },
-        "strip-ansi": {
-          "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
-          "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
-          "dev": true,
-          "requires": {
-            "ansi-regex": "^6.0.1"
-          }
-        },
-        "wrap-ansi": {
-          "version": "8.1.0",
-          "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
-          "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^6.1.0",
-            "string-width": "^5.0.1",
-            "strip-ansi": "^7.0.1"
-          }
-        }
-      }
-    },
-    "@istanbuljs/schema": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/@istanbuljs/schema/-/schema-0.1.3.tgz",
-      "integrity": "sha512-ZXRY4jNvVgSVQ8DL3LTcakaAtXwTVUxE81hslsyD2AtoXW/wVob10HkOJ1X/pAlcI7D+2YoZKg5do8G/w6RYgA==",
-      "dev": true
-    },
-    "@jest/schemas": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/@jest/schemas/-/schemas-29.6.3.tgz",
-      "integrity": "sha512-mo5j5X+jIZmJQveBKeS/clAueipV7KgiX1vMgCxam1RNYiqE1w62n0/tJJnHtjW8ZHcQco5gY85jA3mi0L+nSA==",
-      "dev": true,
-      "requires": {
-        "@sinclair/typebox": "^0.27.8"
-      }
-    },
-    "@jridgewell/gen-mapping": {
-      "version": "0.3.3",
-      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
-      "integrity": "sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==",
-      "dev": true,
-      "peer": true,
-      "requires": {
-        "@jridgewell/set-array": "^1.0.1",
-        "@jridgewell/sourcemap-codec": "^1.4.10",
-        "@jridgewell/trace-mapping": "^0.3.9"
-      }
-    },
-    "@jridgewell/resolve-uri": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.1.tgz",
-      "integrity": "sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==",
-      "dev": true
-    },
-    "@jridgewell/set-array": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz",
-      "integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==",
-      "dev": true,
-      "peer": true
-    },
-    "@jridgewell/sourcemap-codec": {
-      "version": "1.4.15",
-      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
-      "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
-    },
-    "@jridgewell/trace-mapping": {
-      "version": "0.3.20",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.20.tgz",
-      "integrity": "sha512-R8LcPeWZol2zR8mmH3JeKQ6QRCFb7XgUhV9ZlGhHLGyg4wpPiPZNQOOWhFZhxKw8u//yTbNGI42Bx/3paXEQ+Q==",
-      "dev": true,
-      "requires": {
-        "@jridgewell/resolve-uri": "^3.1.0",
-        "@jridgewell/sourcemap-codec": "^1.4.14"
-      }
-    },
-    "@microsoft/api-extractor": {
-      "version": "7.38.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-7.38.3.tgz",
-      "integrity": "sha512-xt9iYyC5f39281j77JTA9C3ISJpW1XWkCcnw+2vM78CPnro6KhPfwQdPDfwS5JCPNuq0grm8cMdPUOPvrchDWw==",
-      "dev": true,
-      "requires": {
-        "@microsoft/api-extractor-model": "7.28.2",
-        "@microsoft/tsdoc": "0.14.2",
-        "@microsoft/tsdoc-config": "~0.16.1",
-        "@rushstack/node-core-library": "3.61.0",
-        "@rushstack/rig-package": "0.5.1",
-        "@rushstack/ts-command-line": "4.17.1",
-        "colors": "~1.2.1",
-        "lodash": "~4.17.15",
-        "resolve": "~1.22.1",
-        "semver": "~7.5.4",
-        "source-map": "~0.6.1",
-        "typescript": "~5.0.4"
-      },
-      "dependencies": {
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "typescript": {
-          "version": "5.0.4",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz",
-          "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==",
-          "dev": true
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "@microsoft/api-extractor-model": {
-      "version": "7.28.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor-model/-/api-extractor-model-7.28.2.tgz",
-      "integrity": "sha512-vkojrM2fo3q4n4oPh4uUZdjJ2DxQ2+RnDQL/xhTWSRUNPF6P4QyrvY357HBxbnltKcYu+nNNolVqc6TIGQ73Ig==",
-      "dev": true,
-      "requires": {
-        "@microsoft/tsdoc": "0.14.2",
-        "@microsoft/tsdoc-config": "~0.16.1",
-        "@rushstack/node-core-library": "3.61.0"
-      }
-    },
-    "@microsoft/tsdoc": {
-      "version": "0.14.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/tsdoc/-/tsdoc-0.14.2.tgz",
-      "integrity": "sha512-9b8mPpKrfeGRuhFH5iO1iwCLeIIsV6+H1sRfxbkoGXIyQE2BTsPd9zqSqQJ+pv5sJ/hT5M1zvOFL02MnEezFug==",
-      "dev": true
-    },
-    "@microsoft/tsdoc-config": {
-      "version": "0.16.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/tsdoc-config/-/tsdoc-config-0.16.2.tgz",
-      "integrity": "sha512-OGiIzzoBLgWWR0UdRJX98oYO+XKGf7tiK4Zk6tQ/E4IJqGCe7dvkTvgDZV5cFJUzLGDOjeAXrnZoA6QkVySuxw==",
-      "dev": true,
-      "requires": {
-        "@microsoft/tsdoc": "0.14.2",
-        "ajv": "~6.12.6",
-        "jju": "~1.4.0",
-        "resolve": "~1.19.0"
-      },
-      "dependencies": {
-        "ajv": {
-          "version": "6.12.6",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
-          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
-          "dev": true,
-          "requires": {
-            "fast-deep-equal": "^3.1.1",
-            "fast-json-stable-stringify": "^2.0.0",
-            "json-schema-traverse": "^0.4.1",
-            "uri-js": "^4.2.2"
-          }
-        },
-        "json-schema-traverse": {
-          "version": "0.4.1",
-          "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
-          "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
-          "dev": true
-        },
-        "resolve": {
-          "version": "1.19.0",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.19.0.tgz",
-          "integrity": "sha512-rArEXAgsBG4UgRGcynxWIWKFvh/XZCcS8UJdHhwy91zwAvCZIbcs+vAbflgBnNjYMs/i/i+/Ux6IZhML1yPvxg==",
-          "dev": true,
-          "requires": {
-            "is-core-module": "^2.1.0",
-            "path-parse": "^1.0.6"
-          }
-        }
-      }
-    },
-    "@nightwatch/chai": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/@nightwatch/chai/-/chai-5.0.2.tgz",
-      "integrity": "sha512-yzILJFCcE75OPoRfBlJ80Y3Ky06ljsdrK4Ld92yhmM477vxO2GEguwnd+ldl7pdSYTcg1gSJ1bPPQrA+/Hrn+A==",
-      "dev": true,
-      "requires": {
-        "assertion-error": "1.1.0",
-        "check-error": "1.0.2",
-        "deep-eql": "4.0.1",
-        "loupe": "2.3.4",
-        "pathval": "1.1.1",
-        "type-detect": "4.0.8"
-      }
-    },
-    "@nightwatch/html-reporter-template": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/@nightwatch/html-reporter-template/-/html-reporter-template-0.2.1.tgz",
-      "integrity": "sha512-GEBeGoXVmTYPtNC4Yq34vfgxf6mlFyEagxpsfH18Qe5BvctF2rprX+wI5dKBm9p5IqHo6ZOcXHCufOeP3cjuOw==",
-      "dev": true
-    },
-    "@nightwatch/nightwatch-inspector": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@nightwatch/nightwatch-inspector/-/nightwatch-inspector-1.0.1.tgz",
-      "integrity": "sha512-/ax11EOB4eJXT5VioMztcalbCtsNeuFn6icfT75qPLBmkxLvThePSfyGTys+t9AULUR0ug0wMDMiLV1Oy586Fg==",
-      "dev": true,
-      "requires": {
-        "archiver": "^5.3.1"
-      }
-    },
-    "@nodelib/fs.scandir": {
-      "version": "2.1.5",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
-      "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
-      "dev": true,
-      "requires": {
-        "@nodelib/fs.stat": "2.0.5",
-        "run-parallel": "^1.1.9"
-      }
-    },
-    "@nodelib/fs.stat": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
-      "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
-      "dev": true
-    },
-    "@nodelib/fs.walk": {
-      "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
-      "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
-      "dev": true,
-      "requires": {
-        "@nodelib/fs.scandir": "2.1.5",
-        "fastq": "^1.6.0"
-      }
-    },
-    "@one-ini/wasm": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/@one-ini/wasm/-/wasm-0.1.1.tgz",
-      "integrity": "sha512-XuySG1E38YScSJoMlqovLru4KTUNSjgVTIjyh7qMX6aNN5HY5Ct5LhRJdxO79JtTzKfzV/bnWpz+zquYrISsvw==",
-      "dev": true
-    },
-    "@pkgjs/parseargs": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
-      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
-      "dev": true,
-      "optional": true
-    },
-    "@puppeteer/browsers": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/@puppeteer/browsers/-/browsers-2.2.3.tgz",
-      "integrity": "sha512-bJ0UBsk0ESOs6RFcLXOt99a3yTDcOKlzfjad+rhFwdaG1Lu/Wzq58GHYCDTlZ9z6mldf4g+NTb+TXEfe0PpnsQ==",
-      "dev": true,
-      "requires": {
-        "debug": "4.3.4",
-        "extract-zip": "2.0.1",
-        "progress": "2.0.3",
-        "proxy-agent": "6.4.0",
-        "semver": "7.6.0",
-        "tar-fs": "3.0.5",
-        "unbzip2-stream": "1.4.3",
-        "yargs": "17.7.2"
-      },
-      "dependencies": {
-        "cliui": {
-          "version": "8.0.1",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
-          "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
-          "dev": true,
-          "requires": {
-            "string-width": "^4.2.0",
-            "strip-ansi": "^6.0.1",
-            "wrap-ansi": "^7.0.0"
-          }
-        },
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.6.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
-          "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "wrap-ansi": {
-          "version": "7.0.0",
-          "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
-          "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^4.0.0",
-            "string-width": "^4.1.0",
-            "strip-ansi": "^6.0.0"
-          }
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        },
-        "yargs": {
-          "version": "17.7.2",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
-          "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
-          "dev": true,
-          "requires": {
-            "cliui": "^8.0.1",
-            "escalade": "^3.1.1",
-            "get-caller-file": "^2.0.5",
-            "require-directory": "^2.1.1",
-            "string-width": "^4.2.3",
-            "y18n": "^5.0.5",
-            "yargs-parser": "^21.1.1"
-          }
-        },
-        "yargs-parser": {
-          "version": "21.1.1",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
-          "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
-          "dev": true
-        }
-      }
-    },
-    "@rei/cdr-tokens": {
-      "version": "12.2.0",
-      "resolved": "https://registry.npmjs.org/@rei/cdr-tokens/-/cdr-tokens-12.2.0.tgz",
-      "integrity": "sha512-FV8y2pJ/+stfjOAMVg91tOeDd1tP3xM9yn6TDvReVKE8DNGAnKYsLVYe6A+AVrlD9kf7syfoU18o4uG60zRimA==",
-      "dev": true
-    },
-    "@rei/cedar-icons": {
-      "version": "2.6.1",
-      "resolved": "https://registry.npmjs.org/@rei/cedar-icons/-/cedar-icons-2.6.1.tgz",
-      "integrity": "sha512-rkV5kQra0nYmd82zIFDqWGIU6VNE6y+DyP6i3oeJUo0OFjsdFKqtt3e/PSGjCKmmIOEBop62FBDc5DzSU0+VKA==",
-      "dev": true
-    },
-    "@rollup/plugin-babel": {
-      "version": "6.0.4",
-      "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-6.0.4.tgz",
-      "integrity": "sha512-YF7Y52kFdFT/xVSuVdjkV5ZdX/3YtmX0QulG+x0taQOtJdHYzVU61aSSkAgVJ7NOv6qPkIYiJSgSWWN/DM5sGw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-module-imports": "^7.18.6",
-        "@rollup/pluginutils": "^5.0.1"
-      }
-    },
-    "@rollup/pluginutils": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.1.0.tgz",
-      "integrity": "sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==",
-      "dev": true,
-      "requires": {
-        "@types/estree": "^1.0.0",
-        "estree-walker": "^2.0.2",
-        "picomatch": "^2.3.1"
-      }
-    },
-    "@rollup/rollup-android-arm-eabi": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.2.tgz",
-      "integrity": "sha512-RKzxFxBHq9ysZ83fn8Iduv3A283K7zPPYuhL/z9CQuyFrjwpErJx0h4aeb/bnJ+q29GRLgJpY66ceQ/Wcsn3wA==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-android-arm64": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.9.2.tgz",
-      "integrity": "sha512-yZ+MUbnwf3SHNWQKJyWh88ii2HbuHCFQnAYTeeO1Nb8SyEiWASEi5dQUygt3ClHWtA9My9RQAYkjvrsZ0WK8Xg==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-darwin-arm64": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.9.2.tgz",
-      "integrity": "sha512-vqJ/pAUh95FLc/G/3+xPqlSBgilPnauVf2EXOQCZzhZJCXDXt/5A8mH/OzU6iWhb3CNk5hPJrh8pqJUPldN5zw==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-darwin-x64": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.9.2.tgz",
-      "integrity": "sha512-otPHsN5LlvedOprd3SdfrRNhOahhVBwJpepVKUN58L0RnC29vOAej1vMEaVU6DadnpjivVsNTM5eNt0CcwTahw==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.9.2.tgz",
-      "integrity": "sha512-ewG5yJSp+zYKBYQLbd1CUA7b1lSfIdo9zJShNTyc2ZP1rcPrqyZcNlsHgs7v1zhgfdS+kW0p5frc0aVqhZCiYQ==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.9.2.tgz",
-      "integrity": "sha512-pL6QtV26W52aCWTG1IuFV3FMPL1m4wbsRG+qijIvgFO/VBsiXJjDPE/uiMdHBAO6YcpV4KvpKtd0v3WFbaxBtg==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-linux-arm64-musl": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.9.2.tgz",
-      "integrity": "sha512-On+cc5EpOaTwPSNetHXBuqylDW+765G/oqB9xGmWU3npEhCh8xu0xqHGUA+4xwZLqBbIZNcBlKSIYfkBm6ko7g==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.9.2.tgz",
-      "integrity": "sha512-Wnx/IVMSZ31D/cO9HSsU46FjrPWHqtdF8+0eyZ1zIB5a6hXaZXghUKpRrC4D5DcRTZOjml2oBhXoqfGYyXKipw==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-linux-x64-gnu": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.9.2.tgz",
-      "integrity": "sha512-ym5x1cj4mUAMBummxxRkI4pG5Vht1QMsJexwGP8547TZ0sox9fCLDHw9KCH9c1FO5d9GopvkaJsBIOkTKxksdw==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-linux-x64-musl": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.9.2.tgz",
-      "integrity": "sha512-m0hYELHGXdYx64D6IDDg/1vOJEaiV8f1G/iO+tejvRCJNSwK4jJ15e38JQy5Q6dGkn1M/9KcyEOwqmlZ2kqaZg==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.9.2.tgz",
-      "integrity": "sha512-x1CWburlbN5JjG+juenuNa4KdedBdXLjZMp56nHFSHTOsb/MI2DYiGzLtRGHNMyydPGffGId+VgjOMrcltOksA==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.9.2.tgz",
-      "integrity": "sha512-VVzCB5yXR1QlfsH1Xw1zdzQ4Pxuzv+CPr5qpElpKhVxlxD3CRdfubAG9mJROl6/dmj5gVYDDWk8sC+j9BI9/kQ==",
-      "dev": true,
-      "optional": true
-    },
-    "@rollup/rollup-win32-x64-msvc": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.9.2.tgz",
-      "integrity": "sha512-SYRedJi+mweatroB+6TTnJYLts0L0bosg531xnQWtklOI6dezEagx4Q0qDyvRdK+qgdA3YZpjjGuPFtxBmddBA==",
-      "dev": true,
-      "optional": true
-    },
-    "@rushstack/node-core-library": {
-      "version": "3.61.0",
-      "resolved": "https://registry.npmjs.org/@rushstack/node-core-library/-/node-core-library-3.61.0.tgz",
-      "integrity": "sha512-tdOjdErme+/YOu4gPed3sFS72GhtWCgNV9oDsHDnoLY5oDfwjKUc9Z+JOZZ37uAxcm/OCahDHfuu2ugqrfWAVQ==",
-      "dev": true,
-      "requires": {
-        "colors": "~1.2.1",
-        "fs-extra": "~7.0.1",
-        "import-lazy": "~4.0.0",
-        "jju": "~1.4.0",
-        "resolve": "~1.22.1",
-        "semver": "~7.5.4",
-        "z-schema": "~5.0.2"
-      },
-      "dependencies": {
-        "fs-extra": {
-          "version": "7.0.1",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-7.0.1.tgz",
-          "integrity": "sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==",
-          "dev": true,
-          "requires": {
-            "graceful-fs": "^4.1.2",
-            "jsonfile": "^4.0.0",
-            "universalify": "^0.1.0"
-          }
-        },
-        "jsonfile": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
-          "integrity": "sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==",
-          "dev": true,
-          "requires": {
-            "graceful-fs": "^4.1.6"
-          }
-        },
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "universalify": {
-          "version": "0.1.2",
-          "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
-          "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==",
-          "dev": true
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "@rushstack/rig-package": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/@rushstack/rig-package/-/rig-package-0.5.1.tgz",
-      "integrity": "sha512-pXRYSe29TjRw7rqxD4WS3HN/sRSbfr+tJs4a9uuaSIBAITbUggygdhuG0VrO0EO+QqH91GhYMN4S6KRtOEmGVA==",
-      "dev": true,
-      "requires": {
-        "resolve": "~1.22.1",
-        "strip-json-comments": "~3.1.1"
-      }
-    },
-    "@rushstack/ts-command-line": {
-      "version": "4.17.1",
-      "resolved": "https://registry.npmjs.org/@rushstack/ts-command-line/-/ts-command-line-4.17.1.tgz",
-      "integrity": "sha512-2jweO1O57BYP5qdBGl6apJLB+aRIn5ccIRTPDyULh0KMwVzFqWtw6IZWt1qtUoZD/pD2RNkIOosH6Cq45rIYeg==",
-      "dev": true,
-      "requires": {
-        "@types/argparse": "1.0.38",
-        "argparse": "~1.0.9",
-        "colors": "~1.2.1",
-        "string-argv": "~0.3.1"
-      },
-      "dependencies": {
-        "argparse": {
-          "version": "1.0.10",
-          "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
-          "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
-          "dev": true,
-          "requires": {
-            "sprintf-js": "~1.0.2"
-          }
-        }
-      }
-    },
-    "@sinclair/typebox": {
-      "version": "0.27.8",
-      "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.27.8.tgz",
-      "integrity": "sha512-+Fj43pSMwJs4KRrH/938Uf+uAELIgVBmQzg/q1YG10djyfA3TnrU8N8XzqCh/okZdszqBQTZf96idMfE5lnwTA==",
-      "dev": true
-    },
-    "@sinonjs/commons": {
-      "version": "1.8.6",
-      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-1.8.6.tgz",
-      "integrity": "sha512-Ky+XkAkqPZSm3NLBeUng77EBQl3cmeJhITaGHdYH8kjVB+aun3S4XBRti2zt17mtt0mIUDiNxYeoJm6drVvBJQ==",
-      "dev": true,
-      "requires": {
-        "type-detect": "4.0.8"
-      }
-    },
-    "@sinonjs/fake-timers": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-7.1.2.tgz",
-      "integrity": "sha512-iQADsW4LBMISqZ6Ci1dupJL9pprqwcVFTcOsEmQOEhW+KLCVn/Y4Jrvg2k19fIHCp+iFprriYPTdRcQR8NbUPg==",
-      "dev": true,
-      "requires": {
-        "@sinonjs/commons": "^1.7.0"
-      }
-    },
-    "@sinonjs/samsam": {
-      "version": "6.1.3",
-      "resolved": "https://registry.npmjs.org/@sinonjs/samsam/-/samsam-6.1.3.tgz",
-      "integrity": "sha512-nhOb2dWPeb1sd3IQXL/dVPnKHDOAFfvichtBf4xV00/rU1QbPCQqKMbvIheIjqwVjh7qIgf2AHTHi391yMOMpQ==",
-      "dev": true,
-      "requires": {
-        "@sinonjs/commons": "^1.6.0",
-        "lodash.get": "^4.4.2",
-        "type-detect": "^4.0.8"
-      }
-    },
-    "@sinonjs/text-encoding": {
-      "version": "0.7.2",
-      "resolved": "https://registry.npmjs.org/@sinonjs/text-encoding/-/text-encoding-0.7.2.tgz",
-      "integrity": "sha512-sXXKG+uL9IrKqViTtao2Ws6dy0znu9sOaP1di/jKGW1M6VssO8vlpXCQcpZ+jisQ1tTFAC5Jo/EOzFbggBagFQ==",
-      "dev": true
-    },
-    "@testim/chrome-version": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/@testim/chrome-version/-/chrome-version-1.1.4.tgz",
-      "integrity": "sha512-kIhULpw9TrGYnHp/8VfdcneIcxKnLixmADtukQRtJUmsVlMg0niMkwV0xZmi8hqa57xqilIHjWFA0GKvEjVU5g==",
-      "dev": true
-    },
-    "@tootallnate/once": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz",
-      "integrity": "sha512-RbzJvlNzmRq5c3O09UipeuXno4tA1FE6ikOjxZK0tuxVv3412l64l5t1W5pj4+rJq9vpkm/kwiR07aZXnsKPxw==",
-      "dev": true
-    },
-    "@tootallnate/quickjs-emscripten": {
-      "version": "0.23.0",
-      "resolved": "https://registry.npmjs.org/@tootallnate/quickjs-emscripten/-/quickjs-emscripten-0.23.0.tgz",
-      "integrity": "sha512-C5Mc6rdnsaJDjO3UpGW/CQTHtCKaYlScZTly4JIu97Jxo/odCiH0ITnDXSJPTOrEKk/ycSZ0AOgTmkDtkOsvIA==",
-      "dev": true
-    },
-    "@tsconfig/node10": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.9.tgz",
-      "integrity": "sha512-jNsYVVxU8v5g43Erja32laIDHXeoNvFEpX33OK4d6hljo3jDhCBDhx5dhCCTMWUojscpAagGiRkBKxpdl9fxqA==",
-      "dev": true
-    },
-    "@tsconfig/node12": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz",
-      "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==",
-      "dev": true
-    },
-    "@tsconfig/node14": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz",
-      "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==",
-      "dev": true
-    },
-    "@tsconfig/node16": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz",
-      "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==",
-      "dev": true
-    },
-    "@types/argparse": {
-      "version": "1.0.38",
-      "resolved": "https://registry.npmjs.org/@types/argparse/-/argparse-1.0.38.tgz",
-      "integrity": "sha512-ebDJ9b0e702Yr7pWgB0jzm+CX4Srzz8RcXtLJDJB+BSccqMa36uyH/zUsSYao5+BD1ytv3k3rPYCq4mAE1hsXA==",
-      "dev": true
-    },
-    "@types/chai": {
-      "version": "4.3.11",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.3.11.tgz",
-      "integrity": "sha512-qQR1dr2rGIHYlJulmr8Ioq3De0Le9E4MJ5AiaeAETJJpndT1uUNHsGFK3L/UIu+rbkQSdj8J/w2bCsBZc/Y5fQ==",
-      "dev": true
-    },
-    "@types/estree": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz",
-      "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==",
-      "dev": true
-    },
-    "@types/istanbul-lib-coverage": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.6.tgz",
-      "integrity": "sha512-2QF/t/auWm0lsy8XtKVPG19v3sSOQlJe/YHZgfjb/KBBHOGSV+J2q/S671rcq9uTBrLAXmZpqJiaQbMT+zNU1w==",
-      "dev": true
-    },
-    "@types/json-schema": {
-      "version": "7.0.15",
-      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
-      "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
-      "dev": true
-    },
-    "@types/json5": {
-      "version": "0.0.29",
-      "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz",
-      "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==",
-      "dev": true
-    },
-    "@types/node": {
-      "version": "20.10.2",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.10.2.tgz",
-      "integrity": "sha512-37MXfxkb0vuIlRKHNxwCkb60PNBpR94u4efQuN4JgIAm66zfCDXGSAFCef9XUWFovX2R1ok6Z7MHhtdVXXkkIw==",
-      "dev": true,
-      "requires": {
-        "undici-types": "~5.26.4"
-      }
-    },
-    "@types/parse-json": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.2.tgz",
-      "integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==",
-      "dev": true
-    },
-    "@types/selenium-webdriver": {
-      "version": "4.1.20",
-      "resolved": "https://registry.npmjs.org/@types/selenium-webdriver/-/selenium-webdriver-4.1.20.tgz",
-      "integrity": "sha512-WxzARWDZVTbXlJgwYGhNoiV4OuHDabctSQmK5V88LqjW9TJiLETcknxRZ2xB1toecQnu0T2jt1pPXnSYkaWYiw==",
-      "dev": true,
-      "requires": {
-        "@types/ws": "*"
-      }
-    },
-    "@types/semver": {
-      "version": "7.5.6",
-      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.6.tgz",
-      "integrity": "sha512-dn1l8LaMea/IjDoHNd9J52uBbInB796CDffS6VdIxvqYCPSG0V0DzHp76GpaWnlhg88uYyPbXCDIowa86ybd5A==",
-      "dev": true
-    },
-    "@types/tabbable": {
-      "version": "3.1.4",
-      "resolved": "https://registry.npmjs.org/@types/tabbable/-/tabbable-3.1.4.tgz",
-      "integrity": "sha512-jvvxX2fT0OKV8M+0Ny6wdvcqrev3o/8n1E93VPCAdQ8Qj0FdixXMQQ78ugYfPQ72L97VEadvljjkg+3WBwFM+w==",
-      "dev": true
-    },
-    "@types/ws": {
-      "version": "8.5.10",
-      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.10.tgz",
-      "integrity": "sha512-vmQSUcfalpIq0R9q7uTo2lXs6eGIpt9wtnLdMv9LVpIjCA/+ufZRozlVoVelIYixx1ugCBKDhn89vnsEGOCx9A==",
-      "dev": true,
-      "requires": {
-        "@types/node": "*"
-      }
-    },
-    "@types/yauzl": {
-      "version": "2.10.3",
-      "resolved": "https://registry.npmjs.org/@types/yauzl/-/yauzl-2.10.3.tgz",
-      "integrity": "sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "@types/node": "*"
-      }
-    },
-    "@typescript-eslint/eslint-plugin": {
-      "version": "5.62.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.62.0.tgz",
-      "integrity": "sha512-TiZzBSJja/LbhNPvk6yc0JrX9XqhQ0hdh6M2svYfsHGejaKFIAGd9MQ+ERIMzLGlN/kZoYIgdxFV0PuljTKXag==",
-      "dev": true,
-      "requires": {
-        "@eslint-community/regexpp": "^4.4.0",
-        "@typescript-eslint/scope-manager": "5.62.0",
-        "@typescript-eslint/type-utils": "5.62.0",
-        "@typescript-eslint/utils": "5.62.0",
-        "debug": "^4.3.4",
-        "graphemer": "^1.4.0",
-        "ignore": "^5.2.0",
-        "natural-compare-lite": "^1.4.0",
-        "semver": "^7.3.7",
-        "tsutils": "^3.21.0"
-      },
-      "dependencies": {
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "@typescript-eslint/parser": {
-      "version": "5.62.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.62.0.tgz",
-      "integrity": "sha512-VlJEV0fOQ7BExOsHYAGrgbEiZoi8D+Bl2+f6V2RrXerRSylnp+ZBHmPvaIa8cz0Ajx7WO7Z5RqfgYg7ED1nRhA==",
-      "dev": true,
-      "requires": {
-        "@typescript-eslint/scope-manager": "5.62.0",
-        "@typescript-eslint/types": "5.62.0",
-        "@typescript-eslint/typescript-estree": "5.62.0",
-        "debug": "^4.3.4"
-      }
-    },
-    "@typescript-eslint/scope-manager": {
-      "version": "5.62.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.62.0.tgz",
-      "integrity": "sha512-VXuvVvZeQCQb5Zgf4HAxc04q5j+WrNAtNh9OwCsCgpKqESMTu3tF/jhZ3xG6T4NZwWl65Bg8KuS2uEvhSfLl0w==",
-      "dev": true,
-      "requires": {
-        "@typescript-eslint/types": "5.62.0",
-        "@typescript-eslint/visitor-keys": "5.62.0"
-      }
-    },
-    "@typescript-eslint/type-utils": {
-      "version": "5.62.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-5.62.0.tgz",
-      "integrity": "sha512-xsSQreu+VnfbqQpW5vnCJdq1Z3Q0U31qiWmRhr98ONQmcp/yhiPJFPq8MXiJVLiksmOKSjIldZzkebzHuCGzew==",
-      "dev": true,
-      "requires": {
-        "@typescript-eslint/typescript-estree": "5.62.0",
-        "@typescript-eslint/utils": "5.62.0",
-        "debug": "^4.3.4",
-        "tsutils": "^3.21.0"
-      }
-    },
-    "@typescript-eslint/types": {
-      "version": "5.62.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.62.0.tgz",
-      "integrity": "sha512-87NVngcbVXUahrRTqIK27gD2t5Cu1yuCXxbLcFtCzZGlfyVWWh8mLHkoxzjsB6DDNnvdL+fW8MiwPEJyGJQDgQ==",
-      "dev": true
-    },
-    "@typescript-eslint/typescript-estree": {
-      "version": "5.62.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.62.0.tgz",
-      "integrity": "sha512-CmcQ6uY7b9y694lKdRB8FEel7JbU/40iSAPomu++SjLMntB+2Leay2LO6i8VnJk58MtE9/nQSFIH6jpyRWyYzA==",
-      "dev": true,
-      "requires": {
-        "@typescript-eslint/types": "5.62.0",
-        "@typescript-eslint/visitor-keys": "5.62.0",
-        "debug": "^4.3.4",
-        "globby": "^11.1.0",
-        "is-glob": "^4.0.3",
-        "semver": "^7.3.7",
-        "tsutils": "^3.21.0"
-      },
-      "dependencies": {
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "@typescript-eslint/utils": {
-      "version": "5.62.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.62.0.tgz",
-      "integrity": "sha512-n8oxjeb5aIbPFEtmQxQYOLI0i9n5ySBEY/ZEHHZqKQSFnxio1rv6dthascc9dLuwrL0RC5mPCxB7vnAVGAYWAQ==",
-      "dev": true,
-      "requires": {
-        "@eslint-community/eslint-utils": "^4.2.0",
-        "@types/json-schema": "^7.0.9",
-        "@types/semver": "^7.3.12",
-        "@typescript-eslint/scope-manager": "5.62.0",
-        "@typescript-eslint/types": "5.62.0",
-        "@typescript-eslint/typescript-estree": "5.62.0",
-        "eslint-scope": "^5.1.1",
-        "semver": "^7.3.7"
-      },
-      "dependencies": {
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "@typescript-eslint/visitor-keys": {
-      "version": "5.62.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.62.0.tgz",
-      "integrity": "sha512-07ny+LHRzQXepkGg6w0mFY41fVUNBrL2Roj/++7V1txKugfjm/Ci/qSND03r2RhlJhJYMcTn9AhhSSqQp0Ysyw==",
-      "dev": true,
-      "requires": {
-        "@typescript-eslint/types": "5.62.0",
-        "eslint-visitor-keys": "^3.3.0"
-      }
-    },
-    "@ungap/structured-clone": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz",
-      "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==",
-      "dev": true
-    },
-    "@vitejs/plugin-vue": {
-      "version": "4.5.1",
-      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.5.1.tgz",
-      "integrity": "sha512-DaUzYFr+2UGDG7VSSdShKa9sIWYBa1LL8KC0MNOf2H5LjcTPjob0x8LbkqXWmAtbANJCkpiQTj66UVcQkN2s3g==",
-      "dev": true,
-      "requires": {}
-    },
-    "@vitest/expect": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-1.1.1.tgz",
-      "integrity": "sha512-Qpw01C2Hyb3085jBkOJLQ7HRX0Ncnh2qV4p+xWmmhcIUlMykUF69zsnZ1vPmAjZpomw9+5tWEGOQ0GTfR8U+kA==",
-      "dev": true,
-      "requires": {
-        "@vitest/spy": "1.1.1",
-        "@vitest/utils": "1.1.1",
-        "chai": "^4.3.10"
-      }
-    },
-    "@vitest/runner": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-1.1.1.tgz",
-      "integrity": "sha512-8HokyJo1SnSi3uPFKfWm/Oq1qDwLC4QDcVsqpXIXwsRPAg3gIDh8EbZ1ri8cmQkBxdOu62aOF9B4xcqJhvt4xQ==",
-      "dev": true,
-      "requires": {
-        "@vitest/utils": "1.1.1",
-        "p-limit": "^5.0.0",
-        "pathe": "^1.1.1"
-      },
-      "dependencies": {
-        "p-limit": {
-          "version": "5.0.0",
-          "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-5.0.0.tgz",
-          "integrity": "sha512-/Eaoq+QyLSiXQ4lyYV23f14mZRQcXnxfHrN0vCai+ak9G0pp9iEQukIIZq5NccEvwRB8PUnZT0KsOoDCINS1qQ==",
-          "dev": true,
-          "requires": {
-            "yocto-queue": "^1.0.0"
-          }
-        },
-        "yocto-queue": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.0.0.tgz",
-          "integrity": "sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==",
-          "dev": true
-        }
-      }
-    },
-    "@vitest/snapshot": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-1.1.1.tgz",
-      "integrity": "sha512-WnMHjv4VdHLbFGgCdVVvyRkRPnOKN75JJg+LLTdr6ah7YnL75W+7CTIMdzPEPzaDxA8r5yvSVlc1d8lH3yE28w==",
-      "dev": true,
-      "requires": {
-        "magic-string": "^0.30.5",
-        "pathe": "^1.1.1",
-        "pretty-format": "^29.7.0"
-      }
-    },
-    "@vitest/spy": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-1.1.1.tgz",
-      "integrity": "sha512-hDU2KkOTfFp4WFFPWwHFauddwcKuGQ7gF6Un/ZZkCogoAiTMN7/7YKvUDbywPZZ754iCQGjdUmXN3t4k0jm1IQ==",
-      "dev": true,
-      "requires": {
-        "tinyspy": "^2.2.0"
-      }
-    },
-    "@vitest/utils": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-1.1.1.tgz",
-      "integrity": "sha512-E9LedH093vST/JuBSyHLFMpxJKW3dLhe/flUSPFedoyj4wKiFX7Jm8gYLtOIiin59dgrssfmFv0BJ1u8P/LC/A==",
-      "dev": true,
-      "requires": {
-        "diff-sequences": "^29.6.3",
-        "loupe": "^2.3.7",
-        "pretty-format": "^29.7.0"
-      },
-      "dependencies": {
-        "loupe": {
-          "version": "2.3.7",
-          "resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.7.tgz",
-          "integrity": "sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==",
-          "dev": true,
-          "requires": {
-            "get-func-name": "^2.0.1"
-          }
-        }
-      }
-    },
-    "@volar/language-core": {
-      "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-1.11.1.tgz",
-      "integrity": "sha512-dOcNn3i9GgZAcJt43wuaEykSluAuOkQgzni1cuxLxTV0nJKanQztp7FxyswdRILaKH+P2XZMPRp2S4MV/pElCw==",
-      "dev": true,
-      "requires": {
-        "@volar/source-map": "1.11.1"
-      }
-    },
-    "@volar/source-map": {
-      "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-1.11.1.tgz",
-      "integrity": "sha512-hJnOnwZ4+WT5iupLRnuzbULZ42L7BWWPMmruzwtLhJfpDVoZLjNBxHDi2sY2bgZXCKlpU5XcsMFoYrsQmPhfZg==",
-      "dev": true,
-      "requires": {
-        "muggle-string": "^0.3.1"
-      }
-    },
-    "@volar/typescript": {
-      "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-1.11.1.tgz",
-      "integrity": "sha512-iU+t2mas/4lYierSnoFOeRFQUhAEMgsFuQxoxvwn5EdQopw43j+J27a4lt9LMInx1gLJBC6qL14WYGlgymaSMQ==",
-      "dev": true,
-      "requires": {
-        "@volar/language-core": "1.11.1",
-        "path-browserify": "^1.0.1"
-      }
-    },
-    "@vue/compiler-core": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.3.9.tgz",
-      "integrity": "sha512-+/Lf68Vr/nFBA6ol4xOtJrW+BQWv3QWKfRwGSm70jtXwfhZNF4R/eRgyVJYoxFRhdCTk/F6g99BP0ffPgZihfQ==",
-      "requires": {
-        "@babel/parser": "^7.23.3",
-        "@vue/shared": "3.3.9",
-        "estree-walker": "^2.0.2",
-        "source-map-js": "^1.0.2"
-      }
-    },
-    "@vue/compiler-dom": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.3.9.tgz",
-      "integrity": "sha512-nfWubTtLXuT4iBeDSZ5J3m218MjOy42Vp2pmKVuBKo2/BLcrFUX8nCSr/bKRFiJ32R8qbdnnnBgRn9AdU5v0Sg==",
-      "requires": {
-        "@vue/compiler-core": "3.3.9",
-        "@vue/shared": "3.3.9"
-      }
-    },
-    "@vue/compiler-sfc": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.3.9.tgz",
-      "integrity": "sha512-wy0CNc8z4ihoDzjASCOCsQuzW0A/HP27+0MDSSICMjVIFzk/rFViezkR3dzH+miS2NDEz8ywMdbjO5ylhOLI2A==",
-      "requires": {
-        "@babel/parser": "^7.23.3",
-        "@vue/compiler-core": "3.3.9",
-        "@vue/compiler-dom": "3.3.9",
-        "@vue/compiler-ssr": "3.3.9",
-        "@vue/reactivity-transform": "3.3.9",
-        "@vue/shared": "3.3.9",
-        "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.5",
-        "postcss": "^8.4.31",
-        "source-map-js": "^1.0.2"
-      }
-    },
-    "@vue/compiler-ssr": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.3.9.tgz",
-      "integrity": "sha512-NO5oobAw78R0G4SODY5A502MGnDNiDjf6qvhn7zD7TJGc8XDeIEw4fg6JU705jZ/YhuokBKz0A5a/FL/XZU73g==",
-      "requires": {
-        "@vue/compiler-dom": "3.3.9",
-        "@vue/shared": "3.3.9"
-      }
-    },
-    "@vue/devtools-api": {
-      "version": "6.5.1",
-      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.1.tgz",
-      "integrity": "sha512-+KpckaAQyfbvshdDW5xQylLni1asvNSGme1JFs8I1+/H5pHEhqUKMEQD/qn3Nx5+/nycBq11qAEi8lk+LXI2dA==",
-      "dev": true
-    },
-    "@vue/eslint-config-typescript": {
-      "version": "11.0.3",
-      "resolved": "https://registry.npmjs.org/@vue/eslint-config-typescript/-/eslint-config-typescript-11.0.3.tgz",
-      "integrity": "sha512-dkt6W0PX6H/4Xuxg/BlFj5xHvksjpSlVjtkQCpaYJBIEuKj2hOVU7r+TIe+ysCwRYFz/lGqvklntRkCAibsbPw==",
-      "dev": true,
-      "requires": {
-        "@typescript-eslint/eslint-plugin": "^5.59.1",
-        "@typescript-eslint/parser": "^5.59.1",
-        "vue-eslint-parser": "^9.1.1"
-      }
-    },
-    "@vue/language-core": {
-      "version": "1.8.24",
-      "resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-1.8.24.tgz",
-      "integrity": "sha512-2ClHvij0WlsDWryPzXJCSpPc6rusZFNoVtRZGgGGkKCmKuIREDDKmH8j+1tYyxPYyH0qL6pZ6+IHD8KIm5nWAw==",
-      "dev": true,
-      "requires": {
-        "@volar/language-core": "~1.11.1",
-        "@volar/source-map": "~1.11.1",
-        "@vue/compiler-dom": "^3.3.0",
-        "@vue/shared": "^3.3.0",
-        "computeds": "^0.0.1",
-        "minimatch": "^9.0.3",
-        "muggle-string": "^0.3.1",
-        "path-browserify": "^1.0.1",
-        "vue-template-compiler": "^2.7.14"
-      },
-      "dependencies": {
-        "brace-expansion": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-          "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-          "dev": true,
-          "requires": {
-            "balanced-match": "^1.0.0"
-          }
-        },
-        "minimatch": {
-          "version": "9.0.3",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
-          "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
-          "dev": true,
-          "requires": {
-            "brace-expansion": "^2.0.1"
-          }
-        }
-      }
-    },
-    "@vue/reactivity": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.3.9.tgz",
-      "integrity": "sha512-VmpIqlNp+aYDg2X0xQhJqHx9YguOmz2UxuUJDckBdQCNkipJvfk9yA75woLWElCa0Jtyec3lAAt49GO0izsphw==",
-      "peer": true,
-      "requires": {
-        "@vue/shared": "3.3.9"
-      }
-    },
-    "@vue/reactivity-transform": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.3.9.tgz",
-      "integrity": "sha512-HnUFm7Ry6dFa4Lp63DAxTixUp8opMtQr6RxQCpDI1vlh12rkGIeYqMvJtK+IKyEfEOa2I9oCkD1mmsPdaGpdVg==",
-      "requires": {
-        "@babel/parser": "^7.23.3",
-        "@vue/compiler-core": "3.3.9",
-        "@vue/shared": "3.3.9",
-        "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.5"
-      }
-    },
-    "@vue/runtime-core": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.3.9.tgz",
-      "integrity": "sha512-xxaG9KvPm3GTRuM4ZyU8Tc+pMVzcu6eeoSRQJ9IE7NmCcClW6z4B3Ij6L4EDl80sxe/arTtQ6YmgiO4UZqRc+w==",
-      "peer": true,
-      "requires": {
-        "@vue/reactivity": "3.3.9",
-        "@vue/shared": "3.3.9"
-      }
-    },
-    "@vue/runtime-dom": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.3.9.tgz",
-      "integrity": "sha512-e7LIfcxYSWbV6BK1wQv9qJyxprC75EvSqF/kQKe6bdZEDNValzeRXEVgiX7AHI6hZ59HA4h7WT5CGvm69vzJTQ==",
-      "peer": true,
-      "requires": {
-        "@vue/runtime-core": "3.3.9",
-        "@vue/shared": "3.3.9",
-        "csstype": "^3.1.2"
-      }
-    },
-    "@vue/server-renderer": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.3.9.tgz",
-      "integrity": "sha512-w0zT/s5l3Oa3ZjtLW88eO4uV6AQFqU8X5GOgzq7SkQQu6vVr+8tfm+OI2kDBplS/W/XgCBuFXiPw6T5EdwXP0A==",
-      "peer": true,
-      "requires": {
-        "@vue/compiler-ssr": "3.3.9",
-        "@vue/shared": "3.3.9"
-      }
-    },
-    "@vue/shared": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.3.9.tgz",
-      "integrity": "sha512-ZE0VTIR0LmYgeyhurPTpy4KzKsuDyQbMSdM49eKkMnT5X4VfFBLysMzjIZhLEFQYjjOVVfbvUDHckwjDFiO2eA=="
-    },
-    "@vue/test-utils": {
-      "version": "2.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/test-utils/-/test-utils-2.4.3.tgz",
-      "integrity": "sha512-F4K7mF+ad++VlTrxMJVRnenKSJmO6fkQt2wpRDiKDesQMkfpniGWsqEi/JevxGBo2qEkwwjvTUAoiGJLNx++CA==",
-      "dev": true,
-      "requires": {
-        "js-beautify": "^1.14.9",
-        "vue-component-type-helpers": "^1.8.21"
-      }
-    },
-    "abab": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz",
-      "integrity": "sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==",
-      "dev": true
-    },
-    "abbrev": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-2.0.0.tgz",
-      "integrity": "sha512-6/mh1E2u2YgEsCHdY0Yx5oW+61gZU+1vXaoiHHrpKeuRNNgFvS+/jrwHiQhB5apAf5oB7UB7E19ol2R2LKH8hQ==",
-      "dev": true
-    },
-    "acorn": {
-      "version": "8.11.2",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.2.tgz",
-      "integrity": "sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==",
-      "dev": true
-    },
-    "acorn-globals": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-6.0.0.tgz",
-      "integrity": "sha512-ZQl7LOWaF5ePqqcX4hLuv/bLXYQNfNWw2c0/yX/TsPRKamzHcTGQnlCjHT3TsmkOUVEPS3crCxiPfdzE/Trlhg==",
-      "dev": true,
-      "requires": {
-        "acorn": "^7.1.1",
-        "acorn-walk": "^7.1.1"
-      },
-      "dependencies": {
-        "acorn": {
-          "version": "7.4.1",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
-          "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
-          "dev": true
-        }
-      }
-    },
-    "acorn-jsx": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
-      "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
-      "dev": true,
-      "requires": {}
-    },
-    "acorn-walk": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz",
-      "integrity": "sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==",
-      "dev": true
-    },
-    "agent-base": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
-      "integrity": "sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==",
-      "dev": true,
-      "requires": {
-        "debug": "4"
-      }
-    },
-    "ajv": {
-      "version": "8.12.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.12.0.tgz",
-      "integrity": "sha512-sRu1kpcO9yLtYxBKvqfTeh9KzZEwO3STyX1HT+4CaDzC6HpTGYhIhPIzj9XuKU7KYDwnaeh5hcOwjy1QuJzBPA==",
-      "dev": true,
-      "requires": {
-        "fast-deep-equal": "^3.1.1",
-        "json-schema-traverse": "^1.0.0",
-        "require-from-string": "^2.0.2",
-        "uri-js": "^4.2.2"
-      }
-    },
-    "ansi-align": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-3.0.1.tgz",
-      "integrity": "sha512-IOfwwBF5iczOjp/WeY4YxyjqAFMQoZufdQWDd19SEExbVLNXqvpzSJ/M7Za4/sCPmQ0+GRquoA7bGcINcxew6w==",
-      "dev": true,
-      "requires": {
-        "string-width": "^4.1.0"
-      }
-    },
-    "ansi-colors": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-4.1.1.tgz",
-      "integrity": "sha512-JoX0apGbHaUJBNl6yF+p6JAFYZ666/hhCGKN5t9QFjbJQKUU/g8MNbFDbvfrgKXvI1QpZplPOnwIo99lX/AAmA==",
-      "dev": true
-    },
-    "ansi-escapes": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
-      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
-      "dev": true,
-      "requires": {
-        "type-fest": "^0.21.3"
-      }
-    },
-    "ansi-regex": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
-      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
-      "dev": true
-    },
-    "ansi-styles": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
-      "requires": {
-        "color-convert": "^2.0.1"
-      }
-    },
-    "ansi-to-html": {
-      "version": "0.7.2",
-      "resolved": "https://registry.npmjs.org/ansi-to-html/-/ansi-to-html-0.7.2.tgz",
-      "integrity": "sha512-v6MqmEpNlxF+POuyhKkidusCHWWkaLcGRURzivcU3I9tv7k4JVhFcnukrM5Rlk2rUywdZuzYAZ+kbZqWCnfN3g==",
-      "dev": true,
-      "requires": {
-        "entities": "^2.2.0"
-      }
-    },
-    "anymatch": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
-      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
-      "dev": true,
-      "requires": {
-        "normalize-path": "^3.0.0",
-        "picomatch": "^2.0.4"
-      }
-    },
-    "archiver": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/archiver/-/archiver-5.3.2.tgz",
-      "integrity": "sha512-+25nxyyznAXF7Nef3y0EbBeqmGZgeN/BxHX29Rs39djAfaFalmQ89SE6CWyDCHzGL0yt/ycBtNOmGTW0FyGWNw==",
-      "dev": true,
-      "requires": {
-        "archiver-utils": "^2.1.0",
-        "async": "^3.2.4",
-        "buffer-crc32": "^0.2.1",
-        "readable-stream": "^3.6.0",
-        "readdir-glob": "^1.1.2",
-        "tar-stream": "^2.2.0",
-        "zip-stream": "^4.1.0"
-      }
-    },
-    "archiver-utils": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/archiver-utils/-/archiver-utils-2.1.0.tgz",
-      "integrity": "sha512-bEL/yUb/fNNiNTuUz979Z0Yg5L+LzLxGJz8x79lYmR54fmTIb6ob/hNQgkQnIUDWIFjZVQwl9Xs356I6BAMHfw==",
-      "dev": true,
-      "requires": {
-        "glob": "^7.1.4",
-        "graceful-fs": "^4.2.0",
-        "lazystream": "^1.0.0",
-        "lodash.defaults": "^4.2.0",
-        "lodash.difference": "^4.5.0",
-        "lodash.flatten": "^4.4.0",
-        "lodash.isplainobject": "^4.0.6",
-        "lodash.union": "^4.6.0",
-        "normalize-path": "^3.0.0",
-        "readable-stream": "^2.0.0"
-      },
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "2.3.8",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-          "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
-          "dev": true,
-          "requires": {
-            "core-util-is": "~1.0.0",
-            "inherits": "~2.0.3",
-            "isarray": "~1.0.0",
-            "process-nextick-args": "~2.0.0",
-            "safe-buffer": "~5.1.1",
-            "string_decoder": "~1.1.1",
-            "util-deprecate": "~1.0.1"
-          }
-        },
-        "safe-buffer": {
-          "version": "5.1.2",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-          "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-          "dev": true
-        },
-        "string_decoder": {
-          "version": "1.1.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-          "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-          "dev": true,
-          "requires": {
-            "safe-buffer": "~5.1.0"
-          }
-        }
-      }
-    },
-    "arg": {
-      "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
-      "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==",
-      "dev": true
-    },
-    "argparse": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
-      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
-      "dev": true
-    },
-    "aria-query": {
-      "version": "5.1.3",
-      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.1.3.tgz",
-      "integrity": "sha512-R5iJ5lkuHybztUfuOAznmboyjWq8O6sqNqtK7CLOqdydi54VNbORp49mb14KbWgG1QD3JFO9hJdZ+y4KutfdOQ==",
-      "dev": true,
-      "requires": {
-        "deep-equal": "^2.0.5"
-      }
-    },
-    "array-buffer-byte-length": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.0.tgz",
-      "integrity": "sha512-LPuwb2P+NrQw3XhxGc36+XSvuBPopovXYTR9Ew++Du9Yb/bx5AzBfrIsBoj0EZUifjQU+sHL21sseZ3jerWO/A==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "is-array-buffer": "^3.0.1"
-      }
-    },
-    "array-includes": {
-      "version": "3.1.7",
-      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.7.tgz",
-      "integrity": "sha512-dlcsNBIiWhPkHdOEEKnehA+RNUWDc4UqFtnIXU4uuYDPtA4LDkr7qip2p0VvFAEXNDr0yWZ9PJyIRiGjRLQzwQ==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1",
-        "is-string": "^1.0.7"
-      }
-    },
-    "array-union": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
-      "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
-      "dev": true
-    },
-    "array.prototype.findlastindex": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.3.tgz",
-      "integrity": "sha512-LzLoiOMAxvy+Gd3BAq3B7VeIgPdo+Q8hthvKtXybMvRV0jrXfJM/t8mw7nNlpEcVlVUnCnM2KSX4XU5HmpodOA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "es-shim-unscopables": "^1.0.0",
-        "get-intrinsic": "^1.2.1"
-      }
-    },
-    "array.prototype.flat": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.3.2.tgz",
-      "integrity": "sha512-djYB+Zx2vLewY8RWlNCUdHjDXs2XOgm602S9E7P/UpHgfeHL00cRiIF+IN/G/aUJ7kGPb6yO/ErDI5V2s8iycA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "es-shim-unscopables": "^1.0.0"
-      }
-    },
-    "array.prototype.flatmap": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.3.2.tgz",
-      "integrity": "sha512-Ewyx0c9PmpcsByhSW4r+9zDU7sGjFc86qf/kKtuSCRdhfbk0SNLLkaT5qvcHnRGgc5NP/ly/y+qkXkqONX54CQ==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "es-shim-unscopables": "^1.0.0"
-      }
-    },
-    "arraybuffer.prototype.slice": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.2.tgz",
-      "integrity": "sha512-yMBKppFur/fbHu9/6USUe03bZ4knMYiwFBcyiaXB8Go0qNehwX6inYPzK9U0NeQvGxKthcmHcaR8P5MStSRBAw==",
-      "dev": true,
-      "requires": {
-        "array-buffer-byte-length": "^1.0.0",
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1",
-        "is-array-buffer": "^3.0.2",
-        "is-shared-array-buffer": "^1.0.2"
-      }
-    },
-    "asap": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
-      "integrity": "sha512-BSHWgDSAiKs50o2Re8ppvp3seVHXSRM44cdSsT9FfNEUUZLOGWVCsiWaRPWM1Znn+mqZ1OfVZ3z3DWEzSp7hRA==",
-      "dev": true
-    },
-    "assert-never": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/assert-never/-/assert-never-1.2.1.tgz",
-      "integrity": "sha512-TaTivMB6pYI1kXwrFlEhLeGfOqoDNdTxjCdwRfFFkEA30Eu+k48W34nlok2EYWJfFFzqaEmichdNM7th6M5HNw==",
-      "dev": true
-    },
-    "assertion-error": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.1.0.tgz",
-      "integrity": "sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==",
-      "dev": true
-    },
-    "ast-types": {
-      "version": "0.16.1",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.16.1.tgz",
-      "integrity": "sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==",
-      "dev": true,
-      "requires": {
-        "tslib": "^2.0.1"
-      }
-    },
-    "astral-regex": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-2.0.0.tgz",
-      "integrity": "sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==",
-      "dev": true
-    },
-    "async": {
-      "version": "3.2.5",
-      "resolved": "https://registry.npmjs.org/async/-/async-3.2.5.tgz",
-      "integrity": "sha512-baNZyqaaLhyLVKm/DlvdW051MSgO6b8eVfIezl9E5PqWxFgzLm/wQntEW4zOytVburDEr0JlALEpdOFwvErLsg==",
-      "dev": true
-    },
-    "asynckit": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
-      "dev": true
-    },
-    "at-least-node": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/at-least-node/-/at-least-node-1.0.0.tgz",
-      "integrity": "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==",
-      "dev": true
-    },
-    "autoprefixer": {
-      "version": "10.4.16",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz",
-      "integrity": "sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ==",
-      "dev": true,
-      "requires": {
-        "browserslist": "^4.21.10",
-        "caniuse-lite": "^1.0.30001538",
-        "fraction.js": "^4.3.6",
-        "normalize-range": "^0.1.2",
-        "picocolors": "^1.0.0",
-        "postcss-value-parser": "^4.2.0"
-      }
-    },
-    "available-typed-arrays": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz",
-      "integrity": "sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==",
-      "dev": true
-    },
-    "axe-core": {
-      "version": "4.8.2",
-      "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.8.2.tgz",
-      "integrity": "sha512-/dlp0fxyM3R8YW7MFzaHWXrf4zzbr0vaYb23VBFCl83R7nWNPg/yaQw2Dc8jzCMmDVLhSdzH8MjrsuIUuvX+6g==",
-      "dev": true
-    },
-    "axios": {
-      "version": "1.6.7",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.7.tgz",
-      "integrity": "sha512-/hDJGff6/c7u0hDkvkGxR/oy6CbCs8ziCsC7SqmhjfozqiJGc8Z11wrv9z9lYfY4K8l+H9TpjcMDX0xOZmx+RA==",
-      "dev": true,
-      "requires": {
-        "follow-redirects": "^1.15.4",
-        "form-data": "^4.0.0",
-        "proxy-from-env": "^1.1.0"
-      }
-    },
-    "b4a": {
-      "version": "1.6.6",
-      "resolved": "https://registry.npmjs.org/b4a/-/b4a-1.6.6.tgz",
-      "integrity": "sha512-5Tk1HLk6b6ctmjIkAcU/Ujv/1WqiDl0F0JdRCR80VsOcUlHcu7pWeWRlOqQLHfDEsVx9YH/aif5AG4ehoCtTmg==",
-      "dev": true
-    },
-    "babel-plugin-polyfill-corejs2": {
-      "version": "0.4.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.6.tgz",
-      "integrity": "sha512-jhHiWVZIlnPbEUKSSNb9YoWcQGdlTLq7z1GHL4AjFxaoOUMuuEVJ+Y4pAaQUGOGk93YsVCKPbqbfw3m0SM6H8Q==",
-      "dev": true,
-      "requires": {
-        "@babel/compat-data": "^7.22.6",
-        "@babel/helper-define-polyfill-provider": "^0.4.3",
-        "semver": "^6.3.1"
-      }
-    },
-    "babel-plugin-polyfill-corejs3": {
-      "version": "0.8.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.8.6.tgz",
-      "integrity": "sha512-leDIc4l4tUgU7str5BWLS2h8q2N4Nf6lGZP6UrNDxdtfF2g69eJ5L0H7S8A5Ln/arfFAfHor5InAdZuIOwZdgQ==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-define-polyfill-provider": "^0.4.3",
-        "core-js-compat": "^3.33.1"
-      }
-    },
-    "babel-plugin-polyfill-regenerator": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.5.3.tgz",
-      "integrity": "sha512-8sHeDOmXC8csczMrYEOf0UTNa4yE2SxV5JGeT/LP1n0OYVDUUFPxG9vdk2AlDlIit4t+Kf0xCtpgXPBwnn/9pw==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-define-polyfill-provider": "^0.4.3"
-      }
-    },
-    "babel-walk": {
-      "version": "3.0.0-canary-5",
-      "resolved": "https://registry.npmjs.org/babel-walk/-/babel-walk-3.0.0-canary-5.tgz",
-      "integrity": "sha512-GAwkz0AihzY5bkwIY5QDR+LvsRQgB/B+1foMPvi0FZPMl5fjD7ICiznUiBdLYMH1QYe6vqu4gWYytZOccLouFw==",
-      "dev": true,
-      "requires": {
-        "@babel/types": "^7.9.6"
-      }
-    },
-    "balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true
-    },
-    "bare-events": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.3.1.tgz",
-      "integrity": "sha512-sJnSOTVESURZ61XgEleqmP255T6zTYwHPwE4r6SssIh0U9/uDvfpdoJYpVUerJJZH2fueO+CdT8ZT+OC/7aZDA==",
-      "dev": true,
-      "optional": true
-    },
-    "bare-fs": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-2.3.1.tgz",
-      "integrity": "sha512-W/Hfxc/6VehXlsgFtbB5B4xFcsCl+pAh30cYhoFyXErf6oGrwjh8SwiPAdHgpmWonKuYpZgGywN0SXt7dgsADA==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "bare-events": "^2.0.0",
-        "bare-path": "^2.0.0",
-        "bare-stream": "^2.0.0"
-      }
-    },
-    "bare-os": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-2.3.0.tgz",
-      "integrity": "sha512-oPb8oMM1xZbhRQBngTgpcQ5gXw6kjOaRsSWsIeNyRxGed2w/ARyP7ScBYpWR1qfX2E5rS3gBw6OWcSQo+s+kUg==",
-      "dev": true,
-      "optional": true
-    },
-    "bare-path": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/bare-path/-/bare-path-2.1.3.tgz",
-      "integrity": "sha512-lh/eITfU8hrj9Ru5quUp0Io1kJWIk1bTjzo7JH1P5dWmQ2EL4hFUlfI8FonAhSlgIfhn63p84CDY/x+PisgcXA==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "bare-os": "^2.1.0"
-      }
-    },
-    "bare-stream": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/bare-stream/-/bare-stream-2.0.1.tgz",
-      "integrity": "sha512-ubLyoDqPnUf5o0kSFp709HC0WRZuxVuh4pbte5eY95Xvx5bdvz07c2JFmXBfqqe60q+9PJ8S4X5GRvmcNSKMxg==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "streamx": "^2.18.0"
-      }
-    },
-    "base64-js": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
-      "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
-      "dev": true
-    },
-    "basic-ftp": {
-      "version": "5.0.5",
-      "resolved": "https://registry.npmjs.org/basic-ftp/-/basic-ftp-5.0.5.tgz",
-      "integrity": "sha512-4Bcg1P8xhUuqcii/S0Z9wiHIrQVPMermM1any+MX5GeGD7faD3/msQUDGLol9wOcz4/jbg/WJnGqoJF6LiBdtg==",
-      "dev": true
-    },
-    "binary-extensions": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
-      "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
-      "dev": true
-    },
-    "bl": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz",
-      "integrity": "sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==",
-      "dev": true,
-      "requires": {
-        "buffer": "^5.5.0",
-        "inherits": "^2.0.4",
-        "readable-stream": "^3.4.0"
-      }
-    },
-    "boolbase": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
-      "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
-      "dev": true
-    },
-    "boxen": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/boxen/-/boxen-5.1.2.tgz",
-      "integrity": "sha512-9gYgQKXx+1nP8mP7CzFyaUARhg7D3n1dF/FnErWmu9l6JvGpNUN278h0aSb+QjoiKSWG+iZ3uHrcqk0qrY9RQQ==",
-      "dev": true,
-      "requires": {
-        "ansi-align": "^3.0.0",
-        "camelcase": "^6.2.0",
-        "chalk": "^4.1.0",
-        "cli-boxes": "^2.2.1",
-        "string-width": "^4.2.2",
-        "type-fest": "^0.20.2",
-        "widest-line": "^3.1.0",
-        "wrap-ansi": "^7.0.0"
-      },
-      "dependencies": {
-        "type-fest": {
-          "version": "0.20.2",
-          "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
-          "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
-          "dev": true
-        },
-        "wrap-ansi": {
-          "version": "7.0.0",
-          "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
-          "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^4.0.0",
-            "string-width": "^4.1.0",
-            "strip-ansi": "^6.0.0"
-          }
-        }
-      }
-    },
-    "brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
-      "dev": true,
-      "requires": {
-        "balanced-match": "^1.0.0",
-        "concat-map": "0.0.1"
-      }
-    },
-    "braces": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
-      "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
-      "dev": true,
-      "requires": {
-        "fill-range": "^7.0.1"
-      }
-    },
-    "browser-process-hrtime": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz",
-      "integrity": "sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow==",
-      "dev": true
-    },
-    "browser-stdout": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.1.tgz",
-      "integrity": "sha512-qhAVI1+Av2X7qelOfAIYwXONood6XlZE/fXaBSmW/T5SzLAmCgzi+eiWE7fUvbHaeNBQH13UftjpXxsfLkMpgw==",
-      "dev": true
-    },
-    "browserslist": {
-      "version": "4.22.1",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.1.tgz",
-      "integrity": "sha512-FEVc202+2iuClEhZhrWy6ZiAcRLvNMyYcxZ8raemul1DYVOVdFsbqckWLdsixQZCpJlwe77Z3UTalE7jsjnKfQ==",
-      "dev": true,
-      "requires": {
-        "caniuse-lite": "^1.0.30001541",
-        "electron-to-chromium": "^1.4.535",
-        "node-releases": "^2.0.13",
-        "update-browserslist-db": "^1.0.13"
-      }
-    },
-    "buffer": {
-      "version": "5.7.1",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
-      "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==",
-      "dev": true,
-      "requires": {
-        "base64-js": "^1.3.1",
-        "ieee754": "^1.1.13"
-      }
-    },
-    "buffer-crc32": {
-      "version": "0.2.13",
-      "resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz",
-      "integrity": "sha512-VO9Ht/+p3SN7SKWqcrgEzjGbRSJYTx+Q1pTQC0wrWqHx0vpJraQ6GtHx8tvcg1rlK1byhU5gccxgOgj7B0TDkQ==",
-      "dev": true
-    },
-    "c8": {
-      "version": "7.14.0",
-      "resolved": "https://registry.npmjs.org/c8/-/c8-7.14.0.tgz",
-      "integrity": "sha512-i04rtkkcNcCf7zsQcSv/T9EbUn4RXQ6mropeMcjFOsQXQ0iGLAr/xT6TImQg4+U9hmNpN9XdvPkjUL1IzbgxJw==",
-      "dev": true,
-      "requires": {
-        "@bcoe/v8-coverage": "^0.2.3",
-        "@istanbuljs/schema": "^0.1.3",
-        "find-up": "^5.0.0",
-        "foreground-child": "^2.0.0",
-        "istanbul-lib-coverage": "^3.2.0",
-        "istanbul-lib-report": "^3.0.0",
-        "istanbul-reports": "^3.1.4",
-        "rimraf": "^3.0.2",
-        "test-exclude": "^6.0.0",
-        "v8-to-istanbul": "^9.0.0",
-        "yargs": "^16.2.0",
-        "yargs-parser": "^20.2.9"
-      }
-    },
-    "cac": {
-      "version": "6.7.14",
-      "resolved": "https://registry.npmjs.org/cac/-/cac-6.7.14.tgz",
-      "integrity": "sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==",
-      "dev": true
-    },
-    "cachedir": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/cachedir/-/cachedir-2.3.0.tgz",
-      "integrity": "sha512-A+Fezp4zxnit6FanDmv9EqXNAi3vt9DWp51/71UEhXukb7QUuvtv9344h91dyAxuTLoSYJFU299qzR3tzwPAhw==",
-      "dev": true
-    },
-    "call-bind": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.5.tgz",
-      "integrity": "sha512-C3nQxfFZxFRVoJoGKKI8y3MOEo129NQ+FgQ08iye+Mk4zNZZGdjfs06bVTr+DBSlA66Q2VEcMki/cUCP4SercQ==",
-      "dev": true,
-      "requires": {
-        "function-bind": "^1.1.2",
-        "get-intrinsic": "^1.2.1",
-        "set-function-length": "^1.1.1"
-      }
-    },
-    "callsites": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
-      "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
-      "dev": true
-    },
-    "camelcase": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz",
-      "integrity": "sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==",
-      "dev": true
-    },
-    "caniuse-lite": {
-      "version": "1.0.30001565",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001565.tgz",
-      "integrity": "sha512-xrE//a3O7TP0vaJ8ikzkD2c2NgcVUvsEe2IvFTntV4Yd1Z9FVzh+gW+enX96L0psrbaFMcVcH2l90xNuGDWc8w==",
-      "dev": true
-    },
-    "chai": {
-      "version": "4.3.10",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-4.3.10.tgz",
-      "integrity": "sha512-0UXG04VuVbruMUYbJ6JctvH0YnC/4q3/AkT18q4NaITo91CUm0liMS9VqzT9vZhVQ/1eqPanMWjBM+Juhfb/9g==",
-      "dev": true,
-      "requires": {
-        "assertion-error": "^1.1.0",
-        "check-error": "^1.0.3",
-        "deep-eql": "^4.1.3",
-        "get-func-name": "^2.0.2",
-        "loupe": "^2.3.6",
-        "pathval": "^1.1.1",
-        "type-detect": "^4.0.8"
-      },
-      "dependencies": {
-        "check-error": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/check-error/-/check-error-1.0.3.tgz",
-          "integrity": "sha512-iKEoDYaRmd1mxM90a2OEfWhjsjPpYPuQ+lMYsoxB126+t8fw7ySEO48nmDg5COTjxDI65/Y2OWpeEHk3ZOe8zg==",
-          "dev": true,
-          "requires": {
-            "get-func-name": "^2.0.2"
-          }
-        },
-        "deep-eql": {
-          "version": "4.1.3",
-          "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-4.1.3.tgz",
-          "integrity": "sha512-WaEtAOpRA1MQ0eohqZjpGD8zdI0Ovsm8mmFhaDN8dvDZzyoUMcYDnf5Y6iu7HTXxf8JDS23qWa4a+hKCDyOPzw==",
-          "dev": true,
-          "requires": {
-            "type-detect": "^4.0.0"
-          }
-        },
-        "loupe": {
-          "version": "2.3.7",
-          "resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.7.tgz",
-          "integrity": "sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==",
-          "dev": true,
-          "requires": {
-            "get-func-name": "^2.0.1"
-          }
-        }
-      }
-    },
-    "chai-nightwatch": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/chai-nightwatch/-/chai-nightwatch-0.5.3.tgz",
-      "integrity": "sha512-38ixH/mqpY6IwnZkz6xPqx8aB5/KVR+j6VPugcir3EGOsphnWXrPH/mUt8Jp+ninL6ghY0AaJDQ10hSfCPGy/g==",
-      "dev": true,
-      "requires": {
-        "assertion-error": "1.1.0"
-      }
-    },
-    "chalk": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-      "dev": true,
-      "requires": {
-        "ansi-styles": "^4.1.0",
-        "supports-color": "^7.1.0"
-      }
-    },
-    "character-parser": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/character-parser/-/character-parser-2.2.0.tgz",
-      "integrity": "sha512-+UqJQjFEFaTAs3bNsF2j2kEN1baG/zghZbdqoYEDxGZtJo9LBzl1A+m0D4n3qKx8N2FNv8/Xp6yV9mQmBuptaw==",
-      "dev": true,
-      "requires": {
-        "is-regex": "^1.0.3"
-      }
-    },
-    "chardet": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/chardet/-/chardet-0.7.0.tgz",
-      "integrity": "sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==",
-      "dev": true
-    },
-    "check-error": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/check-error/-/check-error-1.0.2.tgz",
-      "integrity": "sha512-BrgHpW9NURQgzoNyjfq0Wu6VFO6D7IZEmJNdtgNqpzGG8RuNFHt2jQxWlAs4HMe119chBnv+34syEZtc6IhLtA==",
-      "dev": true
-    },
-    "chokidar": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
-      "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
-      "dev": true,
-      "requires": {
-        "anymatch": "~3.1.2",
-        "braces": "~3.0.2",
-        "fsevents": "~2.3.2",
-        "glob-parent": "~5.1.2",
-        "is-binary-path": "~2.1.0",
-        "is-glob": "~4.0.1",
-        "normalize-path": "~3.0.0",
-        "readdirp": "~3.6.0"
-      },
-      "dependencies": {
-        "glob-parent": {
-          "version": "5.1.2",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-          "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-          "dev": true,
-          "requires": {
-            "is-glob": "^4.0.1"
-          }
-        }
-      }
-    },
-    "chromedriver": {
-      "version": "126.0.5",
-      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-126.0.5.tgz",
-      "integrity": "sha512-xXVxwxd8CJ6yg2KEvFqLQi7V0RvF78xFnLB+xo9g9MoJNHMQccD7b4OWaxtKDy5RXrMgQ6Jb6vUN3SjTYXHLEQ==",
-      "dev": true,
-      "requires": {
-        "@testim/chrome-version": "^1.1.4",
-        "axios": "^1.6.7",
-        "compare-versions": "^6.1.0",
-        "extract-zip": "^2.0.1",
-        "proxy-agent": "^6.4.0",
-        "proxy-from-env": "^1.1.0",
-        "tcp-port-used": "^1.0.2"
-      }
-    },
-    "chromium-bidi": {
-      "version": "0.5.19",
-      "resolved": "https://registry.npmjs.org/chromium-bidi/-/chromium-bidi-0.5.19.tgz",
-      "integrity": "sha512-UA6zL77b7RYCjJkZBsZ0wlvCTD+jTjllZ8f6wdO4buevXgTZYjV+XLB9CiEa2OuuTGGTLnI7eN9I60YxuALGQg==",
-      "dev": true,
-      "requires": {
-        "mitt": "3.0.1",
-        "urlpattern-polyfill": "10.0.0",
-        "zod": "3.22.4"
-      }
-    },
-    "ci-info": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz",
-      "integrity": "sha512-5tK7EtrZ0N+OLFMthtqOj4fI2Jeb88C4CAZPu25LDVUgXJ0A3Js4PMGqrn0JU1W0Mh1/Z8wZzYPxqUrXeBboCQ==",
-      "dev": true
-    },
-    "cli-boxes": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-2.2.1.tgz",
-      "integrity": "sha512-y4coMcylgSCdVinjiDBuR8PCC2bLjyGTwEmPb9NHR/QaNU6EUOXcTY/s6VjGMD6ENSEaeQYHCY0GNGS5jfMwPw==",
-      "dev": true
-    },
-    "cli-cursor": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-3.1.0.tgz",
-      "integrity": "sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==",
-      "dev": true,
-      "requires": {
-        "restore-cursor": "^3.1.0"
-      }
-    },
-    "cli-spinners": {
-      "version": "2.9.2",
-      "resolved": "https://registry.npmjs.org/cli-spinners/-/cli-spinners-2.9.2.tgz",
-      "integrity": "sha512-ywqV+5MmyL4E7ybXgKys4DugZbX0FC6LnwrhjuykIjnK9k8OQacQ7axGKnjDXWNhns0xot3bZI5h55H8yo9cJg==",
-      "dev": true
-    },
-    "cli-table3": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/cli-table3/-/cli-table3-0.6.3.tgz",
-      "integrity": "sha512-w5Jac5SykAeZJKntOxJCrm63Eg5/4dhMWIcuTbo9rpE+brgaSZo0RuNJZeOyMgsUdhDeojvgyQLmjI+K50ZGyg==",
-      "dev": true,
-      "requires": {
-        "@colors/colors": "1.5.0",
-        "string-width": "^4.2.0"
-      }
-    },
-    "cli-width": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-3.0.0.tgz",
-      "integrity": "sha512-FxqpkPPwu1HjuN93Omfm4h8uIanXofW0RxVEW3k5RKx+mJJYSthzNhp32Kzxxy3YAEZ/Dc/EWN1vZRY0+kOhbw==",
-      "dev": true
-    },
-    "cliui": {
-      "version": "7.0.4",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
-      "integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
-      "dev": true,
-      "requires": {
-        "string-width": "^4.2.0",
-        "strip-ansi": "^6.0.0",
-        "wrap-ansi": "^7.0.0"
-      },
-      "dependencies": {
-        "wrap-ansi": {
-          "version": "7.0.0",
-          "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
-          "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^4.0.0",
-            "string-width": "^4.1.0",
-            "strip-ansi": "^6.0.0"
-          }
-        }
-      }
-    },
-    "clone": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.4.tgz",
-      "integrity": "sha512-JQHZ2QMW6l3aH/j6xCqQThY/9OH4D/9ls34cgkUBiEeocRTU04tHfKPBsUK1PqZCUQM7GiA0IIXJSuXHI64Kbg==",
-      "dev": true
-    },
-    "color-convert": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-      "dev": true,
-      "requires": {
-        "color-name": "~1.1.4"
-      }
-    },
-    "color-name": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "dev": true
-    },
-    "colord": {
-      "version": "2.9.3",
-      "resolved": "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz",
-      "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==",
-      "dev": true
-    },
-    "colors": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.2.5.tgz",
-      "integrity": "sha512-erNRLao/Y3Fv54qUa0LBB+//Uf3YwMUmdJinN20yMXm9zdKKqH9wt7R9IIVZ+K7ShzfpLV/Zg8+VyrBJYB4lpg==",
-      "dev": true
-    },
-    "combined-stream": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
-      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
-      "dev": true,
-      "requires": {
-        "delayed-stream": "~1.0.0"
-      }
-    },
-    "commander": {
-      "version": "2.20.3",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
-      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
-      "dev": true
-    },
-    "commitizen": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/commitizen/-/commitizen-4.3.0.tgz",
-      "integrity": "sha512-H0iNtClNEhT0fotHvGV3E9tDejDeS04sN1veIebsKYGMuGscFaswRoYJKmT3eW85eIJAs0F28bG2+a/9wCOfPw==",
-      "dev": true,
-      "requires": {
-        "cachedir": "2.3.0",
-        "cz-conventional-changelog": "3.3.0",
-        "dedent": "0.7.0",
-        "detect-indent": "6.1.0",
-        "find-node-modules": "^2.1.2",
-        "find-root": "1.1.0",
-        "fs-extra": "9.1.0",
-        "glob": "7.2.3",
-        "inquirer": "8.2.5",
-        "is-utf8": "^0.2.1",
-        "lodash": "4.17.21",
-        "minimist": "1.2.7",
-        "strip-bom": "4.0.0",
-        "strip-json-comments": "3.1.1"
-      },
-      "dependencies": {
-        "fs-extra": {
-          "version": "9.1.0",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz",
-          "integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==",
-          "dev": true,
-          "requires": {
-            "at-least-node": "^1.0.0",
-            "graceful-fs": "^4.2.0",
-            "jsonfile": "^6.0.1",
-            "universalify": "^2.0.0"
-          }
-        },
-        "inquirer": {
-          "version": "8.2.5",
-          "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-8.2.5.tgz",
-          "integrity": "sha512-QAgPDQMEgrDssk1XiwwHoOGYF9BAbUcc1+j+FhEvaOt8/cKRqyLn0U5qA6F74fGhTMGxf92pOvPBeh29jQJDTQ==",
-          "dev": true,
-          "requires": {
-            "ansi-escapes": "^4.2.1",
-            "chalk": "^4.1.1",
-            "cli-cursor": "^3.1.0",
-            "cli-width": "^3.0.0",
-            "external-editor": "^3.0.3",
-            "figures": "^3.0.0",
-            "lodash": "^4.17.21",
-            "mute-stream": "0.0.8",
-            "ora": "^5.4.1",
-            "run-async": "^2.4.0",
-            "rxjs": "^7.5.5",
-            "string-width": "^4.1.0",
-            "strip-ansi": "^6.0.0",
-            "through": "^2.3.6",
-            "wrap-ansi": "^7.0.0"
-          }
-        },
-        "wrap-ansi": {
-          "version": "7.0.0",
-          "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
-          "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^4.0.0",
-            "string-width": "^4.1.0",
-            "strip-ansi": "^6.0.0"
-          }
-        }
-      }
-    },
-    "compare-versions": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-6.1.0.tgz",
-      "integrity": "sha512-LNZQXhqUvqUTotpZ00qLSaify3b4VFD588aRr8MKFw4CMUr98ytzCW5wDH5qx/DEY5kCDXcbcRuCqL0szEf2tg==",
-      "dev": true
-    },
-    "compress-commons": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/compress-commons/-/compress-commons-4.1.2.tgz",
-      "integrity": "sha512-D3uMHtGc/fcO1Gt1/L7i1e33VOvD4A9hfQLP+6ewd+BvG/gQ84Yh4oftEhAdjSMgBgwGL+jsppT7JYNpo6MHHg==",
-      "dev": true,
-      "requires": {
-        "buffer-crc32": "^0.2.13",
-        "crc32-stream": "^4.0.2",
-        "normalize-path": "^3.0.0",
-        "readable-stream": "^3.6.0"
-      }
-    },
-    "computeds": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/computeds/-/computeds-0.0.1.tgz",
-      "integrity": "sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q==",
-      "dev": true
-    },
-    "concat": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/concat/-/concat-1.0.3.tgz",
-      "integrity": "sha512-f/ZaH1aLe64qHgTILdldbvyfGiGF4uzeo9IuXUloIOLQzFmIPloy9QbZadNsuVv0j5qbKQvQb/H/UYf2UsKTpw==",
-      "dev": true,
-      "requires": {
-        "commander": "^2.9.0"
-      }
-    },
-    "concat-map": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
-      "dev": true
-    },
-    "config-chain": {
-      "version": "1.1.13",
-      "resolved": "https://registry.npmjs.org/config-chain/-/config-chain-1.1.13.tgz",
-      "integrity": "sha512-qj+f8APARXHrM0hraqXYb2/bOVSV4PvJQlNZ/DVj0QrmNM2q2euizkeuVckQ57J+W0mRH6Hvi+k50M4Jul2VRQ==",
-      "dev": true,
-      "requires": {
-        "ini": "^1.3.4",
-        "proto-list": "~1.2.1"
-      }
-    },
-    "constantinople": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/constantinople/-/constantinople-4.0.1.tgz",
-      "integrity": "sha512-vCrqcSIq4//Gx74TXXCGnHpulY1dskqLTFGDmhrGxzeXL8lF8kvXv6mpNWlJj1uD4DW23D4ljAqbY4RRaaUZIw==",
-      "dev": true,
-      "requires": {
-        "@babel/parser": "^7.6.0",
-        "@babel/types": "^7.6.1"
-      }
-    },
-    "conventional-commit-types": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/conventional-commit-types/-/conventional-commit-types-3.0.0.tgz",
-      "integrity": "sha512-SmmCYnOniSsAa9GqWOeLqc179lfr5TRu5b4QFDkbsrJ5TZjPJx85wtOr3zn+1dbeNiXDKGPbZ72IKbPhLXh/Lg==",
-      "dev": true
-    },
-    "convert-source-map": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
-      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
-      "dev": true
-    },
-    "core-js": {
-      "version": "3.33.3",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.33.3.tgz",
-      "integrity": "sha512-lo0kOocUlLKmm6kv/FswQL8zbkH7mVsLJ/FULClOhv8WRVmKLVcs6XPNQAzstfeJTCHMyButEwG+z1kHxHoDZw==",
-      "peer": true
-    },
-    "core-js-compat": {
-      "version": "3.33.3",
-      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.33.3.tgz",
-      "integrity": "sha512-cNzGqFsh3Ot+529GIXacjTJ7kegdt5fPXxCBVS1G0iaZpuo/tBz399ymceLJveQhFFZ8qThHiP3fzuoQjKN2ow==",
-      "dev": true,
-      "requires": {
-        "browserslist": "^4.22.1"
-      }
-    },
-    "core-util-is": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
-      "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==",
-      "dev": true
-    },
-    "cosmiconfig": {
-      "version": "8.3.6",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.3.6.tgz",
-      "integrity": "sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "import-fresh": "^3.3.0",
-        "js-yaml": "^4.1.0",
-        "parse-json": "^5.2.0",
-        "path-type": "^4.0.0"
-      }
-    },
-    "cosmiconfig-typescript-loader": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/cosmiconfig-typescript-loader/-/cosmiconfig-typescript-loader-5.0.0.tgz",
-      "integrity": "sha512-+8cK7jRAReYkMwMiG+bxhcNKiHJDM6bR9FD/nGBXOWdMLuYawjF5cGrtLilJ+LGd3ZjCXnJjR5DkfWPoIVlqJA==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "jiti": "^1.19.1"
-      }
-    },
-    "crc-32": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz",
-      "integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ==",
-      "dev": true
-    },
-    "crc32-stream": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/crc32-stream/-/crc32-stream-4.0.3.tgz",
-      "integrity": "sha512-NT7w2JVU7DFroFdYkeq8cywxrgjPHWkdX1wjpRQXPX5Asews3tA+Ght6lddQO5Mkumffp3X7GEqku3epj2toIw==",
-      "dev": true,
-      "requires": {
-        "crc-32": "^1.2.0",
-        "readable-stream": "^3.4.0"
-      }
-    },
-    "create-require": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz",
-      "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==",
-      "dev": true
-    },
-    "cross-env": {
-      "version": "7.0.3",
-      "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.3.tgz",
-      "integrity": "sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==",
-      "dev": true,
-      "requires": {
-        "cross-spawn": "^7.0.1"
-      }
-    },
-    "cross-spawn": {
-      "version": "7.0.3",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
-      "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
-      "dev": true,
-      "requires": {
-        "path-key": "^3.1.0",
-        "shebang-command": "^2.0.0",
-        "which": "^2.0.1"
-      }
-    },
-    "css-functions-list": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/css-functions-list/-/css-functions-list-3.2.1.tgz",
-      "integrity": "sha512-Nj5YcaGgBtuUmn1D7oHqPW0c9iui7xsTsj5lIX8ZgevdfhmjFfKB3r8moHJtNJnctnYXJyYX5I1pp90HM4TPgQ==",
-      "dev": true
-    },
-    "css-tree": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz",
-      "integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==",
-      "dev": true,
-      "requires": {
-        "mdn-data": "2.0.30",
-        "source-map-js": "^1.0.1"
-      }
-    },
-    "cssesc": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
-      "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
-      "dev": true
-    },
-    "cssom": {
-      "version": "0.4.4",
-      "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.4.4.tgz",
-      "integrity": "sha512-p3pvU7r1MyyqbTk+WbNJIgJjG2VmTIaB10rI93LzVPrmDJKkzKYMtxxyAvQXR/NS6otuzveI7+7BBq3SjBS2mw==",
-      "dev": true
-    },
-    "cssstyle": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-2.3.0.tgz",
-      "integrity": "sha512-AZL67abkUzIuvcHqk7c09cezpGNcxUxU4Ioi/05xHk4DQeTkWmGYftIE6ctU6AEt+Gn4n1lDStOtj7FKycP71A==",
-      "dev": true,
-      "requires": {
-        "cssom": "~0.3.6"
-      },
-      "dependencies": {
-        "cssom": {
-          "version": "0.3.8",
-          "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.8.tgz",
-          "integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==",
-          "dev": true
-        }
-      }
-    },
-    "csstype": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
-      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
-    },
-    "cz-conventional-changelog": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/cz-conventional-changelog/-/cz-conventional-changelog-3.3.0.tgz",
-      "integrity": "sha512-U466fIzU5U22eES5lTNiNbZ+d8dfcHcssH4o7QsdWaCcRs/feIPCxKYSWkYBNs5mny7MvEfwpTLWjvbm94hecw==",
-      "dev": true,
-      "requires": {
-        "@commitlint/load": ">6.1.1",
-        "chalk": "^2.4.1",
-        "commitizen": "^4.0.3",
-        "conventional-commit-types": "^3.0.0",
-        "lodash.map": "^4.5.1",
-        "longest": "^2.0.1",
-        "word-wrap": "^1.0.3"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
-          "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-          "dev": true,
-          "requires": {
-            "color-convert": "^1.9.0"
-          }
-        },
-        "chalk": {
-          "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-          "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^3.2.1",
-            "escape-string-regexp": "^1.0.5",
-            "supports-color": "^5.3.0"
-          }
-        },
-        "color-convert": {
-          "version": "1.9.3",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
-          "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-          "dev": true,
-          "requires": {
-            "color-name": "1.1.3"
-          }
-        },
-        "color-name": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-          "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
-          "dev": true
-        },
-        "escape-string-regexp": {
-          "version": "1.0.5",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-          "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
-          "dev": true
-        },
-        "has-flag": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-          "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
-          "dev": true
-        },
-        "supports-color": {
-          "version": "5.5.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
-          "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-          "dev": true,
-          "requires": {
-            "has-flag": "^3.0.0"
-          }
-        }
-      }
-    },
-    "data-uri-to-buffer": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-6.0.2.tgz",
-      "integrity": "sha512-7hvf7/GW8e86rW0ptuwS3OcBGDjIi6SZva7hCyWC0yYry2cOPmLIjXAUHI6DK2HsnwJd9ifmt57i8eV2n4YNpw==",
-      "dev": true
-    },
-    "data-urls": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-2.0.0.tgz",
-      "integrity": "sha512-X5eWTSXO/BJmpdIKCRuKUgSCgAN0OwliVK3yPKbwIWU1Tdw5BRajxlzMidvh+gwko9AfQ9zIj52pzF91Q3YAvQ==",
-      "dev": true,
-      "requires": {
-        "abab": "^2.0.3",
-        "whatwg-mimetype": "^2.3.0",
-        "whatwg-url": "^8.0.0"
-      }
-    },
-    "de-indent": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
-      "integrity": "sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==",
-      "dev": true
-    },
-    "debug": {
-      "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
-      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
-      "dev": true,
-      "requires": {
-        "ms": "2.1.2"
-      }
-    },
-    "decimal.js": {
-      "version": "10.4.3",
-      "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.4.3.tgz",
-      "integrity": "sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==",
-      "dev": true
-    },
-    "dedent": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/dedent/-/dedent-0.7.0.tgz",
-      "integrity": "sha512-Q6fKUPqnAHAyhiUgFU7BUzLiv0kd8saH9al7tnu5Q/okj6dnupxyTgFIBjVzJATdfIAm9NAsvXNzjaKa+bxVyA==",
-      "dev": true
-    },
-    "deep-eql": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-4.0.1.tgz",
-      "integrity": "sha512-D/Oxqobjr+kxaHsgiQBZq9b6iAWdEj5W/JdJm8deNduAPc9CwXQ3BJJCuEqlrPXcy45iOMkGPZ0T81Dnz7UDCA==",
-      "dev": true,
-      "requires": {
-        "type-detect": "^4.0.0"
-      }
-    },
-    "deep-equal": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-2.2.3.tgz",
-      "integrity": "sha512-ZIwpnevOurS8bpT4192sqAowWM76JDKSHYzMLty3BZGSswgq6pBaH3DhCSW5xVAZICZyKdOBPjwww5wfgT/6PA==",
-      "dev": true,
-      "requires": {
-        "array-buffer-byte-length": "^1.0.0",
-        "call-bind": "^1.0.5",
-        "es-get-iterator": "^1.1.3",
-        "get-intrinsic": "^1.2.2",
-        "is-arguments": "^1.1.1",
-        "is-array-buffer": "^3.0.2",
-        "is-date-object": "^1.0.5",
-        "is-regex": "^1.1.4",
-        "is-shared-array-buffer": "^1.0.2",
-        "isarray": "^2.0.5",
-        "object-is": "^1.1.5",
-        "object-keys": "^1.1.1",
-        "object.assign": "^4.1.4",
-        "regexp.prototype.flags": "^1.5.1",
-        "side-channel": "^1.0.4",
-        "which-boxed-primitive": "^1.0.2",
-        "which-collection": "^1.0.1",
-        "which-typed-array": "^1.1.13"
-      }
-    },
-    "deep-is": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
-      "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
-      "dev": true
-    },
-    "defaults": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.4.tgz",
-      "integrity": "sha512-eFuaLoy/Rxalv2kr+lqMlUnrDWV+3j4pljOIJgLIhI058IQfWJ7vXhyEIHu+HtC738klGALYxOKDO0bQP3tg8A==",
-      "dev": true,
-      "requires": {
-        "clone": "^1.0.2"
-      }
-    },
-    "define-data-property": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.1.tgz",
-      "integrity": "sha512-E7uGkTzkk1d0ByLeSc6ZsFS79Axg+m1P/VsgYsxHgiuc3tFSj+MjMIwe90FC4lOAZzNBdY7kkO2P2wKdsQ1vgQ==",
-      "dev": true,
-      "requires": {
-        "get-intrinsic": "^1.2.1",
-        "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0"
-      }
-    },
-    "define-lazy-prop": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz",
-      "integrity": "sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og==",
-      "dev": true
-    },
-    "define-properties": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz",
-      "integrity": "sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==",
-      "dev": true,
-      "requires": {
-        "define-data-property": "^1.0.1",
-        "has-property-descriptors": "^1.0.0",
-        "object-keys": "^1.1.1"
-      }
-    },
-    "degenerator": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/degenerator/-/degenerator-5.0.1.tgz",
-      "integrity": "sha512-TllpMR/t0M5sqCXfj85i4XaAzxmS5tVA16dqvdkMwGmzI+dXLXnw3J+3Vdv7VKw+ThlTMboK6i9rnZ6Nntj5CQ==",
-      "dev": true,
-      "requires": {
-        "ast-types": "^0.13.4",
-        "escodegen": "^2.1.0",
-        "esprima": "^4.0.1"
-      },
-      "dependencies": {
-        "ast-types": {
-          "version": "0.13.4",
-          "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.13.4.tgz",
-          "integrity": "sha512-x1FCFnFifvYDDzTaLII71vG5uvDwgtmDTEVWAxrgeiR8VjMONcCXJx7E+USjDtHlwFmt9MysbqgF9b9Vjr6w+w==",
-          "dev": true,
-          "requires": {
-            "tslib": "^2.0.1"
-          }
-        }
-      }
-    },
-    "delayed-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
-      "dev": true
-    },
-    "detect-file": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-1.0.0.tgz",
-      "integrity": "sha512-DtCOLG98P007x7wiiOmfI0fi3eIKyWiLTGJ2MDnVi/E04lWGbf+JzrRHMm0rgIIZJGtHpKpbVgLWHrv8xXpc3Q==",
-      "dev": true
-    },
-    "detect-indent": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-6.1.0.tgz",
-      "integrity": "sha512-reYkTUJAZb9gUuZ2RvVCNhVHdg62RHnJ7WJl8ftMi4diZ6NWlciOzQN88pUhSELEwflJht4oQDv0F0BMlwaYtA==",
-      "dev": true
-    },
-    "devtools-protocol": {
-      "version": "0.0.1140464",
-      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1140464.tgz",
-      "integrity": "sha512-I1jXnjpQh/6TBFyQ0A9dB2kXXk6DprpPFZoI8pUsxHtlNuOTQEdv9fUqYBsFtf8tOJCbdsZZyQrWeXu6GfK+Bw==",
-      "dev": true
-    },
-    "didyoumean": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz",
-      "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==",
-      "dev": true
-    },
-    "diff": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-5.0.0.tgz",
-      "integrity": "sha512-/VTCrvm5Z0JGty/BWHljh+BAiw3IK+2j87NGMu8Nwc/f48WoDAC395uomO9ZD117ZOBaHmkX1oyLvkVM/aIT3w==",
-      "dev": true
-    },
-    "diff-sequences": {
-      "version": "29.6.3",
-      "resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-29.6.3.tgz",
-      "integrity": "sha512-EjePK1srD3P08o2j4f0ExnylqRs5B9tJjcp9t1krH2qRi8CCdsYfwe9JgSLurFBWwq4uOlipzfk5fHNvwFKr8Q==",
-      "dev": true
-    },
-    "dir-glob": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz",
-      "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==",
-      "dev": true,
-      "requires": {
-        "path-type": "^4.0.0"
-      }
-    },
-    "doctrine": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-3.0.0.tgz",
-      "integrity": "sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==",
-      "dev": true,
-      "requires": {
-        "esutils": "^2.0.2"
-      }
-    },
-    "doctypes": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/doctypes/-/doctypes-1.1.0.tgz",
-      "integrity": "sha512-LLBi6pEqS6Do3EKQ3J0NqHWV5hhb78Pi8vvESYwyOy2c31ZEZVdtitdzsQsKb7878PEERhzUk0ftqGhG6Mz+pQ==",
-      "dev": true
-    },
-    "domexception": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/domexception/-/domexception-2.0.1.tgz",
-      "integrity": "sha512-yxJ2mFy/sibVQlu5qHjOkf9J3K6zgmCxgJ94u2EdvDOV09H+32LtRswEcUsmUWN72pVLOEnTSRaIVVzVQgS0dg==",
-      "dev": true,
-      "requires": {
-        "webidl-conversions": "^5.0.0"
-      },
-      "dependencies": {
-        "webidl-conversions": {
-          "version": "5.0.0",
-          "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-5.0.0.tgz",
-          "integrity": "sha512-VlZwKPCkYKxQgeSbH5EyngOmRp7Ww7I9rQLERETtf5ofd9pGeswWiOtogpEO850jziPRarreGxn5QIiTqpb2wA==",
-          "dev": true
-        }
-      }
-    },
-    "dotenv": {
-      "version": "16.3.1",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.3.1.tgz",
-      "integrity": "sha512-IPzF4w4/Rd94bA9imS68tZBaYyBWSCE47V1RGuMrB94iyTOIEwRmVL2x/4An+6mETpLrKJ5hQkB8W4kFAadeIQ==",
-      "dev": true
-    },
-    "eastasianwidth": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
-      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
-      "dev": true
-    },
-    "editorconfig": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/editorconfig/-/editorconfig-1.0.4.tgz",
-      "integrity": "sha512-L9Qe08KWTlqYMVvMcTIvMAdl1cDUubzRNYL+WfA4bLDMHe4nemKkpmYzkznE1FwLKu0EEmy6obgQKzMJrg4x9Q==",
-      "dev": true,
-      "requires": {
-        "@one-ini/wasm": "0.1.1",
-        "commander": "^10.0.0",
-        "minimatch": "9.0.1",
-        "semver": "^7.5.3"
-      },
-      "dependencies": {
-        "brace-expansion": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-          "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-          "dev": true,
-          "requires": {
-            "balanced-match": "^1.0.0"
-          }
-        },
-        "commander": {
-          "version": "10.0.1",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-10.0.1.tgz",
-          "integrity": "sha512-y4Mg2tXshplEbSGzx7amzPwKKOCGuoSRP/CjEdwwk0FOGlUbq6lKuoyDZTNZkmxHdJtp54hdfY/JUrdL7Xfdug==",
-          "dev": true
-        },
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "minimatch": {
-          "version": "9.0.1",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.1.tgz",
-          "integrity": "sha512-0jWhJpD/MdhPXwPuiRkCbfYfSKp2qnn2eOc279qI7f+osl/l+prKSrvhg157zSYvx/1nmgn2NqdT6k2Z7zSH9w==",
-          "dev": true,
-          "requires": {
-            "brace-expansion": "^2.0.1"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "ejs": {
-      "version": "3.1.8",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.8.tgz",
-      "integrity": "sha512-/sXZeMlhS0ArkfX2Aw780gJzXSMPnKjtspYZv+f3NiKLlubezAHDU5+9xz6gd3/NhG3txQCo6xlglmTS+oTGEQ==",
-      "dev": true,
-      "requires": {
-        "jake": "^10.8.5"
-      }
-    },
-    "electron-to-chromium": {
-      "version": "1.4.601",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.601.tgz",
-      "integrity": "sha512-SpwUMDWe9tQu8JX5QCO1+p/hChAi9AE9UpoC3rcHVc+gdCGlbT3SGb5I1klgb952HRIyvt9wZhSz9bNBYz9swA==",
-      "dev": true
-    },
-    "emoji-regex": {
-      "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
-      "dev": true
-    },
-    "end-of-stream": {
-      "version": "1.4.4",
-      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
-      "integrity": "sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==",
-      "dev": true,
-      "requires": {
-        "once": "^1.4.0"
-      }
-    },
-    "entities": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
-      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
-      "dev": true
-    },
-    "env-paths": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/env-paths/-/env-paths-2.2.1.tgz",
-      "integrity": "sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==",
-      "dev": true
-    },
-    "envinfo": {
-      "version": "7.11.0",
-      "resolved": "https://registry.npmjs.org/envinfo/-/envinfo-7.11.0.tgz",
-      "integrity": "sha512-G9/6xF1FPbIw0TtalAMaVPpiq2aDEuKLXM314jPVAO9r2fo2a4BLqMNkmRS7O/xPPZ+COAhGIz3ETvHEV3eUcg==",
-      "dev": true
-    },
-    "error-ex": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
-      "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==",
-      "dev": true,
-      "requires": {
-        "is-arrayish": "^0.2.1"
-      }
-    },
-    "es-abstract": {
-      "version": "1.22.3",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.22.3.tgz",
-      "integrity": "sha512-eiiY8HQeYfYH2Con2berK+To6GrK2RxbPawDkGq4UiCQQfZHb6wX9qQqkbpPqaxQFcl8d9QzZqo0tGE0VcrdwA==",
-      "dev": true,
-      "requires": {
-        "array-buffer-byte-length": "^1.0.0",
-        "arraybuffer.prototype.slice": "^1.0.2",
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.5",
-        "es-set-tostringtag": "^2.0.1",
-        "es-to-primitive": "^1.2.1",
-        "function.prototype.name": "^1.1.6",
-        "get-intrinsic": "^1.2.2",
-        "get-symbol-description": "^1.0.0",
-        "globalthis": "^1.0.3",
-        "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0",
-        "has-proto": "^1.0.1",
-        "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0",
-        "internal-slot": "^1.0.5",
-        "is-array-buffer": "^3.0.2",
-        "is-callable": "^1.2.7",
-        "is-negative-zero": "^2.0.2",
-        "is-regex": "^1.1.4",
-        "is-shared-array-buffer": "^1.0.2",
-        "is-string": "^1.0.7",
-        "is-typed-array": "^1.1.12",
-        "is-weakref": "^1.0.2",
-        "object-inspect": "^1.13.1",
-        "object-keys": "^1.1.1",
-        "object.assign": "^4.1.4",
-        "regexp.prototype.flags": "^1.5.1",
-        "safe-array-concat": "^1.0.1",
-        "safe-regex-test": "^1.0.0",
-        "string.prototype.trim": "^1.2.8",
-        "string.prototype.trimend": "^1.0.7",
-        "string.prototype.trimstart": "^1.0.7",
-        "typed-array-buffer": "^1.0.0",
-        "typed-array-byte-length": "^1.0.0",
-        "typed-array-byte-offset": "^1.0.0",
-        "typed-array-length": "^1.0.4",
-        "unbox-primitive": "^1.0.2",
-        "which-typed-array": "^1.1.13"
-      }
-    },
-    "es-get-iterator": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/es-get-iterator/-/es-get-iterator-1.1.3.tgz",
-      "integrity": "sha512-sPZmqHBe6JIiTfN5q2pEi//TwxmAFHwj/XEuYjTuse78i8KxaqMTTzxPoFKuzRpDpTJ+0NAbpfenkmH2rePtuw==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.3",
-        "has-symbols": "^1.0.3",
-        "is-arguments": "^1.1.1",
-        "is-map": "^2.0.2",
-        "is-set": "^2.0.2",
-        "is-string": "^1.0.7",
-        "isarray": "^2.0.5",
-        "stop-iteration-iterator": "^1.0.0"
-      }
-    },
-    "es-set-tostringtag": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.2.tgz",
-      "integrity": "sha512-BuDyupZt65P9D2D2vA/zqcI3G5xRsklm5N3xCwuiy+/vKy8i0ifdsQP1sLgO4tZDSCaQUSnmC48khknGMV3D2Q==",
-      "dev": true,
-      "requires": {
-        "get-intrinsic": "^1.2.2",
-        "has-tostringtag": "^1.0.0",
-        "hasown": "^2.0.0"
-      }
-    },
-    "es-shim-unscopables": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.0.2.tgz",
-      "integrity": "sha512-J3yBRXCzDu4ULnQwxyToo/OjdMx6akgVC7K6few0a7F/0wLtmKKN7I73AH5T2836UuXRqN7Qg+IIUw/+YJksRw==",
-      "dev": true,
-      "requires": {
-        "hasown": "^2.0.0"
-      }
-    },
-    "es-to-primitive": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz",
-      "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==",
-      "dev": true,
-      "requires": {
-        "is-callable": "^1.1.4",
-        "is-date-object": "^1.0.1",
-        "is-symbol": "^1.0.2"
-      }
-    },
-    "esbuild": {
-      "version": "0.19.11",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.19.11.tgz",
-      "integrity": "sha512-HJ96Hev2hX/6i5cDVwcqiJBBtuo9+FeIJOtZ9W1kA5M6AMJRHUZlpYZ1/SbEwtO0ioNAW8rUooVpC/WehY2SfA==",
-      "dev": true,
-      "requires": {
-        "@esbuild/aix-ppc64": "0.19.11",
-        "@esbuild/android-arm": "0.19.11",
-        "@esbuild/android-arm64": "0.19.11",
-        "@esbuild/android-x64": "0.19.11",
-        "@esbuild/darwin-arm64": "0.19.11",
-        "@esbuild/darwin-x64": "0.19.11",
-        "@esbuild/freebsd-arm64": "0.19.11",
-        "@esbuild/freebsd-x64": "0.19.11",
-        "@esbuild/linux-arm": "0.19.11",
-        "@esbuild/linux-arm64": "0.19.11",
-        "@esbuild/linux-ia32": "0.19.11",
-        "@esbuild/linux-loong64": "0.19.11",
-        "@esbuild/linux-mips64el": "0.19.11",
-        "@esbuild/linux-ppc64": "0.19.11",
-        "@esbuild/linux-riscv64": "0.19.11",
-        "@esbuild/linux-s390x": "0.19.11",
-        "@esbuild/linux-x64": "0.19.11",
-        "@esbuild/netbsd-x64": "0.19.11",
-        "@esbuild/openbsd-x64": "0.19.11",
-        "@esbuild/sunos-x64": "0.19.11",
-        "@esbuild/win32-arm64": "0.19.11",
-        "@esbuild/win32-ia32": "0.19.11",
-        "@esbuild/win32-x64": "0.19.11"
-      }
-    },
-    "escalade": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
-      "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
-      "dev": true
-    },
-    "escape-string-regexp": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
-      "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==",
-      "dev": true
-    },
-    "escodegen": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-2.1.0.tgz",
-      "integrity": "sha512-2NlIDTwUWJN0mRPQOdtQBzbUHvdGY2P1VXSyU83Q3xKxM7WHX2Ql8dKq782Q9TgQUNOLEzEYu9bzLNj1q88I5w==",
-      "dev": true,
-      "requires": {
-        "esprima": "^4.0.1",
-        "estraverse": "^5.2.0",
-        "esutils": "^2.0.2",
-        "source-map": "~0.6.1"
-      },
-      "dependencies": {
-        "estraverse": {
-          "version": "5.3.0",
-          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
-          "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
-          "dev": true
-        }
-      }
-    },
-    "eslint": {
-      "version": "8.55.0",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.55.0.tgz",
-      "integrity": "sha512-iyUUAM0PCKj5QpwGfmCAG9XXbZCWsqP/eWAWrG/W0umvjuLRBECwSFdt+rCntju0xEH7teIABPwXpahftIaTdA==",
-      "dev": true,
-      "requires": {
-        "@eslint-community/eslint-utils": "^4.2.0",
-        "@eslint-community/regexpp": "^4.6.1",
-        "@eslint/eslintrc": "^2.1.4",
-        "@eslint/js": "8.55.0",
-        "@humanwhocodes/config-array": "^0.11.13",
-        "@humanwhocodes/module-importer": "^1.0.1",
-        "@nodelib/fs.walk": "^1.2.8",
-        "@ungap/structured-clone": "^1.2.0",
-        "ajv": "^6.12.4",
-        "chalk": "^4.0.0",
-        "cross-spawn": "^7.0.2",
-        "debug": "^4.3.2",
-        "doctrine": "^3.0.0",
-        "escape-string-regexp": "^4.0.0",
-        "eslint-scope": "^7.2.2",
-        "eslint-visitor-keys": "^3.4.3",
-        "espree": "^9.6.1",
-        "esquery": "^1.4.2",
-        "esutils": "^2.0.2",
-        "fast-deep-equal": "^3.1.3",
-        "file-entry-cache": "^6.0.1",
-        "find-up": "^5.0.0",
-        "glob-parent": "^6.0.2",
-        "globals": "^13.19.0",
-        "graphemer": "^1.4.0",
-        "ignore": "^5.2.0",
-        "imurmurhash": "^0.1.4",
-        "is-glob": "^4.0.0",
-        "is-path-inside": "^3.0.3",
-        "js-yaml": "^4.1.0",
-        "json-stable-stringify-without-jsonify": "^1.0.1",
-        "levn": "^0.4.1",
-        "lodash.merge": "^4.6.2",
-        "minimatch": "^3.1.2",
-        "natural-compare": "^1.4.0",
-        "optionator": "^0.9.3",
-        "strip-ansi": "^6.0.1",
-        "text-table": "^0.2.0"
-      },
-      "dependencies": {
-        "ajv": {
-          "version": "6.12.6",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
-          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
-          "dev": true,
-          "requires": {
-            "fast-deep-equal": "^3.1.1",
-            "fast-json-stable-stringify": "^2.0.0",
-            "json-schema-traverse": "^0.4.1",
-            "uri-js": "^4.2.2"
-          }
-        },
-        "eslint-scope": {
-          "version": "7.2.2",
-          "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
-          "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
-          "dev": true,
-          "requires": {
-            "esrecurse": "^4.3.0",
-            "estraverse": "^5.2.0"
-          }
-        },
-        "estraverse": {
-          "version": "5.3.0",
-          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
-          "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
-          "dev": true
-        },
-        "globals": {
-          "version": "13.23.0",
-          "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-          "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
-          "dev": true,
-          "requires": {
-            "type-fest": "^0.20.2"
-          }
-        },
-        "json-schema-traverse": {
-          "version": "0.4.1",
-          "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
-          "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
-          "dev": true
-        },
-        "type-fest": {
-          "version": "0.20.2",
-          "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
-          "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
-          "dev": true
-        }
-      }
-    },
-    "eslint-config-prettier": {
-      "version": "8.10.0",
-      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.10.0.tgz",
-      "integrity": "sha512-SM8AMJdeQqRYT9O9zguiruQZaN7+z+E4eAP9oiLNGKMtomwaB1E9dcgUD6ZAn/eQAb52USbvezbiljfZUhbJcg==",
-      "dev": true,
-      "requires": {}
-    },
-    "eslint-import-resolver-alias": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/eslint-import-resolver-alias/-/eslint-import-resolver-alias-1.1.2.tgz",
-      "integrity": "sha512-WdviM1Eu834zsfjHtcGHtGfcu+F30Od3V7I9Fi57uhBEwPkjDcii7/yW8jAT+gOhn4P/vOxxNAXbFAKsrrc15w==",
-      "dev": true,
-      "requires": {}
-    },
-    "eslint-import-resolver-node": {
-      "version": "0.3.9",
-      "resolved": "https://registry.npmjs.org/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz",
-      "integrity": "sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==",
-      "dev": true,
-      "requires": {
-        "debug": "^3.2.7",
-        "is-core-module": "^2.13.0",
-        "resolve": "^1.22.4"
-      },
-      "dependencies": {
-        "debug": {
-          "version": "3.2.7",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
-          "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
-          "dev": true,
-          "requires": {
-            "ms": "^2.1.1"
-          }
-        }
-      }
-    },
-    "eslint-module-utils": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.8.0.tgz",
-      "integrity": "sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==",
-      "dev": true,
-      "requires": {
-        "debug": "^3.2.7"
-      },
-      "dependencies": {
-        "debug": {
-          "version": "3.2.7",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
-          "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
-          "dev": true,
-          "requires": {
-            "ms": "^2.1.1"
-          }
-        }
-      }
-    },
-    "eslint-plugin-import": {
-      "version": "2.29.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.29.0.tgz",
-      "integrity": "sha512-QPOO5NO6Odv5lpoTkddtutccQjysJuFxoPS7fAHO+9m9udNHvTCPSAMW9zGAYj8lAIdr40I8yPCdUYrncXtrwg==",
-      "dev": true,
-      "requires": {
-        "array-includes": "^3.1.7",
-        "array.prototype.findlastindex": "^1.2.3",
-        "array.prototype.flat": "^1.3.2",
-        "array.prototype.flatmap": "^1.3.2",
-        "debug": "^3.2.7",
-        "doctrine": "^2.1.0",
-        "eslint-import-resolver-node": "^0.3.9",
-        "eslint-module-utils": "^2.8.0",
-        "hasown": "^2.0.0",
-        "is-core-module": "^2.13.1",
-        "is-glob": "^4.0.3",
-        "minimatch": "^3.1.2",
-        "object.fromentries": "^2.0.7",
-        "object.groupby": "^1.0.1",
-        "object.values": "^1.1.7",
-        "semver": "^6.3.1",
-        "tsconfig-paths": "^3.14.2"
-      },
-      "dependencies": {
-        "debug": {
-          "version": "3.2.7",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
-          "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
-          "dev": true,
-          "requires": {
-            "ms": "^2.1.1"
-          }
-        },
-        "doctrine": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz",
-          "integrity": "sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==",
-          "dev": true,
-          "requires": {
-            "esutils": "^2.0.2"
-          }
-        }
-      }
-    },
-    "eslint-plugin-prettier": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz",
-      "integrity": "sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ==",
-      "dev": true,
-      "requires": {
-        "prettier-linter-helpers": "^1.0.0"
-      }
-    },
-    "eslint-plugin-tree-shaking": {
-      "version": "1.12.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-tree-shaking/-/eslint-plugin-tree-shaking-1.12.0.tgz",
-      "integrity": "sha512-lFecPz4OZ4AUK+HghIjndXY6SY7rKCbROH28BM+6F/LEd6d3yCvklHuzpoyfkdn0/z1H4GcSz+6JArzVPgKd6Q==",
-      "dev": true
-    },
-    "eslint-plugin-vue": {
-      "version": "9.19.2",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.19.2.tgz",
-      "integrity": "sha512-CPDqTOG2K4Ni2o4J5wixkLVNwgctKXFu6oBpVJlpNq7f38lh9I80pRTouZSJ2MAebPJlINU/KTFSXyQfBUlymA==",
-      "dev": true,
-      "requires": {
-        "@eslint-community/eslint-utils": "^4.4.0",
-        "natural-compare": "^1.4.0",
-        "nth-check": "^2.1.1",
-        "postcss-selector-parser": "^6.0.13",
-        "semver": "^7.5.4",
-        "vue-eslint-parser": "^9.3.1",
-        "xml-name-validator": "^4.0.0"
-      },
-      "dependencies": {
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "eslint-scope": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
-      "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
-      "dev": true,
-      "requires": {
-        "esrecurse": "^4.3.0",
-        "estraverse": "^4.1.1"
-      }
-    },
-    "eslint-visitor-keys": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
-      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
-      "dev": true
-    },
-    "esm-resolve": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/esm-resolve/-/esm-resolve-1.0.11.tgz",
-      "integrity": "sha512-LxF0wfUQm3ldUDHkkV2MIbvvY0TgzIpJ420jHSV1Dm+IlplBEWiJTKWM61GtxUfvjV6iD4OtTYFGAGM2uuIUWg==",
-      "dev": true
-    },
-    "espree": {
-      "version": "9.6.1",
-      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
-      "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==",
-      "dev": true,
-      "requires": {
-        "acorn": "^8.9.0",
-        "acorn-jsx": "^5.3.2",
-        "eslint-visitor-keys": "^3.4.1"
-      }
-    },
-    "esprima": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
-      "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
-      "dev": true
-    },
-    "esquery": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.5.0.tgz",
-      "integrity": "sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==",
-      "dev": true,
-      "requires": {
-        "estraverse": "^5.1.0"
-      },
-      "dependencies": {
-        "estraverse": {
-          "version": "5.3.0",
-          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
-          "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
-          "dev": true
-        }
-      }
-    },
-    "esrecurse": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
-      "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
-      "dev": true,
-      "requires": {
-        "estraverse": "^5.2.0"
-      },
-      "dependencies": {
-        "estraverse": {
-          "version": "5.3.0",
-          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
-          "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
-          "dev": true
-        }
-      }
-    },
-    "estraverse": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
-      "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
-      "dev": true
-    },
-    "estree-walker": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
-      "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="
-    },
-    "esutils": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
-      "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==",
-      "dev": true
-    },
-    "eventemitter-asyncresource": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/eventemitter-asyncresource/-/eventemitter-asyncresource-1.0.0.tgz",
-      "integrity": "sha512-39F7TBIV0G7gTelxwbEqnwhp90eqCPON1k0NwNfwhgKn4Co4ybUbj2pECcXT0B3ztRKZ7Pw1JujUUgmQJHcVAQ==",
-      "dev": true
-    },
-    "execa": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-8.0.1.tgz",
-      "integrity": "sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==",
-      "dev": true,
-      "requires": {
-        "cross-spawn": "^7.0.3",
-        "get-stream": "^8.0.1",
-        "human-signals": "^5.0.0",
-        "is-stream": "^3.0.0",
-        "merge-stream": "^2.0.0",
-        "npm-run-path": "^5.1.0",
-        "onetime": "^6.0.0",
-        "signal-exit": "^4.1.0",
-        "strip-final-newline": "^3.0.0"
-      },
-      "dependencies": {
-        "get-stream": {
-          "version": "8.0.1",
-          "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-8.0.1.tgz",
-          "integrity": "sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==",
-          "dev": true
-        },
-        "mimic-fn": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-4.0.0.tgz",
-          "integrity": "sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==",
-          "dev": true
-        },
-        "onetime": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/onetime/-/onetime-6.0.0.tgz",
-          "integrity": "sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ==",
-          "dev": true,
-          "requires": {
-            "mimic-fn": "^4.0.0"
-          }
-        },
-        "signal-exit": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-          "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-          "dev": true
-        }
-      }
-    },
-    "expand-tilde": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz",
-      "integrity": "sha512-A5EmesHW6rfnZ9ysHQjPdJRni0SRar0tjtG5MNtm9n5TUvsYU8oozprtRD4AqHxcZWWlVuAmQo2nWKfN9oyjTw==",
-      "dev": true,
-      "requires": {
-        "homedir-polyfill": "^1.0.1"
-      }
-    },
-    "external-editor": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-3.1.0.tgz",
-      "integrity": "sha512-hMQ4CX1p1izmuLYyZqLMO/qGNw10wSv9QDCPfzXfyFrOaCSSoRfqE1Kf1s5an66J5JZC62NewG+mK49jOCtQew==",
-      "dev": true,
-      "requires": {
-        "chardet": "^0.7.0",
-        "iconv-lite": "^0.4.24",
-        "tmp": "^0.0.33"
-      }
-    },
-    "extract-zip": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-2.0.1.tgz",
-      "integrity": "sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==",
-      "dev": true,
-      "requires": {
-        "@types/yauzl": "^2.9.1",
-        "debug": "^4.1.1",
-        "get-stream": "^5.1.0",
-        "yauzl": "^2.10.0"
-      }
-    },
-    "fast-deep-equal": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
-      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
-      "dev": true
-    },
-    "fast-diff": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.3.0.tgz",
-      "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==",
-      "dev": true
-    },
-    "fast-fifo": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/fast-fifo/-/fast-fifo-1.3.2.tgz",
-      "integrity": "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==",
-      "dev": true
-    },
-    "fast-glob": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
-      "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==",
-      "dev": true,
-      "requires": {
-        "@nodelib/fs.stat": "^2.0.2",
-        "@nodelib/fs.walk": "^1.2.3",
-        "glob-parent": "^5.1.2",
-        "merge2": "^1.3.0",
-        "micromatch": "^4.0.4"
-      },
-      "dependencies": {
-        "glob-parent": {
-          "version": "5.1.2",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-          "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-          "dev": true,
-          "requires": {
-            "is-glob": "^4.0.1"
-          }
-        }
-      }
-    },
-    "fast-json-stable-stringify": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
-      "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==",
-      "dev": true
-    },
-    "fast-levenshtein": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
-      "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
-      "dev": true
-    },
-    "fastest-levenshtein": {
-      "version": "1.0.16",
-      "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz",
-      "integrity": "sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==",
-      "dev": true
-    },
-    "fastq": {
-      "version": "1.15.0",
-      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.15.0.tgz",
-      "integrity": "sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==",
-      "dev": true,
-      "requires": {
-        "reusify": "^1.0.4"
-      }
-    },
-    "fd-slicer": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.1.0.tgz",
-      "integrity": "sha512-cE1qsB/VwyQozZ+q1dGxR8LBYNZeofhEdUNGSMbQD3Gw2lAzX9Zb3uIU6Ebc/Fmyjo9AWWfnn0AUCHqtevs/8g==",
-      "dev": true,
-      "requires": {
-        "pend": "~1.2.0"
-      }
-    },
-    "figures": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-3.2.0.tgz",
-      "integrity": "sha512-yaduQFRKLXYOGgEn6AZau90j3ggSOyiqXU0F9JZfeXYhNa+Jk4X+s45A2zg5jns87GAFa34BBm2kXw4XpNcbdg==",
-      "dev": true,
-      "requires": {
-        "escape-string-regexp": "^1.0.5"
-      },
-      "dependencies": {
-        "escape-string-regexp": {
-          "version": "1.0.5",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-          "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
-          "dev": true
-        }
-      }
-    },
-    "file-entry-cache": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz",
-      "integrity": "sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==",
-      "dev": true,
-      "requires": {
-        "flat-cache": "^3.0.4"
-      }
-    },
-    "filelist": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/filelist/-/filelist-1.0.4.tgz",
-      "integrity": "sha512-w1cEuf3S+DrLCQL7ET6kz+gmlJdbq9J7yXCSjK/OZCPA+qEN1WyF4ZAf0YYJa4/shHJra2t/d/r8SV4Ji+x+8Q==",
-      "dev": true,
-      "requires": {
-        "minimatch": "^5.0.1"
-      },
-      "dependencies": {
-        "brace-expansion": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-          "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-          "dev": true,
-          "requires": {
-            "balanced-match": "^1.0.0"
-          }
-        },
-        "minimatch": {
-          "version": "5.1.6",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz",
-          "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==",
-          "dev": true,
-          "requires": {
-            "brace-expansion": "^2.0.1"
-          }
-        }
-      }
-    },
-    "fill-range": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
-      "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
-      "dev": true,
-      "requires": {
-        "to-regex-range": "^5.0.1"
-      }
-    },
-    "find-node-modules": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/find-node-modules/-/find-node-modules-2.1.3.tgz",
-      "integrity": "sha512-UC2I2+nx1ZuOBclWVNdcnbDR5dlrOdVb7xNjmT/lHE+LsgztWks3dG7boJ37yTS/venXw84B/mAW9uHVoC5QRg==",
-      "dev": true,
-      "requires": {
-        "findup-sync": "^4.0.0",
-        "merge": "^2.1.1"
-      }
-    },
-    "find-root": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
-      "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==",
-      "dev": true
-    },
-    "find-up": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
-      "integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==",
-      "dev": true,
-      "requires": {
-        "locate-path": "^6.0.0",
-        "path-exists": "^4.0.0"
-      }
-    },
-    "find-versions": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/find-versions/-/find-versions-4.0.0.tgz",
-      "integrity": "sha512-wgpWy002tA+wgmO27buH/9KzyEOQnKsG/R0yrcjPT9BOFm0zRBVQbZ95nRGXWMywS8YR5knRbpohio0bcJABxQ==",
-      "dev": true,
-      "requires": {
-        "semver-regex": "^3.1.2"
-      }
-    },
-    "findup-sync": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-4.0.0.tgz",
-      "integrity": "sha512-6jvvn/12IC4quLBL1KNokxC7wWTvYncaVUYSoxWw7YykPLuRrnv4qdHcSOywOI5RpkOVGeQRtWM8/q+G6W6qfQ==",
-      "dev": true,
-      "requires": {
-        "detect-file": "^1.0.0",
-        "is-glob": "^4.0.0",
-        "micromatch": "^4.0.2",
-        "resolve-dir": "^1.0.1"
-      }
-    },
-    "flat": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/flat/-/flat-5.0.2.tgz",
-      "integrity": "sha512-b6suED+5/3rTpUBdG1gupIl8MPFCAMA0QXwmljLhvCUKcUvdE4gWky9zpuGCcXHOsz4J9wPGNWq6OKpmIzz3hQ==",
-      "dev": true
-    },
-    "flat-cache": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.2.0.tgz",
-      "integrity": "sha512-CYcENa+FtcUKLmhhqyctpclsq7QF38pKjZHsGNiSQF5r4FtoKDWabFDl3hzaEQMvT1LHEysw5twgLvpYYb4vbw==",
-      "dev": true,
-      "requires": {
-        "flatted": "^3.2.9",
-        "keyv": "^4.5.3",
-        "rimraf": "^3.0.2"
-      }
-    },
-    "flatted": {
-      "version": "3.2.9",
-      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.2.9.tgz",
-      "integrity": "sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==",
-      "dev": true
-    },
-    "follow-redirects": {
-      "version": "1.15.5",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.5.tgz",
-      "integrity": "sha512-vSFWUON1B+yAw1VN4xMfxgn5fTUiaOzAJCKBwIIgT/+7CuGy9+r+5gITvP62j3RmaD5Ph65UaERdOSRGUzZtgw==",
-      "dev": true
-    },
-    "for-each": {
-      "version": "0.3.3",
-      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
-      "integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==",
-      "dev": true,
-      "requires": {
-        "is-callable": "^1.1.3"
-      }
-    },
-    "foreground-child": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-2.0.0.tgz",
-      "integrity": "sha512-dCIq9FpEcyQyXKCkyzmlPTFNgrCzPudOe+mhvJU5zAtlBnGVy2yKxtfsxK2tQBThwq225jcvBjpw1Gr40uzZCA==",
-      "dev": true,
-      "requires": {
-        "cross-spawn": "^7.0.0",
-        "signal-exit": "^3.0.2"
-      }
-    },
-    "form-data": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
-      "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
-      "dev": true,
-      "requires": {
-        "asynckit": "^0.4.0",
-        "combined-stream": "^1.0.8",
-        "mime-types": "^2.1.12"
-      }
-    },
-    "fraction.js": {
-      "version": "4.3.7",
-      "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz",
-      "integrity": "sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==",
-      "dev": true
-    },
-    "fs-constants": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz",
-      "integrity": "sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==",
-      "dev": true
-    },
-    "fs-extra": {
-      "version": "10.1.0",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-10.1.0.tgz",
-      "integrity": "sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "^4.2.0",
-        "jsonfile": "^6.0.1",
-        "universalify": "^2.0.0"
-      }
-    },
-    "fs.realpath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
-      "dev": true
-    },
-    "fsevents": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
-      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-      "dev": true,
-      "optional": true
-    },
-    "function-bind": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
-      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
-      "dev": true
-    },
-    "function.prototype.name": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.6.tgz",
-      "integrity": "sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "functions-have-names": "^1.2.3"
-      }
-    },
-    "functions-have-names": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.3.tgz",
-      "integrity": "sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==",
-      "dev": true
-    },
-    "gensync": {
-      "version": "1.0.0-beta.2",
-      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
-      "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
-      "dev": true,
-      "peer": true
-    },
-    "get-caller-file": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
-      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
-      "dev": true
-    },
-    "get-func-name": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/get-func-name/-/get-func-name-2.0.2.tgz",
-      "integrity": "sha512-8vXOvuE167CtIc3OyItco7N/dpRtBbYOsPsXCz7X/PMnlGjYjSGuZJgM1Y7mmew7BKf9BqvLX2tnOVy1BBUsxQ==",
-      "dev": true
-    },
-    "get-intrinsic": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.2.tgz",
-      "integrity": "sha512-0gSo4ml/0j98Y3lngkFEot/zhiCeWsbYIlZ+uZOVgzLyLaUw7wxUL+nCTP0XJvJg1AXulJRI3UJi8GsbDuxdGA==",
-      "dev": true,
-      "requires": {
-        "function-bind": "^1.1.2",
-        "has-proto": "^1.0.1",
-        "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0"
-      }
-    },
-    "get-stream": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz",
-      "integrity": "sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==",
-      "dev": true,
-      "requires": {
-        "pump": "^3.0.0"
-      }
-    },
-    "get-symbol-description": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.0.tgz",
-      "integrity": "sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.1"
-      }
-    },
-    "get-uri": {
-      "version": "6.0.3",
-      "resolved": "https://registry.npmjs.org/get-uri/-/get-uri-6.0.3.tgz",
-      "integrity": "sha512-BzUrJBS9EcUb4cFol8r4W3v1cPsSyajLSthNkz5BxbpDcHN5tIrM10E2eNvfnvBn3DaT3DUgx0OpsBKkaOpanw==",
-      "dev": true,
-      "requires": {
-        "basic-ftp": "^5.0.2",
-        "data-uri-to-buffer": "^6.0.2",
-        "debug": "^4.3.4",
-        "fs-extra": "^11.2.0"
-      },
-      "dependencies": {
-        "fs-extra": {
-          "version": "11.2.0",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.2.0.tgz",
-          "integrity": "sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==",
-          "dev": true,
-          "requires": {
-            "graceful-fs": "^4.2.0",
-            "jsonfile": "^6.0.1",
-            "universalify": "^2.0.0"
-          }
-        }
-      }
-    },
-    "glob": {
-      "version": "7.2.3",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
-      "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
-      "dev": true,
-      "requires": {
-        "fs.realpath": "^1.0.0",
-        "inflight": "^1.0.4",
-        "inherits": "2",
-        "minimatch": "^3.1.1",
-        "once": "^1.3.0",
-        "path-is-absolute": "^1.0.0"
-      }
-    },
-    "glob-parent": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
-      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
-      "dev": true,
-      "requires": {
-        "is-glob": "^4.0.3"
-      }
-    },
-    "global-dirs": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/global-dirs/-/global-dirs-0.1.1.tgz",
-      "integrity": "sha512-NknMLn7F2J7aflwFOlGdNIuCDpN3VGoSoB+aap3KABFWbHVn1TCgFC+np23J8W2BiZbjfEw3BFBycSMv1AFblg==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "ini": "^1.3.4"
-      }
-    },
-    "global-modules": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-1.0.0.tgz",
-      "integrity": "sha512-sKzpEkf11GpOFuw0Zzjzmt4B4UZwjOcG757PPvrfhxcLFbq0wpsgpOqxpxtxFiCG4DtG93M6XRVbF2oGdev7bg==",
-      "dev": true,
-      "requires": {
-        "global-prefix": "^1.0.1",
-        "is-windows": "^1.0.1",
-        "resolve-dir": "^1.0.0"
-      }
-    },
-    "global-prefix": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-1.0.2.tgz",
-      "integrity": "sha512-5lsx1NUDHtSjfg0eHlmYvZKv8/nVqX4ckFbM+FrGcQ+04KWcWFo9P5MxPZYSzUvyzmdTbI7Eix8Q4IbELDqzKg==",
-      "dev": true,
-      "requires": {
-        "expand-tilde": "^2.0.2",
-        "homedir-polyfill": "^1.0.1",
-        "ini": "^1.3.4",
-        "is-windows": "^1.0.1",
-        "which": "^1.2.14"
-      },
-      "dependencies": {
-        "which": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
-          "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
-          "dev": true,
-          "requires": {
-            "isexe": "^2.0.0"
-          }
-        }
-      }
-    },
-    "globals": {
-      "version": "11.12.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
-      "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
-      "dev": true
-    },
-    "globalthis": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.3.tgz",
-      "integrity": "sha512-sFdI5LyBiNTHjRd7cGPWapiHWMOXKyuBNX/cWJ3NfzrZQVa8GI/8cofCl74AOVqq9W5kNmguTIzJ/1s2gyI9wA==",
-      "dev": true,
-      "requires": {
-        "define-properties": "^1.1.3"
-      }
-    },
-    "globby": {
-      "version": "11.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz",
-      "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==",
-      "dev": true,
-      "requires": {
-        "array-union": "^2.1.0",
-        "dir-glob": "^3.0.1",
-        "fast-glob": "^3.2.9",
-        "ignore": "^5.2.0",
-        "merge2": "^1.4.1",
-        "slash": "^3.0.0"
-      }
-    },
-    "globjoin": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/globjoin/-/globjoin-0.1.4.tgz",
-      "integrity": "sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==",
-      "dev": true
-    },
-    "gopd": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
-      "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==",
-      "dev": true,
-      "requires": {
-        "get-intrinsic": "^1.1.3"
-      }
-    },
-    "graceful-fs": {
-      "version": "4.2.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
-      "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
-      "dev": true
-    },
-    "graphemer": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/graphemer/-/graphemer-1.4.0.tgz",
-      "integrity": "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==",
-      "dev": true
-    },
-    "has-bigints": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.0.2.tgz",
-      "integrity": "sha512-tSvCKtBr9lkF0Ex0aQiP9N+OpV4zi2r/Nee5VkRDbaqv35RLYMzbwQfFSZZH0kR+Rd6302UJZ2p/bJCEoR3VoQ==",
-      "dev": true
-    },
-    "has-flag": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-      "dev": true
-    },
-    "has-property-descriptors": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.1.tgz",
-      "integrity": "sha512-VsX8eaIewvas0xnvinAe9bw4WfIeODpGYikiWYLH+dma0Jw6KHYqWiWfhQlgOVK8D6PvjubK5Uc4P0iIhIcNVg==",
-      "dev": true,
-      "requires": {
-        "get-intrinsic": "^1.2.2"
-      }
-    },
-    "has-proto": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.1.tgz",
-      "integrity": "sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg==",
-      "dev": true
-    },
-    "has-symbols": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz",
-      "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==",
-      "dev": true
-    },
-    "has-tostringtag": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.0.tgz",
-      "integrity": "sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ==",
-      "dev": true,
-      "requires": {
-        "has-symbols": "^1.0.2"
-      }
-    },
-    "hash-sum": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-2.0.0.tgz",
-      "integrity": "sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg==",
-      "dev": true
-    },
-    "hasown": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.0.tgz",
-      "integrity": "sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==",
-      "dev": true,
-      "requires": {
-        "function-bind": "^1.1.2"
-      }
-    },
-    "hdr-histogram-js": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/hdr-histogram-js/-/hdr-histogram-js-2.0.3.tgz",
-      "integrity": "sha512-Hkn78wwzWHNCp2uarhzQ2SGFLU3JY8SBDDd3TAABK4fc30wm+MuPOrg5QVFVfkKOQd6Bfz3ukJEI+q9sXEkK1g==",
-      "dev": true,
-      "requires": {
-        "@assemblyscript/loader": "^0.10.1",
-        "base64-js": "^1.2.0",
-        "pako": "^1.0.3"
-      }
-    },
-    "hdr-histogram-percentiles-obj": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/hdr-histogram-percentiles-obj/-/hdr-histogram-percentiles-obj-3.0.0.tgz",
-      "integrity": "sha512-7kIufnBqdsBGcSZLPJwqHT3yhk1QTsSlFsVD3kx5ixH/AlgBs9yM1q6DPhXZ8f8gtdqgh7N7/5btRLpQsS2gHw==",
-      "dev": true
-    },
-    "he": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
-      "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
-      "dev": true
-    },
-    "homedir-polyfill": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.3.tgz",
-      "integrity": "sha512-eSmmWE5bZTK2Nou4g0AI3zZ9rswp7GRKoKXS1BLUkvPviOqs4YTN1djQIqrXy9k5gEtdLPy86JjRwsNM9tnDcA==",
-      "dev": true,
-      "requires": {
-        "parse-passwd": "^1.0.0"
-      }
-    },
-    "hosted-git-info": {
-      "version": "2.8.9",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz",
-      "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==",
-      "dev": true
-    },
-    "html-encoding-sniffer": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-2.0.1.tgz",
-      "integrity": "sha512-D5JbOMBIR/TVZkubHT+OyT2705QvogUW4IBn6nHd756OwieSF9aDYFj4dv6HHEVGYbHaLETa3WggZYWWMyy3ZQ==",
-      "dev": true,
-      "requires": {
-        "whatwg-encoding": "^1.0.5"
-      }
-    },
-    "html-escaper": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
-      "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==",
-      "dev": true
-    },
-    "html-tags": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/html-tags/-/html-tags-3.3.1.tgz",
-      "integrity": "sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==",
-      "dev": true
-    },
-    "http-proxy-agent": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-4.0.1.tgz",
-      "integrity": "sha512-k0zdNgqWTGA6aeIRVpvfVob4fL52dTfaehylg0Y4UvSySvOq/Y+BOyPrgpUrA7HylqvU8vIZGsRuXmspskV0Tg==",
-      "dev": true,
-      "requires": {
-        "@tootallnate/once": "1",
-        "agent-base": "6",
-        "debug": "4"
-      }
-    },
-    "https-proxy-agent": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz",
-      "integrity": "sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==",
-      "dev": true,
-      "requires": {
-        "agent-base": "6",
-        "debug": "4"
-      }
-    },
-    "human-signals": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-5.0.0.tgz",
-      "integrity": "sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==",
-      "dev": true
-    },
-    "husky": {
-      "version": "4.3.8",
-      "resolved": "https://registry.npmjs.org/husky/-/husky-4.3.8.tgz",
-      "integrity": "sha512-LCqqsB0PzJQ/AlCgfrfzRe3e3+NvmefAdKQhRYpxS4u6clblBoDdzzvHi8fmxKRzvMxPY/1WZWzomPZww0Anow==",
-      "dev": true,
-      "requires": {
-        "chalk": "^4.0.0",
-        "ci-info": "^2.0.0",
-        "compare-versions": "^3.6.0",
-        "cosmiconfig": "^7.0.0",
-        "find-versions": "^4.0.0",
-        "opencollective-postinstall": "^2.0.2",
-        "pkg-dir": "^5.0.0",
-        "please-upgrade-node": "^3.2.0",
-        "slash": "^3.0.0",
-        "which-pm-runs": "^1.0.0"
-      },
-      "dependencies": {
-        "compare-versions": {
-          "version": "3.6.0",
-          "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-3.6.0.tgz",
-          "integrity": "sha512-W6Af2Iw1z4CB7q4uU4hv646dW9GQuBM+YpC0UvUCWSD8w90SJjp+ujJuXaEMtAXBtSqGfMPuFOVn4/+FlaqfBA==",
-          "dev": true
-        },
-        "cosmiconfig": {
-          "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz",
-          "integrity": "sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==",
-          "dev": true,
-          "requires": {
-            "@types/parse-json": "^4.0.0",
-            "import-fresh": "^3.2.1",
-            "parse-json": "^5.0.0",
-            "path-type": "^4.0.0",
-            "yaml": "^1.10.0"
-          }
-        }
-      }
-    },
-    "iconv-lite": {
-      "version": "0.4.24",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
-      "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
-      "dev": true,
-      "requires": {
-        "safer-buffer": ">= 2.1.2 < 3"
-      }
-    },
-    "ieee754": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
-      "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==",
-      "dev": true
-    },
-    "ignore": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.0.tgz",
-      "integrity": "sha512-g7dmpshy+gD7mh88OC9NwSGTKoc3kyLAZQRU1mt53Aw/vnvfXnbC+F/7F7QoYVKbV+KNvJx8wArewKy1vXMtlg==",
-      "dev": true
-    },
-    "immediate": {
-      "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
-      "integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==",
-      "dev": true
-    },
-    "immutable": {
-      "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.4.tgz",
-      "integrity": "sha512-fsXeu4J4i6WNWSikpI88v/PcVflZz+6kMhUfIwc5SY+poQRPnaf5V7qds6SUyUN3cVxEzuCab7QIoLOQ+DQ1wA==",
-      "dev": true
-    },
-    "import-fresh": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
-      "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==",
-      "dev": true,
-      "requires": {
-        "parent-module": "^1.0.0",
-        "resolve-from": "^4.0.0"
-      },
-      "dependencies": {
-        "resolve-from": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
-          "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
-          "dev": true
-        }
-      }
-    },
-    "import-lazy": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/import-lazy/-/import-lazy-4.0.0.tgz",
-      "integrity": "sha512-rKtvo6a868b5Hu3heneU+L4yEQ4jYKLtjpnPeUdK7h0yzXGmyBTypknlkCvHFBqfX9YlorEiMM6Dnq/5atfHkw==",
-      "dev": true
-    },
-    "imurmurhash": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
-      "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==",
-      "dev": true
-    },
-    "inflight": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==",
-      "dev": true,
-      "requires": {
-        "once": "^1.3.0",
-        "wrappy": "1"
-      }
-    },
-    "inherits": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
-      "dev": true
-    },
-    "ini": {
-      "version": "1.3.8",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
-      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
-      "dev": true
-    },
-    "inquirer": {
-      "version": "8.2.6",
-      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-8.2.6.tgz",
-      "integrity": "sha512-M1WuAmb7pn9zdFRtQYk26ZBoY043Sse0wVDdk4Bppr+JOXyQYybdtvK+l9wUibhtjdjvtoiNy8tk+EgsYIUqKg==",
-      "dev": true,
-      "requires": {
-        "ansi-escapes": "^4.2.1",
-        "chalk": "^4.1.1",
-        "cli-cursor": "^3.1.0",
-        "cli-width": "^3.0.0",
-        "external-editor": "^3.0.3",
-        "figures": "^3.0.0",
-        "lodash": "^4.17.21",
-        "mute-stream": "0.0.8",
-        "ora": "^5.4.1",
-        "run-async": "^2.4.0",
-        "rxjs": "^7.5.5",
-        "string-width": "^4.1.0",
-        "strip-ansi": "^6.0.0",
-        "through": "^2.3.6",
-        "wrap-ansi": "^6.0.1"
-      }
-    },
-    "internal-slot": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.6.tgz",
-      "integrity": "sha512-Xj6dv+PsbtwyPpEflsejS+oIZxmMlV44zAhG479uYu89MsjcYOhCFnNyKrkJrihbsiasQyY0afoCl/9BLR65bg==",
-      "dev": true,
-      "requires": {
-        "get-intrinsic": "^1.2.2",
-        "hasown": "^2.0.0",
-        "side-channel": "^1.0.4"
-      }
-    },
-    "ip-address": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-9.0.5.tgz",
-      "integrity": "sha512-zHtQzGojZXTwZTHQqra+ETKd4Sn3vgi7uBmlPoXVWZqYvuKmtI0l/VZTjqGmJY9x88GGOaZ9+G9ES8hC4T4X8g==",
-      "dev": true,
-      "requires": {
-        "jsbn": "1.1.0",
-        "sprintf-js": "^1.1.3"
-      },
-      "dependencies": {
-        "sprintf-js": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.3.tgz",
-          "integrity": "sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA==",
-          "dev": true
-        }
-      }
-    },
-    "ip-regex": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ip-regex/-/ip-regex-4.3.0.tgz",
-      "integrity": "sha512-B9ZWJxHHOHUhUjCPrMpLD4xEq35bUTClHM1S6CBU5ixQnkZmwipwgc96vAd7AAGM9TGHvJR+Uss+/Ak6UphK+Q==",
-      "dev": true
-    },
-    "is-arguments": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.1.1.tgz",
-      "integrity": "sha512-8Q7EARjzEnKpt/PCD7e1cgUS0a6X8u5tdSiMqXhojOdoV9TsMsiO+9VLC5vAmO8N7/GmXn7yjR8qnA6bVAEzfA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "has-tostringtag": "^1.0.0"
-      }
-    },
-    "is-array-buffer": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.2.tgz",
-      "integrity": "sha512-y+FyyR/w8vfIRq4eQcM1EYgSTnmHXPqaF+IgzgraytCFq5Xh8lllDVmAZolPJiZttZLeFSINPYMaEJ7/vWUa1w==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.0",
-        "is-typed-array": "^1.1.10"
-      }
-    },
-    "is-arrayish": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
-      "dev": true
-    },
-    "is-bigint": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz",
-      "integrity": "sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==",
-      "dev": true,
-      "requires": {
-        "has-bigints": "^1.0.1"
-      }
-    },
-    "is-binary-path": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
-      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
-      "dev": true,
-      "requires": {
-        "binary-extensions": "^2.0.0"
-      }
-    },
-    "is-boolean-object": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz",
-      "integrity": "sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "has-tostringtag": "^1.0.0"
-      }
-    },
-    "is-callable": {
-      "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz",
-      "integrity": "sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==",
-      "dev": true
-    },
-    "is-core-module": {
-      "version": "2.13.1",
-      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.1.tgz",
-      "integrity": "sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==",
-      "dev": true,
-      "requires": {
-        "hasown": "^2.0.0"
-      }
-    },
-    "is-date-object": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.5.tgz",
-      "integrity": "sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==",
-      "dev": true,
-      "requires": {
-        "has-tostringtag": "^1.0.0"
-      }
-    },
-    "is-docker": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz",
-      "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==",
-      "dev": true
-    },
-    "is-expression": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/is-expression/-/is-expression-4.0.0.tgz",
-      "integrity": "sha512-zMIXX63sxzG3XrkHkrAPvm/OVZVSCPNkwMHU8oTX7/U3AL78I0QXCEICXUM13BIa8TYGZ68PiTKfQz3yaTNr4A==",
-      "dev": true,
-      "requires": {
-        "acorn": "^7.1.1",
-        "object-assign": "^4.1.1"
-      },
-      "dependencies": {
-        "acorn": {
-          "version": "7.4.1",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
-          "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
-          "dev": true
-        }
-      }
-    },
-    "is-extglob": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
-      "dev": true
-    },
-    "is-fullwidth-code-point": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
-      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
-      "dev": true
-    },
-    "is-glob": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
-      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
-      "dev": true,
-      "requires": {
-        "is-extglob": "^2.1.1"
-      }
-    },
-    "is-interactive": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-1.0.0.tgz",
-      "integrity": "sha512-2HvIEKRoqS62guEC+qBjpvRubdX910WCMuJTZ+I9yvqKU2/12eSL549HMwtabb4oupdj2sMP50k+XJfB/8JE6w==",
-      "dev": true
-    },
-    "is-map": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.2.tgz",
-      "integrity": "sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==",
-      "dev": true
-    },
-    "is-negative-zero": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.2.tgz",
-      "integrity": "sha512-dqJvarLawXsFbNDeJW7zAz8ItJ9cd28YufuuFzh0G8pNHjJMnY08Dv7sYX2uF5UpQOwieAeOExEYAWWfu7ZZUA==",
-      "dev": true
-    },
-    "is-number": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
-      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
-      "dev": true
-    },
-    "is-number-object": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.7.tgz",
-      "integrity": "sha512-k1U0IRzLMo7ZlYIfzRu23Oh6MiIFasgpb9X76eqfFZAqwH44UI4KTBvBYIZ1dSL9ZzChTB9ShHfLkR4pdW5krQ==",
-      "dev": true,
-      "requires": {
-        "has-tostringtag": "^1.0.0"
-      }
-    },
-    "is-path-inside": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.3.tgz",
-      "integrity": "sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==",
-      "dev": true
-    },
-    "is-plain-object": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz",
-      "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==",
-      "dev": true
-    },
-    "is-potential-custom-element-name": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz",
-      "integrity": "sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==",
-      "dev": true
-    },
-    "is-promise": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.2.2.tgz",
-      "integrity": "sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ==",
-      "dev": true
-    },
-    "is-regex": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.1.4.tgz",
-      "integrity": "sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "has-tostringtag": "^1.0.0"
-      }
-    },
-    "is-set": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.2.tgz",
-      "integrity": "sha512-+2cnTEZeY5z/iXGbLhPrOAaK/Mau5k5eXq9j14CpRTftq0pAJu2MwVRSZhyZWBzx3o6X795Lz6Bpb6R0GKf37g==",
-      "dev": true
-    },
-    "is-shared-array-buffer": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.2.tgz",
-      "integrity": "sha512-sqN2UDu1/0y6uvXyStCOzyhAjCSlHceFoMKJW8W9EU9cvic/QdsZ0kEU93HEy3IUEFZIiH/3w+AH/UQbPHNdhA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2"
-      }
-    },
-    "is-stream": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-3.0.0.tgz",
-      "integrity": "sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==",
-      "dev": true
-    },
-    "is-string": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.0.7.tgz",
-      "integrity": "sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==",
-      "dev": true,
-      "requires": {
-        "has-tostringtag": "^1.0.0"
-      }
-    },
-    "is-symbol": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.4.tgz",
-      "integrity": "sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==",
-      "dev": true,
-      "requires": {
-        "has-symbols": "^1.0.2"
-      }
-    },
-    "is-typed-array": {
-      "version": "1.1.12",
-      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.12.tgz",
-      "integrity": "sha512-Z14TF2JNG8Lss5/HMqt0//T9JeHXttXy5pH/DBU4vi98ozO2btxzq9MwYDZYnKwU8nRsz/+GVFVRDq3DkVuSPg==",
-      "dev": true,
-      "requires": {
-        "which-typed-array": "^1.1.11"
-      }
-    },
-    "is-unicode-supported": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-0.1.0.tgz",
-      "integrity": "sha512-knxG2q4UC3u8stRGyAVJCOdxFmv5DZiRcdlIaAQXAbSfJya+OhopNotLQrstBhququ4ZpuKbDc/8S6mgXgPFPw==",
-      "dev": true
-    },
-    "is-url": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/is-url/-/is-url-1.2.4.tgz",
-      "integrity": "sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==",
-      "dev": true
-    },
-    "is-utf8": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
-      "integrity": "sha512-rMYPYvCzsXywIsldgLaSoPlw5PfoB/ssr7hY4pLfcodrA5M/eArza1a9VmTiNIBNMjOGr1Ow9mTyU2o69U6U9Q==",
-      "dev": true
-    },
-    "is-weakmap": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.1.tgz",
-      "integrity": "sha512-NSBR4kH5oVj1Uwvv970ruUkCV7O1mzgVFO4/rev2cLRda9Tm9HrL70ZPut4rOHgY0FNrUu9BCbXA2sdQ+x0chA==",
-      "dev": true
-    },
-    "is-weakref": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.0.2.tgz",
-      "integrity": "sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2"
-      }
-    },
-    "is-weakset": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.2.tgz",
-      "integrity": "sha512-t2yVvttHkQktwnNNmBQ98AhENLdPUTDTE21uPqAQ0ARwQfGeQKRVS0NNurH7bTf7RrvcVn1OOge45CnBeHCSmg==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.1"
-      }
-    },
-    "is-windows": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
-      "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA==",
-      "dev": true
-    },
-    "is-wsl": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
-      "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
-      "dev": true,
-      "requires": {
-        "is-docker": "^2.0.0"
-      }
-    },
-    "is2": {
-      "version": "2.0.9",
-      "resolved": "https://registry.npmjs.org/is2/-/is2-2.0.9.tgz",
-      "integrity": "sha512-rZkHeBn9Zzq52sd9IUIV3a5mfwBY+o2HePMh0wkGBM4z4qjvy2GwVxQ6nNXSfw6MmVP6gf1QIlWjiOavhM3x5g==",
-      "dev": true,
-      "requires": {
-        "deep-is": "^0.1.3",
-        "ip-regex": "^4.1.0",
-        "is-url": "^1.2.4"
-      }
-    },
-    "isarray": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
-      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
-      "dev": true
-    },
-    "isexe": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
-      "dev": true
-    },
-    "istanbul-lib-coverage": {
-      "version": "3.2.2",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.2.tgz",
-      "integrity": "sha512-O8dpsF+r0WV/8MNRKfnmrtCWhuKjxrq2w+jpzBL5UZKTi2LeVWnWOmWRxFlesJONmc+wLAGvKQZEOanko0LFTg==",
-      "dev": true
-    },
-    "istanbul-lib-report": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-3.0.1.tgz",
-      "integrity": "sha512-GCfE1mtsHGOELCU8e/Z7YWzpmybrx/+dSTfLrvY8qRmaY6zXTKWn6WQIjaAFw069icm6GVMNkgu0NzI4iPZUNw==",
-      "dev": true,
-      "requires": {
-        "istanbul-lib-coverage": "^3.0.0",
-        "make-dir": "^4.0.0",
-        "supports-color": "^7.1.0"
-      }
-    },
-    "istanbul-reports": {
-      "version": "3.1.6",
-      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-3.1.6.tgz",
-      "integrity": "sha512-TLgnMkKg3iTDsQ9PbPTdpfAK2DzjF9mqUG7RMgcQl8oFjad8ob4laGxv5XV5U9MAfx8D6tSJiUyuAwzLicaxlg==",
-      "dev": true,
-      "requires": {
-        "html-escaper": "^2.0.0",
-        "istanbul-lib-report": "^3.0.0"
-      }
-    },
-    "jackspeak": {
-      "version": "2.3.6",
-      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-2.3.6.tgz",
-      "integrity": "sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==",
-      "dev": true,
-      "requires": {
-        "@isaacs/cliui": "^8.0.2",
-        "@pkgjs/parseargs": "^0.11.0"
-      }
-    },
-    "jake": {
-      "version": "10.8.7",
-      "resolved": "https://registry.npmjs.org/jake/-/jake-10.8.7.tgz",
-      "integrity": "sha512-ZDi3aP+fG/LchyBzUM804VjddnwfSfsdeYkwt8NcbKRvo4rFkjhs456iLFn3k2ZUWvNe4i48WACDbza8fhq2+w==",
-      "dev": true,
-      "requires": {
-        "async": "^3.2.3",
-        "chalk": "^4.0.2",
-        "filelist": "^1.0.4",
-        "minimatch": "^3.1.2"
-      }
-    },
-    "jiti": {
-      "version": "1.21.0",
-      "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.0.tgz",
-      "integrity": "sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==",
-      "dev": true,
-      "optional": true
-    },
-    "jju": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/jju/-/jju-1.4.0.tgz",
-      "integrity": "sha512-8wb9Yw966OSxApiCt0K3yNJL8pnNeIv+OEq2YMidz4FKP6nonSRoOXc80iXY4JaN2FC11B9qsNmDsm+ZOfMROA==",
-      "dev": true
-    },
-    "js-beautify": {
-      "version": "1.14.11",
-      "resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.14.11.tgz",
-      "integrity": "sha512-rPogWqAfoYh1Ryqqh2agUpVfbxAhbjuN1SmU86dskQUKouRiggUTCO4+2ym9UPXllc2WAp0J+T5qxn7Um3lCdw==",
-      "dev": true,
-      "requires": {
-        "config-chain": "^1.1.13",
-        "editorconfig": "^1.0.3",
-        "glob": "^10.3.3",
-        "nopt": "^7.2.0"
-      },
-      "dependencies": {
-        "brace-expansion": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-          "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-          "dev": true,
-          "requires": {
-            "balanced-match": "^1.0.0"
-          }
-        },
-        "foreground-child": {
-          "version": "3.1.1",
-          "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.1.1.tgz",
-          "integrity": "sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==",
-          "dev": true,
-          "requires": {
-            "cross-spawn": "^7.0.0",
-            "signal-exit": "^4.0.1"
-          }
-        },
-        "glob": {
-          "version": "10.3.10",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz",
-          "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==",
-          "dev": true,
-          "requires": {
-            "foreground-child": "^3.1.0",
-            "jackspeak": "^2.3.5",
-            "minimatch": "^9.0.1",
-            "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0",
-            "path-scurry": "^1.10.1"
-          }
-        },
-        "minimatch": {
-          "version": "9.0.3",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
-          "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
-          "dev": true,
-          "requires": {
-            "brace-expansion": "^2.0.1"
-          }
-        },
-        "signal-exit": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-          "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-          "dev": true
-        }
-      }
-    },
-    "js-stringify": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/js-stringify/-/js-stringify-1.0.2.tgz",
-      "integrity": "sha512-rtS5ATOo2Q5k1G+DADISilDA6lv79zIiwFd6CcjuIxGKLFm5C+RLImRscVap9k55i+MOZwgliw+NejvkLuGD5g==",
-      "dev": true
-    },
-    "js-tokens": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
-      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
-      "dev": true
-    },
-    "js-yaml": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
-      "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
-      "dev": true,
-      "requires": {
-        "argparse": "^2.0.1"
-      }
-    },
-    "jsbn": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-1.1.0.tgz",
-      "integrity": "sha512-4bYVV3aAMtDTTu4+xsDYa6sy9GyJ69/amsu9sYF2zqjiEoZA5xJi3BrfX3uY+/IekIu7MwdObdbDWpoZdBv3/A==",
-      "dev": true
-    },
-    "jsdom": {
-      "version": "16.7.0",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-16.7.0.tgz",
-      "integrity": "sha512-u9Smc2G1USStM+s/x1ru5Sxrl6mPYCbByG1U/hUmqaVsm4tbNyS7CicOSRyuGQYZhTu0h84qkZZQ/I+dzizSVw==",
-      "dev": true,
-      "requires": {
-        "abab": "^2.0.5",
-        "acorn": "^8.2.4",
-        "acorn-globals": "^6.0.0",
-        "cssom": "^0.4.4",
-        "cssstyle": "^2.3.0",
-        "data-urls": "^2.0.0",
-        "decimal.js": "^10.2.1",
-        "domexception": "^2.0.1",
-        "escodegen": "^2.0.0",
-        "form-data": "^3.0.0",
-        "html-encoding-sniffer": "^2.0.1",
-        "http-proxy-agent": "^4.0.1",
-        "https-proxy-agent": "^5.0.0",
-        "is-potential-custom-element-name": "^1.0.1",
-        "nwsapi": "^2.2.0",
-        "parse5": "6.0.1",
-        "saxes": "^5.0.1",
-        "symbol-tree": "^3.2.4",
-        "tough-cookie": "^4.0.0",
-        "w3c-hr-time": "^1.0.2",
-        "w3c-xmlserializer": "^2.0.0",
-        "webidl-conversions": "^6.1.0",
-        "whatwg-encoding": "^1.0.5",
-        "whatwg-mimetype": "^2.3.0",
-        "whatwg-url": "^8.5.0",
-        "ws": "^7.4.6",
-        "xml-name-validator": "^3.0.0"
-      },
-      "dependencies": {
-        "form-data": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-3.0.1.tgz",
-          "integrity": "sha512-RHkBKtLWUVwd7SqRIvCZMEvAMoGUp0XU+seQiZejj0COz3RI3hWP4sCv3gZWWLjJTd7rGwcsF5eKZGii0r/hbg==",
-          "dev": true,
-          "requires": {
-            "asynckit": "^0.4.0",
-            "combined-stream": "^1.0.8",
-            "mime-types": "^2.1.12"
-          }
-        },
-        "xml-name-validator": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-3.0.0.tgz",
-          "integrity": "sha512-A5CUptxDsvxKJEU3yO6DuWBSJz/qizqzJKOMIfUJHETbBw/sFaDxgd6fxm1ewUaM0jZ444Fc5vC5ROYurg/4Pw==",
-          "dev": true
-        }
-      }
-    },
-    "jsdom-global": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/jsdom-global/-/jsdom-global-3.0.2.tgz",
-      "integrity": "sha512-t1KMcBkz/pT5JrvcJbpUR2u/w1kO9jXctaaGJ0vZDzwFnIvGWw9IDSRciT83kIs8Bnw4qpOl8bQK08V01YgMPg==",
-      "dev": true,
-      "requires": {}
-    },
-    "jsesc": {
-      "version": "2.5.2",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz",
-      "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
-      "dev": true,
-      "peer": true
-    },
-    "json-buffer": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
-      "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==",
-      "dev": true
-    },
-    "json-parse-better-errors": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz",
-      "integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==",
-      "dev": true
-    },
-    "json-parse-even-better-errors": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
-      "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
-      "dev": true
-    },
-    "json-schema-traverse": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
-      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
-      "dev": true
-    },
-    "json-stable-stringify-without-jsonify": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
-      "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==",
-      "dev": true
-    },
-    "json5": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
-      "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
-      "dev": true,
-      "peer": true
-    },
-    "jsonc-parser": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.0.tgz",
-      "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==",
-      "dev": true
-    },
-    "jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "^4.1.6",
-        "universalify": "^2.0.0"
-      }
-    },
-    "jstransformer": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/jstransformer/-/jstransformer-1.0.0.tgz",
-      "integrity": "sha512-C9YK3Rf8q6VAPDCCU9fnqo3mAfOH6vUGnMcP4AQAYIEpWtfGLpwOTmZ+igtdK5y+VvI2n3CyYSzy4Qh34eq24A==",
-      "dev": true,
-      "requires": {
-        "is-promise": "^2.0.0",
-        "promise": "^7.0.1"
-      }
-    },
-    "jszip": {
-      "version": "3.10.1",
-      "resolved": "https://registry.npmjs.org/jszip/-/jszip-3.10.1.tgz",
-      "integrity": "sha512-xXDvecyTpGLrqFrvkrUSoxxfJI5AH7U8zxxtVclpsUtMCq4JQ290LY8AW5c7Ggnr/Y/oK+bQMbqK2qmtk3pN4g==",
-      "dev": true,
-      "requires": {
-        "lie": "~3.3.0",
-        "pako": "~1.0.2",
-        "readable-stream": "~2.3.6",
-        "setimmediate": "^1.0.5"
-      },
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "2.3.8",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-          "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
-          "dev": true,
-          "requires": {
-            "core-util-is": "~1.0.0",
-            "inherits": "~2.0.3",
-            "isarray": "~1.0.0",
-            "process-nextick-args": "~2.0.0",
-            "safe-buffer": "~5.1.1",
-            "string_decoder": "~1.1.1",
-            "util-deprecate": "~1.0.1"
-          }
-        },
-        "safe-buffer": {
-          "version": "5.1.2",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-          "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-          "dev": true
-        },
-        "string_decoder": {
-          "version": "1.1.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-          "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-          "dev": true,
-          "requires": {
-            "safe-buffer": "~5.1.0"
-          }
-        }
-      }
-    },
-    "just-extend": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-4.2.1.tgz",
-      "integrity": "sha512-g3UB796vUFIY90VIv/WX3L2c8CS2MdWUww3CNrYmqza1Fg0DURc2K/O4YrnklBdQarSJ/y8JnJYDGc+1iumQjg==",
-      "dev": true
-    },
-    "keyv": {
-      "version": "4.5.4",
-      "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
-      "integrity": "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==",
-      "dev": true,
-      "requires": {
-        "json-buffer": "3.0.1"
-      }
-    },
-    "kind-of": {
-      "version": "6.0.3",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
-      "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
-      "dev": true
-    },
-    "klaw-sync": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/klaw-sync/-/klaw-sync-6.0.0.tgz",
-      "integrity": "sha512-nIeuVSzdCCs6TDPTqI8w1Yre34sSq7AkZ4B3sfOBbI2CgVSB4Du4aLQijFU2+lhAFCwt9+42Hel6lQNIv6AntQ==",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "^4.1.11"
-      }
-    },
-    "known-css-properties": {
-      "version": "0.29.0",
-      "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.29.0.tgz",
-      "integrity": "sha512-Ne7wqW7/9Cz54PDt4I3tcV+hAyat8ypyOGzYRJQfdxnnjeWsTxt1cy8pjvvKeI5kfXuyvULyeeAvwvvtAX3ayQ==",
-      "dev": true
-    },
-    "kolorist": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/kolorist/-/kolorist-1.8.0.tgz",
-      "integrity": "sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==",
-      "dev": true
-    },
-    "lazystream": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.1.tgz",
-      "integrity": "sha512-b94GiNHQNy6JNTrt5w6zNyffMrNkXZb3KTkCZJb2V1xaEGCk093vkZ2jk3tpaeP33/OiXC+WvK9AxUebnf5nbw==",
-      "dev": true,
-      "requires": {
-        "readable-stream": "^2.0.5"
-      },
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "2.3.8",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-          "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
-          "dev": true,
-          "requires": {
-            "core-util-is": "~1.0.0",
-            "inherits": "~2.0.3",
-            "isarray": "~1.0.0",
-            "process-nextick-args": "~2.0.0",
-            "safe-buffer": "~5.1.1",
-            "string_decoder": "~1.1.1",
-            "util-deprecate": "~1.0.1"
-          }
-        },
-        "safe-buffer": {
-          "version": "5.1.2",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-          "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-          "dev": true
-        },
-        "string_decoder": {
-          "version": "1.1.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-          "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-          "dev": true,
-          "requires": {
-            "safe-buffer": "~5.1.0"
-          }
-        }
-      }
-    },
-    "levn": {
-      "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
-      "integrity": "sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==",
-      "dev": true,
-      "requires": {
-        "prelude-ls": "^1.2.1",
-        "type-check": "~0.4.0"
-      }
-    },
-    "lie": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/lie/-/lie-3.3.0.tgz",
-      "integrity": "sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==",
-      "dev": true,
-      "requires": {
-        "immediate": "~3.0.5"
-      }
-    },
-    "lines-and-columns": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
-      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
-      "dev": true
-    },
-    "load-json-file": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-4.0.0.tgz",
-      "integrity": "sha512-Kx8hMakjX03tiGTLAIdJ+lL0htKnXjEZN6hk/tozf/WOuYGdZBJrZ+rCJRbVCugsjB3jMLn9746NsQIf5VjBMw==",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "^4.1.2",
-        "parse-json": "^4.0.0",
-        "pify": "^3.0.0",
-        "strip-bom": "^3.0.0"
-      },
-      "dependencies": {
-        "parse-json": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz",
-          "integrity": "sha512-aOIos8bujGN93/8Ox/jPLh7RwVnPEysynVFE+fQZyg6jKELEHwzgKdLRFHUgXJL6kylijVSBC4BvN9OmsB48Rw==",
-          "dev": true,
-          "requires": {
-            "error-ex": "^1.3.1",
-            "json-parse-better-errors": "^1.0.1"
-          }
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
-          "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==",
-          "dev": true
-        }
-      }
-    },
-    "local-pkg": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-0.5.0.tgz",
-      "integrity": "sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==",
-      "dev": true,
-      "requires": {
-        "mlly": "^1.4.2",
-        "pkg-types": "^1.0.3"
-      }
-    },
-    "locate-path": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
-      "integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==",
-      "dev": true,
-      "requires": {
-        "p-locate": "^5.0.0"
-      }
-    },
-    "lodash": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
-      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
-      "dev": true
-    },
-    "lodash-es": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
-      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
-      "dev": true
-    },
-    "lodash._arraycopy": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz",
-      "integrity": "sha512-RHShTDnPKP7aWxlvXKiDT6IX2jCs6YZLCtNhOru/OX2Q/tzX295vVBK5oX1ECtN+2r86S0Ogy8ykP1sgCZAN0A==",
-      "dev": true
-    },
-    "lodash._arrayeach": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz",
-      "integrity": "sha512-Mn7HidOVcl3mkQtbPsuKR0Fj0N6Q6DQB77CtYncZcJc0bx5qv2q4Gl6a0LC1AN+GSxpnBDNnK3CKEm9XNA4zqQ==",
-      "dev": true
-    },
-    "lodash._baseassign": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz",
-      "integrity": "sha512-t3N26QR2IdSN+gqSy9Ds9pBu/J1EAFEshKlUHpJG3rvyJOYgcELIxcIeKKfZk7sjOz11cFfzJRsyFry/JyabJQ==",
-      "dev": true,
-      "requires": {
-        "lodash._basecopy": "^3.0.0",
-        "lodash.keys": "^3.0.0"
-      }
-    },
-    "lodash._baseclone": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz",
-      "integrity": "sha512-1K0dntf2dFQ5my0WoGKkduewR6+pTNaqX03kvs45y7G5bzl4B3kTR4hDfJIc2aCQDeLyQHhS280tc814m1QC1Q==",
-      "dev": true,
-      "requires": {
-        "lodash._arraycopy": "^3.0.0",
-        "lodash._arrayeach": "^3.0.0",
-        "lodash._baseassign": "^3.0.0",
-        "lodash._basefor": "^3.0.0",
-        "lodash.isarray": "^3.0.0",
-        "lodash.keys": "^3.0.0"
-      }
-    },
-    "lodash._basecopy": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
-      "integrity": "sha512-rFR6Vpm4HeCK1WPGvjZSJ+7yik8d8PVUdCJx5rT2pogG4Ve/2ZS7kfmO5l5T2o5V2mqlNIfSF5MZlr1+xOoYQQ==",
-      "dev": true
-    },
-    "lodash._basefor": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz",
-      "integrity": "sha512-6bc3b8grkpMgDcVJv9JYZAk/mHgcqMljzm7OsbmcE2FGUMmmLQTPHlh/dFqR8LA0GQ7z4K67JSotVKu5058v1A==",
-      "dev": true
-    },
-    "lodash._bindcallback": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz",
-      "integrity": "sha512-2wlI0JRAGX8WEf4Gm1p/mv/SZ+jLijpj0jyaE/AXeuQphzCgD8ZQW4oSpoN8JAopujOFGU3KMuq7qfHBWlGpjQ==",
-      "dev": true
-    },
-    "lodash._getnative": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
-      "integrity": "sha512-RrL9VxMEPyDMHOd9uFbvMe8X55X16/cGM5IgOKgRElQZutpX89iS6vwl64duTV1/16w5JY7tuFNXqoekmh1EmA==",
-      "dev": true
-    },
-    "lodash._isiterateecall": {
-      "version": "3.0.9",
-      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
-      "integrity": "sha512-De+ZbrMu6eThFti/CSzhRvTKMgQToLxbij58LMfM8JnYDNSOjkjTCIaa8ixglOeGh2nyPlakbt5bJWJ7gvpYlQ==",
-      "dev": true
-    },
-    "lodash.clone": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-3.0.3.tgz",
-      "integrity": "sha512-yVYPpFTdZDCLG2p07gVRTvcwN5X04oj2hu4gG6r0fer58JA08wAVxXzWM+CmmxO2bzOH8u8BkZTZqgX6juVF7A==",
-      "dev": true,
-      "requires": {
-        "lodash._baseclone": "^3.0.0",
-        "lodash._bindcallback": "^3.0.0",
-        "lodash._isiterateecall": "^3.0.0"
-      }
-    },
-    "lodash.debounce": {
-      "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
-      "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==",
-      "dev": true
-    },
-    "lodash.defaults": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
-      "integrity": "sha512-qjxPLHd3r5DnsdGacqOMU6pb/avJzdh9tFX2ymgoZE27BmjXrNy/y4LoaiTeAb+O3gL8AfpJGtqfX/ae2leYYQ==",
-      "dev": true
-    },
-    "lodash.defaultsdeep": {
-      "version": "4.6.1",
-      "resolved": "https://registry.npmjs.org/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.1.tgz",
-      "integrity": "sha512-3j8wdDzYuWO3lM3Reg03MuQR957t287Rpcxp1njpEa8oDrikb+FwGdW3n+FELh/A6qib6yPit0j/pv9G/yeAqA==",
-      "dev": true
-    },
-    "lodash.difference": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.difference/-/lodash.difference-4.5.0.tgz",
-      "integrity": "sha512-dS2j+W26TQ7taQBGN8Lbbq04ssV3emRw4NY58WErlTO29pIqS0HmoT5aJ9+TUQ1N3G+JOZSji4eugsWwGp9yPA==",
-      "dev": true
-    },
-    "lodash.escape": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-4.0.1.tgz",
-      "integrity": "sha512-nXEOnb/jK9g0DYMr1/Xvq6l5xMD7GDG55+GSYIYmS0G4tBk/hURD4JR9WCavs04t33WmJx9kCyp9vJ+mr4BOUw==",
-      "dev": true
-    },
-    "lodash.flatten": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
-      "integrity": "sha512-C5N2Z3DgnnKr0LOpv/hKCgKdb7ZZwafIrsesve6lmzvZIRZRGaZ/l6Q8+2W7NaT+ZwO3fFlSCzCzrDCFdJfZ4g==",
-      "dev": true
-    },
-    "lodash.get": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
-      "integrity": "sha512-z+Uw/vLuy6gQe8cfaFWD7p0wVv8fJl3mbzXh33RS+0oW2wvUqiRXiQ69gLWSLpgB5/6sU+r6BlQR0MBILadqTQ==",
-      "dev": true
-    },
-    "lodash.isarguments": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
-      "integrity": "sha512-chi4NHZlZqZD18a0imDHnZPrDeBbTtVN7GXMwuGdRH9qotxAjYs3aVLKc7zNOG9eddR5Ksd8rvFEBc9SsggPpg==",
-      "dev": true
-    },
-    "lodash.isarray": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
-      "integrity": "sha512-JwObCrNJuT0Nnbuecmqr5DgtuBppuCvGD9lxjFpAzwnVtdGoDQ1zig+5W8k5/6Gcn0gZ3936HDAlGd28i7sOGQ==",
-      "dev": true
-    },
-    "lodash.isequal": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
-      "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==",
-      "dev": true
-    },
-    "lodash.isplainobject": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-      "integrity": "sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA==",
-      "dev": true
-    },
-    "lodash.keys": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
-      "integrity": "sha512-CuBsapFjcubOGMn3VD+24HOAPxM79tH+V6ivJL3CHYjtrawauDJHUk//Yew9Hvc6e9rbCrURGk8z6PC+8WJBfQ==",
-      "dev": true,
-      "requires": {
-        "lodash._getnative": "^3.0.0",
-        "lodash.isarguments": "^3.0.0",
-        "lodash.isarray": "^3.0.0"
-      }
-    },
-    "lodash.map": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz",
-      "integrity": "sha512-worNHGKLDetmcEYDvh2stPCrrQRkP20E4l0iIS7F8EvzMqBBi7ltvFN5m1HvTf1P7Jk1txKhvFcmYsCr8O2F1Q==",
-      "dev": true
-    },
-    "lodash.memoize": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
-      "integrity": "sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag==",
-      "dev": true
-    },
-    "lodash.merge": {
-      "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
-      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
-      "dev": true
-    },
-    "lodash.mergewith": {
-      "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.2.tgz",
-      "integrity": "sha512-GK3g5RPZWTRSeLSpgP8Xhra+pnjBC56q9FZYe1d5RN3TJ35dbkGy3YqBSMbyCrlbi+CM9Z3Jk5yTL7RCsqboyQ==",
-      "dev": true,
-      "optional": true
-    },
-    "lodash.pick": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
-      "integrity": "sha512-hXt6Ul/5yWjfklSGvLQl8vM//l3FtyHZeuelpzK6mm99pNvN9yTDruNZPEJZD1oWrqo+izBmB7oUfWgcCX7s4Q==",
-      "dev": true
-    },
-    "lodash.truncate": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz",
-      "integrity": "sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==",
-      "dev": true
-    },
-    "lodash.union": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.union/-/lodash.union-4.6.0.tgz",
-      "integrity": "sha512-c4pB2CdGrGdjMKYLA+XiRDO7Y0PRQbm/Gzg8qMj+QH+pFVAoTp5sBpO0odL3FjoPCGjK96p6qsP+yQoiLoOBcw==",
-      "dev": true
-    },
-    "lodash.uniq": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
-      "integrity": "sha512-xfBaXQd9ryd9dlSDvnvI0lvxfLJlYAZzXomUYzLKtUeOQvOP5piqAWuGtrhWeqaXK9hhoM/iyJc5AV+XfsX3HQ==",
-      "dev": true,
-      "optional": true
-    },
-    "log-symbols": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-4.1.0.tgz",
-      "integrity": "sha512-8XPvpAA8uyhfteu8pIvQxpJZ7SYYdpUivZpGy6sFsBuKRY/7rQGavedeB8aK+Zkyq6upMFVL/9AW6vOYzfRyLg==",
-      "dev": true,
-      "requires": {
-        "chalk": "^4.1.0",
-        "is-unicode-supported": "^0.1.0"
-      }
-    },
-    "loglevel": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.8.1.tgz",
-      "integrity": "sha512-tCRIJM51SHjAayKwC+QAg8hT8vg6z7GSgLJKGvzuPb1Wc+hLzqtuVLxp6/HzSPOozuK+8ErAhy7U/sVzw8Dgfg==",
-      "dev": true
-    },
-    "longest": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/longest/-/longest-2.0.1.tgz",
-      "integrity": "sha512-Ajzxb8CM6WAnFjgiloPsI3bF+WCxcvhdIG3KNA2KN962+tdBsHcuQ4k4qX/EcS/2CRkcc0iAkR956Nib6aXU/Q==",
-      "dev": true
-    },
-    "loupe": {
-      "version": "2.3.4",
-      "resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.4.tgz",
-      "integrity": "sha512-OvKfgCC2Ndby6aSTREl5aCCPTNIzlDfQZvZxNUrBrihDhL3xcrYegTblhmEiCrg2kKQz4XsFIaemE5BF4ybSaQ==",
-      "dev": true,
-      "requires": {
-        "get-func-name": "^2.0.0"
-      }
-    },
-    "lru-cache": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
-      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "dev": true,
-      "requires": {
-        "yallist": "^3.0.2"
-      }
-    },
-    "magic-string": {
-      "version": "0.30.5",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.5.tgz",
-      "integrity": "sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==",
-      "requires": {
-        "@jridgewell/sourcemap-codec": "^1.4.15"
-      }
-    },
-    "make-dir": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz",
-      "integrity": "sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==",
-      "dev": true,
-      "requires": {
-        "semver": "^7.5.3"
-      },
-      "dependencies": {
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "make-error": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
-      "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==",
-      "dev": true
-    },
-    "mathml-tag-names": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/mathml-tag-names/-/mathml-tag-names-2.1.3.tgz",
-      "integrity": "sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==",
-      "dev": true
-    },
-    "mdn-data": {
-      "version": "2.0.30",
-      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz",
-      "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==",
-      "dev": true
-    },
-    "memorystream": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/memorystream/-/memorystream-0.3.1.tgz",
-      "integrity": "sha512-S3UwM3yj5mtUSEfP41UZmt/0SCoVYUcU1rkXv+BQ5Ig8ndL4sPoJNBUJERafdPb5jjHJGuMgytgKvKIf58XNBw==",
-      "dev": true
-    },
-    "meow": {
-      "version": "13.0.0",
-      "resolved": "https://registry.npmjs.org/meow/-/meow-13.0.0.tgz",
-      "integrity": "sha512-4Hu+75Vo7EOR+8C9RmkabfLijuwd9SrzQ8f0SyC4qZZwU6BlxeOt5ulF3PGCpcMJX4hI+ktpJhea0P6PN1RiWw==",
-      "dev": true
-    },
-    "merge": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/merge/-/merge-2.1.1.tgz",
-      "integrity": "sha512-jz+Cfrg9GWOZbQAnDQ4hlVnQky+341Yk5ru8bZSe6sIDTCIg8n9i/u7hSQGSVOF3C7lH6mGtqjkiT9G4wFLL0w==",
-      "dev": true
-    },
-    "merge-stream": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
-      "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==",
-      "dev": true
-    },
-    "merge2": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
-      "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
-      "dev": true
-    },
-    "micromatch": {
-      "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz",
-      "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==",
-      "dev": true,
-      "requires": {
-        "braces": "^3.0.2",
-        "picomatch": "^2.3.1"
-      }
-    },
-    "mime-db": {
-      "version": "1.52.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
-      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
-      "dev": true
-    },
-    "mime-types": {
-      "version": "2.1.35",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
-      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
-      "dev": true,
-      "requires": {
-        "mime-db": "1.52.0"
-      }
-    },
-    "mimic-fn": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
-      "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==",
-      "dev": true
-    },
-    "minimatch": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
-      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
-      "dev": true,
-      "requires": {
-        "brace-expansion": "^1.1.7"
-      }
-    },
-    "minimist": {
-      "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.7.tgz",
-      "integrity": "sha512-bzfL1YUZsP41gmu/qjrEk0Q6i2ix/cVeAhbCbqH9u3zYutS1cLg00qhrD0M2MVdCcx4Sc0UpP2eBWo9rotpq6g==",
-      "dev": true
-    },
-    "minipass": {
-      "version": "7.0.4",
-      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.0.4.tgz",
-      "integrity": "sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==",
-      "dev": true
-    },
-    "mitt": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
-      "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==",
-      "dev": true
-    },
-    "mlly": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.4.2.tgz",
-      "integrity": "sha512-i/Ykufi2t1EZ6NaPLdfnZk2AX8cs0d+mTzVKuPfqPKPatxLApaBoxJQ9x1/uckXtrS/U5oisPMDkNs0yQTaBRg==",
-      "dev": true,
-      "requires": {
-        "acorn": "^8.10.0",
-        "pathe": "^1.1.1",
-        "pkg-types": "^1.0.3",
-        "ufo": "^1.3.0"
-      }
-    },
-    "mocha": {
-      "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/mocha/-/mocha-10.2.0.tgz",
-      "integrity": "sha512-IDY7fl/BecMwFHzoqF2sg/SHHANeBoMMXFlS9r0OXKDssYE1M5O43wUY/9BVPeIvfH2zmEbBfseqN9gBQZzXkg==",
-      "dev": true,
-      "requires": {
-        "ansi-colors": "4.1.1",
-        "browser-stdout": "1.3.1",
-        "chokidar": "3.5.3",
-        "debug": "4.3.4",
-        "diff": "5.0.0",
-        "escape-string-regexp": "4.0.0",
-        "find-up": "5.0.0",
-        "glob": "7.2.0",
-        "he": "1.2.0",
-        "js-yaml": "4.1.0",
-        "log-symbols": "4.1.0",
-        "minimatch": "5.0.1",
-        "ms": "2.1.3",
-        "nanoid": "3.3.3",
-        "serialize-javascript": "6.0.0",
-        "strip-json-comments": "3.1.1",
-        "supports-color": "8.1.1",
-        "workerpool": "6.2.1",
-        "yargs": "16.2.0",
-        "yargs-parser": "20.2.4",
-        "yargs-unparser": "2.0.0"
-      },
-      "dependencies": {
-        "glob": {
-          "version": "7.2.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.0.tgz",
-          "integrity": "sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==",
-          "dev": true,
-          "requires": {
-            "fs.realpath": "^1.0.0",
-            "inflight": "^1.0.4",
-            "inherits": "2",
-            "minimatch": "^3.0.4",
-            "once": "^1.3.0",
-            "path-is-absolute": "^1.0.0"
-          },
-          "dependencies": {
-            "minimatch": {
-              "version": "3.1.2",
-              "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
-              "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
-              "dev": true,
-              "requires": {
-                "brace-expansion": "^1.1.7"
-              }
-            }
-          }
-        },
-        "minimatch": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.0.1.tgz",
-          "integrity": "sha512-nLDxIFRyhDblz3qMuq+SoRZED4+miJ/G+tdDrjkkkRnjAsBexeGpgjLEQ0blJy7rHhR2b93rhQY4SvyWu9v03g==",
-          "dev": true,
-          "requires": {
-            "brace-expansion": "^2.0.1"
-          },
-          "dependencies": {
-            "brace-expansion": {
-              "version": "2.0.1",
-              "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-              "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-              "dev": true,
-              "requires": {
-                "balanced-match": "^1.0.0"
-              }
-            }
-          }
-        },
-        "ms": {
-          "version": "2.1.3",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
-          "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
-          "dev": true
-        },
-        "supports-color": {
-          "version": "8.1.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
-          "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
-          "dev": true,
-          "requires": {
-            "has-flag": "^4.0.0"
-          }
-        },
-        "yargs-parser": {
-          "version": "20.2.4",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.4.tgz",
-          "integrity": "sha512-WOkpgNhPTlE73h4VFAFsOnomJVaovO8VqLDzy5saChRBFQFBoMYirowyW+Q9HB4HFF4Z7VZTiG3iSzJJA29yRA==",
-          "dev": true
-        }
-      }
-    },
-    "ms": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
-      "dev": true
-    },
-    "muggle-string": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/muggle-string/-/muggle-string-0.3.1.tgz",
-      "integrity": "sha512-ckmWDJjphvd/FvZawgygcUeQCxzvohjFO5RxTjj4eq8kw359gFF3E1brjfI+viLMxss5JrHTDRHZvu2/tuy0Qg==",
-      "dev": true
-    },
-    "mute-stream": {
-      "version": "0.0.8",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.8.tgz",
-      "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==",
-      "dev": true
-    },
-    "nanoid": {
-      "version": "3.3.3",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.3.tgz",
-      "integrity": "sha512-p1sjXuopFs0xg+fPASzQ28agW1oHD7xDsd9Xkf3T15H3c/cifrFHVwrh74PdoklAPi+i7MdRsE47vm2r6JoB+w==",
-      "dev": true
-    },
-    "natural-compare": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
-      "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
-      "dev": true
-    },
-    "natural-compare-lite": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/natural-compare-lite/-/natural-compare-lite-1.4.0.tgz",
-      "integrity": "sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g==",
-      "dev": true
-    },
-    "netmask": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/netmask/-/netmask-2.0.2.tgz",
-      "integrity": "sha512-dBpDMdxv9Irdq66304OLfEmQ9tbNRFnFTuZiLo+bD+r332bBmMJ8GBLXklIXXgxd3+v9+KUnZaUR5PJMa75Gsg==",
-      "dev": true
-    },
-    "nice-napi": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz",
-      "integrity": "sha512-px/KnJAJZf5RuBGcfD+Sp2pAKq0ytz8j+1NehvgIGFkvtvFrDM3T8E4x/JJODXK9WZow8RRGrbA9QQ3hs+pDhA==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "node-addon-api": "^3.0.0",
-        "node-gyp-build": "^4.2.2"
-      }
-    },
-    "nice-try": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
-      "integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==",
-      "dev": true
-    },
-    "nightwatch": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/nightwatch/-/nightwatch-3.3.2.tgz",
-      "integrity": "sha512-qi/1glgvJjWrtHBm1vQJfLc4XocqfSqJ3E27Rlg8ofeYC5mLBnKqmJg4u268voIUg+4fQkMm0UYKDtF/0Es4Ag==",
-      "dev": true,
-      "requires": {
-        "@nightwatch/chai": "5.0.2",
-        "@nightwatch/html-reporter-template": "0.2.1",
-        "@nightwatch/nightwatch-inspector": "^1.0.1",
-        "@types/chai": "^4.3.5",
-        "@types/selenium-webdriver": "^4.1.14",
-        "ansi-to-html": "0.7.2",
-        "aria-query": "5.1.3",
-        "assertion-error": "1.1.0",
-        "boxen": "5.1.2",
-        "chai-nightwatch": "^0.5.3",
-        "chalk": "^4.1.2",
-        "ci-info": "3.3.0",
-        "cli-table3": "^0.6.3",
-        "devtools-protocol": "^0.0.1140464",
-        "didyoumean": "^1.2.2",
-        "dotenv": "16.3.1",
-        "ejs": "3.1.8",
-        "envinfo": "7.11.0",
-        "glob": "7.2.3",
-        "jsdom": "21.1.2",
-        "lodash.clone": "3.0.3",
-        "lodash.defaultsdeep": "4.6.1",
-        "lodash.escape": "4.0.1",
-        "lodash.merge": "4.6.2",
-        "lodash.pick": "4.4.0",
-        "minimatch": "3.1.2",
-        "minimist": "1.2.6",
-        "mocha": "10.2.0",
-        "nightwatch-axe-verbose": "^2.2.2",
-        "open": "8.4.2",
-        "ora": "5.4.1",
-        "piscina": "3.2.0",
-        "selenium-webdriver": "4.14.0",
-        "semver": "7.5.4",
-        "stacktrace-parser": "0.1.10",
-        "strip-ansi": "6.0.1",
-        "untildify": "4.0.0",
-        "uuid": "8.3.2"
-      },
-      "dependencies": {
-        "@tootallnate/once": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz",
-          "integrity": "sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==",
-          "dev": true
-        },
-        "acorn-globals": {
-          "version": "7.0.1",
-          "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-7.0.1.tgz",
-          "integrity": "sha512-umOSDSDrfHbTNPuNpC2NSnnA3LUrqpevPb4T9jRx4MagXNS0rs+gwiTcAvqCRmsD6utzsrzNt+ebm00SNWiC3Q==",
-          "dev": true,
-          "requires": {
-            "acorn": "^8.1.0",
-            "acorn-walk": "^8.0.2"
-          }
-        },
-        "acorn-walk": {
-          "version": "8.3.0",
-          "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.0.tgz",
-          "integrity": "sha512-FS7hV565M5l1R08MXqo8odwMTB02C2UqzB17RVgu9EyuYFBqJZ3/ZY97sQD5FewVu1UyDFc1yztUDrAwT0EypA==",
-          "dev": true
-        },
-        "ci-info": {
-          "version": "3.3.0",
-          "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-3.3.0.tgz",
-          "integrity": "sha512-riT/3vI5YpVH6/qomlDnJow6TBee2PBKSEpx3O32EGPYbWGIRsIlGRms3Sm74wYE1JMo8RnO04Hb12+v1J5ICw==",
-          "dev": true
-        },
-        "cssstyle": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-3.0.0.tgz",
-          "integrity": "sha512-N4u2ABATi3Qplzf0hWbVCdjenim8F3ojEXpBDF5hBpjzW182MjNGLqfmQ0SkSPeQ+V86ZXgeH8aXj6kayd4jgg==",
-          "dev": true,
-          "requires": {
-            "rrweb-cssom": "^0.6.0"
-          }
-        },
-        "data-urls": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-4.0.0.tgz",
-          "integrity": "sha512-/mMTei/JXPqvFqQtfyTowxmJVwr2PVAeCcDxyFf6LhoOu/09TX2OX3kb2wzi4DMXcfj4OItwDOnhl5oziPnT6g==",
-          "dev": true,
-          "requires": {
-            "abab": "^2.0.6",
-            "whatwg-mimetype": "^3.0.0",
-            "whatwg-url": "^12.0.0"
-          }
-        },
-        "domexception": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/domexception/-/domexception-4.0.0.tgz",
-          "integrity": "sha512-A2is4PLG+eeSfoTMA95/s4pvAoSo2mKtiM5jlHkAVewmiO8ISFTFKZjH7UAM1Atli/OT/7JHOrJRJiMKUZKYBw==",
-          "dev": true,
-          "requires": {
-            "webidl-conversions": "^7.0.0"
-          }
-        },
-        "entities": {
-          "version": "4.5.0",
-          "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
-          "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
-          "dev": true
-        },
-        "html-encoding-sniffer": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz",
-          "integrity": "sha512-oWv4T4yJ52iKrufjnyZPkrN0CH3QnrUqdB6In1g5Fe1mia8GmF36gnfNySxoZtxD5+NmYw1EElVXiBk93UeskA==",
-          "dev": true,
-          "requires": {
-            "whatwg-encoding": "^2.0.0"
-          }
-        },
-        "http-proxy-agent": {
-          "version": "5.0.0",
-          "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-5.0.0.tgz",
-          "integrity": "sha512-n2hY8YdoRE1i7r6M0w9DIw5GgZN0G25P8zLCRQ8rjXtTU3vsNFBI/vWK/UIeE6g5MUUz6avwAPXmL6Fy9D/90w==",
-          "dev": true,
-          "requires": {
-            "@tootallnate/once": "2",
-            "agent-base": "6",
-            "debug": "4"
-          }
-        },
-        "iconv-lite": {
-          "version": "0.6.3",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
-          "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
-          "dev": true,
-          "requires": {
-            "safer-buffer": ">= 2.1.2 < 3.0.0"
-          }
-        },
-        "jsdom": {
-          "version": "21.1.2",
-          "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-21.1.2.tgz",
-          "integrity": "sha512-sCpFmK2jv+1sjff4u7fzft+pUh2KSUbUrEHYHyfSIbGTIcmnjyp83qg6qLwdJ/I3LpTXx33ACxeRL7Lsyc6lGQ==",
-          "dev": true,
-          "requires": {
-            "abab": "^2.0.6",
-            "acorn": "^8.8.2",
-            "acorn-globals": "^7.0.0",
-            "cssstyle": "^3.0.0",
-            "data-urls": "^4.0.0",
-            "decimal.js": "^10.4.3",
-            "domexception": "^4.0.0",
-            "escodegen": "^2.0.0",
-            "form-data": "^4.0.0",
-            "html-encoding-sniffer": "^3.0.0",
-            "http-proxy-agent": "^5.0.0",
-            "https-proxy-agent": "^5.0.1",
-            "is-potential-custom-element-name": "^1.0.1",
-            "nwsapi": "^2.2.4",
-            "parse5": "^7.1.2",
-            "rrweb-cssom": "^0.6.0",
-            "saxes": "^6.0.0",
-            "symbol-tree": "^3.2.4",
-            "tough-cookie": "^4.1.2",
-            "w3c-xmlserializer": "^4.0.0",
-            "webidl-conversions": "^7.0.0",
-            "whatwg-encoding": "^2.0.0",
-            "whatwg-mimetype": "^3.0.0",
-            "whatwg-url": "^12.0.1",
-            "ws": "^8.13.0",
-            "xml-name-validator": "^4.0.0"
-          }
-        },
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "minimist": {
-          "version": "1.2.6",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
-          "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==",
-          "dev": true
-        },
-        "parse5": {
-          "version": "7.1.2",
-          "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz",
-          "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
-          "dev": true,
-          "requires": {
-            "entities": "^4.4.0"
-          }
-        },
-        "saxes": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
-          "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
-          "dev": true,
-          "requires": {
-            "xmlchars": "^2.2.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "tr46": {
-          "version": "4.1.1",
-          "resolved": "https://registry.npmjs.org/tr46/-/tr46-4.1.1.tgz",
-          "integrity": "sha512-2lv/66T7e5yNyhAAC4NaKe5nVavzuGJQVVtRYLyQ2OI8tsJ61PMLlelehb0wi2Hx6+hT/OJUWZcw8MjlSRnxvw==",
-          "dev": true,
-          "requires": {
-            "punycode": "^2.3.0"
-          }
-        },
-        "w3c-xmlserializer": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz",
-          "integrity": "sha512-d+BFHzbiCx6zGfz0HyQ6Rg69w9k19nviJspaj4yNscGjrHu94sVP+aRm75yEbCh+r2/yR+7q6hux9LVtbuTGBw==",
-          "dev": true,
-          "requires": {
-            "xml-name-validator": "^4.0.0"
-          }
-        },
-        "webidl-conversions": {
-          "version": "7.0.0",
-          "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
-          "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
-          "dev": true
-        },
-        "whatwg-encoding": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz",
-          "integrity": "sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==",
-          "dev": true,
-          "requires": {
-            "iconv-lite": "0.6.3"
-          }
-        },
-        "whatwg-mimetype": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz",
-          "integrity": "sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==",
-          "dev": true
-        },
-        "whatwg-url": {
-          "version": "12.0.1",
-          "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-12.0.1.tgz",
-          "integrity": "sha512-Ed/LrqB8EPlGxjS+TrsXcpUond1mhccS3pchLhzSgPCnTimUCKj3IZE75pAs5m6heB2U2TMerKFUXheyHY+VDQ==",
-          "dev": true,
-          "requires": {
-            "tr46": "^4.1.1",
-            "webidl-conversions": "^7.0.0"
-          }
-        },
-        "ws": {
-          "version": "8.14.2",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-8.14.2.tgz",
-          "integrity": "sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g==",
-          "dev": true,
-          "requires": {}
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "nightwatch-axe-verbose": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/nightwatch-axe-verbose/-/nightwatch-axe-verbose-2.2.2.tgz",
-      "integrity": "sha512-MvCrQb9D/ixtGtyN5fh7YCkelXuPup3X9D2Zhhk1PWyALtkdYCFadnIGif1irpQ1BLNSlqC+FDNnsNald7KHYA==",
-      "dev": true,
-      "requires": {
-        "axe-core": "^4.7.2"
-      }
-    },
-    "nise": {
-      "version": "5.1.5",
-      "resolved": "https://registry.npmjs.org/nise/-/nise-5.1.5.tgz",
-      "integrity": "sha512-VJuPIfUFaXNRzETTQEEItTOP8Y171ijr+JLq42wHes3DiryR8vT+1TXQW/Rx8JNUhyYYWyIvjXTU6dOhJcs9Nw==",
-      "dev": true,
-      "requires": {
-        "@sinonjs/commons": "^2.0.0",
-        "@sinonjs/fake-timers": "^10.0.2",
-        "@sinonjs/text-encoding": "^0.7.1",
-        "just-extend": "^4.0.2",
-        "path-to-regexp": "^1.7.0"
-      },
-      "dependencies": {
-        "@sinonjs/commons": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-2.0.0.tgz",
-          "integrity": "sha512-uLa0j859mMrg2slwQYdO/AkrOfmH+X6LTVmNTS9CqexuE2IvVORIkSpJLqePAbEnKJ77aMmCwr1NUZ57120Xcg==",
-          "dev": true,
-          "requires": {
-            "type-detect": "4.0.8"
-          }
-        },
-        "@sinonjs/fake-timers": {
-          "version": "10.3.0",
-          "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-10.3.0.tgz",
-          "integrity": "sha512-V4BG07kuYSUkTCSBHG8G8TNhM+F19jXFWnQtzj+we8DrkpSBCee9Z3Ms8yiGer/dlmhe35/Xdgyo3/0rQKg7YA==",
-          "dev": true,
-          "requires": {
-            "@sinonjs/commons": "^3.0.0"
-          },
-          "dependencies": {
-            "@sinonjs/commons": {
-              "version": "3.0.0",
-              "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.0.tgz",
-              "integrity": "sha512-jXBtWAF4vmdNmZgD5FoKsVLv3rPgDnLgPbU84LIJ3otV44vJlDRokVng5v8NFJdCf/da9legHcKaRuZs4L7faA==",
-              "dev": true,
-              "requires": {
-                "type-detect": "4.0.8"
-              }
-            }
-          }
-        }
-      }
-    },
-    "node-addon-api": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-3.2.1.tgz",
-      "integrity": "sha512-mmcei9JghVNDYydghQmeDX8KoAm0FAiYyIcUt/N4nhyAipB17pllZQDOJD2fotxABnt4Mdz+dKTO7eftLg4d0A==",
-      "dev": true,
-      "optional": true
-    },
-    "node-gyp-build": {
-      "version": "4.7.1",
-      "resolved": "https://registry.npmjs.org/node-gyp-build/-/node-gyp-build-4.7.1.tgz",
-      "integrity": "sha512-wTSrZ+8lsRRa3I3H8Xr65dLWSgCvY2l4AOnaeKdPA9TB/WYMPaTcrzf3rXvFoVvjKNVnu0CcWSx54qq9GKRUYg==",
-      "dev": true,
-      "optional": true
-    },
-    "node-releases": {
-      "version": "2.0.14",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz",
-      "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==",
-      "dev": true
-    },
-    "nopt": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/nopt/-/nopt-7.2.0.tgz",
-      "integrity": "sha512-CVDtwCdhYIvnAzFoJ6NJ6dX3oga9/HyciQDnG1vQDjSLMeKLJ4A93ZqYKDrgYSr1FBY5/hMYC+2VCi24pgpkGA==",
-      "dev": true,
-      "requires": {
-        "abbrev": "^2.0.0"
-      }
-    },
-    "normalize-package-data": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
-      "integrity": "sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==",
-      "dev": true,
-      "requires": {
-        "hosted-git-info": "^2.1.4",
-        "resolve": "^1.10.0",
-        "semver": "2 || 3 || 4 || 5",
-        "validate-npm-package-license": "^3.0.1"
-      },
-      "dependencies": {
-        "semver": {
-          "version": "5.7.2",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
-          "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
-          "dev": true
-        }
-      }
-    },
-    "normalize-path": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
-      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
-      "dev": true
-    },
-    "normalize-range": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
-      "integrity": "sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==",
-      "dev": true
-    },
-    "npm-publish-prerelease": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/npm-publish-prerelease/-/npm-publish-prerelease-1.0.2.tgz",
-      "integrity": "sha512-scAO8ZGgolgb1QsSPOl0rsfyBMseJDdEYebP2IdAQNElcfbhyvd4pZVzN4HYGAJihNO2GSUB4oBS4q/29bNHUw==",
-      "dev": true,
-      "requires": {
-        "semver": "^5.4.1"
-      },
-      "dependencies": {
-        "semver": {
-          "version": "5.7.2",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
-          "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
-          "dev": true
-        }
-      }
-    },
-    "npm-run-all": {
-      "version": "4.1.5",
-      "resolved": "https://registry.npmjs.org/npm-run-all/-/npm-run-all-4.1.5.tgz",
-      "integrity": "sha512-Oo82gJDAVcaMdi3nuoKFavkIHBRVqQ1qvMb+9LHk/cF4P6B2m8aP04hGf7oL6wZ9BuGwX1onlLhpuoofSyoQDQ==",
-      "dev": true,
-      "requires": {
-        "ansi-styles": "^3.2.1",
-        "chalk": "^2.4.1",
-        "cross-spawn": "^6.0.5",
-        "memorystream": "^0.3.1",
-        "minimatch": "^3.0.4",
-        "pidtree": "^0.3.0",
-        "read-pkg": "^3.0.0",
-        "shell-quote": "^1.6.1",
-        "string.prototype.padend": "^3.0.0"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
-          "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-          "dev": true,
-          "requires": {
-            "color-convert": "^1.9.0"
-          }
-        },
-        "chalk": {
-          "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-          "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^3.2.1",
-            "escape-string-regexp": "^1.0.5",
-            "supports-color": "^5.3.0"
-          }
-        },
-        "color-convert": {
-          "version": "1.9.3",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
-          "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-          "dev": true,
-          "requires": {
-            "color-name": "1.1.3"
-          }
-        },
-        "color-name": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-          "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
-          "dev": true
-        },
-        "cross-spawn": {
-          "version": "6.0.5",
-          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
-          "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
-          "dev": true,
-          "requires": {
-            "nice-try": "^1.0.4",
-            "path-key": "^2.0.1",
-            "semver": "^5.5.0",
-            "shebang-command": "^1.2.0",
-            "which": "^1.2.9"
-          }
-        },
-        "escape-string-regexp": {
-          "version": "1.0.5",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-          "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
-          "dev": true
-        },
-        "has-flag": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-          "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
-          "dev": true
-        },
-        "path-key": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
-          "integrity": "sha512-fEHGKCSmUSDPv4uoj8AlD+joPlq3peND+HRYyxFz4KPw4z926S/b8rIuFs2FYJg3BwsxJf6A9/3eIdLaYC+9Dw==",
-          "dev": true
-        },
-        "semver": {
-          "version": "5.7.2",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
-          "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
-          "dev": true
-        },
-        "shebang-command": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
-          "integrity": "sha512-EV3L1+UQWGor21OmnvojK36mhg+TyIKDh3iFBKBohr5xeXIhNBcx8oWdgkTEEQ+BEFFYdLRuqMfd5L84N1V5Vg==",
-          "dev": true,
-          "requires": {
-            "shebang-regex": "^1.0.0"
-          }
-        },
-        "shebang-regex": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
-          "integrity": "sha512-wpoSFAxys6b2a2wHZ1XpDSgD7N9iVjg29Ph9uV/uaP9Ex/KXlkTZTeddxDPSYQpgvzKLGJke2UU0AzoGCjNIvQ==",
-          "dev": true
-        },
-        "supports-color": {
-          "version": "5.5.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
-          "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-          "dev": true,
-          "requires": {
-            "has-flag": "^3.0.0"
-          }
-        },
-        "which": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
-          "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
-          "dev": true,
-          "requires": {
-            "isexe": "^2.0.0"
-          }
-        }
-      }
-    },
-    "npm-run-path": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.2.0.tgz",
-      "integrity": "sha512-W4/tgAXFqFA0iL7fk0+uQ3g7wkL8xJmx3XdK0VGb4cHW//eZTtKGvFBBoRKVTpY7n6ze4NL9ly7rgXcHufqXKg==",
-      "dev": true,
-      "requires": {
-        "path-key": "^4.0.0"
-      },
-      "dependencies": {
-        "path-key": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/path-key/-/path-key-4.0.0.tgz",
-          "integrity": "sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==",
-          "dev": true
-        }
-      }
-    },
-    "nth-check": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz",
-      "integrity": "sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==",
-      "dev": true,
-      "requires": {
-        "boolbase": "^1.0.0"
-      }
-    },
-    "nwsapi": {
-      "version": "2.2.7",
-      "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.7.tgz",
-      "integrity": "sha512-ub5E4+FBPKwAZx0UwIQOjYWGHTEq5sPqHQNRN8Z9e4A7u3Tj1weLJsL59yH9vmvqEtBHaOmT6cYQKIZOxp35FQ==",
-      "dev": true
-    },
-    "object-assign": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
-      "dev": true
-    },
-    "object-inspect": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz",
-      "integrity": "sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==",
-      "dev": true
-    },
-    "object-is": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.5.tgz",
-      "integrity": "sha512-3cyDsyHgtmi7I7DfSSI2LDp6SK2lwvtbg0p0R1e0RvTqF5ceGx+K2dfSjm1bKDMVCFEDAQvy+o8c6a7VujOddw==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.1.3"
-      }
-    },
-    "object-keys": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
-      "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
-      "dev": true
-    },
-    "object.assign": {
-      "version": "4.1.5",
-      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.5.tgz",
-      "integrity": "sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.5",
-        "define-properties": "^1.2.1",
-        "has-symbols": "^1.0.3",
-        "object-keys": "^1.1.1"
-      }
-    },
-    "object.fromentries": {
-      "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.7.tgz",
-      "integrity": "sha512-UPbPHML6sL8PI/mOqPwsH4G6iyXcCGzLin8KvEPenOZN5lpCNBZZQ+V62vdjB1mQHrmqGQt5/OJzemUA+KJmEA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
-      }
-    },
-    "object.groupby": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/object.groupby/-/object.groupby-1.0.1.tgz",
-      "integrity": "sha512-HqaQtqLnp/8Bn4GL16cj+CUYbnpe1bh0TtEaWvybszDG4tgxCJuRpV8VGuvNaI1fAnI4lUJzDG55MXcOH4JZcQ==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1"
-      }
-    },
-    "object.values": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.1.7.tgz",
-      "integrity": "sha512-aU6xnDFYT3x17e/f0IiiwlGPTy2jzMySGfUB4fq6z7CV8l85CWHDk5ErhyhpfDHhrOMwGFhSQkhMGHaIotA6Ng==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
-      }
-    },
-    "once": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
-      "dev": true,
-      "requires": {
-        "wrappy": "1"
-      }
-    },
-    "onetime": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz",
-      "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==",
-      "dev": true,
-      "requires": {
-        "mimic-fn": "^2.1.0"
-      }
-    },
-    "open": {
-      "version": "8.4.2",
-      "resolved": "https://registry.npmjs.org/open/-/open-8.4.2.tgz",
-      "integrity": "sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==",
-      "dev": true,
-      "requires": {
-        "define-lazy-prop": "^2.0.0",
-        "is-docker": "^2.1.1",
-        "is-wsl": "^2.2.0"
-      }
-    },
-    "opencollective-postinstall": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz",
-      "integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==",
-      "dev": true
-    },
-    "optionator": {
-      "version": "0.9.3",
-      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz",
-      "integrity": "sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==",
-      "dev": true,
-      "requires": {
-        "@aashutoshrathi/word-wrap": "^1.2.3",
-        "deep-is": "^0.1.3",
-        "fast-levenshtein": "^2.0.6",
-        "levn": "^0.4.1",
-        "prelude-ls": "^1.2.1",
-        "type-check": "^0.4.0"
-      }
-    },
-    "ora": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/ora/-/ora-5.4.1.tgz",
-      "integrity": "sha512-5b6Y85tPxZZ7QytO+BQzysW31HJku27cRIlkbAXaNx+BdcVi+LlRFmVXzeF6a7JCwJpyw5c4b+YSVImQIrBpuQ==",
-      "dev": true,
-      "requires": {
-        "bl": "^4.1.0",
-        "chalk": "^4.1.0",
-        "cli-cursor": "^3.1.0",
-        "cli-spinners": "^2.5.0",
-        "is-interactive": "^1.0.0",
-        "is-unicode-supported": "^0.1.0",
-        "log-symbols": "^4.1.0",
-        "strip-ansi": "^6.0.0",
-        "wcwidth": "^1.0.1"
-      }
-    },
-    "os-tmpdir": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
-      "integrity": "sha512-D2FR03Vir7FIu45XBY20mTb+/ZSWB00sjU9jdQXt83gDrI4Ztz5Fs7/yy74g2N5SVQY4xY1qDr4rNddwYRVX0g==",
-      "dev": true
-    },
-    "p-limit": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
-      "integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==",
-      "dev": true,
-      "requires": {
-        "yocto-queue": "^0.1.0"
-      }
-    },
-    "p-locate": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz",
-      "integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==",
-      "dev": true,
-      "requires": {
-        "p-limit": "^3.0.2"
-      }
-    },
-    "pac-proxy-agent": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/pac-proxy-agent/-/pac-proxy-agent-7.0.1.tgz",
-      "integrity": "sha512-ASV8yU4LLKBAjqIPMbrgtaKIvxQri/yh2OpI+S6hVa9JRkUI3Y3NPFbfngDtY7oFtSMD3w31Xns89mDa3Feo5A==",
-      "dev": true,
-      "requires": {
-        "@tootallnate/quickjs-emscripten": "^0.23.0",
-        "agent-base": "^7.0.2",
-        "debug": "^4.3.4",
-        "get-uri": "^6.0.1",
-        "http-proxy-agent": "^7.0.0",
-        "https-proxy-agent": "^7.0.2",
-        "pac-resolver": "^7.0.0",
-        "socks-proxy-agent": "^8.0.2"
-      },
-      "dependencies": {
-        "agent-base": {
-          "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
-          "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
-          "dev": true,
-          "requires": {
-            "debug": "^4.3.4"
-          }
-        },
-        "http-proxy-agent": {
-          "version": "7.0.2",
-          "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
-          "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
-          "dev": true,
-          "requires": {
-            "agent-base": "^7.1.0",
-            "debug": "^4.3.4"
-          }
-        },
-        "https-proxy-agent": {
-          "version": "7.0.4",
-          "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.4.tgz",
-          "integrity": "sha512-wlwpilI7YdjSkWaQ/7omYBMTliDcmCN8OLihO6I9B86g06lMyAoqgoDpV0XqoaPOKj+0DIdAvnsWfyAAhmimcg==",
-          "dev": true,
-          "requires": {
-            "agent-base": "^7.0.2",
-            "debug": "4"
-          }
-        }
-      }
-    },
-    "pac-resolver": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/pac-resolver/-/pac-resolver-7.0.1.tgz",
-      "integrity": "sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg==",
-      "dev": true,
-      "requires": {
-        "degenerator": "^5.0.0",
-        "netmask": "^2.0.2"
-      }
-    },
-    "pako": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
-      "integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==",
-      "dev": true
-    },
-    "parent-module": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
-      "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
-      "dev": true,
-      "requires": {
-        "callsites": "^3.0.0"
-      }
-    },
-    "parse-json": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
-      "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==",
-      "dev": true,
-      "requires": {
-        "@babel/code-frame": "^7.0.0",
-        "error-ex": "^1.3.1",
-        "json-parse-even-better-errors": "^2.3.0",
-        "lines-and-columns": "^1.1.6"
-      }
-    },
-    "parse-passwd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
-      "integrity": "sha512-1Y1A//QUXEZK7YKz+rD9WydcE1+EuPr6ZBgKecAB8tmoW6UFv0NREVJe1p+jRxtThkcbbKkfwIbWJe/IeE6m2Q==",
-      "dev": true
-    },
-    "parse5": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/parse5/-/parse5-6.0.1.tgz",
-      "integrity": "sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==",
-      "dev": true
-    },
-    "path-browserify": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-1.0.1.tgz",
-      "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==",
-      "dev": true
-    },
-    "path-exists": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
-      "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
-      "dev": true
-    },
-    "path-is-absolute": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==",
-      "dev": true
-    },
-    "path-key": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
-      "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
-      "dev": true
-    },
-    "path-parse": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
-      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
-      "dev": true
-    },
-    "path-scurry": {
-      "version": "1.10.1",
-      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.10.1.tgz",
-      "integrity": "sha512-MkhCqzzBEpPvxxQ71Md0b1Kk51W01lrYvlMzSUaIzNsODdd7mqhiimSZlr+VegAz5Z6Vzt9Xg2ttE//XBhH3EQ==",
-      "dev": true,
-      "requires": {
-        "lru-cache": "^9.1.1 || ^10.0.0",
-        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
-      },
-      "dependencies": {
-        "lru-cache": {
-          "version": "10.1.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.1.0.tgz",
-          "integrity": "sha512-/1clY/ui8CzjKFyjdvwPWJUYKiFVXG2I2cY0ssG7h4+hwk+XOIX7ZSG9Q7TW8TW3Kp3BUSqgFWBLgL4PJ+Blag==",
-          "dev": true
-        }
-      }
-    },
-    "path-to-regexp": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz",
-      "integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==",
-      "dev": true,
-      "requires": {
-        "isarray": "0.0.1"
-      },
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ==",
-          "dev": true
-        }
-      }
-    },
-    "path-type": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
-      "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
-      "dev": true
-    },
-    "pathe": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/pathe/-/pathe-1.1.1.tgz",
-      "integrity": "sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q==",
-      "dev": true
-    },
-    "pathval": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/pathval/-/pathval-1.1.1.tgz",
-      "integrity": "sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==",
-      "dev": true
-    },
-    "pend": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz",
-      "integrity": "sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==",
-      "dev": true
-    },
-    "picocolors": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
-      "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
-    },
-    "picomatch": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
-      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
-      "dev": true
-    },
-    "pidtree": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/pidtree/-/pidtree-0.3.1.tgz",
-      "integrity": "sha512-qQbW94hLHEqCg7nhby4yRC7G2+jYHY4Rguc2bjw7Uug4GIJuu1tvf2uHaZv5Q8zdt+WKJ6qK1FOI6amaWUo5FA==",
-      "dev": true
-    },
-    "pify": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-      "integrity": "sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg==",
-      "dev": true
-    },
-    "piscina": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/piscina/-/piscina-3.2.0.tgz",
-      "integrity": "sha512-yn/jMdHRw+q2ZJhFhyqsmANcbF6V2QwmD84c6xRau+QpQOmtrBCoRGdvTfeuFDYXB5W2m6MfLkjkvQa9lUSmIA==",
-      "dev": true,
-      "requires": {
-        "eventemitter-asyncresource": "^1.0.0",
-        "hdr-histogram-js": "^2.0.1",
-        "hdr-histogram-percentiles-obj": "^3.0.0",
-        "nice-napi": "^1.0.2"
-      }
-    },
-    "pkg-dir": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-5.0.0.tgz",
-      "integrity": "sha512-NPE8TDbzl/3YQYY7CSS228s3g2ollTFnc+Qi3tqmqJp9Vg2ovUpixcJEo2HJScN2Ez+kEaal6y70c0ehqJBJeA==",
-      "dev": true,
-      "requires": {
-        "find-up": "^5.0.0"
-      }
-    },
-    "pkg-types": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.0.3.tgz",
-      "integrity": "sha512-nN7pYi0AQqJnoLPC9eHFQ8AcyaixBUOwvqc5TDnIKCMEE6I0y8P7OKA7fPexsXGCGxQDl/cmrLAp26LhcwxZ4A==",
-      "dev": true,
-      "requires": {
-        "jsonc-parser": "^3.2.0",
-        "mlly": "^1.2.0",
-        "pathe": "^1.1.0"
-      }
-    },
-    "please-upgrade-node": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz",
-      "integrity": "sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg==",
-      "dev": true,
-      "requires": {
-        "semver-compare": "^1.0.0"
-      }
-    },
-    "postcss": {
-      "version": "8.4.32",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.32.tgz",
-      "integrity": "sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==",
-      "requires": {
-        "nanoid": "^3.3.7",
-        "picocolors": "^1.0.0",
-        "source-map-js": "^1.0.2"
-      },
-      "dependencies": {
-        "nanoid": {
-          "version": "3.3.7",
-          "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
-          "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g=="
-        }
-      }
-    },
-    "postcss-calc": {
-      "version": "8.2.4",
-      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-8.2.4.tgz",
-      "integrity": "sha512-SmWMSJmB8MRnnULldx0lQIyhSNvuDl9HfrZkaqqE/WHAhToYsAvDq+yAsA/kIyINDszOp3Rh0GFoNuH5Ypsm3Q==",
-      "dev": true,
-      "requires": {
-        "postcss-selector-parser": "^6.0.9",
-        "postcss-value-parser": "^4.2.0"
-      }
-    },
-    "postcss-media-query-parser": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz",
-      "integrity": "sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==",
-      "dev": true
-    },
-    "postcss-pxtorem": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-pxtorem/-/postcss-pxtorem-6.0.0.tgz",
-      "integrity": "sha512-ZRXrD7MLLjLk2RNGV6UA4f5Y7gy+a/j1EqjAfp9NdcNYVjUMvg5HTYduTjSkKBkRkfqbg/iKrjMO70V4g1LZeg==",
-      "dev": true,
-      "requires": {}
-    },
-    "postcss-resolve-nested-selector": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz",
-      "integrity": "sha512-HvExULSwLqHLgUy1rl3ANIqCsvMS0WHss2UOsXhXnQaZ9VCc2oBvIpXrl00IUFT5ZDITME0o6oiXeiHr2SAIfw==",
-      "dev": true
-    },
-    "postcss-safe-parser": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-safe-parser/-/postcss-safe-parser-7.0.0.tgz",
-      "integrity": "sha512-ovehqRNVCpuFzbXoTb4qLtyzK3xn3t/CUBxOs8LsnQjQrShaB4lKiHoVqY8ANaC0hBMHq5QVWk77rwGklFUDrg==",
-      "dev": true,
-      "requires": {}
-    },
-    "postcss-scss": {
-      "version": "4.0.9",
-      "resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.9.tgz",
-      "integrity": "sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A==",
-      "dev": true,
-      "requires": {}
-    },
-    "postcss-selector-parser": {
-      "version": "6.0.13",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
-      "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
-      "dev": true,
-      "requires": {
-        "cssesc": "^3.0.0",
-        "util-deprecate": "^1.0.2"
-      }
-    },
-    "postcss-value-parser": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
-      "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
-      "dev": true
-    },
-    "prelude-ls": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
-      "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
-      "dev": true
-    },
-    "prettier": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.1.0.tgz",
-      "integrity": "sha512-TQLvXjq5IAibjh8EpBIkNKxO749UEWABoiIZehEPiY4GNpVdhaFKqSTu+QrlU6D2dPAfubRmtJTi4K4YkQ5eXw==",
-      "dev": true,
-      "peer": true
-    },
-    "prettier-linter-helpers": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz",
-      "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==",
-      "dev": true,
-      "requires": {
-        "fast-diff": "^1.1.2"
-      }
-    },
-    "pretty-format": {
-      "version": "29.7.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz",
-      "integrity": "sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==",
-      "dev": true,
-      "requires": {
-        "@jest/schemas": "^29.6.3",
-        "ansi-styles": "^5.0.0",
-        "react-is": "^18.0.0"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "5.2.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-          "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
-          "dev": true
-        }
-      }
-    },
-    "process-nextick-args": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
-      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
-      "dev": true
-    },
-    "progress": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
-      "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==",
-      "dev": true
-    },
-    "promise": {
-      "version": "7.3.1",
-      "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
-      "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
-      "dev": true,
-      "requires": {
-        "asap": "~2.0.3"
-      }
-    },
-    "proto-list": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz",
-      "integrity": "sha512-vtK/94akxsTMhe0/cbfpR+syPuszcuwhqVjJq26CuNDgFGj682oRBXOP5MJpv2r7JtE8MsiepGIqvvOTBwn2vA==",
-      "dev": true
-    },
-    "proxy-agent": {
-      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/proxy-agent/-/proxy-agent-6.4.0.tgz",
-      "integrity": "sha512-u0piLU+nCOHMgGjRbimiXmA9kM/L9EHh3zL81xCdp7m+Y2pHIsnmbdDoEDoAz5geaonNR6q6+yOPQs6n4T6sBQ==",
-      "dev": true,
-      "requires": {
-        "agent-base": "^7.0.2",
-        "debug": "^4.3.4",
-        "http-proxy-agent": "^7.0.1",
-        "https-proxy-agent": "^7.0.3",
-        "lru-cache": "^7.14.1",
-        "pac-proxy-agent": "^7.0.1",
-        "proxy-from-env": "^1.1.0",
-        "socks-proxy-agent": "^8.0.2"
-      },
-      "dependencies": {
-        "agent-base": {
-          "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
-          "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
-          "dev": true,
-          "requires": {
-            "debug": "^4.3.4"
-          }
-        },
-        "http-proxy-agent": {
-          "version": "7.0.2",
-          "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
-          "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
-          "dev": true,
-          "requires": {
-            "agent-base": "^7.1.0",
-            "debug": "^4.3.4"
-          }
-        },
-        "https-proxy-agent": {
-          "version": "7.0.4",
-          "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.4.tgz",
-          "integrity": "sha512-wlwpilI7YdjSkWaQ/7omYBMTliDcmCN8OLihO6I9B86g06lMyAoqgoDpV0XqoaPOKj+0DIdAvnsWfyAAhmimcg==",
-          "dev": true,
-          "requires": {
-            "agent-base": "^7.0.2",
-            "debug": "4"
-          }
-        },
-        "lru-cache": {
-          "version": "7.18.3",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-7.18.3.tgz",
-          "integrity": "sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA==",
-          "dev": true
-        }
-      }
-    },
-    "proxy-from-env": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
-      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
-      "dev": true
-    },
-    "psl": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz",
-      "integrity": "sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==",
-      "dev": true
-    },
-    "pug": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/pug/-/pug-3.0.3.tgz",
-      "integrity": "sha512-uBi6kmc9f3SZ3PXxqcHiUZLmIXgfgWooKWXcwSGwQd2Zi5Rb0bT14+8CJjJgI8AB+nndLaNgHGrcc6bPIB665g==",
-      "dev": true,
-      "requires": {
-        "pug-code-gen": "^3.0.3",
-        "pug-filters": "^4.0.0",
-        "pug-lexer": "^5.0.1",
-        "pug-linker": "^4.0.0",
-        "pug-load": "^3.0.0",
-        "pug-parser": "^6.0.0",
-        "pug-runtime": "^3.0.1",
-        "pug-strip-comments": "^2.0.0"
-      }
-    },
-    "pug-attrs": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/pug-attrs/-/pug-attrs-3.0.0.tgz",
-      "integrity": "sha512-azINV9dUtzPMFQktvTXciNAfAuVh/L/JCl0vtPCwvOA21uZrC08K/UnmrL+SXGEVc1FwzjW62+xw5S/uaLj6cA==",
-      "dev": true,
-      "requires": {
-        "constantinople": "^4.0.1",
-        "js-stringify": "^1.0.2",
-        "pug-runtime": "^3.0.0"
-      }
-    },
-    "pug-code-gen": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/pug-code-gen/-/pug-code-gen-3.0.3.tgz",
-      "integrity": "sha512-cYQg0JW0w32Ux+XTeZnBEeuWrAY7/HNE6TWnhiHGnnRYlCgyAUPoyh9KzCMa9WhcJlJ1AtQqpEYHc+vbCzA+Aw==",
-      "dev": true,
-      "requires": {
-        "constantinople": "^4.0.1",
-        "doctypes": "^1.1.0",
-        "js-stringify": "^1.0.2",
-        "pug-attrs": "^3.0.0",
-        "pug-error": "^2.1.0",
-        "pug-runtime": "^3.0.1",
-        "void-elements": "^3.1.0",
-        "with": "^7.0.0"
-      }
-    },
-    "pug-error": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/pug-error/-/pug-error-2.1.0.tgz",
-      "integrity": "sha512-lv7sU9e5Jk8IeUheHata6/UThZ7RK2jnaaNztxfPYUY+VxZyk/ePVaNZ/vwmH8WqGvDz3LrNYt/+gA55NDg6Pg==",
-      "dev": true
-    },
-    "pug-filters": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/pug-filters/-/pug-filters-4.0.0.tgz",
-      "integrity": "sha512-yeNFtq5Yxmfz0f9z2rMXGw/8/4i1cCFecw/Q7+D0V2DdtII5UvqE12VaZ2AY7ri6o5RNXiweGH79OCq+2RQU4A==",
-      "dev": true,
-      "requires": {
-        "constantinople": "^4.0.1",
-        "jstransformer": "1.0.0",
-        "pug-error": "^2.0.0",
-        "pug-walk": "^2.0.0",
-        "resolve": "^1.15.1"
-      }
-    },
-    "pug-lexer": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/pug-lexer/-/pug-lexer-5.0.1.tgz",
-      "integrity": "sha512-0I6C62+keXlZPZkOJeVam9aBLVP2EnbeDw3An+k0/QlqdwH6rv8284nko14Na7c0TtqtogfWXcRoFE4O4Ff20w==",
-      "dev": true,
-      "requires": {
-        "character-parser": "^2.2.0",
-        "is-expression": "^4.0.0",
-        "pug-error": "^2.0.0"
-      }
-    },
-    "pug-linker": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/pug-linker/-/pug-linker-4.0.0.tgz",
-      "integrity": "sha512-gjD1yzp0yxbQqnzBAdlhbgoJL5qIFJw78juN1NpTLt/mfPJ5VgC4BvkoD3G23qKzJtIIXBbcCt6FioLSFLOHdw==",
-      "dev": true,
-      "requires": {
-        "pug-error": "^2.0.0",
-        "pug-walk": "^2.0.0"
-      }
-    },
-    "pug-load": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/pug-load/-/pug-load-3.0.0.tgz",
-      "integrity": "sha512-OCjTEnhLWZBvS4zni/WUMjH2YSUosnsmjGBB1An7CsKQarYSWQ0GCVyd4eQPMFJqZ8w9xgs01QdiZXKVjk92EQ==",
-      "dev": true,
-      "requires": {
-        "object-assign": "^4.1.1",
-        "pug-walk": "^2.0.0"
-      }
-    },
-    "pug-parser": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/pug-parser/-/pug-parser-6.0.0.tgz",
-      "integrity": "sha512-ukiYM/9cH6Cml+AOl5kETtM9NR3WulyVP2y4HOU45DyMim1IeP/OOiyEWRr6qk5I5klpsBnbuHpwKmTx6WURnw==",
-      "dev": true,
-      "requires": {
-        "pug-error": "^2.0.0",
-        "token-stream": "1.0.0"
-      }
-    },
-    "pug-runtime": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/pug-runtime/-/pug-runtime-3.0.1.tgz",
-      "integrity": "sha512-L50zbvrQ35TkpHwv0G6aLSuueDRwc/97XdY8kL3tOT0FmhgG7UypU3VztfV/LATAvmUfYi4wNxSajhSAeNN+Kg==",
-      "dev": true
-    },
-    "pug-strip-comments": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/pug-strip-comments/-/pug-strip-comments-2.0.0.tgz",
-      "integrity": "sha512-zo8DsDpH7eTkPHCXFeAk1xZXJbyoTfdPlNR0bK7rpOMuhBYb0f5qUVCO1xlsitYd3w5FQTK7zpNVKb3rZoUrrQ==",
-      "dev": true,
-      "requires": {
-        "pug-error": "^2.0.0"
-      }
-    },
-    "pug-walk": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/pug-walk/-/pug-walk-2.0.0.tgz",
-      "integrity": "sha512-yYELe9Q5q9IQhuvqsZNwA5hfPkMJ8u92bQLIMcsMxf/VADjNtEYptU+inlufAFYcWdHlwNfZOEnOOQrZrcyJCQ==",
-      "dev": true
-    },
-    "pump": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
-      "integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==",
-      "dev": true,
-      "requires": {
-        "end-of-stream": "^1.1.0",
-        "once": "^1.3.1"
-      }
-    },
-    "punycode": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
-      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
-      "dev": true
-    },
-    "puppeteer": {
-      "version": "22.10.0",
-      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.10.0.tgz",
-      "integrity": "sha512-ZOkZd6a6t0BdKcWb0wAYHWQqCfdlN1PPnXOmg/XNrbo6gJhYWFX4qCNb6ahSn8TpAqBqLCoD4Q010F7GwOM7mA==",
-      "dev": true,
-      "requires": {
-        "@puppeteer/browsers": "2.2.3",
-        "cosmiconfig": "9.0.0",
-        "devtools-protocol": "0.0.1286932",
-        "puppeteer-core": "22.10.0"
-      },
-      "dependencies": {
-        "cosmiconfig": {
-          "version": "9.0.0",
-          "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
-          "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
-          "dev": true,
-          "requires": {
-            "env-paths": "^2.2.1",
-            "import-fresh": "^3.3.0",
-            "js-yaml": "^4.1.0",
-            "parse-json": "^5.2.0"
-          }
-        },
-        "devtools-protocol": {
-          "version": "0.0.1286932",
-          "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1286932.tgz",
-          "integrity": "sha512-wu58HMQll9voDjR4NlPyoDEw1syfzaBNHymMMZ/QOXiHRNluOnDgu9hp1yHOKYoMlxCh4lSSiugLITe6Fvu1eA==",
-          "dev": true
-        }
-      }
-    },
-    "puppeteer-core": {
-      "version": "22.10.0",
-      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.10.0.tgz",
-      "integrity": "sha512-I54J4Vy4I07UHsgB1QSmuFoF7KNQjJWcvFBPhtY+ezMdBfwgGDr8dzYrJa11aPgP9kxIUHjhktcMmmfJkOAtTw==",
-      "dev": true,
-      "requires": {
-        "@puppeteer/browsers": "2.2.3",
-        "chromium-bidi": "0.5.19",
-        "debug": "4.3.4",
-        "devtools-protocol": "0.0.1286932",
-        "ws": "8.17.0"
-      },
-      "dependencies": {
-        "devtools-protocol": {
-          "version": "0.0.1286932",
-          "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1286932.tgz",
-          "integrity": "sha512-wu58HMQll9voDjR4NlPyoDEw1syfzaBNHymMMZ/QOXiHRNluOnDgu9hp1yHOKYoMlxCh4lSSiugLITe6Fvu1eA==",
-          "dev": true
-        },
-        "ws": {
-          "version": "8.17.0",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz",
-          "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==",
-          "dev": true,
-          "requires": {}
-        }
-      }
-    },
-    "querystringify": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
-      "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==",
-      "dev": true
-    },
-    "queue-microtask": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
-      "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==",
-      "dev": true
-    },
-    "queue-tick": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/queue-tick/-/queue-tick-1.0.1.tgz",
-      "integrity": "sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag==",
-      "dev": true
-    },
-    "randombytes": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
-      "integrity": "sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==",
-      "dev": true,
-      "requires": {
-        "safe-buffer": "^5.1.0"
-      }
-    },
-    "react-is": {
-      "version": "18.2.0",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
-      "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==",
-      "dev": true
-    },
-    "read-pkg": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-3.0.0.tgz",
-      "integrity": "sha512-BLq/cCO9two+lBgiTYNqD6GdtK8s4NpaWrl6/rCO9w0TUS8oJl7cmToOZfRYllKTISY6nt1U7jQ53brmKqY6BA==",
-      "dev": true,
-      "requires": {
-        "load-json-file": "^4.0.0",
-        "normalize-package-data": "^2.3.2",
-        "path-type": "^3.0.0"
-      },
-      "dependencies": {
-        "path-type": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/path-type/-/path-type-3.0.0.tgz",
-          "integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
-          "dev": true,
-          "requires": {
-            "pify": "^3.0.0"
-          }
-        }
-      }
-    },
-    "readable-stream": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
-      "integrity": "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==",
-      "dev": true,
-      "requires": {
-        "inherits": "^2.0.3",
-        "string_decoder": "^1.1.1",
-        "util-deprecate": "^1.0.1"
-      }
-    },
-    "readdir-glob": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/readdir-glob/-/readdir-glob-1.1.3.tgz",
-      "integrity": "sha512-v05I2k7xN8zXvPD9N+z/uhXPaj0sUFCe2rcWZIpBsqxfP7xXFQ0tipAd/wjj1YxWyWtUS5IDJpOG82JKt2EAVA==",
-      "dev": true,
-      "requires": {
-        "minimatch": "^5.1.0"
-      },
-      "dependencies": {
-        "brace-expansion": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-          "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-          "dev": true,
-          "requires": {
-            "balanced-match": "^1.0.0"
-          }
-        },
-        "minimatch": {
-          "version": "5.1.6",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz",
-          "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==",
-          "dev": true,
-          "requires": {
-            "brace-expansion": "^2.0.1"
-          }
-        }
-      }
-    },
-    "readdirp": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
-      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
-      "dev": true,
-      "requires": {
-        "picomatch": "^2.2.1"
-      }
-    },
-    "recast": {
-      "version": "0.23.9",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.23.9.tgz",
-      "integrity": "sha512-Hx/BGIbwj+Des3+xy5uAtAbdCyqK9y9wbBcDFDYanLS9JnMqf7OeF87HQwUimE87OEc72mr6tkKUKMBBL+hF9Q==",
-      "dev": true,
-      "requires": {
-        "ast-types": "^0.16.1",
-        "esprima": "~4.0.0",
-        "source-map": "~0.6.1",
-        "tiny-invariant": "^1.3.3",
-        "tslib": "^2.0.1"
-      }
-    },
-    "regenerate": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",
-      "integrity": "sha512-zrceR/XhGYU/d/opr2EKO7aRHUeiBI8qjtfHqADTwZd6Szfy16la6kqD0MIUs5z5hx6AaKa+PixpPrR289+I0A==",
-      "dev": true
-    },
-    "regenerate-unicode-properties": {
-      "version": "10.1.1",
-      "resolved": "https://registry.npmjs.org/regenerate-unicode-properties/-/regenerate-unicode-properties-10.1.1.tgz",
-      "integrity": "sha512-X007RyZLsCJVVrjgEFVpLUTZwyOZk3oiL75ZcuYjlIWd6rNJtOjkBwQc5AsRrpbKVkxN6sklw/k/9m2jJYOf8Q==",
-      "dev": true,
-      "requires": {
-        "regenerate": "^1.4.2"
-      }
-    },
-    "regenerator-runtime": {
-      "version": "0.14.0",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz",
-      "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==",
-      "dev": true
-    },
-    "regenerator-transform": {
-      "version": "0.15.2",
-      "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.15.2.tgz",
-      "integrity": "sha512-hfMp2BoF0qOk3uc5V20ALGDS2ddjQaLrdl7xrGXvAIow7qeWRM2VA2HuCHkUKk9slq3VwEwLNK3DFBqDfPGYtg==",
-      "dev": true,
-      "requires": {
-        "@babel/runtime": "^7.8.4"
-      }
-    },
-    "regexp.prototype.flags": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz",
-      "integrity": "sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "set-function-name": "^2.0.0"
-      }
-    },
-    "regexpu-core": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-5.3.2.tgz",
-      "integrity": "sha512-RAM5FlZz+Lhmo7db9L298p2vHP5ZywrVXmVXpmAD9GuL5MPH6t9ROw1iA/wfHkQ76Qe7AaPF0nGuim96/IrQMQ==",
-      "dev": true,
-      "requires": {
-        "@babel/regjsgen": "^0.8.0",
-        "regenerate": "^1.4.2",
-        "regenerate-unicode-properties": "^10.1.0",
-        "regjsparser": "^0.9.1",
-        "unicode-match-property-ecmascript": "^2.0.0",
-        "unicode-match-property-value-ecmascript": "^2.1.0"
-      }
-    },
-    "regjsparser": {
-      "version": "0.9.1",
-      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.9.1.tgz",
-      "integrity": "sha512-dQUtn90WanSNl+7mQKcXAgZxvUe7Z0SqXlgzv0za4LwiUhyzBC58yQO3liFoUgu8GiJVInAhJjkj1N0EtQ5nkQ==",
-      "dev": true,
-      "requires": {
-        "jsesc": "~0.5.0"
-      },
-      "dependencies": {
-        "jsesc": {
-          "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
-          "integrity": "sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA==",
-          "dev": true
-        }
-      }
-    },
-    "require-directory": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
-      "dev": true
-    },
-    "require-from-string": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
-      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
-      "dev": true
-    },
-    "requires-port": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
-      "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
-      "dev": true
-    },
-    "resolve": {
-      "version": "1.22.8",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
-      "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",
-      "dev": true,
-      "requires": {
-        "is-core-module": "^2.13.0",
-        "path-parse": "^1.0.7",
-        "supports-preserve-symlinks-flag": "^1.0.0"
-      }
-    },
-    "resolve-dir": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-1.0.1.tgz",
-      "integrity": "sha512-R7uiTjECzvOsWSfdM0QKFNBVFcK27aHOUwdvK53BcW8zqnGdYp0Fbj82cy54+2A4P2tFM22J5kRfe1R+lM/1yg==",
-      "dev": true,
-      "requires": {
-        "expand-tilde": "^2.0.0",
-        "global-modules": "^1.0.0"
-      }
-    },
-    "resolve-from": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-5.0.0.tgz",
-      "integrity": "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==",
-      "dev": true
-    },
-    "resolve-global": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/resolve-global/-/resolve-global-1.0.0.tgz",
-      "integrity": "sha512-zFa12V4OLtT5XUX/Q4VLvTfBf+Ok0SPc1FNGM/z9ctUdiU618qwKpWnd0CHs3+RqROfyEg/DhuHbMWYqcgljEw==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "global-dirs": "^0.1.1"
-      }
-    },
-    "restore-cursor": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-3.1.0.tgz",
-      "integrity": "sha512-l+sSefzHpj5qimhFSE5a8nufZYAM3sBSVMAPtYkmC+4EH2anSGaEMXSD0izRQbu9nfyQ9y5JrVmp7E8oZrUjvA==",
-      "dev": true,
-      "requires": {
-        "onetime": "^5.1.0",
-        "signal-exit": "^3.0.2"
-      }
-    },
-    "reusify": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz",
-      "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
-      "dev": true
-    },
-    "rimraf": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
-      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
-      "dev": true,
-      "requires": {
-        "glob": "^7.1.3"
-      }
-    },
-    "rollup": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.9.2.tgz",
-      "integrity": "sha512-66RB8OtFKUTozmVEh3qyNfH+b+z2RXBVloqO2KCC/pjFaGaHtxP9fVfOQKPSGXg2mElmjmxjW/fZ7iKrEpMH5Q==",
-      "dev": true,
-      "requires": {
-        "@rollup/rollup-android-arm-eabi": "4.9.2",
-        "@rollup/rollup-android-arm64": "4.9.2",
-        "@rollup/rollup-darwin-arm64": "4.9.2",
-        "@rollup/rollup-darwin-x64": "4.9.2",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.9.2",
-        "@rollup/rollup-linux-arm64-gnu": "4.9.2",
-        "@rollup/rollup-linux-arm64-musl": "4.9.2",
-        "@rollup/rollup-linux-riscv64-gnu": "4.9.2",
-        "@rollup/rollup-linux-x64-gnu": "4.9.2",
-        "@rollup/rollup-linux-x64-musl": "4.9.2",
-        "@rollup/rollup-win32-arm64-msvc": "4.9.2",
-        "@rollup/rollup-win32-ia32-msvc": "4.9.2",
-        "@rollup/rollup-win32-x64-msvc": "4.9.2",
-        "fsevents": "~2.3.2"
-      }
-    },
-    "rrweb-cssom": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.6.0.tgz",
-      "integrity": "sha512-APM0Gt1KoXBz0iIkkdB/kfvGOwC4UuJFeG/c+yV7wSc7q96cG/kJ0HiYCnzivD9SB53cLV1MlHFNfOuPaadYSw==",
-      "dev": true
-    },
-    "run-async": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz",
-      "integrity": "sha512-tvVnVv01b8c1RrA6Ep7JkStj85Guv/YrMcwqYQnwjsAS2cTmmPGBBjAjpCW7RrSodNSoE2/qg9O4bceNvUuDgQ==",
-      "dev": true
-    },
-    "run-parallel": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
-      "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==",
-      "dev": true,
-      "requires": {
-        "queue-microtask": "^1.2.2"
-      }
-    },
-    "rxjs": {
-      "version": "7.8.1",
-      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz",
-      "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==",
-      "dev": true,
-      "requires": {
-        "tslib": "^2.1.0"
-      }
-    },
-    "safe-array-concat": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.0.1.tgz",
-      "integrity": "sha512-6XbUAseYE2KtOuGueyeobCySj9L4+66Tn6KQMOPQJrAJEowYKW/YR/MGJZl7FdydUdaFu4LYyDZjxf4/Nmo23Q==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.1",
-        "has-symbols": "^1.0.3",
-        "isarray": "^2.0.5"
-      }
-    },
-    "safe-buffer": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
-      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
-      "dev": true
-    },
-    "safe-regex-test": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.0.tgz",
-      "integrity": "sha512-JBUUzyOgEwXQY1NuPtvcj/qcBDbDmEvWufhlnXZIm75DEHp+afM1r1ujJpJsV/gSM4t59tpDyPi1sd6ZaPFfsA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.3",
-        "is-regex": "^1.1.4"
-      }
-    },
-    "safer-buffer": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
-      "dev": true
-    },
-    "sass": {
-      "version": "1.69.5",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.69.5.tgz",
-      "integrity": "sha512-qg2+UCJibLr2LCVOt3OlPhr/dqVHWOa9XtZf2OjbLs/T4VPSJ00udtgJxH3neXZm+QqX8B+3cU7RaLqp1iVfcQ==",
-      "dev": true,
-      "requires": {
-        "chokidar": ">=3.0.0 <4.0.0",
-        "immutable": "^4.0.0",
-        "source-map-js": ">=0.6.2 <2.0.0"
-      }
-    },
-    "saxes": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/saxes/-/saxes-5.0.1.tgz",
-      "integrity": "sha512-5LBh1Tls8c9xgGjw3QrMwETmTMVk0oFgvrFSvWx62llR2hcEInrKNZ2GZCCuuy2lvWrdl5jhbpeqc5hRYKFOcw==",
-      "dev": true,
-      "requires": {
-        "xmlchars": "^2.2.0"
-      }
-    },
-    "selenium-webdriver": {
-      "version": "4.14.0",
-      "resolved": "https://registry.npmjs.org/selenium-webdriver/-/selenium-webdriver-4.14.0.tgz",
-      "integrity": "sha512-637rs8anqMKHbWxcBZpyG3Gcs+rBUtAUiqk0O/knUqH4Paj3MFUZrz88/pVGOLNryEVy2z92fZomT8p1ENl1gA==",
-      "dev": true,
-      "requires": {
-        "jszip": "^3.10.1",
-        "tmp": "^0.2.1",
-        "ws": ">=8.14.2"
-      },
-      "dependencies": {
-        "tmp": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.1.tgz",
-          "integrity": "sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==",
-          "dev": true,
-          "requires": {
-            "rimraf": "^3.0.0"
-          }
-        },
-        "ws": {
-          "version": "8.14.2",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-8.14.2.tgz",
-          "integrity": "sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g==",
-          "dev": true,
-          "requires": {}
-        }
-      }
-    },
-    "semver": {
-      "version": "6.3.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "dev": true
-    },
-    "semver-compare": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/semver-compare/-/semver-compare-1.0.0.tgz",
-      "integrity": "sha512-YM3/ITh2MJ5MtzaM429anh+x2jiLVjqILF4m4oyQB18W7Ggea7BfqdH/wGMK7dDiMghv/6WG7znWMwUDzJiXow==",
-      "dev": true
-    },
-    "semver-regex": {
-      "version": "3.1.4",
-      "resolved": "https://registry.npmjs.org/semver-regex/-/semver-regex-3.1.4.tgz",
-      "integrity": "sha512-6IiqeZNgq01qGf0TId0t3NvKzSvUsjcpdEO3AQNeIjR6A2+ckTnQlDpl4qu1bjRv0RzN3FP9hzFmws3lKqRWkA==",
-      "dev": true
-    },
-    "serialize-javascript": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.0.tgz",
-      "integrity": "sha512-Qr3TosvguFt8ePWqsvRfrKyQXIiW+nGbYpy8XK24NQHE83caxWt+mIymTT19DGFbNWNLfEwsrkSmN64lVWB9ag==",
-      "dev": true,
-      "requires": {
-        "randombytes": "^2.1.0"
-      }
-    },
-    "set-function-length": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.1.1.tgz",
-      "integrity": "sha512-VoaqjbBJKiWtg4yRcKBQ7g7wnGnLV3M8oLvVWwOk2PdYY6PEFegR1vezXR0tw6fZGF9csVakIRjrJiy2veSBFQ==",
-      "dev": true,
-      "requires": {
-        "define-data-property": "^1.1.1",
-        "get-intrinsic": "^1.2.1",
-        "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0"
-      }
-    },
-    "set-function-name": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.1.tgz",
-      "integrity": "sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==",
-      "dev": true,
-      "requires": {
-        "define-data-property": "^1.0.1",
-        "functions-have-names": "^1.2.3",
-        "has-property-descriptors": "^1.0.0"
-      }
-    },
-    "setimmediate": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
-      "integrity": "sha512-MATJdZp8sLqDl/68LfQmbP8zKPLQNV6BIZoIgrscFDQ+RsvK/BxeDQOgyxKKoh0y/8h3BqVFnCqQ/gd+reiIXA==",
-      "dev": true
-    },
-    "shebang-command": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
-      "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
-      "dev": true,
-      "requires": {
-        "shebang-regex": "^3.0.0"
-      }
-    },
-    "shebang-regex": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
-      "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
-      "dev": true
-    },
-    "shell-quote": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.1.tgz",
-      "integrity": "sha512-6j1W9l1iAs/4xYBI1SYOVZyFcCis9b4KCLQ8fgAGG07QvzaRLVVRQvAy85yNmmZSjYjg4MWh4gNvlPujU/5LpA==",
-      "dev": true
-    },
-    "side-channel": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
-      "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.0",
-        "get-intrinsic": "^1.0.2",
-        "object-inspect": "^1.9.0"
-      }
-    },
-    "siginfo": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/siginfo/-/siginfo-2.0.0.tgz",
-      "integrity": "sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==",
-      "dev": true
-    },
-    "signal-exit": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
-      "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==",
-      "dev": true
-    },
-    "sinon": {
-      "version": "11.1.2",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-11.1.2.tgz",
-      "integrity": "sha512-59237HChms4kg7/sXhiRcUzdSkKuydDeTiamT/jesUVHshBgL8XAmhgFo0GfK6RruMDM/iRSij1EybmMog9cJw==",
-      "dev": true,
-      "requires": {
-        "@sinonjs/commons": "^1.8.3",
-        "@sinonjs/fake-timers": "^7.1.2",
-        "@sinonjs/samsam": "^6.0.2",
-        "diff": "^5.0.0",
-        "nise": "^5.1.0",
-        "supports-color": "^7.2.0"
-      }
-    },
-    "slash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
-      "dev": true
-    },
-    "slice-ansi": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-4.0.0.tgz",
-      "integrity": "sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==",
-      "dev": true,
-      "requires": {
-        "ansi-styles": "^4.0.0",
-        "astral-regex": "^2.0.0",
-        "is-fullwidth-code-point": "^3.0.0"
-      }
-    },
-    "smart-buffer": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/smart-buffer/-/smart-buffer-4.2.0.tgz",
-      "integrity": "sha512-94hK0Hh8rPqQl2xXc3HsaBoOXKV20MToPkcXvwbISWLEs+64sBq5kFgn2kJDHb1Pry9yrP0dxrCI9RRci7RXKg==",
-      "dev": true
-    },
-    "socks": {
-      "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/socks/-/socks-2.8.1.tgz",
-      "integrity": "sha512-B6w7tkwNid7ToxjZ08rQMT8M9BJAf8DKx8Ft4NivzH0zBUfd6jldGcisJn/RLgxcX3FPNDdNQCUEMMT79b+oCQ==",
-      "dev": true,
-      "requires": {
-        "ip-address": "^9.0.5",
-        "smart-buffer": "^4.2.0"
-      }
-    },
-    "socks-proxy-agent": {
-      "version": "8.0.2",
-      "resolved": "https://registry.npmjs.org/socks-proxy-agent/-/socks-proxy-agent-8.0.2.tgz",
-      "integrity": "sha512-8zuqoLv1aP/66PHF5TqwJ7Czm3Yv32urJQHrVyhD7mmA6d61Zv8cIXQYPTWwmg6qlupnPvs/QKDmfa4P/qct2g==",
-      "dev": true,
-      "requires": {
-        "agent-base": "^7.0.2",
-        "debug": "^4.3.4",
-        "socks": "^2.7.1"
-      },
-      "dependencies": {
-        "agent-base": {
-          "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
-          "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
-          "dev": true,
-          "requires": {
-            "debug": "^4.3.4"
-          }
-        }
-      }
-    },
-    "source-map": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "dev": true
-    },
-    "source-map-js": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
-      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw=="
-    },
-    "spdx-correct": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.2.0.tgz",
-      "integrity": "sha512-kN9dJbvnySHULIluDHy32WHRUu3Og7B9sbY7tsFLctQkIqnMh3hErYgdMjTYuqmcXX+lK5T1lnUt3G7zNswmZA==",
-      "dev": true,
-      "requires": {
-        "spdx-expression-parse": "^3.0.0",
-        "spdx-license-ids": "^3.0.0"
-      }
-    },
-    "spdx-exceptions": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz",
-      "integrity": "sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A==",
-      "dev": true
-    },
-    "spdx-expression-parse": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.1.tgz",
-      "integrity": "sha512-cbqHunsQWnJNE6KhVSMsMeH5H/L9EpymbzqTQ3uLwNCLZ1Q481oWaofqH7nO6V07xlXwY6PhQdQ2IedWx/ZK4Q==",
-      "dev": true,
-      "requires": {
-        "spdx-exceptions": "^2.1.0",
-        "spdx-license-ids": "^3.0.0"
-      }
-    },
-    "spdx-license-ids": {
-      "version": "3.0.16",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.16.tgz",
-      "integrity": "sha512-eWN+LnM3GR6gPu35WxNgbGl8rmY1AEmoMDvL/QD6zYmPWgywxWqJWNdLGT+ke8dKNWrcYgYjPpG5gbTfghP8rw==",
-      "dev": true
-    },
-    "sprintf-js": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-      "integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==",
-      "dev": true
-    },
-    "stackback": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/stackback/-/stackback-0.0.2.tgz",
-      "integrity": "sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==",
-      "dev": true
-    },
-    "stacktrace-parser": {
-      "version": "0.1.10",
-      "resolved": "https://registry.npmjs.org/stacktrace-parser/-/stacktrace-parser-0.1.10.tgz",
-      "integrity": "sha512-KJP1OCML99+8fhOHxwwzyWrlUuVX5GQ0ZpJTd1DFXhdkrvg1szxfHhawXUZ3g9TkXORQd4/WG68jMlQZ2p8wlg==",
-      "dev": true,
-      "requires": {
-        "type-fest": "^0.7.1"
-      },
-      "dependencies": {
-        "type-fest": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.7.1.tgz",
-          "integrity": "sha512-Ne2YiiGN8bmrmJJEuTWTLJR32nh/JdL1+PSicowtNb0WFpn59GK8/lfD61bVtzguz7b3PBt74nxpv/Pw5po5Rg==",
-          "dev": true
-        }
-      }
-    },
-    "std-env": {
-      "version": "3.7.0",
-      "resolved": "https://registry.npmjs.org/std-env/-/std-env-3.7.0.tgz",
-      "integrity": "sha512-JPbdCEQLj1w5GilpiHAx3qJvFndqybBysA3qUOnznweH4QbNYUsW/ea8QzSrnh0vNsezMMw5bcVool8lM0gwzg==",
-      "dev": true
-    },
-    "stop-iteration-iterator": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.0.0.tgz",
-      "integrity": "sha512-iCGQj+0l0HOdZ2AEeBADlsRC+vsnDsZsbdSiH1yNSjcfKM7fdpCMfqAL/dwF5BLiw/XhRft/Wax6zQbhq2BcjQ==",
-      "dev": true,
-      "requires": {
-        "internal-slot": "^1.0.4"
-      }
-    },
-    "streamx": {
-      "version": "2.18.0",
-      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.18.0.tgz",
-      "integrity": "sha512-LLUC1TWdjVdn1weXGcSxyTR3T4+acB6tVGXT95y0nGbca4t4o/ng1wKAGTljm9VicuCVLvRlqFYXYy5GwgM7sQ==",
-      "dev": true,
-      "requires": {
-        "bare-events": "^2.2.0",
-        "fast-fifo": "^1.3.2",
-        "queue-tick": "^1.0.1",
-        "text-decoder": "^1.1.0"
-      }
-    },
-    "string_decoder": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
-      "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
-      "dev": true,
-      "requires": {
-        "safe-buffer": "~5.2.0"
-      }
-    },
-    "string-argv": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/string-argv/-/string-argv-0.3.2.tgz",
-      "integrity": "sha512-aqD2Q0144Z+/RqG52NeHEkZauTAUWJO8c6yTftGJKO3Tja5tUgIfmIl6kExvhtxSDP7fXB6DvzkfMpCd/F3G+Q==",
-      "dev": true
-    },
-    "string-width": {
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
-      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "dev": true,
-      "requires": {
-        "emoji-regex": "^8.0.0",
-        "is-fullwidth-code-point": "^3.0.0",
-        "strip-ansi": "^6.0.1"
-      }
-    },
-    "string-width-cjs": {
-      "version": "npm:string-width@4.2.3",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
-      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "dev": true,
-      "requires": {
-        "emoji-regex": "^8.0.0",
-        "is-fullwidth-code-point": "^3.0.0",
-        "strip-ansi": "^6.0.1"
-      }
-    },
-    "string.prototype.padend": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/string.prototype.padend/-/string.prototype.padend-3.1.5.tgz",
-      "integrity": "sha512-DOB27b/2UTTD+4myKUFh+/fXWcu/UDyASIXfg+7VzoCNNGOfWvoyU/x5pvVHr++ztyt/oSYI1BcWBBG/hmlNjA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
-      }
-    },
-    "string.prototype.trim": {
-      "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.8.tgz",
-      "integrity": "sha512-lfjY4HcixfQXOfaqCvcBuOIapyaroTXhbkfJN3gcB1OtyupngWK4sEET9Knd0cXd28kTUqu/kHoV4HKSJdnjiQ==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
-      }
-    },
-    "string.prototype.trimend": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.7.tgz",
-      "integrity": "sha512-Ni79DqeB72ZFq1uH/L6zJ+DKZTkOtPIHovb3YZHQViE+HDouuU4mBrLOLDn5Dde3RF8qw5qVETEjhu9locMLvA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
-      }
-    },
-    "string.prototype.trimstart": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.7.tgz",
-      "integrity": "sha512-NGhtDFu3jCEm7B4Fy0DpLewdJQOZcQ0rGbwQ/+stjnrp2i+rlKeCvos9hOIeCmqwratM47OBxY7uFZzjxHXmrg==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
-      }
-    },
-    "strip-ansi": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
-      "requires": {
-        "ansi-regex": "^5.0.1"
-      }
-    },
-    "strip-ansi-cjs": {
-      "version": "npm:strip-ansi@6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
-      "requires": {
-        "ansi-regex": "^5.0.1"
-      }
-    },
-    "strip-bom": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-4.0.0.tgz",
-      "integrity": "sha512-3xurFv5tEgii33Zi8Jtp55wEIILR9eh34FAW00PZf+JnSsTmV/ioewSgQl97JHvgjoRGwPShsWm+IdrxB35d0w==",
-      "dev": true
-    },
-    "strip-final-newline": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-3.0.0.tgz",
-      "integrity": "sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==",
-      "dev": true
-    },
-    "strip-json-comments": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
-      "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==",
-      "dev": true
-    },
-    "strip-literal": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/strip-literal/-/strip-literal-1.3.0.tgz",
-      "integrity": "sha512-PugKzOsyXpArk0yWmUwqOZecSO0GH0bPoctLcqNDH9J04pVW3lflYE0ujElBGTloevcxF5MofAOZ7C5l2b+wLg==",
-      "dev": true,
-      "requires": {
-        "acorn": "^8.10.0"
-      }
-    },
-    "stylelint": {
-      "version": "16.1.0",
-      "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.1.0.tgz",
-      "integrity": "sha512-Sh1rRV0lN1qxz/QsuuooLWsIZ/ona7NKw/fRZd6y6PyXYdD2W0EAzJ8yJcwSx4Iw/muz0CF09VZ+z4EiTAcKmg==",
-      "dev": true,
-      "requires": {
-        "@csstools/css-parser-algorithms": "^2.4.0",
-        "@csstools/css-tokenizer": "^2.2.2",
-        "@csstools/media-query-list-parser": "^2.1.6",
-        "@csstools/selector-specificity": "^3.0.1",
-        "balanced-match": "^2.0.0",
-        "colord": "^2.9.3",
-        "cosmiconfig": "^9.0.0",
-        "css-functions-list": "^3.2.1",
-        "css-tree": "^2.3.1",
-        "debug": "^4.3.4",
-        "fast-glob": "^3.3.2",
-        "fastest-levenshtein": "^1.0.16",
-        "file-entry-cache": "^8.0.0",
-        "global-modules": "^2.0.0",
-        "globby": "^11.1.0",
-        "globjoin": "^0.1.4",
-        "html-tags": "^3.3.1",
-        "ignore": "^5.3.0",
-        "imurmurhash": "^0.1.4",
-        "is-plain-object": "^5.0.0",
-        "known-css-properties": "^0.29.0",
-        "mathml-tag-names": "^2.1.3",
-        "meow": "^13.0.0",
-        "micromatch": "^4.0.5",
-        "normalize-path": "^3.0.0",
-        "picocolors": "^1.0.0",
-        "postcss": "^8.4.32",
-        "postcss-resolve-nested-selector": "^0.1.1",
-        "postcss-safe-parser": "^7.0.0",
-        "postcss-selector-parser": "^6.0.13",
-        "postcss-value-parser": "^4.2.0",
-        "resolve-from": "^5.0.0",
-        "string-width": "^4.2.3",
-        "strip-ansi": "^7.1.0",
-        "supports-hyperlinks": "^3.0.0",
-        "svg-tags": "^1.0.0",
-        "table": "^6.8.1",
-        "write-file-atomic": "^5.0.1"
-      },
-      "dependencies": {
-        "ansi-regex": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz",
-          "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==",
-          "dev": true
-        },
-        "balanced-match": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-2.0.0.tgz",
-          "integrity": "sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==",
-          "dev": true
-        },
-        "brace-expansion": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-          "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-          "dev": true,
-          "requires": {
-            "balanced-match": "^1.0.0"
-          },
-          "dependencies": {
-            "balanced-match": {
-              "version": "1.0.2",
-              "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-              "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-              "dev": true
-            }
-          }
-        },
-        "cosmiconfig": {
-          "version": "9.0.0",
-          "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
-          "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
-          "dev": true,
-          "requires": {
-            "env-paths": "^2.2.1",
-            "import-fresh": "^3.3.0",
-            "js-yaml": "^4.1.0",
-            "parse-json": "^5.2.0"
-          }
-        },
-        "file-entry-cache": {
-          "version": "8.0.0",
-          "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
-          "integrity": "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==",
-          "dev": true,
-          "requires": {
-            "flat-cache": "^4.0.0"
-          }
-        },
-        "flat-cache": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.0.tgz",
-          "integrity": "sha512-EryKbCE/wxpxKniQlyas6PY1I9vwtF3uCBweX+N8KYTCn3Y12RTGtQAJ/bd5pl7kxUAc8v/R3Ake/N17OZiFqA==",
-          "dev": true,
-          "requires": {
-            "flatted": "^3.2.9",
-            "keyv": "^4.5.4",
-            "rimraf": "^5.0.5"
-          }
-        },
-        "foreground-child": {
-          "version": "3.1.1",
-          "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.1.1.tgz",
-          "integrity": "sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==",
-          "dev": true,
-          "requires": {
-            "cross-spawn": "^7.0.0",
-            "signal-exit": "^4.0.1"
-          }
-        },
-        "glob": {
-          "version": "10.3.10",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz",
-          "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==",
-          "dev": true,
-          "requires": {
-            "foreground-child": "^3.1.0",
-            "jackspeak": "^2.3.5",
-            "minimatch": "^9.0.1",
-            "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0",
-            "path-scurry": "^1.10.1"
-          }
-        },
-        "global-modules": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-2.0.0.tgz",
-          "integrity": "sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==",
-          "dev": true,
-          "requires": {
-            "global-prefix": "^3.0.0"
-          }
-        },
-        "global-prefix": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-3.0.0.tgz",
-          "integrity": "sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==",
-          "dev": true,
-          "requires": {
-            "ini": "^1.3.5",
-            "kind-of": "^6.0.2",
-            "which": "^1.3.1"
-          }
-        },
-        "minimatch": {
-          "version": "9.0.3",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
-          "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
-          "dev": true,
-          "requires": {
-            "brace-expansion": "^2.0.1"
-          }
-        },
-        "rimraf": {
-          "version": "5.0.5",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.5.tgz",
-          "integrity": "sha512-CqDakW+hMe/Bz202FPEymy68P+G50RfMQK+Qo5YUqc9SPipvbGjCGKd0RSKEelbsfQuw3g5NZDSrlZZAJurH1A==",
-          "dev": true,
-          "requires": {
-            "glob": "^10.3.7"
-          }
-        },
-        "signal-exit": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-          "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-          "dev": true
-        },
-        "strip-ansi": {
-          "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
-          "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
-          "dev": true,
-          "requires": {
-            "ansi-regex": "^6.0.1"
-          }
-        },
-        "which": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
-          "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
-          "dev": true,
-          "requires": {
-            "isexe": "^2.0.0"
-          }
-        }
-      }
-    },
-    "stylelint-config-recommended": {
-      "version": "14.0.0",
-      "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-14.0.0.tgz",
-      "integrity": "sha512-jSkx290CglS8StmrLp2TxAppIajzIBZKYm3IxT89Kg6fGlxbPiTiyH9PS5YUuVAFwaJLl1ikiXX0QWjI0jmgZQ==",
-      "dev": true,
-      "requires": {}
-    },
-    "stylelint-config-recommended-scss": {
-      "version": "14.0.0",
-      "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-14.0.0.tgz",
-      "integrity": "sha512-HDvpoOAQ1RpF+sPbDOT2Q2/YrBDEJDnUymmVmZ7mMCeNiFSdhRdyGEimBkz06wsN+HaFwUh249gDR+I9JR7Onw==",
-      "dev": true,
-      "requires": {
-        "postcss-scss": "^4.0.9",
-        "stylelint-config-recommended": "^14.0.0",
-        "stylelint-scss": "^6.0.0"
-      }
-    },
-    "stylelint-scss": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-6.0.0.tgz",
-      "integrity": "sha512-N1xV/Ef5PNRQQt9E45unzGvBUN1KZxCI8B4FgN/pMfmyRYbZGVN4y9qWlvOMdScU17c8VVCnjIHTVn38Bb6qSA==",
-      "dev": true,
-      "requires": {
-        "known-css-properties": "^0.29.0",
-        "postcss-media-query-parser": "^0.2.3",
-        "postcss-resolve-nested-selector": "^0.1.1",
-        "postcss-selector-parser": "^6.0.13",
-        "postcss-value-parser": "^4.2.0"
-      }
-    },
-    "sugarss": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/sugarss/-/sugarss-2.0.0.tgz",
-      "integrity": "sha512-WfxjozUk0UVA4jm+U1d736AUpzSrNsQcIbyOkoE364GrtWmIrFdk5lksEupgWMD4VaT/0kVx1dobpiDumSgmJQ==",
-      "dev": true,
-      "optional": true,
-      "peer": true,
-      "requires": {
-        "postcss": "^7.0.2"
-      },
-      "dependencies": {
-        "picocolors": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
-          "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==",
-          "dev": true,
-          "optional": true,
-          "peer": true
-        },
-        "postcss": {
-          "version": "7.0.39",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.39.tgz",
-          "integrity": "sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==",
-          "dev": true,
-          "optional": true,
-          "peer": true,
-          "requires": {
-            "picocolors": "^0.2.1",
-            "source-map": "^0.6.1"
-          }
-        }
-      }
-    },
-    "supports-color": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-      "dev": true,
-      "requires": {
-        "has-flag": "^4.0.0"
-      }
-    },
-    "supports-hyperlinks": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/supports-hyperlinks/-/supports-hyperlinks-3.0.0.tgz",
-      "integrity": "sha512-QBDPHyPQDRTy9ku4URNGY5Lah8PAaXs6tAAwp55sL5WCsSW7GIfdf6W5ixfziW+t7wh3GVvHyHHyQ1ESsoRvaA==",
-      "dev": true,
-      "requires": {
-        "has-flag": "^4.0.0",
-        "supports-color": "^7.0.0"
-      }
-    },
-    "supports-preserve-symlinks-flag": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
-      "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
-      "dev": true
-    },
-    "svg-tags": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/svg-tags/-/svg-tags-1.0.0.tgz",
-      "integrity": "sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==",
-      "dev": true
-    },
-    "symbol-tree": {
-      "version": "3.2.4",
-      "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
-      "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
-      "dev": true
-    },
-    "tabbable": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-4.0.0.tgz",
-      "integrity": "sha512-H1XoH1URcBOa/rZZWxLxHCtOdVUEev+9vo5YdYhC9tCY4wnybX+VQrCYuy9ubkg69fCBxCONJOSLGfw0DWMffQ=="
-    },
-    "table": {
-      "version": "6.8.1",
-      "resolved": "https://registry.npmjs.org/table/-/table-6.8.1.tgz",
-      "integrity": "sha512-Y4X9zqrCftUhMeH2EptSSERdVKt/nEdijTOacGD/97EKjhQ/Qs8RTlEGABSJNNN8lac9kheH+af7yAkEWlgneA==",
-      "dev": true,
-      "requires": {
-        "ajv": "^8.0.1",
-        "lodash.truncate": "^4.4.2",
-        "slice-ansi": "^4.0.0",
-        "string-width": "^4.2.3",
-        "strip-ansi": "^6.0.1"
-      }
-    },
-    "tar-fs": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.5.tgz",
-      "integrity": "sha512-JOgGAmZyMgbqpLwct7ZV8VzkEB6pxXFBVErLtb+XCOqzc6w1xiWKI9GVd6bwk68EX7eJ4DWmfXVmq8K2ziZTGg==",
-      "dev": true,
-      "requires": {
-        "bare-fs": "^2.1.1",
-        "bare-path": "^2.1.0",
-        "pump": "^3.0.0",
-        "tar-stream": "^3.1.5"
-      },
-      "dependencies": {
-        "tar-stream": {
-          "version": "3.1.7",
-          "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.7.tgz",
-          "integrity": "sha512-qJj60CXt7IU1Ffyc3NJMjh6EkuCFej46zUqJ4J7pqYlThyd9bO0XBTmcOIhSzZJVWfsLks0+nle/j538YAW9RQ==",
-          "dev": true,
-          "requires": {
-            "b4a": "^1.6.4",
-            "fast-fifo": "^1.2.0",
-            "streamx": "^2.15.0"
-          }
-        }
-      }
-    },
-    "tar-stream": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-2.2.0.tgz",
-      "integrity": "sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==",
-      "dev": true,
-      "requires": {
-        "bl": "^4.0.3",
-        "end-of-stream": "^1.4.1",
-        "fs-constants": "^1.0.0",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1"
-      }
-    },
-    "tcp-port-used": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/tcp-port-used/-/tcp-port-used-1.0.2.tgz",
-      "integrity": "sha512-l7ar8lLUD3XS1V2lfoJlCBaeoaWo/2xfYt81hM7VlvR4RrMVFqfmzfhLVk40hAb368uitje5gPtBRL1m/DGvLA==",
-      "dev": true,
-      "requires": {
-        "debug": "4.3.1",
-        "is2": "^2.0.6"
-      },
-      "dependencies": {
-        "debug": {
-          "version": "4.3.1",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
-          "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
-          "dev": true,
-          "requires": {
-            "ms": "2.1.2"
-          }
-        }
-      }
-    },
-    "test-exclude": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-6.0.0.tgz",
-      "integrity": "sha512-cAGWPIyOHU6zlmg88jwm7VRyXnMN7iV68OGAbYDk/Mh/xC/pzVPlQtY6ngoIH/5/tciuhGfvESU8GrHrcxD56w==",
-      "dev": true,
-      "requires": {
-        "@istanbuljs/schema": "^0.1.2",
-        "glob": "^7.1.4",
-        "minimatch": "^3.0.4"
-      }
-    },
-    "text-decoder": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/text-decoder/-/text-decoder-1.1.0.tgz",
-      "integrity": "sha512-TmLJNj6UgX8xcUZo4UDStGQtDiTzF7BzWlzn9g7UWrjkpHr5uJTK1ld16wZ3LXb2vb6jH8qU89dW5whuMdXYdw==",
-      "dev": true,
-      "requires": {
-        "b4a": "^1.6.4"
-      }
-    },
-    "text-table": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
-      "integrity": "sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==",
-      "dev": true
-    },
-    "through": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
-      "integrity": "sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==",
-      "dev": true
-    },
-    "tiny-invariant": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
-      "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==",
-      "dev": true
-    },
-    "tinybench": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.5.1.tgz",
-      "integrity": "sha512-65NKvSuAVDP/n4CqH+a9w2kTlLReS9vhsAP06MWx+/89nMinJyB2icyl58RIcqCmIggpojIGeuJGhjU1aGMBSg==",
-      "dev": true
-    },
-    "tinypool": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/tinypool/-/tinypool-0.8.1.tgz",
-      "integrity": "sha512-zBTCK0cCgRROxvs9c0CGK838sPkeokNGdQVUUwHAbynHFlmyJYj825f/oRs528HaIJ97lo0pLIlDUzwN+IorWg==",
-      "dev": true
-    },
-    "tinyspy": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/tinyspy/-/tinyspy-2.2.0.tgz",
-      "integrity": "sha512-d2eda04AN/cPOR89F7Xv5bK/jrQEhmcLFe6HFldoeO9AJtps+fqEnh486vnT/8y4bw38pSyxDcTCAq+Ks2aJTg==",
-      "dev": true
-    },
-    "tmp": {
-      "version": "0.0.33",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
-      "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==",
-      "dev": true,
-      "requires": {
-        "os-tmpdir": "~1.0.2"
-      }
-    },
-    "to-fast-properties": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
-      "integrity": "sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==",
-      "dev": true
-    },
-    "to-regex-range": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
-      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
-      "dev": true,
-      "requires": {
-        "is-number": "^7.0.0"
-      }
-    },
-    "token-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/token-stream/-/token-stream-1.0.0.tgz",
-      "integrity": "sha512-VSsyNPPW74RpHwR8Fc21uubwHY7wMDeJLys2IX5zJNih+OnAnaifKHo+1LHT7DAdloQ7apeaaWg8l7qnf/TnEg==",
-      "dev": true
-    },
-    "tough-cookie": {
-      "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.3.tgz",
-      "integrity": "sha512-aX/y5pVRkfRnfmuX+OdbSdXvPe6ieKX/G2s7e98f4poJHnqH3281gDPm/metm6E/WRamfx7WC4HUqkWHfQHprw==",
-      "dev": true,
-      "requires": {
-        "psl": "^1.1.33",
-        "punycode": "^2.1.1",
-        "universalify": "^0.2.0",
-        "url-parse": "^1.5.3"
-      },
-      "dependencies": {
-        "universalify": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz",
-          "integrity": "sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==",
-          "dev": true
-        }
-      }
-    },
-    "tr46": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/tr46/-/tr46-2.1.0.tgz",
-      "integrity": "sha512-15Ih7phfcdP5YxqiB+iDtLoaTz4Nd35+IiAv0kQ5FNKHzXgdWqPoTIqEDDJmXceQt4JZk6lVPT8lnDlPpGDppw==",
-      "dev": true,
-      "requires": {
-        "punycode": "^2.1.1"
-      }
-    },
-    "ts-map": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/ts-map/-/ts-map-1.0.3.tgz",
-      "integrity": "sha512-vDWbsl26LIcPGmDpoVzjEP6+hvHZkBkLW7JpvwbCv/5IYPJlsbzCVXY3wsCeAxAUeTclNOUZxnLdGh3VBD/J6w==",
-      "dev": true
-    },
-    "ts-node": {
-      "version": "10.9.1",
-      "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.1.tgz",
-      "integrity": "sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==",
-      "dev": true,
-      "requires": {
-        "@cspotcode/source-map-support": "^0.8.0",
-        "@tsconfig/node10": "^1.0.7",
-        "@tsconfig/node12": "^1.0.7",
-        "@tsconfig/node14": "^1.0.0",
-        "@tsconfig/node16": "^1.0.2",
-        "acorn": "^8.4.1",
-        "acorn-walk": "^8.1.1",
-        "arg": "^4.1.0",
-        "create-require": "^1.1.0",
-        "diff": "^4.0.1",
-        "make-error": "^1.1.1",
-        "v8-compile-cache-lib": "^3.0.1",
-        "yn": "3.1.1"
-      },
-      "dependencies": {
-        "acorn-walk": {
-          "version": "8.3.0",
-          "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.0.tgz",
-          "integrity": "sha512-FS7hV565M5l1R08MXqo8odwMTB02C2UqzB17RVgu9EyuYFBqJZ3/ZY97sQD5FewVu1UyDFc1yztUDrAwT0EypA==",
-          "dev": true
-        },
-        "diff": {
-          "version": "4.0.2",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
-          "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
-          "dev": true
-        }
-      }
-    },
-    "tsconfig-paths": {
-      "version": "3.14.2",
-      "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.2.tgz",
-      "integrity": "sha512-o/9iXgCYc5L/JxCHPe3Hvh8Q/2xm5Z+p18PESBU6Ff33695QnCHBEjcytY2q19ua7Mbl/DavtBOLq+oG0RCL+g==",
-      "dev": true,
-      "requires": {
-        "@types/json5": "^0.0.29",
-        "json5": "^1.0.2",
-        "minimist": "^1.2.6",
-        "strip-bom": "^3.0.0"
-      },
-      "dependencies": {
-        "json5": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
-          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
-          "dev": true,
-          "requires": {
-            "minimist": "^1.2.0"
-          }
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
-          "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==",
-          "dev": true
-        }
-      }
-    },
-    "tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==",
-      "dev": true
-    },
-    "tsutils": {
-      "version": "3.21.0",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-3.21.0.tgz",
-      "integrity": "sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==",
-      "dev": true,
-      "requires": {
-        "tslib": "^1.8.1"
-      },
-      "dependencies": {
-        "tslib": {
-          "version": "1.14.1",
-          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
-          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
-          "dev": true
-        }
-      }
-    },
-    "type-check": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
-      "integrity": "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==",
-      "dev": true,
-      "requires": {
-        "prelude-ls": "^1.2.1"
-      }
-    },
-    "type-detect": {
-      "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.8.tgz",
-      "integrity": "sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==",
-      "dev": true
-    },
-    "type-fest": {
-      "version": "0.21.3",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz",
-      "integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==",
-      "dev": true
-    },
-    "typed-array-buffer": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.0.tgz",
-      "integrity": "sha512-Y8KTSIglk9OZEr8zywiIHG/kmQ7KWyjseXs1CbSo8vC42w7hg2HgYTxSWwP0+is7bWDc1H+Fo026CpHFwm8tkw==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.1",
-        "is-typed-array": "^1.1.10"
-      }
-    },
-    "typed-array-byte-length": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.0.tgz",
-      "integrity": "sha512-Or/+kvLxNpeQ9DtSydonMxCx+9ZXOswtwJn17SNLvhptaXYDJvkFFP5zbfU/uLmvnBJlI4yrnXRxpdWH/M5tNA==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "for-each": "^0.3.3",
-        "has-proto": "^1.0.1",
-        "is-typed-array": "^1.1.10"
-      }
-    },
-    "typed-array-byte-offset": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.0.tgz",
-      "integrity": "sha512-RD97prjEt9EL8YgAgpOkf3O4IF9lhJFr9g0htQkm0rchFp/Vx7LW5Q8fSXXub7BXAODyUQohRMyOc3faCPd0hg==",
-      "dev": true,
-      "requires": {
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.2",
-        "for-each": "^0.3.3",
-        "has-proto": "^1.0.1",
-        "is-typed-array": "^1.1.10"
-      }
-    },
-    "typed-array-length": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.4.tgz",
-      "integrity": "sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "for-each": "^0.3.3",
-        "is-typed-array": "^1.1.9"
-      }
-    },
-    "typescript": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.2.tgz",
-      "integrity": "sha512-6l+RyNy7oAHDfxC4FzSJcz9vnjTKxrLpDG5M2Vu4SHRVNg6xzqZp6LYSR9zjqQTu8DU/f5xwxUdADOkbrIX2gQ==",
-      "devOptional": true
-    },
-    "ufo": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.3.2.tgz",
-      "integrity": "sha512-o+ORpgGwaYQXgqGDwd+hkS4PuZ3QnmqMMxRuajK/a38L6fTpcE5GPIfrf+L/KemFzfUpeUQc1rRS1iDBozvnFA==",
-      "dev": true
-    },
-    "unbox-primitive": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz",
-      "integrity": "sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==",
-      "dev": true,
-      "requires": {
-        "call-bind": "^1.0.2",
-        "has-bigints": "^1.0.2",
-        "has-symbols": "^1.0.3",
-        "which-boxed-primitive": "^1.0.2"
-      }
-    },
-    "unbzip2-stream": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/unbzip2-stream/-/unbzip2-stream-1.4.3.tgz",
-      "integrity": "sha512-mlExGW4w71ebDJviH16lQLtZS32VKqsSfk80GCfUlwT/4/hNRFsoscrF/c++9xinkMzECL1uL9DDwXqFWkruPg==",
-      "dev": true,
-      "requires": {
-        "buffer": "^5.2.1",
-        "through": "^2.3.8"
-      }
-    },
-    "undici-types": {
-      "version": "5.26.5",
-      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
-      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
-      "dev": true
-    },
-    "unicode-canonical-property-names-ecmascript": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz",
-      "integrity": "sha512-yY5PpDlfVIU5+y/BSCxAJRBIS1Zc2dDG3Ujq+sR0U+JjUevW2JhocOF+soROYDSaAezOzOKuyyixhD6mBknSmQ==",
-      "dev": true
-    },
-    "unicode-match-property-ecmascript": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/unicode-match-property-ecmascript/-/unicode-match-property-ecmascript-2.0.0.tgz",
-      "integrity": "sha512-5kaZCrbp5mmbz5ulBkDkbY0SsPOjKqVS35VpL9ulMPfSl0J0Xsm+9Evphv9CoIZFwre7aJoa94AY6seMKGVN5Q==",
-      "dev": true,
-      "requires": {
-        "unicode-canonical-property-names-ecmascript": "^2.0.0",
-        "unicode-property-aliases-ecmascript": "^2.0.0"
-      }
-    },
-    "unicode-match-property-value-ecmascript": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-2.1.0.tgz",
-      "integrity": "sha512-qxkjQt6qjg/mYscYMC0XKRn3Rh0wFPlfxB0xkt9CfyTvpX1Ra0+rAmdX2QyAobptSEvuy4RtpPRui6XkV+8wjA==",
-      "dev": true
-    },
-    "unicode-property-aliases-ecmascript": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-2.1.0.tgz",
-      "integrity": "sha512-6t3foTQI9qne+OZoVQB/8x8rk2k1eVy1gRXhV3oFQ5T6R1dqQ1xtin3XqSlx3+ATBkliTaR/hHyJBm+LVPNM8w==",
-      "dev": true
-    },
-    "universalify": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
-      "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
-      "dev": true
-    },
-    "untildify": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/untildify/-/untildify-4.0.0.tgz",
-      "integrity": "sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw==",
-      "dev": true
-    },
-    "update-browserslist-db": {
-      "version": "1.0.13",
-      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz",
-      "integrity": "sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==",
-      "dev": true,
-      "requires": {
-        "escalade": "^3.1.1",
-        "picocolors": "^1.0.0"
-      }
-    },
-    "uri-js": {
-      "version": "4.4.1",
-      "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
-      "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
-      "dev": true,
-      "requires": {
-        "punycode": "^2.1.0"
-      }
-    },
-    "url-parse": {
-      "version": "1.5.10",
-      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
-      "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==",
-      "dev": true,
-      "requires": {
-        "querystringify": "^2.1.1",
-        "requires-port": "^1.0.0"
-      }
-    },
-    "urlpattern-polyfill": {
-      "version": "10.0.0",
-      "resolved": "https://registry.npmjs.org/urlpattern-polyfill/-/urlpattern-polyfill-10.0.0.tgz",
-      "integrity": "sha512-H/A06tKD7sS1O1X2SshBVeA5FLycRpjqiBeqGKmBwBDBy28EnRjORxTNe269KSSr5un5qyWi1iL61wLxpd+ZOg==",
-      "dev": true
-    },
-    "util-deprecate": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
-      "dev": true
-    },
-    "uuid": {
-      "version": "8.3.2",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
-      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
-      "dev": true
-    },
-    "v8-compile-cache-lib": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz",
-      "integrity": "sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==",
-      "dev": true
-    },
-    "v8-to-istanbul": {
-      "version": "9.2.0",
-      "resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.2.0.tgz",
-      "integrity": "sha512-/EH/sDgxU2eGxajKdwLCDmQ4FWq+kpi3uCmBGpw1xJtnAxEjlD8j8PEiGWpCIMIs3ciNAgH0d3TTJiUkYzyZjA==",
-      "dev": true,
-      "requires": {
-        "@jridgewell/trace-mapping": "^0.3.12",
-        "@types/istanbul-lib-coverage": "^2.0.1",
-        "convert-source-map": "^2.0.0"
-      }
-    },
-    "validate-npm-package-license": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
-      "integrity": "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==",
-      "dev": true,
-      "requires": {
-        "spdx-correct": "^3.0.0",
-        "spdx-expression-parse": "^3.0.0"
-      }
-    },
-    "validator": {
-      "version": "13.11.0",
-      "resolved": "https://registry.npmjs.org/validator/-/validator-13.11.0.tgz",
-      "integrity": "sha512-Ii+sehpSfZy+At5nPdnyMhx78fEoPDkR2XW/zimHEL3MyGJQOCQ7WeP20jPYRz7ZCpcKLB21NxuXHF3bxjStBQ==",
-      "dev": true
-    },
-    "vite": {
-      "version": "5.0.10",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-5.0.10.tgz",
-      "integrity": "sha512-2P8J7WWgmc355HUMlFrwofacvr98DAjoE52BfdbwQtyLH06XKwaL/FMnmKM2crF0iX4MpmMKoDlNCB1ok7zHCw==",
-      "dev": true,
-      "requires": {
-        "esbuild": "^0.19.3",
-        "fsevents": "~2.3.3",
-        "postcss": "^8.4.32",
-        "rollup": "^4.2.0"
-      }
-    },
-    "vite-node": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/vite-node/-/vite-node-1.1.1.tgz",
-      "integrity": "sha512-2bGE5w4jvym5v8llF6Gu1oBrmImoNSs4WmRVcavnG2me6+8UQntTqLiAMFyiAobp+ZXhj5ZFhI7SmLiFr/jrow==",
-      "dev": true,
-      "requires": {
-        "cac": "^6.7.14",
-        "debug": "^4.3.4",
-        "pathe": "^1.1.1",
-        "picocolors": "^1.0.0",
-        "vite": "^5.0.0"
-      }
-    },
-    "vite-plugin-dts": {
-      "version": "3.6.4",
-      "resolved": "https://registry.npmjs.org/vite-plugin-dts/-/vite-plugin-dts-3.6.4.tgz",
-      "integrity": "sha512-yOVhUI/kQhtS6lCXRYYLv2UUf9bftcwQK9ROxCX2ul17poLQs02ctWX7+vXB8GPRzH8VCK3jebEFtPqqijXx6w==",
-      "dev": true,
-      "requires": {
-        "@microsoft/api-extractor": "^7.38.0",
-        "@rollup/pluginutils": "^5.0.5",
-        "@vue/language-core": "^1.8.20",
-        "debug": "^4.3.4",
-        "kolorist": "^1.8.0",
-        "vue-tsc": "^1.8.20"
-      }
-    },
-    "vitest": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/vitest/-/vitest-1.1.1.tgz",
-      "integrity": "sha512-Ry2qs4UOu/KjpXVfOCfQkTnwSXYGrqTbBZxw6reIYEFjSy1QUARRg5pxiI5BEXy+kBVntxUYNMlq4Co+2vD3fQ==",
-      "dev": true,
-      "requires": {
-        "@vitest/expect": "1.1.1",
-        "@vitest/runner": "1.1.1",
-        "@vitest/snapshot": "1.1.1",
-        "@vitest/spy": "1.1.1",
-        "@vitest/utils": "1.1.1",
-        "acorn-walk": "^8.3.0",
-        "cac": "^6.7.14",
-        "chai": "^4.3.10",
-        "debug": "^4.3.4",
-        "execa": "^8.0.1",
-        "local-pkg": "^0.5.0",
-        "magic-string": "^0.30.5",
-        "pathe": "^1.1.1",
-        "picocolors": "^1.0.0",
-        "std-env": "^3.5.0",
-        "strip-literal": "^1.3.0",
-        "tinybench": "^2.5.1",
-        "tinypool": "^0.8.1",
-        "vite": "^5.0.0",
-        "vite-node": "1.1.1",
-        "why-is-node-running": "^2.2.2"
-      },
-      "dependencies": {
-        "acorn-walk": {
-          "version": "8.3.1",
-          "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.1.tgz",
-          "integrity": "sha512-TgUZgYvqZprrl7YldZNoa9OciCAyZR+Ejm9eXzKCmjsF5IKp/wgQ7Z/ZpjpGTIUPwrHQIcYeI8qDh4PsEwxMbw==",
-          "dev": true
-        }
-      }
-    },
-    "void-elements": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz",
-      "integrity": "sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==",
-      "dev": true
-    },
-    "vue": {
-      "version": "3.3.9",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.3.9.tgz",
-      "integrity": "sha512-sy5sLCTR8m6tvUk1/ijri3Yqzgpdsmxgj6n6yl7GXXCXqVbmW2RCXe9atE4cEI6Iv7L89v5f35fZRRr5dChP9w==",
-      "peer": true,
-      "requires": {
-        "@vue/compiler-dom": "3.3.9",
-        "@vue/compiler-sfc": "3.3.9",
-        "@vue/runtime-dom": "3.3.9",
-        "@vue/server-renderer": "3.3.9",
-        "@vue/shared": "3.3.9"
-      }
-    },
-    "vue-component-type-helpers": {
-      "version": "1.8.24",
-      "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-1.8.24.tgz",
-      "integrity": "sha512-lqWs/7fdRXoSBAlbouHBX+LNuaY6gI9xWW34m/ZIz9zVPYHEyw0b2/zaCBwlKx0NtKTeF/6pOpvrxVkh7nhIYg==",
-      "dev": true
-    },
-    "vue-docgen-api": {
-      "version": "4.78.0",
-      "resolved": "https://registry.npmjs.org/vue-docgen-api/-/vue-docgen-api-4.78.0.tgz",
-      "integrity": "sha512-RsZf+qzTttCCAN9v7AKmBykc2QWmO8csVk1c2aXeOktomSOu0NA7sgK4ObuRB5lpmtOvTnwuxssyYmxXxABr+A==",
-      "dev": true,
-      "requires": {
-        "@babel/parser": "^7.21.4",
-        "@babel/types": "^7.21.4",
-        "@vue/compiler-dom": "^3.2.0",
-        "@vue/compiler-sfc": "^3.2.0",
-        "ast-types": "^0.16.1",
-        "esm-resolve": "^1.0.8",
-        "hash-sum": "^2.0.0",
-        "lru-cache": "^8.0.3",
-        "pug": "^3.0.2",
-        "recast": "^0.23.1",
-        "ts-map": "^1.0.3",
-        "vue-inbrowser-compiler-independent-utils": "^4.69.0"
-      },
-      "dependencies": {
-        "lru-cache": {
-          "version": "8.0.5",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-8.0.5.tgz",
-          "integrity": "sha512-MhWWlVnuab1RG5/zMRRcVGXZLCXrZTgfwMikgzCegsPnG62yDQo5JnqKkrK4jO5iKqDAZGItAqN5CtKBCBWRUA==",
-          "dev": true
-        }
-      }
-    },
-    "vue-docgen-cli": {
-      "version": "4.79.0",
-      "resolved": "https://registry.npmjs.org/vue-docgen-cli/-/vue-docgen-cli-4.79.0.tgz",
-      "integrity": "sha512-ye4/HAy1i/ULWpvLC+k7FGr7QiXyCPyduFoWAaXeMgmhxAu5H3jPSLQwf6MQwOWlMw4phRQnMlGfyHH1/NjsrQ==",
-      "dev": true,
-      "requires": {
-        "cac": "^6.7.14",
-        "chokidar": "^3.5.1",
-        "globby": "^11.1.0",
-        "lodash.memoize": "4.1.2",
-        "loglevel": "^1.8.1",
-        "prettier": "^2.8.4",
-        "vue-docgen-api": "^4.78.0"
-      },
-      "dependencies": {
-        "prettier": {
-          "version": "2.8.8",
-          "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz",
-          "integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
-          "dev": true
-        }
-      }
-    },
-    "vue-eslint-parser": {
-      "version": "9.3.2",
-      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.3.2.tgz",
-      "integrity": "sha512-q7tWyCVaV9f8iQyIA5Mkj/S6AoJ9KBN8IeUSf3XEmBrOtxOZnfTg5s4KClbZBCK3GtnT/+RyCLZyDHuZwTuBjg==",
-      "dev": true,
-      "requires": {
-        "debug": "^4.3.4",
-        "eslint-scope": "^7.1.1",
-        "eslint-visitor-keys": "^3.3.0",
-        "espree": "^9.3.1",
-        "esquery": "^1.4.0",
-        "lodash": "^4.17.21",
-        "semver": "^7.3.6"
-      },
-      "dependencies": {
-        "eslint-scope": {
-          "version": "7.2.2",
-          "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
-          "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
-          "dev": true,
-          "requires": {
-            "esrecurse": "^4.3.0",
-            "estraverse": "^5.2.0"
-          }
-        },
-        "estraverse": {
-          "version": "5.3.0",
-          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
-          "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
-          "dev": true
-        },
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "vue-inbrowser-compiler-independent-utils": {
-      "version": "4.71.1",
-      "resolved": "https://registry.npmjs.org/vue-inbrowser-compiler-independent-utils/-/vue-inbrowser-compiler-independent-utils-4.71.1.tgz",
-      "integrity": "sha512-K3wt3iVmNGaFEOUR4JIThQRWfqokxLfnPslD41FDZB2ajXp789+wCqJyGYlIFsvEQ2P61PInw6/ph5iiqg51gg==",
-      "dev": true,
-      "requires": {}
-    },
-    "vue-router": {
-      "version": "4.2.5",
-      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.2.5.tgz",
-      "integrity": "sha512-DIUpKcyg4+PTQKfFPX88UWhlagBEBEfJ5A8XDXRJLUnZOvcpMF8o/dnL90vpVkGaPbjvXazV/rC1qBKrZlFugw==",
-      "dev": true,
-      "requires": {
-        "@vue/devtools-api": "^6.5.0"
-      }
-    },
-    "vue-template-compiler": {
-      "version": "2.7.15",
-      "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.15.tgz",
-      "integrity": "sha512-yQxjxMptBL7UAog00O8sANud99C6wJF+7kgbcwqkvA38vCGF7HWE66w0ZFnS/kX5gSoJr/PQ4/oS3Ne2pW37Og==",
-      "dev": true,
-      "requires": {
-        "de-indent": "^1.0.2",
-        "he": "^1.2.0"
-      }
-    },
-    "vue-tsc": {
-      "version": "1.8.24",
-      "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-1.8.24.tgz",
-      "integrity": "sha512-eH1CSj231OzVEY5Hi7wS6ubzyOEwgr5jCptR0Ddf2SitGcaXIsPVDvrprm3eolCdyhDt3WS1Eb2F4fGX9BsUUw==",
-      "dev": true,
-      "requires": {
-        "@volar/typescript": "~1.11.1",
-        "@vue/language-core": "1.8.24",
-        "semver": "^7.5.4"
-      },
-      "dependencies": {
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "semver": {
-          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
-    "w3c-hr-time": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz",
-      "integrity": "sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==",
-      "dev": true,
-      "requires": {
-        "browser-process-hrtime": "^1.0.0"
-      }
-    },
-    "w3c-xmlserializer": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-2.0.0.tgz",
-      "integrity": "sha512-4tzD0mF8iSiMiNs30BiLO3EpfGLZUT2MSX/G+o7ZywDzliWQ3OPtTZ0PTC3B3ca1UAf4cJMHB+2Bf56EriJuRA==",
-      "dev": true,
-      "requires": {
-        "xml-name-validator": "^3.0.0"
-      },
-      "dependencies": {
-        "xml-name-validator": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-3.0.0.tgz",
-          "integrity": "sha512-A5CUptxDsvxKJEU3yO6DuWBSJz/qizqzJKOMIfUJHETbBw/sFaDxgd6fxm1ewUaM0jZ444Fc5vC5ROYurg/4Pw==",
-          "dev": true
-        }
-      }
-    },
-    "wcwidth": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/wcwidth/-/wcwidth-1.0.1.tgz",
-      "integrity": "sha512-XHPEwS0q6TaxcvG85+8EYkbiCux2XtWG2mkc47Ng2A77BQu9+DqIOJldST4HgPkuea7dvKSj5VgX3P1d4rW8Tg==",
-      "dev": true,
-      "requires": {
-        "defaults": "^1.0.3"
-      }
-    },
-    "webidl-conversions": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-6.1.0.tgz",
-      "integrity": "sha512-qBIvFLGiBpLjfwmYAaHPXsn+ho5xZnGvyGvsarywGNc8VyQJUMHJ8OBKGGrPER0okBeMDaan4mNBlgBROxuI8w==",
-      "dev": true
-    },
-    "whatwg-encoding": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.5.tgz",
-      "integrity": "sha512-b5lim54JOPN9HtzvK9HFXvBma/rnfFeqsic0hSpjtDbVxR3dJKLc+KB4V6GgiGOvl7CY/KNh8rxSo9DKQrnUEw==",
-      "dev": true,
-      "requires": {
-        "iconv-lite": "0.4.24"
-      }
-    },
-    "whatwg-mimetype": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz",
-      "integrity": "sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g==",
-      "dev": true
-    },
-    "whatwg-url": {
-      "version": "8.7.0",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-8.7.0.tgz",
-      "integrity": "sha512-gAojqb/m9Q8a5IV96E3fHJM70AzCkgt4uXYX2O7EmuyOnLrViCQlsEBmF9UQIu3/aeAIp2U17rtbpZWNntQqdg==",
-      "dev": true,
-      "requires": {
-        "lodash": "^4.7.0",
-        "tr46": "^2.1.0",
-        "webidl-conversions": "^6.1.0"
-      }
-    },
-    "which": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
-      "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
-      "dev": true,
-      "requires": {
-        "isexe": "^2.0.0"
-      }
-    },
-    "which-boxed-primitive": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz",
-      "integrity": "sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==",
-      "dev": true,
-      "requires": {
-        "is-bigint": "^1.0.1",
-        "is-boolean-object": "^1.1.0",
-        "is-number-object": "^1.0.4",
-        "is-string": "^1.0.5",
-        "is-symbol": "^1.0.3"
-      }
-    },
-    "which-collection": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.1.tgz",
-      "integrity": "sha512-W8xeTUwaln8i3K/cY1nGXzdnVZlidBcagyNFtBdD5kxnb4TvGKR7FfSIS3mYpwWS1QUCutfKz8IY8RjftB0+1A==",
-      "dev": true,
-      "requires": {
-        "is-map": "^2.0.1",
-        "is-set": "^2.0.1",
-        "is-weakmap": "^2.0.1",
-        "is-weakset": "^2.0.1"
-      }
-    },
-    "which-pm-runs": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/which-pm-runs/-/which-pm-runs-1.1.0.tgz",
-      "integrity": "sha512-n1brCuqClxfFfq/Rb0ICg9giSZqCS+pLtccdag6C2HyufBrh3fBOiy9nb6ggRMvWOVH5GrdJskj5iGTZNxd7SA==",
-      "dev": true
-    },
-    "which-typed-array": {
-      "version": "1.1.13",
-      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.13.tgz",
-      "integrity": "sha512-P5Nra0qjSncduVPEAr7xhoF5guty49ArDTwzJ/yNuPIbZppyRxFQsRCWrocxIY+CnMVG+qfbU2FmDKyvSGClow==",
-      "dev": true,
-      "requires": {
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.4",
-        "for-each": "^0.3.3",
-        "gopd": "^1.0.1",
-        "has-tostringtag": "^1.0.0"
-      }
-    },
-    "why-is-node-running": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-2.2.2.tgz",
-      "integrity": "sha512-6tSwToZxTOcotxHeA+qGCq1mVzKR3CwcJGmVcY+QE8SHy6TnpFnh8PAvPNHYr7EcuVeG0QSMxtYCuO1ta/G/oA==",
-      "dev": true,
-      "requires": {
-        "siginfo": "^2.0.0",
-        "stackback": "0.0.2"
-      }
-    },
-    "widest-line": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-3.1.0.tgz",
-      "integrity": "sha512-NsmoXalsWVDMGupxZ5R08ka9flZjjiLvHVAWYOKtiKM8ujtZWr9cRffak+uSE48+Ob8ObalXpwyeUiyDD6QFgg==",
-      "dev": true,
-      "requires": {
-        "string-width": "^4.0.0"
-      }
-    },
-    "with": {
-      "version": "7.0.2",
-      "resolved": "https://registry.npmjs.org/with/-/with-7.0.2.tgz",
-      "integrity": "sha512-RNGKj82nUPg3g5ygxkQl0R937xLyho1J24ItRCBTr/m1YnZkzJy1hUiHUJrc/VlsDQzsCnInEGSg3bci0Lmd4w==",
-      "dev": true,
-      "requires": {
-        "@babel/parser": "^7.9.6",
-        "@babel/types": "^7.9.6",
-        "assert-never": "^1.2.1",
-        "babel-walk": "3.0.0-canary-5"
-      }
-    },
-    "word-wrap": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
-      "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
-      "dev": true
-    },
-    "workerpool": {
-      "version": "6.2.1",
-      "resolved": "https://registry.npmjs.org/workerpool/-/workerpool-6.2.1.tgz",
-      "integrity": "sha512-ILEIE97kDZvF9Wb9f6h5aXK4swSlKGUcOEGiIYb2OOu/IrDU9iwj0fD//SsA6E5ibwJxpEvhullJY4Sl4GcpAw==",
-      "dev": true
-    },
-    "wrap-ansi": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
-      "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
-      "dev": true,
-      "requires": {
-        "ansi-styles": "^4.0.0",
-        "string-width": "^4.1.0",
-        "strip-ansi": "^6.0.0"
-      }
-    },
-    "wrap-ansi-cjs": {
-      "version": "npm:wrap-ansi@7.0.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
-      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-      "dev": true,
-      "requires": {
-        "ansi-styles": "^4.0.0",
-        "string-width": "^4.1.0",
-        "strip-ansi": "^6.0.0"
-      }
-    },
-    "wrappy": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
-      "dev": true
-    },
-    "write-file-atomic": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-5.0.1.tgz",
-      "integrity": "sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==",
-      "dev": true,
-      "requires": {
-        "imurmurhash": "^0.1.4",
-        "signal-exit": "^4.0.1"
-      },
-      "dependencies": {
-        "signal-exit": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-          "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-          "dev": true
-        }
-      }
-    },
-    "ws": {
-      "version": "7.5.9",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.9.tgz",
-      "integrity": "sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==",
-      "dev": true,
-      "requires": {}
-    },
-    "xml-name-validator": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-4.0.0.tgz",
-      "integrity": "sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==",
-      "dev": true
-    },
-    "xmlchars": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
-      "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
-      "dev": true
-    },
-    "y18n": {
-      "version": "5.0.8",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
-      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
-      "dev": true
-    },
-    "yallist": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
-      "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
-      "dev": true
-    },
-    "yaml": {
-      "version": "1.10.2",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
-      "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==",
-      "dev": true
-    },
-    "yargs": {
-      "version": "16.2.0",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz",
-      "integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==",
-      "dev": true,
-      "requires": {
-        "cliui": "^7.0.2",
-        "escalade": "^3.1.1",
-        "get-caller-file": "^2.0.5",
-        "require-directory": "^2.1.1",
-        "string-width": "^4.2.0",
-        "y18n": "^5.0.5",
-        "yargs-parser": "^20.2.2"
-      }
-    },
-    "yargs-parser": {
-      "version": "20.2.9",
-      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz",
-      "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==",
-      "dev": true
-    },
-    "yargs-unparser": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/yargs-unparser/-/yargs-unparser-2.0.0.tgz",
-      "integrity": "sha512-7pRTIA9Qc1caZ0bZ6RYRGbHJthJWuakf+WmHK0rVeLkNrrGhfoabBNdue6kdINI6r4if7ocq9aD/n7xwKOdzOA==",
-      "dev": true,
-      "requires": {
-        "camelcase": "^6.0.0",
-        "decamelize": "^4.0.0",
-        "flat": "^5.0.2",
-        "is-plain-obj": "^2.1.0"
-      },
-      "dependencies": {
-        "decamelize": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-4.0.0.tgz",
-          "integrity": "sha512-9iE1PgSik9HeIIw2JO94IidnE3eBoQrFJ3w7sFuzSX4DpmZ3v5sZpUiV5Swcf6mQEF+Y0ru8Neo+p+nyh2J+hQ==",
-          "dev": true
-        },
-        "is-plain-obj": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-2.1.0.tgz",
-          "integrity": "sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA==",
-          "dev": true
-        }
-      }
-    },
-    "yauzl": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.10.0.tgz",
-      "integrity": "sha512-p4a9I6X6nu6IhoGmBqAcbJy1mlC4j27vEPZX9F4L4/vZT3Lyq1VkFHw/V/PUcB9Buo+DG3iHkT0x3Qya58zc3g==",
-      "dev": true,
-      "requires": {
-        "buffer-crc32": "~0.2.3",
-        "fd-slicer": "~1.1.0"
-      }
-    },
-    "yn": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
-      "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==",
-      "dev": true
-    },
-    "yocto-queue": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
-      "integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==",
-      "dev": true
-    },
-    "z-schema": {
-      "version": "5.0.5",
-      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-5.0.5.tgz",
-      "integrity": "sha512-D7eujBWkLa3p2sIpJA0d1pr7es+a7m0vFAnZLlCEKq/Ij2k0MLi9Br2UPxoxdYystm5K1yeBGzub0FlYUEWj2Q==",
-      "dev": true,
-      "requires": {
-        "commander": "^9.4.1",
-        "lodash.get": "^4.4.2",
-        "lodash.isequal": "^4.5.0",
-        "validator": "^13.7.0"
-      },
-      "dependencies": {
-        "commander": {
-          "version": "9.5.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz",
-          "integrity": "sha512-KRs7WVDKg86PWiuAqhDrAQnTXZKraVcCc6vFdL14qrZ/DcWwuRo7VoiYXalXO7S5GKpqYiVEwCbgFDfxNHKJBQ==",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "zip-stream": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/zip-stream/-/zip-stream-4.1.1.tgz",
-      "integrity": "sha512-9qv4rlDiopXg4E69k+vMHjNN63YFMe9sZMrdlvKnCjlCRWeCBswPPMPUfx+ipsAWq1LXHe70RcbaHdJJpS6hyQ==",
-      "dev": true,
-      "requires": {
-        "archiver-utils": "^3.0.4",
-        "compress-commons": "^4.1.2",
-        "readable-stream": "^3.6.0"
-      },
-      "dependencies": {
-        "archiver-utils": {
-          "version": "3.0.4",
-          "resolved": "https://registry.npmjs.org/archiver-utils/-/archiver-utils-3.0.4.tgz",
-          "integrity": "sha512-KVgf4XQVrTjhyWmx6cte4RxonPLR9onExufI1jhvw/MQ4BB6IsZD5gT8Lq+u/+pRkWna/6JoHpiQioaqFP5Rzw==",
-          "dev": true,
-          "requires": {
-            "glob": "^7.2.3",
-            "graceful-fs": "^4.2.0",
-            "lazystream": "^1.0.0",
-            "lodash.defaults": "^4.2.0",
-            "lodash.difference": "^4.5.0",
-            "lodash.flatten": "^4.4.0",
-            "lodash.isplainobject": "^4.0.6",
-            "lodash.union": "^4.6.0",
-            "normalize-path": "^3.0.0",
-            "readable-stream": "^3.6.0"
-          }
-        }
-      }
-    },
-    "zod": {
-      "version": "3.22.4",
-      "resolved": "https://registry.npmjs.org/zod/-/zod-3.22.4.tgz",
-      "integrity": "sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==",
-      "dev": true
-    }
   }
 }
diff --git a/package.json b/package.json
index 8bc4ebe32..764707500 100644
--- a/package.json
+++ b/package.json
@@ -70,10 +70,9 @@
     "autoprefixer": "^10.2.5",
     "c8": "^7.11.0",
     "chalk": "^4.1.0",
-    "chromedriver": "^126.0.4",
+    "chromedriver": "127",
     "concat": "^1.0.3",
     "cross-env": "^7.0.3",
-    "csstype": "^3.1.3",
     "cz-conventional-changelog": "^3.3.0",
     "eslint": "^8.42.0",
     "eslint-config-prettier": "^8.8.0",
@@ -97,7 +96,7 @@
     "postcss-calc": "^8.0.0",
     "postcss-pxtorem": "^6.0.0",
     "postcss-scss": "^4.0.0",
-    "puppeteer": "^22.10.0",
+    "puppeteer": "22.15.0",
     "sass": "^1.32.11",
     "sinon": "^11.1.0",
     "stylelint": "^16.1.0",
@@ -111,7 +110,7 @@
     "vue-docgen-cli": "^4.79.0",
     "vue-eslint-parser": "^9.3.0",
     "vue-router": "^4.0.10",
-    "vue-tsc": "^1.6.5"
+    "vue-tsc": "^2.0.29"
   },
   "engines": {
     "node": ">= 20.0.0",
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 2ce64de4a..4f44d8615 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -15,6 +15,7 @@ defineOptions({ name: 'CdrFulfillmentTile' });
 
 const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   tag: 'button',
+  role: 'radio',
   modifier: 'primary',
   checked: false,
   disabled: false,
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 4492734ec..010ca2a68 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -13,6 +13,7 @@ defineOptions({ name: 'CdrSurfaceSelection' });
 
 const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   tag: 'button',
+  role: 'radio',
   modifier: 'primary',
   checked: false,
   disabled: false,
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index 8a52ce2e4..e3320c0d5 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -24,7 +24,7 @@ const modifier = ref('primary');
       <CdrSelect
         id="modifier"
         v-model="modifier"
-        label=""
+        label="Modifier"
         :options="['primary', 'secondary']"
       >
         Modifier
@@ -32,34 +32,34 @@ const modifier = ref('primary');
     </div>
     <hr class="example__hr" />
     <div class="example__demos">
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading }">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading}">
         This is default
       </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: true, modifier, loading }">
+      <CdrSurfaceSelection v-bind="{ checked: true, modifier, role: 'checkbox', loading }">
         This is checked
       </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading: !loading }">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading: !loading }">
         This is loading
       </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, disabled: true }">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading, disabled: true }">
         This is disabled
       </CdrSurfaceSelection>
     </div>
     <hr class="example__hr" />
     <div class="example__demos2">
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading }">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading }">
         Custom loading
         <template #loading>...</template>
       </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading }">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading }">
         <div>Auto</div>
         <div>Auto</div>
       </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, class: 'example__wide' }">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, role: 'checkbox', class: 'example__wide' }">
         <div>Auto</div>
         <div class="example__100">100%</div>
       </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, orientation: 'vertical' }">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, role: 'checkbox', orientation: 'vertical' }">
         <div>orientation</div>
         <div>vertical</div>
       </CdrSurfaceSelection>
@@ -100,7 +100,7 @@ const modifier = ref('primary');
 
   &__100 {
     width: 100%;
-    background: grey;
+    background: black;
     color: white;
     text-align: center;
   }
diff --git a/src/dev/router.js b/src/dev/router.js
index 49cb34d05..d6daee78a 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -18,7 +18,7 @@ import e2e2 from 'srcdir/dev/e2e2.vue';
 // import SurveyForm from 'componentsdir/Form/SurveyForm';
 
 const routes = [
-  { path: '/', name: ' ', component: App },
+  { path: '/', name: 'Home', component: App },
   { path: '/kitchen-sink', name: 'KitchenSink', component: KitchenSink },
   // { path: '/utilities', name: 'Utilities', component: Examples.utilities },
   { path: '/abstract', name: 'Abstract', component: Examples.abstract },
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 8b965c745..de4b1dbf8 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -193,4 +193,5 @@ export interface CdrSurfaceSelectionProps extends CdrSurfaceProps {
   type?: 'button' | 'reset' | 'submit' | undefined;
   loading?: boolean;
   orientation?: Orientation;
+  role?: string;
 }
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index bad3a4075..1bcce1140 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -84,8 +84,8 @@ export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
 
 export const getSurfaceSelectionProps = (props: CdrSurfaceSelectionProps, baseClass: string) => {
   const { classes, inlineStyles } = getSurfaceProps(props, baseClass);
-  const { checked, loading, disabled } = props;
-  const additionalProps: HtmlAttributes = {};
+  const { checked, loading, disabled, ...otherProps } = props;
+  const additionalProps: HtmlAttributes = { ...otherProps };
 
   // Add checked
   additionalProps['aria-checked'] = checked;
diff --git a/test/e2e/nightwatch.conf.js b/test/e2e/nightwatch.conf.js
index 6dd480198..d3c4f25ec 100644
--- a/test/e2e/nightwatch.conf.js
+++ b/test/e2e/nightwatch.conf.js
@@ -24,7 +24,7 @@ module.exports = {
         devServerURL: `http://localhost:3000/#/`,
         asyncHookTimeout: 180000,
         async before() {
-          viteServer = await startViteServer(); 
+          viteServer = await startViteServer();
           const port = viteServer.config.server.port;
           this.launchUrl = `http://localhost:${port}`;
         },
@@ -45,4 +45,4 @@ module.exports = {
       },
     },
   },
-};
\ No newline at end of file
+};

From 8bd16de88d71b58d62942fb8ac40b12697f6e05d Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 5 Aug 2024 16:26:00 -0700
Subject: [PATCH 24/70] progress

---
 .../CdrFulfillmentTile.spec.js.snap           | 48 +++++++++++++++++++
 .../__snapshots__/CdrSelect.spec.js.snap      |  1 +
 .../CdrSurfaceSelection.spec.js.snap          | 30 ++++++++++++
 3 files changed, 79 insertions(+)

diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
index 730e2a7ff..5b74fa0e0 100644
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -4,6 +4,12 @@ exports[`CdrFulfillmentTile > component unit tests > default component with no c
 <button
   aria-checked="false"
   class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -61,6 +67,12 @@ exports[`CdrFulfillmentTile > is loading 1`] = `
   aria-checked="false"
   class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
   data-loading="true"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -135,6 +147,12 @@ exports[`CdrFulfillmentTile > shows body 1`] = `
 <button
   aria-checked="false"
   class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -209,6 +227,12 @@ exports[`CdrFulfillmentTile > shows footer 1`] = `
 <button
   aria-checked="false"
   class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -283,6 +307,12 @@ exports[`CdrFulfillmentTile > shows header 1`] = `
 <button
   aria-checked="false"
   class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -344,6 +374,12 @@ exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
 <button
   aria-checked="false"
   class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -400,6 +436,12 @@ exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
 <button
   aria-checked="false"
   class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -493,6 +535,12 @@ exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
 <button
   aria-checked="false"
   class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
diff --git a/src/components/select/__tests__/__snapshots__/CdrSelect.spec.js.snap b/src/components/select/__tests__/__snapshots__/CdrSelect.spec.js.snap
index 2f59b0ce7..16478f46f 100644
--- a/src/components/select/__tests__/__snapshots__/CdrSelect.spec.js.snap
+++ b/src/components/select/__tests__/__snapshots__/CdrSelect.spec.js.snap
@@ -317,6 +317,7 @@ exports[`CdrSelect > default configuration with a name attribute > with a requir
         id="renders"
         multiple=""
         name="testing"
+        value=""
       >
         <!--v-if-->
         
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
index 0e815d9d8..39608e1a5 100644
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -4,6 +4,12 @@ exports[`CdrSurfaceSelection > component unit tests > default component with no
 <button
   aria-checked="false"
   class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"
@@ -40,6 +46,12 @@ exports[`CdrSurfaceSelection > is checked 1`] = `
 <button
   aria-checked="true"
   class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"
@@ -80,6 +92,12 @@ exports[`CdrSurfaceSelection > is loading 1`] = `
   aria-checked="false"
   class="cdr-surface-selection cdr-surface-selection--modifier-primary"
   data-loading="true"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"
@@ -119,6 +137,12 @@ exports[`CdrSurfaceSelection > shows default 1`] = `
 <button
   aria-checked="false"
   class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"
@@ -158,6 +182,12 @@ exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
 <button
   aria-checked="false"
   class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"

From 7d8018db3bf6b9d0edc2c2c3df02e95835b5b444 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 19 Aug 2024 11:17:16 -0700
Subject: [PATCH 25/70] progress

---
 .../fulfillmentTile/CdrFulfillmentTile.vue    |  9 +----
 src/components/surface/CdrSurface.vue         |  4 +-
 src/components/surface/examples/Surface.vue   | 23 +++++++-----
 .../surfaceSelection/CdrSurfaceSelection.vue  |  9 +----
 .../examples/SurfaceSelection.vue             |  2 +-
 src/dev/SinkWrapper.vue                       | 24 ++++++++----
 src/types/interfaces.ts                       | 19 ++--------
 src/utils/surface.ts                          | 37 ++-----------------
 8 files changed, 43 insertions(+), 84 deletions(-)

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 4f44d8615..c4f667d24 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -29,13 +29,8 @@ const baseClass = 'cdr-fulfillment-tile';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { inlineStyles, classes, additionalProps } = getSurfaceSelectionProps(props, baseClass);
-
-  return {
-    ...additionalProps,
-    style: inlineStyles,
-    class: mapClasses(style, ...classes) || undefined,
-  };
+  const { classes, additionalProps } = getSurfaceSelectionProps(props, baseClass);
+  return { ...additionalProps, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
 
diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index eedf6230a..cf0b6b5ed 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -15,8 +15,8 @@ const props = withDefaults(defineProps<CdrSurfaceProps>(), {
 const style = useCssModule();
 
 const rootProps = computed(() => {
-  const { inlineStyles, classes } = getSurfaceProps(props, 'cdr-surface');
-  return { style: inlineStyles, class: mapClasses(style, ...classes) || undefined };
+  const { classes } = getSurfaceProps(props, 'cdr-surface');
+  return { class: mapClasses(style, ...classes) || undefined };
 });
 </script>
 
diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index 4010116fb..5fe72f202 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -18,44 +18,39 @@ const boxes: Example[] = [
   {
     label: 'This surface is styled like a card',
     props: {
-      display: 'inline-block',
       radius: 'soft',
       background: 'secondary',
       shadow: 'floating',
-      p: 'two-x',
+      class: 'example__card',
     },
   },
   {
     label: 'This surface is styled like a chip or pill',
     props: {
-      display: 'inline-block',
       radius: 'round',
       withBorder: true,
       borderColor: 'primary',
       background: 'secondary',
-      px: 'one-x',
-      py: 'three-quarter-x',
+      class: 'example__pill',
     },
   },
   {
     label: 'This surface uses the primary modifier to apply a background and border color',
     props: {
       modifier: 'primary',
-      display: 'inline-block',
       radius: 'soft',
-      p: 'one-x',
       withBorder: true,
+      class: 'example__card',
     },
   },
   {
     label: 'This surface uses the secondary modifier to apply a background and border color',
     props: {
       modifier: 'secondary',
-      display: 'inline-block',
       radius: 'soft',
-      p: 'one-x',
       withBorder: true,
       borderStyle: 'dashed',
+      class: 'example__card',
     },
   },
 ];
@@ -83,5 +78,15 @@ const boxes: Example[] = [
   &__hr {
     margin: $cdr-space-two-x 0;
   }
+
+  &__card {
+    display: inline-block;
+    padding: $cdr-space-two-x;
+  }
+
+  &__pill {
+    display: inline-block;
+    padding: $cdr-space-half-x $cdr-space-one-x;
+  }
 }
 </style>
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 010ca2a68..90edaf753 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -27,13 +27,8 @@ const baseClass = 'cdr-surface-selection';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { inlineStyles, classes, additionalProps } = getSurfaceSelectionProps(props, baseClass);
-
-  return {
-    ...additionalProps,
-    style: inlineStyles,
-    class: mapClasses(style, ...classes) || undefined,
-  };
+  const { classes, additionalProps } = getSurfaceSelectionProps(props, baseClass);
+  return { ...additionalProps, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
 
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index e3320c0d5..e63df9a6b 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -32,7 +32,7 @@ const modifier = ref('primary');
     </div>
     <hr class="example__hr" />
     <div class="example__demos">
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading}">
+      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading }">
         This is default
       </CdrSurfaceSelection>
       <CdrSurfaceSelection v-bind="{ checked: true, modifier, role: 'checkbox', loading }">
diff --git a/src/dev/SinkWrapper.vue b/src/dev/SinkWrapper.vue
index a567f3662..62081cd9d 100644
--- a/src/dev/SinkWrapper.vue
+++ b/src/dev/SinkWrapper.vue
@@ -1,6 +1,6 @@
 <template>
   <div :data-palette="palette">
-    <div class="radios">
+    <div class="sink-wrapper__radios">
       <div>Toggle palette:</div>
       <cdr-radio
         v-for="pal in palettes"
@@ -14,10 +14,10 @@
     </div>
     <cdr-surface
       background="primary"
-      p="two-x"
       :with-border="true"
       border-width="sixteenth-x"
       border-color="primary"
+      class="sink-wrapper__container"
     >
       <slot />
     </cdr-surface>
@@ -58,11 +58,19 @@ export default {
 };
 </script>
 
-<style>
-.radios {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  margin-bottom: 8px;
+<style lang="scss" scoped>
+@import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
+
+.sink-wrapper {
+  &__radios {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin-bottom: 8px;
+  }
+
+  &__container {
+    padding: $cdr-space-two-x;
+  }
 }
 </style>
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index de4b1dbf8..c92072dc2 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -171,25 +171,12 @@ export interface CdrSurfaceProps extends HtmlAttributes {
   borderWidth?: Space;
   borderColor?: BorderColor;
   borderStyle?: BorderStyle;
-  m?: Space;
-  mx?: Space;
-  my?: Space;
-  ml?: Space;
-  mr?: Space;
-  mt?: Space;
-  mb?: Space;
-  p?: Space;
-  px?: Space;
-  py?: Space;
-  pl?: Space;
-  pr?: Space;
-  pt?: Space;
-  pb?: Space;
 }
 
-export interface CdrSurfaceSelectionProps extends CdrSurfaceProps {
+export interface CdrSurfaceSelectionProps
+  extends Omit<CdrSurfaceProps, 'withBorder' | 'borderWidth' | 'borderColor' | 'borderStyle'> {
   disabled?: boolean;
-  checked: boolean;
+  checked?: boolean;
   type?: 'button' | 'reset' | 'submit' | undefined;
   loading?: boolean;
   orientation?: Orientation;
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index 1bcce1140..d702ba0d7 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -1,33 +1,12 @@
 import type {
   CdrSurfaceProps,
   CdrSurfaceSelectionProps,
-  InlineCss,
   HtmlAttributes,
 } from '../types/interfaces';
 
-// Map of margins and padding
-const marginsAndPaddingMap: Record<string, string> = {
-  m: 'margin',
-  mx: 'marginInline',
-  my: 'marginBlock',
-  ml: 'marginInlineStart',
-  mr: 'marginInlineEnd',
-  mt: 'marginTop',
-  mb: 'marginBottom',
-  p: 'padding',
-  px: 'paddingInline',
-  py: 'paddingBlock',
-  pl: 'paddingInlineStart',
-  pr: 'paddingInlineEnd',
-  pt: 'paddingTop',
-  pb: 'paddingBottom',
-};
-const marginAndPaddingKeys = Object.keys(marginsAndPaddingMap);
-
 // Manages the props passed along to all surfaces
 export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
   const classes = [baseClass];
-  const inlineStyles: InlineCss = {};
 
   // Add modifier, which applies a background and border color,
   // but does not apply a border width
@@ -69,21 +48,11 @@ export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
     classes.push(shadowClass);
   }
 
-  // Add margin and padding
-  if (marginAndPaddingKeys.find((key) => props[key])) {
-    marginAndPaddingKeys.forEach((key) => {
-      if (props[key]) {
-        const cssProperty = marginsAndPaddingMap[key];
-        inlineStyles[cssProperty] = `var(--cdr-space-${props[key]})`;
-      }
-    });
-  }
-
-  return { classes, inlineStyles };
+  return { classes };
 };
 
 export const getSurfaceSelectionProps = (props: CdrSurfaceSelectionProps, baseClass: string) => {
-  const { classes, inlineStyles } = getSurfaceProps(props, baseClass);
+  const { classes } = getSurfaceProps(props, baseClass);
   const { checked, loading, disabled, ...otherProps } = props;
   const additionalProps: HtmlAttributes = { ...otherProps };
 
@@ -100,5 +69,5 @@ export const getSurfaceSelectionProps = (props: CdrSurfaceSelectionProps, baseCl
     additionalProps['data-loading'] = loading;
   }
 
-  return { classes, inlineStyles, additionalProps };
+  return { classes, additionalProps };
 };

From 4d2eead7b4f2c525c80dff7f3149e3fb59c8c20a Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 19 Aug 2024 11:19:11 -0700
Subject: [PATCH 26/70] progress

---
 .../__snapshots__/CdrFulfillmentTile.spec.js.snap         | 8 --------
 src/components/surface/__tests__/CdrSurface.spec.js       | 2 --
 .../__snapshots__/CdrSurfaceSelection.spec.js.snap        | 5 -----
 3 files changed, 15 deletions(-)

diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
index 5b74fa0e0..dbc6485d5 100644
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -9,7 +9,6 @@ exports[`CdrFulfillmentTile > component unit tests > default component with no c
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -72,7 +71,6 @@ exports[`CdrFulfillmentTile > is loading 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -152,7 +150,6 @@ exports[`CdrFulfillmentTile > shows body 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -232,7 +229,6 @@ exports[`CdrFulfillmentTile > shows footer 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -312,7 +308,6 @@ exports[`CdrFulfillmentTile > shows header 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -379,7 +374,6 @@ exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -441,7 +435,6 @@ exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
@@ -540,7 +533,6 @@ exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-fulfillment-tile__inner"
diff --git a/src/components/surface/__tests__/CdrSurface.spec.js b/src/components/surface/__tests__/CdrSurface.spec.js
index 357e2a174..569134e74 100644
--- a/src/components/surface/__tests__/CdrSurface.spec.js
+++ b/src/components/surface/__tests__/CdrSurface.spec.js
@@ -13,8 +13,6 @@ describe('CdrSurface', () => {
         radius: 'soft',
         withBorder: true,
         borderWidth: 'one-x',
-        p: 'three-x',
-        m: 'one-x',
       })
       expect(wrapper.element).toMatchSnapshot()
     });
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
index 39608e1a5..e5c5bc4ac 100644
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -9,7 +9,6 @@ exports[`CdrSurfaceSelection > component unit tests > default component with no
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"
@@ -51,7 +50,6 @@ exports[`CdrSurfaceSelection > is checked 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"
@@ -97,7 +95,6 @@ exports[`CdrSurfaceSelection > is loading 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"
@@ -142,7 +139,6 @@ exports[`CdrSurfaceSelection > shows default 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"
@@ -187,7 +183,6 @@ exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
   role="radio"
   tag="button"
   type="button"
-  withborder="false"
 >
   <div
     class="cdr-surface-selection__inner"

From a5245437af9a1bcecf5cf1bf17961358576727ed Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 19 Aug 2024 11:39:04 -0700
Subject: [PATCH 27/70] progress

---
 src/components/fulfillmentTile/CdrFulfillmentTile.vue   | 1 -
 src/components/surfaceSelection/CdrSurfaceSelection.vue | 1 -
 src/types/interfaces.ts                                 | 2 +-
 src/types/other.ts                                      | 3 ++-
 src/utils/surface.ts                                    | 5 ++++-
 5 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index c4f667d24..c7db2c4fc 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -19,7 +19,6 @@ const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   modifier: 'primary',
   checked: false,
   disabled: false,
-  type: 'button',
   loading: false,
   orientation: 'vertical',
 });
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 90edaf753..d8d31ac6f 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -17,7 +17,6 @@ const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
   modifier: 'primary',
   checked: false,
   disabled: false,
-  type: 'button',
   loading: false,
   orientation: 'horizontal',
 });
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index c92072dc2..e094541ed 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -8,6 +8,7 @@ import type {
   Modifier,
   Background,
   Orientation,
+  ButtonType,
 } from './other';
 
 /**
@@ -177,7 +178,6 @@ export interface CdrSurfaceSelectionProps
   extends Omit<CdrSurfaceProps, 'withBorder' | 'borderWidth' | 'borderColor' | 'borderStyle'> {
   disabled?: boolean;
   checked?: boolean;
-  type?: 'button' | 'reset' | 'submit' | undefined;
   loading?: boolean;
   orientation?: Orientation;
   role?: string;
diff --git a/src/types/other.ts b/src/types/other.ts
index e6d11a76c..d14ab7d46 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -39,4 +39,5 @@ export type BorderColor =
 export type BorderStyle = 'solid' | 'dotted' | 'dashed';
 export type Modifier = 'primary' | 'secondary';
 export type Orientation = 'vertical' | 'horizontal';
-export type StatusType = 'info' | 'warning' | 'success' | 'error' | 'default';
\ No newline at end of file
+export type StatusType = 'info' | 'warning' | 'success' | 'error' | 'default';
+export type ButtonType = 'button' | 'reset' | 'submit' | undefined;
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index d702ba0d7..84ac28fb8 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -56,8 +56,11 @@ export const getSurfaceSelectionProps = (props: CdrSurfaceSelectionProps, baseCl
   const { checked, loading, disabled, ...otherProps } = props;
   const additionalProps: HtmlAttributes = { ...otherProps };
 
+  // Add button type
+  additionalProps.type = 'button';
+
   // Add checked
-  additionalProps['aria-checked'] = checked;
+  additionalProps['aria-checked'] = Boolean(checked);
 
   // Add disabled
   if (disabled) {

From 98790749ee00ef071bc28660ed168331e8ba1ea9 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 19 Aug 2024 11:39:34 -0700
Subject: [PATCH 28/70] progress

---
 src/types/interfaces.ts | 1 -
 src/types/other.ts      | 1 -
 2 files changed, 2 deletions(-)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index e094541ed..89b07fc7d 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -8,7 +8,6 @@ import type {
   Modifier,
   Background,
   Orientation,
-  ButtonType,
 } from './other';
 
 /**
diff --git a/src/types/other.ts b/src/types/other.ts
index d14ab7d46..df0bb7485 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -40,4 +40,3 @@ export type BorderStyle = 'solid' | 'dotted' | 'dashed';
 export type Modifier = 'primary' | 'secondary';
 export type Orientation = 'vertical' | 'horizontal';
 export type StatusType = 'info' | 'warning' | 'success' | 'error' | 'default';
-export type ButtonType = 'button' | 'reset' | 'submit' | undefined;

From 384b32c907bbb9f61603d4f35b712eda764e522a Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 19 Aug 2024 15:57:08 -0700
Subject: [PATCH 29/70] progress

---
 src/components/surface/examples/Surface.vue |  1 -
 src/dev/SinkWrapper.vue                     |  4 +-
 src/types/interfaces.ts                     | 50 +++++++++++++++++++++
 src/types/other.ts                          |  2 +-
 src/utils/surface.ts                        |  6 +--
 5 files changed, 55 insertions(+), 8 deletions(-)

diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index 5fe72f202..d340e5b21 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -29,7 +29,6 @@ const boxes: Example[] = [
     props: {
       radius: 'round',
       withBorder: true,
-      borderColor: 'primary',
       background: 'secondary',
       class: 'example__pill',
     },
diff --git a/src/dev/SinkWrapper.vue b/src/dev/SinkWrapper.vue
index 62081cd9d..05dd60fc1 100644
--- a/src/dev/SinkWrapper.vue
+++ b/src/dev/SinkWrapper.vue
@@ -12,7 +12,7 @@
         {{ capitalize(pal) }}
       </cdr-radio>
     </div>
-    <cdr-surface
+    <div
       background="primary"
       :with-border="true"
       border-width="sixteenth-x"
@@ -20,7 +20,7 @@
       class="sink-wrapper__container"
     >
       <slot />
-    </cdr-surface>
+  </div>
   </div>
 </template>
 
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 89b07fc7d..e274e4f7c 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -162,22 +162,72 @@ export interface InlineCss {
  * @extends HtmlAttributes
  */
 export interface CdrSurfaceProps extends HtmlAttributes {
+  /**
+   * Determines which set of styles to apply to the component.
+   * @values primary, secondary
+   */
   modifier?: Modifier;
+  /**
+   * Adds in a background color based on the current palette's tokens.
+   * @values transparent, primary, secondary
+   */
   background?: Background;
+  /**
+   * Determines which HTML tag to use.
+   */
   tag?: Tag;
+  /**
+   * Adds a shadow based on the token options within Cedar.
+   * @values flat, raised, elevated, floating, lifted
+   */
   shadow?: Shadow;
+  /**
+   * Adds in a border radius based on the token options within Cedar.
+   * @values transparent, primary, secondary
+   */
   radius?: Radius;
+  /**
+   * Adds in a border. Comes with a default color, width, and style.
+   */
   withBorder?: boolean;
+  /**
+   * Specifies a border width based on the token options within Cedar.
+   * @values flat, raised, elevated, floating, lifted
+   */
   borderWidth?: Space;
+  /**
+   * Specifies a border color based on the token options within Cedar.
+   * @values transparent, primary, secondary, success, warning, error
+   */
   borderColor?: BorderColor;
+  /**
+   * Specifies a border style based on the token options within Cedar.
+   * @values dotted, dashed, solid
+   */
   borderStyle?: BorderStyle;
 }
 
 export interface CdrSurfaceSelectionProps
   extends Omit<CdrSurfaceProps, 'withBorder' | 'borderWidth' | 'borderColor' | 'borderStyle'> {
+  /**
+   * Determines if the button is in a disabled state.
+   */
   disabled?: boolean;
+  /**
+   * Determines if the button is in a checked state. Adds an `aria-checked` attribute to the button.
+   */
   checked?: boolean;
+  /**
+   * Determines if the button is in a loading state. Adds a `data-loading` attribute to the button. Using CSS, this will hide the default slot and show the loading slot.
+   */
   loading?: boolean;
+  /**
+   * Determines if the layout is in horizontal or vertical mode.
+   * @values horizontal, vertical
+   */
   orientation?: Orientation;
+  /**
+   * Determines the role of the button. Typically, this will either be `radio` or `checkbox`.
+   */
   role?: string;
 }
diff --git a/src/types/other.ts b/src/types/other.ts
index df0bb7485..ebfd36011 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -26,7 +26,7 @@ export type SpaceFluid =
 export type SpaceScale = 'scale-0--1' | 'scale-3--4' | 'scale-3--5';
 export type Space = SpaceFixed | SpaceFluid | SpaceScale;
 export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
-export type Background = 'transparent' | 'primary' | 'secondary' | 'brand-spruce';
+export type Background = 'transparent' | 'primary' | 'secondary';
 export type Radius = 'sharp' | 'soft' | 'softer' | 'softest' | 'round';
 export type BorderColor =
   | 'transparent'
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index 84ac28fb8..15c5e527f 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -22,10 +22,8 @@ export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
 
   // Add border
   if (props.withBorder) {
-    if (props.borderColor) {
-      const borderColorClass = `${baseClass}--border-color-${props.borderColor}`;
-      classes.push(borderColorClass);
-    }
+    const borderColorClass = `${baseClass}--border-color-${props.borderColor || 'primary'}`;
+    classes.push(borderColorClass);
 
     const borderWidthClass = `${baseClass}--border-width-${props.borderWidth || 'sixteenth-x'}`;
     classes.push(borderWidthClass);

From ef9bd151f91acd992c4801e11e9093af1cb8d14e Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 20 Aug 2024 13:48:48 -0700
Subject: [PATCH 30/70] progress

---
 src/dev/SinkWrapper.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/dev/SinkWrapper.vue b/src/dev/SinkWrapper.vue
index 05dd60fc1..73b958221 100644
--- a/src/dev/SinkWrapper.vue
+++ b/src/dev/SinkWrapper.vue
@@ -2,7 +2,7 @@
   <div :data-palette="palette">
     <div class="sink-wrapper__radios">
       <div>Toggle palette:</div>
-      <cdr-radio
+      <CdrRadio
         v-for="pal in palettes"
         :custom-value="pal"
         :key="pal"
@@ -10,9 +10,9 @@
         v-model="palette"
       >
         {{ capitalize(pal) }}
-      </cdr-radio>
+      </CdrRadio>
     </div>
-    <div
+    <CdrSurface
       background="primary"
       :with-border="true"
       border-width="sixteenth-x"
@@ -20,7 +20,7 @@
       class="sink-wrapper__container"
     >
       <slot />
-  </div>
+  </CdrSurface>
   </div>
 </template>
 

From b747723b9dc66ebd61986e53d542fd69a215f8c6 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 20 Aug 2024 13:49:01 -0700
Subject: [PATCH 31/70] progress

---
 src/dev/SinkWrapper.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/dev/SinkWrapper.vue b/src/dev/SinkWrapper.vue
index 73b958221..7e7d84a84 100644
--- a/src/dev/SinkWrapper.vue
+++ b/src/dev/SinkWrapper.vue
@@ -20,7 +20,7 @@
       class="sink-wrapper__container"
     >
       <slot />
-  </CdrSurface>
+    </CdrSurface>
   </div>
 </template>
 

From 2749010001efb4b73967a38467a36a8dca098b09 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 20 Aug 2024 15:45:57 -0700
Subject: [PATCH 32/70] progress

---
 .../surfaceSelection/CdrSurfaceSelection.vue  |  1 +
 .../CdrSurfaceSelection.spec.js.snap          |  3 +
 .../examples/SurfaceSelection.vue             | 57 +++++++++++++------
 src/types/interfaces.ts                       | 27 ++++++++-
 src/types/other.ts                            |  3 +-
 5 files changed, 70 insertions(+), 21 deletions(-)

diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index d8d31ac6f..d55aaf07a 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -41,6 +41,7 @@ const rootProps = computed(() => {
         :orientation="orientation"
         :class="style['cdr-surface-selection__layout']"
       >
+        <!-- @slot Where all context should be placed. -->
         <slot />
       </CdrSelectionLayout>
       <div :class="style['cdr-surface-selection__loading']">
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
index e5c5bc4ac..5e1815d49 100644
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -58,6 +58,7 @@ exports[`CdrSurfaceSelection > is checked 1`] = `
       class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       
+      <!-- @slot Where all context should be placed. -->
       
       Default slot
       
@@ -103,6 +104,7 @@ exports[`CdrSurfaceSelection > is loading 1`] = `
       class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       
+      <!-- @slot Where all context should be placed. -->
       
       Default slot
       
@@ -147,6 +149,7 @@ exports[`CdrSurfaceSelection > shows default 1`] = `
       class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       
+      <!-- @slot Where all context should be placed. -->
       
       Default slot
       
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index e63df9a6b..05267ee72 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -1,13 +1,44 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
+import type { CdrSurfaceSelectionProps } from '../../../types/interfaces';
+import type { Modifier } from '../../../types/other';
 import CdrSwitch from '../../switch/CdrSwitch.vue';
 import CdrSelect from '../../select/CdrSelect.vue';
 
 defineOptions({ name: 'SurfaceSelection' });
 
 const loading = ref(false);
-const modifier = ref('primary');
+const modifier = ref<Modifier>('primary');
+
+const examples: CdrSurfaceSelectionProps[] = [
+  { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
+  { checked: true, modifier: modifier.value, role: 'checkbox', loading: loading.value },
+  { checked: false, modifier: modifier.value, role: 'checkbox', loading: !loading },
+  {
+    checked: false,
+    modifier: modifier.value,
+    role: 'checkbox',
+    loading: loading.value,
+    disabled: true,
+  },
+  { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
+  { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
+  {
+    checked: false,
+    modifier: modifier.value,
+    loading: loading.value,
+    role: 'checkbox',
+    class: 'example__wide',
+  },
+  {
+    checked: false,
+    modifier: modifier.value,
+    loading: loading.value,
+    role: 'checkbox',
+    orientation: 'vertical',
+  },
+];
 </script>
 
 <template>
@@ -32,34 +63,26 @@ const modifier = ref('primary');
     </div>
     <hr class="example__hr" />
     <div class="example__demos">
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading }">
-        This is default
-      </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: true, modifier, role: 'checkbox', loading }">
-        This is checked
-      </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading: !loading }">
-        This is loading
-      </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading, disabled: true }">
-        This is disabled
-      </CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[0]">This is default</CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[1]">This is checked</CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[2]">This is loading</CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[3]">This is disabled</CdrSurfaceSelection>
     </div>
     <hr class="example__hr" />
     <div class="example__demos2">
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading }">
+      <CdrSurfaceSelection v-bind="examples[4]">
         Custom loading
         <template #loading>...</template>
       </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, role: 'checkbox', loading }">
+      <CdrSurfaceSelection v-bind="examples[5]">
         <div>Auto</div>
         <div>Auto</div>
       </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, role: 'checkbox', class: 'example__wide' }">
+      <CdrSurfaceSelection v-bind="examples[6]">
         <div>Auto</div>
         <div class="example__100">100%</div>
       </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="{ checked: false, modifier, loading, role: 'checkbox', orientation: 'vertical' }">
+      <CdrSurfaceSelection v-bind="examples[7]">
         <div>orientation</div>
         <div>vertical</div>
       </CdrSurfaceSelection>
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index e274e4f7c..db1f2e27b 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -207,8 +207,31 @@ export interface CdrSurfaceProps extends HtmlAttributes {
   borderStyle?: BorderStyle;
 }
 
-export interface CdrSurfaceSelectionProps
-  extends Omit<CdrSurfaceProps, 'withBorder' | 'borderWidth' | 'borderColor' | 'borderStyle'> {
+export interface CdrSurfaceSelectionProps extends HtmlAttributes {
+  /**
+   * Determines which set of styles to apply to the component.
+   * @values primary, secondary
+   */
+  modifier?: Modifier;
+  /**
+   * Adds in a background color based on the current palette's tokens.
+   * @values transparent, primary, secondary
+   */
+  background?: Background;
+  /**
+   * Determines which HTML tag to use.
+   */
+  tag?: Tag;
+  /**
+   * Adds a shadow based on the token options within Cedar.
+   * @values flat, raised, elevated, floating, lifted
+   */
+  shadow?: Shadow;
+  /**
+   * Adds in a border radius based on the token options within Cedar.
+   * @values transparent, primary, secondary
+   */
+  radius?: Radius;
   /**
    * Determines if the button is in a disabled state.
    */
diff --git a/src/types/other.ts b/src/types/other.ts
index ebfd36011..b84302315 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -34,8 +34,7 @@ export type BorderColor =
   | 'secondary'
   | 'success'
   | 'warning'
-  | 'error'
-  | 'message-default-01';
+  | 'error';
 export type BorderStyle = 'solid' | 'dotted' | 'dashed';
 export type Modifier = 'primary' | 'secondary';
 export type Orientation = 'vertical' | 'horizontal';

From f7bc529fa12a8f81eb109e1adc6697607f8b0924 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 20 Aug 2024 16:05:51 -0700
Subject: [PATCH 33/70] progress

---
 .../surfaceSelection/CdrSurfaceSelection.vue          |  5 ++++-
 .../__snapshots__/CdrSurfaceSelection.spec.js.snap    | 11 ++++++++---
 src/types/interfaces.ts                               |  6 +-----
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index d55aaf07a..1cc4fa254 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -12,6 +12,8 @@ import CdrSelectionLayout from './CdrSurfaceSelectionLayout.vue';
 defineOptions({ name: 'CdrSurfaceSelection' });
 
 const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
+  background: undefined,
+  shadow: undefined,
   tag: 'button',
   role: 'radio',
   modifier: 'primary',
@@ -41,10 +43,11 @@ const rootProps = computed(() => {
         :orientation="orientation"
         :class="style['cdr-surface-selection__layout']"
       >
-        <!-- @slot Where all context should be placed. -->
+        <!-- @slot Where all default content should be placed. -->
         <slot />
       </CdrSelectionLayout>
       <div :class="style['cdr-surface-selection__loading']">
+        <!-- @slot This slot allows for custom loading content. -->
         <slot name="loading">
           <CdrSkeleton>
             <CdrSkeletonBone type="line" />
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
index 5e1815d49..6ebe21eb5 100644
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -22,6 +22,7 @@ exports[`CdrSurfaceSelection > component unit tests > default component with no
     <div
       class="cdr-surface-selection__loading"
     >
+      <!-- @slot This slot allows for custom loading content. -->
       
       <div
         aria-busy="true"
@@ -58,7 +59,7 @@ exports[`CdrSurfaceSelection > is checked 1`] = `
       class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       
-      <!-- @slot Where all context should be placed. -->
+      <!-- @slot Where all default content should be placed. -->
       
       Default slot
       
@@ -67,6 +68,7 @@ exports[`CdrSurfaceSelection > is checked 1`] = `
     <div
       class="cdr-surface-selection__loading"
     >
+      <!-- @slot This slot allows for custom loading content. -->
       
       <div
         aria-busy="true"
@@ -104,7 +106,7 @@ exports[`CdrSurfaceSelection > is loading 1`] = `
       class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       
-      <!-- @slot Where all context should be placed. -->
+      <!-- @slot Where all default content should be placed. -->
       
       Default slot
       
@@ -113,6 +115,7 @@ exports[`CdrSurfaceSelection > is loading 1`] = `
     <div
       class="cdr-surface-selection__loading"
     >
+      <!-- @slot This slot allows for custom loading content. -->
       
       <div
         aria-busy="true"
@@ -149,7 +152,7 @@ exports[`CdrSurfaceSelection > shows default 1`] = `
       class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       
-      <!-- @slot Where all context should be placed. -->
+      <!-- @slot Where all default content should be placed. -->
       
       Default slot
       
@@ -158,6 +161,7 @@ exports[`CdrSurfaceSelection > shows default 1`] = `
     <div
       class="cdr-surface-selection__loading"
     >
+      <!-- @slot This slot allows for custom loading content. -->
       
       <div
         aria-busy="true"
@@ -199,6 +203,7 @@ exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
     <div
       class="cdr-surface-selection__loading"
     >
+      <!-- @slot This slot allows for custom loading content. -->
       
       <div
         aria-busy="true"
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index db1f2e27b..ce99d578f 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -227,11 +227,6 @@ export interface CdrSurfaceSelectionProps extends HtmlAttributes {
    * @values flat, raised, elevated, floating, lifted
    */
   shadow?: Shadow;
-  /**
-   * Adds in a border radius based on the token options within Cedar.
-   * @values transparent, primary, secondary
-   */
-  radius?: Radius;
   /**
    * Determines if the button is in a disabled state.
    */
@@ -246,6 +241,7 @@ export interface CdrSurfaceSelectionProps extends HtmlAttributes {
   loading?: boolean;
   /**
    * Determines if the layout is in horizontal or vertical mode.
+   * @demoSelectMultiple true
    * @values horizontal, vertical
    */
   orientation?: Orientation;

From 9d22ce5349b94271c4ae8754ae5ee9dbe7826c29 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 22 Aug 2024 15:31:41 -0700
Subject: [PATCH 34/70] progress

---
 .../fulfillmentTile/CdrFulfillmentTile.vue    |   4 +-
 .../CdrFulfillmentTile.spec.js.snap           | 623 ------------------
 .../CdrFulfillmentTileContent.spec.js.snap    |  27 -
 .../CdrFulfillmentTileHeader.spec.js.snap     |  79 ---
 src/components/surface/CdrSurface.vue         |   4 +-
 .../__snapshots__/CdrSurface.spec.js.snap     |  28 -
 src/components/surface/examples/Surface.vue   |   4 +-
 .../surfaceSelection/CdrSurfaceSelection.vue  |  10 +-
 .../CdrSurfaceSelectionLayout.vue             |   8 +-
 .../CdrSurfaceSelection.spec.js.snap          | 224 -------
 .../CdrSurfaceSelectionLayout.spec.js.snap    |  28 -
 .../examples/SurfaceSelection.vue             |  63 +-
 src/types/interfaces.ts                       |  86 +--
 13 files changed, 91 insertions(+), 1097 deletions(-)
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
 delete mode 100644 src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
 delete mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
 delete mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index c7db2c4fc..14a65e43a 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import { CdrSurfaceSelectionProps } from '../../types/interfaces';
+import { surfaceSelection } from '../../types/interfaces';
 import { getSurfaceSelectionProps } from '../../utils/surface';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
 import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
@@ -13,7 +13,7 @@ import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 
 defineOptions({ name: 'CdrFulfillmentTile' });
 
-const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
+const props = withDefaults(defineProps<surfaceSelection>(), {
   tag: 'button',
   role: 'radio',
   modifier: 'primary',
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
deleted file mode 100644
index dbc6485d5..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
+++ /dev/null
@@ -1,623 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTile > component unit tests > default component with no configuration > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > is loading 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  data-loading="true"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <!--v-if-->
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > shows body 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <div
-          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Body slot
-          
-          
-          
-        </div>
-        <!--v-if-->
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > shows footer 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <!--v-if-->
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > shows header 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <span
-        class="cdr-fulfillment-tile-header__icon"
-      >
-        
-        
-        X
-        
-        
-      </span>
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <div
-          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Body slot
-          
-          
-          
-        </div>
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <span
-        class="cdr-fulfillment-tile-header__icon"
-      >
-        
-        
-        X
-        
-        
-      </span>
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <div
-          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Body slot
-          
-          
-          
-        </div>
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
deleted file mode 100644
index 9b37dd1f2..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
+++ /dev/null
@@ -1,27 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTileContent > is stretch 1`] = `
-<div
-  class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
->
-  
-  
-  Default slot
-  
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileContent > shows content 1`] = `
-<div
-  class="cdr-body cdr-fulfillment-tile-content"
-  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
->
-  
-  
-  Default slot
-  
-  
-</div>
-`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
deleted file mode 100644
index 50fe0c0ad..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
+++ /dev/null
@@ -1,79 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
->
-  
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    
-    X
-    
-  </span>
-  <span
-    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-    strong="true"
-    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-  >
-    
-    
-    Label slot
-    
-    
-  </span>
-  <!--v-if-->
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
->
-  
-  <!--v-if-->
-  <span
-    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-    strong="true"
-    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-  >
-    
-    
-    Label slot
-    
-    
-  </span>
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    
-    X
-    
-  </span>
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileHeader > shows label 1`] = `
-<div
-  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
->
-  
-  <!--v-if-->
-  <span
-    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-    strong="true"
-    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-  >
-    
-    
-    Label slot
-    
-    
-  </span>
-  <!--v-if-->
-  
-</div>
-`;
diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index cf0b6b5ed..30ab03092 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -1,14 +1,14 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import type { CdrSurfaceProps } from '../../types/interfaces';
+import type { surface } from '../../types/interfaces';
 import { getSurfaceProps } from '../../utils/surface';
 
 /** Base component for all other components */
 
 defineOptions({ name: 'CdrSurface' });
 
-const props = withDefaults(defineProps<CdrSurfaceProps>(), {
+const props = withDefaults(defineProps<surface>(), {
   tag: 'div',
 });
 
diff --git a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
deleted file mode 100644
index 9991b2440..000000000
--- a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
+++ /dev/null
@@ -1,28 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
-<div
-  class="cdr-surface"
->
-  
-  
-</div>
-`;
-
-exports[`CdrSurface > component unit tests > when "tag" is set to "a" > renders correctly 1`] = `
-<a
-  class="cdr-surface"
->
-  
-  
-</a>
-`;
-
-exports[`CdrSurface > snapshot test > renders correctly 1`] = `
-<div
-  class="cdr-surface"
->
-  
-  
-</div>
-`;
diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index d340e5b21..008968b32 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import CdrSurface from '../CdrSurface.vue';
 import CdrText from '../../text/CdrText.vue';
-import type { CdrSurfaceProps } from '../../../types/interfaces';
+import type { surface } from '../../../types/interfaces';
 
 defineOptions({ name: 'Surface' });
 
 export interface Example {
   label: string;
-  props: CdrSurfaceProps;
+  props: surface;
 }
 
 const boxes: Example[] = [
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 1cc4fa254..3c8b3494a 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -3,15 +3,15 @@ import { useCssModule, computed } from 'vue';
 import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
 import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 import mapClasses from '../../utils/mapClasses';
-import { CdrSurfaceSelectionProps } from '../../types/interfaces';
+import { surfaceSelection } from '../../types/interfaces';
 import { getSurfaceSelectionProps } from '../../utils/surface';
-import CdrSelectionLayout from './CdrSurfaceSelectionLayout.vue';
+import CdrSurfaceSelectionLayout from './CdrSurfaceSelectionLayout.vue';
 
 /** Component for buttons that have a checked state */
 
 defineOptions({ name: 'CdrSurfaceSelection' });
 
-const props = withDefaults(defineProps<CdrSurfaceSelectionProps>(), {
+const props = withDefaults(defineProps<surfaceSelection>(), {
   background: undefined,
   shadow: undefined,
   tag: 'button',
@@ -39,13 +39,13 @@ const rootProps = computed(() => {
     v-bind="rootProps"
   >
     <div :class="style['cdr-surface-selection__inner']">
-      <CdrSelectionLayout
+      <CdrSurfaceSelectionLayout
         :orientation="orientation"
         :class="style['cdr-surface-selection__layout']"
       >
         <!-- @slot Where all default content should be placed. -->
         <slot />
-      </CdrSelectionLayout>
+      </CdrSurfaceSelectionLayout>
       <div :class="style['cdr-surface-selection__loading']">
         <!-- @slot This slot allows for custom loading content. -->
         <slot name="loading">
diff --git a/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
index a370aa56c..5fc64af76 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
@@ -1,17 +1,13 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import { Orientation } from '../../types/other';
+import { surfaceSelectionLayout } from '../../types/interfaces';
 
 /** Component for layout of a surface selection */
 
 defineOptions({ name: 'CdrSurfaceSelectionLayout' });
 
-interface CdrSurfaceSelectionLayoutProps {
-  orientation?: Orientation;
-}
-
-const props = withDefaults(defineProps<CdrSurfaceSelectionLayoutProps>(), {
+const props = withDefaults(defineProps<surfaceSelectionLayout>(), {
   orientation: 'horizontal',
 });
 
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
deleted file mode 100644
index 6ebe21eb5..000000000
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ /dev/null
@@ -1,224 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrSurfaceSelection > is checked 1`] = `
-<button
-  aria-checked="true"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      <!-- @slot Where all default content should be placed. -->
-      
-      Default slot
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrSurfaceSelection > is loading 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  data-loading="true"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      <!-- @slot Where all default content should be placed. -->
-      
-      Default slot
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrSurfaceSelection > shows default 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      <!-- @slot Where all default content should be placed. -->
-      
-      Default slot
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
deleted file mode 100644
index 35105992d..000000000
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
+++ /dev/null
@@ -1,28 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrSurfaceSelectionLayout > orientation test > shows horizontal 1`] = `
-<div
-  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
->
-  
-  
-</div>
-`;
-
-exports[`CdrSurfaceSelectionLayout > orientation test > shows vertical 1`] = `
-<div
-  class="cdr-surface-selection-layout cdr-surface-selection-layout--vertical"
->
-  
-  
-</div>
-`;
-
-exports[`CdrSurfaceSelectionLayout > snapshot test > renders correctly 1`] = `
-<div
-  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
->
-  
-  
-</div>
-`;
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index 05267ee72..d8abcb73d 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { ref } from 'vue';
+import { ref, computed } from 'vue';
 import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
-import type { CdrSurfaceSelectionProps } from '../../../types/interfaces';
+import type { surfaceSelection } from '../../../types/interfaces';
 import type { Modifier } from '../../../types/other';
 import CdrSwitch from '../../switch/CdrSwitch.vue';
 import CdrSelect from '../../select/CdrSelect.vue';
@@ -11,34 +11,37 @@ defineOptions({ name: 'SurfaceSelection' });
 const loading = ref(false);
 const modifier = ref<Modifier>('primary');
 
-const examples: CdrSurfaceSelectionProps[] = [
-  { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
-  { checked: true, modifier: modifier.value, role: 'checkbox', loading: loading.value },
-  { checked: false, modifier: modifier.value, role: 'checkbox', loading: !loading },
-  {
-    checked: false,
-    modifier: modifier.value,
-    role: 'checkbox',
-    loading: loading.value,
-    disabled: true,
-  },
-  { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
-  { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
-  {
-    checked: false,
-    modifier: modifier.value,
-    loading: loading.value,
-    role: 'checkbox',
-    class: 'example__wide',
-  },
-  {
-    checked: false,
-    modifier: modifier.value,
-    loading: loading.value,
-    role: 'checkbox',
-    orientation: 'vertical',
-  },
-];
+const examples = computed(
+  () =>
+    <surfaceSelection[]>[
+      { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
+      { checked: true, modifier: modifier.value, role: 'checkbox', loading: loading.value },
+      { checked: false, modifier: modifier.value, role: 'checkbox', loading: !loading.value },
+      {
+        checked: false,
+        modifier: modifier.value,
+        role: 'checkbox',
+        loading: loading.value,
+        disabled: true,
+      },
+      { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
+      { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
+      {
+        checked: false,
+        modifier: modifier.value,
+        loading: loading.value,
+        role: 'checkbox',
+        class: 'example__wide',
+      },
+      {
+        checked: false,
+        modifier: modifier.value,
+        loading: loading.value,
+        role: 'checkbox',
+        orientation: 'vertical',
+      },
+    ],
+);
 </script>
 
 <template>
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index ce99d578f..f37deed8a 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -157,44 +157,16 @@ export interface InlineCss {
 }
 
 /**
- * SurfaceProps contains the props used to create a surface
- * @interface CdrSurfaceProps
+ * surface contains the props used to create a surface
+ * @interface surface
  * @extends HtmlAttributes
  */
-export interface CdrSurfaceProps extends HtmlAttributes {
-  /**
-   * Determines which set of styles to apply to the component.
-   * @values primary, secondary
-   */
-  modifier?: Modifier;
+export interface surface extends HtmlAttributes {
   /**
    * Adds in a background color based on the current palette's tokens.
    * @values transparent, primary, secondary
    */
   background?: Background;
-  /**
-   * Determines which HTML tag to use.
-   */
-  tag?: Tag;
-  /**
-   * Adds a shadow based on the token options within Cedar.
-   * @values flat, raised, elevated, floating, lifted
-   */
-  shadow?: Shadow;
-  /**
-   * Adds in a border radius based on the token options within Cedar.
-   * @values transparent, primary, secondary
-   */
-  radius?: Radius;
-  /**
-   * Adds in a border. Comes with a default color, width, and style.
-   */
-  withBorder?: boolean;
-  /**
-   * Specifies a border width based on the token options within Cedar.
-   * @values flat, raised, elevated, floating, lifted
-   */
-  borderWidth?: Space;
   /**
    * Specifies a border color based on the token options within Cedar.
    * @values transparent, primary, secondary, success, warning, error
@@ -205,40 +177,59 @@ export interface CdrSurfaceProps extends HtmlAttributes {
    * @values dotted, dashed, solid
    */
   borderStyle?: BorderStyle;
-}
-
-export interface CdrSurfaceSelectionProps extends HtmlAttributes {
+  /**
+   * Specifies a border width based on the token options within Cedar.
+   * @values flat, raised, elevated, floating, lifted
+   */
+  borderWidth?: Space;
   /**
    * Determines which set of styles to apply to the component.
    * @values primary, secondary
    */
   modifier?: Modifier;
   /**
-   * Adds in a background color based on the current palette's tokens.
+   * Adds in a border radius based on the token options within Cedar.
    * @values transparent, primary, secondary
    */
-  background?: Background;
+  radius?: Radius;
+  /**
+   * Adds a shadow based on the token options within Cedar.
+   * @values flat, raised, elevated, floating, lifted
+   */
+  shadow?: Shadow;
   /**
    * Determines which HTML tag to use.
    */
   tag?: Tag;
   /**
-   * Adds a shadow based on the token options within Cedar.
-   * @values flat, raised, elevated, floating, lifted
+   * Adds in a border. Comes with a default color, width, and style.
    */
-  shadow?: Shadow;
+  withBorder?: boolean;
+}
+
+export interface surfaceSelection extends HtmlAttributes {
   /**
-   * Determines if the button is in a disabled state.
+   * Adds in a background color based on the current palette's tokens.
+   * @values transparent, primary, secondary
    */
-  disabled?: boolean;
+  background?: Background;
   /**
    * Determines if the button is in a checked state. Adds an `aria-checked` attribute to the button.
    */
   checked?: boolean;
+  /**
+   * Determines if the button is in a disabled state.
+   */
+  disabled?: boolean;
   /**
    * Determines if the button is in a loading state. Adds a `data-loading` attribute to the button. Using CSS, this will hide the default slot and show the loading slot.
    */
   loading?: boolean;
+  /**
+   * Determines which set of styles to apply to the component.
+   * @values primary, secondary
+   */
+  modifier?: Modifier;
   /**
    * Determines if the layout is in horizontal or vertical mode.
    * @demoSelectMultiple true
@@ -249,4 +240,17 @@ export interface CdrSurfaceSelectionProps extends HtmlAttributes {
    * Determines the role of the button. Typically, this will either be `radio` or `checkbox`.
    */
   role?: string;
+  /**
+   * Adds a shadow based on the token options within Cedar.
+   * @values flat, raised, elevated, floating, lifted
+   */
+  shadow?: Shadow;
+  /**
+   * Determines which HTML tag to use.
+   */
+  tag?: Tag;
 }
+
+export interface surfaceSelectionLayout {
+  orientation?: Orientation;
+}
\ No newline at end of file

From 007178dc05a0c4aa43dc2148fe4e201e5ad17bef Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 22 Aug 2024 15:35:59 -0700
Subject: [PATCH 35/70] progress

---
 .../CdrFulfillmentTile.spec.js.snap           | 623 ++++++++++++++++++
 .../CdrFulfillmentTileContent.spec.js.snap    |  27 +
 .../CdrFulfillmentTileHeader.spec.js.snap     |  79 +++
 .../__snapshots__/CdrSurface.spec.js.snap     |  28 +
 .../CdrSurfaceSelection.spec.js.snap          | 224 +++++++
 .../CdrSurfaceSelectionLayout.spec.js.snap    |  28 +
 6 files changed, 1009 insertions(+)
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
 create mode 100644 src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
 create mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
 create mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap

diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
new file mode 100644
index 000000000..dbc6485d5
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -0,0 +1,623 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTile > component unit tests > default component with no configuration > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > is loading 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  data-loading="true"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <!--v-if-->
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows body 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Body slot
+          
+          
+          
+        </div>
+        <!--v-if-->
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows footer 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <!--v-if-->
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows header 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <span
+        class="cdr-fulfillment-tile-header__icon"
+      >
+        
+        
+        X
+        
+        
+      </span>
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Body slot
+          
+          
+          
+        </div>
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      
+      <span
+        class="cdr-fulfillment-tile-header__icon"
+      >
+        
+        
+        X
+        
+        
+      </span>
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Body slot
+          
+          
+          
+        </div>
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
new file mode 100644
index 000000000..9b37dd1f2
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
@@ -0,0 +1,27 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileContent > is stretch 1`] = `
+<div
+  class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+>
+  
+  
+  Default slot
+  
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileContent > shows content 1`] = `
+<div
+  class="cdr-body cdr-fulfillment-tile-content"
+  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+>
+  
+  
+  Default slot
+  
+  
+</div>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
new file mode 100644
index 000000000..50fe0c0ad
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
@@ -0,0 +1,79 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+>
+  
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    
+    X
+    
+  </span>
+  <span
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+  >
+    
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+>
+  
+  <!--v-if-->
+  <span
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+  >
+    
+    
+    Label slot
+    
+    
+  </span>
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    
+    X
+    
+  </span>
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > shows label 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+>
+  
+  <!--v-if-->
+  <span
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+  >
+    
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+  
+</div>
+`;
diff --git a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
new file mode 100644
index 000000000..9991b2440
--- /dev/null
+++ b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
@@ -0,0 +1,28 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
+<div
+  class="cdr-surface"
+>
+  
+  
+</div>
+`;
+
+exports[`CdrSurface > component unit tests > when "tag" is set to "a" > renders correctly 1`] = `
+<a
+  class="cdr-surface"
+>
+  
+  
+</a>
+`;
+
+exports[`CdrSurface > snapshot test > renders correctly 1`] = `
+<div
+  class="cdr-surface"
+>
+  
+  
+</div>
+`;
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
new file mode 100644
index 000000000..6ebe21eb5
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -0,0 +1,224 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > is checked 1`] = `
+<button
+  aria-checked="true"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      <!-- @slot Where all default content should be placed. -->
+      
+      Default slot
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > is loading 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  data-loading="true"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      <!-- @slot Where all default content should be placed. -->
+      
+      Default slot
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > shows default 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      <!-- @slot Where all default content should be placed. -->
+      
+      Default slot
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
new file mode 100644
index 000000000..35105992d
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
@@ -0,0 +1,28 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurfaceSelectionLayout > orientation test > shows horizontal 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+>
+  
+  
+</div>
+`;
+
+exports[`CdrSurfaceSelectionLayout > orientation test > shows vertical 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--vertical"
+>
+  
+  
+</div>
+`;
+
+exports[`CdrSurfaceSelectionLayout > snapshot test > renders correctly 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+>
+  
+  
+</div>
+`;

From d13f9c344200449afc634173611085c991965e92 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 22 Aug 2024 15:37:18 -0700
Subject: [PATCH 36/70] progress

---
 src/utils/surface.ts | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index 15c5e527f..fddace178 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -1,11 +1,7 @@
-import type {
-  CdrSurfaceProps,
-  CdrSurfaceSelectionProps,
-  HtmlAttributes,
-} from '../types/interfaces';
+import type { surface, surfaceSelection, HtmlAttributes } from '../types/interfaces';
 
 // Manages the props passed along to all surfaces
-export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
+export const getSurfaceProps = (props: surface, baseClass: string) => {
   const classes = [baseClass];
 
   // Add modifier, which applies a background and border color,
@@ -49,7 +45,7 @@ export const getSurfaceProps = (props: CdrSurfaceProps, baseClass: string) => {
   return { classes };
 };
 
-export const getSurfaceSelectionProps = (props: CdrSurfaceSelectionProps, baseClass: string) => {
+export const getSurfaceSelectionProps = (props: surfaceSelection, baseClass: string) => {
   const { classes } = getSurfaceProps(props, baseClass);
   const { checked, loading, disabled, ...otherProps } = props;
   const additionalProps: HtmlAttributes = { ...otherProps };

From 0f7fb82ff244179f0a956a6bccf91efd1e81924d Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 22 Aug 2024 15:47:17 -0700
Subject: [PATCH 37/70] progress

---
 src/types/interfaces.ts | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index f37deed8a..a2706b377 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -208,11 +208,6 @@ export interface surface extends HtmlAttributes {
 }
 
 export interface surfaceSelection extends HtmlAttributes {
-  /**
-   * Adds in a background color based on the current palette's tokens.
-   * @values transparent, primary, secondary
-   */
-  background?: Background;
   /**
    * Determines if the button is in a checked state. Adds an `aria-checked` attribute to the button.
    */

From e10f7e06c0cf51eb62e813da85b5894c2cdc0878 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 22 Aug 2024 15:54:50 -0700
Subject: [PATCH 38/70] progress

---
 src/components/surfaceSelection/CdrSurfaceSelection.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 3c8b3494a..97f7275f8 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -12,7 +12,6 @@ import CdrSurfaceSelectionLayout from './CdrSurfaceSelectionLayout.vue';
 defineOptions({ name: 'CdrSurfaceSelection' });
 
 const props = withDefaults(defineProps<surfaceSelection>(), {
-  background: undefined,
   shadow: undefined,
   tag: 'button',
   role: 'radio',

From 7c88cd4235f3a0991ef351cf924425e2913b9ea5 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 26 Aug 2024 17:48:58 -0700
Subject: [PATCH 39/70] progress

---
 src/components/banner/examples/Banner.vue     |   2 +-
 .../banner/styles/CdrBanner.module.scss       |   6 +-
 .../fulfillmentTile/CdrFulfillmentTile.vue    |  12 +-
 .../CdrFulfillmentTileContent.vue             |  27 +-
 .../CdrFulfillmentTileHeader.vue              |  15 +-
 .../CdrFulfillmentTileIcon.vue                |   9 +-
 .../CdrFulfillmentTileLayout.vue              |  10 +-
 .../__tests__/CdrFulfillmentTile.spec.js      |  14 +-
 .../CdrFulfillmentTileHeader.spec.js          |   6 +-
 .../CdrFulfillmentTile.spec.js.snap           | 623 ------------------
 .../CdrFulfillmentTileContent.spec.js.snap    |  27 -
 .../CdrFulfillmentTileHeader.spec.js.snap     |  79 ---
 .../examples/FulfillmentTile.vue              |  18 +-
 src/components/surface/CdrSurface.vue         |   1 +
 .../__snapshots__/CdrSurface.spec.js.snap     |  28 -
 .../surfaceSelection/CdrSurfaceSelection.vue  |   2 +-
 .../CdrSurfaceSelectionLayout.vue             |   2 +
 .../CdrSurfaceSelection.spec.js.snap          | 224 -------
 .../CdrSurfaceSelectionLayout.spec.js.snap    |  28 -
 src/components/text/presets/CdrBody.vue       |  17 +-
 src/dev/router.js                             |   1 -
 src/types/interfaces.ts                       |  37 +-
 src/types/other.ts                            |   1 +
 23 files changed, 106 insertions(+), 1083 deletions(-)
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
 delete mode 100644 src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
 delete mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
 delete mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap

diff --git a/src/components/banner/examples/Banner.vue b/src/components/banner/examples/Banner.vue
index ea0f2f273..bef46c13e 100644
--- a/src/components/banner/examples/Banner.vue
+++ b/src/components/banner/examples/Banner.vue
@@ -54,7 +54,7 @@
 
     <cdr-banner type="success">
       <template #icon-left>
-        <icon-check-fill inherit-color />
+        <icon-check-fill />
       </template>
       This is a banner with an icon-right slot, typically used to close the banner.
       <template #icon-right>
diff --git a/src/components/banner/styles/CdrBanner.module.scss b/src/components/banner/styles/CdrBanner.module.scss
index 0977c9482..3ba94782a 100644
--- a/src/components/banner/styles/CdrBanner.module.scss
+++ b/src/components/banner/styles/CdrBanner.module.scss
@@ -5,7 +5,7 @@
   @include cdr-banner-base-mixin;
   display: grid;
   grid-template-columns: 1fr auto;
-  grid-template-areas:
+  grid-template-areas: 
   "main info-action"
   "message-body info-action"
   ;
@@ -33,7 +33,7 @@
       stroke-width: 0.4rem;
       paint-order: stroke fill;
       margin: $cdr-space-quarter-x;
-
+  
     }
   }
   &__message {
@@ -164,7 +164,7 @@
     & .cdr-banner__wrapper {
       border-left: $left-border;
       //ITEM_DOC: Wrapper border left color for error banner
-      border-left-color: var(--cdr-banner-error-wrapper-border-left-color, var(--cdr-color-border-message-error-01, #{$cdr-color-border-message-error-01}));
+      border-left-color: var(--cdr-banner-error-wrapper-border-left-color, var(--cdr-color-border-message-error-01, #{$cdr-color-border-message-error-01}));      
     }
   }
 }
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 14a65e43a..379bbe88c 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -9,7 +9,7 @@ import CdrFulfillmentTileContent from './CdrFulfillmentTileContent.vue';
 import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
 import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 
-/** Tile component for displaying a button with optional icon in the header */
+/** Tile component for displaying a button with optional icon in the header. Based on Surface selection. */
 
 defineOptions({ name: 'CdrFulfillmentTile' });
 
@@ -44,15 +44,18 @@ const rootProps = computed(() => {
           v-if="$slots['icon-left']"
           #icon-left
         >
+          <!-- @slot Place an icon to the left of the header content -->
           <slot name="icon-left" />
         </template>
-        <template #label>
-          <slot name="label" />
+        <template #header>
+          <!-- @slot Header content that is still visible during loading. -->
+          <slot name="header" />
         </template>
         <template
           v-if="$slots['icon-right']"
           #icon-right
         >
+          <!-- @slot Place an icon to the right of the header content -->
           <slot name="icon-right" />
         </template>
       </CdrFulfillmentTileHeader>
@@ -63,16 +66,19 @@ const rootProps = computed(() => {
         >
           <template v-if="$slots['body']">
             <CdrFulfillmentTileContent :stretch="true">
+              <!-- @slot Default font size is a step down. Placed just below the header. -->
               <slot name="body" />
             </CdrFulfillmentTileContent>
           </template>
           <template v-if="$slots['footer']">
             <CdrFulfillmentTileContent scale="-1">
+              <!-- @slot Footer content will be at the bottom of the component. -->
               <slot name="footer" />
             </CdrFulfillmentTileContent>
           </template>
         </CdrFulfillmentTileLayout>
         <div :class="style['cdr-fulfillment-tile__loading']">
+          <!-- @slot Custom content when component is loading. -->
           <slot name="loading">
             <CdrSkeleton>
               <CdrSkeletonBone type="line" />
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
index c83df98be..b41eace95 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
@@ -1,17 +1,13 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import CdrBody, { type bodyTextProps } from '../text/presets/CdrBody.vue';
+import { fulfillmentTileContent } from '../../types/interfaces';
 
 /** Content component for fulfillment tile */
 
 defineOptions({ name: 'CdrFulfillmentTileContent' });
 
-interface CdrFulfillmentTileContentProps {
-  stretch?: boolean;
-  scale?: bodyTextProps['scale'];
-}
-
-const props = withDefaults(defineProps<CdrFulfillmentTileContentProps>(), {
+const props = withDefaults(defineProps<fulfillmentTileContent>(), {
   stretch: false,
   scale: '-2',
 });
@@ -19,18 +15,21 @@ const props = withDefaults(defineProps<CdrFulfillmentTileContentProps>(), {
 const style = useCssModule();
 const baseClass = 'cdr-fulfillment-tile-content';
 
-const rootProps = computed((): bodyTextProps => ({
-  tag: 'div',
-  scale: props.scale,
-  class: {
-    [style[baseClass]]: true,
-    [style[`${baseClass}--stretch`]]: props.stretch,
-  },
-}));
+const rootProps = computed(
+  (): bodyTextProps => ({
+    tag: 'div',
+    scale: props.scale,
+    class: {
+      [style[baseClass]]: true,
+      [style[`${baseClass}--stretch`]]: props.stretch,
+    },
+  }),
+);
 </script>
 
 <template>
   <CdrBody v-bind="rootProps">
+    <!-- @slot Where all default content should be placed. -->
     <slot />
   </CdrBody>
 </template>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
index d034fd3e9..602fea99b 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -2,17 +2,13 @@
 import { useCssModule, computed } from 'vue';
 import CdrSubheadingSans from '../text/presets/CdrSubheadingSans.vue';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
-import type { CdrFulfillmentTileLayoutProps } from './CdrFulfillmentTileLayout.vue';
+import { fulfillmentTileHeader, surfaceSelectionLayout } from '../../types/interfaces';
 
 /** Fulfillment tile header component */
 
 defineOptions({ name: 'CdrFulfillmentTileHeader' });
 
-export interface CdrFulfillmentTileHeaderProps {
-  disabled?: boolean;
-}
-
-const props = withDefaults(defineProps<CdrFulfillmentTileHeaderProps>(), {
+const props = withDefaults(defineProps<fulfillmentTileHeader>(), {
   disabled: false,
 });
 
@@ -20,7 +16,7 @@ const style = useCssModule();
 const baseClass = 'cdr-fulfillment-tile-header';
 
 const rootProps = computed(
-  (): CdrFulfillmentTileLayoutProps => ({
+  (): surfaceSelectionLayout => ({
     orientation: 'horizontal',
     class: {
       [style[baseClass]]: true,
@@ -36,6 +32,7 @@ const rootProps = computed(
       v-if="$slots['icon-left']"
       :class="style['cdr-fulfillment-tile-header__icon']"
     >
+      <!-- @slot Place an icon to the left of the header content -->
       <slot name="icon-left" />
     </span>
     <CdrSubheadingSans
@@ -44,12 +41,14 @@ const rootProps = computed(
       tag="span"
       :class="style['cdr-fulfillment-tile-header__label']"
     >
-      <slot name="label" />
+      <!-- @slot Header content that is still visible during loading. -->
+      <slot name="header" />
     </CdrSubheadingSans>
     <span
       v-if="$slots['icon-right']"
       :class="style['cdr-fulfillment-tile-header__icon']"
     >
+      <!-- @slot Place an icon to the right of the header content -->
       <slot name="icon-right" />
     </span>
   </CdrFulfillmentTileLayout>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue b/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue
index 96b74e826..a25039bde 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue
@@ -1,16 +1,12 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
-import { StatusType } from '../../types/other';
+import { fulfillmentTileIcon } from '../../types/interfaces';
 
 /** Provides stylized icons for typical notifications */
 
 defineOptions({ name: 'CdrFulfillmentTileIcon' });
 
-export interface CdrFulfillmentTileIconProps {
-  type?: StatusType;
-}
-
-const props = withDefaults(defineProps<CdrFulfillmentTileIconProps>(), {
+const props = withDefaults(defineProps<fulfillmentTileIcon>(), {
   type: 'default',
 });
 
@@ -21,6 +17,7 @@ const typeClass = computed(() => `${baseClass}--${props.type}`);
 
 <template>
   <span :class="[style[baseClass], style[typeClass]]">
+    <!-- @slot Where all default content should be placed. -->
     <slot />
   </span>
 </template>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
index 2c75ced1c..c12be1bc4 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
@@ -1,18 +1,13 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import { Orientation } from '../../types/other';
-import { HtmlAttributes } from '../../types/interfaces';
+import { surfaceSelectionLayout } from '../../types/interfaces';
 
 /** Component for layout of a surface selection */
 
 defineOptions({ name: 'CdrFulfillmentTileLayout' });
 
-export interface CdrFulfillmentTileLayoutProps extends HtmlAttributes {
-  orientation?: Orientation;
-}
-
-const props = withDefaults(defineProps<CdrFulfillmentTileLayoutProps>(), {
+const props = withDefaults(defineProps<surfaceSelectionLayout>(), {
   orientation: 'horizontal',
 });
 
@@ -33,6 +28,7 @@ const rootProps = computed(() => {
 
 <template>
   <div v-bind="rootProps">
+    <!-- @slot Place elements in the default slot. -->
     <slot />
   </div>
 </template>
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
index 9537d6009..0d10a6fc0 100644
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
@@ -39,7 +39,7 @@ describe('CdrFulfillmentTile', () => {
       props: { checked: false },
       slots: {
         'icon-left': 'X',
-        label: 'Label slot',
+        header: 'Label slot',
         body: 'Body slot',
         footer: 'Footer slot',
       },
@@ -52,7 +52,7 @@ describe('CdrFulfillmentTile', () => {
       props: { checked: false },
       slots: {
         'icon-right': 'X',
-        label: 'Label slot',
+        header: 'Label slot',
         body: 'Body slot',
         footer: 'Footer slot',
       },
@@ -64,7 +64,7 @@ describe('CdrFulfillmentTile', () => {
     const wrapper = mount(CdrFulfillmentTile, {
       props: { checked: false },
       slots: {
-        label: 'Label slot',
+        header: 'Label slot',
       },
     });
     expect(wrapper.element).toMatchSnapshot();
@@ -75,7 +75,7 @@ describe('CdrFulfillmentTile', () => {
     const wrapper = mount(CdrFulfillmentTile, {
       props: { checked: false },
       slots: {
-        label: 'Label slot',
+        header: 'Label slot',
         body: 'Body slot',
       },
     });
@@ -87,7 +87,7 @@ describe('CdrFulfillmentTile', () => {
     const wrapper = mount(CdrFulfillmentTile, {
       props: { checked: false },
       slots: {
-        label: 'Label slot',
+        header: 'Label slot',
         footer: 'Footer slot',
       },
     });
@@ -99,7 +99,7 @@ describe('CdrFulfillmentTile', () => {
     const wrapper = mount(CdrFulfillmentTile, {
       props: { checked: false, loading: true },
       slots: {
-        label: 'Label slot',
+        header: 'Label slot',
         footer: 'Footer slot',
       },
     });
@@ -111,7 +111,7 @@ describe('CdrFulfillmentTile', () => {
     const wrapper = mount(CdrFulfillmentTile, {
       props: { checked: false, loading: false },
       slots: {
-        label: 'Label slot',
+        header: 'Label slot',
         footer: 'Footer slot',
       },
     });
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
index 376e8bb8e..4597f3e69 100644
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
@@ -6,7 +6,7 @@ describe('CdrFulfillmentTileHeader', () => {
     const wrapper = mount(CdrFulfillmentTileHeader, {
       slots: {
         'icon-left': 'X',
-        label: 'Label slot',
+        header: 'Label slot',
       },
     });
     expect(wrapper.element).toMatchSnapshot();
@@ -16,7 +16,7 @@ describe('CdrFulfillmentTileHeader', () => {
     const wrapper = mount(CdrFulfillmentTileHeader, {
       slots: {
         'icon-right': 'X',
-        label: 'Label slot',
+        header: 'Label slot',
       },
     });
     expect(wrapper.element).toMatchSnapshot();
@@ -25,7 +25,7 @@ describe('CdrFulfillmentTileHeader', () => {
   it('shows label', () => {
     const wrapper = mount(CdrFulfillmentTileHeader, {
       slots: {
-        label: 'Label slot',
+        header: 'Label slot',
       },
     });
     expect(wrapper.element).toMatchSnapshot();
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
deleted file mode 100644
index dbc6485d5..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
+++ /dev/null
@@ -1,623 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTile > component unit tests > default component with no configuration > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > is loading 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  data-loading="true"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <!--v-if-->
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > shows body 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <div
-          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Body slot
-          
-          
-          
-        </div>
-        <!--v-if-->
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > shows footer 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <!--v-if-->
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > shows header 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <span
-        class="cdr-fulfillment-tile-header__icon"
-      >
-        
-        
-        X
-        
-        
-      </span>
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <div
-          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Body slot
-          
-          
-          
-        </div>
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      
-      <span
-        class="cdr-fulfillment-tile-header__icon"
-      >
-        
-        
-        X
-        
-        
-      </span>
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        
-        <div
-          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Body slot
-          
-          
-          
-        </div>
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
deleted file mode 100644
index 9b37dd1f2..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
+++ /dev/null
@@ -1,27 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTileContent > is stretch 1`] = `
-<div
-  class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
->
-  
-  
-  Default slot
-  
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileContent > shows content 1`] = `
-<div
-  class="cdr-body cdr-fulfillment-tile-content"
-  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
->
-  
-  
-  Default slot
-  
-  
-</div>
-`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
deleted file mode 100644
index 50fe0c0ad..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
+++ /dev/null
@@ -1,79 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
->
-  
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    
-    X
-    
-  </span>
-  <span
-    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-    strong="true"
-    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-  >
-    
-    
-    Label slot
-    
-    
-  </span>
-  <!--v-if-->
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
->
-  
-  <!--v-if-->
-  <span
-    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-    strong="true"
-    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-  >
-    
-    
-    Label slot
-    
-    
-  </span>
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    
-    X
-    
-  </span>
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileHeader > shows label 1`] = `
-<div
-  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
->
-  
-  <!--v-if-->
-  <span
-    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-    strong="true"
-    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-  >
-    
-    
-    Label slot
-    
-    
-  </span>
-  <!--v-if-->
-  
-</div>
-`;
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 30846f551..85a8d80ed 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -60,7 +60,7 @@ const toggleCheckbox2 = (value: number) => {
             <IconErrorFill inherit-color />
           </CdrFulfillmentTileIcon>
         </template>
-        <template #label>Pick up</template>
+        <template #header>Pick up</template>
         <template #body>Not offered</template>
       </CdrFulfillmentTile>
       <CdrFulfillmentTile
@@ -78,7 +78,7 @@ const toggleCheckbox2 = (value: number) => {
             <IconCheckFill inherit-color />
           </CdrFulfillmentTileIcon>
         </template>
-        <template #label>Ship to address</template>
+        <template #header>Ship to address</template>
         <template #body>Today after 2pm</template>
         <template #footer>
           <strong>FREE</strong>
@@ -100,7 +100,7 @@ const toggleCheckbox2 = (value: number) => {
             <IconCheckFill inherit-color />
           </CdrFulfillmentTileIcon>
         </template>
-        <template #label>Another option</template>
+        <template #header>Another option</template>
         <template #footer>
           Footer
           <strong>content</strong>
@@ -122,7 +122,7 @@ const toggleCheckbox2 = (value: number) => {
             <IconCheckFill inherit-color />
           </CdrFulfillmentTileIcon>
         </template>
-        <template #label>Loading option</template>
+        <template #header>Loading option</template>
         <template #body>
           Body
           <strong>content</strong>
@@ -154,7 +154,7 @@ const toggleCheckbox2 = (value: number) => {
               :class="{ example__icon: true, 'example__icon--checked': checkbox1.includes(1) }"
             />
           </template>
-          <template #label>Store Pickup (32)</template>
+          <template #header>Store Pickup (32)</template>
           <template #footer>
             In stock at
             <strong>Encinitas</strong>
@@ -177,7 +177,7 @@ const toggleCheckbox2 = (value: number) => {
         <template #icon-left>
           <div :class="{ example__icon: true, 'example__icon--checked': checkbox1.includes(2) }" />
         </template>
-        <template #label>Ship to address (32)</template>
+        <template #header>Ship to address (32)</template>
       </CdrFulfillmentTile>
     </div>
     <h3 class="action-tile-demo__h3">Other patterns</h3>
@@ -206,7 +206,7 @@ const toggleCheckbox2 = (value: number) => {
             <IconXFill inherit-color />
           </CdrFulfillmentTileIcon>
         </template>
-        <template #label>Pick up</template>
+        <template #header>Pick up</template>
         <template #body>Not offered</template>
       </CdrFulfillmentTile>
       <CdrFulfillmentTile
@@ -223,7 +223,7 @@ const toggleCheckbox2 = (value: number) => {
             <IconCheckFill inherit-color />
           </CdrFulfillmentTileIcon>
         </template>
-        <template #label>Ship to address</template>
+        <template #header>Ship to address</template>
         <template #body>
           Today after 2pm
           <br />
@@ -264,7 +264,7 @@ const toggleCheckbox2 = (value: number) => {
                 :class="{ example__icon: true, 'example__icon--checked': checkbox2.includes(1) }"
               />
             </template>
-            <template #label>Store Pickup (32)</template>
+            <template #header>Store Pickup (32)</template>
           </CdrFulfillmentTileHeader>
           <CdrFulfillmentTileContent>
             In stock at
diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index 30ab03092..0ca2efd9e 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -25,6 +25,7 @@ const rootProps = computed(() => {
     :is="tag"
     v-bind="rootProps"
   >
+    <!-- @slot Where all default content should be placed. -->
     <slot />
   </component>
 </template>
diff --git a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
deleted file mode 100644
index 9991b2440..000000000
--- a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
+++ /dev/null
@@ -1,28 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
-<div
-  class="cdr-surface"
->
-  
-  
-</div>
-`;
-
-exports[`CdrSurface > component unit tests > when "tag" is set to "a" > renders correctly 1`] = `
-<a
-  class="cdr-surface"
->
-  
-  
-</a>
-`;
-
-exports[`CdrSurface > snapshot test > renders correctly 1`] = `
-<div
-  class="cdr-surface"
->
-  
-  
-</div>
-`;
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 97f7275f8..04bb993b3 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -7,7 +7,7 @@ import { surfaceSelection } from '../../types/interfaces';
 import { getSurfaceSelectionProps } from '../../utils/surface';
 import CdrSurfaceSelectionLayout from './CdrSurfaceSelectionLayout.vue';
 
-/** Component for buttons that have a checked state */
+/** Component for buttons that have a checked state. */
 
 defineOptions({ name: 'CdrSurfaceSelection' });
 
diff --git a/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
index 5fc64af76..a6b170799 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
@@ -28,6 +28,8 @@ const rootProps = computed(() => {
 
 <template>
   <div v-bind="rootProps">
+    <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
     <slot />
   </div>
 </template>
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
deleted file mode 100644
index 6ebe21eb5..000000000
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ /dev/null
@@ -1,224 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrSurfaceSelection > is checked 1`] = `
-<button
-  aria-checked="true"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      <!-- @slot Where all default content should be placed. -->
-      
-      Default slot
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrSurfaceSelection > is loading 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  data-loading="true"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      <!-- @slot Where all default content should be placed. -->
-      
-      Default slot
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrSurfaceSelection > shows default 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      <!-- @slot Where all default content should be placed. -->
-      
-      Default slot
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
-  orientation="horizontal"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-surface-selection__inner"
-  >
-    <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
-    >
-      
-      
-    </div>
-    <div
-      class="cdr-surface-selection__loading"
-    >
-      <!-- @slot This slot allows for custom loading content. -->
-      
-      <div
-        aria-busy="true"
-        aria-live="polite"
-        class="cdr-skeleton"
-      >
-        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-        
-        <div
-          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-        />
-        
-      </div>
-      
-    </div>
-  </div>
-</button>
-`;
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
deleted file mode 100644
index 35105992d..000000000
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
+++ /dev/null
@@ -1,28 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrSurfaceSelectionLayout > orientation test > shows horizontal 1`] = `
-<div
-  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
->
-  
-  
-</div>
-`;
-
-exports[`CdrSurfaceSelectionLayout > orientation test > shows vertical 1`] = `
-<div
-  class="cdr-surface-selection-layout cdr-surface-selection-layout--vertical"
->
-  
-  
-</div>
-`;
-
-exports[`CdrSurfaceSelectionLayout > snapshot test > renders correctly 1`] = `
-<div
-  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
->
-  
-  
-</div>
-`;
diff --git a/src/components/text/presets/CdrBody.vue b/src/components/text/presets/CdrBody.vue
index fe94116db..8e6b14659 100644
--- a/src/components/text/presets/CdrBody.vue
+++ b/src/components/text/presets/CdrBody.vue
@@ -1,20 +1,21 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import { baseTextProps } from '../../../types/interfaces';
+import { ScaleValue } from '../../../types/other';
 
 defineOptions({
   name: 'CdrBody',
 });
 
 export interface bodyTextProps extends baseTextProps {
-   /** 
+  /**
    * Sets the type scale
    * @type scaleValue
-   * @values 0, 1
+   * @values -2, -1, 0, 1
    */
-  scale?: '-2' | '-1' | '0' | '1',
+  scale?: ScaleValue;
   /** Toggles the strong variant */
-  strong?: boolean,
+  strong?: boolean;
 }
 
 const props = withDefaults(defineProps<bodyTextProps>(), {
@@ -26,10 +27,9 @@ const props = withDefaults(defineProps<bodyTextProps>(), {
 const typeProperties = computed(() => {
   return {
     '--cdr-body-font-size': `var(--cdr-type-scale-${props.scale})`,
-    '--cdr-body-line-height': 
-      `calc(var(--cdr-type-scale-${props.scale}) * var(--cdr-body-line-height-ratio))`,
+    '--cdr-body-line-height': `calc(var(--cdr-type-scale-${props.scale}) * var(--cdr-body-line-height-ratio))`,
     '--cdr-body-font-weight': props.strong ? '600' : '400',
-  }
+  };
 });
 
 const baseClass = 'cdr-body';
@@ -46,5 +46,4 @@ const style = useCssModule();
   </component>
 </template>
 
-<style module src="./styles/CdrBody.module.scss" lang="scss">
-</style>  
\ No newline at end of file
+<style module src="./styles/CdrBody.module.scss" lang="scss"></style>
diff --git a/src/dev/router.js b/src/dev/router.js
index d6daee78a..7622e57c3 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -53,7 +53,6 @@ const routes = [
   { path: '/selects', name: 'Selects', component: Examples.selects },
   { path: '/skeleton', name: 'Skeleton', component: Examples.skeleton },
   { path: '/split-surface', name: 'Split Surface', component: Examples.splitSurface },
-  { path: '/statusIcon', name: 'Status Icon', component: Examples.statusIcon },
   { path: '/surface', name: 'Surface', component: Examples.surface },
   { path: '/surfaceSelection', name: 'SurfaceSelection', component: Examples.surfaceSelection },
   { path: '/tables', name: 'Tables', component: Examples.tables },
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index a2706b377..13b96c5ce 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -8,6 +8,8 @@ import type {
   Modifier,
   Background,
   Orientation,
+  ScaleValue,
+  StatusType,
 } from './other';
 
 /**
@@ -246,6 +248,37 @@ export interface surfaceSelection extends HtmlAttributes {
   tag?: Tag;
 }
 
-export interface surfaceSelectionLayout {
+export interface surfaceSelectionLayout extends HtmlAttributes {
+  /**
+   * Determines if the layout is in horizontal or vertical mode.
+   * @demoSelectMultiple true
+   * @values horizontal, vertical
+   */
   orientation?: Orientation;
-}
\ No newline at end of file
+}
+
+export interface fulfillmentTileContent extends HtmlAttributes {
+  /**
+   * Determines if the content should expand when space is available.
+   */
+  stretch?: boolean;
+  /**
+   * Sets the type scale
+   * @values -2, -1, 0, 1
+   */
+  scale?: ScaleValue;
+}
+
+export interface fulfillmentTileHeader extends HtmlAttributes {
+  /**
+   * Determines if the content should appear disabled.
+   */
+  disabled?: boolean;
+}
+
+export interface fulfillmentTileIcon extends HtmlAttributes {
+  /**
+   * The intent or type of message being displayed.
+   */
+  type?: StatusType;
+}
diff --git a/src/types/other.ts b/src/types/other.ts
index b84302315..f5697a559 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -39,3 +39,4 @@ export type BorderStyle = 'solid' | 'dotted' | 'dashed';
 export type Modifier = 'primary' | 'secondary';
 export type Orientation = 'vertical' | 'horizontal';
 export type StatusType = 'info' | 'warning' | 'success' | 'error' | 'default';
+export type ScaleValue = '-2' | '-1' | '0' | '1';
\ No newline at end of file

From bf708d8a1f4cb5f78701beb97b522448fa34c87c Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 26 Aug 2024 17:50:09 -0700
Subject: [PATCH 40/70] progress

---
 src/components/text/presets/CdrBody.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/text/presets/CdrBody.vue b/src/components/text/presets/CdrBody.vue
index 8e6b14659..2f932ea23 100644
--- a/src/components/text/presets/CdrBody.vue
+++ b/src/components/text/presets/CdrBody.vue
@@ -27,7 +27,8 @@ const props = withDefaults(defineProps<bodyTextProps>(), {
 const typeProperties = computed(() => {
   return {
     '--cdr-body-font-size': `var(--cdr-type-scale-${props.scale})`,
-    '--cdr-body-line-height': `calc(var(--cdr-type-scale-${props.scale}) * var(--cdr-body-line-height-ratio))`,
+    '--cdr-body-line-height':
+      `calc(var(--cdr-type-scale-${props.scale}) * var(--cdr-body-line-height-ratio))`,
     '--cdr-body-font-weight': props.strong ? '600' : '400',
   };
 });

From 69cb4e67849a2add05400a7a7fdadf7b2c4420c7 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 26 Aug 2024 18:40:29 -0700
Subject: [PATCH 41/70] progress

---
 .../CdrFulfillmentTile.spec.js.snap           | 677 ++++++++++++++++++
 .../CdrFulfillmentTileContent.spec.js.snap    |  29 +
 .../CdrFulfillmentTileHeader.spec.js.snap     |  87 +++
 .../__snapshots__/CdrSurface.spec.js.snap     |  31 +
 .../CdrSurfaceSelection.spec.js.snap          | 234 ++++++
 .../CdrSurfaceSelectionLayout.spec.js.snap    |  34 +
 6 files changed, 1092 insertions(+)
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
 create mode 100644 src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
 create mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
 create mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap

diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
new file mode 100644
index 000000000..18f746c95
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -0,0 +1,677 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTile > component unit tests > default component with no configuration > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > is loading 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  data-loading="true"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <!--v-if-->
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Footer content will be at the bottom of the component. -->
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows body 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Default font size is a step down. Placed just below the header. -->
+          
+          Body slot
+          
+          
+          
+        </div>
+        <!--v-if-->
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows footer 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <!--v-if-->
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Footer content will be at the bottom of the component. -->
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows header 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <span
+        class="cdr-fulfillment-tile-header__icon"
+      >
+        <!-- @slot Place an icon to the right of the header content -->
+        
+        <!-- @slot Place an icon to the right of the header content -->
+        
+        X
+        
+        
+      </span>
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Default font size is a step down. Placed just below the header. -->
+          
+          Body slot
+          
+          
+          
+        </div>
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Footer content will be at the bottom of the component. -->
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  modifier="primary"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <span
+        class="cdr-fulfillment-tile-header__icon"
+      >
+        <!-- @slot Place an icon to the left of the header content -->
+        
+        <!-- @slot Place an icon to the left of the header content -->
+        
+        X
+        
+        
+      </span>
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Default font size is a step down. Placed just below the header. -->
+          
+          Body slot
+          
+          
+          
+        </div>
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Footer content will be at the bottom of the component. -->
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
new file mode 100644
index 000000000..9c3a0cfed
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
@@ -0,0 +1,29 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileContent > is stretch 1`] = `
+<div
+  class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+>
+  
+  <!-- @slot Where all default content should be placed. -->
+  
+  Default slot
+  
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileContent > shows content 1`] = `
+<div
+  class="cdr-body cdr-fulfillment-tile-content"
+  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+>
+  
+  <!-- @slot Where all default content should be placed. -->
+  
+  Default slot
+  
+  
+</div>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
new file mode 100644
index 000000000..0bbe0e5e6
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
@@ -0,0 +1,87 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+>
+  <!-- @slot Place elements in the default slot. -->
+  
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    <!-- @slot Place an icon to the left of the header content -->
+    
+    X
+    
+  </span>
+  <span
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+  >
+    
+    <!-- @slot Header content that is still visible during loading. -->
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+>
+  <!-- @slot Place elements in the default slot. -->
+  
+  <!--v-if-->
+  <span
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+  >
+    
+    <!-- @slot Header content that is still visible during loading. -->
+    
+    Label slot
+    
+    
+  </span>
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    <!-- @slot Place an icon to the right of the header content -->
+    
+    X
+    
+  </span>
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > shows label 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+>
+  <!-- @slot Place elements in the default slot. -->
+  
+  <!--v-if-->
+  <span
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+  >
+    
+    <!-- @slot Header content that is still visible during loading. -->
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+  
+</div>
+`;
diff --git a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
new file mode 100644
index 000000000..d7e5e1948
--- /dev/null
+++ b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
@@ -0,0 +1,31 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
+<div
+  class="cdr-surface"
+>
+  <!-- @slot Where all default content should be placed. -->
+  
+  
+</div>
+`;
+
+exports[`CdrSurface > component unit tests > when "tag" is set to "a" > renders correctly 1`] = `
+<a
+  class="cdr-surface"
+>
+  <!-- @slot Where all default content should be placed. -->
+  
+  
+</a>
+`;
+
+exports[`CdrSurface > snapshot test > renders correctly 1`] = `
+<div
+  class="cdr-surface"
+>
+  <!-- @slot Where all default content should be placed. -->
+  
+  
+</div>
+`;
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
new file mode 100644
index 000000000..488b0fbca
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -0,0 +1,234 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > is checked 1`] = `
+<button
+  aria-checked="true"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+      
+      <!-- @slot Where all default content should be placed. -->
+      
+      Default slot
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > is loading 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  data-loading="true"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+      
+      <!-- @slot Where all default content should be placed. -->
+      
+      Default slot
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > shows default 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+      
+      <!-- @slot Where all default content should be placed. -->
+      
+      Default slot
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  modifier="primary"
+  orientation="horizontal"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-surface-selection__inner"
+  >
+    <div
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+    >
+      <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+      
+      
+    </div>
+    <div
+      class="cdr-surface-selection__loading"
+    >
+      <!-- @slot This slot allows for custom loading content. -->
+      
+      <div
+        aria-busy="true"
+        aria-live="polite"
+        class="cdr-skeleton"
+      >
+        <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+        
+        <div
+          class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+        />
+        
+      </div>
+      
+    </div>
+  </div>
+</button>
+`;
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
new file mode 100644
index 000000000..68d749481
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
@@ -0,0 +1,34 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurfaceSelectionLayout > orientation test > shows horizontal 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+>
+  <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+  
+  
+</div>
+`;
+
+exports[`CdrSurfaceSelectionLayout > orientation test > shows vertical 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--vertical"
+>
+  <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+  
+  
+</div>
+`;
+
+exports[`CdrSurfaceSelectionLayout > snapshot test > renders correctly 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+>
+  <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+  
+  
+</div>
+`;

From 5ce631415d5e4e04c63d5a453c039c0b6a31afab Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 26 Aug 2024 21:40:10 -0700
Subject: [PATCH 42/70] progress

---
 .../fulfillmentTile/CdrFulfillmentTile.vue    |  2 +-
 .../__tests__/CdrFulfillmentTile.spec.js      |  5 +--
 .../CdrFulfillmentTile.spec.js.snap           | 24 ++++--------
 .../CdrFulfillmentTileContent.module.scss     |  2 +-
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  9 +----
 .../vars/CdrFulfillmentTileContent.vars.scss  |  2 +-
 .../surfaceSelection/CdrSurfaceSelection.vue  |  2 +-
 .../__tests__/CdrSurfaceSelection.spec.js     |  5 +--
 .../CdrSurfaceSelection.spec.js.snap          | 15 +++----
 .../examples/SurfaceSelection.vue             | 24 +++---------
 .../styles/CdrSurfaceSelection.module.scss    |  5 +--
 .../styles/vars/CdrSurfaceSelection.vars.scss | 39 +------------------
 src/types/interfaces.ts                       | 13 -------
 src/utils/surface.ts                          |  4 +-
 14 files changed, 32 insertions(+), 119 deletions(-)

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 379bbe88c..bbc7e37a7 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -28,7 +28,7 @@ const baseClass = 'cdr-fulfillment-tile';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { classes, additionalProps } = getSurfaceSelectionProps(props, baseClass);
+  const { classes, ...additionalProps } = getSurfaceSelectionProps(props, baseClass);  
   return { ...additionalProps, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
index 0d10a6fc0..89e1c4051 100644
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
@@ -26,10 +26,7 @@ describe('CdrFulfillmentTile', () => {
         expect(wrapper.element.tagName).toBe('BUTTON');
       });
       it('base classes only', () => {
-        expect(wrapper.classes()).toEqual([
-          'cdr-fulfillment-tile',
-          'cdr-fulfillment-tile--modifier-primary',
-        ]);
+        expect(wrapper.classes()).toEqual(['cdr-fulfillment-tile']);
       });
     });
   });
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
index 18f746c95..84c15bf90 100644
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -3,8 +3,7 @@
 exports[`CdrFulfillmentTile > component unit tests > default component with no configuration > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
+  class="cdr-fulfillment-tile"
   orientation="vertical"
   role="radio"
   tag="button"
@@ -67,9 +66,8 @@ exports[`CdrFulfillmentTile > component unit tests > default component with no c
 exports[`CdrFulfillmentTile > is loading 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
+  class="cdr-fulfillment-tile"
   data-loading="true"
-  modifier="primary"
   orientation="vertical"
   role="radio"
   tag="button"
@@ -154,8 +152,7 @@ exports[`CdrFulfillmentTile > is loading 1`] = `
 exports[`CdrFulfillmentTile > shows body 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
+  class="cdr-fulfillment-tile"
   orientation="vertical"
   role="radio"
   tag="button"
@@ -240,8 +237,7 @@ exports[`CdrFulfillmentTile > shows body 1`] = `
 exports[`CdrFulfillmentTile > shows footer 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
+  class="cdr-fulfillment-tile"
   orientation="vertical"
   role="radio"
   tag="button"
@@ -326,8 +322,7 @@ exports[`CdrFulfillmentTile > shows footer 1`] = `
 exports[`CdrFulfillmentTile > shows header 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
+  class="cdr-fulfillment-tile"
   orientation="vertical"
   role="radio"
   tag="button"
@@ -397,8 +392,7 @@ exports[`CdrFulfillmentTile > shows header 1`] = `
 exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
+  class="cdr-fulfillment-tile"
   orientation="vertical"
   role="radio"
   tag="button"
@@ -461,8 +455,7 @@ exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
 exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
+  class="cdr-fulfillment-tile"
   orientation="vertical"
   role="radio"
   tag="button"
@@ -570,8 +563,7 @@ exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
 exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
 <button
   aria-checked="false"
-  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-primary"
-  modifier="primary"
+  class="cdr-fulfillment-tile"
   orientation="vertical"
   role="radio"
   tag="button"
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileContent.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileContent.module.scss
index 3f84fd473..51366911e 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTileContent.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileContent.module.scss
@@ -1,5 +1,5 @@
 @import './vars/CdrFulfillmentTileContent.vars.scss';
 
 .cdr-fulfillment-tile-content {
-  @include cdr-fulfillment-tile-content-mixin;
+  @include cdr-fulfillment-tile-content-base-mixin;
 }
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index 60bc44e84..b98cd7599 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -1,14 +1,9 @@
-@use 'sass:map';
 @import '../../../../styles/settings/index.scss';
 @import '../../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 
 $fulfillment-tile-component: 'fulfillment-tile';
-$fulfillment-tile-background-colors: (
-  'default': map.get($surface-selection-background-colors, 'primary'),
-);
-$fulfillment-tile-border-colors: (
-  'default': map.get($surface-selection-border-colors, 'primary'),
-);
+$fulfillment-tile-background-colors: $surface-selection-background-colors;
+$fulfillment-tile-border-colors: $surface-selection-border-colors;
 
 @mixin cdr-fulfillment-tile-base-mixin() {
   &__inner {
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss
index 1e5683ec3..fbbb395bd 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileContent.vars.scss
@@ -1,6 +1,6 @@
 @import '../../../../styles/settings/index.scss';
 
-@mixin cdr-fulfillment-tile-content-mixin() {
+@mixin cdr-fulfillment-tile-content-base-mixin() {
   width: 100%;
   flex: 0 0 auto;
 
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 04bb993b3..d08877172 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -27,7 +27,7 @@ const baseClass = 'cdr-surface-selection';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { classes, additionalProps } = getSurfaceSelectionProps(props, baseClass);
+  const { classes, ...additionalProps } = getSurfaceSelectionProps(props, baseClass);
   return { ...additionalProps, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
diff --git a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
index 23a8cf0f9..5c8284289 100644
--- a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
+++ b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
@@ -26,10 +26,7 @@ describe('CdrSurfaceSelection', () => {
         expect(wrapper.element.tagName).toBe('BUTTON');
       });
       it('base classes only', () => {
-        expect(wrapper.classes()).toEqual([
-          'cdr-surface-selection',
-          'cdr-surface-selection--modifier-primary',
-        ]);
+        expect(wrapper.classes()).toEqual(['cdr-surface-selection']);
       });
     });
   });
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
index 488b0fbca..4aed948c4 100644
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -3,8 +3,7 @@
 exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
+  class="cdr-surface-selection"
   orientation="horizontal"
   role="radio"
   tag="button"
@@ -47,8 +46,7 @@ exports[`CdrSurfaceSelection > component unit tests > default component with no
 exports[`CdrSurfaceSelection > is checked 1`] = `
 <button
   aria-checked="true"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
+  class="cdr-surface-selection"
   orientation="horizontal"
   role="radio"
   tag="button"
@@ -95,9 +93,8 @@ exports[`CdrSurfaceSelection > is checked 1`] = `
 exports[`CdrSurfaceSelection > is loading 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
+  class="cdr-surface-selection"
   data-loading="true"
-  modifier="primary"
   orientation="horizontal"
   role="radio"
   tag="button"
@@ -144,8 +141,7 @@ exports[`CdrSurfaceSelection > is loading 1`] = `
 exports[`CdrSurfaceSelection > shows default 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
+  class="cdr-surface-selection"
   orientation="horizontal"
   role="radio"
   tag="button"
@@ -192,8 +188,7 @@ exports[`CdrSurfaceSelection > shows default 1`] = `
 exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-primary"
-  modifier="primary"
+  class="cdr-surface-selection"
   orientation="horizontal"
   role="radio"
   tag="button"
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
index d8abcb73d..64f763f51 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -2,40 +2,34 @@
 import { ref, computed } from 'vue';
 import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
 import type { surfaceSelection } from '../../../types/interfaces';
-import type { Modifier } from '../../../types/other';
 import CdrSwitch from '../../switch/CdrSwitch.vue';
-import CdrSelect from '../../select/CdrSelect.vue';
 
 defineOptions({ name: 'SurfaceSelection' });
 
 const loading = ref(false);
-const modifier = ref<Modifier>('primary');
 
 const examples = computed(
   () =>
     <surfaceSelection[]>[
-      { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
-      { checked: true, modifier: modifier.value, role: 'checkbox', loading: loading.value },
-      { checked: false, modifier: modifier.value, role: 'checkbox', loading: !loading.value },
+      { checked: false, role: 'checkbox', loading: loading.value },
+      { checked: true, role: 'checkbox', loading: loading.value },
+      { checked: false, role: 'checkbox', loading: !loading.value },
       {
         checked: false,
-        modifier: modifier.value,
         role: 'checkbox',
         loading: loading.value,
         disabled: true,
       },
-      { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
-      { checked: false, modifier: modifier.value, role: 'checkbox', loading: loading.value },
+      { checked: false, role: 'checkbox', loading: loading.value },
+      { checked: false, role: 'checkbox', loading: loading.value },
       {
         checked: false,
-        modifier: modifier.value,
         loading: loading.value,
         role: 'checkbox',
         class: 'example__wide',
       },
       {
         checked: false,
-        modifier: modifier.value,
         loading: loading.value,
         role: 'checkbox',
         orientation: 'vertical',
@@ -55,14 +49,6 @@ const examples = computed(
       >
         Toggle loading
       </CdrSwitch>
-      <CdrSelect
-        id="modifier"
-        v-model="modifier"
-        label="Modifier"
-        :options="['primary', 'secondary']"
-      >
-        Modifier
-      </CdrSelect>
     </div>
     <hr class="example__hr" />
     <div class="example__demos">
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
index 27e1c21ce..f30138fc6 100644
--- a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
@@ -8,10 +8,9 @@
     $surface-selection-component
   );
   @include cdr-surface-selection-base-mixin($surface-selection-component);
-  @include cdr-surface-selection-states-modifiers-mixin(
+  @include cdr-surface-selection-states-mixin(
     $surface-selection-background-colors,
     $surface-selection-border-colors,
-    $surface-selection-component,
-    $surface-selection-modifiers
+    $surface-selection-component
   );
 }
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index 7a35fbb24..72623bce4 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -1,9 +1,8 @@
 @import '../../../../styles/settings/index.scss';
 
-$surface-selection-modifiers: 'primary', 'secondary';
 $surface-selection-component: 'surface-selection';
 $surface-selection-background-colors: (
-  'primary': (
+  'default': (
     'rest': $cdr-color-background-surface-selection-primary,
     'hover': $cdr-color-background-surface-selection-primary-hover,
     'active': $cdr-color-background-surface-selection-primary-active,
@@ -11,17 +10,9 @@ $surface-selection-background-colors: (
     'disabled': $cdr-color-background-surface-selection-primary-disabled,
     'loading': $cdr-color-background-surface-selection-primary-loading,
   ),
-  'secondary': (
-    'rest': $cdr-color-background-surface-selection-secondary,
-    'hover': $cdr-color-background-surface-selection-secondary-hover,
-    'active': $cdr-color-background-surface-selection-secondary-active,
-    'checked': $cdr-color-background-surface-selection-secondary-checked,
-    'disabled': $cdr-color-background-surface-selection-secondary-disabled,
-    'loading': $cdr-color-background-surface-selection-secondary-loading,
-  ),
 );
 $surface-selection-border-colors: (
-  'primary': (
+  'default': (
     'rest': $cdr-color-border-surface-selection-primary,
     'hover': $cdr-color-border-surface-selection-primary-hover,
     'active': $cdr-color-border-surface-selection-primary-active,
@@ -29,14 +20,6 @@ $surface-selection-border-colors: (
     'disabled': $cdr-color-border-surface-selection-primary-disabled,
     'loading': $cdr-color-border-surface-selection-primary-loading,
   ),
-  'secondary': (
-    'rest': $cdr-color-border-surface-selection-secondary,
-    'hover': $cdr-color-border-surface-selection-secondary-hover,
-    'active': $cdr-color-border-surface-selection-secondary-active,
-    'checked': $cdr-color-border-surface-selection-secondary-checked,
-    'disabled': $cdr-color-border-surface-selection-secondary-disabled,
-    'loading': $cdr-color-border-surface-selection-secondary-loading,
-  ),
 );
 
 @mixin cdr-surface-selection-disabled-mixin() {
@@ -182,21 +165,3 @@ $surface-selection-border-colors: (
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
   }
 }
-
-@mixin cdr-surface-selection-states-modifiers-mixin(
-  $background-colors,
-  $border-colors,
-  $component,
-  $modifiers
-) {
-  @each $modifier in $modifiers {
-    &--modifier-#{$modifier} {
-      @include cdr-surface-selection-states-mixin(
-        $background-colors,
-        $border-colors,
-        $component,
-        $modifier
-      );
-    }
-  }
-}
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 13b96c5ce..67534c42f 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -150,14 +150,6 @@ export interface baseTextProps extends HtmlAttributes {
   tag?: string;
 }
 
-/**
- * InlineCss data object for allowing any CSS attribute, including CSS variables
- * @interface InlineCss
- */
-export interface InlineCss {
-  [key: string]: any;
-}
-
 /**
  * surface contains the props used to create a surface
  * @interface surface
@@ -222,11 +214,6 @@ export interface surfaceSelection extends HtmlAttributes {
    * Determines if the button is in a loading state. Adds a `data-loading` attribute to the button. Using CSS, this will hide the default slot and show the loading slot.
    */
   loading?: boolean;
-  /**
-   * Determines which set of styles to apply to the component.
-   * @values primary, secondary
-   */
-  modifier?: Modifier;
   /**
    * Determines if the layout is in horizontal or vertical mode.
    * @demoSelectMultiple true
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index fddace178..7beaea848 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -5,7 +5,7 @@ export const getSurfaceProps = (props: surface, baseClass: string) => {
   const classes = [baseClass];
 
   // Add modifier, which applies a background and border color,
-  // but does not apply a border width
+  // but does not apply a border
   if (props.modifier) {
     classes.push(`${baseClass}--modifier-${props.modifier}`);
   }
@@ -66,5 +66,5 @@ export const getSurfaceSelectionProps = (props: surfaceSelection, baseClass: str
     additionalProps['data-loading'] = loading;
   }
 
-  return { classes, additionalProps };
+  return { classes, ...additionalProps };
 };

From bee7e6e40c3811687e54ad07b50dddf1a5fe885b Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 27 Aug 2024 14:44:00 -0700
Subject: [PATCH 43/70] progress

---
 package-lock.json                             |  16 +-
 package.json                                  |   2 +-
 .../__tests__/CdrFulfillmentTile.spec.js      | 117 ---
 .../CdrFulfillmentTileContent.spec.js         |  32 -
 .../CdrFulfillmentTileHeader.spec.js          |  34 -
 .../CdrFulfillmentTile.spec.js.snap           | 669 ------------------
 .../CdrFulfillmentTileContent.spec.js.snap    |  29 -
 .../CdrFulfillmentTileHeader.spec.js.snap     |  87 ---
 .../examples/FulfillmentTile.vue              |   8 +-
 .../surface/styles/vars/CdrSurface.vars.scss  |   8 +-
 .../styles/vars/CdrSurfaceSelection.vars.scss |  33 +-
 .../vars/CdrSurfaceSelectionLayout.vars.scss  |   2 +-
 src/styles/settings/index.scss                |  97 +--
 src/types/other.ts                            |   4 +-
 14 files changed, 42 insertions(+), 1096 deletions(-)
 delete mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
 delete mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
 delete mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
 delete mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap

diff --git a/package-lock.json b/package-lock.json
index aa4a0b6b7..d6a2e6936 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,7 +14,7 @@
       "devDependencies": {
         "@babel/preset-env": "^7.18.2",
         "@emotion/is-prop-valid": "^1.2.1",
-        "@rei/cdr-tokens": "^12.2.0",
+        "@rei/cdr-tokens": "github:rei/rei-cedar-tokens#pr/surface-selection",
         "@rei/cedar-icons": "^2.6.1",
         "@rollup/plugin-babel": "^6.0.3",
         "@types/tabbable": "^3.1.2",
@@ -29,7 +29,6 @@
         "chromedriver": "127",
         "concat": "^1.0.3",
         "cross-env": "^7.0.3",
-        "csstype": "^3.1.3",
         "cz-conventional-changelog": "^3.3.0",
         "eslint": "^8.42.0",
         "eslint-config-prettier": "^8.8.0",
@@ -3066,13 +3065,13 @@
       }
     },
     "node_modules/@rei/cdr-tokens": {
-      "version": "12.2.0",
-      "resolved": "https://registry.npmjs.org/@rei/cdr-tokens/-/cdr-tokens-12.2.0.tgz",
-      "integrity": "sha512-FV8y2pJ/+stfjOAMVg91tOeDd1tP3xM9yn6TDvReVKE8DNGAnKYsLVYe6A+AVrlD9kf7syfoU18o4uG60zRimA==",
+      "version": "12.3.0",
+      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#bb58b3147d62cbc2f6d110c17b87d6c184af330c",
       "dev": true,
+      "license": "ISC",
       "engines": {
-        "node": ">= 8.0.0",
-        "npm": ">= 6.0.0"
+        "node": ">= 20.0.0",
+        "npm": ">= 10.0.0"
       }
     },
     "node_modules/@rei/cedar-icons": {
@@ -5939,7 +5938,8 @@
     "node_modules/csstype": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
-      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
+      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+      "peer": true
     },
     "node_modules/cz-conventional-changelog": {
       "version": "3.3.0",
diff --git a/package.json b/package.json
index 764707500..de46a311b 100644
--- a/package.json
+++ b/package.json
@@ -58,7 +58,7 @@
   "devDependencies": {
     "@babel/preset-env": "^7.18.2",
     "@emotion/is-prop-valid": "^1.2.1",
-    "@rei/cdr-tokens": "^12.2.0",
+    "@rei/cdr-tokens": "github:rei/rei-cedar-tokens#pr/surface-selection",
     "@rei/cedar-icons": "^2.6.1",
     "@rollup/plugin-babel": "^6.0.3",
     "@types/tabbable": "^3.1.2",
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
deleted file mode 100644
index 89e1c4051..000000000
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
+++ /dev/null
@@ -1,117 +0,0 @@
-import { mount } from '../../../../test/vue-jest-style-workaround.js';
-import CdrFulfillmentTile from '../CdrFulfillmentTile.vue';
-
-describe('CdrFulfillmentTile', () => {
-  describe('snapshot test', () => {
-    let wrapper;
-    beforeEach(() => {
-      wrapper = mount(CdrFulfillmentTile, { props: { checked: false } });
-    });
-    it('renders correctly', () => {
-      expect(wrapper.element).toMatchSnapshot();
-    });
-  });
-
-  describe('component unit tests', () => {
-    let wrapper;
-    beforeEach(() => {
-      wrapper = mount(CdrFulfillmentTile, { props: { checked: false } });
-    });
-
-    describe('default component with no configuration', () => {
-      it('renders correctly', () => {
-        expect(wrapper.element).toMatchSnapshot();
-      });
-      it('sets the default tag prop correctly', () => {
-        expect(wrapper.element.tagName).toBe('BUTTON');
-      });
-      it('base classes only', () => {
-        expect(wrapper.classes()).toEqual(['cdr-fulfillment-tile']);
-      });
-    });
-  });
-
-  it('supports icon left configuration', () => {
-    const wrapper = mount(CdrFulfillmentTile, {
-      props: { checked: false },
-      slots: {
-        'icon-left': 'X',
-        header: 'Label slot',
-        body: 'Body slot',
-        footer: 'Footer slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-  });
-
-  it('supports  icon right configuration', () => {
-    const wrapper = mount(CdrFulfillmentTile, {
-      props: { checked: false },
-      slots: {
-        'icon-right': 'X',
-        header: 'Label slot',
-        body: 'Body slot',
-        footer: 'Footer slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-  });
-
-  it('shows header', () => {
-    const wrapper = mount(CdrFulfillmentTile, {
-      props: { checked: false },
-      slots: {
-        header: 'Label slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find('.cdr-fulfillment-tile-header').text()).toBe('Label slot');
-  });
-
-  it('shows body', () => {
-    const wrapper = mount(CdrFulfillmentTile, {
-      props: { checked: false },
-      slots: {
-        header: 'Label slot',
-        body: 'Body slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find('.cdr-fulfillment-tile-content--stretch').text()).toBe('Body slot');
-  });
-
-  it('shows footer', () => {
-    const wrapper = mount(CdrFulfillmentTile, {
-      props: { checked: false },
-      slots: {
-        header: 'Label slot',
-        footer: 'Footer slot',
-      },
-    });
-    expect(wrapper.find('.cdr-fulfillment-tile-content').text()).toBe('Footer slot');
-    expect(wrapper.element).toMatchSnapshot();
-  });
-
-  it('is loading', () => {
-    const wrapper = mount(CdrFulfillmentTile, {
-      props: { checked: false, loading: true },
-      slots: {
-        header: 'Label slot',
-        footer: 'Footer slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find('.cdr-fulfillment-tile').attributes('data-loading')).toBe('true');
-  });
-
-  it('is not loading', () => {
-    const wrapper = mount(CdrFulfillmentTile, {
-      props: { checked: false, loading: false },
-      slots: {
-        header: 'Label slot',
-        footer: 'Footer slot',
-      },
-    });
-    expect(wrapper.find('.cdr-fulfillment-tile').attributes('data-loading')).toBe(undefined);
-  });
-});
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
deleted file mode 100644
index c73bc02e5..000000000
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
+++ /dev/null
@@ -1,32 +0,0 @@
-import { mount } from '../../../../test/vue-jest-style-workaround.js';
-import CdrFulfillmentTileContent from '../CdrFulfillmentTileContent.vue';
-
-describe('CdrFulfillmentTileContent', () => {
-  it('shows content', () => {
-    const wrapper = mount(CdrFulfillmentTileContent, {
-      slots: {
-        default: 'Default slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.classes()).toEqual(['cdr-body', 'cdr-fulfillment-tile-content']);
-    expect(wrapper.text()).toBe('Default slot');
-  });
-
-  it('is stretch', () => {
-    const wrapper = mount(CdrFulfillmentTileContent, {
-      props: {
-        stretch: true,
-      },
-      slots: {
-        default: 'Default slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.classes()).toEqual([
-      'cdr-body',
-      'cdr-fulfillment-tile-content',
-      'cdr-fulfillment-tile-content--stretch',
-    ]);
-  });
-});
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
deleted file mode 100644
index 4597f3e69..000000000
--- a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
+++ /dev/null
@@ -1,34 +0,0 @@
-import { mount } from '../../../../test/vue-jest-style-workaround.js';
-import CdrFulfillmentTileHeader from '../CdrFulfillmentTileHeader.vue';
-
-describe('CdrFulfillmentTileHeader', () => {
-  it('icon left configuration', () => {
-    const wrapper = mount(CdrFulfillmentTileHeader, {
-      slots: {
-        'icon-left': 'X',
-        header: 'Label slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-  });
-
-  it('icon right configuration', () => {
-    const wrapper = mount(CdrFulfillmentTileHeader, {
-      slots: {
-        'icon-right': 'X',
-        header: 'Label slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-  });
-
-  it('shows label', () => {
-    const wrapper = mount(CdrFulfillmentTileHeader, {
-      slots: {
-        header: 'Label slot',
-      },
-    });
-    expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find('.cdr-fulfillment-tile-header__label').text()).toBe('Label slot');
-  });
-});
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
deleted file mode 100644
index 84c15bf90..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
+++ /dev/null
@@ -1,669 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTile > component unit tests > default component with no configuration > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      <!-- @slot Place elements in the default slot. -->
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        <!-- @slot Place elements in the default slot. -->
-        
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        <!-- @slot Custom content when component is loading. -->
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > is loading 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile"
-  data-loading="true"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      <!-- @slot Place elements in the default slot. -->
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        <!-- @slot Place elements in the default slot. -->
-        
-        <!--v-if-->
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          <!-- @slot Where all default content should be placed. -->
-          
-          <!-- @slot Footer content will be at the bottom of the component. -->
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        <!-- @slot Custom content when component is loading. -->
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > shows body 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      <!-- @slot Place elements in the default slot. -->
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        <!-- @slot Place elements in the default slot. -->
-        
-        <div
-          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          <!-- @slot Where all default content should be placed. -->
-          
-          <!-- @slot Default font size is a step down. Placed just below the header. -->
-          
-          Body slot
-          
-          
-          
-        </div>
-        <!--v-if-->
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        <!-- @slot Custom content when component is loading. -->
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > shows footer 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      <!-- @slot Place elements in the default slot. -->
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        <!-- @slot Place elements in the default slot. -->
-        
-        <!--v-if-->
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          <!-- @slot Where all default content should be placed. -->
-          
-          <!-- @slot Footer content will be at the bottom of the component. -->
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        <!-- @slot Custom content when component is loading. -->
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > shows header 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      <!-- @slot Place elements in the default slot. -->
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        <!-- @slot Place elements in the default slot. -->
-        
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        <!-- @slot Custom content when component is loading. -->
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      <!-- @slot Place elements in the default slot. -->
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        <!-- @slot Place elements in the default slot. -->
-        
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        <!-- @slot Custom content when component is loading. -->
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      <!-- @slot Place elements in the default slot. -->
-      
-      <!--v-if-->
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        Label slot
-        
-        
-        
-      </span>
-      <span
-        class="cdr-fulfillment-tile-header__icon"
-      >
-        <!-- @slot Place an icon to the right of the header content -->
-        
-        <!-- @slot Place an icon to the right of the header content -->
-        
-        X
-        
-        
-      </span>
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        <!-- @slot Place elements in the default slot. -->
-        
-        <div
-          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          <!-- @slot Where all default content should be placed. -->
-          
-          <!-- @slot Default font size is a step down. Placed just below the header. -->
-          
-          Body slot
-          
-          
-          
-        </div>
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          <!-- @slot Where all default content should be placed. -->
-          
-          <!-- @slot Footer content will be at the bottom of the component. -->
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        <!-- @slot Custom content when component is loading. -->
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
-
-exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
-<button
-  aria-checked="false"
-  class="cdr-fulfillment-tile"
-  orientation="vertical"
-  role="radio"
-  tag="button"
-  type="button"
->
-  <div
-    class="cdr-fulfillment-tile__inner"
-  >
-    <div
-      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
-    >
-      <!-- @slot Place elements in the default slot. -->
-      
-      <span
-        class="cdr-fulfillment-tile-header__icon"
-      >
-        <!-- @slot Place an icon to the left of the header content -->
-        
-        <!-- @slot Place an icon to the left of the header content -->
-        
-        X
-        
-        
-      </span>
-      <span
-        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-        strong="true"
-        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-      >
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        <!-- @slot Header content that is still visible during loading. -->
-        
-        Label slot
-        
-        
-        
-      </span>
-      <!--v-if-->
-      
-    </div>
-    <div
-      class="cdr-fulfillment-tile__main"
-    >
-      <div
-        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
-      >
-        <!-- @slot Place elements in the default slot. -->
-        
-        <div
-          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          <!-- @slot Where all default content should be placed. -->
-          
-          <!-- @slot Default font size is a step down. Placed just below the header. -->
-          
-          Body slot
-          
-          
-          
-        </div>
-        <div
-          class="cdr-body cdr-fulfillment-tile-content"
-          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
-        >
-          
-          <!-- @slot Where all default content should be placed. -->
-          
-          <!-- @slot Footer content will be at the bottom of the component. -->
-          
-          Footer slot
-          
-          
-          
-        </div>
-        
-      </div>
-      <div
-        class="cdr-fulfillment-tile__loading"
-      >
-        <!-- @slot Custom content when component is loading. -->
-        
-        <div
-          aria-busy="true"
-          aria-live="polite"
-          class="cdr-skeleton"
-        >
-          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
-          
-          <div
-            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
-          />
-          
-        </div>
-        
-      </div>
-    </div>
-  </div>
-</button>
-`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
deleted file mode 100644
index 9c3a0cfed..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
+++ /dev/null
@@ -1,29 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTileContent > is stretch 1`] = `
-<div
-  class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
-  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
->
-  
-  <!-- @slot Where all default content should be placed. -->
-  
-  Default slot
-  
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileContent > shows content 1`] = `
-<div
-  class="cdr-body cdr-fulfillment-tile-content"
-  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
->
-  
-  <!-- @slot Where all default content should be placed. -->
-  
-  Default slot
-  
-  
-</div>
-`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
deleted file mode 100644
index 0bbe0e5e6..000000000
--- a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
+++ /dev/null
@@ -1,87 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
->
-  <!-- @slot Place elements in the default slot. -->
-  
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    <!-- @slot Place an icon to the left of the header content -->
-    
-    X
-    
-  </span>
-  <span
-    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-    strong="true"
-    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-  >
-    
-    <!-- @slot Header content that is still visible during loading. -->
-    
-    Label slot
-    
-    
-  </span>
-  <!--v-if-->
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
-<div
-  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
->
-  <!-- @slot Place elements in the default slot. -->
-  
-  <!--v-if-->
-  <span
-    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-    strong="true"
-    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-  >
-    
-    <!-- @slot Header content that is still visible during loading. -->
-    
-    Label slot
-    
-    
-  </span>
-  <span
-    class="cdr-fulfillment-tile-header__icon"
-  >
-    <!-- @slot Place an icon to the right of the header content -->
-    
-    X
-    
-  </span>
-  
-</div>
-`;
-
-exports[`CdrFulfillmentTileHeader > shows label 1`] = `
-<div
-  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
->
-  <!-- @slot Place elements in the default slot. -->
-  
-  <!--v-if-->
-  <span
-    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
-    strong="true"
-    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
-  >
-    
-    <!-- @slot Header content that is still visible during loading. -->
-    
-    Label slot
-    
-    
-  </span>
-  <!--v-if-->
-  
-</div>
-`;
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 85a8d80ed..94eafc0d9 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -363,8 +363,8 @@ $component: 'fulfillment-tile';
 
   &__checkout-tile-other-disabled {
     --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-    #{--cdr-color-background-fulfillment-tile}: $cdr-color-background-surface-selection-primary-disabled;
-    #{--cdr-color-background-fulfillment-tile-checked}: $cdr-color-background-surface-selection-primary-disabled;
+    #{--cdr-color-background-fulfillment-tile}: $cdr-color-background-surface-selection-disabled;
+    #{--cdr-color-background-fulfillment-tile-checked}: $cdr-color-background-surface-selection-disabled;
     @include cdr-border-style-mixin($component, 'dashed');
   }
 
@@ -378,7 +378,7 @@ $component: 'fulfillment-tile';
 
     &[data-store-checked='true'] {
       $state: 'checked';
-      @include cdr-border-width-mixin($component, 'third-x');
+      @include cdr-border-width-mixin($component, 'three-sixteenth-x');
       @include cdr-border-color-mixin(
         $fulfillment-tile-border-colors,
         $component,
@@ -390,7 +390,7 @@ $component: 'fulfillment-tile';
 
   &__search-tile-other-header-button {
     --cdr-surface-selection-border-width-default: 0;
-    --cdr-color-background-surface-selection-primary-checked: var(--cdr-color-background-primary);
+    --cdr-color-background-surface-selection-checked: var(--cdr-color-background-primary);
     width: 100%;
     @include tile-colors;
 
diff --git a/src/components/surface/styles/vars/CdrSurface.vars.scss b/src/components/surface/styles/vars/CdrSurface.vars.scss
index 022ea96f8..db46862de 100644
--- a/src/components/surface/styles/vars/CdrSurface.vars.scss
+++ b/src/components/surface/styles/vars/CdrSurface.vars.scss
@@ -5,18 +5,18 @@ $surface-modifiers: 'primary', 'secondary';
 $surface-component: 'surface';
 $surface-background-colors: (
   'primary': (
-    'rest': $cdr-color-background-surface-primary,
+    'default': $cdr-color-background-surface-primary,
   ),
   'secondary': (
-    'rest': $cdr-color-background-surface-secondary,
+    'default': $cdr-color-background-surface-secondary,
   ),
 );
 $surface-border-colors: (
   'primary': (
-    'rest': $cdr-color-border-surface-primary,
+    'default': $cdr-color-border-surface-primary,
   ),
   'secondary': (
-    'rest': $cdr-color-border-surface-secondary,
+    'default': $cdr-color-border-surface-secondary,
   ),
 );
 
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index 72623bce4..27664656a 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -3,22 +3,22 @@
 $surface-selection-component: 'surface-selection';
 $surface-selection-background-colors: (
   'default': (
-    'rest': $cdr-color-background-surface-selection-primary,
-    'hover': $cdr-color-background-surface-selection-primary-hover,
-    'active': $cdr-color-background-surface-selection-primary-active,
-    'checked': $cdr-color-background-surface-selection-primary-checked,
-    'disabled': $cdr-color-background-surface-selection-primary-disabled,
-    'loading': $cdr-color-background-surface-selection-primary-loading,
+    'rest': $cdr-color-background-surface-selection-rest,
+    'hover': $cdr-color-background-surface-selection-hover,
+    'active': $cdr-color-background-surface-selection-active,
+    'checked': $cdr-color-background-surface-selection-checked,
+    'disabled': $cdr-color-background-surface-selection-disabled,
+    'loading': $cdr-color-background-surface-selection-loading,
   ),
 );
 $surface-selection-border-colors: (
   'default': (
-    'rest': $cdr-color-border-surface-selection-primary,
-    'hover': $cdr-color-border-surface-selection-primary-hover,
-    'active': $cdr-color-border-surface-selection-primary-active,
-    'checked': $cdr-color-border-surface-selection-primary-checked,
-    'disabled': $cdr-color-border-surface-selection-primary-disabled,
-    'loading': $cdr-color-border-surface-selection-primary-loading,
+    'rest': $cdr-color-border-surface-selection-rest,
+    'hover': $cdr-color-border-surface-selection-hover,
+    'active': $cdr-color-border-surface-selection-active,
+    'checked': $cdr-color-border-surface-selection-checked,
+    'disabled': $cdr-color-border-surface-selection-disabled,
+    'loading': $cdr-color-border-surface-selection-loading,
   ),
 );
 
@@ -114,11 +114,11 @@ $surface-selection-border-colors: (
 
   @include cdr-surface-selection-active-mixin() {
     outline: none;
-    @include cdr-border-width-mixin($component, 'third-x');
+    @include cdr-border-width-mixin($component, 'three-sixteenth-x');
   }
 
   @include cdr-surface-selection-checked-mixin() {
-    @include cdr-border-width-mixin($component, 'third-x');
+    @include cdr-border-width-mixin($component, 'three-sixteenth-x');
   }
 
   &[aria-pressed='true']:not([role='checkbox']),
@@ -133,8 +133,9 @@ $surface-selection-border-colors: (
   $component,
   $modifier: 'default'
 ) {
-  @include cdr-background-mixin($background-colors, $component, $modifier);
-  @include cdr-border-color-mixin($border-colors, $component, $modifier);
+  $state: 'rest';
+  @include cdr-background-mixin($background-colors, $component, $modifier, $state);
+  @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
 
   @include cdr-surface-selection-hover-mixin() {
     $state: 'hover';
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss
index 8dc6cc9ec..b81f71a89 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss
@@ -2,7 +2,7 @@
 
 @mixin cdr-surface-selection-layout-base-mixin() {
   display: flex;
-  gap: $cdr-space-two-third-x;
+  gap: $cdr-space-three-eighth-x;
 
   &--horizontal {
     flex-direction: row;
diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index 095edf6f7..fe0670974 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -7,95 +7,8 @@ $cdr-warn: false;
 @import './visibility.vars';
 @import './fluid.vars';
 
-$cdr-space-zero: 0;
-$cdr-space-sixteenth-x: 0.1rem;
-$cdr-space-third-x: 0.3rem;
-$cdr-space-two-third-x: 0.6rem;
-$cdr-space-inset-zero: 0;
-$cdr-space-inset-sixteenth-x: 0.1rem;
-$cdr-space-inset-third-x: 0.3rem;
-$cdr-space-inset-two-third-x: 0.6rem;
-$cdr-color-background-transparent: transparent;
-$cdr-color-border-transparent: transparent;
-$cdr-color-border-dark: rgba(12, 11, 8, 0.75);
-$cdr-radius-softest: 0.6rem;
-
-$cdr-color-background-surface-primary: #ffffff;
-$cdr-color-background-surface-secondary: #f4f2ed;
-$cdr-color-border-surface-primary: #dcd6cb;
-$cdr-color-border-surface-secondary: #928b80;
-
-$cdr-color-background-surface-selection-primary: #fff;
-$cdr-color-background-surface-selection-primary-hover: #fff;
-$cdr-color-background-surface-selection-primary-active: #fff;
-$cdr-color-background-surface-selection-primary-checked: #fff;
-$cdr-color-background-surface-selection-primary-disabled: #F7F5F3;
-$cdr-color-background-surface-selection-primary-loading: #FBFAF9;
-$cdr-color-background-surface-selection-secondary: #f4f2ed;
-$cdr-color-background-surface-selection-secondary-hover: #f4f2ed;
-$cdr-color-background-surface-selection-secondary-active: #f4f2ed;
-$cdr-color-background-surface-selection-secondary-checked: #f4f2ed;
-$cdr-color-background-surface-selection-secondary-disabled: #dcd6cb;
-$cdr-color-background-surface-selection-secondary-loading: #dcd6cb;
-$cdr-color-border-surface-selection-primary: #958E83;
-$cdr-color-border-surface-selection-primary-hover: #958E83;
-$cdr-color-border-surface-selection-primary-active: #958E83;
-$cdr-color-border-surface-selection-primary-checked: #2E2E2B;
-$cdr-color-border-surface-selection-primary-disabled: #958E83;
-$cdr-color-border-surface-selection-primary-loading: #958E83;
-$cdr-color-border-surface-selection-secondary: rgba(66, 59, 47, 0.75);
-$cdr-color-border-surface-selection-secondary-hover: rgba(66, 59, 47, 0.75);
-$cdr-color-border-surface-selection-secondary-active: rgba(66, 59, 47, 0.75);
-$cdr-color-border-surface-selection-secondary-checked: rgba(3, 3, 1, 0.9);
-$cdr-color-border-surface-selection-secondary-disabled: rgba(66, 59, 47, 0.75);
-$cdr-color-border-surface-selection-secondary-loading: rgba(66, 59, 47, 0.75);
-
-:root {
-  --cdr-color-background-transparent: #{$cdr-color-background-transparent};
-  --cdr-color-border-transparent: #{$cdr-color-border-transparent};
-  --cdr-color-border-dark: #{$cdr-color-border-dark};
-  --cdr-radius-softest: #{$cdr-radius-softest};
-  --cdr-space-inset-zero: #{$cdr-space-inset-zero};
-  --cdr-space-inset-sixteenth-x: #{$cdr-space-inset-sixteenth-x};
-  --cdr-space-inset-third-x: #{$cdr-space-inset-third-x};
-  --cdr-space-inset-two-third-x: #{$cdr-space-inset-two-third-x};
-  --cdr-space-zero: #{$cdr-space-zero};
-  --cdr-space-sixteenth-x: #{$cdr-space-sixteenth-x};
-  --cdr-space-third-x: #{$cdr-space-third-x};
-  --cdr-space-two-third-x: #{$cdr-space-two-third-x};
-
-  --cdr-color-background-surface-primary: #{$cdr-color-background-surface-primary};
-  --cdr-color-background-surface-secondary: #{$cdr-color-background-surface-secondary};
-  --cdr-color-border-surface-primary: #{$cdr-color-border-surface-primary};
-  --cdr-color-border-surface-secondary: #{$cdr-color-border-surface-secondary};
-
-  --cdr-color-background-surface-selection-primary: #{$cdr-color-background-surface-selection-primary};
-  --cdr-color-background-surface-selection-primary-hover: #{$cdr-color-background-surface-selection-primary-hover};
-  --cdr-color-background-surface-selection-primary-active: #{$cdr-color-background-surface-selection-primary-active};
-  --cdr-color-background-surface-selection-primary-checked: #{$cdr-color-background-surface-selection-primary-checked};
-  --cdr-color-background-surface-selection-primary-disabled: #{$cdr-color-background-surface-selection-primary-disabled};
-  --cdr-color-background-surface-selection-primary-loading: #{$cdr-color-background-surface-selection-primary-loading};
-  --cdr-color-background-surface-selection-secondary: #{$cdr-color-background-surface-selection-secondary};
-  --cdr-color-background-surface-selection-secondary-hover: #{$cdr-color-background-surface-selection-secondary-hover};
-  --cdr-color-background-surface-selection-secondary-active: #{$cdr-color-background-surface-selection-secondary-active};
-  --cdr-color-background-surface-selection-secondary-checked: #{$cdr-color-background-surface-selection-secondary-checked};
-  --cdr-color-background-surface-selection-secondary-disabled: #{$cdr-color-background-surface-selection-secondary-disabled};
-  --cdr-color-background-surface-selection-secondary-loading: #{$cdr-color-background-surface-selection-secondary-loading};
-  --cdr-color-border-surface-selection-primary: #{$cdr-color-border-surface-selection-primary};
-  --cdr-color-border-surface-selection-primary-hover: #{$cdr-color-border-surface-selection-primary-hover};
-  --cdr-color-border-surface-selection-primary-active: #{$cdr-color-border-surface-selection-primary-active};
-  --cdr-color-border-surface-selection-primary-checked: #{$cdr-color-border-surface-selection-primary-checked};
-  --cdr-color-border-surface-selection-primary-disabled: #{$cdr-color-border-surface-selection-primary-disabled};
-  --cdr-color-border-surface-selection-primary-loading: #{$cdr-color-border-surface-selection-primary-loading};
-  --cdr-color-border-surface-selection-secondary: #{$cdr-color-border-surface-selection-secondary};
-  --cdr-color-border-surface-selection-secondary-hover: #{$cdr-color-border-surface-selection-secondary-hover};
-  --cdr-color-border-surface-selection-secondary-active: #{$cdr-color-border-surface-selection-secondary-active};
-  --cdr-color-border-surface-selection-secondary-checked: #{$cdr-color-border-surface-selection-secondary-checked};
-  --cdr-color-border-surface-selection-secondary-loading: #{$cdr-color-border-surface-selection-secondary-loading};
-}
-
 $border-widths: (
-  'zero': $cdr-space-inset-zero,
+  'zero': $cdr-space-zero,
   'sixteenth-x': $cdr-space-inset-sixteenth-x,
   'eighth-x': $cdr-space-inset-eighth-x,
   'quarter-x': $cdr-space-inset-quarter-x,
@@ -119,11 +32,11 @@ $shadows: (
   'lifted': $cdr-prominence-lifted,
 );
 
-@mixin cdr-background-mixin($options, $component, $modifier: 'default', $state: 'rest') {
+@mixin cdr-background-mixin($options, $component, $modifier: 'default', $state: 'default') {
   $statePart: '';
   $modifierPart: '';
 
-  @if $state != 'rest' {
+  @if $state != 'default' {
     $statePart: -#{$state};
   }
 
@@ -140,11 +53,11 @@ $shadows: (
   );
 }
 
-@mixin cdr-border-color-mixin($options, $component, $modifier: 'default', $state: 'rest') {
+@mixin cdr-border-color-mixin($options, $component, $modifier: 'default', $state: 'default') {
   $statePart: '';
   $modifierPart: '';
 
-  @if $state != 'rest' {
+  @if $state != 'default' {
     $statePart: -#{$state};
   }
 
diff --git a/src/types/other.ts b/src/types/other.ts
index f5697a559..3fa75781b 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -4,9 +4,9 @@ export type SpaceFixed =
   | 'sixteenth-x'
   | 'eighth-x'
   | 'quarter-x'
-  | 'third-x'
+  | 'three-sixteenth-x'
   | 'half-x'
-  | 'two-third-x'
+  | 'three-eighth-x'
   | 'three-quarter-x'
   | 'one-x'
   | 'one-and-a-half-x'

From 35819836bab2dc7c93e804f87aa04b83d4c5fd9c Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 27 Aug 2024 15:08:15 -0700
Subject: [PATCH 44/70] progress

---
 package-lock.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index d6a2e6936..68634a06c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3066,7 +3066,7 @@
     },
     "node_modules/@rei/cdr-tokens": {
       "version": "12.3.0",
-      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#bb58b3147d62cbc2f6d110c17b87d6c184af330c",
+      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#d43ccd163d3e6dfc1c0ab083b9af7b02fe8d824a",
       "dev": true,
       "license": "ISC",
       "engines": {

From 36339229b67637208b0cb5acd5c51651a5f758ae Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 27 Aug 2024 15:20:14 -0700
Subject: [PATCH 45/70] progress

---
 src/lib.ts | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/lib.ts b/src/lib.ts
index 1f88ac4c6..04120c1ee 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -14,6 +14,10 @@ export { default as CdrChoreographer } from './components/choreographer/CdrChore
 export { default as CdrContainer } from './components/container/CdrContainer.vue';
 export { default as CdrFormGroup } from './components/formGroup/CdrFormGroup.vue';
 export { default as CdrFulfillmentTile } from './components/fulfillmentTile/CdrFulfillmentTile.vue';
+export { default as CdrFulfillmentTileContent } from './components/fulfillmentTile/CdrFulfillmentTileContent.vue';
+export { default as CdrFulfillmentTileHeader } from './components/fulfillmentTile/CdrFulfillmentTileHeader.vue';
+export { default as CdrFulfillmentTileIcon } from './components/fulfillmentTile/CdrFulfillmentTileIcon.vue';
+export { default as CdrFulfillmentTileLayout } from './components/fulfillmentTile/CdrFulfillmentTileLayout.vue';
 export { default as CdrGrid } from './components/grid/CdrGrid.vue';
 export { default as CdrIcon } from './components/icon/CdrIcon.vue';
 export { default as CdrImg } from './components/image/CdrImg.vue';
@@ -35,6 +39,7 @@ export { default as CdrSkeletonBone } from './components/skeleton/CdrSkeletonBon
 export { default as CdrSplitSurface } from './components/splitSurface/CdrSplitSurface.vue';
 export { default as CdrSurface } from './components/surface/CdrSurface.vue';
 export { default as CdrSurfaceSelection } from './components/surfaceSelection/CdrSurfaceSelection.vue';
+export { default as CdrSurfaceSelectionLayout } from './components/surfaceSelection/CdrSurfaceSelectionLayout.vue';
 export { default as CdrTable } from './components/table/CdrTable.vue';
 export { default as CdrTabPanel } from './components/tabs/CdrTabPanel.vue';
 export { default as CdrTabs } from './components/tabs/CdrTabs.vue';
@@ -43,7 +48,7 @@ export { default as CdrTitle } from './components/title/CdrTitle.vue';
 export { default as CdrToast } from './components/toast/CdrToast.vue';
 export { default as CdrToggleButton } from './components/toggleButton/CdrToggleButton.vue';
 export { default as CdrToggleGroup } from './components/toggleButton/CdrToggleGroup.vue';
-export { default as CdrSwitch } from './components/switch/CdrSwitch.vue'
+export { default as CdrSwitch } from './components/switch/CdrSwitch.vue';
 export { default as CdrTooltip } from './components/tooltip/CdrTooltip.vue';
 
 /** Compositions */
@@ -55,5 +60,5 @@ export * from './types/interfaces';
 export * from './types/other';
 
 /** Compile into dist/style folder */
-import "./styles/cdr-reset.scss";
-import "./styles/cdr-fonts.scss";
\ No newline at end of file
+import './styles/cdr-reset.scss';
+import './styles/cdr-fonts.scss';

From 71ff96a4a48ac04aed0f594290df9060d3b1b27f Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Wed, 28 Aug 2024 16:20:45 -0700
Subject: [PATCH 46/70] progress

---
 package-lock.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index 68634a06c..12b66466a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3066,7 +3066,7 @@
     },
     "node_modules/@rei/cdr-tokens": {
       "version": "12.3.0",
-      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#d43ccd163d3e6dfc1c0ab083b9af7b02fe8d824a",
+      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#2b780acaf23279392e48430d4a3f35696bd53933",
       "dev": true,
       "license": "ISC",
       "engines": {

From ca1ffdc1c7663d38c008e7f7ec37d41cac00688e Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 29 Aug 2024 11:17:54 -0700
Subject: [PATCH 47/70] progress

---
 src/types/interfaces.ts | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 67534c42f..bb993e768 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -158,36 +158,43 @@ export interface baseTextProps extends HtmlAttributes {
 export interface surface extends HtmlAttributes {
   /**
    * Adds in a background color based on the current palette's tokens.
+   * @demoSelectMultiple true
    * @values transparent, primary, secondary
    */
   background?: Background;
   /**
    * Specifies a border color based on the token options within Cedar.
+   * @demoSelectMultiple true
    * @values transparent, primary, secondary, success, warning, error
    */
   borderColor?: BorderColor;
   /**
    * Specifies a border style based on the token options within Cedar.
+   * @demoSelectMultiple true
    * @values dotted, dashed, solid
    */
   borderStyle?: BorderStyle;
   /**
    * Specifies a border width based on the token options within Cedar.
+   * @demoSelectMultiple true
    * @values flat, raised, elevated, floating, lifted
    */
   borderWidth?: Space;
   /**
    * Determines which set of styles to apply to the component.
+   * @demoSelectMultiple true
    * @values primary, secondary
    */
   modifier?: Modifier;
   /**
    * Adds in a border radius based on the token options within Cedar.
+   * @demoSelectMultiple true
    * @values transparent, primary, secondary
    */
   radius?: Radius;
   /**
    * Adds a shadow based on the token options within Cedar.
+   * @demoSelectMultiple true
    * @values flat, raised, elevated, floating, lifted
    */
   shadow?: Shadow;

From 1735e585aefac7481842657a14e0dc06584e9c75 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 29 Aug 2024 15:51:49 -0700
Subject: [PATCH 48/70] progress

---
 package-lock.json                             |   2 +-
 .../fulfillmentTile/CdrFulfillmentTile.vue    |   2 +-
 .../__tests__/CdrFulfillmentTile.spec.js      | 126 ++++
 .../CdrFulfillmentTileContent.spec.js         |  32 +
 .../CdrFulfillmentTileHeader.spec.js          |  34 +
 .../__tests__/CdrFulfillmentTileIcon.spec.js  |  24 +
 .../CdrFulfillmentTileLayout.spec.js          |  28 +
 .../CdrFulfillmentTile.spec.js.snap           | 691 ++++++++++++++++++
 .../CdrFulfillmentTileContent.spec.js.snap    |  29 +
 .../CdrFulfillmentTileHeader.spec.js.snap     |  87 +++
 .../CdrFulfillmentTileIcon.spec.js.snap       |  23 +
 .../CdrFulfillmentTileLayout.spec.js.snap     |  23 +
 .../examples/FulfillmentTile.vue              |   4 +-
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  15 +
 .../surface/styles/vars/CdrSurface.vars.scss  |   8 +-
 .../surfaceSelection/CdrSurfaceSelection.vue  |   2 +-
 .../__tests__/CdrSurfaceSelection.spec.js     |   5 +-
 .../CdrSurfaceSelection.spec.js.snap          |  15 +-
 .../styles/CdrSurfaceSelection.module.scss    |   5 +-
 .../styles/vars/CdrSurfaceSelection.vars.scss |  43 +-
 src/styles/settings/index.scss                |  12 +-
 src/types/interfaces.ts                       |   7 +-
 src/types/other.ts                            |  16 +-
 23 files changed, 1186 insertions(+), 47 deletions(-)
 create mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
 create mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
 create mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
 create mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTileIcon.spec.js
 create mode 100644 src/components/fulfillmentTile/__tests__/CdrFulfillmentTileLayout.spec.js
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileIcon.spec.js.snap
 create mode 100644 src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileLayout.spec.js.snap

diff --git a/package-lock.json b/package-lock.json
index 12b66466a..012e2c1f3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3066,7 +3066,7 @@
     },
     "node_modules/@rei/cdr-tokens": {
       "version": "12.3.0",
-      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#2b780acaf23279392e48430d4a3f35696bd53933",
+      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#a9caf6fb557ec10ccc2c9b549ffdbef815346c7e",
       "dev": true,
       "license": "ISC",
       "engines": {
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index bbc7e37a7..9b5d3a6eb 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -16,7 +16,7 @@ defineOptions({ name: 'CdrFulfillmentTile' });
 const props = withDefaults(defineProps<surfaceSelection>(), {
   tag: 'button',
   role: 'radio',
-  modifier: 'primary',
+  modifier: 'default',
   checked: false,
   disabled: false,
   loading: false,
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
new file mode 100644
index 000000000..8e5e88e62
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTile.spec.js
@@ -0,0 +1,126 @@
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrFulfillmentTile from '../CdrFulfillmentTile.vue';
+
+describe('CdrFulfillmentTile', () => {
+  describe('snapshot test', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrFulfillmentTile, {
+        props: { checked: false },
+        slots: { header: 'Header' },
+      });
+    });
+    it('renders correctly', () => {
+      expect(wrapper.element).toMatchSnapshot();
+    });
+  });
+
+  describe('component unit tests', () => {
+    let wrapper;
+    beforeEach(() => {
+      wrapper = mount(CdrFulfillmentTile, {
+        props: { checked: false },
+        slots: { header: 'Header' },
+      });
+    });
+
+    describe('default component with no configuration', () => {
+      it('renders correctly', () => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
+      it('sets the default tag prop correctly', () => {
+        expect(wrapper.element.tagName).toBe('BUTTON');
+      });
+      it('base classes only', () => {
+        expect(wrapper.classes()).toEqual([
+          'cdr-fulfillment-tile',
+          'cdr-fulfillment-tile--modifier-default',
+        ]);
+      });
+    });
+  });
+
+  it('supports icon left configuration', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
+      slots: {
+        'icon-left': 'X',
+        header: 'Label slot',
+        body: 'Body slot',
+        footer: 'Footer slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('supports  icon right configuration', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
+      slots: {
+        'icon-right': 'X',
+        header: 'Label slot',
+        body: 'Body slot',
+        footer: 'Footer slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('shows header', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
+      slots: {
+        header: 'Label slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-fulfillment-tile-header').text()).toBe('Label slot');
+  });
+
+  it('shows body', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
+      slots: {
+        header: 'Label slot',
+        body: 'Body slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-fulfillment-tile-content--stretch').text()).toBe('Body slot');
+  });
+
+  it('shows footer', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false },
+      slots: {
+        header: 'Label slot',
+        footer: 'Footer slot',
+      },
+    });
+    expect(wrapper.find('.cdr-fulfillment-tile-content').text()).toBe('Footer slot');
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('is loading', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false, loading: true },
+      slots: {
+        header: 'Label slot',
+        footer: 'Footer slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-fulfillment-tile').attributes('data-loading')).toBe('true');
+  });
+
+  it('is not loading', () => {
+    const wrapper = mount(CdrFulfillmentTile, {
+      props: { checked: false, loading: false },
+      slots: {
+        header: 'Label slot',
+        footer: 'Footer slot',
+      },
+    });
+    expect(wrapper.find('.cdr-fulfillment-tile').attributes('data-loading')).toBe(undefined);
+  });
+});
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
new file mode 100644
index 000000000..c73bc02e5
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileContent.spec.js
@@ -0,0 +1,32 @@
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrFulfillmentTileContent from '../CdrFulfillmentTileContent.vue';
+
+describe('CdrFulfillmentTileContent', () => {
+  it('shows content', () => {
+    const wrapper = mount(CdrFulfillmentTileContent, {
+      slots: {
+        default: 'Default slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.classes()).toEqual(['cdr-body', 'cdr-fulfillment-tile-content']);
+    expect(wrapper.text()).toBe('Default slot');
+  });
+
+  it('is stretch', () => {
+    const wrapper = mount(CdrFulfillmentTileContent, {
+      props: {
+        stretch: true,
+      },
+      slots: {
+        default: 'Default slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.classes()).toEqual([
+      'cdr-body',
+      'cdr-fulfillment-tile-content',
+      'cdr-fulfillment-tile-content--stretch',
+    ]);
+  });
+});
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
new file mode 100644
index 000000000..4597f3e69
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileHeader.spec.js
@@ -0,0 +1,34 @@
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrFulfillmentTileHeader from '../CdrFulfillmentTileHeader.vue';
+
+describe('CdrFulfillmentTileHeader', () => {
+  it('icon left configuration', () => {
+    const wrapper = mount(CdrFulfillmentTileHeader, {
+      slots: {
+        'icon-left': 'X',
+        header: 'Label slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('icon right configuration', () => {
+    const wrapper = mount(CdrFulfillmentTileHeader, {
+      slots: {
+        'icon-right': 'X',
+        header: 'Label slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('shows label', () => {
+    const wrapper = mount(CdrFulfillmentTileHeader, {
+      slots: {
+        header: 'Label slot',
+      },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.find('.cdr-fulfillment-tile-header__label').text()).toBe('Label slot');
+  });
+});
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileIcon.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileIcon.spec.js
new file mode 100644
index 000000000..04ab8281e
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileIcon.spec.js
@@ -0,0 +1,24 @@
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrFulfillmentTileIcon from '../CdrFulfillmentTileIcon.vue';
+
+describe('CdrFulfillmentTileIcon', () => {
+  it('has defaults', () => {
+    const wrapper = mount(CdrFulfillmentTileIcon, {
+      props: { type: 'default' },
+      slots: { default: 'X' },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+  });
+
+  it('has success type', () => {
+    const wrapper = mount(CdrFulfillmentTileIcon, {
+      props: { type: 'success' },
+      slots: { default: 'X' },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.classes()).toEqual([
+      'cdr-fulfillment-tile-icon',
+      'cdr-fulfillment-tile-icon--success',
+    ]);
+  });
+});
diff --git a/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileLayout.spec.js b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileLayout.spec.js
new file mode 100644
index 000000000..8a2f23125
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/CdrFulfillmentTileLayout.spec.js
@@ -0,0 +1,28 @@
+import { mount } from '../../../../test/vue-jest-style-workaround.js';
+import CdrFulfillmentTileLayout from '../CdrFulfillmentTileLayout.vue';
+
+describe('CdrFulfillmentTileLayout', () => {
+  it('has defaults', () => {
+    const wrapper = mount(CdrFulfillmentTileLayout, {
+      props: {},
+      slots: { default: 'X' },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.classes()).toEqual([
+      'cdr-fulfillment-tile-layout',
+      'cdr-fulfillment-tile-layout--horizontal',
+    ]);
+  });
+
+  it('has vertical layout', () => {
+    const wrapper = mount(CdrFulfillmentTileLayout, {
+      props: { orientation: 'vertical' },
+      slots: { default: 'X' },
+    });
+    expect(wrapper.element).toMatchSnapshot();
+    expect(wrapper.classes()).toEqual([
+      'cdr-fulfillment-tile-layout',
+      'cdr-fulfillment-tile-layout--vertical',
+    ]);
+  });
+});
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
new file mode 100644
index 000000000..5117a2141
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTile.spec.js.snap
@@ -0,0 +1,691 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTile > component unit tests > default component with no configuration > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-default"
+  modifier="default"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Header
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > is loading 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-default"
+  data-loading="true"
+  modifier="default"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <!--v-if-->
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Footer content will be at the bottom of the component. -->
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows body 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-default"
+  modifier="default"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Default font size is a step down. Placed just below the header. -->
+          
+          Body slot
+          
+          
+          
+        </div>
+        <!--v-if-->
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows footer 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-default"
+  modifier="default"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <!--v-if-->
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Footer content will be at the bottom of the component. -->
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > shows header 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-default"
+  modifier="default"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > snapshot test > renders correctly 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-default"
+  modifier="default"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Header
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > supports  icon right configuration 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-default"
+  modifier="default"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <!--v-if-->
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <span
+        class="cdr-fulfillment-tile-header__icon"
+      >
+        <!-- @slot Place an icon to the right of the header content -->
+        
+        <!-- @slot Place an icon to the right of the header content -->
+        
+        X
+        
+        
+      </span>
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Default font size is a step down. Placed just below the header. -->
+          
+          Body slot
+          
+          
+          
+        </div>
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Footer content will be at the bottom of the component. -->
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`CdrFulfillmentTile > supports icon left configuration 1`] = `
+<button
+  aria-checked="false"
+  class="cdr-fulfillment-tile cdr-fulfillment-tile--modifier-default"
+  modifier="default"
+  orientation="vertical"
+  role="radio"
+  tag="button"
+  type="button"
+>
+  <div
+    class="cdr-fulfillment-tile__inner"
+  >
+    <div
+      class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+    >
+      <!-- @slot Place elements in the default slot. -->
+      
+      <span
+        class="cdr-fulfillment-tile-header__icon"
+      >
+        <!-- @slot Place an icon to the left of the header content -->
+        
+        <!-- @slot Place an icon to the left of the header content -->
+        
+        X
+        
+        
+      </span>
+      <span
+        class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+        strong="true"
+        style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+      >
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        <!-- @slot Header content that is still visible during loading. -->
+        
+        Label slot
+        
+        
+        
+      </span>
+      <!--v-if-->
+      
+    </div>
+    <div
+      class="cdr-fulfillment-tile__main"
+    >
+      <div
+        class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical cdr-fulfillment-tile__layout"
+      >
+        <!-- @slot Place elements in the default slot. -->
+        
+        <div
+          class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+          style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Default font size is a step down. Placed just below the header. -->
+          
+          Body slot
+          
+          
+          
+        </div>
+        <div
+          class="cdr-body cdr-fulfillment-tile-content"
+          style="--cdr-body-font-size: var(--cdr-type-scale--1); --cdr-body-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+        >
+          
+          <!-- @slot Where all default content should be placed. -->
+          
+          <!-- @slot Footer content will be at the bottom of the component. -->
+          
+          Footer slot
+          
+          
+          
+        </div>
+        
+      </div>
+      <div
+        class="cdr-fulfillment-tile__loading"
+      >
+        <!-- @slot Custom content when component is loading. -->
+        
+        <div
+          aria-busy="true"
+          aria-live="polite"
+          class="cdr-skeleton"
+        >
+          <!-- @slot CdrSkeleton content (CdrSkeletonBone components) -->
+          
+          <div
+            class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
+          />
+          
+        </div>
+        
+      </div>
+    </div>
+  </div>
+</button>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
new file mode 100644
index 000000000..9c3a0cfed
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileContent.spec.js.snap
@@ -0,0 +1,29 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileContent > is stretch 1`] = `
+<div
+  class="cdr-body cdr-fulfillment-tile-content cdr-fulfillment-tile-content--stretch"
+  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+>
+  
+  <!-- @slot Where all default content should be placed. -->
+  
+  Default slot
+  
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileContent > shows content 1`] = `
+<div
+  class="cdr-body cdr-fulfillment-tile-content"
+  style="--cdr-body-font-size: var(--cdr-type-scale--2); --cdr-body-line-height: calc(var(--cdr-type-scale--2) * var(--cdr-body-line-height-ratio)); --cdr-body-font-weight: 400;"
+>
+  
+  <!-- @slot Where all default content should be placed. -->
+  
+  Default slot
+  
+  
+</div>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
new file mode 100644
index 000000000..0bbe0e5e6
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileHeader.spec.js.snap
@@ -0,0 +1,87 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileHeader > icon left configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+>
+  <!-- @slot Place elements in the default slot. -->
+  
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    <!-- @slot Place an icon to the left of the header content -->
+    
+    X
+    
+  </span>
+  <span
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+  >
+    
+    <!-- @slot Header content that is still visible during loading. -->
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > icon right configuration 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+>
+  <!-- @slot Place elements in the default slot. -->
+  
+  <!--v-if-->
+  <span
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+  >
+    
+    <!-- @slot Header content that is still visible during loading. -->
+    
+    Label slot
+    
+    
+  </span>
+  <span
+    class="cdr-fulfillment-tile-header__icon"
+  >
+    <!-- @slot Place an icon to the right of the header content -->
+    
+    X
+    
+  </span>
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileHeader > shows label 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal cdr-fulfillment-tile-header"
+>
+  <!-- @slot Place elements in the default slot. -->
+  
+  <!--v-if-->
+  <span
+    class="cdr-subheading-sans cdr-fulfillment-tile-header__label"
+    strong="true"
+    style="--cdr-subheading-sans-font-size: var(--cdr-type-scale--1); --cdr-subheading-sans-line-height: calc(var(--cdr-type-scale--1) * var(--cdr-subheading-sans-line-height-ratio));"
+  >
+    
+    <!-- @slot Header content that is still visible during loading. -->
+    
+    Label slot
+    
+    
+  </span>
+  <!--v-if-->
+  
+</div>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileIcon.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileIcon.spec.js.snap
new file mode 100644
index 000000000..462adad26
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileIcon.spec.js.snap
@@ -0,0 +1,23 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileIcon > has defaults 1`] = `
+<span
+  class="cdr-fulfillment-tile-icon cdr-fulfillment-tile-icon--default"
+>
+  <!-- @slot Where all default content should be placed. -->
+  
+  X
+  
+</span>
+`;
+
+exports[`CdrFulfillmentTileIcon > has success type 1`] = `
+<span
+  class="cdr-fulfillment-tile-icon cdr-fulfillment-tile-icon--success"
+>
+  <!-- @slot Where all default content should be placed. -->
+  
+  X
+  
+</span>
+`;
diff --git a/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileLayout.spec.js.snap b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileLayout.spec.js.snap
new file mode 100644
index 000000000..4577f898d
--- /dev/null
+++ b/src/components/fulfillmentTile/__tests__/__snapshots__/CdrFulfillmentTileLayout.spec.js.snap
@@ -0,0 +1,23 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrFulfillmentTileLayout > has defaults 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--horizontal"
+>
+  <!-- @slot Place elements in the default slot. -->
+  
+  X
+  
+</div>
+`;
+
+exports[`CdrFulfillmentTileLayout > has vertical layout 1`] = `
+<div
+  class="cdr-fulfillment-tile-layout cdr-fulfillment-tile-layout--vertical"
+>
+  <!-- @slot Place elements in the default slot. -->
+  
+  X
+  
+</div>
+`;
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 94eafc0d9..83c7df012 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -363,8 +363,8 @@ $component: 'fulfillment-tile';
 
   &__checkout-tile-other-disabled {
     --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-    #{--cdr-color-background-fulfillment-tile}: $cdr-color-background-surface-selection-disabled;
-    #{--cdr-color-background-fulfillment-tile-checked}: $cdr-color-background-surface-selection-disabled;
+    #{--cdr-color-background-fulfillment-tile}: $cdr-color-background-surface-selection-default-disabled;
+    #{--cdr-color-background-fulfillment-tile-checked}: $cdr-color-background-surface-selection-default-disabled;
     @include cdr-border-style-mixin($component, 'dashed');
   }
 
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index b98cd7599..4f417e12e 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -1,3 +1,4 @@
+@use 'sass:map';
 @import '../../../../styles/settings/index.scss';
 @import '../../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 
@@ -6,6 +7,20 @@ $fulfillment-tile-background-colors: $surface-selection-background-colors;
 $fulfillment-tile-border-colors: $surface-selection-border-colors;
 
 @mixin cdr-fulfillment-tile-base-mixin() {
+  // Create tokens for background color
+  @each $modifier, $states in $surface-selection-background-colors {
+    @each $state, $value in $states {
+      --cdr-color-background-fulfillment-tile-#{$modifier}-#{$state}: #{$value};
+    }
+  }
+
+  // Create tokens for border color
+  @each $modifier, $states in $surface-selection-border-colors {
+    @each $state, $value in $states {
+      --cdr-color-border-fulfillment-tile-#{$modifier}-#{$state}: #{$value};
+    }
+  }
+
   &__inner {
     display: flex;
     flex-direction: column;
diff --git a/src/components/surface/styles/vars/CdrSurface.vars.scss b/src/components/surface/styles/vars/CdrSurface.vars.scss
index db46862de..3bfcb1ee1 100644
--- a/src/components/surface/styles/vars/CdrSurface.vars.scss
+++ b/src/components/surface/styles/vars/CdrSurface.vars.scss
@@ -5,18 +5,18 @@ $surface-modifiers: 'primary', 'secondary';
 $surface-component: 'surface';
 $surface-background-colors: (
   'primary': (
-    'default': $cdr-color-background-surface-primary,
+    'undefined': $cdr-color-background-surface-primary,
   ),
   'secondary': (
-    'default': $cdr-color-background-surface-secondary,
+    'undefined': $cdr-color-background-surface-secondary,
   ),
 );
 $surface-border-colors: (
   'primary': (
-    'default': $cdr-color-border-surface-primary,
+    'undefined': $cdr-color-border-surface-primary,
   ),
   'secondary': (
-    'default': $cdr-color-border-surface-secondary,
+    'undefined': $cdr-color-border-surface-secondary,
   ),
 );
 
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index d08877172..dbdce0a7f 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -15,7 +15,7 @@ const props = withDefaults(defineProps<surfaceSelection>(), {
   shadow: undefined,
   tag: 'button',
   role: 'radio',
-  modifier: 'primary',
+  modifier: 'default',
   checked: false,
   disabled: false,
   loading: false,
diff --git a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
index 5c8284289..dc8627d18 100644
--- a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
+++ b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
@@ -26,7 +26,10 @@ describe('CdrSurfaceSelection', () => {
         expect(wrapper.element.tagName).toBe('BUTTON');
       });
       it('base classes only', () => {
-        expect(wrapper.classes()).toEqual(['cdr-surface-selection']);
+        expect(wrapper.classes()).toEqual([
+          'cdr-surface-selection',
+          'cdr-surface-selection--modifier-default',
+        ]);
       });
     });
   });
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
index 4aed948c4..d73fd1e2f 100644
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -3,7 +3,8 @@
 exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
+  modifier="default"
   orientation="horizontal"
   role="radio"
   tag="button"
@@ -46,7 +47,8 @@ exports[`CdrSurfaceSelection > component unit tests > default component with no
 exports[`CdrSurfaceSelection > is checked 1`] = `
 <button
   aria-checked="true"
-  class="cdr-surface-selection"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
+  modifier="default"
   orientation="horizontal"
   role="radio"
   tag="button"
@@ -93,8 +95,9 @@ exports[`CdrSurfaceSelection > is checked 1`] = `
 exports[`CdrSurfaceSelection > is loading 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
   data-loading="true"
+  modifier="default"
   orientation="horizontal"
   role="radio"
   tag="button"
@@ -141,7 +144,8 @@ exports[`CdrSurfaceSelection > is loading 1`] = `
 exports[`CdrSurfaceSelection > shows default 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
+  modifier="default"
   orientation="horizontal"
   role="radio"
   tag="button"
@@ -188,7 +192,8 @@ exports[`CdrSurfaceSelection > shows default 1`] = `
 exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
+  modifier="default"
   orientation="horizontal"
   role="radio"
   tag="button"
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
index f30138fc6..27e1c21ce 100644
--- a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
@@ -8,9 +8,10 @@
     $surface-selection-component
   );
   @include cdr-surface-selection-base-mixin($surface-selection-component);
-  @include cdr-surface-selection-states-mixin(
+  @include cdr-surface-selection-states-modifiers-mixin(
     $surface-selection-background-colors,
     $surface-selection-border-colors,
-    $surface-selection-component
+    $surface-selection-component,
+    $surface-selection-modifiers
   );
 }
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index 27664656a..c66cb617d 100644
--- a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -1,24 +1,25 @@
 @import '../../../../styles/settings/index.scss';
 
 $surface-selection-component: 'surface-selection';
+$surface-selection-modifiers: 'default';
 $surface-selection-background-colors: (
   'default': (
-    'rest': $cdr-color-background-surface-selection-rest,
-    'hover': $cdr-color-background-surface-selection-hover,
-    'active': $cdr-color-background-surface-selection-active,
-    'checked': $cdr-color-background-surface-selection-checked,
-    'disabled': $cdr-color-background-surface-selection-disabled,
-    'loading': $cdr-color-background-surface-selection-loading,
+    'rest': $cdr-color-background-surface-selection-default-rest,
+    'hover': $cdr-color-background-surface-selection-default-hover,
+    'active': $cdr-color-background-surface-selection-default-active,
+    'checked': $cdr-color-background-surface-selection-default-checked,
+    'disabled': $cdr-color-background-surface-selection-default-disabled,
+    'loading': $cdr-color-background-surface-selection-default-loading,
   ),
 );
 $surface-selection-border-colors: (
   'default': (
-    'rest': $cdr-color-border-surface-selection-rest,
-    'hover': $cdr-color-border-surface-selection-hover,
-    'active': $cdr-color-border-surface-selection-active,
-    'checked': $cdr-color-border-surface-selection-checked,
-    'disabled': $cdr-color-border-surface-selection-disabled,
-    'loading': $cdr-color-border-surface-selection-loading,
+    'rest': $cdr-color-border-surface-selection-default-rest,
+    'hover': $cdr-color-border-surface-selection-default-hover,
+    'active': $cdr-color-border-surface-selection-default-active,
+    'checked': $cdr-color-border-surface-selection-default-checked,
+    'disabled': $cdr-color-border-surface-selection-default-disabled,
+    'loading': $cdr-color-border-surface-selection-default-loading,
   ),
 );
 
@@ -166,3 +167,21 @@ $surface-selection-border-colors: (
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
   }
 }
+
+@mixin cdr-surface-selection-states-modifiers-mixin(
+  $background-colors,
+  $border-colors,
+  $component,
+  $modifiers
+) {
+  @each $modifier in $modifiers {
+    &--modifier-#{$modifier} {
+      @include cdr-surface-selection-states-mixin(
+        $background-colors,
+        $border-colors,
+        $component,
+        $modifier
+      );
+    }
+  }
+}
diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index fe0670974..3197da857 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -32,15 +32,15 @@ $shadows: (
   'lifted': $cdr-prominence-lifted,
 );
 
-@mixin cdr-background-mixin($options, $component, $modifier: 'default', $state: 'default') {
+@mixin cdr-background-mixin($options, $component, $modifier: 'undefined', $state: 'undefined') {
   $statePart: '';
   $modifierPart: '';
 
-  @if $state != 'default' {
+  @if $state != 'undefined' {
     $statePart: -#{$state};
   }
 
-  @if $modifier != 'default' {
+  @if $modifier != 'undefined' {
     $modifierPart: -#{$modifier};
   }
 
@@ -53,15 +53,15 @@ $shadows: (
   );
 }
 
-@mixin cdr-border-color-mixin($options, $component, $modifier: 'default', $state: 'default') {
+@mixin cdr-border-color-mixin($options, $component, $modifier: 'undefined', $state: 'undefined') {
   $statePart: '';
   $modifierPart: '';
 
-  @if $state != 'default' {
+  @if $state != 'undefined' {
     $statePart: -#{$state};
   }
 
-  @if $modifier != 'default' {
+  @if $modifier != 'undefined' {
     $modifierPart: -#{$modifier};
   }
 
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index bb993e768..36df69ccd 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -177,7 +177,7 @@ export interface surface extends HtmlAttributes {
   /**
    * Specifies a border width based on the token options within Cedar.
    * @demoSelectMultiple true
-   * @values flat, raised, elevated, floating, lifted
+   * @values zero, sixteenth-x, eighth-x, three-sixteenth-x, quarter-x'
    */
   borderWidth?: Space;
   /**
@@ -221,6 +221,11 @@ export interface surfaceSelection extends HtmlAttributes {
    * Determines if the button is in a loading state. Adds a `data-loading` attribute to the button. Using CSS, this will hide the default slot and show the loading slot.
    */
   loading?: boolean;
+  /**
+   * Determines which set of styles to apply to the component.
+   * @values default
+   */
+  modifier?: Modifier;
   /**
    * Determines if the layout is in horizontal or vertical mode.
    * @demoSelectMultiple true
diff --git a/src/types/other.ts b/src/types/other.ts
index 3fa75781b..897de6ee6 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -3,10 +3,10 @@ export type SpaceFixed =
   | 'zero'
   | 'sixteenth-x'
   | 'eighth-x'
-  | 'quarter-x'
   | 'three-sixteenth-x'
-  | 'half-x'
+  | 'quarter-x'
   | 'three-eighth-x'
+  | 'half-x'
   | 'three-quarter-x'
   | 'one-x'
   | 'one-and-a-half-x'
@@ -28,15 +28,9 @@ export type Space = SpaceFixed | SpaceFluid | SpaceScale;
 export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
 export type Background = 'transparent' | 'primary' | 'secondary';
 export type Radius = 'sharp' | 'soft' | 'softer' | 'softest' | 'round';
-export type BorderColor =
-  | 'transparent'
-  | 'primary'
-  | 'secondary'
-  | 'success'
-  | 'warning'
-  | 'error';
+export type BorderColor = 'transparent' | 'primary' | 'secondary' | 'success' | 'warning' | 'error';
 export type BorderStyle = 'solid' | 'dotted' | 'dashed';
-export type Modifier = 'primary' | 'secondary';
+export type Modifier = 'default' | 'primary' | 'secondary';
 export type Orientation = 'vertical' | 'horizontal';
 export type StatusType = 'info' | 'warning' | 'success' | 'error' | 'default';
-export type ScaleValue = '-2' | '-1' | '0' | '1';
\ No newline at end of file
+export type ScaleValue = '-2' | '-1' | '0' | '1';

From f5411dc0b09ae63cea7179bc0b6b8086b48c00c9 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 29 Aug 2024 16:19:24 -0700
Subject: [PATCH 49/70] progress

---
 src/styles/settings/index.scss | 2 ++
 src/types/interfaces.ts        | 9 +++------
 src/types/other.ts             | 4 ++--
 3 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/styles/settings/index.scss b/src/styles/settings/index.scss
index 3197da857..b6241195f 100644
--- a/src/styles/settings/index.scss
+++ b/src/styles/settings/index.scss
@@ -11,7 +11,9 @@ $border-widths: (
   'zero': $cdr-space-zero,
   'sixteenth-x': $cdr-space-inset-sixteenth-x,
   'eighth-x': $cdr-space-inset-eighth-x,
+  'three-sixteenth-x': $cdr-space-inset-three-sixteenth-x,
   'quarter-x': $cdr-space-inset-quarter-x,
+  'three-eighth-x': $cdr-space-inset-three-eighth-x,
 );
 
 $border-styles: 'dotted', 'dashed', 'solid';
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 36df69ccd..ed5d98c4f 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -159,37 +159,34 @@ export interface surface extends HtmlAttributes {
   /**
    * Adds in a background color based on the current palette's tokens.
    * @demoSelectMultiple true
-   * @values transparent, primary, secondary
+   * @values primary, secondary
    */
   background?: Background;
   /**
    * Specifies a border color based on the token options within Cedar.
    * @demoSelectMultiple true
-   * @values transparent, primary, secondary, success, warning, error
+   * @values primary, secondary
    */
   borderColor?: BorderColor;
   /**
    * Specifies a border style based on the token options within Cedar.
-   * @demoSelectMultiple true
    * @values dotted, dashed, solid
    */
   borderStyle?: BorderStyle;
   /**
    * Specifies a border width based on the token options within Cedar.
-   * @demoSelectMultiple true
    * @values zero, sixteenth-x, eighth-x, three-sixteenth-x, quarter-x'
    */
   borderWidth?: Space;
   /**
    * Determines which set of styles to apply to the component.
-   * @demoSelectMultiple true
    * @values primary, secondary
    */
   modifier?: Modifier;
   /**
    * Adds in a border radius based on the token options within Cedar.
    * @demoSelectMultiple true
-   * @values transparent, primary, secondary
+   * @values sharp, soft, softer, softest, round
    */
   radius?: Radius;
   /**
diff --git a/src/types/other.ts b/src/types/other.ts
index 897de6ee6..800b0f542 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -26,9 +26,9 @@ export type SpaceFluid =
 export type SpaceScale = 'scale-0--1' | 'scale-3--4' | 'scale-3--5';
 export type Space = SpaceFixed | SpaceFluid | SpaceScale;
 export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
-export type Background = 'transparent' | 'primary' | 'secondary';
+export type Background = 'primary' | 'secondary';
 export type Radius = 'sharp' | 'soft' | 'softer' | 'softest' | 'round';
-export type BorderColor = 'transparent' | 'primary' | 'secondary' | 'success' | 'warning' | 'error';
+export type BorderColor = 'primary' | 'secondary';
 export type BorderStyle = 'solid' | 'dotted' | 'dashed';
 export type Modifier = 'default' | 'primary' | 'secondary';
 export type Orientation = 'vertical' | 'horizontal';

From 78f359174ce9199e5cdfede1a87550e29fc3f6fd Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 29 Aug 2024 16:32:15 -0700
Subject: [PATCH 50/70] progress

---
 src/types/interfaces.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index ed5d98c4f..ac21524cd 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -164,7 +164,6 @@ export interface surface extends HtmlAttributes {
   background?: Background;
   /**
    * Specifies a border color based on the token options within Cedar.
-   * @demoSelectMultiple true
    * @values primary, secondary
    */
   borderColor?: BorderColor;
@@ -247,7 +246,6 @@ export interface surfaceSelection extends HtmlAttributes {
 export interface surfaceSelectionLayout extends HtmlAttributes {
   /**
    * Determines if the layout is in horizontal or vertical mode.
-   * @demoSelectMultiple true
    * @values horizontal, vertical
    */
   orientation?: Orientation;
@@ -275,6 +273,7 @@ export interface fulfillmentTileHeader extends HtmlAttributes {
 export interface fulfillmentTileIcon extends HtmlAttributes {
   /**
    * The intent or type of message being displayed.
+   * @values info, warning, success, error, default
    */
   type?: StatusType;
 }

From be80bff9d974fb17253ca8fc62bc78defc09d2e3 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 29 Aug 2024 18:02:15 -0700
Subject: [PATCH 51/70] progress

---
 .../fulfillmentTile/CdrFulfillmentTileHeader.vue      | 11 ++---------
 src/types/interfaces.ts                               |  7 -------
 2 files changed, 2 insertions(+), 16 deletions(-)

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
index 602fea99b..18dc35a8f 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -2,26 +2,19 @@
 import { useCssModule, computed } from 'vue';
 import CdrSubheadingSans from '../text/presets/CdrSubheadingSans.vue';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
-import { fulfillmentTileHeader, surfaceSelectionLayout } from '../../types/interfaces';
+import { surfaceSelectionLayout } from '../../types/interfaces';
 
 /** Fulfillment tile header component */
 
 defineOptions({ name: 'CdrFulfillmentTileHeader' });
 
-const props = withDefaults(defineProps<fulfillmentTileHeader>(), {
-  disabled: false,
-});
-
 const style = useCssModule();
 const baseClass = 'cdr-fulfillment-tile-header';
 
 const rootProps = computed(
   (): surfaceSelectionLayout => ({
     orientation: 'horizontal',
-    class: {
-      [style[baseClass]]: true,
-      [style[`${baseClass}--disabled`]]: props.disabled,
-    },
+    class: { [style[baseClass]]: true },
   }),
 );
 </script>
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index ac21524cd..1bccc9ae2 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -263,13 +263,6 @@ export interface fulfillmentTileContent extends HtmlAttributes {
   scale?: ScaleValue;
 }
 
-export interface fulfillmentTileHeader extends HtmlAttributes {
-  /**
-   * Determines if the content should appear disabled.
-   */
-  disabled?: boolean;
-}
-
 export interface fulfillmentTileIcon extends HtmlAttributes {
   /**
    * The intent or type of message being displayed.

From cc2b7a586eee527c8b92f56a8a73849fa18daf22 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 3 Sep 2024 09:33:35 -0700
Subject: [PATCH 52/70] progress

---
 build/component-variables-transfer.js         |  5 +++-
 .../examples/FulfillmentTile.vue              | 24 -------------------
 .../vars/CdrFulfillmentTileHeader.vars.scss   |  1 -
 .../vars/CdrFulfillmentTileIcon.vars.scss     |  2 ++
 4 files changed, 6 insertions(+), 26 deletions(-)

diff --git a/build/component-variables-transfer.js b/build/component-variables-transfer.js
index 0e274ea8f..88116cdee 100644
--- a/build/component-variables-transfer.js
+++ b/build/component-variables-transfer.js
@@ -24,7 +24,10 @@ const SUPPORTED_COMPONENTS = [
   'CdrSelect.vars.scss',
   'CdrSkeleton.vars.scss',
   'CdrList.vars.scss',
-  'CdrTable.vars.scss'
+  'CdrTable.vars.scss',
+  'CdrSurface.vars.scss',
+  'CdrSurfaceSelection.vars.scss',
+  'CdrFulfillmentTile.vars.scss'
 ];
 
 const destMixinsDir = path.join(__dirname, `../../${DEST_REPO_NAME + path.sep + DEST_PATH}`);
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 83c7df012..8896523be 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -49,7 +49,6 @@ const toggleCheckbox2 = (value: number) => {
       aria-labelledby="radio1"
     >
       <CdrFulfillmentTile
-        class="example__checkout-tile"
         :disabled="true"
         tabindex="0"
         role="radio"
@@ -64,7 +63,6 @@ const toggleCheckbox2 = (value: number) => {
         <template #body>Not offered</template>
       </CdrFulfillmentTile>
       <CdrFulfillmentTile
-        class="example__checkout-tile"
         :checked="radio1 === 1"
         tabindex="0"
         role="radio"
@@ -86,7 +84,6 @@ const toggleCheckbox2 = (value: number) => {
         </template>
       </CdrFulfillmentTile>
       <CdrFulfillmentTile
-        class="example__checkout-tile"
         :checked="radio1 === 2"
         tabindex="0"
         role="radio"
@@ -107,7 +104,6 @@ const toggleCheckbox2 = (value: number) => {
         </template>
       </CdrFulfillmentTile>
       <CdrFulfillmentTile
-        class="example__checkout-tile"
         :checked="radio1 === 3"
         tabindex="0"
         role="radio"
@@ -210,7 +206,6 @@ const toggleCheckbox2 = (value: number) => {
         <template #body>Not offered</template>
       </CdrFulfillmentTile>
       <CdrFulfillmentTile
-        class="example__checkout-tile"
         :checked="radio2 === 1"
         role="radio"
         @click="radio2 = 1"
@@ -292,19 +287,6 @@ const toggleCheckbox2 = (value: number) => {
 
 $component: 'fulfillment-tile';
 
-@mixin tile-colors() {
-  &[aria-pressed='true'],
-  &[aria-checked='true'] {
-    --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-message-success);
-  }
-
-  &:disabled,
-  &:disabled:hover,
-  &:disabled:focus {
-    --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-  }
-}
-
 .example {
   &__h3 {
     margin: $cdr-space-two-x 0 $cdr-space-one-x 0;
@@ -325,17 +307,12 @@ $component: 'fulfillment-tile';
     }
   }
 
-  &__checkout-tile {
-    @include tile-colors;
-  }
-
   &__column {
     width: 100%;
     max-width: 230px;
   }
 
   &__search-tile {
-    @include tile-colors;
     width: 100%;
   }
 
@@ -392,7 +369,6 @@ $component: 'fulfillment-tile';
     --cdr-surface-selection-border-width-default: 0;
     --cdr-color-background-surface-selection-checked: var(--cdr-color-background-primary);
     width: 100%;
-    @include tile-colors;
 
     @include cdr-surface-selection-checked-mixin() {
       --cdr-surface-selection-border-width-default: 0;
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
index dbd7fca04..2be463179 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileHeader.vars.scss
@@ -8,7 +8,6 @@
 
   &__icon {
     flex: 0 0 auto;
-    fill: var(--cdr-fulfillment-tile-icon-fill);
   }
 
   &__label {
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileIcon.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileIcon.vars.scss
index c4c5d356f..360f9875e 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileIcon.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTileIcon.vars.scss
@@ -7,6 +7,7 @@
   justify-content: center;
   border-radius: $cdr-radius-round;
   position: relative;
+  fill: var(--cdr-fulfillment-tile-icon-fill);
 
   &:after {
     content: '';
@@ -27,6 +28,7 @@
     stroke-width: $cdr-space-eighth-x;
     paint-order: stroke fill;
     margin: $cdr-space-quarter-x;
+
   }
 }
 

From 905a6adeec043616ba355f8ae40df2f16a5c9e16 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 3 Sep 2024 09:50:33 -0700
Subject: [PATCH 53/70] progress

---
 build/component-variables-transfer.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/build/component-variables-transfer.js b/build/component-variables-transfer.js
index 88116cdee..2c286da42 100644
--- a/build/component-variables-transfer.js
+++ b/build/component-variables-transfer.js
@@ -27,7 +27,11 @@ const SUPPORTED_COMPONENTS = [
   'CdrTable.vars.scss',
   'CdrSurface.vars.scss',
   'CdrSurfaceSelection.vars.scss',
-  'CdrFulfillmentTile.vars.scss'
+  'CdrSurfaceSelectionLayout.vars.scss',
+  'CdrFulfillmentTile.vars.scss',
+  'CdrFulfillmentTileContent.vars.scss',
+  'CdrFulfillmentTileHeader.vars.scss',
+  'CdrFulfillmentTileIcon.vars.scss'
 ];
 
 const destMixinsDir = path.join(__dirname, `../../${DEST_REPO_NAME + path.sep + DEST_PATH}`);

From 10b8f0596fe3e1b551fd3d18792bc298b0ee60ba Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 3 Sep 2024 10:03:58 -0700
Subject: [PATCH 54/70] progress

---
 build/component-variables-transfer.js | 9 +--------
 1 file changed, 1 insertion(+), 8 deletions(-)

diff --git a/build/component-variables-transfer.js b/build/component-variables-transfer.js
index 2c286da42..0e274ea8f 100644
--- a/build/component-variables-transfer.js
+++ b/build/component-variables-transfer.js
@@ -24,14 +24,7 @@ const SUPPORTED_COMPONENTS = [
   'CdrSelect.vars.scss',
   'CdrSkeleton.vars.scss',
   'CdrList.vars.scss',
-  'CdrTable.vars.scss',
-  'CdrSurface.vars.scss',
-  'CdrSurfaceSelection.vars.scss',
-  'CdrSurfaceSelectionLayout.vars.scss',
-  'CdrFulfillmentTile.vars.scss',
-  'CdrFulfillmentTileContent.vars.scss',
-  'CdrFulfillmentTileHeader.vars.scss',
-  'CdrFulfillmentTileIcon.vars.scss'
+  'CdrTable.vars.scss'
 ];
 
 const destMixinsDir = path.join(__dirname, `../../${DEST_REPO_NAME + path.sep + DEST_PATH}`);

From 7bc063e88681dc705863ec99164b2b86f958a00f Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 3 Sep 2024 10:32:09 -0700
Subject: [PATCH 55/70] progress

---
 src/types/interfaces.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 1bccc9ae2..aebc737ab 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -179,6 +179,7 @@ export interface surface extends HtmlAttributes {
   borderWidth?: Space;
   /**
    * Determines which set of styles to apply to the component.
+   * @demoSelectMultiple true
    * @values primary, secondary
    */
   modifier?: Modifier;

From 8465cef169c7b30832850ea95d6e178725bd574a Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 3 Sep 2024 11:33:53 -0700
Subject: [PATCH 56/70] progress

---
 src/types/interfaces.ts | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index aebc737ab..8852b9e31 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -158,7 +158,7 @@ export interface baseTextProps extends HtmlAttributes {
 export interface surface extends HtmlAttributes {
   /**
    * Adds in a background color based on the current palette's tokens.
-   * @demoSelectMultiple true
+   * @demoSelectMultiple false
    * @values primary, secondary
    */
   background?: Background;
@@ -179,19 +179,19 @@ export interface surface extends HtmlAttributes {
   borderWidth?: Space;
   /**
    * Determines which set of styles to apply to the component.
-   * @demoSelectMultiple true
+   * @demoSelectMultiple false
    * @values primary, secondary
    */
   modifier?: Modifier;
   /**
    * Adds in a border radius based on the token options within Cedar.
-   * @demoSelectMultiple true
+   * @demoSelectMultiple false
    * @values sharp, soft, softer, softest, round
    */
   radius?: Radius;
   /**
    * Adds a shadow based on the token options within Cedar.
-   * @demoSelectMultiple true
+   * @demoSelectMultiple false
    * @values flat, raised, elevated, floating, lifted
    */
   shadow?: Shadow;
@@ -225,7 +225,7 @@ export interface surfaceSelection extends HtmlAttributes {
   modifier?: Modifier;
   /**
    * Determines if the layout is in horizontal or vertical mode.
-   * @demoSelectMultiple true
+   * @demoSelectMultiple false
    * @values horizontal, vertical
    */
   orientation?: Orientation;

From 15c2a713e3aa3020f7e7cc13766189664107a145 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 9 Sep 2024 10:32:01 -0700
Subject: [PATCH 57/70] name change to selectable surface

---
 src/components/examples.js                    |  4 +--
 .../fulfillmentTile/CdrFulfillmentTile.vue    | 10 +++---
 .../CdrFulfillmentTileHeader.vue              |  4 +--
 .../CdrFulfillmentTileLayout.vue              |  4 +--
 .../examples/FulfillmentTile.vue              |  8 ++---
 .../styles/CdrFulfillmentTile.module.scss     |  2 +-
 .../CdrFulfillmentTileLayout.module.scss      |  2 +-
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  2 +-
 .../CdrSelectableSurface.vue}                 | 20 +++++------
 .../CdrSelectableSurfaceLayout.vue}           |  8 ++---
 .../__tests__/CdrSelectableSurface.spec.js}   | 16 ++++-----
 .../CdrSelectableSurfaceLayout.spec.js}       | 10 +++---
 .../CdrSelectableSurface.spec.js.snap}        | 10 +++---
 .../CdrSelectableSurfaceLayout.spec.js.snap}  |  6 ++--
 .../examples/SelectableSurface.vue}           | 34 +++++++++----------
 .../styles/CdrSelectableSurface.module.scss}  |  2 +-
 .../CdrSelectableSurfaceLayout.module.scss}   |  2 +-
 .../vars/CdrSelectableSurface.vars.scss}      |  0
 .../CdrSelectableSurfaceLayout.vars.scss}     |  0
 src/dev/router.js                             |  2 +-
 src/lib.ts                                    |  4 +--
 src/types/interfaces.ts                       |  4 +--
 src/utils/surface.ts                          |  4 +--
 23 files changed, 79 insertions(+), 79 deletions(-)
 rename src/components/{surfaceSelection/CdrSurfaceSelection.vue => selectableSurface/CdrSelectableSurface.vue} (67%)
 rename src/components/{surfaceSelection/CdrSurfaceSelectionLayout.vue => selectableSurface/CdrSelectableSurfaceLayout.vue} (72%)
 rename src/components/{surfaceSelection/__tests__/CdrSurfaceSelection.spec.js => selectableSurface/__tests__/CdrSelectableSurface.spec.js} (80%)
 rename src/components/{surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js => selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js} (67%)
 rename src/components/{surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap => selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap} (93%)
 rename src/components/{surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap => selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap} (74%)
 rename src/components/{surfaceSelection/examples/SurfaceSelection.vue => selectableSurface/examples/SelectableSurface.vue} (70%)
 rename src/components/{surfaceSelection/styles/CdrSurfaceSelection.module.scss => selectableSurface/styles/CdrSelectableSurface.module.scss} (91%)
 rename src/components/{surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss => selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss} (72%)
 rename src/components/{surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss => selectableSurface/styles/vars/CdrSelectableSurface.vars.scss} (100%)
 rename src/components/{surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss => selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss} (100%)

diff --git a/src/components/examples.js b/src/components/examples.js
index cc621401d..b67235cfb 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -31,7 +31,7 @@ import selects from 'componentsdir/select/examples/Selects.vue';
 import skeleton from 'componentsdir/skeleton/examples/Skeleton.vue';
 import splitSurface from 'componentsdir/splitSurface/examples/SplitSurface.vue';
 import surface from 'componentsdir/surface/examples/Surface.vue';
-import surfaceSelection from 'componentsdir/surfaceSelection/examples/SurfaceSelection.vue';
+import selectableSurface from 'componentsdir/selectableSurface/examples/SelectableSurface.vue';
 import tables from 'componentsdir/table/examples/Table.vue';
 import tabs from 'componentsdir/tabs/examples/Tabs.vue';
 import texts from 'componentsdir/text/examples/Text.vue';
@@ -76,7 +76,7 @@ export default {
   skeleton,
   splitSurface,
   surface,
-  surfaceSelection,
+  selectableSurface,
   tables,
   tabs,
   texts,
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 9b5d3a6eb..b4a8b54e1 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -1,19 +1,19 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import { surfaceSelection } from '../../types/interfaces';
-import { getSurfaceSelectionProps } from '../../utils/surface';
+import { selectableSurface } from '../../types/interfaces';
+import { getSelectableSurfaceProps } from '../../utils/surface';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
 import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
 import CdrFulfillmentTileContent from './CdrFulfillmentTileContent.vue';
 import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
 import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 
-/** Tile component for displaying a button with optional icon in the header. Based on Surface selection. */
+/** Displays a button with optional icon in the header */
 
 defineOptions({ name: 'CdrFulfillmentTile' });
 
-const props = withDefaults(defineProps<surfaceSelection>(), {
+const props = withDefaults(defineProps<selectableSurface>(), {
   tag: 'button',
   role: 'radio',
   modifier: 'default',
@@ -28,7 +28,7 @@ const baseClass = 'cdr-fulfillment-tile';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { classes, ...additionalProps } = getSurfaceSelectionProps(props, baseClass);  
+  const { classes, ...additionalProps } = getSelectableSurfaceProps(props, baseClass);  
   return { ...additionalProps, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
index 18dc35a8f..aaad6e313 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -2,7 +2,7 @@
 import { useCssModule, computed } from 'vue';
 import CdrSubheadingSans from '../text/presets/CdrSubheadingSans.vue';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
-import { surfaceSelectionLayout } from '../../types/interfaces';
+import { selectableSurfaceLayout } from '../../types/interfaces';
 
 /** Fulfillment tile header component */
 
@@ -12,7 +12,7 @@ const style = useCssModule();
 const baseClass = 'cdr-fulfillment-tile-header';
 
 const rootProps = computed(
-  (): surfaceSelectionLayout => ({
+  (): selectableSurfaceLayout => ({
     orientation: 'horizontal',
     class: { [style[baseClass]]: true },
   }),
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
index c12be1bc4..9ac52df63 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import { surfaceSelectionLayout } from '../../types/interfaces';
+import { selectableSurfaceLayout } from '../../types/interfaces';
 
 /** Component for layout of a surface selection */
 
 defineOptions({ name: 'CdrFulfillmentTileLayout' });
 
-const props = withDefaults(defineProps<surfaceSelectionLayout>(), {
+const props = withDefaults(defineProps<selectableSurfaceLayout>(), {
   orientation: 'horizontal',
 });
 
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 8896523be..3c1867e1a 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -6,7 +6,7 @@ import CdrFulfillmentTileContent from '../CdrFulfillmentTileContent.vue';
 import { IconCheckFill, IconErrorFill, IconXFill } from '../../icon';
 import CdrButton from '../../button/CdrButton.vue';
 import CdrSurface from '../../surface/CdrSurface.vue';
-import CdrSurfaceSelection from '../../surfaceSelection/CdrSurfaceSelection.vue';
+import CdrSelectableSurface from '../../selectableSurface/CdrSelectableSurface.vue';
 import CdrFulfillmentTileIcon from '../CdrFulfillmentTileIcon.vue';
 
 defineOptions({ name: 'FulfillmentTile' });
@@ -247,7 +247,7 @@ const toggleCheckbox2 = (value: number) => {
         :data-store-checked="checkbox2.includes(1)"
         radius="softer"
       >
-        <CdrSurfaceSelection
+        <CdrSelectableSurface
           class="example__search-tile-other-header-button"
           :checked="checkbox2.includes(1)"
           role="checkbox"
@@ -265,7 +265,7 @@ const toggleCheckbox2 = (value: number) => {
             In stock at
             <strong>Encinitas</strong>
           </CdrFulfillmentTileContent>
-        </CdrSurfaceSelection>
+        </CdrSelectableSurface>
         <hr class="example__search-tile-other-header-hr" />
         <CdrButton
           class="example__change-store-other"
@@ -283,7 +283,7 @@ const toggleCheckbox2 = (value: number) => {
 <style lang="scss" scoped>
 @import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
 @import '../styles/vars/CdrFulfillmentTile.vars.scss';
-@import '../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
+@import '../../selectableSurface/styles/vars/CdrSelectableSurface.vars.scss';
 
 $component: 'fulfillment-tile';
 
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
index c088da5cd..7d892f172 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
@@ -1,4 +1,4 @@
-@import '../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
+@import '../../selectableSurface/styles/vars/CdrSelectableSurface.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 @import './vars/CdrFulfillmentTile.vars.scss';
 
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
index b0cac0f28..1669141dd 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
@@ -1,4 +1,4 @@
-@import '../../surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss';
+@import '../../selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
 .cdr-fulfillment-tile-layout {
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index 4f417e12e..d41824823 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -1,6 +1,6 @@
 @use 'sass:map';
 @import '../../../../styles/settings/index.scss';
-@import '../../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
+@import '../../../selectableSurface/styles/vars/CdrSelectableSurface.vars.scss';
 
 $fulfillment-tile-component: 'fulfillment-tile';
 $fulfillment-tile-background-colors: $surface-selection-background-colors;
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/selectableSurface/CdrSelectableSurface.vue
similarity index 67%
rename from src/components/surfaceSelection/CdrSurfaceSelection.vue
rename to src/components/selectableSurface/CdrSelectableSurface.vue
index dbdce0a7f..21e556529 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/selectableSurface/CdrSelectableSurface.vue
@@ -3,15 +3,15 @@ import { useCssModule, computed } from 'vue';
 import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
 import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 import mapClasses from '../../utils/mapClasses';
-import { surfaceSelection } from '../../types/interfaces';
-import { getSurfaceSelectionProps } from '../../utils/surface';
-import CdrSurfaceSelectionLayout from './CdrSurfaceSelectionLayout.vue';
+import { selectableSurface } from '../../types/interfaces';
+import { getSelectableSurfaceProps } from '../../utils/surface';
+import CdrSelectableSurfaceLayout from './CdrSelectableSurfaceLayout.vue';
 
-/** Component for buttons that have a checked state. */
+/** Base component for buttons that have a checked state */
 
-defineOptions({ name: 'CdrSurfaceSelection' });
+defineOptions({ name: 'CdrSelectableSurface' });
 
-const props = withDefaults(defineProps<surfaceSelection>(), {
+const props = withDefaults(defineProps<selectableSurface>(), {
   shadow: undefined,
   tag: 'button',
   role: 'radio',
@@ -27,7 +27,7 @@ const baseClass = 'cdr-surface-selection';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { classes, ...additionalProps } = getSurfaceSelectionProps(props, baseClass);
+  const { classes, ...additionalProps } = getSelectableSurfaceProps(props, baseClass);
   return { ...additionalProps, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
@@ -38,13 +38,13 @@ const rootProps = computed(() => {
     v-bind="rootProps"
   >
     <div :class="style['cdr-surface-selection__inner']">
-      <CdrSurfaceSelectionLayout
+      <CdrSelectableSurfaceLayout
         :orientation="orientation"
         :class="style['cdr-surface-selection__layout']"
       >
         <!-- @slot Where all default content should be placed. -->
         <slot />
-      </CdrSurfaceSelectionLayout>
+      </CdrSelectableSurfaceLayout>
       <div :class="style['cdr-surface-selection__loading']">
         <!-- @slot This slot allows for custom loading content. -->
         <slot name="loading">
@@ -57,4 +57,4 @@ const rootProps = computed(() => {
   </component>
 </template>
 
-<style lang="scss" module src="./styles/CdrSurfaceSelection.module.scss"></style>
+<style lang="scss" module src="./styles/CdrSelectableSurface.module.scss"></style>
diff --git a/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue b/src/components/selectableSurface/CdrSelectableSurfaceLayout.vue
similarity index 72%
rename from src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
rename to src/components/selectableSurface/CdrSelectableSurfaceLayout.vue
index a6b170799..f87a507c6 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
+++ b/src/components/selectableSurface/CdrSelectableSurfaceLayout.vue
@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import { surfaceSelectionLayout } from '../../types/interfaces';
+import { selectableSurfaceLayout } from '../../types/interfaces';
 
 /** Component for layout of a surface selection */
 
-defineOptions({ name: 'CdrSurfaceSelectionLayout' });
+defineOptions({ name: 'CdrSelectableSurfaceLayout' });
 
-const props = withDefaults(defineProps<surfaceSelectionLayout>(), {
+const props = withDefaults(defineProps<selectableSurfaceLayout>(), {
   orientation: 'horizontal',
 });
 
@@ -34,4 +34,4 @@ const rootProps = computed(() => {
   </div>
 </template>
 
-<style lang="scss" module src="./styles/CdrSurfaceSelectionLayout.module.scss"></style>
+<style lang="scss" module src="./styles/CdrSelectableSurfaceLayout.module.scss"></style>
diff --git a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js b/src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js
similarity index 80%
rename from src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
rename to src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js
index dc8627d18..f0f39cd04 100644
--- a/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
+++ b/src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js
@@ -1,11 +1,11 @@
 import { mount } from '../../../../test/vue-jest-style-workaround.js';
-import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
+import CdrSelectableSurface from '../CdrSelectableSurface.vue';
 
-describe('CdrSurfaceSelection', () => {
+describe('CdrSelectableSurface', () => {
   describe('snapshot test', () => {
     let wrapper;
     beforeEach(() => {
-      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
+      wrapper = mount(CdrSelectableSurface, { props: { checked: false } });
     });
     it('renders correctly', () => {
       expect(wrapper.element).toMatchSnapshot();
@@ -15,7 +15,7 @@ describe('CdrSurfaceSelection', () => {
   describe('component unit tests', () => {
     let wrapper;
     beforeEach(() => {
-      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
+      wrapper = mount(CdrSelectableSurface, { props: { checked: false } });
     });
 
     describe('default component with no configuration', () => {
@@ -35,7 +35,7 @@ describe('CdrSurfaceSelection', () => {
   });
 
   it('shows default', () => {
-    const wrapper = mount(CdrSurfaceSelection, {
+    const wrapper = mount(CdrSelectableSurface, {
       props: { checked: false },
       slots: { default: 'Default slot' },
     });
@@ -44,7 +44,7 @@ describe('CdrSurfaceSelection', () => {
   });
 
   it('is loading', () => {
-    const wrapper = mount(CdrSurfaceSelection, {
+    const wrapper = mount(CdrSelectableSurface, {
       props: { checked: false, loading: true },
       slots: { default: 'Default slot' },
     });
@@ -53,7 +53,7 @@ describe('CdrSurfaceSelection', () => {
   });
 
   it('is not loading', () => {
-    const wrapper = mount(CdrSurfaceSelection, {
+    const wrapper = mount(CdrSelectableSurface, {
       props: { checked: false, loading: false },
       slots: { default: 'Default slot' },
     });
@@ -61,7 +61,7 @@ describe('CdrSurfaceSelection', () => {
   });
 
   it('is checked', () => {
-    const wrapper = mount(CdrSurfaceSelection, {
+    const wrapper = mount(CdrSelectableSurface, {
       props: { checked: true },
       slots: { default: 'Default slot' },
     });
diff --git a/src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js b/src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js
similarity index 67%
rename from src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js
rename to src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js
index 73bf5772e..7ec507c71 100644
--- a/src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js
+++ b/src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js
@@ -1,11 +1,11 @@
 import { mount } from '../../../../test/vue-jest-style-workaround.js';
-import CdrSurfaceSelectionLayout from '../CdrSurfaceSelectionLayout.vue';
+import CdrSelectableSurfaceLayout from '../CdrSelectableSurfaceLayout.vue';
 
-describe('CdrSurfaceSelectionLayout', () => {
+describe('CdrSelectableSurfaceLayout', () => {
   describe('snapshot test', () => {
     let wrapper;
     beforeEach(() => {
-      wrapper = mount(CdrSurfaceSelectionLayout, { props: { orientation: 'horizontal' } });
+      wrapper = mount(CdrSelectableSurfaceLayout, { props: { orientation: 'horizontal' } });
     });
 
     it('renders correctly', () => {
@@ -15,7 +15,7 @@ describe('CdrSurfaceSelectionLayout', () => {
 
   describe('orientation test', () => {
     it('shows horizontal', () => {
-      const wrapper = mount(CdrSurfaceSelectionLayout, { props: { orientation: 'horizontal' } });
+      const wrapper = mount(CdrSelectableSurfaceLayout, { props: { orientation: 'horizontal' } });
       expect(wrapper.element).toMatchSnapshot();
       expect(wrapper.classes()).toEqual([
         'cdr-surface-selection-layout',
@@ -24,7 +24,7 @@ describe('CdrSurfaceSelectionLayout', () => {
     });
 
     it('shows vertical', () => {
-      const wrapper = mount(CdrSurfaceSelectionLayout, { props: { orientation: 'vertical' } });
+      const wrapper = mount(CdrSelectableSurfaceLayout, { props: { orientation: 'vertical' } });
       expect(wrapper.element).toMatchSnapshot();
       expect(wrapper.classes()).toEqual([
         'cdr-surface-selection-layout',
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap b/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap
similarity index 93%
rename from src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
rename to src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap
index d73fd1e2f..1ef8e950b 100644
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
+++ b/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap
@@ -1,6 +1,6 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
+exports[`CdrSelectableSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
 <button
   aria-checked="false"
   class="cdr-surface-selection cdr-surface-selection--modifier-default"
@@ -44,7 +44,7 @@ exports[`CdrSurfaceSelection > component unit tests > default component with no
 </button>
 `;
 
-exports[`CdrSurfaceSelection > is checked 1`] = `
+exports[`CdrSelectableSurface > is checked 1`] = `
 <button
   aria-checked="true"
   class="cdr-surface-selection cdr-surface-selection--modifier-default"
@@ -92,7 +92,7 @@ exports[`CdrSurfaceSelection > is checked 1`] = `
 </button>
 `;
 
-exports[`CdrSurfaceSelection > is loading 1`] = `
+exports[`CdrSelectableSurface > is loading 1`] = `
 <button
   aria-checked="false"
   class="cdr-surface-selection cdr-surface-selection--modifier-default"
@@ -141,7 +141,7 @@ exports[`CdrSurfaceSelection > is loading 1`] = `
 </button>
 `;
 
-exports[`CdrSurfaceSelection > shows default 1`] = `
+exports[`CdrSelectableSurface > shows default 1`] = `
 <button
   aria-checked="false"
   class="cdr-surface-selection cdr-surface-selection--modifier-default"
@@ -189,7 +189,7 @@ exports[`CdrSurfaceSelection > shows default 1`] = `
 </button>
 `;
 
-exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
+exports[`CdrSelectableSurface > snapshot test > renders correctly 1`] = `
 <button
   aria-checked="false"
   class="cdr-surface-selection cdr-surface-selection--modifier-default"
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap b/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap
similarity index 74%
rename from src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
rename to src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap
index 68d749481..687be423c 100644
--- a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
+++ b/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap
@@ -1,6 +1,6 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`CdrSurfaceSelectionLayout > orientation test > shows horizontal 1`] = `
+exports[`CdrSelectableSurfaceLayout > orientation test > shows horizontal 1`] = `
 <div
   class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
 >
@@ -11,7 +11,7 @@ exports[`CdrSurfaceSelectionLayout > orientation test > shows horizontal 1`] = `
 </div>
 `;
 
-exports[`CdrSurfaceSelectionLayout > orientation test > shows vertical 1`] = `
+exports[`CdrSelectableSurfaceLayout > orientation test > shows vertical 1`] = `
 <div
   class="cdr-surface-selection-layout cdr-surface-selection-layout--vertical"
 >
@@ -22,7 +22,7 @@ exports[`CdrSurfaceSelectionLayout > orientation test > shows vertical 1`] = `
 </div>
 `;
 
-exports[`CdrSurfaceSelectionLayout > snapshot test > renders correctly 1`] = `
+exports[`CdrSelectableSurfaceLayout > snapshot test > renders correctly 1`] = `
 <div
   class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
 >
diff --git a/src/components/surfaceSelection/examples/SurfaceSelection.vue b/src/components/selectableSurface/examples/SelectableSurface.vue
similarity index 70%
rename from src/components/surfaceSelection/examples/SurfaceSelection.vue
rename to src/components/selectableSurface/examples/SelectableSurface.vue
index 64f763f51..ace60fb9b 100644
--- a/src/components/surfaceSelection/examples/SurfaceSelection.vue
+++ b/src/components/selectableSurface/examples/SelectableSurface.vue
@@ -1,16 +1,16 @@
 <script setup lang="ts">
 import { ref, computed } from 'vue';
-import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
-import type { surfaceSelection } from '../../../types/interfaces';
+import CdrSelectableSurface from '../CdrSelectableSurface.vue';
+import type { selectableSurface } from '../../../types/interfaces';
 import CdrSwitch from '../../switch/CdrSwitch.vue';
 
-defineOptions({ name: 'SurfaceSelection' });
+defineOptions({ name: 'SelectableSurface' });
 
 const loading = ref(false);
 
 const examples = computed(
   () =>
-    <surfaceSelection[]>[
+    <selectableSurface[]>[
       { checked: false, role: 'checkbox', loading: loading.value },
       { checked: true, role: 'checkbox', loading: loading.value },
       { checked: false, role: 'checkbox', loading: !loading.value },
@@ -40,7 +40,7 @@ const examples = computed(
 
 <template>
   <div class="example">
-    <h2>SurfaceSelection</h2>
+    <h2>SelectableSurface</h2>
     <hr class="example__hr" />
     <div class="example__options">
       <CdrSwitch
@@ -52,29 +52,29 @@ const examples = computed(
     </div>
     <hr class="example__hr" />
     <div class="example__demos">
-      <CdrSurfaceSelection v-bind="examples[0]">This is default</CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="examples[1]">This is checked</CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="examples[2]">This is loading</CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="examples[3]">This is disabled</CdrSurfaceSelection>
+      <CdrSelectableSurface v-bind="examples[0]">This is default</CdrSelectableSurface>
+      <CdrSelectableSurface v-bind="examples[1]">This is checked</CdrSelectableSurface>
+      <CdrSelectableSurface v-bind="examples[2]">This is loading</CdrSelectableSurface>
+      <CdrSelectableSurface v-bind="examples[3]">This is disabled</CdrSelectableSurface>
     </div>
     <hr class="example__hr" />
     <div class="example__demos2">
-      <CdrSurfaceSelection v-bind="examples[4]">
+      <CdrSelectableSurface v-bind="examples[4]">
         Custom loading
         <template #loading>...</template>
-      </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="examples[5]">
+      </CdrSelectableSurface>
+      <CdrSelectableSurface v-bind="examples[5]">
         <div>Auto</div>
         <div>Auto</div>
-      </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="examples[6]">
+      </CdrSelectableSurface>
+      <CdrSelectableSurface v-bind="examples[6]">
         <div>Auto</div>
         <div class="example__100">100%</div>
-      </CdrSurfaceSelection>
-      <CdrSurfaceSelection v-bind="examples[7]">
+      </CdrSelectableSurface>
+      <CdrSelectableSurface v-bind="examples[7]">
         <div>orientation</div>
         <div>vertical</div>
-      </CdrSurfaceSelection>
+      </CdrSelectableSurface>
     </div>
   </div>
 </template>
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss b/src/components/selectableSurface/styles/CdrSelectableSurface.module.scss
similarity index 91%
rename from src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
rename to src/components/selectableSurface/styles/CdrSelectableSurface.module.scss
index 27e1c21ce..f990f1b80 100644
--- a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
+++ b/src/components/selectableSurface/styles/CdrSelectableSurface.module.scss
@@ -1,4 +1,4 @@
-@import './vars/CdrSurfaceSelection.vars.scss';
+@import './vars/CdrSelectableSurface.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
 .cdr-surface-selection {
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss b/src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss
similarity index 72%
rename from src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss
rename to src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss
index 242582f0c..5fed63d09 100644
--- a/src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss
+++ b/src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss
@@ -1,4 +1,4 @@
-@import './vars/CdrSurfaceSelectionLayout.vars.scss';
+@import './vars/CdrSelectableSurfaceLayout.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
 .cdr-surface-selection-layout {
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss b/src/components/selectableSurface/styles/vars/CdrSelectableSurface.vars.scss
similarity index 100%
rename from src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
rename to src/components/selectableSurface/styles/vars/CdrSelectableSurface.vars.scss
diff --git a/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss b/src/components/selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss
similarity index 100%
rename from src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss
rename to src/components/selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss
diff --git a/src/dev/router.js b/src/dev/router.js
index 7622e57c3..909750ce4 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -54,7 +54,7 @@ const routes = [
   { path: '/skeleton', name: 'Skeleton', component: Examples.skeleton },
   { path: '/split-surface', name: 'Split Surface', component: Examples.splitSurface },
   { path: '/surface', name: 'Surface', component: Examples.surface },
-  { path: '/surfaceSelection', name: 'SurfaceSelection', component: Examples.surfaceSelection },
+  { path: '/selectableSurface', name: 'SelectableSurface', component: Examples.selectableSurface },
   { path: '/tables', name: 'Tables', component: Examples.tables },
   { path: '/tabs', name: 'Tabs', component: Examples.tabs },
   { path: '/texts', name: 'Texts', component: Examples.texts },
diff --git a/src/lib.ts b/src/lib.ts
index 04120c1ee..14f92c769 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -38,8 +38,8 @@ export { default as CdrSkeleton } from './components/skeleton/CdrSkeleton.vue';
 export { default as CdrSkeletonBone } from './components/skeleton/CdrSkeletonBone.vue';
 export { default as CdrSplitSurface } from './components/splitSurface/CdrSplitSurface.vue';
 export { default as CdrSurface } from './components/surface/CdrSurface.vue';
-export { default as CdrSurfaceSelection } from './components/surfaceSelection/CdrSurfaceSelection.vue';
-export { default as CdrSurfaceSelectionLayout } from './components/surfaceSelection/CdrSurfaceSelectionLayout.vue';
+export { default as CdrSelectableSurface } from './components/selectableSurface/CdrSelectableSurface.vue';
+export { default as CdrSelectableSurfaceLayout } from './components/selectableSurface/CdrSelectableSurfaceLayout.vue';
 export { default as CdrTable } from './components/table/CdrTable.vue';
 export { default as CdrTabPanel } from './components/tabs/CdrTabPanel.vue';
 export { default as CdrTabs } from './components/tabs/CdrTabs.vue';
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 8852b9e31..6906c837d 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -205,7 +205,7 @@ export interface surface extends HtmlAttributes {
   withBorder?: boolean;
 }
 
-export interface surfaceSelection extends HtmlAttributes {
+export interface selectableSurface extends HtmlAttributes {
   /**
    * Determines if the button is in a checked state. Adds an `aria-checked` attribute to the button.
    */
@@ -244,7 +244,7 @@ export interface surfaceSelection extends HtmlAttributes {
   tag?: Tag;
 }
 
-export interface surfaceSelectionLayout extends HtmlAttributes {
+export interface selectableSurfaceLayout extends HtmlAttributes {
   /**
    * Determines if the layout is in horizontal or vertical mode.
    * @values horizontal, vertical
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index 7beaea848..cb902433a 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -1,4 +1,4 @@
-import type { surface, surfaceSelection, HtmlAttributes } from '../types/interfaces';
+import type { surface, selectableSurface, HtmlAttributes } from '../types/interfaces';
 
 // Manages the props passed along to all surfaces
 export const getSurfaceProps = (props: surface, baseClass: string) => {
@@ -45,7 +45,7 @@ export const getSurfaceProps = (props: surface, baseClass: string) => {
   return { classes };
 };
 
-export const getSurfaceSelectionProps = (props: surfaceSelection, baseClass: string) => {
+export const getSelectableSurfaceProps = (props: selectableSurface, baseClass: string) => {
   const { classes } = getSurfaceProps(props, baseClass);
   const { checked, loading, disabled, ...otherProps } = props;
   const additionalProps: HtmlAttributes = { ...otherProps };

From 9e58bbd09a9d27a6c73851c3d4e3e13e1aea197d Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 9 Sep 2024 15:15:33 -0700
Subject: [PATCH 58/70] name change to selectable surface

---
 package-lock.json                             |  2 +-
 .../examples/FulfillmentTile.vue              | 12 ++--
 .../styles/CdrFulfillmentTile.module.scss     |  4 +-
 .../CdrFulfillmentTileLayout.module.scss      |  2 +-
 .../styles/vars/CdrFulfillmentTile.vars.scss  |  8 +--
 .../CdrSelectableSurface.vue                  |  8 +--
 .../CdrSelectableSurfaceLayout.vue            |  2 +-
 .../__tests__/CdrSelectableSurface.spec.js    | 12 ++--
 .../CdrSelectableSurfaceLayout.spec.js        |  8 +--
 .../CdrSelectableSurface.spec.js.snap         | 40 +++++------
 .../CdrSelectableSurfaceLayout.spec.js.snap   |  6 +-
 .../styles/CdrSelectableSurface.module.scss   | 20 +++---
 .../CdrSelectableSurfaceLayout.module.scss    |  4 +-
 .../vars/CdrSelectableSurface.vars.scss       | 68 +++++++++----------
 .../vars/CdrSelectableSurfaceLayout.vars.scss |  2 +-
 15 files changed, 99 insertions(+), 99 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 012e2c1f3..6f09c7e9a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3066,7 +3066,7 @@
     },
     "node_modules/@rei/cdr-tokens": {
       "version": "12.3.0",
-      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#a9caf6fb557ec10ccc2c9b549ffdbef815346c7e",
+      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#43dbc7e17ba78cde6fa5ee1dfc01db7cad8f7719",
       "dev": true,
       "license": "ISC",
       "engines": {
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index 3c1867e1a..fb97f5d76 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -340,8 +340,8 @@ $component: 'fulfillment-tile';
 
   &__checkout-tile-other-disabled {
     --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-    #{--cdr-color-background-fulfillment-tile}: $cdr-color-background-surface-selection-default-disabled;
-    #{--cdr-color-background-fulfillment-tile-checked}: $cdr-color-background-surface-selection-default-disabled;
+    #{--cdr-color-background-fulfillment-tile}: $cdr-color-background-selectable-surface-default-disabled;
+    #{--cdr-color-background-fulfillment-tile-checked}: $cdr-color-background-selectable-surface-default-disabled;
     @include cdr-border-style-mixin($component, 'dashed');
   }
 
@@ -366,12 +366,12 @@ $component: 'fulfillment-tile';
   }
 
   &__search-tile-other-header-button {
-    --cdr-surface-selection-border-width-default: 0;
-    --cdr-color-background-surface-selection-checked: var(--cdr-color-background-primary);
+    --cdr-selectable-surface-border-width-default: 0;
+    --cdr-color-background-selectable-surface-checked: var(--cdr-color-background-primary);
     width: 100%;
 
-    @include cdr-surface-selection-checked-mixin() {
-      --cdr-surface-selection-border-width-default: 0;
+    @include cdr-selectable-surface-checked-mixin() {
+      --cdr-selectable-surface-border-width-default: 0;
     }
   }
 
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
index 7d892f172..41a1f1876 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
@@ -8,8 +8,8 @@
     $fulfillment-tile-border-colors,
     $fulfillment-tile-component
   );
-  @include cdr-surface-selection-base-mixin($fulfillment-tile-component);
-  @include cdr-surface-selection-states-mixin(
+  @include cdr-selectable-surface-base-mixin($fulfillment-tile-component);
+  @include cdr-selectable-surface-states-mixin(
     $fulfillment-tile-background-colors,
     $fulfillment-tile-border-colors,
     $fulfillment-tile-component
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
index 1669141dd..186cdca8b 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
@@ -2,5 +2,5 @@
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
 .cdr-fulfillment-tile-layout {
-  @include cdr-surface-selection-layout-base-mixin();
+  @include cdr-selectable-surface-layout-base-mixin();
 }
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index d41824823..accc3e4e1 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -3,19 +3,19 @@
 @import '../../../selectableSurface/styles/vars/CdrSelectableSurface.vars.scss';
 
 $fulfillment-tile-component: 'fulfillment-tile';
-$fulfillment-tile-background-colors: $surface-selection-background-colors;
-$fulfillment-tile-border-colors: $surface-selection-border-colors;
+$fulfillment-tile-background-colors: $selectable-surface-background-colors;
+$fulfillment-tile-border-colors: $selectable-surface-border-colors;
 
 @mixin cdr-fulfillment-tile-base-mixin() {
   // Create tokens for background color
-  @each $modifier, $states in $surface-selection-background-colors {
+  @each $modifier, $states in $selectable-surface-background-colors {
     @each $state, $value in $states {
       --cdr-color-background-fulfillment-tile-#{$modifier}-#{$state}: #{$value};
     }
   }
 
   // Create tokens for border color
-  @each $modifier, $states in $surface-selection-border-colors {
+  @each $modifier, $states in $selectable-surface-border-colors {
     @each $state, $value in $states {
       --cdr-color-border-fulfillment-tile-#{$modifier}-#{$state}: #{$value};
     }
diff --git a/src/components/selectableSurface/CdrSelectableSurface.vue b/src/components/selectableSurface/CdrSelectableSurface.vue
index 21e556529..4624ad702 100644
--- a/src/components/selectableSurface/CdrSelectableSurface.vue
+++ b/src/components/selectableSurface/CdrSelectableSurface.vue
@@ -23,7 +23,7 @@ const props = withDefaults(defineProps<selectableSurface>(), {
 });
 
 const style = useCssModule();
-const baseClass = 'cdr-surface-selection';
+const baseClass = 'cdr-selectable-surface';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
@@ -37,15 +37,15 @@ const rootProps = computed(() => {
     :is="tag"
     v-bind="rootProps"
   >
-    <div :class="style['cdr-surface-selection__inner']">
+    <div :class="style['cdr-selectable-surface__inner']">
       <CdrSelectableSurfaceLayout
         :orientation="orientation"
-        :class="style['cdr-surface-selection__layout']"
+        :class="style['cdr-selectable-surface__layout']"
       >
         <!-- @slot Where all default content should be placed. -->
         <slot />
       </CdrSelectableSurfaceLayout>
-      <div :class="style['cdr-surface-selection__loading']">
+      <div :class="style['cdr-selectable-surface__loading']">
         <!-- @slot This slot allows for custom loading content. -->
         <slot name="loading">
           <CdrSkeleton>
diff --git a/src/components/selectableSurface/CdrSelectableSurfaceLayout.vue b/src/components/selectableSurface/CdrSelectableSurfaceLayout.vue
index f87a507c6..3eb7b30b0 100644
--- a/src/components/selectableSurface/CdrSelectableSurfaceLayout.vue
+++ b/src/components/selectableSurface/CdrSelectableSurfaceLayout.vue
@@ -12,7 +12,7 @@ const props = withDefaults(defineProps<selectableSurfaceLayout>(), {
 });
 
 const style = useCssModule();
-const baseClass = 'cdr-surface-selection-layout';
+const baseClass = 'cdr-selectable-surface-layout';
 
 // Manages the props passed along to root
 const rootProps = computed(() => {
diff --git a/src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js b/src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js
index f0f39cd04..b403845ab 100644
--- a/src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js
+++ b/src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js
@@ -27,8 +27,8 @@ describe('CdrSelectableSurface', () => {
       });
       it('base classes only', () => {
         expect(wrapper.classes()).toEqual([
-          'cdr-surface-selection',
-          'cdr-surface-selection--modifier-default',
+          'cdr-selectable-surface',
+          'cdr-selectable-surface--modifier-default',
         ]);
       });
     });
@@ -39,7 +39,7 @@ describe('CdrSelectableSurface', () => {
       props: { checked: false },
       slots: { default: 'Default slot' },
     });
-    expect(wrapper.find('.cdr-surface-selection').text()).toBe('Default slot');
+    expect(wrapper.find('.cdr-selectable-surface').text()).toBe('Default slot');
     expect(wrapper.element).toMatchSnapshot();
   });
 
@@ -49,7 +49,7 @@ describe('CdrSelectableSurface', () => {
       slots: { default: 'Default slot' },
     });
     expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find('.cdr-surface-selection').attributes('data-loading')).toBe('true');
+    expect(wrapper.find('.cdr-selectable-surface').attributes('data-loading')).toBe('true');
   });
 
   it('is not loading', () => {
@@ -57,7 +57,7 @@ describe('CdrSelectableSurface', () => {
       props: { checked: false, loading: false },
       slots: { default: 'Default slot' },
     });
-    expect(wrapper.find('.cdr-surface-selection').attributes('data-loading')).toBe(undefined);
+    expect(wrapper.find('.cdr-selectable-surface').attributes('data-loading')).toBe(undefined);
   });
 
   it('is checked', () => {
@@ -66,6 +66,6 @@ describe('CdrSelectableSurface', () => {
       slots: { default: 'Default slot' },
     });
     expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find('.cdr-surface-selection').attributes('aria-checked')).toBe('true');
+    expect(wrapper.find('.cdr-selectable-surface').attributes('aria-checked')).toBe('true');
   });
 });
diff --git a/src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js b/src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js
index 7ec507c71..b3b7c0338 100644
--- a/src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js
+++ b/src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js
@@ -18,8 +18,8 @@ describe('CdrSelectableSurfaceLayout', () => {
       const wrapper = mount(CdrSelectableSurfaceLayout, { props: { orientation: 'horizontal' } });
       expect(wrapper.element).toMatchSnapshot();
       expect(wrapper.classes()).toEqual([
-        'cdr-surface-selection-layout',
-        'cdr-surface-selection-layout--horizontal',
+        'cdr-selectable-surface-layout',
+        'cdr-selectable-surface-layout--horizontal',
       ]);
     });
 
@@ -27,8 +27,8 @@ describe('CdrSelectableSurfaceLayout', () => {
       const wrapper = mount(CdrSelectableSurfaceLayout, { props: { orientation: 'vertical' } });
       expect(wrapper.element).toMatchSnapshot();
       expect(wrapper.classes()).toEqual([
-        'cdr-surface-selection-layout',
-        'cdr-surface-selection-layout--vertical',
+        'cdr-selectable-surface-layout',
+        'cdr-selectable-surface-layout--vertical',
       ]);
     });
   });
diff --git a/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap b/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap
index 1ef8e950b..03e3de15b 100644
--- a/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap
+++ b/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap
@@ -3,7 +3,7 @@
 exports[`CdrSelectableSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-default"
+  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
   modifier="default"
   orientation="horizontal"
   role="radio"
@@ -11,10 +11,10 @@ exports[`CdrSelectableSurface > component unit tests > default component with no
   type="button"
 >
   <div
-    class="cdr-surface-selection__inner"
+    class="cdr-selectable-surface__inner"
   >
     <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -22,7 +22,7 @@ exports[`CdrSelectableSurface > component unit tests > default component with no
       
     </div>
     <div
-      class="cdr-surface-selection__loading"
+      class="cdr-selectable-surface__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
@@ -47,7 +47,7 @@ exports[`CdrSelectableSurface > component unit tests > default component with no
 exports[`CdrSelectableSurface > is checked 1`] = `
 <button
   aria-checked="true"
-  class="cdr-surface-selection cdr-surface-selection--modifier-default"
+  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
   modifier="default"
   orientation="horizontal"
   role="radio"
@@ -55,10 +55,10 @@ exports[`CdrSelectableSurface > is checked 1`] = `
   type="button"
 >
   <div
-    class="cdr-surface-selection__inner"
+    class="cdr-selectable-surface__inner"
   >
     <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -70,7 +70,7 @@ exports[`CdrSelectableSurface > is checked 1`] = `
       
     </div>
     <div
-      class="cdr-surface-selection__loading"
+      class="cdr-selectable-surface__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
@@ -95,7 +95,7 @@ exports[`CdrSelectableSurface > is checked 1`] = `
 exports[`CdrSelectableSurface > is loading 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-default"
+  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
   data-loading="true"
   modifier="default"
   orientation="horizontal"
@@ -104,10 +104,10 @@ exports[`CdrSelectableSurface > is loading 1`] = `
   type="button"
 >
   <div
-    class="cdr-surface-selection__inner"
+    class="cdr-selectable-surface__inner"
   >
     <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -119,7 +119,7 @@ exports[`CdrSelectableSurface > is loading 1`] = `
       
     </div>
     <div
-      class="cdr-surface-selection__loading"
+      class="cdr-selectable-surface__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
@@ -144,7 +144,7 @@ exports[`CdrSelectableSurface > is loading 1`] = `
 exports[`CdrSelectableSurface > shows default 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-default"
+  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
   modifier="default"
   orientation="horizontal"
   role="radio"
@@ -152,10 +152,10 @@ exports[`CdrSelectableSurface > shows default 1`] = `
   type="button"
 >
   <div
-    class="cdr-surface-selection__inner"
+    class="cdr-selectable-surface__inner"
   >
     <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -167,7 +167,7 @@ exports[`CdrSelectableSurface > shows default 1`] = `
       
     </div>
     <div
-      class="cdr-surface-selection__loading"
+      class="cdr-selectable-surface__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
@@ -192,7 +192,7 @@ exports[`CdrSelectableSurface > shows default 1`] = `
 exports[`CdrSelectableSurface > snapshot test > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-surface-selection cdr-surface-selection--modifier-default"
+  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
   modifier="default"
   orientation="horizontal"
   role="radio"
@@ -200,10 +200,10 @@ exports[`CdrSelectableSurface > snapshot test > renders correctly 1`] = `
   type="button"
 >
   <div
-    class="cdr-surface-selection__inner"
+    class="cdr-selectable-surface__inner"
   >
     <div
-      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
+      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -211,7 +211,7 @@ exports[`CdrSelectableSurface > snapshot test > renders correctly 1`] = `
       
     </div>
     <div
-      class="cdr-surface-selection__loading"
+      class="cdr-selectable-surface__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
diff --git a/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap b/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap
index 687be423c..7b6eb1f6f 100644
--- a/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap
+++ b/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap
@@ -2,7 +2,7 @@
 
 exports[`CdrSelectableSurfaceLayout > orientation test > shows horizontal 1`] = `
 <div
-  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+  class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal"
 >
   <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -13,7 +13,7 @@ exports[`CdrSelectableSurfaceLayout > orientation test > shows horizontal 1`] =
 
 exports[`CdrSelectableSurfaceLayout > orientation test > shows vertical 1`] = `
 <div
-  class="cdr-surface-selection-layout cdr-surface-selection-layout--vertical"
+  class="cdr-selectable-surface-layout cdr-selectable-surface-layout--vertical"
 >
   <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -24,7 +24,7 @@ exports[`CdrSelectableSurfaceLayout > orientation test > shows vertical 1`] = `
 
 exports[`CdrSelectableSurfaceLayout > snapshot test > renders correctly 1`] = `
 <div
-  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+  class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal"
 >
   <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
diff --git a/src/components/selectableSurface/styles/CdrSelectableSurface.module.scss b/src/components/selectableSurface/styles/CdrSelectableSurface.module.scss
index f990f1b80..9cad2a0dc 100644
--- a/src/components/selectableSurface/styles/CdrSelectableSurface.module.scss
+++ b/src/components/selectableSurface/styles/CdrSelectableSurface.module.scss
@@ -1,17 +1,17 @@
 @import './vars/CdrSelectableSurface.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
-.cdr-surface-selection {
+.cdr-selectable-surface {
   @include cdr-surface-base-mixin(
-    $surface-selection-background-colors,
-    $surface-selection-border-colors,
-    $surface-selection-component
+    $selectable-surface-background-colors,
+    $selectable-surface-border-colors,
+    $selectable-surface-component
   );
-  @include cdr-surface-selection-base-mixin($surface-selection-component);
-  @include cdr-surface-selection-states-modifiers-mixin(
-    $surface-selection-background-colors,
-    $surface-selection-border-colors,
-    $surface-selection-component,
-    $surface-selection-modifiers
+  @include cdr-selectable-surface-base-mixin($selectable-surface-component);
+  @include cdr-selectable-surface-states-modifiers-mixin(
+    $selectable-surface-background-colors,
+    $selectable-surface-border-colors,
+    $selectable-surface-component,
+    $selectable-surface-modifiers
   );
 }
diff --git a/src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss b/src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss
index 5fed63d09..7dda970e6 100644
--- a/src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss
+++ b/src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss
@@ -1,6 +1,6 @@
 @import './vars/CdrSelectableSurfaceLayout.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
-.cdr-surface-selection-layout {
-  @include cdr-surface-selection-layout-base-mixin();
+.cdr-selectable-surface-layout {
+  @include cdr-selectable-surface-layout-base-mixin();
 }
diff --git a/src/components/selectableSurface/styles/vars/CdrSelectableSurface.vars.scss b/src/components/selectableSurface/styles/vars/CdrSelectableSurface.vars.scss
index c66cb617d..fcb74c885 100644
--- a/src/components/selectableSurface/styles/vars/CdrSelectableSurface.vars.scss
+++ b/src/components/selectableSurface/styles/vars/CdrSelectableSurface.vars.scss
@@ -1,29 +1,29 @@
 @import '../../../../styles/settings/index.scss';
 
-$surface-selection-component: 'surface-selection';
-$surface-selection-modifiers: 'default';
-$surface-selection-background-colors: (
+$selectable-surface-component: 'surface-selection';
+$selectable-surface-modifiers: 'default';
+$selectable-surface-background-colors: (
   'default': (
-    'rest': $cdr-color-background-surface-selection-default-rest,
-    'hover': $cdr-color-background-surface-selection-default-hover,
-    'active': $cdr-color-background-surface-selection-default-active,
-    'checked': $cdr-color-background-surface-selection-default-checked,
-    'disabled': $cdr-color-background-surface-selection-default-disabled,
-    'loading': $cdr-color-background-surface-selection-default-loading,
+    'rest': $cdr-color-background-selectable-surface-default-rest,
+    'hover': $cdr-color-background-selectable-surface-default-hover,
+    'active': $cdr-color-background-selectable-surface-default-active,
+    'checked': $cdr-color-background-selectable-surface-default-checked,
+    'disabled': $cdr-color-background-selectable-surface-default-disabled,
+    'loading': $cdr-color-background-selectable-surface-default-loading,
   ),
 );
-$surface-selection-border-colors: (
+$selectable-surface-border-colors: (
   'default': (
-    'rest': $cdr-color-border-surface-selection-default-rest,
-    'hover': $cdr-color-border-surface-selection-default-hover,
-    'active': $cdr-color-border-surface-selection-default-active,
-    'checked': $cdr-color-border-surface-selection-default-checked,
-    'disabled': $cdr-color-border-surface-selection-default-disabled,
-    'loading': $cdr-color-border-surface-selection-default-loading,
+    'rest': $cdr-color-border-selectable-surface-default-rest,
+    'hover': $cdr-color-border-selectable-surface-default-hover,
+    'active': $cdr-color-border-selectable-surface-default-active,
+    'checked': $cdr-color-border-selectable-surface-default-checked,
+    'disabled': $cdr-color-border-selectable-surface-default-disabled,
+    'loading': $cdr-color-border-selectable-surface-default-loading,
   ),
 );
 
-@mixin cdr-surface-selection-disabled-mixin() {
+@mixin cdr-selectable-surface-disabled-mixin() {
   &:disabled,
   &:disabled:hover,
   &:disabled:focus {
@@ -31,13 +31,13 @@ $surface-selection-border-colors: (
   }
 }
 
-@mixin cdr-surface-selection-hover-mixin() {
+@mixin cdr-selectable-surface-hover-mixin() {
   &:hover:not([aria-pressed='true'], [aria-checked='true'], :disabled) {
     @content;
   }
 }
 
-@mixin cdr-surface-selection-active-mixin() {
+@mixin cdr-selectable-surface-active-mixin() {
   &:focus,
   &:active,
   &[aria-pressed='true']:focus,
@@ -48,20 +48,20 @@ $surface-selection-border-colors: (
   }
 }
 
-@mixin cdr-surface-selection-checked-mixin() {
+@mixin cdr-selectable-surface-checked-mixin() {
   &[aria-pressed='true'],
   &[aria-checked='true'] {
     @content;
   }
 }
 
-@mixin cdr-surface-selection-loading-mixin() {
+@mixin cdr-selectable-surface-loading-mixin() {
   &[data-loading='true'] {
     @content;
   }
 }
 
-@mixin cdr-surface-selection-base-mixin($component) {
+@mixin cdr-selectable-surface-base-mixin($component) {
   @include cdr-text-utility-sans-300;
   @include cdr-border-mixin($component);
   @include cdr-border-width-mixin($component, 'sixteenth-x');
@@ -77,7 +77,7 @@ $surface-selection-border-colors: (
   padding: $cdr-space-inset-half-x-stretch;
   transition: all var(--cdr-duration-1-x) var(--cdr-timing-function-ease);
 
-  @include cdr-surface-selection-loading-mixin() {
+  @include cdr-selectable-surface-loading-mixin() {
     pointer-events: none;
 
     .cdr-#{$component}__layout {
@@ -108,17 +108,17 @@ $surface-selection-border-colors: (
     pointer-events: none;
   }
 
-  @include cdr-surface-selection-disabled-mixin() {
+  @include cdr-selectable-surface-disabled-mixin() {
     cursor: not-allowed !important;
     @include cdr-border-style-mixin($component, 'dashed');
   }
 
-  @include cdr-surface-selection-active-mixin() {
+  @include cdr-selectable-surface-active-mixin() {
     outline: none;
     @include cdr-border-width-mixin($component, 'three-sixteenth-x');
   }
 
-  @include cdr-surface-selection-checked-mixin() {
+  @include cdr-selectable-surface-checked-mixin() {
     @include cdr-border-width-mixin($component, 'three-sixteenth-x');
   }
 
@@ -128,7 +128,7 @@ $surface-selection-border-colors: (
   }
 }
 
-@mixin cdr-surface-selection-states-mixin(
+@mixin cdr-selectable-surface-states-mixin(
   $background-colors,
   $border-colors,
   $component,
@@ -138,37 +138,37 @@ $surface-selection-border-colors: (
   @include cdr-background-mixin($background-colors, $component, $modifier, $state);
   @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
 
-  @include cdr-surface-selection-hover-mixin() {
+  @include cdr-selectable-surface-hover-mixin() {
     $state: 'hover';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
     @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
-  @include cdr-surface-selection-active-mixin() {
+  @include cdr-selectable-surface-active-mixin() {
     $state: 'active';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
     @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
-  @include cdr-surface-selection-checked-mixin() {
+  @include cdr-selectable-surface-checked-mixin() {
     $state: 'checked';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
     @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
-  @include cdr-surface-selection-disabled-mixin() {
+  @include cdr-selectable-surface-disabled-mixin() {
     $state: 'disabled';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
     @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
-  @include cdr-surface-selection-loading-mixin() {
+  @include cdr-selectable-surface-loading-mixin() {
     $state: 'loading';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
   }
 }
 
-@mixin cdr-surface-selection-states-modifiers-mixin(
+@mixin cdr-selectable-surface-states-modifiers-mixin(
   $background-colors,
   $border-colors,
   $component,
@@ -176,7 +176,7 @@ $surface-selection-border-colors: (
 ) {
   @each $modifier in $modifiers {
     &--modifier-#{$modifier} {
-      @include cdr-surface-selection-states-mixin(
+      @include cdr-selectable-surface-states-mixin(
         $background-colors,
         $border-colors,
         $component,
diff --git a/src/components/selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss b/src/components/selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss
index b81f71a89..d4daaf3db 100644
--- a/src/components/selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss
+++ b/src/components/selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss
@@ -1,6 +1,6 @@
 @import '../../../../styles/settings/index.scss';
 
-@mixin cdr-surface-selection-layout-base-mixin() {
+@mixin cdr-selectable-surface-layout-base-mixin() {
   display: flex;
   gap: $cdr-space-three-eighth-x;
 

From 0bf0223b0c167321f87fb79c336515e50756e85c Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Wed, 18 Sep 2024 15:00:37 -0700
Subject: [PATCH 59/70] name change to surface selection

---
 package-lock.json                             |  2 +-
 src/components/examples.js                    |  4 +-
 .../fulfillmentTile/CdrFulfillmentTile.vue    |  8 +--
 .../CdrFulfillmentTileHeader.vue              |  4 +-
 .../CdrFulfillmentTileLayout.vue              |  4 +-
 .../examples/FulfillmentTile.vue              | 20 +++---
 .../styles/CdrFulfillmentTile.module.scss     |  6 +-
 .../CdrFulfillmentTileLayout.module.scss      |  4 +-
 .../styles/vars/CdrFulfillmentTile.vars.scss  | 10 +--
 .../CdrSelectableSurfaceLayout.spec.js.snap   | 34 ----------
 .../styles/CdrSelectableSurface.module.scss   | 17 -----
 .../CdrSelectableSurfaceLayout.module.scss    |  6 --
 src/components/surface/CdrSurface.vue         |  8 +++
 .../surface/__tests__/CdrSurface.spec.js      | 22 +++---
 .../__snapshots__/CdrSurface.spec.js.snap     |  6 +-
 src/components/surface/examples/Surface.vue   | 21 ++++++
 .../surface/styles/CdrSurface.module.scss     |  6 --
 .../surface/styles/vars/CdrSurface.vars.scss  | 34 +++++++---
 .../CdrSurfaceSelection.vue}                  | 26 +++----
 .../CdrSurfaceSelectionLayout.vue}            | 10 +--
 .../__tests__/CdrSurfaceSelection.spec.js}    | 28 ++++----
 .../CdrSurfaceSelectionLayout.spec.js}        | 18 ++---
 .../CdrSurfaceSelection.spec.js.snap}         | 50 +++++++-------
 .../CdrSurfaceSelectionLayout.spec.js.snap    | 34 ++++++++++
 .../examples/SurfaceSelection.vue}            | 34 +++++-----
 .../styles/CdrSurfaceSelection.module.scss    | 17 +++++
 .../CdrSurfaceSelectionLayout.module.scss     |  6 ++
 .../vars/CdrSurfaceSelection.vars.scss}       | 68 +++++++++----------
 .../vars/CdrSurfaceSelectionLayout.vars.scss} |  2 +-
 src/dev/router.js                             |  2 +-
 src/lib.ts                                    |  4 +-
 src/types/interfaces.ts                       | 12 ++--
 src/types/other.ts                            | 10 ++-
 src/utils/surface.ts                          |  4 +-
 34 files changed, 295 insertions(+), 246 deletions(-)
 delete mode 100644 src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap
 delete mode 100644 src/components/selectableSurface/styles/CdrSelectableSurface.module.scss
 delete mode 100644 src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss
 rename src/components/{selectableSurface/CdrSelectableSurface.vue => surfaceSelection/CdrSurfaceSelection.vue} (59%)
 rename src/components/{selectableSurface/CdrSelectableSurfaceLayout.vue => surfaceSelection/CdrSurfaceSelectionLayout.vue} (67%)
 rename src/components/{selectableSurface/__tests__/CdrSelectableSurface.spec.js => surfaceSelection/__tests__/CdrSurfaceSelection.spec.js} (60%)
 rename src/components/{selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js => surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js} (52%)
 rename src/components/{selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap => surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap} (69%)
 create mode 100644 src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
 rename src/components/{selectableSurface/examples/SelectableSurface.vue => surfaceSelection/examples/SurfaceSelection.vue} (70%)
 create mode 100644 src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
 create mode 100644 src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss
 rename src/components/{selectableSurface/styles/vars/CdrSelectableSurface.vars.scss => surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss} (63%)
 rename src/components/{selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss => surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss} (79%)

diff --git a/package-lock.json b/package-lock.json
index 6f09c7e9a..309f94600 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3066,7 +3066,7 @@
     },
     "node_modules/@rei/cdr-tokens": {
       "version": "12.3.0",
-      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#43dbc7e17ba78cde6fa5ee1dfc01db7cad8f7719",
+      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#12a66e1664c4bc4248052ef156e996393cd4ed6a",
       "dev": true,
       "license": "ISC",
       "engines": {
diff --git a/src/components/examples.js b/src/components/examples.js
index b67235cfb..cc621401d 100644
--- a/src/components/examples.js
+++ b/src/components/examples.js
@@ -31,7 +31,7 @@ import selects from 'componentsdir/select/examples/Selects.vue';
 import skeleton from 'componentsdir/skeleton/examples/Skeleton.vue';
 import splitSurface from 'componentsdir/splitSurface/examples/SplitSurface.vue';
 import surface from 'componentsdir/surface/examples/Surface.vue';
-import selectableSurface from 'componentsdir/selectableSurface/examples/SelectableSurface.vue';
+import surfaceSelection from 'componentsdir/surfaceSelection/examples/SurfaceSelection.vue';
 import tables from 'componentsdir/table/examples/Table.vue';
 import tabs from 'componentsdir/tabs/examples/Tabs.vue';
 import texts from 'componentsdir/text/examples/Text.vue';
@@ -76,7 +76,7 @@ export default {
   skeleton,
   splitSurface,
   surface,
-  selectableSurface,
+  surfaceSelection,
   tables,
   tabs,
   texts,
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index b4a8b54e1..1c81415bc 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import { selectableSurface } from '../../types/interfaces';
-import { getSelectableSurfaceProps } from '../../utils/surface';
+import { surfaceSelection } from '../../types/interfaces';
+import { getSurfaceSelectionProps } from '../../utils/surface';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
 import CdrFulfillmentTileHeader from './CdrFulfillmentTileHeader.vue';
 import CdrFulfillmentTileContent from './CdrFulfillmentTileContent.vue';
@@ -13,7 +13,7 @@ import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 
 defineOptions({ name: 'CdrFulfillmentTile' });
 
-const props = withDefaults(defineProps<selectableSurface>(), {
+const props = withDefaults(defineProps<surfaceSelection>(), {
   tag: 'button',
   role: 'radio',
   modifier: 'default',
@@ -28,7 +28,7 @@ const baseClass = 'cdr-fulfillment-tile';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { classes, ...additionalProps } = getSelectableSurfaceProps(props, baseClass);  
+  const { classes, ...additionalProps } = getSurfaceSelectionProps(props, baseClass);  
   return { ...additionalProps, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
index aaad6e313..18dc35a8f 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -2,7 +2,7 @@
 import { useCssModule, computed } from 'vue';
 import CdrSubheadingSans from '../text/presets/CdrSubheadingSans.vue';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
-import { selectableSurfaceLayout } from '../../types/interfaces';
+import { surfaceSelectionLayout } from '../../types/interfaces';
 
 /** Fulfillment tile header component */
 
@@ -12,7 +12,7 @@ const style = useCssModule();
 const baseClass = 'cdr-fulfillment-tile-header';
 
 const rootProps = computed(
-  (): selectableSurfaceLayout => ({
+  (): surfaceSelectionLayout => ({
     orientation: 'horizontal',
     class: { [style[baseClass]]: true },
   }),
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
index 9ac52df63..c12be1bc4 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import { selectableSurfaceLayout } from '../../types/interfaces';
+import { surfaceSelectionLayout } from '../../types/interfaces';
 
 /** Component for layout of a surface selection */
 
 defineOptions({ name: 'CdrFulfillmentTileLayout' });
 
-const props = withDefaults(defineProps<selectableSurfaceLayout>(), {
+const props = withDefaults(defineProps<surfaceSelectionLayout>(), {
   orientation: 'horizontal',
 });
 
diff --git a/src/components/fulfillmentTile/examples/FulfillmentTile.vue b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
index fb97f5d76..8896523be 100644
--- a/src/components/fulfillmentTile/examples/FulfillmentTile.vue
+++ b/src/components/fulfillmentTile/examples/FulfillmentTile.vue
@@ -6,7 +6,7 @@ import CdrFulfillmentTileContent from '../CdrFulfillmentTileContent.vue';
 import { IconCheckFill, IconErrorFill, IconXFill } from '../../icon';
 import CdrButton from '../../button/CdrButton.vue';
 import CdrSurface from '../../surface/CdrSurface.vue';
-import CdrSelectableSurface from '../../selectableSurface/CdrSelectableSurface.vue';
+import CdrSurfaceSelection from '../../surfaceSelection/CdrSurfaceSelection.vue';
 import CdrFulfillmentTileIcon from '../CdrFulfillmentTileIcon.vue';
 
 defineOptions({ name: 'FulfillmentTile' });
@@ -247,7 +247,7 @@ const toggleCheckbox2 = (value: number) => {
         :data-store-checked="checkbox2.includes(1)"
         radius="softer"
       >
-        <CdrSelectableSurface
+        <CdrSurfaceSelection
           class="example__search-tile-other-header-button"
           :checked="checkbox2.includes(1)"
           role="checkbox"
@@ -265,7 +265,7 @@ const toggleCheckbox2 = (value: number) => {
             In stock at
             <strong>Encinitas</strong>
           </CdrFulfillmentTileContent>
-        </CdrSelectableSurface>
+        </CdrSurfaceSelection>
         <hr class="example__search-tile-other-header-hr" />
         <CdrButton
           class="example__change-store-other"
@@ -283,7 +283,7 @@ const toggleCheckbox2 = (value: number) => {
 <style lang="scss" scoped>
 @import '@rei/cdr-tokens/dist/rei-dot-com/scss/cdr-tokens.scss';
 @import '../styles/vars/CdrFulfillmentTile.vars.scss';
-@import '../../selectableSurface/styles/vars/CdrSelectableSurface.vars.scss';
+@import '../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 
 $component: 'fulfillment-tile';
 
@@ -340,8 +340,8 @@ $component: 'fulfillment-tile';
 
   &__checkout-tile-other-disabled {
     --cdr-fulfillment-tile-icon-fill: var(--cdr-color-icon-default);
-    #{--cdr-color-background-fulfillment-tile}: $cdr-color-background-selectable-surface-default-disabled;
-    #{--cdr-color-background-fulfillment-tile-checked}: $cdr-color-background-selectable-surface-default-disabled;
+    #{--cdr-color-background-fulfillment-tile}: $cdr-color-background-surface-selection-default-disabled;
+    #{--cdr-color-background-fulfillment-tile-checked}: $cdr-color-background-surface-selection-default-disabled;
     @include cdr-border-style-mixin($component, 'dashed');
   }
 
@@ -366,12 +366,12 @@ $component: 'fulfillment-tile';
   }
 
   &__search-tile-other-header-button {
-    --cdr-selectable-surface-border-width-default: 0;
-    --cdr-color-background-selectable-surface-checked: var(--cdr-color-background-primary);
+    --cdr-surface-selection-border-width-default: 0;
+    --cdr-color-background-surface-selection-checked: var(--cdr-color-background-primary);
     width: 100%;
 
-    @include cdr-selectable-surface-checked-mixin() {
-      --cdr-selectable-surface-border-width-default: 0;
+    @include cdr-surface-selection-checked-mixin() {
+      --cdr-surface-selection-border-width-default: 0;
     }
   }
 
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
index 41a1f1876..c088da5cd 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTile.module.scss
@@ -1,4 +1,4 @@
-@import '../../selectableSurface/styles/vars/CdrSelectableSurface.vars.scss';
+@import '../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 @import './vars/CdrFulfillmentTile.vars.scss';
 
@@ -8,8 +8,8 @@
     $fulfillment-tile-border-colors,
     $fulfillment-tile-component
   );
-  @include cdr-selectable-surface-base-mixin($fulfillment-tile-component);
-  @include cdr-selectable-surface-states-mixin(
+  @include cdr-surface-selection-base-mixin($fulfillment-tile-component);
+  @include cdr-surface-selection-states-mixin(
     $fulfillment-tile-background-colors,
     $fulfillment-tile-border-colors,
     $fulfillment-tile-component
diff --git a/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss b/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
index 186cdca8b..b0cac0f28 100644
--- a/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
+++ b/src/components/fulfillmentTile/styles/CdrFulfillmentTileLayout.module.scss
@@ -1,6 +1,6 @@
-@import '../../selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss';
+@import '../../surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss';
 @import '../../surface/styles/vars/CdrSurface.vars.scss';
 
 .cdr-fulfillment-tile-layout {
-  @include cdr-selectable-surface-layout-base-mixin();
+  @include cdr-surface-selection-layout-base-mixin();
 }
diff --git a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
index accc3e4e1..4f417e12e 100644
--- a/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
+++ b/src/components/fulfillmentTile/styles/vars/CdrFulfillmentTile.vars.scss
@@ -1,21 +1,21 @@
 @use 'sass:map';
 @import '../../../../styles/settings/index.scss';
-@import '../../../selectableSurface/styles/vars/CdrSelectableSurface.vars.scss';
+@import '../../../surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss';
 
 $fulfillment-tile-component: 'fulfillment-tile';
-$fulfillment-tile-background-colors: $selectable-surface-background-colors;
-$fulfillment-tile-border-colors: $selectable-surface-border-colors;
+$fulfillment-tile-background-colors: $surface-selection-background-colors;
+$fulfillment-tile-border-colors: $surface-selection-border-colors;
 
 @mixin cdr-fulfillment-tile-base-mixin() {
   // Create tokens for background color
-  @each $modifier, $states in $selectable-surface-background-colors {
+  @each $modifier, $states in $surface-selection-background-colors {
     @each $state, $value in $states {
       --cdr-color-background-fulfillment-tile-#{$modifier}-#{$state}: #{$value};
     }
   }
 
   // Create tokens for border color
-  @each $modifier, $states in $selectable-surface-border-colors {
+  @each $modifier, $states in $surface-selection-border-colors {
     @each $state, $value in $states {
       --cdr-color-border-fulfillment-tile-#{$modifier}-#{$state}: #{$value};
     }
diff --git a/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap b/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap
deleted file mode 100644
index 7b6eb1f6f..000000000
--- a/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurfaceLayout.spec.js.snap
+++ /dev/null
@@ -1,34 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`CdrSelectableSurfaceLayout > orientation test > shows horizontal 1`] = `
-<div
-  class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal"
->
-  <!-- @slot Where all default content should be placed.
-      Elements are placed within a flex box. -->
-  
-  
-</div>
-`;
-
-exports[`CdrSelectableSurfaceLayout > orientation test > shows vertical 1`] = `
-<div
-  class="cdr-selectable-surface-layout cdr-selectable-surface-layout--vertical"
->
-  <!-- @slot Where all default content should be placed.
-      Elements are placed within a flex box. -->
-  
-  
-</div>
-`;
-
-exports[`CdrSelectableSurfaceLayout > snapshot test > renders correctly 1`] = `
-<div
-  class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal"
->
-  <!-- @slot Where all default content should be placed.
-      Elements are placed within a flex box. -->
-  
-  
-</div>
-`;
diff --git a/src/components/selectableSurface/styles/CdrSelectableSurface.module.scss b/src/components/selectableSurface/styles/CdrSelectableSurface.module.scss
deleted file mode 100644
index 9cad2a0dc..000000000
--- a/src/components/selectableSurface/styles/CdrSelectableSurface.module.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-@import './vars/CdrSelectableSurface.vars.scss';
-@import '../../surface/styles/vars/CdrSurface.vars.scss';
-
-.cdr-selectable-surface {
-  @include cdr-surface-base-mixin(
-    $selectable-surface-background-colors,
-    $selectable-surface-border-colors,
-    $selectable-surface-component
-  );
-  @include cdr-selectable-surface-base-mixin($selectable-surface-component);
-  @include cdr-selectable-surface-states-modifiers-mixin(
-    $selectable-surface-background-colors,
-    $selectable-surface-border-colors,
-    $selectable-surface-component,
-    $selectable-surface-modifiers
-  );
-}
diff --git a/src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss b/src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss
deleted file mode 100644
index 7dda970e6..000000000
--- a/src/components/selectableSurface/styles/CdrSelectableSurfaceLayout.module.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-@import './vars/CdrSelectableSurfaceLayout.vars.scss';
-@import '../../surface/styles/vars/CdrSurface.vars.scss';
-
-.cdr-selectable-surface-layout {
-  @include cdr-selectable-surface-layout-base-mixin();
-}
diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index 0ca2efd9e..8a00e44f7 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -9,7 +9,15 @@ import { getSurfaceProps } from '../../utils/surface';
 defineOptions({ name: 'CdrSurface' });
 
 const props = withDefaults(defineProps<surface>(), {
+  background: 'primary',
+  borderColor: 'primary',
+  borderStyle: 'solid',
+  borderWidth: 'sixteenth-x',
+  modifier: 'default',
+  radius: 'sharp',
+  shadow: 'flat',
   tag: 'div',
+  withBorder: false,
 });
 
 const style = useCssModule();
diff --git a/src/components/surface/__tests__/CdrSurface.spec.js b/src/components/surface/__tests__/CdrSurface.spec.js
index 569134e74..099a0abec 100644
--- a/src/components/surface/__tests__/CdrSurface.spec.js
+++ b/src/components/surface/__tests__/CdrSurface.spec.js
@@ -6,17 +6,17 @@ describe('CdrSurface', () => {
     let wrapper;
     beforeEach(() => {
       wrapper = mount(CdrSurface);
-    })
+    });
     it('renders correctly', () => {
       wrapper.setProps({
         modifier: 'primary',
         radius: 'soft',
         withBorder: true,
         borderWidth: 'one-x',
-      })
-      expect(wrapper.element).toMatchSnapshot()
+      });
+      expect(wrapper.element).toMatchSnapshot();
     });
-  })
+  });
 
   describe('component unit tests', () => {
     let wrapper;
@@ -32,9 +32,15 @@ describe('CdrSurface', () => {
         expect(wrapper.element.tagName).toBe('DIV');
       });
       it('default class added', () => {
-        expect(wrapper.classes()).toEqual(['cdr-surface']);
+        expect(wrapper.classes()).toEqual([
+          'cdr-surface',
+          'cdr-surface--modifier-default',
+          'cdr-surface--background-primary',
+          'cdr-surface--radius-sharp',
+          'cdr-surface--shadow-flat',
+        ]);
       });
-    })
+    });
 
     describe('when "tag" is set to "a"', () => {
       beforeEach(() => {
@@ -46,6 +52,6 @@ describe('CdrSurface', () => {
       it('renders a link', () => {
         expect(wrapper.element.tagName).toBe('A');
       });
-    })
-  })
+    });
+  });
 });
diff --git a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
index d7e5e1948..bb45a015c 100644
--- a/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
+++ b/src/components/surface/__tests__/__snapshots__/CdrSurface.spec.js.snap
@@ -2,7 +2,7 @@
 
 exports[`CdrSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
 <div
-  class="cdr-surface"
+  class="cdr-surface cdr-surface--modifier-default cdr-surface--background-primary cdr-surface--radius-sharp cdr-surface--shadow-flat"
 >
   <!-- @slot Where all default content should be placed. -->
   
@@ -12,7 +12,7 @@ exports[`CdrSurface > component unit tests > default component with no configura
 
 exports[`CdrSurface > component unit tests > when "tag" is set to "a" > renders correctly 1`] = `
 <a
-  class="cdr-surface"
+  class="cdr-surface cdr-surface--modifier-default cdr-surface--background-primary cdr-surface--radius-sharp cdr-surface--shadow-flat"
 >
   <!-- @slot Where all default content should be placed. -->
   
@@ -22,7 +22,7 @@ exports[`CdrSurface > component unit tests > when "tag" is set to "a" > renders
 
 exports[`CdrSurface > snapshot test > renders correctly 1`] = `
 <div
-  class="cdr-surface"
+  class="cdr-surface cdr-surface--modifier-default cdr-surface--background-primary cdr-surface--radius-sharp cdr-surface--shadow-flat"
 >
   <!-- @slot Where all default content should be placed. -->
   
diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index 008968b32..b23a2f845 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -52,6 +52,27 @@ const boxes: Example[] = [
       class: 'example__card',
     },
   },
+  ...['member', 'member-alt', 'sale', 'brand-spruce'].map(
+    (color) =>
+      ({
+        label: `Surface with ${color} background`,
+        props: {
+          background: color,
+          class: 'example__card',
+        },
+      }) as Example,
+  ),
+  ...['success', 'warning', 'error', 'info'].map(
+    (color) =>
+      ({
+        label: `Surface with ${color} border`,
+        props: {
+          withBorder: true,
+          borderColor: color,
+          class: 'example__card',
+        },
+      }) as Example,
+  ),
 ];
 </script>
 
diff --git a/src/components/surface/styles/CdrSurface.module.scss b/src/components/surface/styles/CdrSurface.module.scss
index 4e7bf86d8..a458921e8 100644
--- a/src/components/surface/styles/CdrSurface.module.scss
+++ b/src/components/surface/styles/CdrSurface.module.scss
@@ -7,10 +7,4 @@
     $surface-border-colors,
     $surface-component
   );
-  @include cdr-surface-modifiers-mixin(
-    $surface-background-colors,
-    $surface-border-colors,
-    $surface-component,
-    $surface-modifiers
-  );
 }
diff --git a/src/components/surface/styles/vars/CdrSurface.vars.scss b/src/components/surface/styles/vars/CdrSurface.vars.scss
index 3bfcb1ee1..effd75660 100644
--- a/src/components/surface/styles/vars/CdrSurface.vars.scss
+++ b/src/components/surface/styles/vars/CdrSurface.vars.scss
@@ -1,7 +1,6 @@
 @use 'sass:map';
 @import '../../../../styles/settings/index.scss';
 
-$surface-modifiers: 'primary', 'secondary';
 $surface-component: 'surface';
 $surface-background-colors: (
   'primary': (
@@ -10,6 +9,18 @@ $surface-background-colors: (
   'secondary': (
     'undefined': $cdr-color-background-surface-secondary,
   ),
+  'brand-spruce': (
+    'undefined': $cdr-color-background-surface-brand-spruce,
+  ),
+  'sale': (
+    'undefined': $cdr-color-background-surface-sale,
+  ),
+  'member': (
+    'undefined': $cdr-color-background-surface-member,
+  ),
+  'member-alt': (
+    'undefined': $cdr-color-background-surface-member-alt,
+  ),
 );
 $surface-border-colors: (
   'primary': (
@@ -18,6 +29,18 @@ $surface-border-colors: (
   'secondary': (
     'undefined': $cdr-color-border-surface-secondary,
   ),
+  'success': (
+    'undefined': $cdr-color-border-surface-success,
+  ),
+  'warning': (
+    'undefined': $cdr-color-border-surface-warning,
+  ),
+  'error': (
+    'undefined': $cdr-color-border-surface-error,
+  ),
+  'info': (
+    'undefined': $cdr-color-border-surface-info,
+  ),
 );
 
 @mixin cdr-surface-base-mixin($background-colors, $border-colors, $component) {
@@ -61,12 +84,3 @@ $surface-border-colors: (
     @include cdr-border-mixin($component);
   }
 }
-
-@mixin cdr-surface-modifiers-mixin($background-colors, $border-colors, $component, $modifiers) {
-  @each $modifier in $modifiers {
-    &--modifier-#{$modifier} {
-      @include cdr-background-mixin($background-colors, $component, $modifier);
-      @include cdr-border-color-mixin($border-colors, $component, $modifier);
-    }
-  }
-}
diff --git a/src/components/selectableSurface/CdrSelectableSurface.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
similarity index 59%
rename from src/components/selectableSurface/CdrSelectableSurface.vue
rename to src/components/surfaceSelection/CdrSurfaceSelection.vue
index 4624ad702..7e020f07d 100644
--- a/src/components/selectableSurface/CdrSelectableSurface.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -3,15 +3,15 @@ import { useCssModule, computed } from 'vue';
 import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
 import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 import mapClasses from '../../utils/mapClasses';
-import { selectableSurface } from '../../types/interfaces';
-import { getSelectableSurfaceProps } from '../../utils/surface';
-import CdrSelectableSurfaceLayout from './CdrSelectableSurfaceLayout.vue';
+import { surfaceSelection } from '../../types/interfaces';
+import { getSurfaceSelectionProps } from '../../utils/surface';
+import CdrSurfaceSelectionLayout from './CdrSurfaceSelectionLayout.vue';
 
 /** Base component for buttons that have a checked state */
 
-defineOptions({ name: 'CdrSelectableSurface' });
+defineOptions({ name: 'CdrSurfaceSelection' });
 
-const props = withDefaults(defineProps<selectableSurface>(), {
+const props = withDefaults(defineProps<surfaceSelection>(), {
   shadow: undefined,
   tag: 'button',
   role: 'radio',
@@ -23,11 +23,11 @@ const props = withDefaults(defineProps<selectableSurface>(), {
 });
 
 const style = useCssModule();
-const baseClass = 'cdr-selectable-surface';
+const baseClass = 'cdr-surface-selection';
 
 // Manages the props passed along to CdrSurface
 const rootProps = computed(() => {
-  const { classes, ...additionalProps } = getSelectableSurfaceProps(props, baseClass);
+  const { classes, ...additionalProps } = getSurfaceSelectionProps(props, baseClass);
   return { ...additionalProps, class: mapClasses(style, ...classes) || undefined };
 });
 </script>
@@ -37,15 +37,15 @@ const rootProps = computed(() => {
     :is="tag"
     v-bind="rootProps"
   >
-    <div :class="style['cdr-selectable-surface__inner']">
-      <CdrSelectableSurfaceLayout
+    <div :class="style['cdr-surface-selection__inner']">
+      <CdrSurfaceSelectionLayout
         :orientation="orientation"
-        :class="style['cdr-selectable-surface__layout']"
+        :class="style['cdr-surface-selection__layout']"
       >
         <!-- @slot Where all default content should be placed. -->
         <slot />
-      </CdrSelectableSurfaceLayout>
-      <div :class="style['cdr-selectable-surface__loading']">
+      </CdrSurfaceSelectionLayout>
+      <div :class="style['cdr-surface-selection__loading']">
         <!-- @slot This slot allows for custom loading content. -->
         <slot name="loading">
           <CdrSkeleton>
@@ -57,4 +57,4 @@ const rootProps = computed(() => {
   </component>
 </template>
 
-<style lang="scss" module src="./styles/CdrSelectableSurface.module.scss"></style>
+<style lang="scss" module src="./styles/CdrSurfaceSelection.module.scss"></style>
diff --git a/src/components/selectableSurface/CdrSelectableSurfaceLayout.vue b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
similarity index 67%
rename from src/components/selectableSurface/CdrSelectableSurfaceLayout.vue
rename to src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
index 3eb7b30b0..a6b170799 100644
--- a/src/components/selectableSurface/CdrSelectableSurfaceLayout.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
@@ -1,18 +1,18 @@
 <script setup lang="ts">
 import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
-import { selectableSurfaceLayout } from '../../types/interfaces';
+import { surfaceSelectionLayout } from '../../types/interfaces';
 
 /** Component for layout of a surface selection */
 
-defineOptions({ name: 'CdrSelectableSurfaceLayout' });
+defineOptions({ name: 'CdrSurfaceSelectionLayout' });
 
-const props = withDefaults(defineProps<selectableSurfaceLayout>(), {
+const props = withDefaults(defineProps<surfaceSelectionLayout>(), {
   orientation: 'horizontal',
 });
 
 const style = useCssModule();
-const baseClass = 'cdr-selectable-surface-layout';
+const baseClass = 'cdr-surface-selection-layout';
 
 // Manages the props passed along to root
 const rootProps = computed(() => {
@@ -34,4 +34,4 @@ const rootProps = computed(() => {
   </div>
 </template>
 
-<style lang="scss" module src="./styles/CdrSelectableSurfaceLayout.module.scss"></style>
+<style lang="scss" module src="./styles/CdrSurfaceSelectionLayout.module.scss"></style>
diff --git a/src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
similarity index 60%
rename from src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js
rename to src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
index b403845ab..dc8627d18 100644
--- a/src/components/selectableSurface/__tests__/CdrSelectableSurface.spec.js
+++ b/src/components/surfaceSelection/__tests__/CdrSurfaceSelection.spec.js
@@ -1,11 +1,11 @@
 import { mount } from '../../../../test/vue-jest-style-workaround.js';
-import CdrSelectableSurface from '../CdrSelectableSurface.vue';
+import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
 
-describe('CdrSelectableSurface', () => {
+describe('CdrSurfaceSelection', () => {
   describe('snapshot test', () => {
     let wrapper;
     beforeEach(() => {
-      wrapper = mount(CdrSelectableSurface, { props: { checked: false } });
+      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
     });
     it('renders correctly', () => {
       expect(wrapper.element).toMatchSnapshot();
@@ -15,7 +15,7 @@ describe('CdrSelectableSurface', () => {
   describe('component unit tests', () => {
     let wrapper;
     beforeEach(() => {
-      wrapper = mount(CdrSelectableSurface, { props: { checked: false } });
+      wrapper = mount(CdrSurfaceSelection, { props: { checked: false } });
     });
 
     describe('default component with no configuration', () => {
@@ -27,45 +27,45 @@ describe('CdrSelectableSurface', () => {
       });
       it('base classes only', () => {
         expect(wrapper.classes()).toEqual([
-          'cdr-selectable-surface',
-          'cdr-selectable-surface--modifier-default',
+          'cdr-surface-selection',
+          'cdr-surface-selection--modifier-default',
         ]);
       });
     });
   });
 
   it('shows default', () => {
-    const wrapper = mount(CdrSelectableSurface, {
+    const wrapper = mount(CdrSurfaceSelection, {
       props: { checked: false },
       slots: { default: 'Default slot' },
     });
-    expect(wrapper.find('.cdr-selectable-surface').text()).toBe('Default slot');
+    expect(wrapper.find('.cdr-surface-selection').text()).toBe('Default slot');
     expect(wrapper.element).toMatchSnapshot();
   });
 
   it('is loading', () => {
-    const wrapper = mount(CdrSelectableSurface, {
+    const wrapper = mount(CdrSurfaceSelection, {
       props: { checked: false, loading: true },
       slots: { default: 'Default slot' },
     });
     expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find('.cdr-selectable-surface').attributes('data-loading')).toBe('true');
+    expect(wrapper.find('.cdr-surface-selection').attributes('data-loading')).toBe('true');
   });
 
   it('is not loading', () => {
-    const wrapper = mount(CdrSelectableSurface, {
+    const wrapper = mount(CdrSurfaceSelection, {
       props: { checked: false, loading: false },
       slots: { default: 'Default slot' },
     });
-    expect(wrapper.find('.cdr-selectable-surface').attributes('data-loading')).toBe(undefined);
+    expect(wrapper.find('.cdr-surface-selection').attributes('data-loading')).toBe(undefined);
   });
 
   it('is checked', () => {
-    const wrapper = mount(CdrSelectableSurface, {
+    const wrapper = mount(CdrSurfaceSelection, {
       props: { checked: true },
       slots: { default: 'Default slot' },
     });
     expect(wrapper.element).toMatchSnapshot();
-    expect(wrapper.find('.cdr-selectable-surface').attributes('aria-checked')).toBe('true');
+    expect(wrapper.find('.cdr-surface-selection').attributes('aria-checked')).toBe('true');
   });
 });
diff --git a/src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js b/src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js
similarity index 52%
rename from src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js
rename to src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js
index b3b7c0338..73bf5772e 100644
--- a/src/components/selectableSurface/__tests__/CdrSelectableSurfaceLayout.spec.js
+++ b/src/components/surfaceSelection/__tests__/CdrSurfaceSelectionLayout.spec.js
@@ -1,11 +1,11 @@
 import { mount } from '../../../../test/vue-jest-style-workaround.js';
-import CdrSelectableSurfaceLayout from '../CdrSelectableSurfaceLayout.vue';
+import CdrSurfaceSelectionLayout from '../CdrSurfaceSelectionLayout.vue';
 
-describe('CdrSelectableSurfaceLayout', () => {
+describe('CdrSurfaceSelectionLayout', () => {
   describe('snapshot test', () => {
     let wrapper;
     beforeEach(() => {
-      wrapper = mount(CdrSelectableSurfaceLayout, { props: { orientation: 'horizontal' } });
+      wrapper = mount(CdrSurfaceSelectionLayout, { props: { orientation: 'horizontal' } });
     });
 
     it('renders correctly', () => {
@@ -15,20 +15,20 @@ describe('CdrSelectableSurfaceLayout', () => {
 
   describe('orientation test', () => {
     it('shows horizontal', () => {
-      const wrapper = mount(CdrSelectableSurfaceLayout, { props: { orientation: 'horizontal' } });
+      const wrapper = mount(CdrSurfaceSelectionLayout, { props: { orientation: 'horizontal' } });
       expect(wrapper.element).toMatchSnapshot();
       expect(wrapper.classes()).toEqual([
-        'cdr-selectable-surface-layout',
-        'cdr-selectable-surface-layout--horizontal',
+        'cdr-surface-selection-layout',
+        'cdr-surface-selection-layout--horizontal',
       ]);
     });
 
     it('shows vertical', () => {
-      const wrapper = mount(CdrSelectableSurfaceLayout, { props: { orientation: 'vertical' } });
+      const wrapper = mount(CdrSurfaceSelectionLayout, { props: { orientation: 'vertical' } });
       expect(wrapper.element).toMatchSnapshot();
       expect(wrapper.classes()).toEqual([
-        'cdr-selectable-surface-layout',
-        'cdr-selectable-surface-layout--vertical',
+        'cdr-surface-selection-layout',
+        'cdr-surface-selection-layout--vertical',
       ]);
     });
   });
diff --git a/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
similarity index 69%
rename from src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap
rename to src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
index 03e3de15b..d73fd1e2f 100644
--- a/src/components/selectableSurface/__tests__/__snapshots__/CdrSelectableSurface.spec.js.snap
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelection.spec.js.snap
@@ -1,9 +1,9 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`CdrSelectableSurface > component unit tests > default component with no configuration > renders correctly 1`] = `
+exports[`CdrSurfaceSelection > component unit tests > default component with no configuration > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
   modifier="default"
   orientation="horizontal"
   role="radio"
@@ -11,10 +11,10 @@ exports[`CdrSelectableSurface > component unit tests > default component with no
   type="button"
 >
   <div
-    class="cdr-selectable-surface__inner"
+    class="cdr-surface-selection__inner"
   >
     <div
-      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -22,7 +22,7 @@ exports[`CdrSelectableSurface > component unit tests > default component with no
       
     </div>
     <div
-      class="cdr-selectable-surface__loading"
+      class="cdr-surface-selection__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
@@ -44,10 +44,10 @@ exports[`CdrSelectableSurface > component unit tests > default component with no
 </button>
 `;
 
-exports[`CdrSelectableSurface > is checked 1`] = `
+exports[`CdrSurfaceSelection > is checked 1`] = `
 <button
   aria-checked="true"
-  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
   modifier="default"
   orientation="horizontal"
   role="radio"
@@ -55,10 +55,10 @@ exports[`CdrSelectableSurface > is checked 1`] = `
   type="button"
 >
   <div
-    class="cdr-selectable-surface__inner"
+    class="cdr-surface-selection__inner"
   >
     <div
-      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -70,7 +70,7 @@ exports[`CdrSelectableSurface > is checked 1`] = `
       
     </div>
     <div
-      class="cdr-selectable-surface__loading"
+      class="cdr-surface-selection__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
@@ -92,10 +92,10 @@ exports[`CdrSelectableSurface > is checked 1`] = `
 </button>
 `;
 
-exports[`CdrSelectableSurface > is loading 1`] = `
+exports[`CdrSurfaceSelection > is loading 1`] = `
 <button
   aria-checked="false"
-  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
   data-loading="true"
   modifier="default"
   orientation="horizontal"
@@ -104,10 +104,10 @@ exports[`CdrSelectableSurface > is loading 1`] = `
   type="button"
 >
   <div
-    class="cdr-selectable-surface__inner"
+    class="cdr-surface-selection__inner"
   >
     <div
-      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -119,7 +119,7 @@ exports[`CdrSelectableSurface > is loading 1`] = `
       
     </div>
     <div
-      class="cdr-selectable-surface__loading"
+      class="cdr-surface-selection__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
@@ -141,10 +141,10 @@ exports[`CdrSelectableSurface > is loading 1`] = `
 </button>
 `;
 
-exports[`CdrSelectableSurface > shows default 1`] = `
+exports[`CdrSurfaceSelection > shows default 1`] = `
 <button
   aria-checked="false"
-  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
   modifier="default"
   orientation="horizontal"
   role="radio"
@@ -152,10 +152,10 @@ exports[`CdrSelectableSurface > shows default 1`] = `
   type="button"
 >
   <div
-    class="cdr-selectable-surface__inner"
+    class="cdr-surface-selection__inner"
   >
     <div
-      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -167,7 +167,7 @@ exports[`CdrSelectableSurface > shows default 1`] = `
       
     </div>
     <div
-      class="cdr-selectable-surface__loading"
+      class="cdr-surface-selection__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
@@ -189,10 +189,10 @@ exports[`CdrSelectableSurface > shows default 1`] = `
 </button>
 `;
 
-exports[`CdrSelectableSurface > snapshot test > renders correctly 1`] = `
+exports[`CdrSurfaceSelection > snapshot test > renders correctly 1`] = `
 <button
   aria-checked="false"
-  class="cdr-selectable-surface cdr-selectable-surface--modifier-default"
+  class="cdr-surface-selection cdr-surface-selection--modifier-default"
   modifier="default"
   orientation="horizontal"
   role="radio"
@@ -200,10 +200,10 @@ exports[`CdrSelectableSurface > snapshot test > renders correctly 1`] = `
   type="button"
 >
   <div
-    class="cdr-selectable-surface__inner"
+    class="cdr-surface-selection__inner"
   >
     <div
-      class="cdr-selectable-surface-layout cdr-selectable-surface-layout--horizontal cdr-selectable-surface__layout"
+      class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal cdr-surface-selection__layout"
     >
       <!-- @slot Where all default content should be placed.
       Elements are placed within a flex box. -->
@@ -211,7 +211,7 @@ exports[`CdrSelectableSurface > snapshot test > renders correctly 1`] = `
       
     </div>
     <div
-      class="cdr-selectable-surface__loading"
+      class="cdr-surface-selection__loading"
     >
       <!-- @slot This slot allows for custom loading content. -->
       
diff --git a/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
new file mode 100644
index 000000000..68d749481
--- /dev/null
+++ b/src/components/surfaceSelection/__tests__/__snapshots__/CdrSurfaceSelectionLayout.spec.js.snap
@@ -0,0 +1,34 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`CdrSurfaceSelectionLayout > orientation test > shows horizontal 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+>
+  <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+  
+  
+</div>
+`;
+
+exports[`CdrSurfaceSelectionLayout > orientation test > shows vertical 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--vertical"
+>
+  <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+  
+  
+</div>
+`;
+
+exports[`CdrSurfaceSelectionLayout > snapshot test > renders correctly 1`] = `
+<div
+  class="cdr-surface-selection-layout cdr-surface-selection-layout--horizontal"
+>
+  <!-- @slot Where all default content should be placed.
+      Elements are placed within a flex box. -->
+  
+  
+</div>
+`;
diff --git a/src/components/selectableSurface/examples/SelectableSurface.vue b/src/components/surfaceSelection/examples/SurfaceSelection.vue
similarity index 70%
rename from src/components/selectableSurface/examples/SelectableSurface.vue
rename to src/components/surfaceSelection/examples/SurfaceSelection.vue
index ace60fb9b..64f763f51 100644
--- a/src/components/selectableSurface/examples/SelectableSurface.vue
+++ b/src/components/surfaceSelection/examples/SurfaceSelection.vue
@@ -1,16 +1,16 @@
 <script setup lang="ts">
 import { ref, computed } from 'vue';
-import CdrSelectableSurface from '../CdrSelectableSurface.vue';
-import type { selectableSurface } from '../../../types/interfaces';
+import CdrSurfaceSelection from '../CdrSurfaceSelection.vue';
+import type { surfaceSelection } from '../../../types/interfaces';
 import CdrSwitch from '../../switch/CdrSwitch.vue';
 
-defineOptions({ name: 'SelectableSurface' });
+defineOptions({ name: 'SurfaceSelection' });
 
 const loading = ref(false);
 
 const examples = computed(
   () =>
-    <selectableSurface[]>[
+    <surfaceSelection[]>[
       { checked: false, role: 'checkbox', loading: loading.value },
       { checked: true, role: 'checkbox', loading: loading.value },
       { checked: false, role: 'checkbox', loading: !loading.value },
@@ -40,7 +40,7 @@ const examples = computed(
 
 <template>
   <div class="example">
-    <h2>SelectableSurface</h2>
+    <h2>SurfaceSelection</h2>
     <hr class="example__hr" />
     <div class="example__options">
       <CdrSwitch
@@ -52,29 +52,29 @@ const examples = computed(
     </div>
     <hr class="example__hr" />
     <div class="example__demos">
-      <CdrSelectableSurface v-bind="examples[0]">This is default</CdrSelectableSurface>
-      <CdrSelectableSurface v-bind="examples[1]">This is checked</CdrSelectableSurface>
-      <CdrSelectableSurface v-bind="examples[2]">This is loading</CdrSelectableSurface>
-      <CdrSelectableSurface v-bind="examples[3]">This is disabled</CdrSelectableSurface>
+      <CdrSurfaceSelection v-bind="examples[0]">This is default</CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[1]">This is checked</CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[2]">This is loading</CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[3]">This is disabled</CdrSurfaceSelection>
     </div>
     <hr class="example__hr" />
     <div class="example__demos2">
-      <CdrSelectableSurface v-bind="examples[4]">
+      <CdrSurfaceSelection v-bind="examples[4]">
         Custom loading
         <template #loading>...</template>
-      </CdrSelectableSurface>
-      <CdrSelectableSurface v-bind="examples[5]">
+      </CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[5]">
         <div>Auto</div>
         <div>Auto</div>
-      </CdrSelectableSurface>
-      <CdrSelectableSurface v-bind="examples[6]">
+      </CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[6]">
         <div>Auto</div>
         <div class="example__100">100%</div>
-      </CdrSelectableSurface>
-      <CdrSelectableSurface v-bind="examples[7]">
+      </CdrSurfaceSelection>
+      <CdrSurfaceSelection v-bind="examples[7]">
         <div>orientation</div>
         <div>vertical</div>
-      </CdrSelectableSurface>
+      </CdrSurfaceSelection>
     </div>
   </div>
 </template>
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
new file mode 100644
index 000000000..27e1c21ce
--- /dev/null
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelection.module.scss
@@ -0,0 +1,17 @@
+@import './vars/CdrSurfaceSelection.vars.scss';
+@import '../../surface/styles/vars/CdrSurface.vars.scss';
+
+.cdr-surface-selection {
+  @include cdr-surface-base-mixin(
+    $surface-selection-background-colors,
+    $surface-selection-border-colors,
+    $surface-selection-component
+  );
+  @include cdr-surface-selection-base-mixin($surface-selection-component);
+  @include cdr-surface-selection-states-modifiers-mixin(
+    $surface-selection-background-colors,
+    $surface-selection-border-colors,
+    $surface-selection-component,
+    $surface-selection-modifiers
+  );
+}
diff --git a/src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss b/src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss
new file mode 100644
index 000000000..242582f0c
--- /dev/null
+++ b/src/components/surfaceSelection/styles/CdrSurfaceSelectionLayout.module.scss
@@ -0,0 +1,6 @@
+@import './vars/CdrSurfaceSelectionLayout.vars.scss';
+@import '../../surface/styles/vars/CdrSurface.vars.scss';
+
+.cdr-surface-selection-layout {
+  @include cdr-surface-selection-layout-base-mixin();
+}
diff --git a/src/components/selectableSurface/styles/vars/CdrSelectableSurface.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
similarity index 63%
rename from src/components/selectableSurface/styles/vars/CdrSelectableSurface.vars.scss
rename to src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
index fcb74c885..c66cb617d 100644
--- a/src/components/selectableSurface/styles/vars/CdrSelectableSurface.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelection.vars.scss
@@ -1,29 +1,29 @@
 @import '../../../../styles/settings/index.scss';
 
-$selectable-surface-component: 'surface-selection';
-$selectable-surface-modifiers: 'default';
-$selectable-surface-background-colors: (
+$surface-selection-component: 'surface-selection';
+$surface-selection-modifiers: 'default';
+$surface-selection-background-colors: (
   'default': (
-    'rest': $cdr-color-background-selectable-surface-default-rest,
-    'hover': $cdr-color-background-selectable-surface-default-hover,
-    'active': $cdr-color-background-selectable-surface-default-active,
-    'checked': $cdr-color-background-selectable-surface-default-checked,
-    'disabled': $cdr-color-background-selectable-surface-default-disabled,
-    'loading': $cdr-color-background-selectable-surface-default-loading,
+    'rest': $cdr-color-background-surface-selection-default-rest,
+    'hover': $cdr-color-background-surface-selection-default-hover,
+    'active': $cdr-color-background-surface-selection-default-active,
+    'checked': $cdr-color-background-surface-selection-default-checked,
+    'disabled': $cdr-color-background-surface-selection-default-disabled,
+    'loading': $cdr-color-background-surface-selection-default-loading,
   ),
 );
-$selectable-surface-border-colors: (
+$surface-selection-border-colors: (
   'default': (
-    'rest': $cdr-color-border-selectable-surface-default-rest,
-    'hover': $cdr-color-border-selectable-surface-default-hover,
-    'active': $cdr-color-border-selectable-surface-default-active,
-    'checked': $cdr-color-border-selectable-surface-default-checked,
-    'disabled': $cdr-color-border-selectable-surface-default-disabled,
-    'loading': $cdr-color-border-selectable-surface-default-loading,
+    'rest': $cdr-color-border-surface-selection-default-rest,
+    'hover': $cdr-color-border-surface-selection-default-hover,
+    'active': $cdr-color-border-surface-selection-default-active,
+    'checked': $cdr-color-border-surface-selection-default-checked,
+    'disabled': $cdr-color-border-surface-selection-default-disabled,
+    'loading': $cdr-color-border-surface-selection-default-loading,
   ),
 );
 
-@mixin cdr-selectable-surface-disabled-mixin() {
+@mixin cdr-surface-selection-disabled-mixin() {
   &:disabled,
   &:disabled:hover,
   &:disabled:focus {
@@ -31,13 +31,13 @@ $selectable-surface-border-colors: (
   }
 }
 
-@mixin cdr-selectable-surface-hover-mixin() {
+@mixin cdr-surface-selection-hover-mixin() {
   &:hover:not([aria-pressed='true'], [aria-checked='true'], :disabled) {
     @content;
   }
 }
 
-@mixin cdr-selectable-surface-active-mixin() {
+@mixin cdr-surface-selection-active-mixin() {
   &:focus,
   &:active,
   &[aria-pressed='true']:focus,
@@ -48,20 +48,20 @@ $selectable-surface-border-colors: (
   }
 }
 
-@mixin cdr-selectable-surface-checked-mixin() {
+@mixin cdr-surface-selection-checked-mixin() {
   &[aria-pressed='true'],
   &[aria-checked='true'] {
     @content;
   }
 }
 
-@mixin cdr-selectable-surface-loading-mixin() {
+@mixin cdr-surface-selection-loading-mixin() {
   &[data-loading='true'] {
     @content;
   }
 }
 
-@mixin cdr-selectable-surface-base-mixin($component) {
+@mixin cdr-surface-selection-base-mixin($component) {
   @include cdr-text-utility-sans-300;
   @include cdr-border-mixin($component);
   @include cdr-border-width-mixin($component, 'sixteenth-x');
@@ -77,7 +77,7 @@ $selectable-surface-border-colors: (
   padding: $cdr-space-inset-half-x-stretch;
   transition: all var(--cdr-duration-1-x) var(--cdr-timing-function-ease);
 
-  @include cdr-selectable-surface-loading-mixin() {
+  @include cdr-surface-selection-loading-mixin() {
     pointer-events: none;
 
     .cdr-#{$component}__layout {
@@ -108,17 +108,17 @@ $selectable-surface-border-colors: (
     pointer-events: none;
   }
 
-  @include cdr-selectable-surface-disabled-mixin() {
+  @include cdr-surface-selection-disabled-mixin() {
     cursor: not-allowed !important;
     @include cdr-border-style-mixin($component, 'dashed');
   }
 
-  @include cdr-selectable-surface-active-mixin() {
+  @include cdr-surface-selection-active-mixin() {
     outline: none;
     @include cdr-border-width-mixin($component, 'three-sixteenth-x');
   }
 
-  @include cdr-selectable-surface-checked-mixin() {
+  @include cdr-surface-selection-checked-mixin() {
     @include cdr-border-width-mixin($component, 'three-sixteenth-x');
   }
 
@@ -128,7 +128,7 @@ $selectable-surface-border-colors: (
   }
 }
 
-@mixin cdr-selectable-surface-states-mixin(
+@mixin cdr-surface-selection-states-mixin(
   $background-colors,
   $border-colors,
   $component,
@@ -138,37 +138,37 @@ $selectable-surface-border-colors: (
   @include cdr-background-mixin($background-colors, $component, $modifier, $state);
   @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
 
-  @include cdr-selectable-surface-hover-mixin() {
+  @include cdr-surface-selection-hover-mixin() {
     $state: 'hover';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
     @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
-  @include cdr-selectable-surface-active-mixin() {
+  @include cdr-surface-selection-active-mixin() {
     $state: 'active';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
     @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
-  @include cdr-selectable-surface-checked-mixin() {
+  @include cdr-surface-selection-checked-mixin() {
     $state: 'checked';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
     @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
-  @include cdr-selectable-surface-disabled-mixin() {
+  @include cdr-surface-selection-disabled-mixin() {
     $state: 'disabled';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
     @include cdr-border-color-mixin($border-colors, $component, $modifier, $state);
   }
 
-  @include cdr-selectable-surface-loading-mixin() {
+  @include cdr-surface-selection-loading-mixin() {
     $state: 'loading';
     @include cdr-background-mixin($background-colors, $component, $modifier, $state);
   }
 }
 
-@mixin cdr-selectable-surface-states-modifiers-mixin(
+@mixin cdr-surface-selection-states-modifiers-mixin(
   $background-colors,
   $border-colors,
   $component,
@@ -176,7 +176,7 @@ $selectable-surface-border-colors: (
 ) {
   @each $modifier in $modifiers {
     &--modifier-#{$modifier} {
-      @include cdr-selectable-surface-states-mixin(
+      @include cdr-surface-selection-states-mixin(
         $background-colors,
         $border-colors,
         $component,
diff --git a/src/components/selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss
similarity index 79%
rename from src/components/selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss
rename to src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss
index d4daaf3db..b81f71a89 100644
--- a/src/components/selectableSurface/styles/vars/CdrSelectableSurfaceLayout.vars.scss
+++ b/src/components/surfaceSelection/styles/vars/CdrSurfaceSelectionLayout.vars.scss
@@ -1,6 +1,6 @@
 @import '../../../../styles/settings/index.scss';
 
-@mixin cdr-selectable-surface-layout-base-mixin() {
+@mixin cdr-surface-selection-layout-base-mixin() {
   display: flex;
   gap: $cdr-space-three-eighth-x;
 
diff --git a/src/dev/router.js b/src/dev/router.js
index 909750ce4..7622e57c3 100644
--- a/src/dev/router.js
+++ b/src/dev/router.js
@@ -54,7 +54,7 @@ const routes = [
   { path: '/skeleton', name: 'Skeleton', component: Examples.skeleton },
   { path: '/split-surface', name: 'Split Surface', component: Examples.splitSurface },
   { path: '/surface', name: 'Surface', component: Examples.surface },
-  { path: '/selectableSurface', name: 'SelectableSurface', component: Examples.selectableSurface },
+  { path: '/surfaceSelection', name: 'SurfaceSelection', component: Examples.surfaceSelection },
   { path: '/tables', name: 'Tables', component: Examples.tables },
   { path: '/tabs', name: 'Tabs', component: Examples.tabs },
   { path: '/texts', name: 'Texts', component: Examples.texts },
diff --git a/src/lib.ts b/src/lib.ts
index 14f92c769..04120c1ee 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -38,8 +38,8 @@ export { default as CdrSkeleton } from './components/skeleton/CdrSkeleton.vue';
 export { default as CdrSkeletonBone } from './components/skeleton/CdrSkeletonBone.vue';
 export { default as CdrSplitSurface } from './components/splitSurface/CdrSplitSurface.vue';
 export { default as CdrSurface } from './components/surface/CdrSurface.vue';
-export { default as CdrSelectableSurface } from './components/selectableSurface/CdrSelectableSurface.vue';
-export { default as CdrSelectableSurfaceLayout } from './components/selectableSurface/CdrSelectableSurfaceLayout.vue';
+export { default as CdrSurfaceSelection } from './components/surfaceSelection/CdrSurfaceSelection.vue';
+export { default as CdrSurfaceSelectionLayout } from './components/surfaceSelection/CdrSurfaceSelectionLayout.vue';
 export { default as CdrTable } from './components/table/CdrTable.vue';
 export { default as CdrTabPanel } from './components/tabs/CdrTabPanel.vue';
 export { default as CdrTabs } from './components/tabs/CdrTabs.vue';
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 6906c837d..d01a9d882 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -159,12 +159,13 @@ export interface surface extends HtmlAttributes {
   /**
    * Adds in a background color based on the current palette's tokens.
    * @demoSelectMultiple false
-   * @values primary, secondary
+   * @values primary, secondary, brand-spruce, sale, member, member-alt
    */
   background?: Background;
   /**
    * Specifies a border color based on the token options within Cedar.
-   * @values primary, secondary
+   * @demoSelectMultiple false
+   * @values primary, secondary, success, warning, error, info
    */
   borderColor?: BorderColor;
   /**
@@ -179,8 +180,7 @@ export interface surface extends HtmlAttributes {
   borderWidth?: Space;
   /**
    * Determines which set of styles to apply to the component.
-   * @demoSelectMultiple false
-   * @values primary, secondary
+   * @values default
    */
   modifier?: Modifier;
   /**
@@ -205,7 +205,7 @@ export interface surface extends HtmlAttributes {
   withBorder?: boolean;
 }
 
-export interface selectableSurface extends HtmlAttributes {
+export interface surfaceSelection extends HtmlAttributes {
   /**
    * Determines if the button is in a checked state. Adds an `aria-checked` attribute to the button.
    */
@@ -244,7 +244,7 @@ export interface selectableSurface extends HtmlAttributes {
   tag?: Tag;
 }
 
-export interface selectableSurfaceLayout extends HtmlAttributes {
+export interface surfaceSelectionLayout extends HtmlAttributes {
   /**
    * Determines if the layout is in horizontal or vertical mode.
    * @values horizontal, vertical
diff --git a/src/types/other.ts b/src/types/other.ts
index 800b0f542..9248a53c4 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -26,9 +26,15 @@ export type SpaceFluid =
 export type SpaceScale = 'scale-0--1' | 'scale-3--4' | 'scale-3--5';
 export type Space = SpaceFixed | SpaceFluid | SpaceScale;
 export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
-export type Background = 'primary' | 'secondary';
+export type Background =
+  | 'primary'
+  | 'secondary'
+  | 'brand-spruce'
+  | 'sale'
+  | 'member'
+  | 'member-alt';
 export type Radius = 'sharp' | 'soft' | 'softer' | 'softest' | 'round';
-export type BorderColor = 'primary' | 'secondary';
+export type BorderColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
 export type BorderStyle = 'solid' | 'dotted' | 'dashed';
 export type Modifier = 'default' | 'primary' | 'secondary';
 export type Orientation = 'vertical' | 'horizontal';
diff --git a/src/utils/surface.ts b/src/utils/surface.ts
index cb902433a..7beaea848 100644
--- a/src/utils/surface.ts
+++ b/src/utils/surface.ts
@@ -1,4 +1,4 @@
-import type { surface, selectableSurface, HtmlAttributes } from '../types/interfaces';
+import type { surface, surfaceSelection, HtmlAttributes } from '../types/interfaces';
 
 // Manages the props passed along to all surfaces
 export const getSurfaceProps = (props: surface, baseClass: string) => {
@@ -45,7 +45,7 @@ export const getSurfaceProps = (props: surface, baseClass: string) => {
   return { classes };
 };
 
-export const getSelectableSurfaceProps = (props: selectableSurface, baseClass: string) => {
+export const getSurfaceSelectionProps = (props: surfaceSelection, baseClass: string) => {
   const { classes } = getSurfaceProps(props, baseClass);
   const { checked, loading, disabled, ...otherProps } = props;
   const additionalProps: HtmlAttributes = { ...otherProps };

From 761cd0d422f220842ea8b87c8d1ad1eeea71076d Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Wed, 18 Sep 2024 15:32:34 -0700
Subject: [PATCH 60/70] progress

---
 src/components/surface/examples/Surface.vue | 21 ---------------------
 1 file changed, 21 deletions(-)

diff --git a/src/components/surface/examples/Surface.vue b/src/components/surface/examples/Surface.vue
index b23a2f845..008968b32 100644
--- a/src/components/surface/examples/Surface.vue
+++ b/src/components/surface/examples/Surface.vue
@@ -52,27 +52,6 @@ const boxes: Example[] = [
       class: 'example__card',
     },
   },
-  ...['member', 'member-alt', 'sale', 'brand-spruce'].map(
-    (color) =>
-      ({
-        label: `Surface with ${color} background`,
-        props: {
-          background: color,
-          class: 'example__card',
-        },
-      }) as Example,
-  ),
-  ...['success', 'warning', 'error', 'info'].map(
-    (color) =>
-      ({
-        label: `Surface with ${color} border`,
-        props: {
-          withBorder: true,
-          borderColor: color,
-          class: 'example__card',
-        },
-      }) as Example,
-  ),
 ];
 </script>
 

From 196223275158c4852272c19e1cd3eb113216b10f Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 19 Sep 2024 13:44:29 -0700
Subject: [PATCH 61/70] progress

---
 src/types/interfaces.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index d01a9d882..cd17b97ac 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -208,10 +208,12 @@ export interface surface extends HtmlAttributes {
 export interface surfaceSelection extends HtmlAttributes {
   /**
    * Determines if the button is in a checked state. Adds an `aria-checked` attribute to the button.
+   * @skip true
    */
   checked?: boolean;
   /**
    * Determines if the button is in a disabled state.
+   * @skip true
    */
   disabled?: boolean;
   /**
@@ -220,12 +222,12 @@ export interface surfaceSelection extends HtmlAttributes {
   loading?: boolean;
   /**
    * Determines which set of styles to apply to the component.
+   * @skip true
    * @values default
    */
   modifier?: Modifier;
   /**
    * Determines if the layout is in horizontal or vertical mode.
-   * @demoSelectMultiple false
    * @values horizontal, vertical
    */
   orientation?: Orientation;

From 360b3a25939c96ac8853c25abd1ddfd7b00eb351 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 19 Sep 2024 13:49:03 -0700
Subject: [PATCH 62/70] progress

---
 src/types/interfaces.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index cd17b97ac..0f61ce4ae 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -222,12 +222,12 @@ export interface surfaceSelection extends HtmlAttributes {
   loading?: boolean;
   /**
    * Determines which set of styles to apply to the component.
-   * @skip true
    * @values default
    */
   modifier?: Modifier;
   /**
    * Determines if the layout is in horizontal or vertical mode.
+   * @skip true
    * @values horizontal, vertical
    */
   orientation?: Orientation;

From 0e7319674f815320d83990e4d749571d1f39ed2c Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 19 Sep 2024 14:24:04 -0700
Subject: [PATCH 63/70] progress

---
 src/types/interfaces.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 0f61ce4ae..b93003952 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -227,7 +227,6 @@ export interface surfaceSelection extends HtmlAttributes {
   modifier?: Modifier;
   /**
    * Determines if the layout is in horizontal or vertical mode.
-   * @skip true
    * @values horizontal, vertical
    */
   orientation?: Orientation;

From e648e6f9540f5fc417d3e569d6b63a72ec2b68d5 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Thu, 19 Sep 2024 14:43:58 -0700
Subject: [PATCH 64/70] progress

---
 src/types/interfaces.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index b93003952..10b2f52ce 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -218,6 +218,7 @@ export interface surfaceSelection extends HtmlAttributes {
   disabled?: boolean;
   /**
    * Determines if the button is in a loading state. Adds a `data-loading` attribute to the button. Using CSS, this will hide the default slot and show the loading slot.
+   * @skip true
    */
   loading?: boolean;
   /**

From e904fb5e2706d6665418ab890cf3c1c5080cc0a5 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Fri, 20 Sep 2024 09:08:26 -0700
Subject: [PATCH 65/70] change button prop validation

---
 src/components/icon/CdrIcon.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/icon/CdrIcon.vue b/src/components/icon/CdrIcon.vue
index 26002f47d..19cafd765 100644
--- a/src/components/icon/CdrIcon.vue
+++ b/src/components/icon/CdrIcon.vue
@@ -25,7 +25,7 @@ const props = defineProps({
     default: undefined,
     validator: (value: string) => propValidator(
       value,
-      ['small', 'large'],
+      ['small', 'medium', 'large'],
     ),
   },
 });

From 9626a141ecd450daf7808318603418acec2211ab Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Fri, 20 Sep 2024 14:06:28 -0700
Subject: [PATCH 66/70] progress

---
 package-lock.json                                       | 2 +-
 src/components/surface/styles/vars/CdrSurface.vars.scss | 6 ------
 src/types/interfaces.ts                                 | 2 +-
 src/types/other.ts                                      | 8 +-------
 4 files changed, 3 insertions(+), 15 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 309f94600..4041e3e63 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3066,7 +3066,7 @@
     },
     "node_modules/@rei/cdr-tokens": {
       "version": "12.3.0",
-      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#12a66e1664c4bc4248052ef156e996393cd4ed6a",
+      "resolved": "git+ssh://git@github.com/rei/rei-cedar-tokens.git#02446ea636a23bd896c7fadcb58e60c80d1ff709",
       "dev": true,
       "license": "ISC",
       "engines": {
diff --git a/src/components/surface/styles/vars/CdrSurface.vars.scss b/src/components/surface/styles/vars/CdrSurface.vars.scss
index effd75660..8d8b9fc5d 100644
--- a/src/components/surface/styles/vars/CdrSurface.vars.scss
+++ b/src/components/surface/styles/vars/CdrSurface.vars.scss
@@ -15,12 +15,6 @@ $surface-background-colors: (
   'sale': (
     'undefined': $cdr-color-background-surface-sale,
   ),
-  'member': (
-    'undefined': $cdr-color-background-surface-member,
-  ),
-  'member-alt': (
-    'undefined': $cdr-color-background-surface-member-alt,
-  ),
 );
 $surface-border-colors: (
   'primary': (
diff --git a/src/types/interfaces.ts b/src/types/interfaces.ts
index 10b2f52ce..cc7dbbc07 100644
--- a/src/types/interfaces.ts
+++ b/src/types/interfaces.ts
@@ -159,7 +159,7 @@ export interface surface extends HtmlAttributes {
   /**
    * Adds in a background color based on the current palette's tokens.
    * @demoSelectMultiple false
-   * @values primary, secondary, brand-spruce, sale, member, member-alt
+   * @values primary, secondary, brand-spruce, sale
    */
   background?: Background;
   /**
diff --git a/src/types/other.ts b/src/types/other.ts
index 9248a53c4..b7efc4a91 100644
--- a/src/types/other.ts
+++ b/src/types/other.ts
@@ -26,13 +26,7 @@ export type SpaceFluid =
 export type SpaceScale = 'scale-0--1' | 'scale-3--4' | 'scale-3--5';
 export type Space = SpaceFixed | SpaceFluid | SpaceScale;
 export type Shadow = 'flat' | 'raised' | 'elevated' | 'floating' | 'lifted';
-export type Background =
-  | 'primary'
-  | 'secondary'
-  | 'brand-spruce'
-  | 'sale'
-  | 'member'
-  | 'member-alt';
+export type Background = 'primary' | 'secondary' | 'brand-spruce' | 'sale';
 export type Radius = 'sharp' | 'soft' | 'softer' | 'softest' | 'round';
 export type BorderColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
 export type BorderStyle = 'solid' | 'dotted' | 'dashed';

From a8a84ef5eaa39fb4a2466a1473cb82bb0066c470 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 23 Sep 2024 11:23:01 -0700
Subject: [PATCH 67/70] tokens version

---
 package-lock.json | 2 +-
 package.json      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 4041e3e63..18cba0cd5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,7 +14,7 @@
       "devDependencies": {
         "@babel/preset-env": "^7.18.2",
         "@emotion/is-prop-valid": "^1.2.1",
-        "@rei/cdr-tokens": "github:rei/rei-cedar-tokens#pr/surface-selection",
+        "@rei/cdr-tokens": "^12.3.0",
         "@rei/cedar-icons": "^2.6.1",
         "@rollup/plugin-babel": "^6.0.3",
         "@types/tabbable": "^3.1.2",
diff --git a/package.json b/package.json
index de46a311b..555b6ef3e 100644
--- a/package.json
+++ b/package.json
@@ -58,7 +58,7 @@
   "devDependencies": {
     "@babel/preset-env": "^7.18.2",
     "@emotion/is-prop-valid": "^1.2.1",
-    "@rei/cdr-tokens": "github:rei/rei-cedar-tokens#pr/surface-selection",
+    "@rei/cdr-tokens": "^12.3.0",
     "@rei/cedar-icons": "^2.6.1",
     "@rollup/plugin-babel": "^6.0.3",
     "@types/tabbable": "^3.1.2",

From 438a43031836f9cd8100d4cd656391e7c5370520 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 23 Sep 2024 12:35:28 -0700
Subject: [PATCH 68/70] progress

---
 .editorconfig | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/.editorconfig b/.editorconfig
index 257e03267..720f1c139 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -8,7 +8,3 @@ indent_style = space
 insert_final_newline = true
 trim_trailing_whitespace = true
 max_line_length = 100
-
-[*.java]
-indent_style = space
-indent_size = 4

From 884b815c35df8da00c70d3d6922b6d8bd4a97383 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Mon, 23 Sep 2024 15:28:15 -0700
Subject: [PATCH 69/70] title updates

---
 src/components/fulfillmentTile/CdrFulfillmentTile.vue         | 2 +-
 src/components/fulfillmentTile/CdrFulfillmentTileContent.vue  | 2 +-
 src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue   | 2 +-
 src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue     | 2 +-
 src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue   | 2 +-
 src/components/surface/CdrSurface.vue                         | 2 +-
 src/components/surfaceSelection/CdrSurfaceSelection.vue       | 2 +-
 src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue | 2 +-
 8 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/fulfillmentTile/CdrFulfillmentTile.vue b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
index 1c81415bc..d93cb287d 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTile.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTile.vue
@@ -9,7 +9,7 @@ import CdrFulfillmentTileContent from './CdrFulfillmentTileContent.vue';
 import CdrSkeleton from '../skeleton/CdrSkeleton.vue';
 import CdrSkeletonBone from '../skeleton/CdrSkeletonBone.vue';
 
-/** Displays a button with optional icon in the header */
+/** Displays a composed selection option and provides feedback with optional icons */
 
 defineOptions({ name: 'CdrFulfillmentTile' });
 
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
index b41eace95..d61836df9 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileContent.vue
@@ -3,7 +3,7 @@ import { useCssModule, computed } from 'vue';
 import CdrBody, { type bodyTextProps } from '../text/presets/CdrBody.vue';
 import { fulfillmentTileContent } from '../../types/interfaces';
 
-/** Content component for fulfillment tile */
+/** Content component with scale option for fulfillment tile */
 
 defineOptions({ name: 'CdrFulfillmentTileContent' });
 
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
index 18dc35a8f..a49634d52 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileHeader.vue
@@ -4,7 +4,7 @@ import CdrSubheadingSans from '../text/presets/CdrSubheadingSans.vue';
 import CdrFulfillmentTileLayout from './CdrFulfillmentTileLayout.vue';
 import { surfaceSelectionLayout } from '../../types/interfaces';
 
-/** Fulfillment tile header component */
+/** Header component with icon slot for fulfillment tile */
 
 defineOptions({ name: 'CdrFulfillmentTileHeader' });
 
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue b/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue
index a25039bde..eecd293dd 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileIcon.vue
@@ -2,7 +2,7 @@
 import { useCssModule, computed } from 'vue';
 import { fulfillmentTileIcon } from '../../types/interfaces';
 
-/** Provides stylized icons for typical notifications */
+/** Stylized icon to display a status for fulfillment tile */
 
 defineOptions({ name: 'CdrFulfillmentTileIcon' });
 
diff --git a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
index c12be1bc4..26e197b43 100644
--- a/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
+++ b/src/components/fulfillmentTile/CdrFulfillmentTileLayout.vue
@@ -3,7 +3,7 @@ import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
 import { surfaceSelectionLayout } from '../../types/interfaces';
 
-/** Component for layout of a surface selection */
+/** Configurable layout for fulfillment tile */
 
 defineOptions({ name: 'CdrFulfillmentTileLayout' });
 
diff --git a/src/components/surface/CdrSurface.vue b/src/components/surface/CdrSurface.vue
index 8a00e44f7..95ec2a506 100644
--- a/src/components/surface/CdrSurface.vue
+++ b/src/components/surface/CdrSurface.vue
@@ -4,7 +4,7 @@ import mapClasses from '../../utils/mapClasses';
 import type { surface } from '../../types/interfaces';
 import { getSurfaceProps } from '../../utils/surface';
 
-/** Base component for all other components */
+/** Foundational container for creating structured layouts */
 
 defineOptions({ name: 'CdrSurface' });
 
diff --git a/src/components/surfaceSelection/CdrSurfaceSelection.vue b/src/components/surfaceSelection/CdrSurfaceSelection.vue
index 7e020f07d..9c1e15637 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelection.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelection.vue
@@ -7,7 +7,7 @@ import { surfaceSelection } from '../../types/interfaces';
 import { getSurfaceSelectionProps } from '../../utils/surface';
 import CdrSurfaceSelectionLayout from './CdrSurfaceSelectionLayout.vue';
 
-/** Base component for buttons that have a checked state */
+/** Base component for user selections that have a checked state */
 
 defineOptions({ name: 'CdrSurfaceSelection' });
 
diff --git a/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
index a6b170799..e91bc3942 100644
--- a/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
+++ b/src/components/surfaceSelection/CdrSurfaceSelectionLayout.vue
@@ -3,7 +3,7 @@ import { useCssModule, computed } from 'vue';
 import mapClasses from '../../utils/mapClasses';
 import { surfaceSelectionLayout } from '../../types/interfaces';
 
-/** Component for layout of a surface selection */
+/** Configurable layout for surface selection */
 
 defineOptions({ name: 'CdrSurfaceSelectionLayout' });
 

From 8b54be2493859b371eb0e166827a847b28dc8d11 Mon Sep 17 00:00:00 2001
From: David Sinclair <dsincla@rei.com>
Date: Tue, 24 Sep 2024 10:02:20 -0700
Subject: [PATCH 70/70] unit test warnings

---
 .../chip/__tests__/CdrChipGroup.spec.js       |   4 +-
 src/components/input/CdrInput.vue             |   8 +-
 .../input/__tests__/CdrInput.spec.js          |   2 +-
 .../__tests__/CdrLandingLead.spec.js          |  15 +-
 .../__snapshots__/CdrLandingLead.spec.js.snap |   7 +-
 .../modal/__tests__/CdrModal.spec.js          |   1 -
 .../__tests__/CdrPagination.spec.js           | 139 +-----------------
 .../picture/__tests__/CdrPicture.spec.js      |  11 +-
 .../__snapshots__/CdrPicture.spec.js.snap     |   1 +
 .../select/__tests__/CdrSelect.spec.js        |  59 +-------
 .../__snapshots__/CdrSelect.spec.js.snap      |   5 +-
 .../skeleton/__tests__/CdrSkeleton.spec.js    |   2 +-
 .../__snapshots__/CdrSkeleton.spec.js.snap    |   2 +-
 src/utils/__tests__/propValidator.spec.js     |   3 +-
 src/utils/propValidator.ts                    |  29 +++-
 test/setup.js                                 |   2 -
 16 files changed, 56 insertions(+), 234 deletions(-)
 delete mode 100644 test/setup.js

diff --git a/src/components/chip/__tests__/CdrChipGroup.spec.js b/src/components/chip/__tests__/CdrChipGroup.spec.js
index 1c5b9fe2d..65972b029 100644
--- a/src/components/chip/__tests__/CdrChipGroup.spec.js
+++ b/src/components/chip/__tests__/CdrChipGroup.spec.js
@@ -24,7 +24,7 @@ describe('CdrChipGroup', () => {
       })
       chips = wrapper.findAll('.cdr-chip').map(domWrapper => domWrapper.element);
     })
-    
+
     it('renders correctly', () => {
       expect(wrapper.element).toMatchSnapshot();
     });
@@ -91,7 +91,7 @@ describe('CdrChipGroup', () => {
             h(CdrChip, { 'aria-checked': true, tabindex: 0, role: 'radio' }, { default: () => 'chip 1' }),
             h(CdrChip, { 'aria-checked': false, tabindex: -1, role: 'radio' }, { default: () => 'chip 2' }),
           ],
-          label: 'hey im overriding here!!!',
+          label: () => 'hey im overriding here!!!',
         },
       ));
     })
diff --git a/src/components/input/CdrInput.vue b/src/components/input/CdrInput.vue
index b426eda39..11e8eddb3 100644
--- a/src/components/input/CdrInput.vue
+++ b/src/components/input/CdrInput.vue
@@ -129,16 +129,16 @@ const isFocused = ref(false);
 const hasHelperTop = slots['helper-text-top'];
 const hasHelperBottom = slots['helper-text-bottom'];
 const hasPreIcon = slots['pre-icon'];
-const hasPostIcon = slots['post-icon'];
-const hasPostIcons = slots['post-icon'] ? slots['post-icon']().length > 1 : false;
+const hasPostIcon = computed(() => slots['post-icon']);
+const hasPostIcons = computed(() => slots['post-icon'] ? slots['post-icon']().length > 1 : false);
 const hasInfo = slots.info;
 const hasInfoAction = slots['info-action'];
 
 const uniqueId = props.id ? props.id : uid();
 const multilineClass = computed(() => props.rows > 1 ? 'cdr-input--multiline' : '');
 const preIconClass = computed(() => hasPreIcon ? 'cdr-input--preicon' : '');
-const postIconClass = computed(() => hasPostIcon ? 'cdr-input--posticon' : '');
-const postIconsClass = computed(() => hasPostIcons ? 'cdr-input--posticons' : '');
+const postIconClass = computed(() => hasPostIcon.value ? 'cdr-input--posticon' : '');
+const postIconsClass = computed(() => hasPostIcons.value ? 'cdr-input--posticons' : '');
 const errorClass = computed(() => props.error ? 'cdr-input--error' : '');
 const backgroundClass = computed(() => `cdr-input--${props.background}`);
 const sizeClass = computed(() => props.size ? `${baseClass}--${props.size}` : '');
diff --git a/src/components/input/__tests__/CdrInput.spec.js b/src/components/input/__tests__/CdrInput.spec.js
index 8eee653b1..d2c39e1cd 100644
--- a/src/components/input/__tests__/CdrInput.spec.js
+++ b/src/components/input/__tests__/CdrInput.spec.js
@@ -40,7 +40,7 @@ describe('CdrInput', () => {
       input.setValue('foo');
       expect(wrapper.emitted()['update:modelValue'][0][0]).toBe('foo');
     });
-    
+
     describe('with prop type of "number"', () => {
       beforeEach(() => {
         wrapper.setProps({ type: 'number' })
diff --git a/src/components/landingLead/__tests__/CdrLandingLead.spec.js b/src/components/landingLead/__tests__/CdrLandingLead.spec.js
index cffab2257..003796a09 100644
--- a/src/components/landingLead/__tests__/CdrLandingLead.spec.js
+++ b/src/components/landingLead/__tests__/CdrLandingLead.spec.js
@@ -3,13 +3,14 @@ import CdrLandingLead from '../CdrLandingLead.vue';
 
 describe('CdrLandingLead', () => {
   it('renders correctly when presented with correct data', () => {
-    const wrapper = mount(CdrLandingLead);
-    wrapper.setProps({
-      imgSrc: 'lead.jpg',
-      imgAlt: 'alt',
-      heading: 'Heading',
-      subheading: 'Subheading',
-    })
+    const wrapper = mount(CdrLandingLead, {
+      props: {
+        imgSrc: 'lead.jpg',
+        imgAlt: 'alt',
+        heading: 'Heading',
+        subheading: 'Subheading',
+      },
+    });
     expect(wrapper.element).toMatchSnapshot();
   });
 });
diff --git a/src/components/landingLead/__tests__/__snapshots__/CdrLandingLead.spec.js.snap b/src/components/landingLead/__tests__/__snapshots__/CdrLandingLead.spec.js.snap
index 7fcb34a38..176aa8728 100644
--- a/src/components/landingLead/__tests__/__snapshots__/CdrLandingLead.spec.js.snap
+++ b/src/components/landingLead/__tests__/__snapshots__/CdrLandingLead.spec.js.snap
@@ -10,8 +10,9 @@ exports[`CdrLandingLead > renders correctly when presented with correct data 1`]
     <!-- @slot top slot -->
     
     <img
-      alt=""
+      alt="alt"
       class="cdr-image cdr-landing-lead__image"
+      src="lead.jpg"
     />
     
   </div>
@@ -29,7 +30,7 @@ exports[`CdrLandingLead > renders correctly when presented with correct data 1`]
       >
         
         
-         
+        Heading 
         
         
       </h1>
@@ -39,7 +40,7 @@ exports[`CdrLandingLead > renders correctly when presented with correct data 1`]
       >
         
         
-        
+        Subheading
         
         
       </span>
diff --git a/src/components/modal/__tests__/CdrModal.spec.js b/src/components/modal/__tests__/CdrModal.spec.js
index 34566bca6..501042e08 100644
--- a/src/components/modal/__tests__/CdrModal.spec.js
+++ b/src/components/modal/__tests__/CdrModal.spec.js
@@ -171,7 +171,6 @@ describe('CdrModal.vue', () => {
       });
 
       it('sets the dialog class', () => {
-      console.log(dialogEl.classes());
         const innerWrapEl = dialogEl.find('.cdr-modal__innerWrap');
         expect(innerWrapEl.classes('content-class')).to.be.true;
       });
diff --git a/src/components/pagination/__tests__/CdrPagination.spec.js b/src/components/pagination/__tests__/CdrPagination.spec.js
index 61246546f..62fdad9c7 100644
--- a/src/components/pagination/__tests__/CdrPagination.spec.js
+++ b/src/components/pagination/__tests__/CdrPagination.spec.js
@@ -244,141 +244,4 @@ describe('CdrPagination', () => {
       expect(onlyPrevLinkExists(wrapper)).toBe(true);
     });
   });
-
-  //TODO: This should be an integration test
-  describe('pagination events', () => {
-    let wrapper;
-    let prev;
-    let next
-    beforeEach(() => {
-      wrapper = mount(CdrPagination, {
-        propsData: {
-          id: 'test',
-          pages: makePages(20),
-          modelValue: 5,
-        },
-        // TODO: uhhh what?
-        attrs: {
-          'onUpdate:modelValue': async (newVal) => { // simulate v-model update
-            wrapper.setProps({ modelValue: newVal });
-            await wrapper.vm.$nextTick();
-          }
-        }
-      });
-      next = wrapper.find('a .cdr-pagination_caret--next');
-      prev = wrapper.find('a .cdr-pagination_caret--prev');
-    });
-
-    it('selecting an option triggers the expected event', async () => {
-      const options = wrapper.findAll('option');
-      await options[0].setSelected();  // 5 -> 3
-      await wrapper.vm.$nextTick();
-      expect(wrapper.emitted().navigate[0][0]).toBe(1);
-      expect(wrapper.emitted().navigate[0][1]).toBe('?page=1');
-      expect(wrapper.emitted().navigate[0][2] instanceof Event).toBeTruthy();
-    });
-
-    it('clicking next triggers the expected event', async () => {
-      next.trigger('click'); // 5 -> 6
-      await wrapper.vm.$nextTick();
-
-      expect(wrapper.emitted().navigate[0][0]).toBe(6);
-      expect(wrapper.emitted().navigate[0][1]).toBe('?page=6');
-      expect(wrapper.emitted().navigate[0][2] instanceof Event).toBeTruthy();
-    });
-
-    it('clicking prev triggers the expected event', async () => {
-      prev.trigger('click'); // 5 -> 4
-      await wrapper.vm.$nextTick();
-
-      expect(wrapper.emitted().navigate[0][0]).toBe(4);
-      expect(wrapper.emitted().navigate[0][1]).toBe('?page=4');
-      expect(wrapper.emitted().navigate[0][2] instanceof Event).toBeTruthy();
-    });
-
-    it('clicking an individual link triggers the expected event', async () => {
-      // individual links
-      let link = wrapper.findAll('ol > li > a')[1];
-      link.trigger('click'); // 5 -> 1
-      await wrapper.vm.$nextTick();
-
-      expect(wrapper.emitted().navigate[0][0]).toBe(1);
-      expect(wrapper.emitted().navigate[0][1]).toBe('?page=1');
-      expect(wrapper.emitted().navigate[0][2] instanceof Event).toBeTruthy();
-    });
-
-    it('simulated click emits an event when the link is invisible', async () => {
-      // individual links
-      let link = wrapper.findAll('ol > li > a')[1];
-      link.trigger('click'); // 5 -> 1
-      await wrapper.vm.$nextTick();
-
-      expect(wrapper.emitted().navigate[0][0]).toBe(1);
-      expect(wrapper.emitted().navigate[0][1]).toBe('?page=1');
-      expect(wrapper.emitted().navigate[0][2] instanceof Event).toBeTruthy();
-
-
-      link.trigger('click'); // 1 -> 1
-      await wrapper.vm.$nextTick();
-      expect(wrapper.emitted().navigate[1][0]).toBe(1);
-      expect(wrapper.emitted().navigate[1][1]).toBe('?page=1');
-      expect(wrapper.emitted().navigate[1][2] instanceof Event).toBeTruthy();
-    });
-
-    it('does NOT add "of x" when a total is NOT provided', async () => {
-      let option = wrapper.find('option');
-      expect(option.text()).toBe('Page 1');
-    });
-
-    describe('when totalPage prop is set', () => {
-      let option;
-      beforeEach(() => {
-        wrapper.setProps({ totalPages: 20 });
-        option = wrapper.find('option');
-      });
-
-      it('adds page "of x" text to the option', async () => {
-        expect(option.text()).toBe('Page 1 of 20');
-      });
-
-      describe('when current link is visible', () => {
-        let link;
-        let originalOffsetHeight;
-        let originalOffsetWidth;
-        beforeEach(() => {
-          //TODO: This setup seems strange. How would this ever happen? -- Kenji
-          originalOffsetHeight = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'offsetHeight');
-          originalOffsetWidth = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'offsetWidth');
-          //Ensure link is visible
-          Object.defineProperty(HTMLElement.prototype, 'offsetHeight', {
-            configurable: true,
-            value: 10,
-          });
-          Object.defineProperty(HTMLElement.prototype, 'offsetWidth', {
-            configurable: true, value: 10
-          });
-          link = wrapper.findAll('ol > li > a')[1];
-        });
-
-        afterEach(() => {
-          Object.defineProperty(HTMLElement.prototype, 'offsetHeight', originalOffsetHeight);
-          Object.defineProperty(HTMLElement.prototype, 'offsetWidth', originalOffsetWidth);
-        })
-
-        it('clicking the active link does not emit a new event', async () => {
-          link.trigger('click'); // 5 -> 1
-          await wrapper.vm.$nextTick();
-
-          expect(wrapper.emitted().navigate[0][0]).toBe(1);
-          expect(wrapper.emitted().navigate[0][1]).toBe('?page=1');
-          expect(wrapper.emitted().navigate[0][2] instanceof Event).toBeTruthy();
-
-          link.trigger('click'); // 5 -> 1
-          await wrapper.vm.$nextTick();
-
-          expect(wrapper.emitted().navigate[1]).toBe(undefined);
-        });
-      });
-    });
-  });
-});
\ No newline at end of file
+});
diff --git a/src/components/picture/__tests__/CdrPicture.spec.js b/src/components/picture/__tests__/CdrPicture.spec.js
index c8a32685f..ffa16edb6 100644
--- a/src/components/picture/__tests__/CdrPicture.spec.js
+++ b/src/components/picture/__tests__/CdrPicture.spec.js
@@ -5,6 +5,7 @@ describe('CdrPicture', () => {
   it('matches snapshot', () => {
     const wrapper = shallowMount(CdrPicture, {
       props: {
+        src: '/src/dev/static/cedar-350x150.jpg',
         sources: {
           xs: {
             media: '(max-width: 768px)',
@@ -12,11 +13,11 @@ describe('CdrPicture', () => {
             width: '300',
           },
           sm: {
-          media: '(min-width: 768px)',
-          srcset: '/src/dev/static/cedar-1920x1080.jpg',
-          }
-        }
-      }
+            media: '(min-width: 768px)',
+            srcset: '/src/dev/static/cedar-1920x1080.jpg',
+          },
+        },
+      },
     });
     expect(wrapper.element).toMatchSnapshot();
   });
diff --git a/src/components/picture/__tests__/__snapshots__/CdrPicture.spec.js.snap b/src/components/picture/__tests__/__snapshots__/CdrPicture.spec.js.snap
index c5112b799..b4894949b 100644
--- a/src/components/picture/__tests__/__snapshots__/CdrPicture.spec.js.snap
+++ b/src/components/picture/__tests__/__snapshots__/CdrPicture.spec.js.snap
@@ -17,6 +17,7 @@ exports[`CdrPicture > matches snapshot 1`] = `
   
   <cdr-img-stub
     alt=""
+    src="/src/dev/static/cedar-350x150.jpg"
   />
 </picture>
 `;
diff --git a/src/components/select/__tests__/CdrSelect.spec.js b/src/components/select/__tests__/CdrSelect.spec.js
index 38efc4221..bc3eb2b94 100644
--- a/src/components/select/__tests__/CdrSelect.spec.js
+++ b/src/components/select/__tests__/CdrSelect.spec.js
@@ -9,7 +9,7 @@ describe('CdrSelect', () => {
       wrapper = mount(CdrSelect, {
         propsData: {
           label: 'Label Test',
-          id: 'renders'
+          id: 'renders',
         },
         attrs: {
           name: 'testing',
@@ -69,7 +69,7 @@ describe('CdrSelect', () => {
 
     describe('with a required prop', () => {
       beforeEach(() => {
-        wrapper.setProps({ required: true })
+        wrapper.setProps({ modelValue: [], required: true })
       })
 
       it('renders correctly', () => {
@@ -84,7 +84,7 @@ describe('CdrSelect', () => {
       beforeEach(() => {
         wrapper.setProps({
           multiple: true,
-          value: []
+          modelValue: []
         })
       })
 
@@ -352,57 +352,4 @@ describe('CdrSelect', () => {
       expect(wrapper.find('select').attributes('aria-describedby')).toBe(undefined);
     });
   })
-
-
-
-  // TODO: something wrong with v-model binding for CdrSelect?
-  // xit('emits change event with correct value', async () => {
-  //   const wrapper = mount(CdrSelect, {
-  //     propsData: {
-  //       label: 'test',
-  //       value: '4',
-  //       options: ['3', '4'],
-  //       id: 'test',
-  //     },
-  //   });
-  //   const select = wrapper.find('select');
-  //   const options = select.findAll('option');
-  //   options[0].setSelected();
-  //   await wrapper.vm.$nextTick();
-  //   expect(wrapper.emitted().change[0][0]).toBe('3');
-  //   expect(wrapper.emitted().change[0][1] instanceof Event).toBeTruthy();
-  // });
-
-  // xit('emits change event with correct value for multiple', () => {
-  //   const wrapper = mount(CdrSelect, {
-  //     propsData: {
-  //       label: 'test',
-  //       multiple: true,
-  //       id: 'test',
-  //       value: ['1', '2'],
-  //       options: [{
-  //         value: '1',
-  //         text: 'one',
-  //       },
-  //       {
-  //         value: '2',
-  //         text: 'two',
-  //       },
-  //       {
-  //         value: '3',
-  //         text: 'three',
-  //       }],
-  //     },
-  //   });
-  //   const select = wrapper.find('select');
-  //   const options = select.findAll('option');
-  //   console.log('multiple opt', options)
-  //   options[0].element.selected = true;
-  //   options[1].element.selected = false;
-  //   options[2].element.selected = true;
-  //   select.trigger('change');
-  //   console.log('multi', wrapper.emitted())
-  //   expect(wrapper.emitted().change[0][0]).toEqual(['1', '3']);
-  //   expect(wrapper.emitted().change[0][1] instanceof Event).toBeTruthy();
-  // });
 });
diff --git a/src/components/select/__tests__/__snapshots__/CdrSelect.spec.js.snap b/src/components/select/__tests__/__snapshots__/CdrSelect.spec.js.snap
index 16478f46f..625ac6bbe 100644
--- a/src/components/select/__tests__/__snapshots__/CdrSelect.spec.js.snap
+++ b/src/components/select/__tests__/__snapshots__/CdrSelect.spec.js.snap
@@ -244,7 +244,7 @@ exports[`CdrSelect > default configuration with a name attribute > with a requir
       <!--v-if-->
       <select
         aria-required="true"
-        class="cdr-select cdr-select__prompt cdr-select--primary"
+        class="cdr-select cdr-select--primary"
         id="renders"
         name="testing"
       >
@@ -313,11 +313,10 @@ exports[`CdrSelect > default configuration with a name attribute > with a requir
     >
       <!--v-if-->
       <select
-        class="cdr-select cdr-select__prompt cdr-select--multiple cdr-select--primary"
+        class="cdr-select cdr-select--multiple cdr-select--primary"
         id="renders"
         multiple=""
         name="testing"
-        value=""
       >
         <!--v-if-->
         
diff --git a/src/components/skeleton/__tests__/CdrSkeleton.spec.js b/src/components/skeleton/__tests__/CdrSkeleton.spec.js
index 3f5d94726..7e7db19cb 100644
--- a/src/components/skeleton/__tests__/CdrSkeleton.spec.js
+++ b/src/components/skeleton/__tests__/CdrSkeleton.spec.js
@@ -12,7 +12,7 @@ describe('CdrSkeleton', () => {
         slots: {
           default: [
             h(CdrSkeletonBone, { type: 'heading'}),
-            h(CdrSkeletonBone, { type: 'text'}),
+            h(CdrSkeletonBone, { type: 'line'}),
           ],
         },
         attachTo: document.body
diff --git a/src/components/skeleton/__tests__/__snapshots__/CdrSkeleton.spec.js.snap b/src/components/skeleton/__tests__/__snapshots__/CdrSkeleton.spec.js.snap
index 7b1353612..699089219 100644
--- a/src/components/skeleton/__tests__/__snapshots__/CdrSkeleton.spec.js.snap
+++ b/src/components/skeleton/__tests__/__snapshots__/CdrSkeleton.spec.js.snap
@@ -12,7 +12,7 @@ exports[`CdrSkeleton > component snapshot > matches the snapshot 1`] = `
     class="cdr-skeleton-bone cdr-skeleton-bone--heading cdr-skeleton-bone__shimmer"
   />
   <div
-    class="cdr-skeleton-bone cdr-skeleton-bone--text cdr-skeleton-bone__shimmer"
+    class="cdr-skeleton-bone cdr-skeleton-bone--line cdr-skeleton-bone__shimmer"
   />
   
 </div>
diff --git a/src/utils/__tests__/propValidator.spec.js b/src/utils/__tests__/propValidator.spec.js
index 25210e36c..0ee807dbe 100644
--- a/src/utils/__tests__/propValidator.spec.js
+++ b/src/utils/__tests__/propValidator.spec.js
@@ -7,8 +7,7 @@ describe('propValidator', () => {
   });
 
   it('invalidates correctly', () => {
-    const valid = propValidator('ba', ['b', 'a']);
+    const valid = propValidator('ba', ['b', 'a'], false, () => null);
     expect(valid).toBeFalsy();
   });
 });
-
diff --git a/src/utils/propValidator.ts b/src/utils/propValidator.ts
index f1ea291e4..a413ee54f 100644
--- a/src/utils/propValidator.ts
+++ b/src/utils/propValidator.ts
@@ -1,27 +1,40 @@
+type ErrorHandler = null | ((x: string) => void);
+
 /**
  * Validates space separated string against an array of accepted values.
  * @param {String} propValue -- Space separated string (provided by the user)
  * @param {Array} validArr -- Array of values that are considered "valid"
  * @param {Boolean} responsive -- Enables validation of validArr values with '@sm', '@md', '@lg' added to them
+ * @param {Function} handler -- Allows for handling any errors
  */
-function validateProp(propValue: string, validArr: string[], responsive = true) {
+function validateProp(
+  propValue: string,
+  validArr: string[],
+  responsive = true,
+  handler: ErrorHandler = null,
+) {
   const strArr = propValue.split(' ');
   return strArr.every((mod) => {
     const modValid = validArr.some((validStr) => {
       if (responsive) {
         return (
-          mod === validStr
-          || mod === `${validStr}@xs`
-          || mod === `${validStr}@sm`
-          || mod === `${validStr}@md`
-          || mod === `${validStr}@lg`
+          mod === validStr ||
+          mod === `${validStr}@xs` ||
+          mod === `${validStr}@sm` ||
+          mod === `${validStr}@md` ||
+          mod === `${validStr}@lg`
         );
       }
 
-      return (mod === validStr);
+      return mod === validStr;
     });
     if (!modValid) {
-      console.error(`Invalid prop value: ${mod}`); // eslint-disable-line no-console
+      if (handler) {
+        handler(`Invalid prop value: ${mod}`);
+      } else {
+        // eslint-disable-next-line no-console
+        console.error(`Invalid prop value: ${mod}`);
+      }
     }
     return modValid;
   });
diff --git a/test/setup.js b/test/setup.js
deleted file mode 100644
index 428847126..000000000
--- a/test/setup.js
+++ /dev/null
@@ -1,2 +0,0 @@
-require('jsdom-global')();
-window.Date = Date;