@sberbusiness/triplex-next 0.29.0 → 0.31.0

package/components/DesignTokens/DesignTokensComponentsThemeDark.js

@@ -10,50 +10,52 @@ import { Calendar_Tokens as p } from "./components/Calendar.js";
 import { Card_Tokens as T } from "./components/Card.js";
 import { Checkbox_Tokens as a } from "./components/Checkbox.js";
 import { Chip_Tokens as k } from "./components/Chip.js";
-import { Dropdown_Tokens as D } from "./components/Dropdown.js";
+import { CollapsibleTree_Tokens as D } from "./components/CollapsibleTree.js";
+import { Dropdown_Tokens as l } from "./components/Dropdown.js";
 import { DropdownList_Tokens as A } from "./components/DropdownList.js";
 import { DropdownMobile_Tokens as f } from "./components/DropdownMobile.js";
-import { DropdownMobileList_Tokens as l } from "./components/DropdownMobileList.js";
-import { FooterPage_Tokens as R } from "./components/FooterPage.js";
-import { FormField_Tokens as K } from "./components/FormField.js";
-import { HeaderPage_Tokens as _ } from "./components/HeaderPage.js";
-import { Island_Tokens as d } from "./components/Island.js";
+import { DropdownMobileList_Tokens as R } from "./components/DropdownMobileList.js";
+import { FooterPage_Tokens as K } from "./components/FooterPage.js";
+import { FormField_Tokens as _ } from "./components/FormField.js";
+import { HeaderPage_Tokens as d } from "./components/HeaderPage.js";
+import { Island_Tokens as g } from "./components/Island.js";
 import { IslandAccordion_Tokens as S } from "./components/IslandAccordion.js";
-import { IslandWidget_Tokens as g } from "./components/IslandWidget.js";
-import { LightBox_Tokens as L } from "./components/LightBox.js";
-import { Link_Tokens as c } from "./components/Link.js";
-import { ListItem_Tokens as C } from "./components/ListItem.js";
-import { ListItemControlsButton_Tokens as M } from "./components/ListItemControlsButton.js";
+import { IslandWidget_Tokens as C } from "./components/IslandWidget.js";
+import { ImageGallery_Tokens as L } from "./components/ImageGallery.js";
+import { LightBox_Tokens as c } from "./components/LightBox.js";
+import { Link_Tokens as M } from "./components/Link.js";
+import { ListItem_Tokens as b } from "./components/ListItem.js";
+import { ListItemControlsButton_Tokens as I } from "./components/ListItemControlsButton.js";
 import { ListMaster_Tokens as u } from "./components/ListMaster.js";
-import { Loader_Tokens as b } from "./components/Loader.js";
-import { LoaderScreen_Tokens as I } from "./components/LoaderScreen.js";
-import { Marker_Tokens as h } from "./components/Marker.js";
-import { MarkerStatus_Tokens as B } from "./components/MarkerStatus.js";
-import { ModalWindow_Tokens as w } from "./components/ModalWindow.js";
-import { MultiselectField_Tokens as F } from "./components/MultiselectField.js";
-import { Notification_Tokens as x } from "./components/Notification.js";
-import { Overlay_Tokens as y } from "./components/Overlay.js";
-import { Pagination_Tokens as v } from "./components/Pagination.js";
-import { Radio_Tokens as P } from "./components/Radio.js";
-import { SegmentedControl_Tokens as O } from "./components/SegmentedControl.js";
-import { SegmentedControlSegment_Tokens as W } from "./components/SegmentedControlSegment.js";
-import { Skeleton_Tokens as N } from "./components/Skeleton.js";
-import { Slider_Tokens as H } from "./components/Slider.js";
-import { SmallInput_Tokens as U } from "./components/SmallInput.js";
-import { SMSField_Tokens as Z } from "./components/SMSField.js";
-import { StatusTracker_Tokens as E } from "./components/StatusTracker.js";
-import { Step_Tokens as G } from "./components/Step.js";
-import { Stepper_Tokens as V } from "./components/Stepper.js";
-import { TableBasic_Tokens as j } from "./components/TableBasic.js";
-import { Tabs_Tokens as q } from "./components/Tabs.js";
-import { TabsLine_Tokens as z } from "./components/TabsLine.js";
-import { Tag_Tokens as J } from "./components/Tag.js";
-import { TagColor_Tokens as Q } from "./components/TagColor.js";
-import { Tooltip_Tokens as X } from "./components/Tooltip.js";
-import { TopOverlay_Tokens as Y } from "./components/TopOverlay.js";
-import { Typography_Tokens as $ } from "./components/Typography.js";
-import { UploadZone_Tokens as oo } from "./components/UploadZone.js";
-const tr = {
+import { Loader_Tokens as h } from "./components/Loader.js";
+import { LoaderScreen_Tokens as y } from "./components/LoaderScreen.js";
+import { Marker_Tokens as B } from "./components/Marker.js";
+import { MarkerStatus_Tokens as w } from "./components/MarkerStatus.js";
+import { ModalWindow_Tokens as F } from "./components/ModalWindow.js";
+import { MultiselectField_Tokens as x } from "./components/MultiselectField.js";
+import { Notification_Tokens as v } from "./components/Notification.js";
+import { Overlay_Tokens as P } from "./components/Overlay.js";
+import { Pagination_Tokens as O } from "./components/Pagination.js";
+import { Radio_Tokens as W } from "./components/Radio.js";
+import { SegmentedControl_Tokens as G } from "./components/SegmentedControl.js";
+import { SegmentedControlSegment_Tokens as N } from "./components/SegmentedControlSegment.js";
+import { Skeleton_Tokens as H } from "./components/Skeleton.js";
+import { Slider_Tokens as U } from "./components/Slider.js";
+import { SmallInput_Tokens as Z } from "./components/SmallInput.js";
+import { SMSField_Tokens as E } from "./components/SMSField.js";
+import { StatusTracker_Tokens as V } from "./components/StatusTracker.js";
+import { Step_Tokens as j } from "./components/Step.js";
+import { Stepper_Tokens as q } from "./components/Stepper.js";
+import { TableBasic_Tokens as z } from "./components/TableBasic.js";
+import { Tabs_Tokens as J } from "./components/Tabs.js";
+import { TabsLine_Tokens as Q } from "./components/TabsLine.js";
+import { Tag_Tokens as X } from "./components/Tag.js";
+import { TagColor_Tokens as Y } from "./components/TagColor.js";
+import { Tooltip_Tokens as $ } from "./components/Tooltip.js";
+import { TopOverlay_Tokens as oo } from "./components/TopOverlay.js";
+import { Typography_Tokens as ro } from "./components/Typography.js";
+import { UploadZone_Tokens as eo } from "./components/UploadZone.js";
+const sr = {
   AlertContext: r(
     o.DARK,
     t
@@ -69,8 +71,12 @@ const tr = {
   Card: r(o.DARK, T),
   Checkbox: r(o.DARK, a),
   Chip: r(o.DARK, k),
+  CollapsibleTree: r(
+    o.DARK,
+    D
+  ),
   Divider: r(o.DARK, e),
-  Dropdown: r(o.DARK, D),
+  Dropdown: r(o.DARK, l),
   DropdownList: r(
     o.DARK,
     A
@@ -81,109 +87,113 @@ const tr = {
   ),
   DropdownMobileList: r(
     o.DARK,
-    l
+    R
   ),
   FooterPage: r(
     o.DARK,
-    R
+    K
   ),
-  FormField: r(o.DARK, K),
+  FormField: r(o.DARK, _),
   HeaderPage: r(
     o.DARK,
-    _
+    d
   ),
-  Island: r(o.DARK, d),
+  Island: r(o.DARK, g),
   IslandAccordion: r(
     o.DARK,
     S
   ),
   IslandWidget: r(
     o.DARK,
-    g
+    C
+  ),
+  ImageGallery: r(
+    o.DARK,
+    L
   ),
-  LightBox: r(o.DARK, L),
-  Link: r(o.DARK, c),
-  ListItem: r(o.DARK, C),
+  LightBox: r(o.DARK, c),
+  Link: r(o.DARK, M),
+  ListItem: r(o.DARK, b),
   ListItemControlsButton: r(
     o.DARK,
-    M
+    I
   ),
   ListMaster: r(
     o.DARK,
     u
   ),
-  Loader: r(o.DARK, b),
+  Loader: r(o.DARK, h),
   LoaderScreen: r(
     o.DARK,
-    I
+    y
   ),
-  Marker: r(o.DARK, h),
+  Marker: r(o.DARK, B),
   MarkerStatus: r(
     o.DARK,
-    B
+    w
   ),
   ModalWindow: r(
     o.DARK,
-    w
+    F
   ),
   MultiselectField: r(
     o.DARK,
-    F
+    x
   ),
   Notification: r(
     o.DARK,
-    x
+    v
   ),
-  Overlay: r(o.DARK, y),
+  Overlay: r(o.DARK, P),
   Pagination: r(
     o.DARK,
-    v
+    O
   ),
-  Radio: r(o.DARK, P),
+  Radio: r(o.DARK, W),
   SegmentedControl: r(
     o.DARK,
-    O
+    G
   ),
   SegmentedControlSegment: r(
     o.DARK,
-    W
+    N
   ),
-  Skeleton: r(o.DARK, N),
+  Skeleton: r(o.DARK, H),
   SmallInput: r(
     o.DARK,
-    U
+    Z
   ),
-  SMSField: r(o.DARK, Z),
-  Slider: r(o.DARK, H),
+  SMSField: r(o.DARK, E),
+  Slider: r(o.DARK, U),
   StatusTracker: r(
     o.DARK,
-    E
+    V
   ),
-  Step: r(o.DARK, G),
-  Stepper: r(o.DARK, V),
+  Step: r(o.DARK, j),
+  Stepper: r(o.DARK, q),
   TableBasic: r(
     o.DARK,
-    j
+    z
   ),
-  Tabs: r(o.DARK, q),
-  Tag: r(o.DARK, J),
-  TagColor: r(o.DARK, Q),
-  TabsLine: r(o.DARK, z),
-  Tooltip: r(o.DARK, X),
+  Tabs: r(o.DARK, J),
+  Tag: r(o.DARK, X),
+  TagColor: r(o.DARK, Y),
+  TabsLine: r(o.DARK, Q),
+  Tooltip: r(o.DARK, $),
   TopOverlay: r(
     o.DARK,
-    Y
+    oo
   ),
   Typography: r(
     o.DARK,
-    $
+    ro
   ),
   UploadZone: r(
     o.DARK,
-    oo
+    eo
   )
 };
 export {
-  tr as DesignTokensComponentsThemeDark
+  sr as DesignTokensComponentsThemeDark
 };
 //# sourceMappingURL=DesignTokensComponentsThemeDark.js.map

package/components/DesignTokens/components/Chip.js

@@ -1,8 +1,10 @@
 const e = [
   "Background_Active",
-  "Background_Default",
   "Background_Disabled",
-  "Background_Hover",
+  "Background_Type1_Default",
+  "Background_Type1_Hover",
+  "Background_Type2_Default",
+  "Background_Type2_Hover",
   "Background_Selected_Active",
   "Background_Selected_Default",
   "Background_Selected_Disabled",
@@ -19,12 +21,16 @@ const e = [
 ], r = {
   Background_Active: [{ ref: "ColorNeutral.40" }, { ref: "ColorDarkNeutral.100" }],
   // var(--triplex-next-Chip-Background_Active)
-  Background_Default: [{ ref: "ColorNeutral.90" }, { ref: "ColorDarkNeutral.80" }],
-  // var(--triplex-next-Chip-Background_Default)
   Background_Disabled: [{ ref: "ColorNeutral.90" }, { ref: "ColorDarkNeutral.80" }],
   // var(--triplex-next-Chip-Background_Disabled)
-  Background_Hover: [{ ref: "ColorNeutral.70" }, { ref: "ColorDarkNeutral.90" }],
-  // var(--triplex-next-Chip-Background_Hover)
+  Background_Type1_Default: [{ ref: "ColorNeutral.90" }, { ref: "ColorDarkNeutral.80" }],
+  // var(--triplex-next-Chip-Background_Type1_Default)
+  Background_Type1_Hover: [{ ref: "ColorNeutral.70" }, { ref: "ColorDarkNeutral.90" }],
+  // var(--triplex-next-Background_Type1_Hover)
+  Background_Type2_Default: [{ ref: "ColorNeutral.100" }, { ref: "ColorDarkNeutral.50" }],
+  // var(--triplex-next-Chip-Background_Type2_Default)
+  Background_Type2_Hover: [{ ref: "ColorNeutral.80" }, { ref: "ColorDarkNeutral.60" }],
+  // var(--triplex-next-Chip-Background_Type2_Hover)
   Background_Selected_Active: [{ ref: "ColorDarkNeutral.100" }, { ref: "ColorNeutral.40" }],
   // var(--triplex-next-Chip-Background_Selected_Active)
   Background_Selected_Default: [{ ref: "ColorDarkNeutral.70" }, { ref: "ColorNeutral.90" }],

package/components/DesignTokens/components/CollapsibleTree.js

@@ -0,0 +1,11 @@
+const e = ["Header_Background_Hover", "Header_Shadow_Focus"], o = {
+  Header_Background_Hover: [{ ref: "ColorNeutral.50" }, { ref: "ColorDarkNeutral.50" }],
+  // var(--triplex-next-CollapsibleTree-Header_Background_Hover)
+  Header_Shadow_Focus: [{ value: "0 0 0 1px #FFD169 inset" }, { value: "0 0 0 1px #FFD169 inset" }]
+  // var(--triplex-next-CollapsibleTree-Header_Shadow_Focus)
+};
+export {
+  o as CollapsibleTree_Tokens,
+  e as designTokensComponentsCollapsibleTreeKeys
+};
+//# sourceMappingURL=CollapsibleTree.js.map

package/components/DesignTokens/components/ImageGallery.js

@@ -0,0 +1,47 @@
+const r = [
+  "Arrow_Background_Default",
+  "Arrow_Background_Hover",
+  "Arrow_Background_Active",
+  "Arrow_Background_Disabled",
+  "Arrow_BorderColor_Default",
+  "Arrow_BorderColor_Hover",
+  "Arrow_BorderColor_Active",
+  "Arrow_BorderColor_Disabled",
+  "Dot_Background_Default",
+  "Dot_Background_Hover",
+  "Dot_Background_Active",
+  "Thumb_Mask_Background",
+  "Accent_Color"
+], o = {
+  Arrow_Background_Default: [{ ref: "ColorDarkNeutralAlpha.80" }, { ref: "ColorNeutralAlpha.70" }],
+  // var(--triplex-next-ImageGallery-Arrow_Background_Default)
+  Arrow_Background_Hover: [{ ref: "ColorDarkNeutralAlpha.60" }, { ref: "ColorNeutralAlpha.50" }],
+  // var(--triplex-next-ImageGallery-Arrow_Background_Hover)
+  Arrow_Background_Active: [{ ref: "ColorDarkNeutralAlpha.50" }, { ref: "ColorNeutralAlpha.40" }],
+  // var(--triplex-next-ImageGallery-Arrow_Background_Active)
+  Arrow_Background_Disabled: [{ ref: "ColorDarkNeutralAlpha.90" }, { ref: "ColorNeutralAlpha.90" }],
+  // var(--triplex-next-ImageGallery-Arrow_Background_Disabled)
+  Arrow_BorderColor_Default: [{ ref: "ColorDarkNeutralAlpha.90" }, { ref: "ColorNeutralAlpha.90" }],
+  // var(--triplex-next-ImageGallery-Arrow_BorderColor_Default)
+  Arrow_BorderColor_Hover: [{ ref: "ColorDarkNeutralAlpha.90" }, { ref: "ColorNeutralAlpha.90" }],
+  // var(--triplex-next-ImageGallery-Arrow_BorderColor_Hover)
+  Arrow_BorderColor_Active: [{ ref: "ColorDarkNeutralAlpha.90" }, { ref: "ColorNeutralAlpha.90" }],
+  // var(--triplex-next-ImageGallery-Arrow_BorderColor_Active)
+  Arrow_BorderColor_Disabled: [{ ref: "ColorDarkNeutralAlpha.90" }, { ref: "ColorNeutralAlpha.90" }],
+  // var(--triplex-next-ImageGallery-Arrow_BorderColor_Disabled)
+  Dot_Background_Default: [{ ref: "ColorDarkNeutralAlpha.80" }, { ref: "ColorNeutralAlpha.80" }],
+  // var(--triplex-next-ImageGallery-Dot_Background_Default)
+  Dot_Background_Hover: [{ ref: "ColorDarkNeutralAlpha.60" }, { ref: "ColorNeutralAlpha.60" }],
+  // var(--triplex-next-ImageGallery-Dot_Background_Hover)
+  Dot_Background_Active: [{ ref: "ColorDarkNeutralAlpha.30" }, { ref: "ColorNeutralAlpha.30" }],
+  // var(--triplex-next-ImageGallery-Dot_Background_Active)
+  Thumb_Mask_Background: [{ ref: "ColorDarkNeutralAlpha.80" }, { ref: "ColorDarkNeutralAlpha.80" }],
+  // var(--triplex-next-ImageGallery-Thumb_Mask_Background)
+  Accent_Color: [{ ref: "ColorBrand.50" }, { ref: "ColorBrand.60" }]
+  // var(--triplex-next-ImageGallery-Accent_Color)
+};
+export {
+  o as ImageGallery_Tokens,
+  r as designTokensComponentsImageGalleryKeys
+};
+//# sourceMappingURL=ImageGallery.js.map

package/components/DesignTokens/components/LightBox.js

@@ -1,7 +1,7 @@
 const o = ["Backdrop_Background", "Content_Background"], r = {
   Backdrop_Background: [{ ref: "ColorDarkNeutralAlpha.30" }, { ref: "ColorDarkNeutralAlpha.30" }],
   // var(--triplex-next-LightBox-Backdrop_Background)
-  Content_Background: [{ ref: "ColorNeutral.70" }, { ref: "ColorDarkNeutral.10" }]
+  Content_Background: [{ ref: "ColorNeutral.70" }, { ref: "ColorDarkNeutral.0" }]
   // var(--triplex-next-LightBox-Content_Background)
 };
 export {

package/components/DesignTokens/components/ListItem.js

@@ -2,19 +2,22 @@ const r = [
   "Background",
   "Background_Dragging",
   "Background_Selected",
+  "Background_Hover",
   "Shadow_Dragging"
-], e = {
+], o = {
   Background: [{ ref: "ColorNeutral.100" }, { ref: "ColorDarkNeutral.40" }],
   // var(--triplex-next-ListItem-Background)
-  Background_Dragging: [{ ref: "ColorNeutral.100" }, { ref: "ColorDarkNeutral.0" }],
+  Background_Dragging: [{ ref: "ColorNeutral.100" }, { ref: "ColorDarkNeutral.10" }],
   // var(--triplex-next-ListItem-Background_Dragging)
-  Background_Selected: [{ ref: "ColorNeutral.90" }, { ref: "ColorDarkNeutral.10" }],
+  Background_Selected: [{ ref: "ColorNeutral.90" }, { ref: "ColorDarkNeutral.60" }],
   // var(--triplex-next-ListItem-Background_Selected)
+  Background_Hover: [{ ref: "ColorNeutral.90" }, { ref: "ColorDarkNeutral.50" }],
+  // var(--triplex-next-ListItem-Background_Hover)
   Shadow_Dragging: [{ value: "0 2px 7px rgba(31, 31, 34, 0.25)" }, { value: "0 2px 7px rgba(0, 0, 0, 0.25)" }]
   // var(--triplex-next-ListItem-Shadow_Dragging)
 };
 export {
-  e as ListItem_Tokens,
+  o as ListItem_Tokens,
   r as designTokensComponentsListItemKeys
 };
 //# sourceMappingURL=ListItem.js.map

package/components/DesignTokens/components/TopOverlay.js

@@ -1,5 +1,5 @@
 const o = ["Background"], e = {
-  Background: [{ ref: "ColorDarkNeutralAlpha.50" }, { ref: "ColorNeutralAlpha.50" }]
+  Background: [{ value: "rgba(79,79,82,.15)" }, { value: "rgba(0,0,0,.45)" }]
   // var(--triplex-next-TopOverlay-Background)
 };
 export {