@ebay/skin 19.6.0 → 19.8.0

package/dist/bundles/skin-headless.css

@@ -24,6 +24,10 @@ body{
   -webkit-text-size-adjust:100%;
 }
 
+button{
+  font-family:inherit;
+}
+
 fieldset{
   border:0;
   padding:0;
@@ -175,6 +179,28 @@ a:not([href]),a[aria-disabled=true]{
   border-right-style:inset;
   box-shadow:none;
 }
+@keyframes chevron-bounce-open{
+  0%{
+    transform:translateY(0);
+  }
+  50%{
+    transform:translateY(-7px);
+  }
+  to{
+    transform:translateY(0);
+  }
+}
+@keyframes chevron-bounce-close{
+  0%{
+    transform:translateY(0);
+  }
+  50%{
+    transform:translateY(7px);
+  }
+  to{
+    transform:translateY(0);
+  }
+}
 ul.accordion{
   margin:0;
   padding:0;
@@ -197,21 +223,22 @@ ul.accordion summary.details__summary{
   padding:12px 16px;
 }
 
-ul.accordion summary.details__summary span.details__icon svg{
-  fill:var(--details-secondary-foreground-color, var(--color-foreground-secondary));
+ul.accordion details{
+  overflow:hidden;
 }
 
 ul.accordion details .details__content{
   margin:0 16px 6px;
-  opacity:0;
-  transform:scaleY(0);
-  transform-origin:top;
-  transition:opacity var(--motion-duration-medium-3) var(--motion-easing-standard), transform var(--motion-duration-medium-3) var(--motion-easing-standard);
+  overflow:hidden;
 }
 
-ul.accordion details[open] .details__content{
-  opacity:1;
-  transform:scaleY(1);
+ul.accordion summary.details__summary span.details__icon svg{
+  fill:var(--details-secondary-foreground-color, var(--color-foreground-secondary));
+  animation:chevron-bounce-close var(--motion-duration-medium-1) var(--motion-easing-standard);
+}
+
+ul.accordion details[open] summary.details__summary span.details__icon svg{
+  animation:chevron-bounce-open var(--motion-duration-medium-1) var(--motion-easing-standard) var(--motion-duration-short-1);
 }
 ul.accordion details svg.details__expand,ul.accordion details[open] svg.details__collapse{
   display:inline-block;
@@ -226,9 +253,19 @@ ul.accordion--large summary.details__summary{
   min-height:52px;
 }
 
-@media (prefers-reduced-motion){
-  ul.accordion details .details__content,ul.accordion details[open] .details__content{
-    transition:none;
+@supports selector(::details-content) and (interpolate-size:allow-keywords) and (transition:allow-discrete){
+  :root{
+    interpolate-size:allow-keywords;
+  }
+  ul.accordion details::details-content{
+    height:0;
+    opacity:0;
+    overflow:clip;
+    transition:height var(--motion-duration-medium-3) var(--motion-easing-standard), content-visibility var(--motion-duration-medium-2) var(--motion-easing-continuous) allow-discrete, opacity var(--motion-duration-medium-2) var(--motion-easing-continuous);
+  }
+  ul.accordion details[open]::details-content{
+    height:auto;
+    opacity:1;
   }
 }
 .alert-dialog[role=alertdialog]{
@@ -1481,7 +1518,7 @@ span.carousel,span.carousel__container{
   box-sizing:border-box;
   color:inherit;
   display:inline-flex;
-  font:inherit;
+  font-family:inherit;
   height:var(--spacing-400);
   justify-content:center;
   width:var(--spacing-400);
@@ -5722,7 +5759,7 @@ span.inline-notice{
   display:grid;
   grid-area:body;
   grid-template-areas:"section-primary" "section-secondary" "section-tertiary";
-  grid-template-rows:25px .75fr 1fr;
+  grid-template-rows:25px 90px 1fr;
 }
 
 .item-tile--list-view .item-tile__header{
@@ -5778,9 +5815,18 @@ span.inline-notice{
 }
 
 .item-tile__subtitle{
+  -webkit-box-orient:vertical;
   color:var(--color-foreground-secondary);
+  display:-webkit-box;
+  -webkit-line-clamp:1;
+  overflow:hidden;
 }
 
+@media (min-width:768px){
+  .item-tile__body{
+    grid-template-rows:25px 70px 1fr;
+  }
+}
 .layout-grid.item-tile-group{
   --layout-grid-columns-min:2;
   --layout-grid-columns-xs:2;
@@ -7435,10 +7481,102 @@ span.listbox-button__value{
   margin-left:3px;
   margin-right:0;
 }
+@keyframes number-input-decrement-before{
+  0%{
+    transform:translateY(0);
+  }
+  to{
+    transform:translateY(5px);
+  }
+}
+@keyframes number-input-decrement-after{
+  0%{
+    transform:translateY(-10px);
+  }
+  to{
+    transform:translateY(0);
+  }
+}
+@keyframes number-input-increment-before{
+  0%{
+    transform:translateY(0);
+  }
+  to{
+    transform:translateY(-5px);
+  }
+}
+@keyframes number-input-increment-after{
+  0%{
+    transform:translateY(10px);
+  }
+  to{
+    transform:translateY(0);
+  }
+}
+@keyframes number-input-increment-after-disabled{
+  0%{
+    transform:translateY(10px);
+  }
+  33%{
+    transform:translateY(-5px);
+  }
+  to{
+    transform:translateY(0);
+  }
+}
+@keyframes number-input-decrement-after-disabled{
+  0%{
+    transform:translateY(-10px);
+  }
+  33%{
+    transform:translateY(5px);
+  }
+  to{
+    transform:translateY(0);
+  }
+}
+@keyframes number-increment-disabled{
+  0%{
+    transform:translateX(0);
+  }
+  33%{
+    transform:translateX(10px);
+  }
+  to{
+    transform:translateX(0);
+  }
+}
+@keyframes number-decrement-disabled{
+  0%{
+    transform:translateX(0);
+  }
+  50%{
+    transform:translateX(-10px);
+  }
+  to{
+    transform:translateX(0);
+  }
+}
 .number-input .textbox{
   background:transparent;
 }
 
+.number-input--increment .textbox__control{
+  animation:number-input-increment-before var(--motion-duration-short-2) var(--motion-easing-soft-exit), number-input-increment-after var(--motion-duration-medium-1) var(--motion-easing-quick-enter) var(--motion-duration-short-2);
+}
+
+.number-input--decrement .textbox__control{
+  animation:number-input-decrement-before var(--motion-duration-short-2) var(--motion-easing-soft-exit), number-input-decrement-after var(--motion-duration-medium-1) var(--motion-easing-quick-enter) var(--motion-duration-short-2);
+}
+
+.number-input--decrement-disabled .textbox__control{
+  animation:number-input-decrement-before var(--motion-duration-short-2) var(--motion-easing-soft-exit), number-input-decrement-after-disabled var(--motion-duration-medium-2) var(--motion-easing-standard) var(--motion-duration-short-2);
+}
+
+.number-input--increment-disabled .textbox__control{
+  animation:number-input-increment-before var(--motion-duration-short-2) var(--motion-easing-soft-exit), number-input-increment-after-disabled var(--motion-duration-medium-2) var(--motion-easing-standard) var(--motion-duration-short-2);
+}
+
 .number-input label:first-child{
   flex-grow:1;
   padding-left:var(--spacing-200);
@@ -7478,10 +7616,31 @@ span.listbox-button__value{
           appearance:textfield;
 }
 
+.number-input .icon-btn{
+  transform:scale(1);
+  transition:transform var(--motion-duration-short-3) var(--motion-easing-standard);
+}
+
+.number-input .icon-btn:hover:not(:disabled){
+  background-color:var(--state-layer-hover);
+}
+
+.number-input .icon-btn:active{
+  transform:scale(.97);
+}
+
 .number-input .textbox .icon-btn:not(:disabled) svg{
   color:var(--color-foreground-primary);
   fill:currentColor;
 }
+
+.number-input__decrement:disabled{
+  animation:number-decrement-disabled var(--motion-duration-short-2) var(--motion-easing-standard);
+}
+
+.number-input__increment:disabled{
+  animation:number-increment-disabled var(--motion-duration-short-2) var(--motion-easing-standard);
+}
 .fake-menu__items,.menu__items{
   background-color:var(--menu-background-color, var(--color-background-primary));
   cursor:default;
@@ -8261,7 +8420,7 @@ nav.pagination--fluid ol.pagination__items li{
 .panel-dialog__footer>:not(:first-child){
   margin-top:var(--spacing-200);
 }
-button.icon-btn.panel-dialog__close{
+button.icon-btn.panel-dialog__close,button.icon-btn.panel-dialog__prev{
   align-self:flex-start;
   border:0;
   height:32px;
@@ -8272,6 +8431,10 @@ button.icon-btn.panel-dialog__close{
   z-index:1;
 }
 
+button.icon-btn.panel-dialog__prev{
+  margin-inline-end:var(--spacing-200);
+}
+
 .panel-dialog__title:not(:first-child){
   margin-left:var(--spacing-200);
 }
@@ -8316,6 +8479,10 @@ button.icon-btn.panel-dialog__close{
 .panel-dialog--hide-init .panel-dialog__window--slide,.panel-dialog--show .panel-dialog__window--slide{
   transform:translateX(0);
 }
+
+[dir=rtl] button.icon-btn.panel-dialog__prev .icon{
+  transform:rotate(180deg);
+}
 @media (min-width:512px){
   .panel-dialog__window{
     width:384px;
@@ -9304,6 +9471,7 @@ p.section-notice__cta{
   border:none;
   border-radius:var(--btn-border-radius, 20px);
   color:var(--color-foreground-on-primary);
+  font-family:inherit;
   font-size:var(--font-size-default);
   min-height:calc(40px - var(--spacing-50)*2);
   padding:var(--spacing-100) var(--spacing-200);
@@ -10583,6 +10751,7 @@ button.toast-dialog__close>svg{
   box-shadow:0 0 0 1px transparent;
   color:var(--color-foreground-primary);
   display:inline-flex;
+  font-family:inherit;
   font-size:var(--font-size-default);
   justify-content:center;
   margin-right:var(--spacing-100);

package/dist/calendar/calendar.css

@@ -79,7 +79,7 @@
     box-sizing: border-box;
     color: inherit;
     display: inline-flex;
-    font: inherit;
+    font-family: inherit;
     height: var(--spacing-400);
     justify-content: center;
     width: var(--spacing-400);

package/dist/global/global.css

@@ -10,6 +10,10 @@ body {
     -webkit-text-size-adjust: 100%;
 }
 
+button {
+    font-family: inherit;
+}
+
 fieldset {
     border: 0;
     padding: 0;

package/dist/item-tile/item-tile.css

@@ -33,7 +33,7 @@
     display: grid;
     grid-area: body;
     grid-template-areas: "section-primary" "section-secondary" "section-tertiary";
-    grid-template-rows: 25px 0.75fr 1fr;
+    grid-template-rows: 25px 90px 1fr;
 }
 
 .item-tile--list-view .item-tile__header {
@@ -90,5 +90,15 @@
 }
 
 .item-tile__subtitle {
+    -webkit-box-orient: vertical;
     color: var(--color-foreground-secondary);
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    overflow: hidden;
+}
+
+@media (min-width: 768px) {
+    .item-tile__body {
+        grid-template-rows: 25px 70px 1fr;
+    }
 }

package/dist/number-input/number-input.css

@@ -1,7 +1,115 @@
+@keyframes number-input-decrement-before {
+    0% {
+        transform: translateY(0);
+    }
+    to {
+        transform: translateY(5px);
+    }
+}
+@keyframes number-input-decrement-after {
+    0% {
+        transform: translateY(-10px);
+    }
+    to {
+        transform: translateY(0);
+    }
+}
+@keyframes number-input-increment-before {
+    0% {
+        transform: translateY(0);
+    }
+    to {
+        transform: translateY(-5px);
+    }
+}
+@keyframes number-input-increment-after {
+    0% {
+        transform: translateY(10px);
+    }
+    to {
+        transform: translateY(0);
+    }
+}
+@keyframes number-input-increment-after-disabled {
+    0% {
+        transform: translateY(10px);
+    }
+    33% {
+        transform: translateY(-5px);
+    }
+    to {
+        transform: translateY(0);
+    }
+}
+@keyframes number-input-decrement-after-disabled {
+    0% {
+        transform: translateY(-10px);
+    }
+    33% {
+        transform: translateY(5px);
+    }
+    to {
+        transform: translateY(0);
+    }
+}
+@keyframes number-increment-disabled {
+    0% {
+        transform: translateX(0);
+    }
+    33% {
+        transform: translateX(10px);
+    }
+    to {
+        transform: translateX(0);
+    }
+}
+@keyframes number-decrement-disabled {
+    0% {
+        transform: translateX(0);
+    }
+    50% {
+        transform: translateX(-10px);
+    }
+    to {
+        transform: translateX(0);
+    }
+}
 .number-input .textbox {
     background: transparent;
 }
 
+.number-input--increment .textbox__control {
+    animation:
+        number-input-increment-before var(--motion-duration-short-2)
+            var(--motion-easing-soft-exit),
+        number-input-increment-after var(--motion-duration-medium-1)
+            var(--motion-easing-quick-enter) var(--motion-duration-short-2);
+}
+
+.number-input--decrement .textbox__control {
+    animation:
+        number-input-decrement-before var(--motion-duration-short-2)
+            var(--motion-easing-soft-exit),
+        number-input-decrement-after var(--motion-duration-medium-1)
+            var(--motion-easing-quick-enter) var(--motion-duration-short-2);
+}
+
+.number-input--decrement-disabled .textbox__control {
+    animation:
+        number-input-decrement-before var(--motion-duration-short-2)
+            var(--motion-easing-soft-exit),
+        number-input-decrement-after-disabled var(--motion-duration-medium-2)
+            var(--motion-easing-standard) var(--motion-duration-short-2);
+}
+
+.number-input--increment-disabled .textbox__control {
+    animation:
+        number-input-increment-before var(--motion-duration-short-2)
+            var(--motion-easing-soft-exit),
+        number-input-increment-after-disabled var(--motion-duration-medium-2)
+            var(--motion-easing-standard) var(--motion-duration-short-2);
+}
+
 .number-input label:first-child {
     flex-grow: 1;
     padding-left: var(--spacing-200);
@@ -42,7 +150,31 @@
     appearance: textfield;
 }
 
+.number-input .icon-btn {
+    transform: scale(1);
+    transition: transform var(--motion-duration-short-3)
+        var(--motion-easing-standard);
+}
+
+.number-input .icon-btn:hover:not(:disabled) {
+    background-color: var(--state-layer-hover);
+}
+
+.number-input .icon-btn:active {
+    transform: scale(0.97);
+}
+
 .number-input .textbox .icon-btn:not(:disabled) svg {
     color: var(--color-foreground-primary);
     fill: currentColor;
 }
+
+.number-input__decrement:disabled {
+    animation: number-decrement-disabled var(--motion-duration-short-2)
+        var(--motion-easing-standard);
+}
+
+.number-input__increment:disabled {
+    animation: number-increment-disabled var(--motion-duration-short-2)
+        var(--motion-easing-standard);
+}

package/dist/panel-dialog/panel-dialog.css

@@ -94,7 +94,8 @@
 .panel-dialog__footer > :not(:first-child) {
     margin-top: var(--spacing-200);
 }
-button.icon-btn.panel-dialog__close {
+button.icon-btn.panel-dialog__close,
+button.icon-btn.panel-dialog__prev {
     align-self: flex-start;
     border: 0;
     height: 32px;
@@ -105,6 +106,10 @@ button.icon-btn.panel-dialog__close {
     z-index: 1;
 }
 
+button.icon-btn.panel-dialog__prev {
+    margin-inline-end: var(--spacing-200);
+}
+
 .panel-dialog__title:not(:first-child) {
     margin-left: var(--spacing-200);
 }
@@ -170,6 +175,10 @@ button.icon-btn.panel-dialog__close {
 .panel-dialog--show .panel-dialog__window--slide {
     transform: translateX(0);
 }
+
+[dir="rtl"] button.icon-btn.panel-dialog__prev .icon {
+    transform: rotate(180deg);
+}
 @media (min-width: 512px) {
     .panel-dialog__window {
         width: 384px;

package/dist/segmented-buttons/segmented-buttons.css

@@ -27,6 +27,7 @@
     border: none;
     border-radius: var(--btn-border-radius, 20px);
     color: var(--color-foreground-on-primary);
+    font-family: inherit;
     font-size: var(--font-size-default);
     min-height: calc(40px - var(--spacing-50) * 2);
     padding: var(--spacing-100) var(--spacing-200);

package/dist/svg/icon/icon-apple-music-24-colored.svg

@@ -0,0 +1,27 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M24 5.867c0-1.057-.157-2.114-.633-3.067a5.06 5.06 0 0 0-2.2-2.2C20.206.152 19.154 0 18.1 0H5.9C4.864 0 3.803.132 2.867.6A5.283 5.283 0 0 0 .633 2.833C.036 4.027 0 5.324 0 6.633V18.1c0 1.057.157 2.113.633 3.067.724 1.446 2.132 2.406 3.7 2.7.534.1 1.067.133 1.567.133h12.167a8.06 8.06 0 0 0 1.566-.133c1.568-.294 2.977-1.254 3.7-2.7.476-.952.634-2.012.634-3.067 0-4.078.033-8.156.033-12.233Z"
+    fill="url(#ref-apple-music-24-colored)"
+  />
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M16.967 3.634c-.067 0-.567.1-.634.1L9.2 5.167c-.2.033-.333.1-.433.2-.134.1-.2.267-.234.467V15c0 .2 0 .4-.166.6-.167.2-.334.234-.534.267-.166.033-.3.067-.466.1-.6.133-.967.2-1.334.333-.333.134-.566.3-.766.5-.4.4-.567.967-.5 1.5.033.434.233.867.6 1.2.233.2.533.367.866.434.367.066.734.033 1.3-.067.3-.067.567-.167.834-.3.266-.167.5-.367.666-.6.167-.267.3-.533.334-.833.066-.3.066-.567.066-.9V9.5c0-.4.134-.533.467-.6 0 0 5.933-1.2 6.2-1.266.4-.067.567.033.567.433v5.3c0 .2 0 .433-.134.6-.133.167-.333.233-.533.267-.167.033-.3.066-.467.1-.6.133-.966.2-1.333.333-.333.133-.567.3-.767.5-.4.4-.566.967-.5 1.5.034.433.267.867.6 1.2.234.2.534.367.867.433.367.067.733.034 1.3-.066.3-.067.567-.134.833-.3.267-.167.5-.367.667-.6.167-.234.3-.534.333-.834.067-.3.067-.566.067-.9V4.267c-.033-.4-.233-.667-.633-.633Z"
+    fill="#fff"
+  />
+  <defs>
+    <linearGradient
+      id="ref-apple-music-24-colored"
+      x1="12"
+      y1="23.874"
+      x2="12"
+      y2=".484"
+      gradientUnits="userSpaceOnUse"
+    >
+      <stop stop-color="#FA233B" />
+      <stop offset="1" stop-color="#FB5C74" />
+    </linearGradient>
+  </defs>
+</svg>

package/dist/svg/icon/icon-cart-add-16.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M5.5 13a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm6 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM3.023 1.001l.039.002a.998.998 0 0 1 .518.184.997.997 0 0 1 .242.245l.019.028a.99.99 0 0 1 .03.05l.017.032a.994.994 0 0 1 .045.1l.007.017.004.014a.826.826 0 0 1 .02.071l.006.014L5.687 8.62A.5.5 0 0 0 6.17 9h4.6a.5.5 0 0 0 .49-.402l.558-2.794a1 1 0 0 1 1.961.392l-.558 2.794A2.5 2.5 0 0 1 10.77 11h-4.6a2.5 2.5 0 0 1-2.425-1.894L2.22 3H1a1 1 0 0 1 0-2h2l.023.001Zm5.482.249a1 1 0 0 1 1 1V3h.745a1 1 0 0 1 .102 1.995L10.25 5h-.745v.75a1 1 0 1 1-2 0V5H6.75a1 1 0 0 1 0-2h.755v-.75a1 1 0 0 1 1-1Z"
+  />
+</svg>

package/dist/svg/icon/icon-cart-add-20.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M6.5 17a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm8 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM3.068 2.003a.998.998 0 0 1 .371.1l.024.011.038.022.043.025.04.028.04.03.023.02a.999.999 0 0 1 .118.117l.01.014a.987.987 0 0 1 .04.052c.009.011.016.023.024.035l.024.041.025.043.011.025a.99.99 0 0 1 .062.16l.004.011 2.598 9.526a1 1 0 0 0 .964.737h5.964a1 1 0 0 0 .962-.726l1.3-4.548a1 1 0 0 1 1.923.548l-1.3 4.55A3 3 0 0 1 13.491 15H7.527a3 3 0 0 1-2.894-2.21L2.236 4H1a1 1 0 0 1 0-2h2.018c.017 0 .033.002.05.003Zm7.437.502a1 1 0 0 1 1 1V5H13a1 1 0 0 1 .102 1.995L13 7h-1.495v1.505a1 1 0 0 1-1.995.102l-.005-.102V7H8a1 1 0 0 1 0-2h1.505V3.505a1 1 0 0 1 1-1Z"
+  />
+</svg>

package/dist/svg/icon/icon-cart-add-24.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M8 19a2 2 0 1 1 0 4 2 2 0 0 1 0-4Zm10 0a2 2 0 1 1 0 4 2 2 0 0 1 0-4ZM4 2a1 1 0 0 1 .975.775l2.641 11.45.054.164a1 1 0 0 0 .92.611h8.805a1 1 0 0 0 .977-.783l1.207-5.434a1 1 0 0 1 1.953.434l-1.208 5.433A3 3 0 0 1 17.395 17H8.591a3 3 0 0 1-2.854-2.075l-.069-.25L3.204 4H1a1 1 0 0 1 0-2h3Zm9.005 1.005a1 1 0 0 1 1 1V6H16a1 1 0 1 1 0 2h-1.995v2.005a1 1 0 1 1-2 0V8H10a1 1 0 0 1 0-2h2.005V4.005a1 1 0 0 1 1-1Z"
+  />
+</svg>

package/dist/svg/icon/icon-customize-16.svg

@@ -1,7 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
   <path
-    fill-rule="evenodd"
-    d="M14 3h-2.17a3.001 3.001 0 0 0-5.66 0H2a1 1 0 0 0 0 2h4.17a3.001 3.001 0 0 0 5.66 0H14a1 1 0 1 0 0-2ZM9 5a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm-7 6h1.17a3.001 3.001 0 0 1 5.66 0H14a1 1 0 1 1 0 2H8.83a3.001 3.001 0 0 1-5.66 0H2a1 1 0 1 1 0-2Zm4 2a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"
-    clip-rule="evenodd"
+    d="M12 9a3 3 0 1 1-2.826 4H2a1 1 0 1 1 0-2h7.174c.412-1.165 1.52-2 2.826-2Zm0 2a1 1 0 1 0 0 2 1 1 0 0 0 0-2ZM4 1c1.306 0 2.414.835 2.826 2H14a1 1 0 1 1 0 2H6.826A2.999 2.999 0 0 1 1 4a3 3 0 0 1 3-3Zm0 2a1 1 0 1 0 0 2 1 1 0 0 0 0-2Z"
   />
 </svg>

package/dist/svg/icon/icon-customize-24.svg

@@ -1,7 +1,5 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
   <path
-    fill-rule="evenodd"
-    d="M22 4h-7.17a3.001 3.001 0 0 0-5.66 0H2a1 1 0 0 0 0 2h7.17a3.001 3.001 0 0 0 5.66 0H22a1 1 0 1 0 0-2ZM12 6a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm10 5h-1.17a3.001 3.001 0 0 0-5.66 0H2a1 1 0 1 0 0 2h13.17a3.001 3.001 0 0 0 5.66 0H22a1 1 0 1 0 0-2Zm-4 2a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm4 5H8.83a3.001 3.001 0 0 0-5.66 0H2a1 1 0 1 0 0 2h1.17a3.001 3.001 0 0 0 5.66 0H22a1 1 0 1 0 0-2ZM6 20a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
-    clip-rule="evenodd"
+    d="M18 13a4 4 0 1 1-3.876 4.991c-.04.005-.082.009-.124.009H3a1 1 0 1 1 0-2h11c.042 0 .083.003.124.008A4.002 4.002 0 0 1 18 13Zm0 2a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM6 3a4 4 0 0 1 3.875 3.008C9.916 6.003 9.958 6 10 6h11a1 1 0 1 1 0 2H10c-.042 0-.084-.004-.125-.009A4 4 0 1 1 6 3Zm0 2a2 2 0 1 0 0 4 2 2 0 0 0 0-4Z"
   />
 </svg>

package/dist/svg/icon/icon-eye-16.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M8 7.75a2.25 2.25 0 1 1 0 4.5 2.25 2.25 0 0 1 0-4.5ZM8 3c2.443 0 4.304 1.169 5.583 2.406a12.13 12.13 0 0 1 2.312 3.147 1 1 0 0 1-1.79.894 10.131 10.131 0 0 0-1.912-2.603C11.147 5.83 9.757 5 8 5c-1.757 0-3.145.832-4.191 1.844a10.14 10.14 0 0 0-1.914 2.603 1 1 0 0 1-1.79-.894 12.13 12.13 0 0 1 2.312-3.147C3.697 4.17 5.557 3 8 3Z"
+  />
+</svg>

package/dist/svg/icon/icon-eye-24.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M12 11a3 3 0 1 1 0 6 3 3 0 0 1 0-6Zm.272-5.996c2.792.078 5.128 1.352 6.891 2.861 1.816 1.554 3.095 3.414 3.732 4.688a1 1 0 0 1-1.79.894c-.53-1.06-1.65-2.7-3.242-4.062-1.49-1.274-3.328-2.256-5.437-2.373L12 7l-.425.012c-2.109.117-3.948 1.098-5.437 2.373-1.593 1.363-2.713 3.002-3.243 4.062a1 1 0 0 1-1.79-.894c.637-1.274 1.917-3.134 3.732-4.688C6.657 6.308 9.088 5 12 5l.272.004Z"
+  />
+</svg>

package/dist/svg/icon/icon-feedback-negative-16.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM5 7a1 1 0 0 0 0 2h6a1 1 0 1 0 0-2H5Z"
+  />
+</svg>

package/dist/svg/icon/icon-feedback-neutral-16.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM6.125 5.125a1 1 0 0 0-1 1v3.75a1 1 0 0 0 1 1h3.75a1 1 0 0 0 1-1v-3.75a1 1 0 0 0-1-1h-3.75Z"
+  />
+</svg>

package/dist/svg/icon/icon-feedback-positive-16.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0Zm0 4a1 1 0 0 0-1 1v2H5a1 1 0 0 0 0 2h2v2a1 1 0 1 0 2 0V9h2a1 1 0 0 0 0-2H9V5a1 1 0 0 0-1-1Z"
+  />
+</svg>

package/dist/svg/icon/icon-live-bag-16.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M8 0c1.243 0 2.326.849 2.623 2.056L11.103 4h2.83C14.524 4 15 4.478 15 5.066v5.601A4.333 4.333 0 0 1 10.667 15H5.333A4.333 4.333 0 0 1 1 10.667v-5.6C1 4.476 1.478 4 2.066 4h2.831l.479-1.944.065-.222A2.702 2.702 0 0 1 8 0ZM3 10.667A2.333 2.333 0 0 0 5.333 13h5.334A2.333 2.333 0 0 0 13 10.667V6h-1.405l.126.51.02.101a1 1 0 0 1-1.932.476l-.03-.098L9.535 6h-3.07l-.244.99a1 1 0 1 1-1.942-.48L4.405 6H3v4.667ZM6.7 8.11c0-.413.423-.679.787-.522l.072.037 2.303 1.39.065.045c.28.224.28.656 0 .88l-.065.045-2.303 1.39a.567.567 0 0 1-.86-.485V8.11ZM8 2a.702.702 0 0 0-.644.42l-.038.114L6.957 4h2.085l-.361-1.466A.702.702 0 0 0 8 2Z"
+  />
+</svg>

package/dist/svg/icon/icon-live-bag-20.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M10 0a3.11 3.11 0 0 1 3.025 2.39L13.648 5h3.769c.598 0 1.083.485 1.083 1.083v7.25a5.167 5.167 0 0 1-5.167 5.167H6.667A5.167 5.167 0 0 1 1.5 13.333v-7.25C1.5 5.485 1.985 5 2.583 5h3.77l.622-2.61A3.11 3.11 0 0 1 10 0ZM3.5 13.333A3.167 3.167 0 0 0 6.667 16.5h6.666a3.167 3.167 0 0 0 3.167-3.167V7h-2.376l.183.769.018.1a1 1 0 0 1-1.935.461l-.029-.099L12.068 7H7.933L7.64 8.231a1 1 0 1 1-1.946-.462L5.877 7H3.5v6.333Zm4.715-3.447a.76.76 0 0 1 1.056-.7l.096.05 3.09 1.864.085.06a.76.76 0 0 1 0 1.18l-.086.06-3.089 1.865a.76.76 0 0 1-1.152-.652V9.886ZM10 2c-.514 0-.96.353-1.08.853L8.41 5h3.182l-.512-2.147A1.11 1.11 0 0 0 10 2Z"
+  />
+</svg>

package/dist/svg/icon/icon-live-bag-24.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M12 0a3.517 3.517 0 0 1 3.426 2.723L16.186 6H20.9A1.1 1.1 0 0 1 22 7.1V16a6 6 0 0 1-6 6H8a6 6 0 0 1-6-6V7.1A1.1 1.1 0 0 1 3.1 6h4.713l.761-3.277.081-.294A3.517 3.517 0 0 1 12 0ZM4 16a4 4 0 0 0 4 4h8a4 4 0 0 0 4-4V8h-3.35l.325 1.4.017.1a1 1 0 0 1-1.938.45l-.029-.1L14.597 8H9.403l-.428 1.85a1.001 1.001 0 0 1-1.95-.45L7.35 8H4v8Zm5.858-4.237a.912.912 0 0 1 1.267-.84l.116.06 3.706 2.236.104.072a.913.913 0 0 1 0 1.417l-.104.072-3.706 2.238a.912.912 0 0 1-1.383-.782v-4.473ZM12 2c-.706 0-1.318.487-1.477 1.174L9.867 6h4.266l-.655-2.826A1.517 1.517 0 0 0 12 2Z"
+  />
+</svg>

package/dist/svg/icon/icon-live-bag-thin-16.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M8.001 0a2.46 2.46 0 0 1 2.385 1.861L10.922 4h3.262c.45 0 .816.366.816.816v6.101A4.083 4.083 0 0 1 10.917 15H5.083A4.083 4.083 0 0 1 1 10.917v-6.1C1 4.365 1.366 4 1.816 4H5.08l.536-2.14A2.46 2.46 0 0 1 8.001 0ZM2.5 10.917A2.583 2.583 0 0 0 5.083 13.5h5.834a2.583 2.583 0 0 0 2.583-2.583V5.5h-2.202l.18.718.014.075a.75.75 0 0 1-1.447.363l-.022-.074L9.75 5.5H6.249l-.271 1.082-.023.074a.75.75 0 0 1-1.433-.438l.18-.718H2.5v5.417Zm4.072-2.908c0-.444.454-.728.845-.56l.077.04 2.47 1.49.07.048c.3.241.3.705 0 .946l-.07.047-2.47 1.492a.608.608 0 0 1-.922-.52V8.008ZM8.001 1.5a.96.96 0 0 0-.93.726L6.624 4h2.75L8.93 2.226A.96.96 0 0 0 8 1.5Z"
+  />
+</svg>