@ultraviolet/plus 0.13.1 → 0.14.0

package/dist/@ultraviolet/icons/dist/components/Icon/Icons.js

@@ -55,49 +55,50 @@ import { ReactComponent as Memo$R } from './assets/default/upload.svg.js';
 import { ReactComponent as Memo$S } from './assets/default/view.svg.js';
 import { ReactComponent as Memo$T } from './assets/default/west.svg.js';
 import { ReactComponent as Memo$U } from './assets/default/youtube.svg.js';
-import { ReactComponent as Memo$1A } from './assets/default-outline/address.svg.js';
-import { ReactComponent as Memo$1B } from './assets/default-outline/alert-circle.svg.js';
-import { ReactComponent as Memo$1C } from './assets/default-outline/auto-fix.svg.js';
-import { ReactComponent as Memo$1D } from './assets/default-outline/book-open-outline.svg.js';
-import { ReactComponent as Memo$1E } from './assets/default-outline/bullhorn.svg.js';
-import { ReactComponent as Memo$1F } from './assets/default-outline/calculator.svg.js';
-import { ReactComponent as Memo$1G } from './assets/default-outline/calendar-range.svg.js';
-import { ReactComponent as Memo$1H } from './assets/default-outline/chat.svg.js';
-import { ReactComponent as Memo$1I } from './assets/default-outline/check-circle.svg.js';
-import { ReactComponent as Memo$1J } from './assets/default-outline/clock-outline.svg.js';
-import { ReactComponent as Memo$1K } from './assets/default-outline/console.svg.js';
-import { ReactComponent as Memo$1L } from './assets/default-outline/credential.svg.js';
-import { ReactComponent as Memo$1M } from './assets/default-outline/credit-card.svg.js';
-import { ReactComponent as Memo$1N } from './assets/default-outline/database.svg.js';
-import { ReactComponent as Memo$1O } from './assets/default-outline/delete.svg.js';
-import { ReactComponent as Memo$1P } from './assets/default-outline/doc.svg.js';
-import { ReactComponent as Memo$1Q } from './assets/default-outline/earth.svg.js';
-import { ReactComponent as Memo$1R } from './assets/default-outline/email-remove.svg.js';
-import { ReactComponent as Memo$1S } from './assets/default-outline/email.svg.js';
-import { ReactComponent as Memo$1T } from './assets/default-outline/eye-off.svg.js';
-import { ReactComponent as Memo$1U } from './assets/default-outline/eye.svg.js';
-import { ReactComponent as Memo$1V } from './assets/default-outline/filter.svg.js';
-import { ReactComponent as Memo$1W } from './assets/default-outline/folder.svg.js';
-import { ReactComponent as Memo$1X } from './assets/default-outline/help-circle.svg.js';
-import { ReactComponent as Memo$1Y } from './assets/default-outline/id.svg.js';
-import { ReactComponent as Memo$1Z } from './assets/default-outline/information.svg.js';
-import { ReactComponent as Memo$1_ } from './assets/default-outline/lock.svg.js';
-import { ReactComponent as Memo$1$ } from './assets/default-outline/members.svg.js';
-import { ReactComponent as Memo$20 } from './assets/default-outline/moon.svg.js';
-import { ReactComponent as Memo$21 } from './assets/default-outline/mosaic.svg.js';
-import { ReactComponent as Memo$22 } from './assets/default-outline/pencil.svg.js';
-import { ReactComponent as Memo$23 } from './assets/default-outline/phone.svg.js';
-import { ReactComponent as Memo$2d } from './assets/default-outline/pin.svg.js';
-import { ReactComponent as Memo$24 } from './assets/default-outline/play.svg.js';
-import { ReactComponent as Memo$25 } from './assets/default-outline/privacy.svg.js';
-import { ReactComponent as Memo$26 } from './assets/default-outline/profile.svg.js';
-import { ReactComponent as Memo$27 } from './assets/default-outline/rocket.svg.js';
-import { ReactComponent as Memo$28 } from './assets/default-outline/settings.svg.js';
-import { ReactComponent as Memo$29 } from './assets/default-outline/sun.svg.js';
-import { ReactComponent as Memo$2a } from './assets/default-outline/support.svg.js';
-import { ReactComponent as Memo$2b } from './assets/default-outline/unlock.svg.js';
-import { ReactComponent as Memo$2e } from './assets/default-outline/unpin.svg.js';
-import { ReactComponent as Memo$2c } from './assets/default-outline/weather-night.svg.js';
+import { ReactComponent as Memo$1B } from './assets/default-outline/address.svg.js';
+import { ReactComponent as Memo$1C } from './assets/default-outline/alert-circle.svg.js';
+import { ReactComponent as Memo$1D } from './assets/default-outline/auto-fix.svg.js';
+import { ReactComponent as Memo$1E } from './assets/default-outline/book-open-outline.svg.js';
+import { ReactComponent as Memo$1F } from './assets/default-outline/bullhorn.svg.js';
+import { ReactComponent as Memo$1G } from './assets/default-outline/calculator.svg.js';
+import { ReactComponent as Memo$1H } from './assets/default-outline/calendar-range.svg.js';
+import { ReactComponent as Memo$1I } from './assets/default-outline/chat.svg.js';
+import { ReactComponent as Memo$1J } from './assets/default-outline/check-circle.svg.js';
+import { ReactComponent as Memo$1K } from './assets/default-outline/clock-outline.svg.js';
+import { ReactComponent as Memo$1L } from './assets/default-outline/console.svg.js';
+import { ReactComponent as Memo$1M } from './assets/default-outline/credential.svg.js';
+import { ReactComponent as Memo$1N } from './assets/default-outline/credit-card.svg.js';
+import { ReactComponent as Memo$1O } from './assets/default-outline/database.svg.js';
+import { ReactComponent as Memo$1P } from './assets/default-outline/delete.svg.js';
+import { ReactComponent as Memo$1Q } from './assets/default-outline/doc.svg.js';
+import { ReactComponent as Memo$1R } from './assets/default-outline/earth.svg.js';
+import { ReactComponent as Memo$1S } from './assets/default-outline/email-remove.svg.js';
+import { ReactComponent as Memo$1T } from './assets/default-outline/email.svg.js';
+import { ReactComponent as Memo$1U } from './assets/default-outline/eye-off.svg.js';
+import { ReactComponent as Memo$1V } from './assets/default-outline/eye.svg.js';
+import { ReactComponent as Memo$1W } from './assets/default-outline/filter.svg.js';
+import { ReactComponent as Memo$1X } from './assets/default-outline/folder.svg.js';
+import { ReactComponent as Memo$1Y } from './assets/default-outline/help-circle.svg.js';
+import { ReactComponent as Memo$1Z } from './assets/default-outline/id.svg.js';
+import { ReactComponent as Memo$1_ } from './assets/default-outline/information.svg.js';
+import { ReactComponent as Memo$1$ } from './assets/default-outline/lock.svg.js';
+import { ReactComponent as Memo$20 } from './assets/default-outline/members.svg.js';
+import { ReactComponent as Memo$21 } from './assets/default-outline/moon.svg.js';
+import { ReactComponent as Memo$22 } from './assets/default-outline/mosaic.svg.js';
+import { ReactComponent as Memo$23 } from './assets/default-outline/pen.svg.js';
+import { ReactComponent as Memo$24 } from './assets/default-outline/pencil.svg.js';
+import { ReactComponent as Memo$25 } from './assets/default-outline/phone.svg.js';
+import { ReactComponent as Memo$2f } from './assets/default-outline/pin.svg.js';
+import { ReactComponent as Memo$26 } from './assets/default-outline/play.svg.js';
+import { ReactComponent as Memo$27 } from './assets/default-outline/privacy.svg.js';
+import { ReactComponent as Memo$28 } from './assets/default-outline/profile.svg.js';
+import { ReactComponent as Memo$29 } from './assets/default-outline/rocket.svg.js';
+import { ReactComponent as Memo$2a } from './assets/default-outline/settings.svg.js';
+import { ReactComponent as Memo$2b } from './assets/default-outline/sun.svg.js';
+import { ReactComponent as Memo$2c } from './assets/default-outline/support.svg.js';
+import { ReactComponent as Memo$2d } from './assets/default-outline/unlock.svg.js';
+import { ReactComponent as Memo$2g } from './assets/default-outline/unpin.svg.js';
+import { ReactComponent as Memo$2e } from './assets/default-outline/weather-night.svg.js';
 import { ReactComponent as Memo$V } from './assets/default-solid/address.svg.js';
 import { ReactComponent as Memo$W } from './assets/default-solid/alert-circle.svg.js';
 import { ReactComponent as Memo$X } from './assets/default-solid/auto-fix.svg.js';
@@ -128,19 +129,20 @@ import { ReactComponent as Memo$1j } from './assets/default-solid/lock.svg.js';
 import { ReactComponent as Memo$1k } from './assets/default-solid/members.svg.js';
 import { ReactComponent as Memo$1l } from './assets/default-solid/moon.svg.js';
 import { ReactComponent as Memo$1m } from './assets/default-solid/mosaic.svg.js';
-import { ReactComponent as Memo$1n } from './assets/default-solid/pencil.svg.js';
-import { ReactComponent as Memo$1o } from './assets/default-solid/phone.svg.js';
-import { ReactComponent as Memo$1y } from './assets/default-solid/pin.svg.js';
-import { ReactComponent as Memo$1p } from './assets/default-solid/play.svg.js';
-import { ReactComponent as Memo$1q } from './assets/default-solid/privacy.svg.js';
-import { ReactComponent as Memo$1r } from './assets/default-solid/profile.svg.js';
-import { ReactComponent as Memo$1s } from './assets/default-solid/rocket.svg.js';
-import { ReactComponent as Memo$1t } from './assets/default-solid/settings.svg.js';
-import { ReactComponent as Memo$1u } from './assets/default-solid/sun.svg.js';
-import { ReactComponent as Memo$1v } from './assets/default-solid/support.svg.js';
-import { ReactComponent as Memo$1w } from './assets/default-solid/unlock.svg.js';
-import { ReactComponent as Memo$1z } from './assets/default-solid/unpin.svg.js';
-import { ReactComponent as Memo$1x } from './assets/default-solid/weather-night.svg.js';
+import { ReactComponent as Memo$1n } from './assets/default-solid/pen.svg.js';
+import { ReactComponent as Memo$1o } from './assets/default-solid/pencil.svg.js';
+import { ReactComponent as Memo$1p } from './assets/default-solid/phone.svg.js';
+import { ReactComponent as Memo$1z } from './assets/default-solid/pin.svg.js';
+import { ReactComponent as Memo$1q } from './assets/default-solid/play.svg.js';
+import { ReactComponent as Memo$1r } from './assets/default-solid/privacy.svg.js';
+import { ReactComponent as Memo$1s } from './assets/default-solid/profile.svg.js';
+import { ReactComponent as Memo$1t } from './assets/default-solid/rocket.svg.js';
+import { ReactComponent as Memo$1u } from './assets/default-solid/settings.svg.js';
+import { ReactComponent as Memo$1v } from './assets/default-solid/sun.svg.js';
+import { ReactComponent as Memo$1w } from './assets/default-solid/support.svg.js';
+import { ReactComponent as Memo$1x } from './assets/default-solid/unlock.svg.js';
+import { ReactComponent as Memo$1A } from './assets/default-solid/unpin.svg.js';
+import { ReactComponent as Memo$1y } from './assets/default-solid/weather-night.svg.js';
 
 const ICONS = {
   filled: {
@@ -231,19 +233,20 @@ const ICONS = {
     members: Memo$1k,
     moon: Memo$1l,
     mosaic: Memo$1m,
-    pencil: Memo$1n,
-    phone: Memo$1o,
-    'play-circle-outline': Memo$1p,
-    privacy: Memo$1q,
-    profile: Memo$1r,
-    rocket: Memo$1s,
-    settings: Memo$1t,
-    sun: Memo$1u,
-    support: Memo$1v,
-    unlock: Memo$1w,
-    'weather-night': Memo$1x,
-    pin: Memo$1y,
-    unpin: Memo$1z
+    pen: Memo$1n,
+    pencil: Memo$1o,
+    phone: Memo$1p,
+    'play-circle-outline': Memo$1q,
+    privacy: Memo$1r,
+    profile: Memo$1s,
+    rocket: Memo$1t,
+    settings: Memo$1u,
+    sun: Memo$1v,
+    support: Memo$1w,
+    unlock: Memo$1x,
+    'weather-night': Memo$1y,
+    pin: Memo$1z,
+    unpin: Memo$1A
   },
   outlined: {
     anchor: Memo,
@@ -303,49 +306,50 @@ const ICONS = {
     view: Memo$S,
     west: Memo$T,
     youtube: Memo$U,
-    address: Memo$1A,
-    alert: Memo$1B,
-    'auto-fix': Memo$1C,
-    'book-open-outline': Memo$1D,
-    bullhorn: Memo$1E,
-    calculator: Memo$1F,
-    'calendar-range': Memo$1G,
-    chat: Memo$1H,
-    'checkbox-circle-outline': Memo$1I,
-    'clock-outline': Memo$1J,
-    console: Memo$1K,
-    credentials: Memo$1L,
-    'credit-card': Memo$1M,
-    database: Memo$1N,
-    delete: Memo$1O,
-    doc: Memo$1P,
-    earth: Memo$1Q,
-    'email-remove-outline': Memo$1R,
-    'email-outline': Memo$1S,
-    'eye-off': Memo$1T,
-    eye: Memo$1U,
-    filter: Memo$1V,
-    folder: Memo$1W,
-    'help-circle-outline': Memo$1X,
-    id: Memo$1Y,
-    'information-outline': Memo$1Z,
-    lock: Memo$1_,
-    members: Memo$1$,
-    moon: Memo$20,
-    mosaic: Memo$21,
-    pencil: Memo$22,
-    phone: Memo$23,
-    'play-circle-outline': Memo$24,
-    privacy: Memo$25,
-    profile: Memo$26,
-    rocket: Memo$27,
-    settings: Memo$28,
-    sun: Memo$29,
-    support: Memo$2a,
-    unlock: Memo$2b,
-    'weather-night': Memo$2c,
-    pin: Memo$2d,
-    unpin: Memo$2e
+    address: Memo$1B,
+    alert: Memo$1C,
+    'auto-fix': Memo$1D,
+    'book-open-outline': Memo$1E,
+    bullhorn: Memo$1F,
+    calculator: Memo$1G,
+    'calendar-range': Memo$1H,
+    chat: Memo$1I,
+    'checkbox-circle-outline': Memo$1J,
+    'clock-outline': Memo$1K,
+    console: Memo$1L,
+    credentials: Memo$1M,
+    'credit-card': Memo$1N,
+    database: Memo$1O,
+    delete: Memo$1P,
+    doc: Memo$1Q,
+    earth: Memo$1R,
+    'email-remove-outline': Memo$1S,
+    'email-outline': Memo$1T,
+    'eye-off': Memo$1U,
+    eye: Memo$1V,
+    filter: Memo$1W,
+    folder: Memo$1X,
+    'help-circle-outline': Memo$1Y,
+    id: Memo$1Z,
+    'information-outline': Memo$1_,
+    lock: Memo$1$,
+    members: Memo$20,
+    moon: Memo$21,
+    mosaic: Memo$22,
+    pen: Memo$23,
+    pencil: Memo$24,
+    phone: Memo$25,
+    'play-circle-outline': Memo$26,
+    privacy: Memo$27,
+    profile: Memo$28,
+    rocket: Memo$29,
+    settings: Memo$2a,
+    sun: Memo$2b,
+    support: Memo$2c,
+    unlock: Memo$2d,
+    'weather-night': Memo$2e,
+    pin: Memo$2f,
+    unpin: Memo$2g
   }
 };
 

package/dist/@ultraviolet/icons/dist/components/Icon/SmallIcons.js

@@ -55,49 +55,50 @@ import { ReactComponent as Memo$R } from './assets/small/upload.svg.js';
 import { ReactComponent as Memo$S } from './assets/small/view.svg.js';
 import { ReactComponent as Memo$T } from './assets/small/west.svg.js';
 import { ReactComponent as Memo$U } from './assets/small/youtube.svg.js';
-import { ReactComponent as Memo$1A } from './assets/small-outline/address.svg.js';
-import { ReactComponent as Memo$1B } from './assets/small-outline/alert-circle.svg.js';
-import { ReactComponent as Memo$1C } from './assets/small-outline/auto-fix.svg.js';
-import { ReactComponent as Memo$1D } from './assets/small-outline/book-open-outline.svg.js';
-import { ReactComponent as Memo$1E } from './assets/small-outline/bullhorn.svg.js';
-import { ReactComponent as Memo$1F } from './assets/small-outline/calculator.svg.js';
-import { ReactComponent as Memo$1G } from './assets/small-outline/calendar-range.svg.js';
-import { ReactComponent as Memo$1H } from './assets/small-outline/chat.svg.js';
-import { ReactComponent as Memo$1I } from './assets/small-outline/check-circle.svg.js';
-import { ReactComponent as Memo$1J } from './assets/small-outline/clock-outline.svg.js';
-import { ReactComponent as Memo$1K } from './assets/small-outline/console.svg.js';
-import { ReactComponent as Memo$1L } from './assets/small-outline/credential.svg.js';
-import { ReactComponent as Memo$1M } from './assets/small-outline/credit-card.svg.js';
-import { ReactComponent as Memo$1N } from './assets/small-outline/database.svg.js';
-import { ReactComponent as Memo$1O } from './assets/small-outline/delete.svg.js';
-import { ReactComponent as Memo$1P } from './assets/small-outline/doc.svg.js';
-import { ReactComponent as Memo$1Q } from './assets/small-outline/earth.svg.js';
-import { ReactComponent as Memo$1R } from './assets/small-outline/email-remove.svg.js';
-import { ReactComponent as Memo$1S } from './assets/small-outline/email.svg.js';
-import { ReactComponent as Memo$1T } from './assets/small-outline/eye-off.svg.js';
-import { ReactComponent as Memo$1U } from './assets/small-outline/eye.svg.js';
-import { ReactComponent as Memo$1V } from './assets/small-outline/filter.svg.js';
-import { ReactComponent as Memo$1W } from './assets/small-outline/folder.svg.js';
-import { ReactComponent as Memo$1X } from './assets/small-outline/help-circle.svg.js';
-import { ReactComponent as Memo$1Y } from './assets/small-outline/id.svg.js';
-import { ReactComponent as Memo$1Z } from './assets/small-outline/information.svg.js';
-import { ReactComponent as Memo$1_ } from './assets/small-outline/lock.svg.js';
-import { ReactComponent as Memo$1$ } from './assets/small-outline/members.svg.js';
-import { ReactComponent as Memo$20 } from './assets/small-outline/moon.svg.js';
-import { ReactComponent as Memo$21 } from './assets/small-outline/mosaic.svg.js';
-import { ReactComponent as Memo$22 } from './assets/small-outline/pencil.svg.js';
-import { ReactComponent as Memo$23 } from './assets/small-outline/phone.svg.js';
-import { ReactComponent as Memo$2d } from './assets/small-outline/pin.svg.js';
-import { ReactComponent as Memo$24 } from './assets/small-outline/play.svg.js';
-import { ReactComponent as Memo$25 } from './assets/small-outline/privacy.svg.js';
-import { ReactComponent as Memo$26 } from './assets/small-outline/profile.svg.js';
-import { ReactComponent as Memo$27 } from './assets/small-outline/rocket.svg.js';
-import { ReactComponent as Memo$28 } from './assets/small-outline/settings.svg.js';
-import { ReactComponent as Memo$29 } from './assets/small-outline/sun.svg.js';
-import { ReactComponent as Memo$2a } from './assets/small-outline/support.svg.js';
-import { ReactComponent as Memo$2b } from './assets/small-outline/unlock.svg.js';
-import { ReactComponent as Memo$2e } from './assets/small-outline/unpin.svg.js';
-import { ReactComponent as Memo$2c } from './assets/small-outline/weather-night.svg.js';
+import { ReactComponent as Memo$1B } from './assets/small-outline/address.svg.js';
+import { ReactComponent as Memo$1C } from './assets/small-outline/alert-circle.svg.js';
+import { ReactComponent as Memo$1D } from './assets/small-outline/auto-fix.svg.js';
+import { ReactComponent as Memo$1E } from './assets/small-outline/book-open-outline.svg.js';
+import { ReactComponent as Memo$1F } from './assets/small-outline/bullhorn.svg.js';
+import { ReactComponent as Memo$1G } from './assets/small-outline/calculator.svg.js';
+import { ReactComponent as Memo$1H } from './assets/small-outline/calendar-range.svg.js';
+import { ReactComponent as Memo$1I } from './assets/small-outline/chat.svg.js';
+import { ReactComponent as Memo$1J } from './assets/small-outline/check-circle.svg.js';
+import { ReactComponent as Memo$1K } from './assets/small-outline/clock-outline.svg.js';
+import { ReactComponent as Memo$1L } from './assets/small-outline/console.svg.js';
+import { ReactComponent as Memo$1M } from './assets/small-outline/credential.svg.js';
+import { ReactComponent as Memo$1N } from './assets/small-outline/credit-card.svg.js';
+import { ReactComponent as Memo$1O } from './assets/small-outline/database.svg.js';
+import { ReactComponent as Memo$1P } from './assets/small-outline/delete.svg.js';
+import { ReactComponent as Memo$1Q } from './assets/small-outline/doc.svg.js';
+import { ReactComponent as Memo$1R } from './assets/small-outline/earth.svg.js';
+import { ReactComponent as Memo$1S } from './assets/small-outline/email-remove.svg.js';
+import { ReactComponent as Memo$1T } from './assets/small-outline/email.svg.js';
+import { ReactComponent as Memo$1U } from './assets/small-outline/eye-off.svg.js';
+import { ReactComponent as Memo$1V } from './assets/small-outline/eye.svg.js';
+import { ReactComponent as Memo$1W } from './assets/small-outline/filter.svg.js';
+import { ReactComponent as Memo$1X } from './assets/small-outline/folder.svg.js';
+import { ReactComponent as Memo$1Y } from './assets/small-outline/help-circle.svg.js';
+import { ReactComponent as Memo$1Z } from './assets/small-outline/id.svg.js';
+import { ReactComponent as Memo$1_ } from './assets/small-outline/information.svg.js';
+import { ReactComponent as Memo$1$ } from './assets/small-outline/lock.svg.js';
+import { ReactComponent as Memo$20 } from './assets/small-outline/members.svg.js';
+import { ReactComponent as Memo$21 } from './assets/small-outline/moon.svg.js';
+import { ReactComponent as Memo$22 } from './assets/small-outline/mosaic.svg.js';
+import { ReactComponent as Memo$23 } from './assets/small-outline/pen.svg.js';
+import { ReactComponent as Memo$24 } from './assets/small-outline/pencil.svg.js';
+import { ReactComponent as Memo$25 } from './assets/small-outline/phone.svg.js';
+import { ReactComponent as Memo$2f } from './assets/small-outline/pin.svg.js';
+import { ReactComponent as Memo$26 } from './assets/small-outline/play.svg.js';
+import { ReactComponent as Memo$27 } from './assets/small-outline/privacy.svg.js';
+import { ReactComponent as Memo$28 } from './assets/small-outline/profile.svg.js';
+import { ReactComponent as Memo$29 } from './assets/small-outline/rocket.svg.js';
+import { ReactComponent as Memo$2a } from './assets/small-outline/settings.svg.js';
+import { ReactComponent as Memo$2b } from './assets/small-outline/sun.svg.js';
+import { ReactComponent as Memo$2c } from './assets/small-outline/support.svg.js';
+import { ReactComponent as Memo$2d } from './assets/small-outline/unlock.svg.js';
+import { ReactComponent as Memo$2g } from './assets/small-outline/unpin.svg.js';
+import { ReactComponent as Memo$2e } from './assets/small-outline/weather-night.svg.js';
 import { ReactComponent as Memo$V } from './assets/small-solid/address.svg.js';
 import { ReactComponent as Memo$W } from './assets/small-solid/alert-circle.svg.js';
 import { ReactComponent as Memo$X } from './assets/small-solid/auto-fix.svg.js';
@@ -128,19 +129,20 @@ import { ReactComponent as Memo$1j } from './assets/small-solid/lock.svg.js';
 import { ReactComponent as Memo$1k } from './assets/small-solid/members.svg.js';
 import { ReactComponent as Memo$1l } from './assets/small-solid/moon.svg.js';
 import { ReactComponent as Memo$1m } from './assets/small-solid/mosaic.svg.js';
-import { ReactComponent as Memo$1n } from './assets/small-solid/pencil.svg.js';
-import { ReactComponent as Memo$1o } from './assets/small-solid/phone.svg.js';
-import { ReactComponent as Memo$1y } from './assets/small-solid/pin.svg.js';
-import { ReactComponent as Memo$1p } from './assets/small-solid/play.svg.js';
-import { ReactComponent as Memo$1q } from './assets/small-solid/privacy.svg.js';
-import { ReactComponent as Memo$1r } from './assets/small-solid/profile.svg.js';
-import { ReactComponent as Memo$1s } from './assets/small-solid/rocket.svg.js';
-import { ReactComponent as Memo$1t } from './assets/small-solid/settings.svg.js';
-import { ReactComponent as Memo$1u } from './assets/small-solid/sun.svg.js';
-import { ReactComponent as Memo$1v } from './assets/small-solid/support.svg.js';
-import { ReactComponent as Memo$1w } from './assets/small-solid/unlock.svg.js';
-import { ReactComponent as Memo$1z } from './assets/small-solid/unpin.svg.js';
-import { ReactComponent as Memo$1x } from './assets/small-solid/weather-night.svg.js';
+import { ReactComponent as Memo$1n } from './assets/small-solid/pen.svg.js';
+import { ReactComponent as Memo$1o } from './assets/small-solid/pencil.svg.js';
+import { ReactComponent as Memo$1p } from './assets/small-solid/phone.svg.js';
+import { ReactComponent as Memo$1z } from './assets/small-solid/pin.svg.js';
+import { ReactComponent as Memo$1q } from './assets/small-solid/play.svg.js';
+import { ReactComponent as Memo$1r } from './assets/small-solid/privacy.svg.js';
+import { ReactComponent as Memo$1s } from './assets/small-solid/profile.svg.js';
+import { ReactComponent as Memo$1t } from './assets/small-solid/rocket.svg.js';
+import { ReactComponent as Memo$1u } from './assets/small-solid/settings.svg.js';
+import { ReactComponent as Memo$1v } from './assets/small-solid/sun.svg.js';
+import { ReactComponent as Memo$1w } from './assets/small-solid/support.svg.js';
+import { ReactComponent as Memo$1x } from './assets/small-solid/unlock.svg.js';
+import { ReactComponent as Memo$1A } from './assets/small-solid/unpin.svg.js';
+import { ReactComponent as Memo$1y } from './assets/small-solid/weather-night.svg.js';
 
 const SMALL_ICONS = {
   filled: {
@@ -231,19 +233,20 @@ const SMALL_ICONS = {
     members: Memo$1k,
     moon: Memo$1l,
     mosaic: Memo$1m,
-    pencil: Memo$1n,
-    phone: Memo$1o,
-    'play-circle-outline': Memo$1p,
-    privacy: Memo$1q,
-    profile: Memo$1r,
-    rocket: Memo$1s,
-    settings: Memo$1t,
-    sun: Memo$1u,
-    support: Memo$1v,
-    unlock: Memo$1w,
-    'weather-night': Memo$1x,
-    pin: Memo$1y,
-    unpin: Memo$1z
+    pen: Memo$1n,
+    pencil: Memo$1o,
+    phone: Memo$1p,
+    'play-circle-outline': Memo$1q,
+    privacy: Memo$1r,
+    profile: Memo$1s,
+    rocket: Memo$1t,
+    settings: Memo$1u,
+    sun: Memo$1v,
+    support: Memo$1w,
+    unlock: Memo$1x,
+    'weather-night': Memo$1y,
+    pin: Memo$1z,
+    unpin: Memo$1A
   },
   outlined: {
     anchor: Memo,
@@ -303,49 +306,50 @@ const SMALL_ICONS = {
     view: Memo$S,
     west: Memo$T,
     youtube: Memo$U,
-    address: Memo$1A,
-    alert: Memo$1B,
-    'auto-fix': Memo$1C,
-    'book-open-outline': Memo$1D,
-    bullhorn: Memo$1E,
-    calculator: Memo$1F,
-    'calendar-range': Memo$1G,
-    chat: Memo$1H,
-    'checkbox-circle-outline': Memo$1I,
-    'clock-outline': Memo$1J,
-    console: Memo$1K,
-    credentials: Memo$1L,
-    'credit-card': Memo$1M,
-    database: Memo$1N,
-    delete: Memo$1O,
-    doc: Memo$1P,
-    earth: Memo$1Q,
-    'email-remove-outline': Memo$1R,
-    'email-outline': Memo$1S,
-    'eye-off': Memo$1T,
-    eye: Memo$1U,
-    filter: Memo$1V,
-    folder: Memo$1W,
-    'help-circle-outline': Memo$1X,
-    id: Memo$1Y,
-    'information-outline': Memo$1Z,
-    lock: Memo$1_,
-    members: Memo$1$,
-    moon: Memo$20,
-    mosaic: Memo$21,
-    pencil: Memo$22,
-    phone: Memo$23,
-    'play-circle-outline': Memo$24,
-    privacy: Memo$25,
-    profile: Memo$26,
-    rocket: Memo$27,
-    settings: Memo$28,
-    sun: Memo$29,
-    support: Memo$2a,
-    unlock: Memo$2b,
-    'weather-night': Memo$2c,
-    pin: Memo$2d,
-    unpin: Memo$2e
+    address: Memo$1B,
+    alert: Memo$1C,
+    'auto-fix': Memo$1D,
+    'book-open-outline': Memo$1E,
+    bullhorn: Memo$1F,
+    calculator: Memo$1G,
+    'calendar-range': Memo$1H,
+    chat: Memo$1I,
+    'checkbox-circle-outline': Memo$1J,
+    'clock-outline': Memo$1K,
+    console: Memo$1L,
+    credentials: Memo$1M,
+    'credit-card': Memo$1N,
+    database: Memo$1O,
+    delete: Memo$1P,
+    doc: Memo$1Q,
+    earth: Memo$1R,
+    'email-remove-outline': Memo$1S,
+    'email-outline': Memo$1T,
+    'eye-off': Memo$1U,
+    eye: Memo$1V,
+    filter: Memo$1W,
+    folder: Memo$1X,
+    'help-circle-outline': Memo$1Y,
+    id: Memo$1Z,
+    'information-outline': Memo$1_,
+    lock: Memo$1$,
+    members: Memo$20,
+    moon: Memo$21,
+    mosaic: Memo$22,
+    pen: Memo$23,
+    pencil: Memo$24,
+    phone: Memo$25,
+    'play-circle-outline': Memo$26,
+    privacy: Memo$27,
+    profile: Memo$28,
+    rocket: Memo$29,
+    settings: Memo$2a,
+    sun: Memo$2b,
+    support: Memo$2c,
+    unlock: Memo$2d,
+    'weather-night': Memo$2e,
+    pin: Memo$2f,
+    unpin: Memo$2g
   }
 };
 

package/dist/@ultraviolet/icons/dist/components/Icon/assets/default-outline/pen.svg.js

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { memo } from 'react';
+
+var _path;
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var SvgPen = function SvgPen(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 20,
+    height: 20,
+    fill: "none",
+    viewBox: "0 0 20 20"
+  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M17.137 2.863a.81.81 0 0 0-1.149 0l-.876.876 1.15 1.149.875-.876a.81.81 0 0 0 0-1.149M15.2 5.949l-1.149-1.15L4.014 14.838a3 3 0 0 0-.754 1.265l-.27.908.908-.27a3 3 0 0 0 1.265-.754zm-.273-4.147a2.313 2.313 0 0 1 3.27 3.27L6.225 17.048a4.5 4.5 0 0 1-1.897 1.13l-2.238.667a.75.75 0 0 1-.933-.933l.667-2.238a4.5 4.5 0 0 1 1.13-1.897z",
+    clipRule: "evenodd"
+  })));
+};
+var Memo = /*#__PURE__*/memo(SvgPen);
+
+export { Memo as ReactComponent };

package/dist/@ultraviolet/icons/dist/components/Icon/assets/default-solid/pen.svg.js

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { memo } from 'react';
+
+var _path;
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var SvgPen = function SvgPen(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 20,
+    height: 20,
+    fill: "none",
+    viewBox: "0 0 20 20"
+  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "m2.695 14.762-1.262 3.155a.5.5 0 0 0 .65.65l3.154-1.262a4 4 0 0 0 1.343-.886L17.5 5.501a2.121 2.121 0 0 0-3-3L3.58 13.419a4 4 0 0 0-.885 1.343"
+  })));
+};
+var Memo = /*#__PURE__*/memo(SvgPen);
+
+export { Memo as ReactComponent };

package/dist/@ultraviolet/icons/dist/components/Icon/assets/small-outline/pen.svg.js

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { memo } from 'react';
+
+var _path;
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var SvgPen = function SvgPen(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    fill: "none",
+    viewBox: "0 0 16 16"
+  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M10.232 1.982a2.5 2.5 0 1 1 3.536 3.536l-7.262 7.261a3.5 3.5 0 0 1-1.135.759l-2.047.848a1.5 1.5 0 0 1-1.96-1.96l.693.287-.693-.287.848-2.047a3.5 3.5 0 0 1 .759-1.135zm2.475 1.06a1 1 0 0 0-1.414 0L4.03 10.306a2 2 0 0 0-.433.648l-.693-.287.693.287L2.75 13l2.047-.848c.243-.1.463-.248.649-.433l7.261-7.262a1 1 0 0 0 0-1.414",
+    clipRule: "evenodd"
+  })));
+};
+var Memo = /*#__PURE__*/memo(SvgPen);
+
+export { Memo as ReactComponent };

package/dist/@ultraviolet/icons/dist/components/Icon/assets/small-solid/pen.svg.js

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { memo } from 'react';
+
+var _path;
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var SvgPen = function SvgPen(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    fill: "none",
+    viewBox: "0 0 16 16"
+  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M11.013 2.513a1.75 1.75 0 0 1 2.475 2.474L6.226 12.25a2.8 2.8 0 0 1-.892.596l-2.047.848a.75.75 0 0 1-.98-.98l.848-2.047a2.8 2.8 0 0 1 .596-.892z",
+    clipRule: "evenodd"
+  })));
+};
+var Memo = /*#__PURE__*/memo(SvgPen);
+
+export { Memo as ReactComponent };

package/dist/@ultraviolet/icons/dist/components/ProductIcon/Icons.js

@@ -1,4 +1,5 @@
 import { ReactComponent as Memo$1N } from './assets/abuse.svg.js';
+import { ReactComponent as Memo$2d } from './assets/account-experience.svg.js';
 import { ReactComponent as Memo } from './assets/additional-disk.svg.js';
 import { ReactComponent as Memo$18 } from './assets/advanced-settings.svg.js';
 import { ReactComponent as Memo$1 } from './assets/ansible.svg.js';
@@ -107,6 +108,7 @@ import { ReactComponent as Memo$s } from './assets/rpn-san.svg.js';
 import { ReactComponent as Memo$t } from './assets/rpn-v1.svg.js';
 import { ReactComponent as Memo$u } from './assets/rpn-v2.svg.js';
 import { ReactComponent as Memo$v } from './assets/rpn.svg.js';
+import { ReactComponent as Memo$2e } from './assets/saving-plan.svg.js';
 import { ReactComponent as Memo$w } from './assets/sdk-go.svg.js';
 import { ReactComponent as Memo$x } from './assets/sdk-python.svg.js';
 import { ReactComponent as Memo$1O } from './assets/secret-manager.svg.js';
@@ -281,7 +283,9 @@ const PRODUCT_ICONS = {
   vpsProServers: Memo$29,
   vpsServers: Memo$2a,
   vpsStartServers: Memo$2b,
-  environmentalFootprintCalculator: Memo$2c
+  environmentalFootprintCalculator: Memo$2c,
+  accountExperience: Memo$2d,
+  savingPlan: Memo$2e
 };
 
 export { PRODUCT_ICONS };

package/dist/@ultraviolet/icons/dist/components/ProductIcon/assets/account-experience.svg.js

@@ -0,0 +1,48 @@
+import * as React from 'react';
+import { memo } from 'react';
+
+var _g;
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var SvgAccountExperience = function SvgAccountExperience(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 64,
+    height: 64,
+    fill: "none",
+    viewBox: "0 0 64 64"
+  }, props), _g || (_g = /*#__PURE__*/React.createElement("g", {
+    className: "account-experience"
+  }, /*#__PURE__*/React.createElement("g", {
+    className: ".Square"
+  }, /*#__PURE__*/React.createElement("g", {
+    fill: "#F1EEFC",
+    className: "fillWeak"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M0 16C0 7.163 7.163 0 16 0h32c8.837 0 16 7.163 16 16v32c0 8.837-7.163 16-16 16H16C7.163 64 0 56.837 0 48z"
+  }), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M48 2H16C8.268 2 2 8.268 2 16v32c0 7.732 6.268 14 14 14h32c7.732 0 14-6.268 14-14V16c0-7.732-6.268-14-14-14M16 0C7.163 0 0 7.163 0 16v32c0 8.837 7.163 16 16 16h32c8.837 0 16-7.163 16-16V16c0-8.837-7.163-16-16-16z",
+    clipRule: "evenodd"
+  }))), /*#__PURE__*/React.createElement("g", {
+    fill: "#521094",
+    fillRule: "evenodd",
+    className: "fill",
+    clipRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M32 31a5.895 5.895 0 1 0 0-11.79A5.895 5.895 0 0 0 32 31m0 2a7.895 7.895 0 1 0 0-15.79A7.895 7.895 0 0 0 32 33m-3 4.158a6 6 0 0 0-6 6v5.631a1 1 0 1 1-2 0v-5.631a8 8 0 0 1 8-8h10.5a1 1 0 1 1 0 2z"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M32 11c-11.046 0-20 8.954-20 20s8.954 20 20 20q1.144 0 2.254-.126l.223 1.988Q33.256 52.999 32 53c-12.15 0-22-9.85-22-22S19.85 9 32 9s22 9.85 22 22c0 2.345-.367 4.605-1.048 6.727l-1.904-.61A20 20 0 0 0 52 31c0-11.046-8.954-20-20-20"
+  })), /*#__PURE__*/React.createElement("g", {
+    fill: "#A060F6",
+    fillRule: "evenodd",
+    className: "fillStrong",
+    clipRule: "evenodd"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M38.702 33a1 1 0 0 1 1-1h5.56a1 1 0 0 1 1 1v3.25a9.4 9.4 0 0 1 1.79 1.009l3.07-1.703a1 1 0 0 1 1.342.36l2.78 4.63a1 1 0 0 1-.372 1.388l-3.09 1.716a9 9 0 0 1 .001 1.69l3.09 1.715a1 1 0 0 1 .371 1.39l-2.78 4.63a1 1 0 0 1-1.343.36l-3.06-1.7c-.555.4-1.158.742-1.798 1.016V56a1 1 0 0 1-1 1h-5.561a1 1 0 0 1-1-1v-3.25a9.4 9.4 0 0 1-1.778-1l-3.032 1.684a1 1 0 0 1-1.343-.36l-2.78-4.63a1 1 0 0 1 .372-1.389l3.042-1.688a9 9 0 0 1 .001-1.743l-3.043-1.69a1 1 0 0 1-.372-1.389l2.78-4.63a1 1 0 0 1 1.343-.36l3.04 1.689a9.4 9.4 0 0 1 1.77-.994zm2 1v2.937a1 1 0 0 1-.679.947 7.4 7.4 0 0 0-2.36 1.321 1 1 0 0 1-1.126.106l-2.77-1.538-1.751 2.915 2.74 1.52a1 1 0 0 1 .498 1.057 6.8 6.8 0 0 0-.002 2.462 1 1 0 0 1-.498 1.055l-2.738 1.52 1.75 2.914 2.763-1.533a1 1 0 0 1 1.126.107 7.4 7.4 0 0 0 2.368 1.327 1 1 0 0 1 .679.947V55h3.56v-2.936a1 1 0 0 1 .679-.947 7.4 7.4 0 0 0 2.385-1.342 1 1 0 0 1 1.128-.109l2.793 1.55 1.75-2.914-2.783-1.545a1 1 0 0 1-.498-1.052 6.8 6.8 0 0 0-.002-2.418 1 1 0 0 1 .499-1.053l2.784-1.546-1.75-2.915-2.8 1.555a1 1 0 0 1-1.128-.108 7.4 7.4 0 0 0-2.378-1.336 1 1 0 0 1-.678-.947V34z"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M42.5 42a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5M38 44.5a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0"
+  })))));
+};
+var Memo = /*#__PURE__*/memo(SvgAccountExperience);
+
+export { Memo as ReactComponent };

package/dist/@ultraviolet/icons/dist/components/ProductIcon/assets/saving-plan.svg.js

@@ -0,0 +1,59 @@
+import * as React from 'react';
+import { memo } from 'react';
+
+var _g, _defs;
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var SvgSavingPlan = function SvgSavingPlan(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 64,
+    height: 64,
+    fill: "none",
+    viewBox: "0 0 64 64"
+  }, props), _g || (_g = /*#__PURE__*/React.createElement("g", {
+    className: "saving-plan",
+    clipPath: "url(#a)"
+  }, /*#__PURE__*/React.createElement("g", {
+    className: ".Square"
+  }, /*#__PURE__*/React.createElement("g", {
+    fill: "#F1EEFC",
+    className: "fillWeak"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M0 16C0 7.163 7.163 0 16 0h32c8.837 0 16 7.163 16 16v32c0 8.837-7.163 16-16 16H16C7.163 64 0 56.837 0 48z"
+  }), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M48 2H16C8.268 2 2 8.268 2 16v32c0 7.732 6.268 14 14 14h32c7.732 0 14-6.268 14-14V16c0-7.732-6.268-14-14-14M16 0C7.163 0 0 7.163 0 16v32c0 8.837 7.163 16 16 16h32c8.837 0 16-7.163 16-16V16c0-8.837-7.163-16-16-16z",
+    clipRule: "evenodd"
+  }))), /*#__PURE__*/React.createElement("g", {
+    fill: "#A060F6",
+    className: "fillStrong"
+  }, /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M11 22.334c0-.567.448-1.026 1-1.026h40c.552 0 1 .46 1 1.026s-.448 1.025-1 1.025H12c-.552 0-1-.459-1-1.025",
+    clipRule: "evenodd"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M17 16.18c-2.21 0-4 1.837-4 4.103v22.564c0 2.266 1.79 4.102 4 4.102h18.5l1.5 2.052H17c-3.314 0-6-2.755-6-6.154V20.283c0-3.399 2.686-6.154 6-6.154h2.5l1 2.051h3l1-2.051h15l1 2.051h3l1-2.051H47c3.314 0 6 2.755 6 6.154V36h-2V20.283c0-2.266-1.79-4.103-4-4.103z"
+  }), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M28 38a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-4a2 2 0 0 1-2-2zm6 0h-4v2h4z",
+    clipRule: "evenodd"
+  })), /*#__PURE__*/React.createElement("g", {
+    fill: "#521094",
+    className: "fill"
+  }, /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M22 11.051c-.552 0-1 .46-1 1.026v4.103c0 .566.448 1.025 1 1.025s1-.46 1-1.025v-4.103c0-.566-.448-1.026-1-1.026M22 9c1.657 0 3 1.378 3 3.077v4.103c0 1.699-1.343 3.076-3 3.076s-3-1.377-3-3.076v-4.103C19 10.377 20.343 9 22 9m20 2.051c-.552 0-1 .46-1 1.026v4.103c0 .566.448 1.025 1 1.025s1-.46 1-1.025v-4.103c0-.566-.448-1.026-1-1.026M42 9c1.657 0 3 1.378 3 3.077v4.103c0 1.699-1.343 3.076-3 3.076s-3-1.377-3-3.076v-4.103C39 10.377 40.343 9 42 9M18 30a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-4a2 2 0 0 1-2-2zm6 0h-4v2h4zm4 0a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-4a2 2 0 0 1-2-2zm6 0h-4v2h4zm4 0a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-4a2 2 0 0 1-2-2zm6 0h-4v2h4zm-26 8a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-4a2 2 0 0 1-2-2zm6 0h-4v2h4zm29.856-2.708a1 1 0 0 1 .294.708v9.572l2.857.018a1 1 0 0 1 .713 1.694l-11 11.41a1 1 0 0 1-1.44 0l-11-11.436a1 1 0 0 1 .727-1.693l2.843.019v-9.559a1 1 0 0 1 .998-1l14.3-.025a1 1 0 0 1 .708.292M39.85 37.023v9.567a1 1 0 0 1-1.007 1l-1.479-.01 8.637 8.978 8.66-8.983-1.517-.01a1 1 0 0 1-.994-1v-9.563z",
+    clipRule: "evenodd"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "m43.628 50.143-.836-.671 5.918-7.315.836.671zm4.642-.033q-.836 0-1.309-.44-.473-.45-.473-1.221v-.077q0-.78.473-1.221.473-.45 1.309-.451.814 0 1.298.451.484.44.484 1.221v.077q0 .77-.473 1.221-.473.44-1.309.44m0-.902q.32 0 .495-.198a.72.72 0 0 0 .187-.517v-.176a.72.72 0 0 0-.187-.517q-.175-.198-.495-.198a.66.66 0 0 0-.506.198.75.75 0 0 0-.176.517v.176a.75.75 0 0 0 .176.517.66.66 0 0 0 .506.198M44.068 45.6q-.836 0-1.309-.44-.473-.45-.473-1.221v-.077q0-.78.473-1.221.473-.45 1.309-.451.814 0 1.298.451.484.44.484 1.221v.077q0 .77-.473 1.221-.473.44-1.309.44m0-.902q.32 0 .495-.198a.72.72 0 0 0 .187-.517v-.176a.72.72 0 0 0-.187-.517q-.175-.198-.495-.198a.66.66 0 0 0-.506.198.75.75 0 0 0-.176.517v.176a.75.75 0 0 0 .176.517.66.66 0 0 0 .506.198"
+  })))), _defs || (_defs = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "a",
+    className: "a"
+  }, /*#__PURE__*/React.createElement("path", {
+    fill: "#fff",
+    d: "M0 0h64v64H0z"
+  })))));
+};
+var Memo = /*#__PURE__*/memo(SvgSavingPlan);
+
+export { Memo as ReactComponent };

package/dist/index.d.ts

@@ -66,7 +66,7 @@ type CodeEditorProps = {
 };
 declare const CodeEditor: ({ title, value, onChange, extensions, onBlur, height, readOnly, }: CodeEditorProps) => _emotion_react_jsx_runtime.JSX.Element;
 
-declare const _default$1: {
+declare const _default: {
     readonly 'estimate.cost.description': "This summary provides a cost estimation based on your configuration, the amount of time you expect to use the resource for, and the scale of your expected usage. For the purposes of this calculation, we consider that 1 month equals to 730 hours.";
     readonly 'estimate.cost.label': "Estimated cost";
     readonly 'estimate.cost.beta.free': "Free During Beta";
@@ -145,6 +145,10 @@ type EstimateCostProps = {
      * Hide the total price at the bottom of the component.
      */
     hideTotal?: boolean;
+    /**
+     * Hide the hourly price in total section at the bottom of the component.
+     */
+    hideHourlyPriceOnTotal?: boolean;
     /**
      * Show a badge beta on the total price with how much discount is applied.
      */
@@ -182,7 +186,7 @@ type EstimateCostProps = {
     /**
      * Locales for the component. By default, it will use the english locales.
      */
-    locales?: typeof _default$1;
+    locales?: typeof _default;
     /**
      * Defines the currency to be shown in the component.
      * To find out all currencies checkout https://en.wikipedia.org/wiki/ISO_4217#List_of_ISO_4217_currency_codes section "Code" of the table.
@@ -419,14 +423,6 @@ type MessageProps = {
     align?: 'left' | 'right';
 };
 
-declare const _default: {
-    readonly 'navigation.pin.tooltip': "Pin product";
-    readonly 'navigation.unpin.tooltip': "Unpin product";
-    readonly 'navigation.pinned.item.group.label': "Pinned items";
-    readonly 'navigation.expand.button': "Expand sidebar";
-    readonly 'navigation.collapse.button': "Collapse sidebar";
-};
-
 type NavigationProps = {
     children: ReactNode;
     /**
@@ -436,48 +432,12 @@ type NavigationProps = {
      * some part of your logo
      */
     logo?: ReactNode | ((expanded: boolean) => ReactNode);
-    /**
-     * This enable / disable the pinned feature of the navigation
-     * Pinned allows the use to pin (or favorite) some items in the navigation
-     */
-    pinnedFeature?: boolean;
-    /**
-     * This define how many items can be pinned at the same time.
-     * If you want to disable the limit just set `Infinity` to this prop
-     */
-    pinLimit?: number;
-    /**
-     * The initial pinned items. This should be an array of labels you've set on
-     * your `<Navigation.Item>`
-     */
-    initialPinned?: string[];
-    /**
-     * The initial expanded state of the navigation. If set to true the
-     * navigation will be expanded by default otherwise it will be collapsed
-     */
-    initialExpanded?: boolean;
-    /**
-     * This function is triggered when the user click on the pin/unpin button
-     * of an item
-     */
-    onClickPinUnpin?: (pinned: string[]) => void;
-    locales?: typeof _default;
-    /**
-     * This function is triggered when user click on expand button on the footer
-     * of the navigation. This is not triggered when the user resize the navigation
-     * and it automatically collapse / expand.
-     */
-    onClickExpand?: (expanded: boolean) => void;
-    className?: string;
-    /**
-     * It defines the initial width of the navigation.
-     */
-    width?: number;
     /**
      * This function is called when resize occur using the vertical bar on the left of the navigation.
      */
     onWidthResize?: (width: number) => void;
     id?: string;
+    className?: string;
 };
 /**
  * Navigation is a component that allows you to create a sidebar navigation.
@@ -485,10 +445,15 @@ type NavigationProps = {
  * to make it work in your application.
  */
 declare const Navigation: {
-    ({ children, logo, pinnedFeature, onClickPinUnpin, onClickExpand, initialPinned, initialExpanded, locales, pinLimit, width, onWidthResize, className, id, }: NavigationProps): _emotion_react_jsx_runtime.JSX.Element;
+    ({ children, logo, onWidthResize, className, id, }: NavigationProps): _emotion_react_jsx_runtime.JSX.Element;
     Group: ({ children, label }: {
         children: ReactNode;
-        label: string;
+        label: string; /**
+         * The logo to be displayed in header of the navigation
+         * It can be a component or a function. The function will retrun you
+         * expanded state of the navigation so you can decide to show/hide
+         * some part of your logo
+         */
     }) => _emotion_react_jsx_runtime.JSX.Element | null;
     Item: ({ children, categoryIcon, categoryIconVariant, label, subLabel, badgeText, badgeSentiment, href, onClick, toggle, active, noPinButton, type, hasParents, as, disabled, noExpand, toggleMenu, }: {
         children?: ReactNode;
@@ -571,4 +536,4 @@ declare const SteppedListContainer: {
     }) => _emotion_react_jsx_runtime.JSX.Element;
 };
 
-export { CodeEditor, ContentCard, ContentCardGroup, Conversation, CustomerSatisfaction, EstimateCost, FAQ, Navigation, SteppedListContainer, _default$1 as estimateCostDefaultLocales };
+export { CodeEditor, ContentCard, ContentCardGroup, Conversation, CustomerSatisfaction, EstimateCost, FAQ, Navigation, SteppedListContainer, _default as estimateCostDefaultLocales };

package/dist/src/components/EstimateCost/EstimateCostContent.js

@@ -69,6 +69,7 @@ const EstimateCostContent = ({
   disableOverlayRight = false,
   hideTimeUnit = false,
   hideTotal = false,
+  hideHourlyPriceOnTotal = false,
   discount = 0,
   OverlayRight,
   OverlayLeft,
@@ -247,7 +248,7 @@ const EstimateCostContent = ({
                       maximumFractionDigits: isLongFractionDigits ? maximumFractionDigitsLong[iteration.unit] : maximumFractionDigits[iteration.unit]
                     })}` : null]
                   })
-                }), totalPrice.hourly > 0 && totalPrice.hourly !== totalPrice.total && totalPrice.total > 0 ? jsx(RightAlignedText, {
+                }), hideHourlyPriceOnTotal && totalPrice.hourly > 0 && totalPrice.hourly !== totalPrice.total && totalPrice.total > 0 ? jsx(RightAlignedText, {
                   as: "p",
                   variant: "body",
                   children: jsxs(LineThrough, {

package/dist/src/components/Navigation/Navigation.js

@@ -1,11 +1,8 @@
 import { NavigationContent } from './NavigationContent.js';
-import { NavigationProvider } from './NavigationProvider.js';
 import { Group } from './components/Group.js';
 import { Item } from './components/Item.js';
 import { PinnedItems } from './components/PinnedItems.js';
 import { Separator } from './components/Separator.js';
-import { NAVIGATION_WIDTH } from './constants.js';
-import NavigationLocales from './locales/en.js';
 import { jsx } from '@emotion/react/jsx-runtime';
 
 /**
@@ -16,33 +13,15 @@ import { jsx } from '@emotion/react/jsx-runtime';
 const Navigation = ({
   children,
   logo,
-  pinnedFeature = false,
-  onClickPinUnpin,
-  onClickExpand,
-  initialPinned,
-  initialExpanded = true,
-  locales = NavigationLocales,
-  pinLimit = 7,
-  width = NAVIGATION_WIDTH,
   onWidthResize,
   className,
   id
-}) => jsx(NavigationProvider, {
-  onClickPinUnpin: onClickPinUnpin,
-  pinnedFeature: pinnedFeature,
-  locales: locales,
-  initialPinned: initialPinned,
-  pinLimit: pinLimit,
-  initialExpanded: initialExpanded,
-  children: jsx(NavigationContent, {
-    onClickExpand: onClickExpand,
-    logo: logo,
-    className: className,
-    width: width,
-    onWidthResize: onWidthResize,
-    id: id,
-    children: children
-  })
+}) => jsx(NavigationContent, {
+  logo: logo,
+  className: className,
+  onWidthResize: onWidthResize,
+  id: id,
+  children: children
 });
 Navigation.Group = Group;
 Navigation.Item = Item;

package/dist/src/components/Navigation/NavigationContent.js

@@ -2,7 +2,7 @@ import _styled from '@emotion/styled/base';
 import { Tooltip, Button, Stack } from '@ultraviolet/ui';
 import { useRef, useCallback, useState, useEffect } from 'react';
 import { useNavigation } from './NavigationProvider.js';
-import { ANIMATION_DURATION, NAVIGATION_MAX_WIDTH, NAVIGATION_MIN_WIDTH, NAVIGATION_COLLASPED_WIDTH } from './constants.js';
+import { NAVIGATION_MAX_WIDTH, NAVIGATION_MIN_WIDTH, NAVIGATION_COLLASPED_WIDTH, ANIMATION_DURATION } from './constants.js';
 import { jsxs, jsx } from '@emotion/react/jsx-runtime';
 
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
@@ -67,14 +67,24 @@ const Slider = /*#__PURE__*/_styled("div", {
 const NavigationContent = ({
   children,
   logo,
-  onClickExpand,
-  width,
   onWidthResize,
   className,
   id
 }) => {
+  const context = useNavigation();
+  if (!context) {
+    throw new Error('Navigation should be inside NavigationProvider to use it properly.');
+  }
+  const {
+    setWidth,
+    width,
+    expanded,
+    toggleExpand,
+    animation,
+    locales,
+    navigationRef
+  } = context;
   const sliderRef = useRef(null);
-  const navigationRef = useRef(null);
   const contentRef = useRef(null);
   const isScrollAtBottom = useCallback(() => {
     if (contentRef.current) {
@@ -109,27 +119,6 @@ const NavigationContent = ({
   },
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [contentRef.current]);
-  const {
-    expanded,
-    setExpanded,
-    animation,
-    setAnimation,
-    locales
-  } = useNavigation();
-
-  // This function will be triggered when expand/collapse button is clicked
-  const toggleExpand = useCallback(() => {
-    onClickExpand?.(!expanded);
-    if (navigationRef.current) {
-      navigationRef.current.style.width = '';
-    }
-    setAnimation(expanded ? 'collapse' : 'expand');
-    setTimeout(() => {
-      setExpanded();
-      setFooterHasOverflowStyle(isScrollAtBottom());
-      setAnimation(false);
-    }, ANIMATION_DURATION);
-  }, [expanded, isScrollAtBottom, onClickExpand, setAnimation, setExpanded]);
 
   // It will handle the resize of the navigation when the user drag the vertical bar
   useEffect(() => {
@@ -168,6 +157,7 @@ const NavigationContent = ({
         if (navigationRef.current) {
           if (!shouldCollapseOnMouseUp && !shouldExpandOnMouseUp) {
             onWidthResize?.(navigationRef.current.offsetWidth);
+            setWidth?.(navigationRef.current.offsetWidth);
           }
           if (!expanded) {
             navigationRef.current.style.width = '';
@@ -186,7 +176,7 @@ const NavigationContent = ({
       // eslint-disable-next-line react-hooks/exhaustive-deps
       sliderRef.current?.removeEventListener('mousedown', mousedown);
     };
-  }, [expanded, onWidthResize, toggleExpand]);
+  }, [expanded, navigationRef, onWidthResize, setWidth, toggleExpand]);
   return jsxs(StyledNav, {
     className: className,
     id: id,
@@ -218,7 +208,7 @@ const NavigationContent = ({
               sentiment: "neutral",
               size: "small",
               icon: expanded ? 'arrow-left-double' : 'arrow-right-double',
-              onClick: toggleExpand
+              onClick: () => toggleExpand()
             })
           })
         })]

package/dist/src/components/Navigation/NavigationProvider.js

@@ -1,55 +1,27 @@
-import { useReducer, useState, useCallback, useMemo, createContext, useContext } from 'react';
+import { useContext, createContext } from 'react';
+import { NAVIGATION_WIDTH } from './constants.js';
 import NavigationLocales from './locales/en.js';
-import { jsx } from '@emotion/react/jsx-runtime';
+import '@emotion/react/jsx-runtime';
 
 const NavigationContext = /*#__PURE__*/createContext({
   expanded: true,
-  setExpanded: () => {},
+  /**
+   * This function will trigger the expand/collapse of the navigation and
+   * will also trigger the animation
+   */
+  toggleExpand: () => {},
   animation: false,
-  setAnimation: () => {},
   locales: NavigationLocales,
   pinItem: () => {},
   unpinItem: () => {},
   pinnedItems: [],
-  pinLimit: 7
+  pinLimit: 7,
+  navigationRef: {
+    current: null
+  },
+  width: NAVIGATION_WIDTH,
+  setWidth: () => {}
 });
 const useNavigation = () => useContext(NavigationContext);
-const NavigationProvider = ({
-  children,
-  pinnedFeature,
-  onClickPinUnpin,
-  initialPinned,
-  initialExpanded,
-  locales,
-  pinLimit
-}) => {
-  const [expanded, setExpanded] = useReducer(state => !state, initialExpanded);
-  const [pinnedItems, setPinnedItems] = useState(initialPinned ?? []);
-  const [animation, setAnimation] = useState(false);
-  const pinItem = useCallback(item => {
-    setPinnedItems([...pinnedItems, item]);
-    onClickPinUnpin?.(pinnedItems);
-  }, [onClickPinUnpin, pinnedItems]);
-  const unpinItem = useCallback(item => {
-    setPinnedItems(pinnedItems.filter(localItem => localItem !== item));
-    onClickPinUnpin?.(pinnedItems);
-  }, [onClickPinUnpin, pinnedItems]);
-  const value = useMemo(() => ({
-    expanded,
-    setExpanded,
-    pinnedItems,
-    pinItem,
-    unpinItem,
-    pinnedFeature,
-    locales,
-    pinLimit,
-    animation,
-    setAnimation
-  }), [expanded, pinnedItems, pinItem, unpinItem, pinnedFeature, locales, pinLimit, animation]);
-  return jsx(NavigationContext.Provider, {
-    value: value,
-    children: children
-  });
-};
 
-export { NavigationContext, NavigationProvider, useNavigation };
+export { NavigationContext, useNavigation };

package/dist/src/components/Navigation/components/Group.js

@@ -26,7 +26,7 @@ const Group = ({
 }) => {
   const context = useNavigation();
   if (!context) {
-    throw new Error('Navigation.Group can only be used inside a Navigation');
+    throw new Error('Navigation.Group can only be used inside a NavigationProvider.');
   }
   const {
     expanded,

package/dist/src/components/Navigation/components/Item.js

@@ -134,7 +134,7 @@ const Item = ({
 }) => {
   const context = useNavigation();
   if (!context) {
-    throw new Error('Navigation.Item can only be used inside a Navigation');
+    throw new Error('Navigation.Item can only be used inside a NavigationProvider.');
   }
   const {
     expanded,
@@ -251,7 +251,7 @@ const Item = ({
               as: "span",
               variant: "bodySmallStrong",
               sentiment: active ? 'primary' : 'neutral',
-              prominence: (categoryIcon || !hasParents) && !active ? 'strong' : 'weak',
+              prominence: (categoryIcon || !hasParents) && !active ? 'strong' : 'default',
               animation: animation,
               disabled: disabled,
               children: label
@@ -296,7 +296,7 @@ const Item = ({
           }) : null, hasHrefAndNoChildren ? jsx(AnimatedIcon, {
             name: "open-in-new",
             sentiment: "neutral",
-            prominence: "weak",
+            prominence: "default",
             disabled: disabled
           }) : null, children ? jsxs(Stack, {
             gap: 1,

package/dist/src/components/Navigation/components/PinnedItems.js

@@ -5,7 +5,7 @@ import { jsx } from '@emotion/react/jsx-runtime';
 const PinnedItems = () => {
   const context = useNavigation();
   if (!context) {
-    throw new Error('Navigation.PinnedItems can only be used inside a Navigation');
+    throw new Error('Navigation.PinnedItems can only be used inside a NavigationProvider.');
   }
   const {
     locales,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/plus",
-  "version": "0.13.1",
+  "version": "0.14.0",
   "description": "Ultraviolet Plus",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {
@@ -43,12 +43,12 @@
     "@emotion/babel-plugin": "11.11.0",
     "@emotion/react": "11.11.4",
     "@emotion/styled": "11.11.5",
-    "@types/react": "18.2.78",
+    "@types/react": "18.2.79",
     "@types/react-dom": "18.2.25",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "@ultraviolet/icons": "2.12.4",
-    "@ultraviolet/illustrations": "1.7.0"
+    "@ultraviolet/icons": "2.12.5",
+    "@ultraviolet/illustrations": "1.7.1"
   },
   "dependencies": {
     "@uiw/codemirror-extensions-langs": "4.21.25",
@@ -56,7 +56,7 @@
     "@uiw/react-codemirror": "4.21.25",
     "react-intersection-observer": "9.8.2",
     "@ultraviolet/themes": "1.10.0",
-    "@ultraviolet/ui": "1.47.1"
+    "@ultraviolet/ui": "1.48.0"
   },
   "scripts": {
     "build": "rollup -c ../../rollup.config.mjs",