npm - @ptsecurity/mosaic - Versions diffs - 13.3.1 → 13.4.0 - Mend

@ptsecurity/mosaic 13.3.1 → 13.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (301) hide show

package/design-tokens/legacy-2017/tokens/components/icon.json5 ADDED Viewed

@@ -0,0 +1,104 @@
+{
+    icon: {
+        'light-color-scheme': {
+            secondary: {
+                default: { value: '{light-color-scheme.second.palette.value.400}' },
+                states: {
+                    hover: { value: '{light-color-scheme.second.palette.value.700}' },
+                    active: { value: '{light-color-scheme.second.palette.value.800}' },
+                    disabled: { value: 'mix({icon.light-color-scheme.secondary.default}, transparent, 30%)' }
+                },
+            },
+            primary: {
+                default: { value: '{light-color-scheme.primary.palette.value.400}' },
+                states: {
+                    hover: { value: '{light-color-scheme.primary.palette.value.700}' },
+                    active: { value: '{light-color-scheme.primary.palette.value.800}' },
+                    disabled: { value: 'mix({icon.light-color-scheme.primary.default}, transparent, 30%)' }
+                },
+            },
+            info: {
+                default: { value: '{light-color-scheme.info.palette.value.400}' },
+                states: {
+                    hover: { value: '{light-color-scheme.info.palette.value.700}' },
+                    active: { value: '{light-color-scheme.info.palette.value.800}' },
+                    disabled: { value: 'mix({icon.light-color-scheme.info.default}, transparent, 30%)' }
+                },
+            },
+            success: {
+                default: { value: '{light-color-scheme.success.palette.value.400}' },
+                states: {
+                    hover: { value: '{light-color-scheme.success.palette.value.700}' },
+                    active: { value: '{light-color-scheme.success.palette.value.800}' },
+                    disabled: { value: 'mix({icon.light-color-scheme.success.default}, transparent, 30%)' }
+                },
+            },
+            warning: {
+                default: { value: '{light-color-scheme.warning.palette.value.400}' },
+                states: {
+                    hover: { value: '{light-color-scheme.warning.palette.value.700}' },
+                    active: { value: '{light-color-scheme.warning.palette.value.800}' },
+                    disabled: { value: 'mix({icon.light-color-scheme.warning.default}, transparent, 30%)' }
+                },
+            },
+            error: {
+                default: { value: '{light-color-scheme.error.palette.value.400}' },
+                states: {
+                    hover: { value: '{light-color-scheme.error.palette.value.700}' },
+                    active: { value: '{light-color-scheme.error.palette.value.800}' },
+                    disabled: { value: 'mix({icon.light-color-scheme.error.default}, transparent, 30%)' }
+                }
+            },
+        },
+        'dark-color-scheme': {
+            secondary: {
+                default: { value: '{dark-color-scheme.second.palette.value.500}' },
+                states: {
+                    hover: { value: '{dark-color-scheme.second.palette.value.600}' },
+                    active: { value: '{dark-color-scheme.second.palette.value.700}' },
+                    disabled: { value: 'mix({icon.dark-color-scheme.secondary.default}, transparent, 30%)' }
+                },
+            },
+            primary: {
+                default: { value: '{dark-color-scheme.primary.palette.value.500}' },
+                states: {
+                    hover: { value: '{dark-color-scheme.primary.palette.value.600}' },
+                    active: { value: '{dark-color-scheme.primary.palette.value.700}' },
+                    disabled: { value: 'mix({icon.dark-color-scheme.primary.default}, transparent, 30%)' }
+                },
+            },
+            info: {
+                default: { value: '{dark-color-scheme.info.palette.value.500}' },
+                states: {
+                    hover: { value: '{dark-color-scheme.info.palette.value.600}' },
+                    active: { value: '{dark-color-scheme.info.palette.value.700}' },
+                    disabled: { value: 'mix({icon.dark-color-scheme.info.default}, transparent, 30%)' }
+                },
+            },
+            success: {
+                default: { value: '{dark-color-scheme.success.palette.value.500}' },
+                states: {
+                    hover: { value: '{dark-color-scheme.success.palette.value.600}' },
+                    active: { value: '{dark-color-scheme.success.palette.value.700}' },
+                    disabled: { value: 'mix({icon.dark-color-scheme.success.default}, transparent, 30%)' }
+                },
+            },
+            warning: {
+                default: { value: '{dark-color-scheme.warning.palette.value.500}' },
+                states: {
+                    hover: { value: '{dark-color-scheme.warning.palette.value.600}' },
+                    active: { value: '{dark-color-scheme.warning.palette.value.700}' },
+                    disabled: { value: 'mix({icon.dark-color-scheme.warning.default}, transparent, 30%)' }
+                },
+            },
+            error: {
+                default: { value: '{dark-color-scheme.error.palette.value.500}' },
+                states: {
+                    hover: { value: '{dark-color-scheme.error.palette.value.600}' },
+                    active: { value: '{dark-color-scheme.error.palette.value.700}' },
+                    disabled: { value: 'mix({icon.dark-color-scheme.error.default}, transparent, 30%)' }
+                }
+            }
+        }
+    }
+}

package/design-tokens/legacy-2017/tokens/components/input.json5 CHANGED Viewed

@@ -1,7 +1,7 @@
 {
     input: {
         size: {
-            padding: { value: '0 {padding.control-horizontal}' },
+            padding: { value: '0 {size.m}' },
             width: { value: '100%' }
         },
         font: {

package/design-tokens/legacy-2017/tokens/components/modal.json5 CHANGED Viewed

@@ -30,9 +30,9 @@
             large: { value: '960px' },
             top: { value: '48px' },
-            'close-width': { value: '56px' },
-            'border-radius': { value: '4px' },
-            'border-width': { value: '1px' }
+            'close-width': { value: '{modal-header.size.height}' },
+            'border-radius': { value: '{size.border-radius}' },
+            'border-width': { value: '{size.border-width}' }
         }
     },
     'modal-header': {
@@ -43,9 +43,9 @@
             border: { value: '{dark-color-scheme.foreground.divider}' }
         },
         size: {
-            'border-radius': { value: '4px 4px 0 0' },
+            'border-radius': { value: '{size.border-radius} {size.border-radius} 0 0' },
             height: { value: '{size.6xl}' },
-            padding: { value: '0 16px' }
+            padding: { value: '0 {size.l}' }
         },
         font: {
             default: { value: 'title' }
@@ -54,7 +54,7 @@
     'modal-body': {
         size: {
             'max-height': { value: 'calc(100vh - 260px)' },
-            padding: { value: '16px 24px 24px' }
+            padding: { value: '{size.l} {size.xxl} {size.xxl}' }
         },
         font: {
             default: { value: 'body' }
@@ -68,14 +68,14 @@
             border: { value: '{dark-color-scheme.foreground.divider}' }
         },
         size: {
-            'border-radius': { value: '0 0 4px 4px' },
+            'border-radius': { value: '0 0 {size.border-radius} {size.border-radius}' },
             height: { value: '{size.7xl}' },
             padding: { value: '0 {size.l}' }
         }
     },
     'modal-confirm': {
         size: {
-            padding: { value: '24px' }
+            padding: { value: '{size.xxl}' }
         }
     }
 }

package/design-tokens/legacy-2017/tokens/components/navbar.json5 CHANGED Viewed

@@ -11,7 +11,7 @@
             'divider-background': { value: 'rgba(255, 255, 255, 0.3)' }
         },
         size: {
-            'icon-margin': { value: '6px' },
+            'icon-margin': { value: '{size.xs}' },
             'right-icon-margin': { value: '{size.3xs}' }
         },
         font: {
@@ -22,9 +22,9 @@
         size: {
             states: {
                 'expanded-width': { value: '240px' },
-                'collapsed-width': { value: '56px' }
+                'collapsed-width': { value: '{size.6xl}' }
             },
-            'icon-margin': { value: '16px' }
+            'icon-margin': { value: '{size.l}' }
         }
     },
     'navbar-item': {
@@ -53,15 +53,15 @@
             }
         },
         size: {
-            padding: { value: '{padding.control-horizontal}' },
-            height: { value: '48px' },
-            height_vertical: { value: '56px' }
+            padding: { value: '{size.l}' },
+            height: { value: '{size.5xl}' },
+            height_vertical: { value: '{size.6xl}' }
         }
     },
     'navbar-brand': {
         size: {
-            padding: { value: '12px' },
-            'margin-right': { value: '24px' }
+            padding: { value: '{size.m}' },
+            'margin-right': { value: '{size.xxl}' }
         },
         font: {
             title: { value: 'title' }

package/design-tokens/legacy-2017/tokens/components/option.json5 CHANGED Viewed

@@ -1,8 +1,8 @@
 {
     option: {
         size: {
-            'horizontal-padding': { value: '{padding.option-horizontal}' },
-            height: { value: '32px' },
+            'horizontal-padding': { value: '{size.m}' },
+            height: { value: '{size.3xl}' },
             'border-width': { value: '2px' }
         },
         font: {

package/design-tokens/legacy-2017/tokens/components/popover.json5 CHANGED Viewed

@@ -14,8 +14,8 @@
         },
         size: {
             'max-height': { value: '480px' },
-            padding: { value: '16px' },
-            'border-radius': { value: '3px' },
+            padding: { value: '{size.l}' },
+            'border-radius': { value: '{size.border-radius}' },
             'arrow-size': { value: '12px' },
             'trigger-margin': { value: '9px' },
@@ -41,7 +41,7 @@
         },
         size: {
             height: { value: '{size.4xl}' },
-            padding: { value: '0 16px' }
+            padding: { value: '0 {size.l}' }
         },
         font: {
             default: { value: 'subheading' }
@@ -57,9 +57,9 @@
             background: { value: '{popup.dark-color-scheme.footer-background}' }
         },
         size: {
-            'margin-top': { value: '8px' },
-            padding: { value: '12px {padding.headerFooter-horizontal}' },
-            'height': { value: '56px' }
+            'margin-top': { value: '{size.s}' },
+            padding: { value: '{size.m} {size.l}' },
+            'height': { value: '{size.6xl}' }
         },
         font: {
             default: { value: 'body' }

package/design-tokens/legacy-2017/tokens/components/progress-bar.json5 CHANGED Viewed

@@ -7,7 +7,7 @@
             background: { value: '{dark-color-scheme.second.palette.value.600}' }
         },
         size: {
-            height: { value: '4px' }
+            height: { value: '{size.xxs}' }
         }
     }
 }

package/design-tokens/legacy-2017/tokens/components/progress-spinner.json5 CHANGED Viewed

@@ -1,7 +1,7 @@
 {
     'progress-spinner': {
         size: {
-            size: { value: '16px' }
+            size: { value: '{size.l}' }
         }
     }
 }

package/design-tokens/legacy-2017/tokens/components/select.json5 CHANGED Viewed

@@ -1,9 +1,9 @@
 {
     select: {
         size: {
-            'left-padding': { value: '{padding.control-horizontal}' },
-            'right-padding': { value: '8px' },
-            'left-padding-multiple': { value: '8px' }
+            'left-padding': { value: '{size.m}' },
+            'right-padding': { value: '{size.xs}' },
+            'left-padding-multiple': { value: '{select.size.left-padding}' }
         },
         font: {
             default: { value: 'body' }
@@ -13,9 +13,9 @@
         size: {
             'max-height': { value: '232px' },
             'max-width': { value: '640px' },
-            'vertical-padding': { value: '4px' },
-            'border-width': { value: '1px' },
-            'border-radius': { value: '3px' }
+            'vertical-padding': { value: '{size.xxs}' },
+            'border-width': { value: '{size.border-width}' },
+            'border-radius': { value: '{size.border-radius}' }
         },
         font: {
             default: { value: 'body' }

package/design-tokens/legacy-2017/tokens/components/sidepanel.json5 CHANGED Viewed

@@ -14,7 +14,7 @@
         size: {
             height: { value: '{size.6xl}' },
             padding: { value: '0 {size.l}' },
-            'close-padding': { value: '0 0 0 8px' }
+            'close-padding': { value: '0 0 0 {size.s}' }
         },
         font: {
             default: { value: 'title' }

package/design-tokens/legacy-2017/tokens/components/table.json5 CHANGED Viewed

@@ -1,10 +1,10 @@
 {
     table: {
         size: {
-            'border-width': { value: '1px' },
+            'border-width': { value: '{size.border-width}' },
             'row-padding': {
-                vertical: { value: '8px' },
-                horizontal: { value: '16px' }
+                vertical: { value: '{size.s}' },
+                horizontal: { value: '{size.l}' }
             }
         },
         font: {

package/design-tokens/legacy-2017/tokens/components/tabs.json5 CHANGED Viewed

@@ -53,12 +53,12 @@
             }
         },
         size: {
-            height: { value: '40px' },
-            'highlight-height': { value: '4px' },
-            'padding-horizontal': { value: '16px' },
-            'border-width': { value: '1px' },
-            'border-radius': { value: '3px' },
-            'label-icon-margin': { value: '{margin.iconText_M-horizontal}' }
+            height: { value: '{size.4xl}' },
+            'highlight-height': { value: '{size.xxs}' },
+            'padding-horizontal': { value: '{size.l}' },
+            'border-width': { value: '{size.border-width}' },
+            'border-radius': { value: '{size.border-radius}' },
+            'label-icon-margin': { value: '{size.s}' }
         },
         font: {
             default: { value: 'body' }

package/design-tokens/legacy-2017/tokens/components/tags.json5 CHANGED Viewed

@@ -101,12 +101,12 @@
             }
         },
         size: {
-            margin: { value: '2px' },
-            height: { value: '{size.badge_tag-height}' },
-            'border-width': { value: '1px' },
-            'border-radius': { value: '4px' },
+            margin: { value: '{size.3xs}' },
+            height: { value: '{size.xxl}' },
+            'border-width': { value: '{size.border-width}' },
+            'border-radius': { value: '{size.border-radius}' },
             'icon-padding': { value: '{size.xxs}' },
-            'text-margin': { value: '{padding.badge_tag-horizontal}' }
+            'text-margin': { value: '{size.s}' }
         },
         font: {
             default: { value: 'caption' },
@@ -116,13 +116,13 @@
     },
     'tag-list': {
         size: {
-            padding: { value: '1px 6px' },
+            padding: { value: '1px {size.m}' },
         }
     },
     'tag-input': {
         size: {
             height: { value: '22px' },
-            margin: { value: '2px 4px' }
+            margin: { value: '2px {size.xxs}' }
         },
         font: {
             default: { value: 'body' }

package/design-tokens/legacy-2017/tokens/components/textarea.json5 CHANGED Viewed

@@ -2,7 +2,7 @@
     textarea: {
         size: {
             'min-height': { value: '50px' },
-            padding: { value: '5px 16px' }
+            padding: { value: '5 {size.m}' }
         },
         font: {
             default: { value: 'body' },

package/design-tokens/legacy-2017/tokens/components/timepicker.json5 CHANGED Viewed

@@ -1,7 +1,7 @@
 {
     'timepicker': {
         size: {
-            'padding-right': { value: '16px' }
+            'padding-right': { value: '{size.l}' }
         }
     }
 }

package/design-tokens/legacy-2017/tokens/components/toggle.json5 CHANGED Viewed

@@ -60,7 +60,7 @@
             height: { value: '16px' },
             width: { value: '28px' },
             'border-radius': { value: '9px' },
-            'label-margin': { value: '{margin.iconText_M-horizontal}' }
+            'label-margin': { value: '{size.s}' }
         },
         font: {
             default: { value: 'body' }

package/design-tokens/legacy-2017/tokens/components/tooltip.json5 CHANGED Viewed

@@ -26,9 +26,9 @@
         },
         size: {
             'max-width': { value: '300px' },
-            'border-width': { value: '1px' },
-            'border-radius': { value: '3px' },
-            padding: { value: '8px 16px' },
+            'border-width': { value: '{size.border-width}' },
+            'border-radius': { value: '{size.border-radius}' },
+            padding: { value: '{size.s} {size.l}' },
             'arrow-size': { value: '12px' },
             'trigger-margin': { value: '9px' }
         },
@@ -50,10 +50,10 @@
             shadow: { value: '0 2px 4px 0 rgba(0, 0, 0, 0.2)' }
         },
         size: {
-            'border-radius': { value: '3px' },
+            'border-radius': { value: '{size.border-radius}' },
             'arrow-size': { value: '12px' },
             'trigger-margin': { value: '9px' },
-            padding: { value: '8px 16px' },
+            padding: { value: '{size.s} {size.l}' },
             'max-height': { value: '480px' }
         },
         font: {
@@ -73,7 +73,7 @@
         },
         size: {
             height: { value: '40px' },
-            padding: { value: '10px 16px' }
+            padding: { value: '{size.s} {size.l}' }
         },
         font: {
             default: { value: 'subheading' }

package/design-tokens/legacy-2017/tokens/components/tree.json5 CHANGED Viewed

@@ -1,7 +1,7 @@
 {
     tree: {
         size: {
-            'node-height': { value: '32px' },
+            'node-height': { value: '{size.3xl}' },
             'padding-left': { value: '{size.m}' },
             'toggle-padding': { value: '{size.xxs}' },

package/design-tokens/legacy-2017/tokens/properties/colors.json5 CHANGED Viewed

@@ -43,6 +43,8 @@
         background: {
             background: { value: 'white' },
             'background-disabled': { value: '{palette.grey.60}' },
+            'background-less-contrast': { value: '{palette.grey.60}' },
+            'background-under': { value: '{palette.grey.60}' },
             'overlay-hover': { value: 'rgba(black, 0.05)' },
             'overlay-active': { value: 'rgba(black, 0.1)' },
@@ -99,6 +101,8 @@
         background: {
             background: { value: '{palette.grey.800}' },
             'background-disabled': { value: '{palette.grey.600}' },
+            'background-less-contrast': { value: '{palette.grey.600}' },
+            'background-under': { value: 'darken({dark-color-scheme.background.background}, 5%)' },
             'overlay-hover': { value: 'rgba(black, 0.05)' },
             'overlay-active': { value: 'rgba(black, 0.1)' },

package/design-tokens/legacy-2017/tokens/properties/globals.json5 CHANGED Viewed

@@ -15,7 +15,7 @@
         '7xl': { value: '64px' },
         'border-width': '1px',
-        'border-radius': '3px',
+        'border-radius': '4px',
         // this will be deleted
         'option-height': '32px',