@moda/om 19.8.2 → 20.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/README.md +1 -2
  2. package/dist/index.cjs.js +72 -26
  3. package/dist/index.cjs.js.map +1 -1
  4. package/dist/index.esm.js +72 -26
  5. package/dist/index.esm.js.map +1 -1
  6. package/dist/styles.css +1 -1
  7. package/index.scss +1 -0
  8. package/package.json +65 -62
  9. package/src/components/AspectRatioBox/AspectRatioBox.scss +1 -1
  10. package/src/components/Badge/Badge.scss +17 -17
  11. package/src/components/Breadcrumbs/Breadcrumb/Breadcrumb.scss +5 -5
  12. package/src/components/Breadcrumbs/Breadcrumbs.scss +2 -2
  13. package/src/components/Breakpoint/Breakpoint.scss +9 -7
  14. package/src/components/Button/Button.scss +45 -44
  15. package/src/components/Checkbox/Checkbox.scss +11 -11
  16. package/src/components/Checkbox/Checkbox.tsx +1 -1
  17. package/src/components/Clickable/Clickable.scss +3 -3
  18. package/src/components/ColorSwatch/ColorSwatch.scss +9 -9
  19. package/src/components/ColorSwatch/ColorSwatch.tsx +2 -2
  20. package/src/components/Constrain/Constrain.scss +9 -8
  21. package/src/components/Constrain/ExceedConstrain.scss +7 -7
  22. package/src/components/ControlLink/ControlLink.scss +6 -6
  23. package/src/components/DefinitionList/DefinitionList.scss +5 -5
  24. package/src/components/Dialog/Dialog.scss +4 -4
  25. package/src/components/Divider/Divider.scss +5 -5
  26. package/src/components/Expandable/Expandable.scss +17 -17
  27. package/src/components/Field/Field.scss +7 -7
  28. package/src/components/Label/Label.scss +4 -4
  29. package/src/components/Loading/Loading.scss +4 -4
  30. package/src/components/LoadingBalls/LoadingBalls.scss +2 -2
  31. package/src/components/LoadingShapes/LoadingShapes.scss +2 -2
  32. package/src/components/Modal/Modal.scss +1 -1
  33. package/src/components/ModalOverlay/ModalOverlay.scss +6 -6
  34. package/src/components/Overlay/Overlay.scss +4 -4
  35. package/src/components/Paginator/Paginator.scss +10 -10
  36. package/src/components/PasswordInput/PasswordInput.scss +4 -4
  37. package/src/components/Popover/Popover.scss +9 -9
  38. package/src/components/Popover/Popover.tsx +6 -2
  39. package/src/components/PromoBanner/PromoBanner.scss +9 -9
  40. package/src/components/RadioButton/RadioButton.scss +14 -14
  41. package/src/components/SearchInput/SearchInput.scss +4 -4
  42. package/src/components/Select/MultiSelect.scss +14 -14
  43. package/src/components/Select/MultiSelect.tsx +1 -1
  44. package/src/components/Select/Select.scss +25 -25
  45. package/src/components/Select/Select.tsx +1 -1
  46. package/src/components/Select/SelectOption.scss +7 -7
  47. package/src/components/Select/SelectOption.tsx +1 -1
  48. package/src/components/Select/SelectOptions.scss +8 -8
  49. package/src/components/Select/SelectOptions.tsx +2 -2
  50. package/src/components/Select/useSelect.ts +1 -1
  51. package/src/components/SelectableButton/SelectableButton.scss +13 -13
  52. package/src/components/SlidingPane/SlidingPane.scss +7 -7
  53. package/src/components/Stack/Stack.scss +6 -4
  54. package/src/components/Tabs/Tab.scss +6 -6
  55. package/src/components/Tabs/TabList.scss +3 -3
  56. package/src/components/Tabs/TabPanels.scss +2 -2
  57. package/src/components/Tag/Tag.scss +8 -8
  58. package/src/components/Text/Text.scss +4 -3
  59. package/src/components/TextInput/TextInput.scss +2 -2
  60. package/src/components/Textarea/Textarea.scss +3 -3
  61. package/src/components/Toast/Toast.scss +6 -6
  62. package/src/components/VerticalDivider/VerticalDivider.scss +3 -3
  63. package/src/index.scss +3 -3
  64. package/src/mixins/_mixins.scss +7 -7
  65. package/src/mixins/font-smoothing/_font-smoothing.scss +0 -2
  66. package/src/mixins/font-smoothing/font-smoothing.stories.scss +3 -3
  67. package/src/mixins/global-styles/_global-styles.scss +6 -5
  68. package/src/mixins/input-styles/_input-styles.scss +14 -12
  69. package/src/mixins/overflow-scroll/_overflow-scroll.scss +0 -2
  70. package/src/mixins/overflow-scroll/overflow-scroll.stories.scss +3 -3
  71. package/src/mixins/stack/_stack.scss +3 -3
  72. package/src/mixins/stack/stack.stories.scss +3 -3
  73. package/src/mixins/thin-underline/_thin-underline.scss +0 -2
  74. package/src/mixins/thin-underline/thin-underline.stories.scss +2 -2
  75. package/src/mixins/visually-hidden/_visually-hidden.scss +0 -2
  76. package/src/mixins/visually-hidden/visually-hidden.stories.scss +2 -2
  77. package/src/utilities/States/State.scss +4 -4
  78. package/src/utilities/States/States.scss +2 -2
  79. package/src/utilities/States/StatesProps.scss +8 -8
package/dist/styles.css CHANGED
@@ -1 +1 @@
1
- .Stack.Stack--horizontal-0{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-0>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-0>*+*,.Stack.Stack--horizontal-0>.Overlay{margin-left:0}.Stack.Stack--horizontal-1{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-1>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-1>*+*{margin-left:.25rem}.Stack.Stack--horizontal-1>.Overlay{margin-left:0}.Stack.Stack--horizontal-2{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-2>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-2>*+*{margin-left:.5rem}.Stack.Stack--horizontal-2>.Overlay{margin-left:0}.Stack.Stack--horizontal-3{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-3>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-3>*+*{margin-left:.75rem}.Stack.Stack--horizontal-3>.Overlay{margin-left:0}.Stack.Stack--horizontal-4{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-4>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-4>*+*{margin-left:1rem}.Stack.Stack--horizontal-4>.Overlay{margin-left:0}.Stack.Stack--horizontal-5{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-5>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-5>*+*{margin-left:1.5rem}.Stack.Stack--horizontal-5>.Overlay{margin-left:0}.Stack.Stack--horizontal-6{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-6>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-6>*+*{margin-left:2rem}.Stack.Stack--horizontal-6>.Overlay{margin-left:0}.Stack.Stack--horizontal-7{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-7>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-7>*+*{margin-left:3rem}.Stack.Stack--horizontal-7>.Overlay{margin-left:0}.Stack.Stack--horizontal-8{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-8>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-8>*+*{margin-left:4rem}.Stack.Stack--horizontal-8>.Overlay{margin-left:0}.Stack.Stack--horizontal-9{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-9>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-9>*+*{margin-left:6rem}.Stack.Stack--horizontal-9>.Overlay{margin-left:0}.Stack.Stack--horizontal-10{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-10>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-10>*+*{margin-left:8rem}.Stack.Stack--horizontal-10>.Overlay{margin-left:0}.Stack.Stack--horizontal-11{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-11>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-11>*+*{margin-left:12rem}.Stack.Stack--horizontal-11>.Overlay{margin-left:0}.Stack.Stack--horizontal-12{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-12>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-12>*+*{margin-left:24rem}.Stack.Stack--horizontal-12>.Overlay{margin-left:0}.Stack.Stack--vertical-0{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-0>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-0>*+*,.Stack.Stack--vertical-0>.Overlay{margin-top:0}.Stack.Stack--vertical-1{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-1>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-1>*+*{margin-top:.25rem}.Stack.Stack--vertical-1>.Overlay{margin-top:0}.Stack.Stack--vertical-2{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-2>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-2>*+*{margin-top:.5rem}.Stack.Stack--vertical-2>.Overlay{margin-top:0}.Stack.Stack--vertical-3{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-3>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-3>*+*{margin-top:.75rem}.Stack.Stack--vertical-3>.Overlay{margin-top:0}.Stack.Stack--vertical-4{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-4>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-4>*+*{margin-top:1rem}.Stack.Stack--vertical-4>.Overlay{margin-top:0}.Stack.Stack--vertical-5{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-5>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-5>*+*{margin-top:1.5rem}.Stack.Stack--vertical-5>.Overlay{margin-top:0}.Stack.Stack--vertical-6{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-6>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-6>*+*{margin-top:2rem}.Stack.Stack--vertical-6>.Overlay{margin-top:0}.Stack.Stack--vertical-7{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-7>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-7>*+*{margin-top:3rem}.Stack.Stack--vertical-7>.Overlay{margin-top:0}.Stack.Stack--vertical-8{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-8>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-8>*+*{margin-top:4rem}.Stack.Stack--vertical-8>.Overlay{margin-top:0}.Stack.Stack--vertical-9{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-9>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-9>*+*{margin-top:6rem}.Stack.Stack--vertical-9>.Overlay{margin-top:0}.Stack.Stack--vertical-10{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-10>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-10>*+*{margin-top:8rem}.Stack.Stack--vertical-10>.Overlay{margin-top:0}.Stack.Stack--vertical-11{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-11>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-11>*+*{margin-top:12rem}.Stack.Stack--vertical-11>.Overlay{margin-top:0}.Stack.Stack--vertical-12{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-12>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-12>*+*{margin-top:24rem}.Stack.Stack--vertical-12>.Overlay{margin-top:0}.StatesProps{font-family:Menlo,Monaco,Consolas,Courier New,monospace;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;padding-top:.5rem;color:#979899;border-top:1px dotted #cacbcc}.StatesProps>strong{text-decoration:underline;color:#191a1b}.StatesProps:before{content:"<";color:#cacbcc}.StatesProps:after{content:"/>";color:#cacbcc}.State{border:1px dotted #979899;padding:.5rem}.State__props{display:block;margin-top:.5rem}.States{display:flex;justify-content:flex-start;flex-direction:column}.States>*{margin-top:0;margin-bottom:0}.States>*+*{margin-top:2rem}.States>.Overlay{margin-top:0}.AspectRatioBox,.AspectRatioBox__wrapper{position:relative;width:100%}.AspectRatioBox__wrapper{height:0;overflow:hidden}.AspectRatioBox__content{position:absolute;top:0;left:0;width:100%;height:100%}.AspectRatioBox--outlined{border:1px dotted}.Badge{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;display:inline-block;color:#191a1b;border:1px solid;padding:.25rem;-webkit-user-select:none;-moz-user-select:none;user-select:none}.Badge,.Badge--default{background-color:transparent;border-color:#979899;color:#656566}.Badge--forest-green{background-color:#003728;border-color:transparent;color:#fff}.Badge--klein-blue{background-color:#263078}.Badge--brick,.Badge--klein-blue{border-color:transparent;color:#fff}.Badge--brick{background-color:#933a20}.Badge--dark-fuchsia{border-color:#b43ca0;color:#b43ca0;font-weight:700;text-transform:none}.Badge--noise{line-height:1.6;background-color:#f2f3f5;border-color:transparent;color:#191a1b;text-transform:none;line-height:1.4}.Badge--noise,.Breadcrumbs{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;letter-spacing:.04em}.Breadcrumbs{display:flex;flex-flow:wrap;list-style:none;margin:0}.Breadcrumbs,.Clickable{line-height:1.6;padding:0}.Clickable{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;letter-spacing:.04em;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;color:inherit;font-size:1rem;text-decoration:none;white-space:nowrap}.Clickable:not(.Clickable--disabled){cursor:pointer}.Clickable>label{cursor:inherit}.ControlLink{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;display:inline-flex}.ControlLink:focus:not(.ControlLink--disabled),.ControlLink:hover:not(.ControlLink--disabled){position:relative;text-decoration:none;color:#191a1b;opacity:.7}.ControlLink:focus:not(.ControlLink--disabled):after,.ControlLink:hover:not(.ControlLink--disabled):after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;border-bottom:1px solid;opacity:.75}.ControlLink--underlined{position:relative;text-decoration:none}.ControlLink--underlined:after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;border-bottom:1px solid;opacity:.75}.ControlLink--disabled{color:#979899}.Breadcrumb{position:relative;padding-right:1rem;margin-right:.5rem;white-space:nowrap;overflow:hidden}.Breadcrumb:after{display:block;content:" ";position:absolute;top:50%;right:.25rem;transform:translateY(-50%) rotate(25deg);border-right:1px solid #979899;height:75%}.Breadcrumb:last-child{margin-right:0}.Breadcrumb:last-child:after,.Breakpoint{display:none}@media (min-width:0) and (max-width:25rem){.Breakpoint--at-xs{display:block}}@media (min-width:25.0625rem){.Breakpoint--gt-xs{display:block}}@media (max-width:25rem){.Breakpoint--lt-xs{display:block}}@media (min-width:0) and (max-width:48rem){.Breakpoint--at-sm{display:block}}@media (min-width:48.0625rem){.Breakpoint--gt-sm{display:block}}@media (max-width:48rem){.Breakpoint--lt-sm{display:block}}@media (min-width:48.0625rem) and (max-width:62rem){.Breakpoint--at-md{display:block}}@media (min-width:62.0625rem){.Breakpoint--gt-md{display:block}}@media (max-width:62rem){.Breakpoint--lt-md{display:block}}@media (min-width:62.0625rem) and (max-width:80rem){.Breakpoint--at-lg{display:block}}@media (min-width:80.0625rem){.Breakpoint--gt-lg{display:block}}@media (max-width:80rem){.Breakpoint--lt-lg{display:block}}@media (min-width:80.0625rem) and (max-width:100rem){.Breakpoint--at-xl{display:block}}@media (min-width:100.0625rem){.Breakpoint--gt-xl{display:block}}@media (max-width:100rem){.Breakpoint--lt-xl{display:block}}.Button{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;text-align:center;padding:1rem 3rem;border:1px solid;cursor:pointer;text-decoration:none;transition:background-color .2s}.Button>*{margin-right:.5rem}.Button,.Button--primary{color:#fff;border-color:#191a1b;background-color:#191a1b;-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:auto}.Button--primary.Button--hover,.Button--primary:hover,.Button.Button--hover,.Button:hover{color:#fff;border-color:rgba(151,152,153,.32);background:linear-gradient(0deg,rgba(151,152,153,.32),rgba(151,152,153,.32)),#191a1b}.Button--primary.Button--focus,.Button--primary:focus,.Button.Button--focus,.Button:focus{color:#fff;border-color:rgba(151,152,153,.12);background:linear-gradient(0deg,hsla(0,0%,100%,.12),hsla(0,0%,100%,.12)),#191a1b}.Button--primary.Button--disabled,.Button--primary:disabled,.Button.Button--disabled,.Button:disabled{color:#191a1b;border-color:#f2f3f5;background-color:#f2f3f5;cursor:default;pointer-events:none}.Button--secondary{color:#191a1b;border-color:#191a1b;background-color:#fff}.Button--secondary.Button--hover,.Button--secondary:hover{color:#191a1b;border-color:#191a1b;background-color:rgba(242,243,245,.32)}.Button--secondary.Button--focus,.Button--secondary:focus{color:#191a1b;border-color:#191a1b;background-color:#f2f3f5}.Button--secondary.Button--disabled,.Button--secondary:disabled{color:#656566;border-color:#979899;background-color:#f2f3f5;cursor:default;pointer-events:none}.Button--tertiary{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;padding:.5rem .75rem;color:#191a1b;border-color:#cacbcc;background-color:#fff;text-transform:none;line-height:1.4}.Button--tertiary.Button--hover,.Button--tertiary:hover{color:#191a1b;border-color:#cacbcc;background-color:rgba(242,243,245,.32)}.Button--tertiary.Button--focus,.Button--tertiary:focus{color:#191a1b;border-color:#cacbcc;background-color:#f2f3f5}.Button--tertiary.Button--disabled,.Button--tertiary:disabled{color:#656566;border-color:#979899;background-color:#f2f3f5;cursor:default;pointer-events:none}.Button--elevated{box-shadow:0 1px 4px rgba(0,0,0,.09)}.Button--chip{border-radius:2rem}.Checkbox{display:flex;justify-content:flex-start;flex-direction:row;position:relative;align-items:flex-start;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer;color:#191a1b}.Checkbox>*{margin-left:0;margin-right:0}.Checkbox>*+*{margin-left:.5rem}.Checkbox>.Overlay{margin-left:0}.Checkbox__indicator{position:relative;width:1rem;height:1rem;margin-top:.125rem;flex-shrink:0;border:1px solid}.Checkbox__indicator--disabled{color:#cacbcc;pointer-events:none}.Checkbox__indicator--disabled:after{background-color:#cacbcc}.Checkbox__check-mark{margin:7.5%}.Checkbox__input{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.Checkbox__label{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;color:#191a1b}.ColorSwatch{position:relative;width:2rem;height:2rem;border:1px solid transparent;background-color:transparent;border-radius:50%;padding:1px;cursor:pointer;flex-shrink:0}.ColorSwatch--small{width:1.5rem;height:1.5rem}.ColorSwatch:before{display:none;content:"";position:absolute;top:50%;left:50%;width:33%;height:33%;transform:translate(-50%,-50%);border-radius:50%;background-color:#fff;z-index:1}.ColorSwatch__chip{position:relative;width:100%;height:100%;border-radius:50%}.ColorSwatch__chip:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background-color:rgba(0,0,0,.2);opacity:0;transition:opacity .2s}.ColorSwatch--hover,.ColorSwatch:hover{border-color:#cacbcc}.ColorSwatch--hover:before,.ColorSwatch:hover:before{display:block}.ColorSwatch--hover .ColorSwatch__chip:before,.ColorSwatch:hover .ColorSwatch__chip:before{opacity:1}.ColorSwatch--focus:before,.ColorSwatch--selected:before,.ColorSwatch:focus:before{display:block}.ColorSwatch--sold-out .ColorSwatch__chip:after{content:"";display:block;position:absolute;top:50%;left:50%;width:100%;height:1px;transform:translate(-50%,-50%) rotate(-45deg);background-color:rgba(0,0,0,.5);z-index:1}.ColorSwatch--on-sale:after{content:"";display:block;position:absolute;top:-.125rem;right:-.125rem;width:.25rem;height:.25rem;border-radius:50%;background-color:#ee0700}.ColorSwatch--disabled,.ColorSwatch:disabled{pointer-events:none}.ColorSwatch--light:before{background-color:#191a1b}.ColorSwatch--light .ColorSwatch__chip{border:1px solid rgba(25,26,27,.25)}.Modal{position:fixed;justify-content:center;overflow-y:auto;-webkit-overflow-scrolling:touch}.Modal,.Overlay{top:0;right:0;bottom:0;left:0;display:flex;align-items:center}.Overlay{justify-content:flex-start;flex-direction:column;position:absolute;background-color:hsla(0,0%,100%,.9);justify-content:center;color:#191a1b;animation:slow-in .5s}.Overlay>*{margin-top:0;margin-bottom:0}.Overlay>*+*{margin-top:.5rem}.Overlay>.Overlay{margin-top:0}@keyframes slow-in{0%{opacity:0}to{opacity:1}}.Overlay--closing{animation:slow-out .5s forwards}@keyframes slow-out{0%{opacity:1}to{opacity:0}}.ModalOverlay{background:hsla(0,0%,100%,.9);padding:4rem 2rem}@media (max-width:48rem){.ModalOverlay{padding:4rem 1rem}}@media (max-width:25rem){.ModalOverlay{padding:4rem .5rem}}.ModalOverlay__content{border:1px solid rgba(0,0,0,.2);box-shadow:0 5px 15px rgba(0,0,0,.2)}.Text--display{font-size:6rem;line-height:1.1}.Text--display,.Text--h1{font-family:Moda Operandi Sans,Arial,sans-serif;letter-spacing:0}.Text--h1{font-size:3.75rem;line-height:1.2}.Text--h2{font-size:3rem;line-height:1.1}.Text--h2,.Text--h3{font-family:Moda Operandi Sans,Arial,sans-serif;letter-spacing:0}.Text--h3{font-size:2rem;line-height:1.2}.Text--h4{font-size:1.5rem;letter-spacing:0}.Text--h4,.Text--h5{font-family:Moda Operandi Sans,Arial,sans-serif;line-height:1.4}.Text--h5{font-size:1.25rem;letter-spacing:.02em}.Text--h6{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}.Text--body1{letter-spacing:.04em}.Text--body1,.Text--bold1{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6}.Text--bold1{letter-spacing:.1em;font-weight:700}.Text--body2{letter-spacing:.04em}.Text--body2,.Text--eyebrow{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4}.Text--eyebrow{letter-spacing:.1em;text-transform:uppercase}.Text--sans{font-family:Moda Operandi Sans,Arial,sans-serif}.Text--serif{font-family:"Moda Operandi Serif",Times New Roman,Times,serif}.Dialog{max-width:90vw;background-color:#fff;text-align:center}.Dialog__content{padding:2rem}@media (min-width:62.0625rem){.Dialog{max-width:40rem}}.Constrain{width:90%;margin:0 auto;max-width:100rem}@media (max-width:62rem){.Constrain{width:100%;padding:0 2rem}}@media (max-width:48rem){.Constrain{width:100%;padding:0 1rem}}@media (max-width:25rem){.Constrain{width:100%;padding:0 .5rem}}@media (max-width:62rem){.ExceedConstrain{margin:0 -2rem}}@media (max-width:48rem){.ExceedConstrain{margin:0 -1rem}}@media (max-width:25rem){.ExceedConstrain{margin:0 -.5rem}}.TextInput{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1;width:100%;padding:.75rem 1rem;border:1px solid #cacbcc;background-color:#fff;border-radius:0}@media (max-width:48rem){.TextInput{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.TextInput::-moz-placeholder{line-height:normal}.TextInput::placeholder{line-height:normal}.TextInput--focus,.TextInput:focus{outline:none;border-color:#191a1b}.TextInput--disabled,.TextInput:disabled{color:#cacbcc;border-color:#cacbcc;background-color:#f2f3f5}.TextInput--valid{border-color:#046c00}.TextInput--error,.TextInput--error:focus{border-color:#ee0700}.SearchInput{position:relative;display:inline-block}.SearchInput__clear,.SearchInput__icon{display:flex;align-items:center;justify-content:center;position:absolute;top:0;bottom:0;width:3rem;height:100%;color:#656566}.SearchInput__input--round-borders{border-radius:2.5rem}.SearchInput__input--no-borders{border:none}.SearchInput__icon{left:0;pointer-events:none;z-index:1}.SearchInput__clear{right:0}.SearchInput__clear:hover{color:#191a1b;cursor:pointer}.SearchInput>input{width:100%;padding-right:3rem;padding-left:3rem}.SelectOption{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;display:block;width:100%;text-align:left;padding:.5rem .75rem;color:#191a1b}.SelectOption--selected{text-decoration:underline}.SelectOption--active,.SelectOption:hover{background-color:#f2f3f5}.SelectOption--disabled{color:#979899;cursor:default}.SelectOption--disabled:hover,.SelectOptions{background-color:#fff}.SelectOptions{border:1px solid #cacbcc}.SelectOptions:focus{outline:0;border-color:#656566}.SelectOptions__search{margin:.5rem}.SelectOptions__none{padding:.5rem .75rem}.SelectOptions__list{overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:24rem}.Select{min-height:2.5625rem;position:relative;display:flex;cursor:pointer}@media (max-width:48rem){.Select{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.Select--disabled{cursor:default}.Select--disabled .Select__value{color:#979899;cursor:default}.Select--disabled .Select__value:focus,.Select--disabled .Select__value:hover{border-color:#cacbcc;background-color:#fff}.Select--error{border:1px solid #ee0700}.Select__value{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;display:block;width:100%;text-align:left;padding:.5rem 3rem .5rem .75rem;color:#191a1b;border:1px solid #cacbcc;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.8;cursor:pointer}@media (max-width:48rem){.Select__value{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.Select__value:hover{border-color:#656566;background-color:#f2f3f5}.Select__value:focus{border-color:#656566;background-color:#cacbcc}.Select__icon{pointer-events:none;position:absolute;right:1rem;top:50%;transform:translateY(-50%)}.Select__icon--shifted{right:2rem}.Select__options{display:flex;position:absolute;left:0;right:0;z-index:1}.Select__options--up{flex-direction:column-reverse;bottom:100%;margin-bottom:.25rem}.Select__options--down{flex-direction:column;margin-top:.25rem;top:100%}.Select__hidden-field{-moz-opacity:0;opacity:0;position:absolute;width:0;height:0}.Select__selected-color{border-radius:50%;border:1px solid #191a1b;display:inline-block;height:1rem;position:absolute;right:3rem;transform:translateY(25%);width:1rem}.MultiSelect{min-height:2.5625rem;position:relative;display:flex;width:100%}.MultiSelect--disabled{cursor:default}.MultiSelect--disabled .MultiSelect__search{color:#979899;cursor:default}.MultiSelect--disabled .MultiSelect__search:focus,.MultiSelect--disabled .MultiSelect__search:hover{border-color:#cacbcc;background-color:#f2f3f5}.MultiSelect--error{border:1px solid #ee0700}.MultiSelect__search{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1;width:100%;border:1px solid #cacbcc;background-color:#fff;border-radius:0;display:flex;align-items:center;padding:.25rem 3rem .25rem .25rem}@media (max-width:48rem){.MultiSelect__search{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.MultiSelect__search::-moz-placeholder{line-height:normal}.MultiSelect__search::placeholder{line-height:normal}.MultiSelect__search--focus,.MultiSelect__search:focus{outline:none;border-color:#191a1b}.MultiSelect__search--disabled,.MultiSelect__search:disabled{color:#cacbcc;border-color:#cacbcc;background-color:#f2f3f5}.MultiSelect__search--valid{border-color:#046c00}.MultiSelect__search--error,.MultiSelect__search--error:focus{border-color:#ee0700}.MultiSelect__selected-items{display:flex;flex-wrap:wrap}.MultiSelect__selected-item{display:flex;align-items:center;border:1px solid #191a1b;border-radius:.5rem;margin:.25rem;padding:.25rem}.MultiSelect__selected-value{cursor:default}.MultiSelect__exit{margin-left:.25rem;cursor:pointer}.MultiSelect__icon{pointer-events:none;position:absolute;right:1rem;top:50%;transform:translateY(-50%)}.MultiSelect__icon--shifted{right:2rem}.Field{display:flex;justify-content:flex-start;flex-direction:column}.Field>*{margin-top:0;margin-bottom:0}.Field>*+*{margin-top:.25rem}.Field>.Overlay{margin-top:0}.Field__context{position:relative}.Field__icon{position:absolute;top:50%;right:.5rem;color:#ee0700;transform:translateY(-50%);pointer-events:none}.Field__error,.Field__label{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em}.Field__label{color:#656566}.Field__error{color:#ee0700;padding-top:1px}.DefinitionList{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;margin:0}.DefinitionList>dd,.DefinitionList>dt{display:inline-block;margin:0}.DefinitionList>dt{color:#191a1b;margin-right:.5rem}.DefinitionList>dd,.DefinitionList>dd>a{color:#656566}.DefinitionList>dd>a{text-decoration:underline}.DefinitionList>dd>a:hover{text-decoration:none}.Divider{display:flex;align-items:center;justify-content:center;width:100%}.Divider:after,.Divider:before{content:"";flex:1;border:none;background-color:#cacbcc;height:1px;width:50%}.Divider__text{width:auto;padding:0 1rem}.Divider--two-line:after,.Divider--two-line:before{transform:translateY(-.0875rem);background-color:#191a1b;box-shadow:0 .175rem 0 0 #191a1b}.Divider--no-line:after,.Divider--no-line:before{display:none}.Expandable{display:flex;flex-direction:column}.Expandable__name{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;position:relative;text-align:left;cursor:pointer;padding:.75rem 1.5rem .75rem 0;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis}.Expandable__icon{height:100%;padding-top:1rem;position:absolute;right:0;top:0}.Expandable__contents{display:flex;justify-content:flex-start;flex-direction:column;font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;padding-bottom:.75rem;display:none;color:#191a1b}.Expandable__contents>*{margin-top:0;margin-bottom:0}.Expandable__contents>*+*{margin-top:.5rem}.Expandable__contents>.Overlay{margin-top:0}.Expandable__contents ol,.Expandable__contents ul{padding-left:1rem;list-style:disc}.Expandable__contents a{color:#191a1b}.Expandable--plus-minus .Expandable__name:after,.Expandable--plus-minus .Expandable__name:before{content:"";display:block;position:absolute;top:50%;right:0;transform:translateY(-50%);height:1px;width:1rem;background-color:#191a1b}.Expandable--plus-minus .Expandable__name:before{transform:translateY(-50%) rotate(90deg);transition:transform .2s}.Expandable--expanded .Expandable__name:before{transform:translateY(-50%)}.Expandable--expanded .Expandable__contents{display:block}.Expandable--with-border{border-top:1px solid #f2f3f5}.Expandable--dark-background{border-color:#656566;color:#fff}.Expandable--dark-background .Expandable__name:after,.Expandable--dark-background .Expandable__name:before{background-color:#fff}.Expandable--dark-background .Expandable__contents{color:#fff}.Label{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;color:#656566}.Label--hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.Loading{padding:1.5rem;display:flex;align-items:center;justify-content:center;height:100%;width:100%;transition:opacity 1s}.Loading .ArcWindow,.Loading .Circle,.Loading .Diamond,.Loading .Triangle{width:3rem;height:3rem;opacity:1;animation:fade 1s linear}@keyframes fade{0%,to{opacity:0}50%{opacity:1}}.LoadingBalls{fill:#191a1b}.LoadingShapes__item--current path{fill:#fff;transition:fill 1s}.Paginator,.Paginator__button{display:flex;justify-content:center}.Paginator__button{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;border:none;height:2rem;width:2rem;align-items:center;cursor:pointer;margin-right:.25rem;margin-left:.25rem;background-color:transparent}.Paginator__button:first-child{margin-left:0}.Paginator__button:last-child{margin-right:0}.Paginator__button:hover{background-color:#f2f3f5}.Paginator__button--next,.Paginator__button--previous{width:-moz-fit-content;width:fit-content}.Paginator__button--currentPage{background-color:#f2f3f5}.Paginator__next-chevron{margin-left:.5rem}.Paginator__previous-chevron{margin-right:.5rem}.Paginator__button--ellipsis{cursor:auto}.Paginator__button--ellipsis:hover{background:transparent}.PasswordInput{position:relative}.PasswordInput__editor{padding-right:5rem}.PasswordInput__password-action{position:absolute;top:.5rem;right:2rem}@media (max-width:48rem){.PasswordInput__password-action{top:.7rem}}.Popover{position:relative}.Popover__content{position:absolute;background-color:#fff;border:.0625rem solid #cacbcc;z-index:1}.Popover__content:before{content:"";display:block;position:absolute;top:-.5rem;width:100%;height:.5rem}.Popover__box--opening{animation:fade-in .75s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.Popover__box--closing{animation:fade-out 1s}@keyframes fade-out{to{opacity:0}}.Popover--anchor-topLeft .Popover__content{top:100%;bottom:auto;left:0;right:auto;transform:translateY(.5rem)}.Popover--anchor-topCenter .Popover__content{top:100%;bottom:auto;left:50%;right:auto;transform:translate(-50%,.5rem)}.Popover--anchor-topRight .Popover__content{top:100%;bottom:auto;left:auto;right:0;transform:translateY(.5rem)}.Popover--anchor-bottomLeft .Popover__content{top:auto;bottom:100%;left:0;right:auto;transform:translateY(-.5rem)}.Popover--anchor-bottomCenter .Popover__content{top:auto;bottom:100%;left:50%;right:auto;transform:translate(-50%,-.5rem)}.Popover--anchor-bottomRight .Popover__content{top:auto;bottom:100%;left:auto;right:0;transform:translateY(-.5rem)}.Popover--anchor-topCenter .Popover__caret,.Popover--anchor-topLeft .Popover__caret,.Popover--anchor-topRight .Popover__caret{top:100%}.Popover--anchor-topCenter .Popover__caret:after,.Popover--anchor-topCenter .Popover__caret:before,.Popover--anchor-topLeft .Popover__caret:after,.Popover--anchor-topLeft .Popover__caret:before,.Popover--anchor-topRight .Popover__caret:after,.Popover--anchor-topRight .Popover__caret:before{top:auto;bottom:-.5625rem;border-top:none;border-bottom:.5rem solid #fff}.Popover--anchor-topCenter .Popover__caret:before,.Popover--anchor-topLeft .Popover__caret:before,.Popover--anchor-topRight .Popover__caret:before{border-bottom:.5rem solid #191a1b}.Popover--anchor-bottomCenter .Popover__caret,.Popover--anchor-bottomLeft .Popover__caret,.Popover--anchor-bottomRight .Popover__caret{top:0}.Popover--anchor-bottomCenter .Popover__caret:after,.Popover--anchor-bottomCenter .Popover__caret:before,.Popover--anchor-bottomLeft .Popover__caret:after,.Popover--anchor-bottomLeft .Popover__caret:before,.Popover--anchor-bottomRight .Popover__caret:after,.Popover--anchor-bottomRight .Popover__caret:before{top:-.5625rem;bottom:auto;border-top:.5rem solid #fff;border-bottom:none}.Popover--anchor-bottomCenter .Popover__caret:before,.Popover--anchor-bottomLeft .Popover__caret:before,.Popover--anchor-bottomRight .Popover__caret:before{border-top:.5rem solid #191a1b}.Popover__trigger{position:relative;display:block}.Popover__caret{width:100%;position:absolute;z-index:2}.Popover__caret:after,.Popover__caret:before{content:"";position:absolute;left:50%;transform:translateX(-50%);border-left:.5rem solid transparent;border-right:.5rem solid transparent}.PromoBanner{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4;letter-spacing:.04em;background-color:#f8f5ee;border-top:.25rem solid #d56b27}.PromoBanner__constrain{display:flex;justify-content:space-between;align-items:center}.PromoBanner__child{min-width:12rem;padding:.5rem .75rem}.PromoBanner__child--center{flex:1;text-align:center}.PromoBanner__child--left{padding-left:0}.PromoBanner__child--right{padding-right:0;text-align:right}.PromoBanner__child>a{color:#191a1b;position:relative;text-decoration:none}.PromoBanner__child>a:after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;border-bottom:1px solid;opacity:.75}@media (max-width:48rem){.PromoBanner .PromoBanner__child--left,.PromoBanner .PromoBanner__child--right{display:none}}.RadioButton{display:flex;justify-content:flex-start;flex-direction:row;position:relative;align-items:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer;color:#191a1b}.RadioButton>*{margin-left:0;margin-right:0}.RadioButton>*+*{margin-left:.5rem}.RadioButton>.Overlay{margin-left:0}.RadioButton__indicator{position:relative;width:1rem;height:1rem;flex-shrink:0;border:1px solid;border-radius:50%;background-color:#fff}.RadioButton__indicator--checked{background-color:#191a1b}.RadioButton__indicator--checked:after{content:"";display:block;position:absolute;top:.25rem;right:.25rem;bottom:.25rem;left:.25rem;border-radius:50%;background-color:#fff}.RadioButton__indicator--disabled{color:#cacbcc;pointer-events:none;background-color:#fff}.RadioButton__indicator--disabled:after{background-color:#cacbcc}.RadioButton__input{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.RadioButton__label{font-size:.8125rem;line-height:1.6}.RadioButton__label,.SelectableButton{font-family:Moda Operandi Sans,Arial,sans-serif;letter-spacing:.04em;color:#191a1b}.SelectableButton{font-size:.75rem;line-height:1.4;text-transform:uppercase;display:inline-flex;align-items:center;justify-content:center;text-align:center;max-width:100%;padding:.5rem .75rem;cursor:pointer;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;border:1px solid #cacbcc;background-color:transparent;transition:background-color .2s}.SelectableButton>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}.SelectableButton--hover,.SelectableButton:hover{color:#191a1b;border-color:#cacbcc;background-color:#f2f3f5}.SelectableButton--selected,.SelectableButton--selected:hover{color:#191a1b;border-color:#191a1b;background-color:transparent}.SelectableButton--unavailable,.SelectableButton--unavailable:hover{color:#cacbcc;border-color:#cacbcc;background:linear-gradient(to bottom right,#fff calc(50% - 1px),#cacbcc,#fff calc(50% + 1px))}.SlidingPane{position:fixed;visibility:hidden;width:100%;bottom:-100vh;left:0;right:0;transition:all .5s ease-out;background-color:#fff;margin-left:0}.SlidingPane--active{visibility:visible;bottom:0}.SlidingPane__top{padding:.75rem;border-bottom:1px solid #cacbcc;box-shadow:0 -1px 2px rgba(25,26,27,.1)}.SlidingPane__close{position:absolute;top:0;right:0;padding:1.2rem;cursor:pointer}.SlidingPane__content{padding:1rem}.SlidingPane__overlay{background-color:rgba(0,0,0,.3);top:0;bottom:0;left:0;right:0;position:fixed;display:none}.SlidingPane__overlay--active{display:block}.TabList{display:flex;justify-content:flex-start;flex-direction:row;border-bottom:1px solid #cacbcc}.TabList>*{margin-left:0;margin-right:0}.TabList>*+*{margin-left:1rem}.TabList>.Overlay{margin-left:0}.Tab{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;padding:1rem 0;border-bottom:2px solid transparent;color:#656566;text-align:left;cursor:pointer}.Tab--active{color:#191a1b;border-bottom:2px solid #191a1b}.Tab:active,.Tab:focus{outline:none}.TabPanels{margin-top:1rem}.Tag{display:flex;justify-content:flex-start;flex-direction:row;font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;display:inline-flex;align-items:center;padding:.5rem;border:1px solid #cacbcc;white-space:nowrap}.Tag>*{margin-left:0;margin-right:0}.Tag>*+*{margin-left:.5rem}.Tag>.Overlay{margin-left:0}.Tag:focus,.Tag:hover{border-color:#191a1b}.Tag--disabled{color:#979899}.Tag--disabled:focus,.Tag--disabled:hover{border-color:#cacbcc}.Textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1;width:100%;padding:.75rem 1rem;border:1px solid #cacbcc;background-color:#fff;border-radius:0;font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;resize:none}@media (max-width:48rem){.Textarea{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.Textarea::-moz-placeholder{line-height:normal}.Textarea::placeholder{line-height:normal}.Textarea--focus,.Textarea:focus{outline:none;border-color:#191a1b}.Textarea--disabled,.Textarea:disabled{color:#cacbcc;border-color:#cacbcc;background-color:#f2f3f5}.Textarea--valid{border-color:#046c00}.Textarea--error,.Textarea--error:focus{border-color:#ee0700}.Toast{color:#fff;padding:.75rem}.Toast--success{background-color:#046c00}.Toast--warning{background-color:#d56b27}.Toast--error{background-color:#ee0700}.VerticalDivider{border-left:1px solid #191a1b}.VerticalDivider--double{width:.175rem;border-right:1px solid #191a1b}
1
+ .Stack.Stack--horizontal-0{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-0>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-0>*+*,.Stack.Stack--horizontal-0>.Overlay{margin-left:0}.Stack.Stack--horizontal-1{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-1>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-1>*+*{margin-left:.25rem}.Stack.Stack--horizontal-1>.Overlay{margin-left:0}.Stack.Stack--horizontal-2{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-2>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-2>*+*{margin-left:.5rem}.Stack.Stack--horizontal-2>.Overlay{margin-left:0}.Stack.Stack--horizontal-3{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-3>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-3>*+*{margin-left:.75rem}.Stack.Stack--horizontal-3>.Overlay{margin-left:0}.Stack.Stack--horizontal-4{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-4>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-4>*+*{margin-left:1rem}.Stack.Stack--horizontal-4>.Overlay{margin-left:0}.Stack.Stack--horizontal-5{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-5>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-5>*+*{margin-left:1.5rem}.Stack.Stack--horizontal-5>.Overlay{margin-left:0}.Stack.Stack--horizontal-6{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-6>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-6>*+*{margin-left:2rem}.Stack.Stack--horizontal-6>.Overlay{margin-left:0}.Stack.Stack--horizontal-7{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-7>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-7>*+*{margin-left:3rem}.Stack.Stack--horizontal-7>.Overlay{margin-left:0}.Stack.Stack--horizontal-8{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-8>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-8>*+*{margin-left:4rem}.Stack.Stack--horizontal-8>.Overlay{margin-left:0}.Stack.Stack--horizontal-9{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-9>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-9>*+*{margin-left:6rem}.Stack.Stack--horizontal-9>.Overlay{margin-left:0}.Stack.Stack--horizontal-10{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-10>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-10>*+*{margin-left:8rem}.Stack.Stack--horizontal-10>.Overlay{margin-left:0}.Stack.Stack--horizontal-11{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-11>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-11>*+*{margin-left:12rem}.Stack.Stack--horizontal-11>.Overlay{margin-left:0}.Stack.Stack--horizontal-12{display:flex;justify-content:flex-start;flex-direction:row}.Stack.Stack--horizontal-12>*{margin-left:0;margin-right:0}.Stack.Stack--horizontal-12>*+*{margin-left:24rem}.Stack.Stack--horizontal-12>.Overlay{margin-left:0}.Stack.Stack--vertical-0{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-0>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-0>*+*,.Stack.Stack--vertical-0>.Overlay{margin-top:0}.Stack.Stack--vertical-1{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-1>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-1>*+*{margin-top:.25rem}.Stack.Stack--vertical-1>.Overlay{margin-top:0}.Stack.Stack--vertical-2{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-2>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-2>*+*{margin-top:.5rem}.Stack.Stack--vertical-2>.Overlay{margin-top:0}.Stack.Stack--vertical-3{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-3>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-3>*+*{margin-top:.75rem}.Stack.Stack--vertical-3>.Overlay{margin-top:0}.Stack.Stack--vertical-4{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-4>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-4>*+*{margin-top:1rem}.Stack.Stack--vertical-4>.Overlay{margin-top:0}.Stack.Stack--vertical-5{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-5>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-5>*+*{margin-top:1.5rem}.Stack.Stack--vertical-5>.Overlay{margin-top:0}.Stack.Stack--vertical-6{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-6>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-6>*+*{margin-top:2rem}.Stack.Stack--vertical-6>.Overlay{margin-top:0}.Stack.Stack--vertical-7{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-7>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-7>*+*{margin-top:3rem}.Stack.Stack--vertical-7>.Overlay{margin-top:0}.Stack.Stack--vertical-8{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-8>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-8>*+*{margin-top:4rem}.Stack.Stack--vertical-8>.Overlay{margin-top:0}.Stack.Stack--vertical-9{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-9>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-9>*+*{margin-top:6rem}.Stack.Stack--vertical-9>.Overlay{margin-top:0}.Stack.Stack--vertical-10{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-10>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-10>*+*{margin-top:8rem}.Stack.Stack--vertical-10>.Overlay{margin-top:0}.Stack.Stack--vertical-11{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-11>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-11>*+*{margin-top:12rem}.Stack.Stack--vertical-11>.Overlay{margin-top:0}.Stack.Stack--vertical-12{display:flex;justify-content:flex-start;flex-direction:column}.Stack.Stack--vertical-12>*{margin-top:0;margin-bottom:0}.Stack.Stack--vertical-12>*+*{margin-top:24rem}.Stack.Stack--vertical-12>.Overlay{margin-top:0}.StatesProps{font-family:Menlo,Monaco,Consolas,Courier New,monospace;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;padding-top:.5rem;color:#979899;border-top:1px dotted #cacbcc}.StatesProps>strong{text-decoration:underline;color:#191a1b}.StatesProps:before{content:"<";color:#cacbcc}.StatesProps:after{content:"/>";color:#cacbcc}.State{border:1px dotted #979899;padding:.5rem}.State__props{display:block;margin-top:.5rem}.States{display:flex;justify-content:flex-start;flex-direction:column}.States>*{margin-top:0;margin-bottom:0}.States>*+*{margin-top:2rem}.States>.Overlay{margin-top:0}.AspectRatioBox,.AspectRatioBox__wrapper{position:relative;width:100%}.AspectRatioBox__wrapper{height:0;overflow:hidden}.AspectRatioBox__content{position:absolute;top:0;left:0;width:100%;height:100%}.AspectRatioBox--outlined{border:1px dotted}.Badge{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;display:inline-block;color:#191a1b;border:1px solid;padding:.25rem;-webkit-user-select:none;-moz-user-select:none;user-select:none}.Badge,.Badge--default{background-color:transparent;border-color:#979899;color:#656566}.Badge--forest-green{background-color:#003728;border-color:transparent;color:#fff}.Badge--klein-blue{background-color:#263078}.Badge--brick,.Badge--klein-blue{border-color:transparent;color:#fff}.Badge--brick{background-color:#933a20}.Badge--dark-fuchsia{border-color:#b43ca0;color:#b43ca0;font-weight:700;text-transform:none}.Badge--noise{line-height:1.6;background-color:#f2f3f5;border-color:transparent;color:#191a1b;text-transform:none;line-height:1.4}.Badge--noise,.Breadcrumbs{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;letter-spacing:.04em}.Breadcrumbs{display:flex;flex-flow:wrap;list-style:none;margin:0}.Breadcrumbs,.Clickable{line-height:1.6;padding:0}.Clickable{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;letter-spacing:.04em;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;color:inherit;font-size:1rem;text-decoration:none;white-space:nowrap}.Clickable:not(.Clickable--disabled){cursor:pointer}.Clickable>label{cursor:inherit}.ControlLink{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;display:inline-flex}.ControlLink:focus:not(.ControlLink--disabled),.ControlLink:hover:not(.ControlLink--disabled){position:relative;text-decoration:none;color:#191a1b;opacity:.7}.ControlLink:focus:not(.ControlLink--disabled):after,.ControlLink:hover:not(.ControlLink--disabled):after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;border-bottom:1px solid;opacity:.75}.ControlLink--underlined{position:relative;text-decoration:none}.ControlLink--underlined:after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;border-bottom:1px solid;opacity:.75}.ControlLink--disabled{color:#979899}.Breadcrumb{position:relative;padding-right:1rem;margin-right:.5rem;white-space:nowrap;overflow:hidden}.Breadcrumb:after{display:block;content:" ";position:absolute;top:50%;right:.25rem;transform:translateY(-50%) rotate(25deg);border-right:1px solid #979899;height:75%}.Breadcrumb:last-child{margin-right:0}.Breadcrumb:last-child:after,.Breakpoint{display:none}@media (min-width:0) and (max-width:25rem){.Breakpoint--at-xs{display:block}}@media (min-width:25.0625rem){.Breakpoint--gt-xs{display:block}}@media (max-width:25rem){.Breakpoint--lt-xs{display:block}}@media (min-width:0) and (max-width:48rem){.Breakpoint--at-sm{display:block}}@media (min-width:48.0625rem){.Breakpoint--gt-sm{display:block}}@media (max-width:48rem){.Breakpoint--lt-sm{display:block}}@media (min-width:48.0625rem) and (max-width:62rem){.Breakpoint--at-md{display:block}}@media (min-width:62.0625rem){.Breakpoint--gt-md{display:block}}@media (max-width:62rem){.Breakpoint--lt-md{display:block}}@media (min-width:62.0625rem) and (max-width:80rem){.Breakpoint--at-lg{display:block}}@media (min-width:80.0625rem){.Breakpoint--gt-lg{display:block}}@media (max-width:80rem){.Breakpoint--lt-lg{display:block}}@media (min-width:80.0625rem) and (max-width:100rem){.Breakpoint--at-xl{display:block}}@media (min-width:100.0625rem){.Breakpoint--gt-xl{display:block}}@media (max-width:100rem){.Breakpoint--lt-xl{display:block}}.Button{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;text-align:center;padding:1rem 3rem;border:1px solid;cursor:pointer;text-decoration:none;transition:background-color .2s}.Button>*{margin-right:.5rem}.Button,.Button--primary{color:#fff;border-color:#191a1b;background-color:#191a1b;-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:auto}.Button--primary.Button--hover,.Button--primary:hover,.Button.Button--hover,.Button:hover{color:#fff;border-color:rgba(151,152,153,.32);background:linear-gradient(0deg,rgba(151,152,153,.32),rgba(151,152,153,.32)),#191a1b}.Button--primary.Button--focus,.Button--primary:focus,.Button.Button--focus,.Button:focus{color:#fff;border-color:rgba(151,152,153,.12);background:linear-gradient(0deg,hsla(0,0%,100%,.12),hsla(0,0%,100%,.12)),#191a1b}.Button--primary.Button--disabled,.Button--primary:disabled,.Button.Button--disabled,.Button:disabled{color:#191a1b;border-color:#f2f3f5;background-color:#f2f3f5;cursor:default;pointer-events:none}.Button--secondary{color:#191a1b;border-color:#191a1b;background-color:#fff}.Button--secondary.Button--hover,.Button--secondary:hover{color:#191a1b;border-color:#191a1b;background-color:rgba(242,243,245,.32)}.Button--secondary.Button--focus,.Button--secondary:focus{color:#191a1b;border-color:#191a1b;background-color:#f2f3f5}.Button--secondary.Button--disabled,.Button--secondary:disabled{color:#656566;border-color:#979899;background-color:#f2f3f5;cursor:default;pointer-events:none}.Button--tertiary{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;padding:.5rem .75rem;color:#191a1b;border-color:#cacbcc;background-color:#fff;text-transform:none;line-height:1.4}.Button--tertiary.Button--hover,.Button--tertiary:hover{color:#191a1b;border-color:#cacbcc;background-color:rgba(242,243,245,.32)}.Button--tertiary.Button--focus,.Button--tertiary:focus{color:#191a1b;border-color:#cacbcc;background-color:#f2f3f5}.Button--tertiary.Button--disabled,.Button--tertiary:disabled{color:#656566;border-color:#979899;background-color:#f2f3f5;cursor:default;pointer-events:none}.Button--elevated{box-shadow:0 1px 4px rgba(0,0,0,.09)}.Button--chip{border-radius:2rem}.Checkbox{display:flex;justify-content:flex-start;flex-direction:row;position:relative;align-items:flex-start;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer;color:#191a1b}.Checkbox>*{margin-left:0;margin-right:0}.Checkbox>*+*{margin-left:.5rem}.Checkbox>.Overlay{margin-left:0}.Checkbox__indicator{position:relative;width:1rem;height:1rem;margin-top:.125rem;flex-shrink:0;border:1px solid}.Checkbox__indicator--disabled{color:#cacbcc;pointer-events:none}.Checkbox__indicator--disabled:after{background-color:#cacbcc}.Checkbox__check-mark{margin:7.5%}.Checkbox__input{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.Checkbox__label{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;color:#191a1b}.ColorSwatch{position:relative;width:2rem;height:2rem;border:1px solid transparent;background-color:transparent;border-radius:50%;padding:1px;cursor:pointer;flex-shrink:0}.ColorSwatch--small{width:1.5rem;height:1.5rem}.ColorSwatch:before{display:none;content:"";position:absolute;top:50%;left:50%;width:33%;height:33%;transform:translate(-50%,-50%);border-radius:50%;background-color:#fff;z-index:1}.ColorSwatch__chip{position:relative;width:100%;height:100%;border-radius:50%}.ColorSwatch__chip:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background-color:rgba(0,0,0,.2);opacity:0;transition:opacity .2s}.ColorSwatch--hover,.ColorSwatch:hover{border-color:#cacbcc}.ColorSwatch--hover:before,.ColorSwatch:hover:before{display:block}.ColorSwatch--hover .ColorSwatch__chip:before,.ColorSwatch:hover .ColorSwatch__chip:before{opacity:1}.ColorSwatch--focus:before,.ColorSwatch--selected:before,.ColorSwatch:focus:before{display:block}.ColorSwatch--sold-out .ColorSwatch__chip:after{content:"";display:block;position:absolute;top:50%;left:50%;width:100%;height:1px;transform:translate(-50%,-50%) rotate(-45deg);background-color:rgba(0,0,0,.5);z-index:1}.ColorSwatch--on-sale:after{content:"";display:block;position:absolute;top:-.125rem;right:-.125rem;width:.25rem;height:.25rem;border-radius:50%;background-color:#ee0700}.ColorSwatch--disabled,.ColorSwatch:disabled{pointer-events:none}.ColorSwatch--light:before{background-color:#191a1b}.ColorSwatch--light .ColorSwatch__chip{border:1px solid rgba(25,26,27,.25)}.Modal{position:fixed;justify-content:center;overflow-y:auto;-webkit-overflow-scrolling:touch}.Modal,.Overlay{top:0;right:0;bottom:0;left:0;display:flex;align-items:center}.Overlay{justify-content:flex-start;flex-direction:column;position:absolute;background-color:hsla(0,0%,100%,.9);justify-content:center;color:#191a1b;animation:slow-in .5s}.Overlay>*{margin-top:0;margin-bottom:0}.Overlay>*+*{margin-top:.5rem}.Overlay>.Overlay{margin-top:0}@keyframes slow-in{0%{opacity:0}to{opacity:1}}.Overlay--closing{animation:slow-out .5s forwards}@keyframes slow-out{0%{opacity:1}to{opacity:0}}.ModalOverlay{background:hsla(0,0%,100%,.9);padding:4rem 2rem}@media (max-width:48rem){.ModalOverlay{padding:4rem 1rem}}@media (max-width:25rem){.ModalOverlay{padding:4rem .5rem}}.ModalOverlay__content{border:1px solid rgba(0,0,0,.2);box-shadow:0 5px 15px rgba(0,0,0,.2)}.Text--display{font-size:6rem;line-height:1.1}.Text--display,.Text--h1{font-family:Moda Operandi Sans,Arial,sans-serif;letter-spacing:0}.Text--h1{font-size:3.75rem;line-height:1.2}.Text--h2{font-size:3rem;line-height:1.1}.Text--h2,.Text--h3{font-family:Moda Operandi Sans,Arial,sans-serif;letter-spacing:0}.Text--h3{font-size:2rem;line-height:1.2}.Text--h4{font-size:1.5rem;letter-spacing:0}.Text--h4,.Text--h5{font-family:Moda Operandi Sans,Arial,sans-serif;line-height:1.4}.Text--h5{font-size:1.25rem;letter-spacing:.02em}.Text--h6{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}.Text--body1{letter-spacing:.04em}.Text--body1,.Text--bold1{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6}.Text--bold1{letter-spacing:.1em;font-weight:700}.Text--body2{letter-spacing:.04em}.Text--body2,.Text--eyebrow{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4}.Text--eyebrow{letter-spacing:.1em;text-transform:uppercase}.Text--sans{font-family:font-family(sans)}.Text--serif{font-family:font-family(serif)}.Dialog{max-width:90vw;background-color:#fff;text-align:center}.Dialog__content{padding:2rem}@media (min-width:62.0625rem){.Dialog{max-width:40rem}}.Constrain{width:90%;margin:0 auto;max-width:100rem}@media (max-width:62rem){.Constrain{width:100%;padding:0 2rem}}@media (max-width:48rem){.Constrain{width:100%;padding:0 1rem}}@media (max-width:25rem){.Constrain{width:100%;padding:0 .5rem}}@media (max-width:62rem){.ExceedConstrain{margin:0 -2rem}}@media (max-width:48rem){.ExceedConstrain{margin:0 -1rem}}@media (max-width:25rem){.ExceedConstrain{margin:0 -.5rem}}.TextInput{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1;width:100%;padding:.75rem 1rem;border:1px solid #cacbcc;background-color:#fff;border-radius:0}@media (max-width:48rem){.TextInput{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.TextInput::-moz-placeholder{line-height:normal}.TextInput::placeholder{line-height:normal}.TextInput--focus,.TextInput:focus{outline:none;border-color:#191a1b}.TextInput--disabled,.TextInput:disabled{color:#cacbcc;border-color:#cacbcc;background-color:#f2f3f5}.TextInput--valid{border-color:#046c00}.TextInput--error,.TextInput--error:focus{border-color:#ee0700}.SearchInput{position:relative;display:inline-block}.SearchInput__clear,.SearchInput__icon{display:flex;align-items:center;justify-content:center;position:absolute;top:0;bottom:0;width:3rem;height:100%;color:#656566}.SearchInput__input--round-borders{border-radius:2.5rem}.SearchInput__input--no-borders{border:none}.SearchInput__icon{left:0;pointer-events:none;z-index:1}.SearchInput__clear{right:0}.SearchInput__clear:hover{color:#191a1b;cursor:pointer}.SearchInput>input{width:100%;padding-right:3rem;padding-left:3rem}.SelectOption{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;display:block;width:100%;text-align:left;padding:.5rem .75rem;color:#191a1b}.SelectOption--selected{text-decoration:underline}.SelectOption--active,.SelectOption:hover{background-color:#f2f3f5}.SelectOption--disabled{color:#979899;cursor:default}.SelectOption--disabled:hover,.SelectOptions{background-color:#fff}.SelectOptions{border:1px solid #cacbcc}.SelectOptions:focus{outline:0;border-color:#656566}.SelectOptions__search{margin:.5rem}.SelectOptions__none{padding:.5rem .75rem}.SelectOptions__list{overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:24rem}.Select{min-height:2.5625rem;position:relative;display:flex;cursor:pointer}@media (max-width:48rem){.Select{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.Select--disabled{cursor:default}.Select--disabled .Select__value{color:#979899;cursor:default}.Select--disabled .Select__value:focus,.Select--disabled .Select__value:hover{border-color:#cacbcc;background-color:#fff}.Select--error{border:1px solid #ee0700}.Select__value{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;display:block;width:100%;text-align:left;padding:.5rem 3rem .5rem .75rem;color:#191a1b;border:1px solid #cacbcc;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.8;cursor:pointer}@media (max-width:48rem){.Select__value{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.Select__value:hover{border-color:#656566;background-color:#f2f3f5}.Select__value:focus{border-color:#656566;background-color:#cacbcc}.Select__icon{pointer-events:none;position:absolute;right:1rem;top:50%;transform:translateY(-50%)}.Select__icon--shifted{right:2rem}.Select__options{display:flex;position:absolute;left:0;right:0;z-index:1}.Select__options--up{flex-direction:column-reverse;bottom:100%;margin-bottom:.25rem}.Select__options--down{flex-direction:column;margin-top:.25rem;top:100%}.Select__hidden-field{-moz-opacity:0;opacity:0;position:absolute;width:0;height:0}.Select__selected-color{border-radius:50%;border:1px solid #191a1b;display:inline-block;height:1rem;position:absolute;right:3rem;transform:translateY(25%);width:1rem}.MultiSelect{min-height:2.5625rem;position:relative;display:flex;width:100%}.MultiSelect--disabled{cursor:default}.MultiSelect--disabled .MultiSelect__search{color:#979899;cursor:default}.MultiSelect--disabled .MultiSelect__search:focus,.MultiSelect--disabled .MultiSelect__search:hover{border-color:#cacbcc;background-color:#f2f3f5}.MultiSelect--error{border:1px solid #ee0700}.MultiSelect__search{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1;width:100%;border:1px solid #cacbcc;background-color:#fff;border-radius:0;display:flex;align-items:center;padding:.25rem 3rem .25rem .25rem}@media (max-width:48rem){.MultiSelect__search{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.MultiSelect__search::-moz-placeholder{line-height:normal}.MultiSelect__search::placeholder{line-height:normal}.MultiSelect__search--focus,.MultiSelect__search:focus{outline:none;border-color:#191a1b}.MultiSelect__search--disabled,.MultiSelect__search:disabled{color:#cacbcc;border-color:#cacbcc;background-color:#f2f3f5}.MultiSelect__search--valid{border-color:#046c00}.MultiSelect__search--error,.MultiSelect__search--error:focus{border-color:#ee0700}.MultiSelect__selected-items{display:flex;flex-wrap:wrap}.MultiSelect__selected-item{display:flex;align-items:center;border:1px solid #191a1b;border-radius:.5rem;margin:.25rem;padding:.25rem}.MultiSelect__selected-value{cursor:default}.MultiSelect__exit{margin-left:.25rem;cursor:pointer}.MultiSelect__icon{pointer-events:none;position:absolute;right:1rem;top:50%;transform:translateY(-50%)}.MultiSelect__icon--shifted{right:2rem}.Field{display:flex;justify-content:flex-start;flex-direction:column}.Field>*{margin-top:0;margin-bottom:0}.Field>*+*{margin-top:.25rem}.Field>.Overlay{margin-top:0}.Field__context{position:relative}.Field__icon{position:absolute;top:50%;right:.5rem;color:#ee0700;transform:translateY(-50%);pointer-events:none}.Field__error,.Field__label{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em}.Field__label{color:#656566}.Field__error{color:#ee0700;padding-top:1px}.DefinitionList{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;margin:0}.DefinitionList>dd,.DefinitionList>dt{display:inline-block;margin:0}.DefinitionList>dt{color:#191a1b;margin-right:.5rem}.DefinitionList>dd,.DefinitionList>dd>a{color:#656566}.DefinitionList>dd>a{text-decoration:underline}.DefinitionList>dd>a:hover{text-decoration:none}.Divider{display:flex;align-items:center;justify-content:center;width:100%}.Divider:after,.Divider:before{content:"";flex:1;border:none;background-color:#cacbcc;height:1px;width:50%}.Divider__text{width:auto;padding:0 1rem}.Divider--two-line:after,.Divider--two-line:before{transform:translateY(-.0875rem);background-color:#191a1b;box-shadow:0 .175rem 0 0 #191a1b}.Divider--no-line:after,.Divider--no-line:before{display:none}.Expandable{display:flex;flex-direction:column}.Expandable__name{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;position:relative;text-align:left;cursor:pointer;padding:.75rem 1.5rem .75rem 0;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis}.Expandable__icon{height:100%;padding-top:1rem;position:absolute;right:0;top:0}.Expandable__contents{display:flex;justify-content:flex-start;flex-direction:column;font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;padding-bottom:.75rem;display:none;color:#191a1b}.Expandable__contents>*{margin-top:0;margin-bottom:0}.Expandable__contents>*+*{margin-top:.5rem}.Expandable__contents>.Overlay{margin-top:0}.Expandable__contents ol,.Expandable__contents ul{padding-left:1rem;list-style:disc}.Expandable__contents a{color:#191a1b}.Expandable--plus-minus .Expandable__name:after,.Expandable--plus-minus .Expandable__name:before{content:"";display:block;position:absolute;top:50%;right:0;transform:translateY(-50%);height:1px;width:1rem;background-color:#191a1b}.Expandable--plus-minus .Expandable__name:before{transform:translateY(-50%) rotate(90deg);transition:transform .2s}.Expandable--expanded .Expandable__name:before{transform:translateY(-50%)}.Expandable--expanded .Expandable__contents{display:block}.Expandable--with-border{border-top:1px solid #f2f3f5}.Expandable--dark-background{border-color:#656566;color:#fff}.Expandable--dark-background .Expandable__name:after,.Expandable--dark-background .Expandable__name:before{background-color:#fff}.Expandable--dark-background .Expandable__contents{color:#fff}.Label{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;color:#656566}.Label--hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.Loading{padding:1.5rem;display:flex;align-items:center;justify-content:center;height:100%;width:100%;transition:opacity 1s}.Loading .ArcWindow,.Loading .Circle,.Loading .Diamond,.Loading .Triangle{width:3rem;height:3rem;opacity:1;animation:fade 1s linear}@keyframes fade{0%,to{opacity:0}50%{opacity:1}}.LoadingBalls{fill:#191a1b}.LoadingShapes__item--current path{fill:#fff;transition:fill 1s}.Paginator,.Paginator__button{display:flex;justify-content:center}.Paginator__button{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;border:none;height:2rem;width:2rem;align-items:center;cursor:pointer;margin-right:.25rem;margin-left:.25rem;background-color:transparent}.Paginator__button:first-child{margin-left:0}.Paginator__button:last-child{margin-right:0}.Paginator__button:hover{background-color:#f2f3f5}.Paginator__button--next,.Paginator__button--previous{width:-moz-fit-content;width:fit-content}.Paginator__button--currentPage{background-color:#f2f3f5}.Paginator__next-chevron{margin-left:.5rem}.Paginator__previous-chevron{margin-right:.5rem}.Paginator__button--ellipsis{cursor:auto}.Paginator__button--ellipsis:hover{background:transparent}.PasswordInput{position:relative}.PasswordInput__editor{padding-right:5rem}.PasswordInput__password-action{position:absolute;top:.5rem;right:2rem}@media (max-width:48rem){.PasswordInput__password-action{top:.7rem}}.Popover{position:relative}.Popover__content{position:absolute;background-color:#fff;border:.0625rem solid #cacbcc;z-index:1}.Popover__content:before{content:"";display:block;position:absolute;top:-.5rem;width:100%;height:.5rem}.Popover__box--opening{animation:fade-in .75s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.Popover__box--closing{animation:fade-out 1s}@keyframes fade-out{to{opacity:0}}.Popover--anchor-topLeft .Popover__content{top:100%;bottom:auto;left:0;right:auto;transform:translateY(.5rem)}.Popover--anchor-topCenter .Popover__content{top:100%;bottom:auto;left:50%;right:auto;transform:translate(-50%,.5rem)}.Popover--anchor-topRight .Popover__content{top:100%;bottom:auto;left:auto;right:0;transform:translateY(.5rem)}.Popover--anchor-bottomLeft .Popover__content{top:auto;bottom:100%;left:0;right:auto;transform:translateY(-.5rem)}.Popover--anchor-bottomCenter .Popover__content{top:auto;bottom:100%;left:50%;right:auto;transform:translate(-50%,-.5rem)}.Popover--anchor-bottomRight .Popover__content{top:auto;bottom:100%;left:auto;right:0;transform:translateY(-.5rem)}.Popover--anchor-topCenter .Popover__caret,.Popover--anchor-topLeft .Popover__caret,.Popover--anchor-topRight .Popover__caret{top:100%}.Popover--anchor-topCenter .Popover__caret:after,.Popover--anchor-topCenter .Popover__caret:before,.Popover--anchor-topLeft .Popover__caret:after,.Popover--anchor-topLeft .Popover__caret:before,.Popover--anchor-topRight .Popover__caret:after,.Popover--anchor-topRight .Popover__caret:before{top:auto;bottom:-.5625rem;border-top:none;border-bottom:.5rem solid #fff}.Popover--anchor-topCenter .Popover__caret:before,.Popover--anchor-topLeft .Popover__caret:before,.Popover--anchor-topRight .Popover__caret:before{border-bottom:.5rem solid #191a1b}.Popover--anchor-bottomCenter .Popover__caret,.Popover--anchor-bottomLeft .Popover__caret,.Popover--anchor-bottomRight .Popover__caret{top:0}.Popover--anchor-bottomCenter .Popover__caret:after,.Popover--anchor-bottomCenter .Popover__caret:before,.Popover--anchor-bottomLeft .Popover__caret:after,.Popover--anchor-bottomLeft .Popover__caret:before,.Popover--anchor-bottomRight .Popover__caret:after,.Popover--anchor-bottomRight .Popover__caret:before{top:-.5625rem;bottom:auto;border-top:.5rem solid #fff;border-bottom:none}.Popover--anchor-bottomCenter .Popover__caret:before,.Popover--anchor-bottomLeft .Popover__caret:before,.Popover--anchor-bottomRight .Popover__caret:before{border-top:.5rem solid #191a1b}.Popover__trigger{position:relative;display:block}.Popover__caret{width:100%;position:absolute;z-index:2}.Popover__caret:after,.Popover__caret:before{content:"";position:absolute;left:50%;transform:translateX(-50%);border-left:.5rem solid transparent;border-right:.5rem solid transparent}.PromoBanner{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4;letter-spacing:.04em;background-color:#f8f5ee;border-top:.25rem solid #d56b27}.PromoBanner__constrain{display:flex;justify-content:space-between;align-items:center}.PromoBanner__child{min-width:12rem;padding:.5rem .75rem}.PromoBanner__child--center{flex:1;text-align:center}.PromoBanner__child--left{padding-left:0}.PromoBanner__child--right{padding-right:0;text-align:right}.PromoBanner__child>a{color:#191a1b;position:relative;text-decoration:none}.PromoBanner__child>a:after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;border-bottom:1px solid;opacity:.75}@media (max-width:48rem){.PromoBanner .PromoBanner__child--left,.PromoBanner .PromoBanner__child--right{display:none}}.RadioButton{display:flex;justify-content:flex-start;flex-direction:row;position:relative;align-items:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer;color:#191a1b}.RadioButton>*{margin-left:0;margin-right:0}.RadioButton>*+*{margin-left:.5rem}.RadioButton>.Overlay{margin-left:0}.RadioButton__indicator{position:relative;width:1rem;height:1rem;flex-shrink:0;border:1px solid;border-radius:50%;background-color:#fff}.RadioButton__indicator--checked{background-color:#191a1b}.RadioButton__indicator--checked:after{content:"";display:block;position:absolute;top:.25rem;right:.25rem;bottom:.25rem;left:.25rem;border-radius:50%;background-color:#fff}.RadioButton__indicator--disabled{color:#cacbcc;pointer-events:none;background-color:#fff}.RadioButton__indicator--disabled:after{background-color:#cacbcc}.RadioButton__input{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.RadioButton__label{font-size:.8125rem;line-height:1.6}.RadioButton__label,.SelectableButton{font-family:Moda Operandi Sans,Arial,sans-serif;letter-spacing:.04em;color:#191a1b}.SelectableButton{font-size:.75rem;line-height:1.4;text-transform:uppercase;display:inline-flex;align-items:center;justify-content:center;text-align:center;max-width:100%;padding:.5rem .75rem;cursor:pointer;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;border:1px solid #cacbcc;background-color:transparent;transition:background-color .2s}.SelectableButton>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}.SelectableButton--hover,.SelectableButton:hover{color:#191a1b;border-color:#cacbcc;background-color:#f2f3f5}.SelectableButton--selected,.SelectableButton--selected:hover{color:#191a1b;border-color:#191a1b;background-color:transparent}.SelectableButton--unavailable,.SelectableButton--unavailable:hover{color:#cacbcc;border-color:#cacbcc;background:linear-gradient(to bottom right,#fff calc(50% - 1px),#cacbcc,#fff calc(50% + 1px))}.SlidingPane{position:fixed;visibility:hidden;width:100%;bottom:-100vh;left:0;right:0;transition:all .5s ease-out;background-color:#fff;margin-left:0}.SlidingPane--active{visibility:visible;bottom:0}.SlidingPane__top{padding:.75rem;border-bottom:1px solid #cacbcc;box-shadow:0 -1px 2px rgba(25,26,27,.1)}.SlidingPane__close{position:absolute;top:0;right:0;padding:1.2rem;cursor:pointer}.SlidingPane__content{padding:1rem}.SlidingPane__overlay{background-color:rgba(0,0,0,.3);top:0;bottom:0;left:0;right:0;position:fixed;display:none}.SlidingPane__overlay--active{display:block}.TabList{display:flex;justify-content:flex-start;flex-direction:row;border-bottom:1px solid #cacbcc}.TabList>*{margin-left:0;margin-right:0}.TabList>*+*{margin-left:1rem}.TabList>.Overlay{margin-left:0}.Tab{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.75rem;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;padding:1rem 0;border-bottom:2px solid transparent;color:#656566;text-align:left;cursor:pointer}.Tab--active{color:#191a1b;border-bottom:2px solid #191a1b}.Tab:active,.Tab:focus{outline:none}.TabPanels{margin-top:1rem}.Tag{display:flex;justify-content:flex-start;flex-direction:row;font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;display:inline-flex;align-items:center;padding:.5rem;border:1px solid #cacbcc;white-space:nowrap}.Tag>*{margin-left:0;margin-right:0}.Tag>*+*{margin-left:.5rem}.Tag>.Overlay{margin-left:0}.Tag:focus,.Tag:hover{border-color:#191a1b}.Tag--disabled{color:#979899}.Tag--disabled:focus,.Tag--disabled:hover{border-color:#cacbcc}.Textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1;width:100%;padding:.75rem 1rem;border:1px solid #cacbcc;background-color:#fff;border-radius:0;font-family:Moda Operandi Sans,Arial,sans-serif;font-size:.8125rem;line-height:1.6;letter-spacing:.04em;resize:none}@media (max-width:48rem){.Textarea{font-family:Moda Operandi Sans,Arial,sans-serif;font-size:1rem;line-height:1.4;letter-spacing:.04em}}.Textarea::-moz-placeholder{line-height:normal}.Textarea::placeholder{line-height:normal}.Textarea--focus,.Textarea:focus{outline:none;border-color:#191a1b}.Textarea--disabled,.Textarea:disabled{color:#cacbcc;border-color:#cacbcc;background-color:#f2f3f5}.Textarea--valid{border-color:#046c00}.Textarea--error,.Textarea--error:focus{border-color:#ee0700}.Toast{color:#fff;padding:.75rem}.Toast--success{background-color:#046c00}.Toast--warning{background-color:#d56b27}.Toast--error{background-color:#ee0700}.VerticalDivider{border-left:1px solid #191a1b}.VerticalDivider--double{width:.175rem;border-right:1px solid #191a1b}
package/index.scss ADDED
@@ -0,0 +1 @@
1
+ @forward 'src';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@moda/om",
3
- "version": "19.8.2",
3
+ "version": "20.0.0",
4
4
  "description": "Moda Operandi design system",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.esm.js",
@@ -12,7 +12,8 @@
12
12
  "license": "MIT",
13
13
  "files": [
14
14
  "dist",
15
- "src"
15
+ "src",
16
+ "index.scss"
16
17
  ],
17
18
  "sideEffects": [
18
19
  "*.css",
@@ -27,7 +28,7 @@
27
28
  "commitlint": "commitlint",
28
29
  "compile": "rollup -c --bundleConfigAsCjs",
29
30
  "format": "prettier --write '**/*'",
30
- "lint": "eslint src --ext .tsx,.ts --fix",
31
+ "lint": "eslint src",
31
32
  "lint-staged": "lint-staged",
32
33
  "postpublish": "pinst --enable",
33
34
  "predeploy:documentation": "NODE_ENV=production npm run build && cd documentation && npm install && npm run build",
@@ -50,102 +51,104 @@
50
51
  "react-router-dom": "^5.1.2"
51
52
  },
52
53
  "dependencies": {
53
- "@moda/icons": "^5.24.0",
54
- "@moda/tokens": "^5.9.70",
54
+ "@moda/icons": "^5.29.9",
55
+ "@moda/tokens": "^6.0.0",
55
56
  "@storybook/addon-styling": "^1.3.7",
56
- "@types/classnames": "^2.3.0",
57
+ "@types/classnames": "^2.3.4",
57
58
  "classnames": "^2.5.1",
58
- "credit-card-type": "^10.0.0",
59
- "focus-visible": "^5.2.0",
59
+ "credit-card-type": "^10.0.1",
60
+ "focus-visible": "^5.2.1",
60
61
  "proportional-scale": "^4.0.0",
61
- "react-focus-on": "^3.9.2",
62
+ "react-focus-on": "^3.9.4",
62
63
  "react-input-mask": "^2.0.4",
63
64
  "scroll-into-view-if-needed": "^3.1.0",
64
- "storybook": "^8.0.1",
65
+ "storybook": "^8.3.6",
65
66
  "use-cursor": "^1.2.3"
66
67
  },
67
68
  "devDependencies": {
68
- "@babel/core": "^7.24.1",
69
- "@babel/preset-env": "^7.24.1",
70
- "@babel/preset-react": "^7.24.1",
71
- "@babel/preset-typescript": "^7.24.1",
72
- "@commitlint/cli": "^19.2.1",
73
- "@commitlint/config-conventional": "^19.1.0",
69
+ "@babel/core": "^7.25.9",
70
+ "@babel/preset-env": "^7.25.9",
71
+ "@babel/preset-react": "^7.25.9",
72
+ "@babel/preset-typescript": "^7.25.9",
73
+ "@commitlint/cli": "^19.5.0",
74
+ "@commitlint/config-conventional": "^19.5.0",
75
+ "@eslint/js": "^9.13.0",
74
76
  "@moda/rollup-plugin-postcss": "^4.0.1",
75
77
  "@rollup/plugin-babel": "^6.0.4",
76
- "@rollup/plugin-commonjs": "^28.0.0",
77
- "@rollup/plugin-node-resolve": "^15.2.3",
78
- "@storybook/addon-actions": "^8.0.1",
79
- "@storybook/addon-essentials": "^8.0.1",
80
- "@storybook/addon-links": "^8.0.1",
81
- "@storybook/addon-mdx-gfm": "^8.0.1",
78
+ "@rollup/plugin-commonjs": "^28.0.1",
79
+ "@rollup/plugin-node-resolve": "^15.3.0",
80
+ "@storybook/addon-actions": "^8.3.6",
81
+ "@storybook/addon-essentials": "^8.3.6",
82
+ "@storybook/addon-links": "^8.3.6",
83
+ "@storybook/addon-mdx-gfm": "^8.3.6",
82
84
  "@storybook/addon-postcss": "^2.0.0",
83
- "@storybook/addon-viewport": "^8.0.1",
85
+ "@storybook/addon-viewport": "^8.3.6",
84
86
  "@storybook/addon-webpack5-compiler-babel": "^3.0.3",
85
87
  "@storybook/addons": "^7.6.17",
86
- "@storybook/react": "^8.0.1",
87
- "@storybook/react-webpack5": "^8.0.1",
88
- "@testing-library/jest-dom": "^6.4.2",
89
- "@testing-library/react": "^16.0.0",
88
+ "@storybook/react": "^8.3.6",
89
+ "@storybook/react-webpack5": "^8.3.6",
90
+ "@testing-library/jest-dom": "^6.6.2",
91
+ "@testing-library/react": "^16.0.1",
90
92
  "@testing-library/user-event": "^14.5.2",
91
93
  "@types/cheerio": "^0.22.35",
92
- "@types/credit-card-type": "^9.0.0",
93
- "@types/jest": "^29.5.12",
94
- "@types/ramda": "^0.30.0",
95
- "@types/react": "^18.2.67",
96
- "@types/react-dom": "^18.2.22",
94
+ "@types/credit-card-type": "^9.0.3",
95
+ "@types/jest": "^29.5.14",
96
+ "@types/ramda": "^0.30.2",
97
+ "@types/react": "^18.3.12",
98
+ "@types/react-dom": "^18.3.1",
97
99
  "@types/react-input-mask": "^3.0.5",
98
100
  "@types/react-router-dom": "^5.3.3",
99
- "@typescript-eslint/eslint-plugin": "^7.3.1",
100
- "@typescript-eslint/parser": "^7.3.1",
101
- "autoprefixer": "^10.4.18",
102
- "babel-loader": "^9.1.3",
103
- "commitizen": "^4.3.0",
104
- "css-loader": "^7.0.0",
101
+ "@typescript-eslint/eslint-plugin": "^8.11.0",
102
+ "@typescript-eslint/parser": "^8.11.0",
103
+ "autoprefixer": "^10.4.20",
104
+ "babel-loader": "^9.2.1",
105
+ "commitizen": "^4.3.1",
106
+ "css-loader": "^7.1.2",
105
107
  "cz-conventional-changelog": "^3.3.0",
106
- "eslint": "^8.57.0",
108
+ "eslint": "^9.13.0",
107
109
  "eslint-config-prettier": "^9.1.0",
108
- "eslint-config-standard-jsx": "^11.0.0",
109
- "eslint-plugin-import": "^2.29.1",
110
- "eslint-plugin-jest-dom": "^5.1.0",
111
- "eslint-plugin-jsx-a11y": "^6.8.0",
112
- "eslint-plugin-no-loops": "^0.3.0",
110
+ "eslint-plugin-import": "^2.31.0",
111
+ "eslint-plugin-jest-dom": "^5.4.0",
112
+ "eslint-plugin-jsx-a11y": "^6.10.1",
113
+ "eslint-plugin-no-loops": "^0.4.0",
113
114
  "eslint-plugin-node": "^11.1.0",
114
- "eslint-plugin-prettier": "^5.1.3",
115
- "eslint-plugin-promise": "^7.0.0",
116
- "eslint-plugin-react": "^7.34.1",
115
+ "eslint-plugin-prettier": "^5.2.1",
116
+ "eslint-plugin-promise": "^7.1.0",
117
+ "eslint-plugin-react": "^7.37.2",
117
118
  "eslint-plugin-react-hooks": "^5.0.0",
118
119
  "eslint-plugin-standard": "^5.0.0",
119
- "eslint-plugin-testing-library": "^6.2.0",
120
- "husky": "^9.0.11",
120
+ "eslint-plugin-testing-library": "^6.4.0",
121
+ "globals": "^15.11.0",
122
+ "husky": "^9.1.6",
121
123
  "identity-obj-proxy": "^3.0.0",
122
124
  "ignore-not-found-export-webpack-plugin": "^1.0.2",
123
125
  "jest": "^29.7.0",
124
126
  "jest-environment-jsdom": "^29.7.0",
125
127
  "jest-matchmedia-mock": "^1.1.0",
126
- "lint-staged": "^15.2.2",
128
+ "lint-staged": "^15.2.10",
127
129
  "node-sass-package-importer": "^5.3.3",
128
130
  "pinst": "^3.0.0",
129
- "postcss": "^8.4.36",
131
+ "postcss": "^8.4.47",
130
132
  "postcss-loader": "^8.1.1",
131
- "prettier": "^3.2.5",
132
- "ramda": "^0.30.0",
133
- "react": "^18.2.0",
134
- "react-dom": "^18.2.0",
133
+ "prettier": "^3.3.3",
134
+ "ramda": "^0.30.1",
135
+ "react": "^18.3.1",
136
+ "react-dom": "^18.3.1",
135
137
  "react-router-dom": "^5.1.2",
136
- "rollup": "^4.13.0",
138
+ "rollup": "^4.24.0",
137
139
  "rollup-plugin-peer-deps-external": "^2.2.4",
138
140
  "rollup-plugin-scss": "^4.0.0",
139
- "sass": "^1.72.0",
140
- "sass-loader": "^16.0.0",
141
- "semantic-release": "^24.0.0",
141
+ "sass": "^1.80.4",
142
+ "sass-loader": "^16.0.2",
143
+ "semantic-release": "^24.1.3",
142
144
  "semantic-release-npm-github": "^5.0.0",
143
145
  "storybook-states": "^1.2.0",
144
146
  "style-loader": "^4.0.0",
145
- "ts-jest": "^29.1.2",
146
- "typescript": "^5.4.2",
147
+ "ts-jest": "^29.2.5",
148
+ "typescript": "^5.6.3",
149
+ "typescript-eslint": "^8.11.0",
147
150
  "waait": "^1.0.5",
148
- "webpack": "^5.90.3",
151
+ "webpack": "^5.95.0",
149
152
  "webpack-cli": "^5.1.4"
150
153
  },
151
154
  "config": {
@@ -1,4 +1,4 @@
1
- @import '~om';
1
+ @use '~@moda/om';
2
2
 
3
3
  .AspectRatioBox {
4
4
  position: relative;
@@ -1,51 +1,51 @@
1
- @import '~om';
1
+ @use '~@moda/om';
2
2
 
3
3
  .Badge {
4
- @include text(eyebrow);
4
+ @include om.text(eyebrow);
5
5
  display: inline-block;
6
- color: color(ink);
6
+ color: om.color(ink);
7
7
  border: 1px solid;
8
- padding: space(1);
8
+ padding: om.space(1);
9
9
  user-select: none;
10
10
 
11
11
  &,
12
12
  &--default {
13
13
  background-color: transparent;
14
- border-color: color(fog);
15
- color: color(cement);
14
+ border-color: om.color(fog);
15
+ color: om.color(cement);
16
16
  }
17
17
 
18
18
  &--forest-green {
19
- background-color: color(forest-green);
19
+ background-color: om.color(forest-green);
20
20
  border-color: transparent;
21
- color: color('snow');
21
+ color: om.color('snow');
22
22
  }
23
23
 
24
24
  &--klein-blue {
25
- background-color: color(klein-blue);
25
+ background-color: om.color(klein-blue);
26
26
  border-color: transparent;
27
- color: color('snow');
27
+ color: om.color('snow');
28
28
  }
29
29
 
30
30
  &--brick {
31
- background-color: color(brick);
31
+ background-color: om.color(brick);
32
32
  border-color: transparent;
33
- color: color('snow');
33
+ color: om.color('snow');
34
34
  }
35
35
 
36
36
  &--dark-fuchsia {
37
- border-color: color(dark-fuchsia);
38
- color: color(dark-fuchsia);
37
+ border-color: om.color(dark-fuchsia);
38
+ color: om.color(dark-fuchsia);
39
39
  font-weight: 700;
40
40
  text-transform: none;
41
41
  }
42
42
 
43
43
  &--noise {
44
- @include text(body1);
44
+ @include om.text(body1);
45
45
 
46
- background-color: color(noise);
46
+ background-color: om.color(noise);
47
47
  border-color: transparent;
48
- color: color(ink);
48
+ color: om.color(ink);
49
49
  text-transform: none;
50
50
  line-height: 1.4;
51
51
  }
@@ -1,9 +1,9 @@
1
- @import '~om';
1
+ @use '~@moda/om';
2
2
 
3
3
  .Breadcrumb {
4
4
  position: relative;
5
- padding-right: space(4);
6
- margin-right: space(2);
5
+ padding-right: om.space(4);
6
+ margin-right: om.space(2);
7
7
  white-space: nowrap;
8
8
  overflow: hidden;
9
9
 
@@ -13,9 +13,9 @@
13
13
  content: ' ';
14
14
  position: absolute;
15
15
  top: 50%;
16
- right: space(1);
16
+ right: om.space(1);
17
17
  transform: translateY(-50%) rotate(25deg);
18
- border-right: 1px solid color(fog);
18
+ border-right: 1px solid om.color(fog);
19
19
  height: 75%;
20
20
  }
21
21
 
@@ -1,7 +1,7 @@
1
- @import '~om';
1
+ @use '~@moda/om';
2
2
 
3
3
  .Breadcrumbs {
4
- @include text(body1);
4
+ @include om.text(body1);
5
5
 
6
6
  display: flex;
7
7
  flex-flow: wrap;
@@ -1,20 +1,22 @@
1
+ @use 'sass:list';
2
+ @use 'sass:map';
1
3
  @use 'sass:math';
2
- @import '~om';
4
+ @use '~@moda/om';
3
5
 
4
6
  .Breakpoint {
5
7
  $onePixel: math.div(1, 16);
6
- $keys: map-keys($breakpoints);
8
+ $keys: map.keys(om.$breakpoints);
7
9
 
8
10
  display: none;
9
11
 
10
- @for $i from 1 through length($keys) {
11
- $key: nth($keys, $i);
12
- $width: map-get($breakpoints, $key);
12
+ @for $i from 1 through list.length($keys) {
13
+ $key: list.nth($keys, $i);
14
+ $width: map.get(om.$breakpoints, $key);
13
15
 
14
16
  $prevWidth: null;
15
17
  @if $i - 1 > 1 {
16
- $prevKey: nth($keys, $i - 1);
17
- $prevWidth: map-get($breakpoints, $prevKey) + $onePixel;
18
+ $prevKey: list.nth($keys, $i - 1);
19
+ $prevWidth: map.get(om.$breakpoints, $prevKey) + $onePixel;
18
20
  } @else {
19
21
  $prevWidth: 0;
20
22
  }