tide-design-system 2.0.0

package/dist/style.css

@@ -0,0 +1 @@
+@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap";.tide-icon svg[data-v-335984a7]{width:1.5rem;height:1.5rem}.tide-icon.small svg[data-v-335984a7]{width:1.25rem;height:1.25rem}.tide-indicator[data-v-c83d0232]{width:.5rem;height:.5rem}.tide-indicator-label[data-v-c83d0232]{width:1rem;height:1rem}.tide-accordion-body[data-v-8d7c88a9]{transition:grid-template-rows var(--animate)}.tide-alert{grid-template-areas:"icon heading close" ". body .";grid-template-columns:auto 1fr auto;grid-column-gap:.5rem;max-width:40rem}.tide-alert-icon{grid-area:icon}.tide-alert-heading{grid-area:heading}.tide-alert-close{grid-area:close}.tide-alert-body{grid-area:body}.error{background-color:var(--error-surface)}.info{background-color:var(--info-surface)}.success{background-color:var(--success-surface)}.warning{background-color:var(--warning-surface)}.tide-icon.error{background-color:var(--error-primary)}.tide-icon.info{background-color:var(--info-primary)}.tide-icon.success{background-color:var(--success-primary)}.tide-icon.warning{background-color:var(--warning-primary)}.tide-button-icon[data-v-da022c05],.tide-link-as-button-icon[data-v-da022c05]{border:1px solid var(--white);background:var(--white);color:var(--secondary)}.tide-button-icon[data-v-da022c05]:not(:disabled):hover,.tide-link-as-button-icon[data-v-da022c05]:not(:disabled):hover{border:1px solid var(--surface-variant);background:var(--surface-variant)}.tide-button-icon[data-v-da022c05]:disabled,.tide-link-as-button-icon[data-v-da022c05]:disabled{border:1px solid var(--border-high)}.tide-button-icon .label[data-v-da022c05],.tide-link-as-button-icon .label[data-v-da022c05]{width:1.5rem;height:1.5rem}.tide-chip-action[data-v-075e9916]:hover{background-color:var(--surface-variant);border-color:var(--border-high)}.tide-chip-filter[data-v-7cdf9402]{border-color:var(--surface-variant)}.tide-chip-filter.active[data-v-7cdf9402]{border-color:var(--secondary)}.tide-chip-filter[data-v-7cdf9402]:hover{background-color:var(--surface-variant);border-color:var(--border);color:var(--on-surface)}.tide-chip-input[data-v-ac1feac9]:hover{background-color:var(--surface-variant);border-color:var(--border-high)}ul.tide-display-flex.tide-flex-wrap>.tide-columns-column{width:100%}@media (min-width: 992px){ul.tide-display-flex.tide-flex-wrap>.tide-columns-column{width:calc((100% - 2rem)/2)}}@media (min-width: 1232px){ul.tide-display-flex.tide-flex-wrap>.tide-columns-column{width:calc((100% - 6rem)/4)}}.tide-svg-icon svg[data-v-fecfca9d]{width:1.5rem;height:1.5rem}.tide-svg-icon.small svg[data-v-fecfca9d]{width:1rem;height:1rem}select[data-v-b1bb4363]{-webkit-appearance:none;-moz-appearance:none;appearance:none}textarea[data-v-18902ba3]{resize:vertical}.tide-modal-bg[data-v-33d67c7c]{transition:backdrop-filter .3s ease,background-color .3s ease;background:rgba(255,255,255,.3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.tide-modal[data-v-33d67c7c]{width:var(--modal-width);max-width:calc(100% - 2rem);max-height:calc(100% - 2rem);box-shadow:0 10px 25px #122b3a33;animation:modalOpen .3s ease}.modal-header[data-v-33d67c7c]{min-height:5rem}.modal-content[data-v-33d67c7c]{display:grid;grid-template-columns:2rem 1fr 2rem}.modal-content[data-v-33d67c7c]>*{grid-column:2}.v-enter-from[data-v-33d67c7c],.v-leave-to[data-v-33d67c7c]{-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);background-color:#fff0}.v-enter-from .tide-modal[data-v-33d67c7c],.v-leave-to .tide-modal[data-v-33d67c7c]{transform:translateY(100vh)}.v-enter-active[data-v-33d67c7c],.v-leave-active[data-v-33d67c7c]{transition:backdrop-filter var(--animate),background-color var(--animate)}.v-enter-active .tide-modal[data-v-33d67c7c],.v-leave-active .tide-modal[data-v-33d67c7c]{transition:transform var(--animate)}.v-enter-to[data-v-33d67c7c],.v-leave-from[data-v-33d67c7c]{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#ffffff4d}.v-enter-to .tide-modal[data-v-33d67c7c],.v-leave-from .tide-modal[data-v-33d67c7c]{transform:translateY(0)}ul.tide-display-flex.tide-flex-wrap>.tide-width-1\/4{width:100%}@media (min-width: 992px){ul.tide-display-flex.tide-flex-wrap>.tide-width-1\/4{width:calc((100% - 2rem)/2)}}@media (min-width: 1232px){ul.tide-display-flex.tide-flex-wrap>.tide-width-1\/4{width:calc((100% - 6rem)/4)}}.tide-tabs[data-v-bbd05072]{max-width:23.3rem}.tide-tabs-tab[data-v-bbd05072]{flex:1;transition:background-color var(--animate)}.tide-toggle[data-v-a4d75625]{width:64px;height:32px;transition:background-color var(--animate)}.tide-toggle[data-v-a4d75625]:disabled{opacity:.32}.tide-toggle-indicator[data-v-a4d75625]{left:4px;width:24px;height:24px;transition:left var(--animate)}.active[data-v-a4d75625]{left:36px}:root{--font-12: .75rem;--font-14: .875rem;--font-16: 1rem;--font-20: 1.25rem;--font-24: 1.5rem;--font-28: 1.75rem;--font-32: 2rem;--font-400: 400;--font-500: 500;--font-600: 600;--font-700: 700;--animate: .3s ease-in-out;--spacing-0: 0rem;--spacing-1\/4: .25rem;--spacing-1\/2: .5rem;--spacing-1: 1rem;--spacing-2: 2rem;--spacing-4: 4rem;--border-width-1: 1px;--border-width-2: 2px;--border-1: var(--border-width-1) solid var(--black);--border-2: var(--border-width-2) solid var(--black);--radius-1\/4: 4px;--radius-1\/2: 8px;--radius-1: 16px;--radius-full: 99999px;--blue-100: #D1E0EB;--blue-200: #A4C1D7;--blue-300: #76A3C4;--blue-400: #4984B0;--gray-100: #FFFFFF;--gray-200: #F5F5F5;--gray-300: #E4E4E4;--gray-400: #C9CACB;--gray-500: #AEAFB2;--gray-600: #939598;--gray-700: #6E7072;--gray-800: #494A4C;--gray-900: #252526;--gray-1000: #000000;--green-100: #E6EFCF;--green-200: #CDE09E;--green-300: #B4D06E;--green-400: #9BC13D;--red-100: #EFCFCF;--red-200: #E09E9E;--red-300: #D06E6E;--red-400: #C13D3D;--red-500: #912E2E;--yellow-100: #FEF2CC;--yellow-200: #FCE499;--yellow-300: #FBD766;--yellow-400: #FACA33;--black: var(--gray-900);--white: var(--gray-100);--shadow-bottom: 0px 2px 8px 2px rgba(0, 0, 0, .07);--shadow-top: 0px -2px 8px 2px rgba(0, 0, 0, .07);--transparent-100: rgba(255, 255, 255, .9);--transparent-200: rgba(255, 255, 255, .75);--transparent-300: rgba(0, 0, 0, .1);--transparent-400: rgba(0, 0, 0, .5);--error-primary: var(--red-400);--error-primary-border: var(--red-300);--error-surface: var(--red-100);--error-border: var(--red-200);--error-border-low: var(--red-200);--error-border-high: var(--red-200);--error-on-surface: var(--red-200);--error-on-surface-variant: var(--red-200);--info-primary: var(--blue-400);--info-primary-border: var(--blue-300);--info-surface: var(--blue-100);--info-border: var(--blue-200);--success-primary: var(--green-400);--success-primary-border: var(--green-300);--success-surface: var(--green-100);--success-border: var(--green-200);--warning-primary: var(--yellow-400);--warning-primary-border: var(--yellow-300);--warning-surface: var(--yellow-100);--warning-border: var(--yellow-200)}html,body{color:var(--on-surface)}*,*:before,*:after{box-sizing:border-box;margin:0;border:0;padding:0;color:inherit;font-family:Montserrat;font-weight:var(--font-500);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1{font-size:var(--font-32)}h2{font-size:var(--font-24)}h3{font-size:var(--font-20)}h4,h5{font-size:var(--font-16)}h1,h2,h3,h4,h5{font-weight:var(--font-700)}img,label{display:block}img{max-width:100%}p{max-width:80ch;line-height:150%}button,input,option,select,textarea{background-color:unset;font-family:inherit;font-size:inherit}button:enabled,select{cursor:pointer}button:disabled{cursor:not-allowed}input::placeholder{color:var(--gray);opacity:1}input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration{display:none}.tide-position-absolute{position:absolute}.tide-position-fixed{position:fixed}.tide-position-relative{position:relative}.tide-position-sticky{position:sticky}.tide-top-0{top:0}.tide-right-0{right:0}.tide-bottom-0{bottom:0}.tide-left-0{left:0}.tide-display-block{display:block}.tide-display-contents{display:contents}.tide-display-flex{display:flex}.tide-display-grid{display:grid}.tide-display-initial{display:initial}.tide-display-inline{display:inline}.tide-display-inline-block{display:inline-block}.tide-display-inline-flex{display:inline-flex}.tide-display-none{display:none}.tide-flex-column{flex-direction:column}.tide-flex-column-reverse{flex-direction:column-reverse}.tide-flex-row{flex-direction:row}.tide-flex-row-reverse{flex-direction:row-reverse}.tide-grow{flex-grow:1}.tide-grow-none{flex-grow:0}.tide-shrink{flex-shrink:1}.tide-shrink-none{flex-shrink:0}.tide-flex-wrap{flex-wrap:wrap}.tide-axis1-around{justify-content:space-around}.tide-axis1-between{justify-content:space-between}.tide-axis1-center{justify-content:center}.tide-axis1-end{justify-content:end}.tide-axis2-around{align-items:space-around}.tide-axis2-center{align-items:center}.tide-axis2-end{align-items:flex-end}.tide-axis2-start{align-items:flex-start}.tide-axis2-stretch{align-items:stretch}.tide-gap-1\/4{gap:var(--spacing-1\/4)}.tide-gap-1\/2{gap:var(--spacing-1\/2)}.tide-gap-1{gap:var(--spacing-1)}.tide-gap-2{gap:var(--spacing-2)}.tide-gap-4{gap:var(--spacing-4)}.tide-box-border{box-sizing:border-box}.tide-box-content{box-sizing:content-box}.tide-margin-0{margin:0}.tide-margin-1\/4{margin:var(--spacing-1\/4)}.tide-margin-1\/2{margin:var(--spacing-1\/2)}.tide-margin-1{margin:var(--spacing-1)}.tide-margin-2{margin:var(--spacing-2)}.tide-margin-4{margin:var(--spacing-4)}.tide-margin-x-0{margin-left:0;margin-right:0}.tide-margin-x-1\/4{margin-left:var(--spacing-1\/4);margin-right:var(--spacing-1\/4)}.tide-margin-x-1\/2{margin-left:var(--spacing-1\/2);margin-right:var(--spacing-1\/2)}.tide-margin-x-1{margin-left:var(--spacing-1);margin-right:var(--spacing-1)}.tide-margin-x-2{margin-left:var(--spacing-2);margin-right:var(--spacing-2)}.tide-margin-x-4{margin-left:var(--spacing-4);margin-right:var(--spacing-4)}.tide-margin-x-auto{margin-left:auto;margin-right:auto}.tide-margin-y-0{margin-top:0;margin-bottom:0}.tide-margin-y-1\/4{margin-top:var(--spacing-1\/4);margin-bottom:var(--spacing-1\/4)}.tide-margin-y-1\/2{margin-top:var(--spacing-1\/2);margin-bottom:var(--spacing-1\/2)}.tide-margin-y-1{margin-top:var(--spacing-1);margin-bottom:var(--spacing-1)}.tide-margin-y-2{margin-top:var(--spacing-2);margin-bottom:var(--spacing-2)}.tide-margin-y-4{margin-top:var(--spacing-4);margin-bottom:var(--spacing-4)}.tide-margin-top-0{margin-top:0}.tide-margin-top-1\/4{margin-top:var(--spacing-1\/4)}.tide-margin-top-1\/2{margin-top:var(--spacing-1\/2)}.tide-margin-top-1{margin-top:var(--spacing-1)}.tide-margin-top-2{margin-top:var(--spacing-2)}.tide-margin-top-4{margin-top:var(--spacing-4)}.tide-margin-right-0{margin-right:0}.tide-margin-right-1\/4{margin-right:var(--spacing-1\/4)}.tide-margin-right-1\/2{margin-right:var(--spacing-1\/2)}.tide-margin-right-1{margin-right:var(--spacing-1)}.tide-margin-right-2{margin-right:var(--spacing-2)}.tide-margin-right-4{margin-right:var(--spacing-4)}.tide-margin-right-auto{margin-right:auto}.tide-margin-bottom-0{margin-bottom:0}.tide-margin-bottom-1\/4{margin-bottom:var(--spacing-1\/4)}.tide-margin-bottom-1\/2{margin-bottom:var(--spacing-1\/2)}.tide-margin-bottom-1{margin-bottom:var(--spacing-1)}.tide-margin-bottom-2{margin-bottom:var(--spacing-2)}.tide-margin-bottom-4{margin-bottom:var(--spacing-4)}.tide-margin-left-0{margin-left:0}.tide-margin-left-1\/2{margin-left:var(--spacing-1\/2)}.tide-margin-left-1{margin-left:var(--spacing-1)}.tide-margin-left-2{margin-left:var(--spacing-2)}.tide-margin-left-4{margin-left:var(--spacing-4)}.tide-margin-left-auto{margin-left:auto}.tide-border-1,.tide-border-2,.tide-border-bottom-1,.tide-border-bottom-2,.tide-border-left-1,.tide-border-left-2,.tide-border-right-1,.tide-border-right-2,.tide-border-top-1,.tide-border-top-2{border-style:solid}.tide-border-1{border-width:var(--border-width-1)}.tide-border-2{border-width:var(--border-width-2)}.tide-border-top-1{border-top-width:var(--border-width-1)}.tide-border-right-1{border-right-width:var(--border-width-1)}.tide-border-bottom-1{border-bottom-width:var(--border-width-1)}.tide-border-left-1{border-left-width:var(--border-width-1)}.tide-border-top-2{border-top-width:var(--border-width-2)}.tide-border-right-2{border-right-width:var(--border-width-2)}.tide-border-bottom-2{border-bottom-width:var(--border-width-2)}.tide-border-left-2{border-left-width:var(--border-width-2)}.tide-radius-1\/4{border-radius:var(--radius-1\/4)}.tide-radius-1\/2{border-radius:var(--radius-1\/2)}.tide-radius-1{border-radius:var(--radius-1)}.tide-radius-full{border-radius:var(--radius-full)}.tide-padding-0{padding:0}.tide-padding-1\/4{padding:var(--spacing-1\/4)}.tide-padding-1\/2{padding:var(--spacing-1\/2)}.tide-padding-1{padding:var(--spacing-1)}.tide-padding-2{padding:var(--spacing-2)}.tide-padding-4{padding:var(--spacing-4)}.tide-padding-x-0{padding-left:0;padding-right:0}.tide-padding-x-1\/4{padding-left:var(--spacing-1\/4);padding-right:var(--spacing-1\/4)}.tide-padding-x-1\/2{padding-left:var(--spacing-1\/2);padding-right:var(--spacing-1\/2)}.tide-padding-x-1{padding-left:var(--spacing-1);padding-right:var(--spacing-1)}.tide-padding-x-2{padding-left:var(--spacing-2);padding-right:var(--spacing-2)}.tide-padding-x-4{padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.tide-padding-y-0{padding-top:0;padding-bottom:0}.tide-padding-y-1\/4{padding-top:var(--spacing-1\/4);padding-bottom:var(--spacing-1\/4)}.tide-padding-y-1\/2{padding-top:var(--spacing-1\/2);padding-bottom:var(--spacing-1\/2)}.tide-padding-y-1{padding-top:var(--spacing-1);padding-bottom:var(--spacing-1)}.tide-padding-y-2{padding-top:var(--spacing-2);padding-bottom:var(--spacing-2)}.tide-padding-y-4{padding-top:var(--spacing-4);padding-bottom:var(--spacing-4)}.tide-padding-top-0{padding-top:0}.tide-padding-top-1\/4{padding-top:var(--spacing-1\/4)}.tide-padding-top-1\/2{padding-top:var(--spacing-1\/2)}.tide-padding-top-1{padding-top:var(--spacing-1)}.tide-padding-top-2{padding-top:var(--spacing-2)}.tide-padding-top-4{padding-top:var(--spacing-4)}.tide-padding-right-0{padding-right:0}.tide-padding-right-1\/4{padding-right:var(--spacing-1\/4)}.tide-padding-right-1\/2{padding-right:var(--spacing-1\/2)}.tide-padding-right-1{padding-right:var(--spacing-1)}.tide-padding-right-2{padding-right:var(--spacing-2)}.tide-padding-right-4{padding-right:var(--spacing-4)}.tide-padding-bottom-0{padding-bottom:0}.tide-padding-bottom-1\/4{padding-bottom:var(--spacing-1\/4)}.tide-padding-bottom-1\/2{padding-bottom:var(--spacing-1\/2)}.tide-padding-bottom-1{padding-bottom:var(--spacing-1)}.tide-padding-bottom-2{padding-bottom:var(--spacing-2)}.tide-padding-bottom-4{padding-bottom:var(--spacing-4)}.tide-padding-left-0{padding-left:0}.tide-padding-left-1\/4{padding-left:var(--spacing-1\/4)}.tide-padding-left-1\/2{padding-left:var(--spacing-1\/2)}.tide-padding-left-1{padding-left:var(--spacing-1)}.tide-padding-left-2{padding-left:var(--spacing-2)}.tide-padding-left-4{padding-left:var(--spacing-4)}.tide-max-width-full{max-width:100%}.tide-min-width-0{min-width:0}.tide-max-height-full{max-height:100%}.tide-min-height-0{min-height:0}.tide-width-container{max-width:1168px}.tide-width-full{width:100%}.tide-height-full{height:100%}.tide-transparent-100{background-color:var(--transparent-100)}.tide-transparent-200{background-color:var(--transparent-200)}.tide-transparent-300{background-color:var(--transparent-300)}.tide-transparent-400{background-color:var(--transparent-400)}.tide-font-10{font-size:.625rem}.tide-font-12{font-size:.75rem}.tide-font-14{font-size:.875rem}.tide-font-16{font-size:1rem}.tide-font-20{font-size:1.25rem}.tide-font-24{font-size:1.5rem}.tide-font-32{font-size:2rem}.tide-font-400{font-weight:400}.tide-font-500{font-weight:500}.tide-font-600{font-weight:600}.tide-font-700{font-weight:700}.tide-align-middle{vertical-align:middle}.tide-break-word{overflow-wrap:break-word}.tide-cursor-pointer{cursor:pointer}.tide-cursor-not-allowed{cursor:not-allowed}.tide-leading-default{line-height:100%}.tide-leading-normal{line-height:normal}.tide-list-none{list-style-type:none}.tide-object-center{object-position:center}.tide-object-cover{object-fit:cover}.tide-object-contain{object-fit:contain}.tide-object-scale-down{object-fit:scale-down}.tide-pointer-events{pointer-events:auto}.tide-pointer-events-none{pointer-events:none}.tide-scrollbar-none::-webkit-scrollbar{display:none}.tide-scrollbar-none{-ms-overflow-style:none;scrollbar-width:none}.tide-scroll-snap{scroll-snap-stop:always;scroll-snap-type:both mandatory;scroll-behavior:smooth}.tide-scroll-snap-start{scroll-snap-align:start}.tide-shadow-bottom{box-shadow:var(--shadow-bottom)}.tide-shadow-top{box-shadow:var(--shadow-top)}.tide-text-center{text-align:center}.tide-text-left{text-align:left}.tide-text-right{text-align:right}.tide-text-transform-lower{text-transform:lowercase}.tide-text-transform-none{text-transform:none}.tide-text-transform-upper{text-transform:uppercase}.tide-underline,.tide-underline:hover,.tide-underline-hover:hover{text-decoration:underline}.tide-underline-none,.tide-underline-none:hover,.tide-underline-hover{text-decoration:none}.tide-visible{visibility:visible}.tide-visible-none{visibility:hidden}.tide-whitespace-nowrap{white-space:nowrap}.tide-x-auto{overflow-x:auto}.tide-x-hidden{overflow-x:hidden}.tide-x-scroll{overflow-x:scroll}.tide-xy-auto{overflow:auto}.tide-xy-hidden{overflow:hidden}.tide-y-auto{overflow-y:auto}.tide-y-hidden{overflow-y:hidden}.tide-link-as-button,.tide-button{padding-top:.75rem;padding-bottom:.75rem}.tide-link-as-button.quaternary,.tide-button.quaternary{padding-right:1rem;padding-left:1rem}.primary{background:var(--primary);border:2px solid var(--primary);color:var(--on-primary)}.secondary{background:2px solid var(--surface);border:2px solid var(--primary);color:var(--primary)}.tertiary{background:var(--white);border:1px solid var(--border);color:var(--secondary)}.quaternary{background:var(--white);color:var(--secondary)}.floating{background-color:var(--transparent-100);color:var(--secondary);box-shadow:var(--shadow-bottom)}a.primary:hover,button.primary:enabled:hover{border:2px solid var(--primary);background:2px solid var(--white);color:var(--primary)}a.secondary:hover,button.secondary:enabled:hover{background:var(--primary);color:var(--on-primary)}a.tertiary:hover,button.tertiary:enabled:hover{border:1px solid var(--border-high)}a.quaternary:hover,button.quaternary:enabled:hover{background:var(--surface-variant)}.floating:hover,button.floating:enabled:hover{background-color:var(--white)}button.primary:disabled,button.secondary:disabled,button.tertiary:disabled,button.quaternary:disabled,button.floating:disabled{opacity:.32}.block-field .field{--input-outline-width: var(--border-w-1);outline:var(--input-outline-width) solid var(--ti-surface-border-rest);outline-offset:calc(var(--input-outline-width) * -1);color:var(--ti-surface-foreground)}.block-field .field::placeholder{color:var(--ti-surface-variant-foreground)}.block-field.error{color:var(--error-on-surface)}.block-field.error .field{outline-color:var(--error-border-rest)}.block-field.error:focus-within .field{outline-color:var(--error-border-rest)}.block-field.error:hover{color:var(--error-on-surface-variant)}.block-field.error:hover .field{outline-color:var(--error-border-high)}.block-field.disabled{opacity:.333}.block-field:hover .field{outline-color:var(--ti-surface-border-high)}.block-field:focus-within .field{--input-outline-width: var(--border-w-2);outline-color:var(--ti-surface-border-high)}.tide-bg-primary{background:var(--primary)}.tide-bg-secondary{background:var(--secondary)}.tide-bg-surface{background:var(--surface)}.tide-bg-surface-variant{background:var(--surface-variant)}.tide-bg-surface-brand{background:var(--surface-brand)}.tide-bg-surface-accent{background:var(--surface-accent)}.tide-bg-surface-accent-variant{background:var(--surface-accent-variant)}.tide-bg-surface-gradient{background:var(--surface-gradient)}.tide-bg-surface-floating{background:var(--surface-floating)}.tide-border-primary{border-color:var(--primary)}.tide-border{border-color:var(--border)}.tide-border-low{border-color:var(--border-low)}.tide-border-high{border-color:var(--border-high)}.tide-border-floating{border-color:var(--border-floating)}.tide-font-on-primary{color:var(--on-primary)}.tide-font-on-secondary{color:var(--on-secondary)}.tide-font-on-surface{color:var(--on-surface)}.tide-font-on-surface-variant{color:var(--on-surface-variant)}.tide-font-on-surface-brand{color:var(--on-surface-brand)}.tide-font-on-surface-inverse{color:var(--on-surface-inverse)}.tide-font-on-surface-variant-inverse{color:var(--on-surface-inverse-variant)}.slide-down-from-top-enter-active,.slide-down-from-top-leave-active{transition:transform var(--animate)}.slide-down-from-top-enter-from,.slide-down-from-top-leave-to{transform:translateY(-100%)}.slide-down-from-top-enter-to,.slide-down-from-top-leave-from{transform:translateY(0)}.page-layout{--max-content-width: 1168px;--gap: 0px;--column-count: 12;--min-gutter-width: var(--spacing-1);--gutter-width: minmax(var(--min-gutter-width), 1fr);--max-column-size: calc((var(--max-content-width) - (var(--gap) * (var(--column-count) - 1))) / var(--column-count));--content-columns: repeat(var(--column-count), minmax(0px, var(--max-column-size)));display:grid;gap:0 var(--gap);grid-auto-rows:min-content;grid-template-columns:[start] var(--gutter-width) [content-start] var(--content-columns) [content-end] var(--gutter-width) [end]}.page-layout>*,.layout-item{--start: calc(var(--column-start) + 1);--end: calc(var(--column-end) + 2);--start-end: var(--start, content-start) / var(--end, content-end);grid-column:var(--column, var(--start-end))}.tide-fluid{grid-column:1 / -1}.tide-start-0{--column-start: 0}.tide-start-1{--column-start: 1}.tide-start-2{--column-start: 2}.tide-start-3{--column-start: 3}.tide-start-4{--column-start: 4}.tide-start-5{--column-start: 5}.tide-start-6{--column-start: 6}.tide-start-7{--column-start: 7}.tide-start-8{--column-start: 8}.tide-start-9{--column-start: 9}.tide-start-10{--column-start: 10}.tide-start-11{--column-start: 11}.tide-start-12{--column-start: 12}.tide-end-1{--column-end: 1}.tide-end-2{--column-end: 2}.tide-end-3{--column-end: 3}.tide-end-4{--column-end: 4}.tide-end-5{--column-end: 5}.tide-end-6{--column-end: 6}.tide-end-7{--column-end: 7}.tide-end-8{--column-end: 8}.tide-end-9{--column-end: 9}.tide-end-10{--column-end: 10}.tide-end-11{--column-end: 11}.tide-end-12{--column-end: 12}.tide-end-13{--column-end: 13}.site-main{isolation:isolate}

package/dist/tide2-design-system.js

@@ -0,0 +1,36 @@
+import { T as d, a as s, b as T, c as t, d as n, e as o, f as r, g as u, h as g, i as p, j as I, k as c, l as B, m, n as C, o as l, p as h, q as x, r as A, s as P, t as b, u as k, v, w as S, x as f, y as D, z as L, A as M, B as j, C as q, D as w, E as y } from "./index-c5bc4216.js";
+import "vue";
+export {
+  d as TideAccordionItem,
+  s as TideAlert,
+  T as TideBadge,
+  t as TideBadgeCounter,
+  n as TideBadgeMisc,
+  o as TideBadgePremium,
+  r as TideBadgeTrustedPartner,
+  u as TideBreadCrumbs,
+  g as TideButton,
+  p as TideButtonIcon,
+  I as TideButtonPagination,
+  c as TideCard,
+  B as TideCarousel,
+  m as TideChipAction,
+  C as TideChipFilter,
+  l as TideChipInput,
+  h as TideColumns,
+  x as TideDivider,
+  A as TideIcon,
+  P as TideImage,
+  b as TideIndicator,
+  k as TideInputRadio,
+  v as TideInputSelect,
+  S as TideInputText,
+  f as TideInputTextarea,
+  D as TideLink,
+  L as TideModal,
+  M as TidePagination,
+  j as TideSeoLinks,
+  q as TideSvgIcon,
+  w as TideTabs,
+  y as TideToggle
+};

package/dist/types/Alert.ts

@@ -0,0 +1,8 @@
+export const ALERT = {
+  ERROR: 'error',
+  INFO: 'info',
+  SUCCESS: 'success',
+  WARNING: 'warning',
+} as const;
+
+export type Alert = (typeof ALERT)[keyof typeof ALERT];

package/dist/types/Badge.ts

@@ -0,0 +1,21 @@
+export const BADGE = {
+  JUST_LISTED: 'Just listed',
+  NATIONWIDE: 'Nationwide',
+  REDUCED: 'Reduced',
+  UPDATED: 'Updated',
+} as const;
+
+export const BADGE_PREMIUM = {
+  PREMIUM: 'Premium',
+  PREMIUM_SELECT: 'Premium SELECT',
+} as const;
+
+export const BADGE_TRUSTED = {
+  YEARS_10: '10',
+  YEARS_15: '15',
+  YEARS_5: '5',
+} as const;
+
+export type Badge = (typeof BADGE)[keyof typeof BADGE];
+export type BadgePremium = (typeof BADGE_PREMIUM)[keyof typeof BADGE_PREMIUM];
+export type BadgeTrustedYears = (typeof BADGE_TRUSTED)[keyof typeof BADGE_TRUSTED];

package/dist/types/BreadCrumb.ts

@@ -0,0 +1,5 @@
+export type BreadCrumb = {
+  dataTrack?: string;
+  label: string;
+  url?: string;
+};

package/dist/types/Detail.ts

@@ -0,0 +1,4 @@
+export type Detail = {
+  label: string;
+  value: string;
+};

package/dist/types/Element.ts

@@ -0,0 +1,13 @@
+export const ELEMENT = {
+  BUTTON: 'button',
+  LINK: 'a',
+} as const;
+
+export const ELEMENT_TEXT_AS_ICON = {
+  BUTTON: 'button',
+  DIV: 'div',
+  LINK: 'a',
+} as const;
+
+export type Element = (typeof ELEMENT)[keyof typeof ELEMENT];
+export type ElementTextAsIcon = (typeof ELEMENT_TEXT_AS_ICON)[keyof typeof ELEMENT_TEXT_AS_ICON];

package/dist/types/Field.ts

@@ -0,0 +1,55 @@
+import type { FormValueTransformer } from '@/types/Form';
+import type { SelectOption } from '@/types/Select';
+import type { TextInputType } from '@/types/TextInput';
+import type { ValidationError, Validator } from '@/types/Validation';
+
+interface BooleanValue {
+  value?: boolean;
+}
+
+interface CheckboxField extends GenericInput, BooleanValue {
+  indeterminate?: boolean;
+}
+
+interface GenericField extends GenericInput {
+  transformValue?: FormValueTransformer;
+  validators?: Validator[];
+}
+
+interface GenericInput {
+  disabled?: boolean;
+  error: ValidationError;
+  label?: string;
+  name: string;
+  required?: boolean;
+}
+
+interface SelectField extends GenericInput, StringValue {
+  options: SelectOption[];
+  placeholder?: string;
+}
+
+interface StringValue {
+  value?: string;
+}
+
+interface TextareaField extends GenericField, StringValue {
+  maxlength?: number;
+  minlength?: number;
+  placeholder?: string;
+  value?: string;
+}
+
+interface TextField extends GenericField, StringValue {
+  maxlength?: number;
+  minlength?: number;
+  placeholder?: string;
+  type?: TextInputType;
+  value?: string;
+}
+
+export type BooleanField = CheckboxField;
+export type Field = SelectField | TextField | TextareaField | CheckboxField;
+export type StringField = SelectField | TextField | TextareaField;
+export type { BooleanValue, StringValue };
+export type { CheckboxField, GenericField, GenericInput, SelectField, TextareaField, TextField };

package/dist/types/Form.ts

@@ -0,0 +1 @@
+export type FormValueTransformer = (value: string) => string;

package/dist/types/Formatted.ts

@@ -0,0 +1,22 @@
+import { formatNumber, formatPhone, formatPrice } from '@/utilities/format';
+
+export type Formatted = {
+  [key: string]: string | string[] | number;
+};
+
+export const FORMAT = {
+  NUMBER: formatNumber,
+  PHONE: formatPhone,
+  PRICE: formatPrice,
+} as const;
+
+export const FORMAT_REGEX = {
+  alpha: /^[a-zA-Z]+$/g,
+  alphaNumberOrEmpty: /^$|^[a-z0-9]+$/i,
+  alphaSpace: /^[a-zA-Z ]+$/g,
+  email:
+    /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
+  numberFormatted: /^$|(?=.)^\$?(([1-9][0-9]{0,2}(,[0-9]{3})*)|0)?(\.[0-9]{1,2})?$/,
+  phone: /^(?:\d{3}-\d{3}-\d{4}|\d{1}-\d{3}-\d{3}-\d{4})?$/,
+  price: /(?=.)^\$?(([1-9][0-9]{0,2}(,[0-9]{3})*)|0)?(\.[0-9]{1,2})?$/,
+};

package/dist/types/Icon.ts

@@ -0,0 +1,77 @@
+export const ICON = {
+  ACCOUNT_BALANCE: 'account-balance',
+  ADD: 'add',
+  AI: 'ai',
+  ALIGN_SPACE: 'align-space',
+  APPLE_PAY: 'apple-pay',
+  ARROW_BACK: 'arrow-back',
+  ARROW_FORWARD: 'arrow-forward',
+  ARROW_RIGHT: 'arrow-right',
+  ASSIGNMENT: 'assignment',
+  AWARD_STAR: 'award-star',
+  BOOKMARK: 'bookmark',
+  CALENDAR_MONTH: 'calendar-month',
+  CALL: 'call',
+  CHECK: 'check',
+  CHEVRON_LEFT: 'chevron-left',
+  CHEVRON_RIGHT: 'chevron-right',
+  CLEAR: 'clear',
+  CLOSE: 'close',
+  CYCLE: 'cycle',
+  DELETE: 'delete',
+  DIAMOND: 'diamond',
+  EDIT: 'edit',
+  ERROR: 'error',
+  EXPAND_CONTENT: 'expand-content',
+  EXPAND_LESS: 'expand-less',
+  EXPAND_MORE: 'expand-more',
+  FACEBOOK: 'facebook',
+  FAVORITE: 'favorite',
+  FAVORITE_FILLED: 'favorite-filled',
+  FORMAT_BOLD: 'format-bold',
+  FORMAT_ITALIC: 'format-italic',
+  FORMAT_LIST_BULLETED: 'format-list-bulleted',
+  FORUM: 'forum',
+  GOOGLE: 'google',
+  GOOGLE_PAY: 'google-pay',
+  GRID: 'grid',
+  HELP: 'help',
+  INFO: 'info',
+  INSERT_TEXT: 'insert-text',
+  INSTAGRAM: 'instagram',
+  IOS_SHARE: 'ios-share',
+  LAYOUT: 'layout',
+  LINKED_IN: 'linked in',
+  LOCAL_SHIPPING: 'local-shipping',
+  LOCK: 'lock',
+  MAIL: 'mail',
+  MENU: 'menu',
+  MORE_HORIZ: 'more-horiz',
+  NOTIFICATIONS: 'notifications',
+  OPEN_IN_NEW: 'open-in-new',
+  PALETTE: 'palette',
+  PAYPAL: 'paypal',
+  PERSON: 'person',
+  PHOTO_CAMERA: 'photo-camera',
+  PINTEREST: 'pinterest',
+  PLAY_ARROW: 'play-arrow',
+  REMOVE: 'remove',
+  ROUNDED_CORNERS: 'rounded-corners',
+  SEARCH: 'search',
+  SELL: 'sell',
+  SHARE: 'share',
+  SHOPPING_CART: 'shopping-cart',
+  SMS: 'sms',
+  STAR: 'star',
+  SWAP_VERT: 'swap-vert',
+  THREE_D_ROTATION: 'three-d-rotation',
+  TUNE: 'tune',
+  TWITTER: 'twitter',
+  VIDEOCAM: 'videocam',
+  VIEW_IN_AR: 'view-in-ar',
+  VISIBILITY: 'visibility',
+  WARNING: 'warning',
+  YOUTUBE: 'youtube',
+} as const;
+
+export type Icon = (typeof ICON)[keyof typeof ICON];

package/dist/types/Link.ts

@@ -0,0 +1,5 @@
+export type Link = {
+  label: string;
+  url: string;
+  isNewTab?: boolean;
+};

package/dist/types/ListingMedia.ts

@@ -0,0 +1,43 @@
+/**
+ * These slides are used in both the inline detail page photo slider
+ * and the fullscreen media gallery.
+ */
+
+export const MEDIA_SLIDE_TYPES = {
+  IMAGE: {
+    FLOORPLAN: 'floorplan',
+    IMAGE: 'image',
+  },
+  VIDEO: 'video',
+  VR: 'vr',
+} as const;
+
+export type MediaSlideType =
+  | (typeof MEDIA_SLIDE_TYPES.IMAGE)[keyof typeof MEDIA_SLIDE_TYPES.IMAGE]
+  | typeof MEDIA_SLIDE_TYPES.VIDEO
+  | typeof MEDIA_SLIDE_TYPES.VR;
+
+export type ImageSlideType = (typeof MEDIA_SLIDE_TYPES.IMAGE)[keyof typeof MEDIA_SLIDE_TYPES.IMAGE];
+
+type ImageSlide = {
+  imageUrl: string;
+  type: ImageSlideType;
+};
+
+export type VideoSlideType = typeof MEDIA_SLIDE_TYPES.VIDEO;
+
+type VideoSlide = {
+  imageUrl: string;
+  type: VideoSlideType;
+  videoUrl: string;
+};
+
+export type VrSlideType = typeof MEDIA_SLIDE_TYPES.VR;
+
+type VrSlide = {
+  imageUrl: string;
+  type: VrSlideType;
+  vrUrl: string;
+};
+
+export type ListingMedia = ImageSlide | VideoSlide | VrSlide;

package/dist/types/Priority.ts

@@ -0,0 +1,11 @@
+/* eslint-disable vue/sort-keys */
+
+export const PRIORITY = {
+  PRIMARY: 'primary',
+  SECONDARY: 'secondary',
+  TERTIARY: 'tertiary',
+  QUATERNARY: 'quaternary',
+  FLOATING: 'floating',
+} as const;
+
+export type Priority = (typeof PRIORITY)[keyof typeof PRIORITY];

package/dist/types/Raw.ts

@@ -0,0 +1,5 @@
+export type Raw = {
+  [key: string]: {
+    raw: number | string | string[];
+  };
+};

package/dist/types/Realm.ts

@@ -0,0 +1,12 @@
+export const REALM = {
+  AERO: 'aero',
+  ATV: 'atv',
+  CYCLE: 'cycle',
+  EQUIP: 'equip',
+  PWC: 'pwc',
+  RV: 'rv',
+  SNOW: 'snow',
+  TRUCK: 'truck',
+} as const;
+
+export type Realm = (typeof REALM)[keyof typeof REALM];

package/dist/types/RealmConfig.ts

@@ -0,0 +1,14 @@
+import type { Realm } from '@/types/Realm';
+
+export type RealmConfig = {
+  cdn: {
+    domain: string;
+    version: string;
+  };
+  id: Realm;
+  label: {
+    plural: string;
+    singular: string;
+    singularWithArticle: string;
+  };
+};

package/dist/types/Select.ts

@@ -0,0 +1,4 @@
+export type SelectOption = {
+  label: string | number;
+  value: any;
+};

package/dist/types/Size.ts

@@ -0,0 +1,6 @@
+export const SIZE = {
+  LARGE: 'large',
+  SMALL: 'small',
+} as const;
+
+export type Size = (typeof SIZE)[keyof typeof SIZE];

package/dist/types/Storybook.ts

@@ -0,0 +1,14 @@
+/* eslint vue/sort-keys: 0 */
+// ^ Storybook controls are based on iterating over object properties instead of array slots (bad form), so these can't be ordered alphabetically.
+
+// import { prependNoneAsEmpty } from '@/utilities/storybook';
+
+export const NoneAsEmpty = { None: '' };
+export const NoneAsUndefined = { None: undefined };
+
+// These objects are intended exclusively for use in demonstrating the Storybook UI.
+export const BOOLEAN_UNREQUIRED = {
+  None: undefined,
+  True: true,
+  False: false,
+};

package/dist/types/StorybookStyles.ts

@@ -0,0 +1,209 @@
+/* eslint vue/sort-keys: 0 */
+// ^ Storybook controls are based on iterating over object properties instead of array slots (bad form), so these can't be ordered alphabetically.
+
+import { CSS } from '@/types/Styles';
+
+export const BADGE_TRUSTED = {
+  YEARS_5: '5',
+  YEARS_10: '10',
+  YEARS_15: '15',
+};
+
+export const BORDER_RADIUS = {
+  '0.25 REM': 'tide-radius-1/4',
+  '0.5 REM': 'tide-radius-1/2',
+  '1 REM': 'tide-radius-1',
+  'Full': 'tide-radius-full',
+};
+
+export const BORDER_SIDE = {
+  Full: 'tide-border',
+  Top: 'tide-border-top',
+  Right: 'tide-border-right',
+  Bottom: 'tide-border-bottom',
+  Left: 'tide-border-left',
+};
+
+export const BORDER_WIDTH = {
+  '1px': '1',
+  '2px': '2',
+};
+
+export const DISPLAY = {
+  'Block': 'tide-display-block',
+  'Contents': 'tide-contents',
+  'Flex': 'tide-display-flex',
+  'Grid': 'tide-display-grid',
+  'Inline Block': 'tide-display-inline-block',
+  'Inline Flex': 'tide-display-inline-flex',
+  'Inline': 'tide-display-inline',
+  'None (Hidden)': 'tide-display-none',
+};
+
+export const FLEX_AXIS1 = {
+  Around: 'tide-axis1-around',
+  Between: 'tide-axis1-between',
+  Center: 'tide-axis1-center',
+  End: 'tide-axis1-end',
+  Start: 'tide-axis1-start',
+};
+
+export const FLEX_AXIS2 = {
+  Center: 'tide-axis2-center',
+  End: 'tide-axis2-end',
+  Normal: 'tide-axis2-normal',
+  Start: 'tide-axis2-start',
+};
+
+export const FLEX_DIRECTION = {
+  Column: 'tide-flex-column',
+  Row: 'tide-flex-row',
+};
+
+export const FONT_SIZE = {
+  '12px': 'tide-font-12',
+  '14px': 'tide-font-14',
+  '16px': 'tide-font-16',
+  '20px': 'tide-font-20',
+  '24px': 'tide-font-24',
+  '32px': 'tide-font-32',
+};
+
+export const FONT_WEIGHT = {
+  '400 Regular': 'tide-font-400',
+  '500 Medium': 'tide-font-500',
+  '600 Semibold': 'tide-font-600',
+  '700 Bold': 'tide-font-700',
+};
+
+export const GAP = {
+  '4 REM': 'tide-gap-4',
+  '2 REM': 'tide-gap-2',
+  '1 REM': 'tide-gap-1',
+  '0.5 REM': 'tide-gap-1/2',
+  '0.25 REM': 'tide-gap-1/4',
+};
+
+export const LINK_SIZE = {
+  TWELVE: 'tide-font-12',
+  FOURTEEN: 'tide-font-14',
+  SIXTEEN: 'tide-font-16',
+};
+
+export const MARGIN = {
+  'Full 4 REM': 'tide-margin-4',
+  'Full 2 REM': 'tide-margin-2',
+  'Full 1 REM': 'tide-margin-1',
+  'Full 0.5 REM': 'tide-margin-1/2',
+  'Full 0.25 REM': 'tide-margin-1/4',
+
+  'X-axis Auto': 'tide-margin-x-auto',
+  'X-axis 4 REM': 'tide-margin-x-4',
+  'X-axis 2 REM': 'tide-margin-x-2',
+  'X-axis 1 REM': 'tide-margin-x-1',
+  'X-axis 0.5 REM': 'tide-margin-x-1/2',
+  'X-axis 0.25 REM': 'tide-margin-x-1/4',
+
+  'Y-axis 4 REM': 'tide-margin-y-4',
+  'Y-axis 2 REM': 'tide-margin-y-2',
+  'Y-axis 1 REM': 'tide-margin-y-1',
+  'Y-axis 0.5 REM': 'tide-margin-y-1/2',
+  'Y-axis 0.25 REM': 'tide-margin-y-1/4',
+
+  'Top 4 REM': 'tide-margin-top-4',
+  'Top 2 REM': 'tide-margin-top-2',
+  'Top 1 REM': 'tide-margin-top-1',
+  'Top 0.5 REM': 'tide-margin-top-1/2',
+  'Top 0.25 REM': 'tide-margin-top-1/4',
+
+  'Right Auto': 'tide-margin-right-auto',
+  'Right 4 REM': 'tide-margin-right-4',
+  'Right 2 REM': 'tide-margin-right-2',
+  'Right 1 REM': 'tide-margin-right-1',
+  'Right 0.5 REM': 'tide-margin-right-1/2',
+  'Right 0.25 REM': 'tide-margin-right-1/4',
+
+  'Bottom 4 REM': 'tide-margin-bottom-4',
+  'Bottom 2 REM': 'tide-margin-bottom-2',
+  'Bottom 1 REM': 'tide-margin-bottom-1',
+  'Bottom 0.5 REM': 'tide-margin-bottom-1/2',
+  'Bottom 0.25 REM': 'tide-margin-bottom-1/4',
+
+  'Left Auto': 'tide-margin-left-auto',
+  'Left 4 REM': 'tide-margin-left-4',
+  'Left 2 REM': 'tide-margin-left-2',
+  'Left 1 REM': 'tide-margin-left-1',
+  'Left 0.5 REM': 'tide-margin-left-1/2',
+  'Left 0.25 REM': 'tide-margin-left-1/4',
+};
+
+export const PADDING = {
+  'Full 4 REM': 'tide-padding-4',
+  'Full 2 REM': 'tide-padding-2',
+  'Full 1 REM': 'tide-padding-1',
+  'Full 0.5 REM': 'tide-padding-1/2',
+  'Full 0.25 REM': 'tide-padding-1/4',
+
+  'X-axis 4 REM': 'tide-padding-x-4',
+  'X-axis 2 REM': 'tide-padding-x-2',
+  'X-axis 1 REM': 'tide-padding-x-1',
+  'X-axis 0.5 REM': 'tide-padding-x-1/2',
+  'X-axis 0.25 REM': 'tide-padding-x-1/4',
+
+  'Y-axis 4 REM': 'tide-padding-y-4',
+  'Y-axis 2 REM': 'tide-padding-y-2',
+  'Y-axis 1 REM': 'tide-padding-y-1',
+  'Y-axis 0.5 REM': 'tide-padding-y-1/2',
+  'Y-axis 0.25 REM': 'tide-padding-y-1/4',
+
+  'Top 4 REM': 'tide-padding-top-4',
+  'Top 2 REM': 'tide-padding-top-2',
+  'Top 1 REM': 'tide-padding-top-1',
+  'Top 0.5 REM': 'tide-padding-top-1/2',
+  'Top 0.25 REM': 'tide-padding-top-1/4',
+
+  'Right 4 REM': 'tide-padding-right-4',
+  'Right 2 REM': 'tide-padding-right-2',
+  'Right 1 REM': 'tide-padding-right-1',
+  'Right 0.5 REM': 'tide-padding-right-1/2',
+  'Right 0.25 REM': 'tide-padding-right-1/4',
+
+  'Bottom 4 REM': 'tide-padding-bottom-4',
+  'Bottom 2 REM': 'tide-padding-bottom-2',
+  'Bottom 1 REM': 'tide-padding-bottom-1',
+  'Bottom 0.5 REM': 'tide-padding-bottom-1/2',
+  'Bottom 0.25 REM': 'tide-padding-bottom-1/4',
+
+  'Left 4 REM': 'tide-padding-left-4',
+  'Left 2 REM': 'tide-padding-left-2',
+  'Left 1 REM': 'tide-padding-left-1',
+  'Left 0.5 REM': 'tide-padding-left-1/2',
+  'Left 0.25 REM': 'tide-padding-left-1/4',
+};
+
+export const SHADOW = {
+  Bottom: 'tide-shadow-bottom',
+  Top: 'tide-shadow-top',
+};
+
+export const TYPOGRAPHY = {
+  DISPLAY_1: [CSS.FONT.SIZE.THIRTY_TWO, CSS.FONT.WEIGHT.SEVEN_HUNDRED],
+  HEADLINE_1: [CSS.FONT.SIZE.TWENTY_FOUR, CSS.FONT.WEIGHT.SEVEN_HUNDRED],
+  HEADLINE_2: [CSS.FONT.SIZE.TWENTY, CSS.FONT.WEIGHT.SEVEN_HUNDRED],
+  HEADLINE_3: [CSS.FONT.SIZE.SIXTEEN, CSS.FONT.WEIGHT.SEVEN_HUNDRED],
+  TITLE_1: [CSS.FONT.SIZE.TWENTY, CSS.FONT.WEIGHT.SIX_HUNDRED],
+  TITLE_2: [CSS.FONT.SIZE.SIXTEEN, CSS.FONT.WEIGHT.SIX_HUNDRED],
+  BODY_1: [CSS.FONT.SIZE.SIXTEEN, CSS.FONT.WEIGHT.FOUR_HUNDRED],
+  BODY_2: [CSS.FONT.SIZE.FOURTEEN, CSS.FONT.WEIGHT.FOUR_HUNDRED],
+  LABEL_1: [CSS.FONT.SIZE.SIXTEEN, CSS.FONT.WEIGHT.FIVE_HUNDRED],
+  LABEL_1_SEMIBOLD: [CSS.FONT.SIZE.SIXTEEN, CSS.FONT.WEIGHT.SIX_HUNDRED],
+  LABEL_2: [CSS.FONT.SIZE.FOURTEEN, CSS.FONT.WEIGHT.FIVE_HUNDRED],
+  LABEL_2_SEMIBOLD: [CSS.FONT.SIZE.FOURTEEN, CSS.FONT.WEIGHT.SIX_HUNDRED],
+  LABEL_3: [CSS.FONT.SIZE.TWELVE, CSS.FONT.WEIGHT.FIVE_HUNDRED],
+  LINK_1: [CSS.FONT.SIZE.SIXTEEN, CSS.FONT.WEIGHT.SEVEN_HUNDRED],
+  LINK_2: [CSS.FONT.SIZE.FOURTEEN, CSS.FONT.WEIGHT.SEVEN_HUNDRED],
+  LINK_3: [CSS.FONT.SIZE.TWELVE, CSS.FONT.WEIGHT.SEVEN_HUNDRED],
+  BUTTON_1: [CSS.FONT.SIZE.SIXTEEN, CSS.FONT.WEIGHT.SIX_HUNDRED],
+};
+
+export type Typography = (typeof TYPOGRAPHY)[keyof typeof TYPOGRAPHY];