@coveord/plasma-mantine 55.3.2 → 55.3.4-next.0

package/dist/esm/styles/Stepper.module.css

@@ -1,69 +1,3 @@
-.step {
-    &[disabled] {
-        color: var(--mantine-color-gray-5);
-
-        & .mantine-Stepper-stepDescription {
-            color: var(--mantine-color-gray-5);
-        }
-
-        & .mantine-Stepper-stepIcon {
-            border-color: var(--mantine-color-gray-1);
-        }
-    }
-}
-
 .stepIcon {
     font-weight: 500;
-    background-color: var(--mantine-color-gray-1);
-    color: inherit;
-    border: rem(1) solid var(--mantine-color-gray-3);
-
-    &[data-progress] {
-        background-color: var(--mantine-color-white);
-        border-color: var(--step-color);
-    }
-
-    &[data-completed] {
-        background-color: var(--mantine-color-white);
-        border-color: var(--mantine-color-lime-6);
-        color: var(--mantine-color-lime-6);
-    }
-}
-
-.stepCompletedIcon {
-    color: var(--mantine-color-lime-6);
-    font-size: rem(16);
-}
-
-.stepDescription {
-    color: var(--mantine-color-gray-7);
-
-    &[data-size='xs'] {
-        font-size: var(--mantine-font-size-xs);
-    }
-
-    &[data-size='sm'] {
-        font-size: var(--mantine-font-size-sm);
-    }
-
-    &[data-size='md'] {
-        font-size: var(--mantine-font-size-md);
-    }
-
-    &[data-size='lg'] {
-        font-size: var(--mantine-font-size-lg);
-    }
-
-    &[data-size='xl'] {
-        font-size: var(--mantine-font-size-xl);
-    }
-}
-
-.separator {
-    height: rem(1);
-    background-color: var(--mantine-color-gray-3);
-}
-
-.verticalSeparator {
-    border-left: rem(1) solid var(--mantine-color-gray-3);
 }

package/dist/esm/styles/Tabs.module.css

@@ -1,9 +1,5 @@
 .root {
     &[data-variant='default'] {
-        @mixin light {
-            --tab-hover-color: var(--mantine-color-gray-1);
-        }
-
         --tabs-list-border-width: 1px;
 
         &[data-orientation='horizontal'] {

package/dist/esm/theme/PlasmaColors.d.ts

@@ -1,18 +1,22 @@
 import { MantineColorsTuple } from '@mantine/core';
 export declare const PlasmaColors: {
+    blue: MantineColorsTuple;
+    red: MantineColorsTuple;
     gray: MantineColorsTuple;
-    action: MantineColorsTuple;
+    dark: MantineColorsTuple;
+    teal: MantineColorsTuple;
+    yellow: MantineColorsTuple;
+    violet: MantineColorsTuple;
+    grape: MantineColorsTuple;
+    'cyan (Not used)': MantineColorsTuple;
+    orange: MantineColorsTuple;
+    indigo: MantineColorsTuple;
+    green: MantineColorsTuple;
     navy: MantineColorsTuple;
     info: MantineColorsTuple;
-    blue: MantineColorsTuple;
-    red: MantineColorsTuple;
     critical: MantineColorsTuple;
-    teal: MantineColorsTuple;
     new: MantineColorsTuple;
-    yellow: MantineColorsTuple;
     warning: MantineColorsTuple;
-    green: MantineColorsTuple;
-    indigo: MantineColorsTuple;
     lime: MantineColorsTuple;
     success: MantineColorsTuple;
     purple: MantineColorsTuple;

package/dist/esm/theme/PlasmaColors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PlasmaColors.d.ts","sourceRoot":"","sources":["../../../src/theme/PlasmaColors.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAsBjD,eAAO,MAAM,YAAY;;YAchB,kBAAkB;;;;;;;;;;;;;;;CAiB1B,CAAC"}
+{"version":3,"file":"PlasmaColors.d.ts","sourceRoot":"","sources":["../../../src/theme/PlasmaColors.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAsBjD,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;CA4JxB,CAAC"}

package/dist/esm/theme/PlasmaColors.js

@@ -18,32 +18,157 @@ const lime = [
 ];
 export const PlasmaColors = {
     // Primary
-    gray: toMantineColor(color.primary.gray),
-    action: [
-        color.primary.action[1],
-        color.primary.action[1],
-        color.primary.action[2],
-        color.primary.action[3],
-        color.primary.action[4],
-        color.primary.action[6],
-        color.primary.action[6],
-        color.primary.action[8],
-        color.primary.action[8],
-        color.primary.action[9]
-    ],
+    blue: toMantineColor({
+        'blue-0': '#f8f9ff',
+        'blue-1': '#eef2ff',
+        'blue-2': '#d5defe',
+        'blue-3': '#a6bcfe',
+        'blue-4': '#6e99fd',
+        'blue-5': '#1169da',
+        'blue-6': '#063c82',
+        'blue-7': '#03275a',
+        'blue-8': '#01193f',
+        'blue-9': '#010e29'
+    }),
+    red: toMantineColor({
+        'red-0': '#fff8f8',
+        'red-1': '#feefee',
+        'red-2': '#fdd5d5',
+        'red-3': '#fca7a5',
+        'red-4': '#fb6f6c',
+        'red-5': '#d2271b',
+        'red-6': '#7e0f17',
+        'red-7': '#58050f',
+        'red-8': '#3e020a',
+        'red-9': '#280104'
+    }),
+    gray: toMantineColor({
+        'gray-0': '#f9f9fa',
+        'gray-1': '#f1f2f4',
+        'gray-2': '#dddfe3',
+        'gray-3': '#b9bdc7',
+        'gray-4': '#959cab',
+        'gray-5': '#676d7a',
+        'gray-6': '#3b3e46',
+        'gray-7': '#26292f',
+        'gray-8': '#191b1f',
+        'gray-9': '#0e0f12'
+    }),
+    dark: toMantineColor({
+        'dark-0': '#c9c9c9',
+        'dark-1': '#b8b8b8',
+        'dark-2': '#828282',
+        'dark-3': '#696969',
+        'dark-4': '#424242',
+        'dark-5': '#3b3b3b',
+        'dark-6': '#2e2e2e',
+        'dark-7': '#242424',
+        'dark-8': '#1f1f1f',
+        'dark-9': '#141414'
+    }),
+    teal: toMantineColor({
+        'teal-0': '#e5fff9',
+        'teal-1': '#bffff0',
+        'teal-2': '#1efadc',
+        'teal-3': '#18d4bb',
+        'teal-4': '#0faf99',
+        'teal-5': '#077b6b',
+        'teal-6': '#02473e',
+        'teal-7': '#012f2a',
+        'teal-8': '#011f1b',
+        'teal-9': '#001210'
+    }),
+    yellow: toMantineColor({
+        'yellow-0': '#fff9e5',
+        'yellow-1': '#fff2c0',
+        'yellow-2': '#fbe000',
+        'yellow-3': '#e5b800',
+        'yellow-4': '#c89300',
+        'yellow-5': '#936400',
+        'yellow-6': '#593700',
+        'yellow-7': '#3c2301',
+        'yellow-8': '#291700',
+        'yellow-9': '#180d00'
+    }),
+    violet: toMantineColor({
+        'violet-0': '#faf8ff',
+        'violet-1': '#f4f0ff',
+        'violet-2': '#e3daff',
+        'violet-3': '#c7b2ff',
+        'violet-4': '#ac86ff',
+        'violet-5': '#8a36ff',
+        'violet-6': '#5500aa',
+        'violet-7': '#390076',
+        'violet-8': '#270054',
+        'violet-9': '#180037'
+    }),
+    grape: toMantineColor({
+        'grape-0': '#fbf8fd',
+        'grape-1': '#f6f0fb',
+        'grape-2': '#e7d6f5',
+        'grape-3': '#d2b0ed',
+        'grape-4': '#bc85e3',
+        'grape-5': '#9946c7',
+        'grape-6': '#592676',
+        'grape-7': '#3c1851',
+        'grape-8': '#290e38',
+        'grape-9': '#190624'
+    }),
+    'cyan (Not used)': toMantineColor({
+        'cyan-0': '#e3fafc',
+        'cyan-1': '#c5f6fa',
+        'cyan-2': '#99e9f2',
+        'cyan-3': '#66d9e8',
+        'cyan-4': '#3bc9db',
+        'cyan-5': '#22b8cf',
+        'cyan-6': '#15aabf',
+        'cyan-7': '#1098ad',
+        'cyan-8': '#0c8599',
+        'cyan-9': '#0b7285'
+    }),
+    orange: toMantineColor({
+        'orange-0': '#fff8f5',
+        'orange-1': '#ffefe8',
+        'orange-2': '#ffeedd',
+        'orange-3': '#fea980',
+        'orange-4': '#f27a38',
+        'orange-5': '#b84b11',
+        'orange-6': '#6c2a00',
+        'orange-7': '#491b02',
+        'orange-8': '#301301',
+        'orange-9': '#1c0a00'
+    }),
+    indigo: toMantineColor({
+        'indigo-0': '#f9f9fb',
+        'indigo-1': '#f1f1f9',
+        'indigo-2': '#dbdbf2',
+        'indigo-3': '#babadf',
+        'indigo-4': '#9797cb',
+        'indigo-5': '#6767a4',
+        'indigo-6': '#393968',
+        'indigo-7': '#252547',
+        'indigo-8': '#181831',
+        'indigo-9': '#0d0d1f'
+    }),
+    green: toMantineColor({
+        'green-0': '#e9ffed',
+        'green-1': '#cdfed5',
+        'green-2': '#73fa84',
+        'green-3': '#32d961',
+        'green-4': '#15b43c',
+        'green-5': '#0b7e2f',
+        'green-6': '#044918',
+        'green-7': '#02300f',
+        'green-8': '#012008',
+        'green-9': '#001304'
+    }),
     navy,
     info: navy,
     // Accent
-    blue: toMantineColor(color.accent.blue),
-    red,
     critical: red,
-    teal,
     new: teal,
-    yellow,
     warning: yellow,
     // Secondary
-    green: toMantineColor(color.secondary.green),
-    indigo: toMantineColor(color.secondary.indigo),
     lime,
     success: lime,
     purple: toMantineColor(color.secondary.purple)

package/dist/esm/theme/PlasmaColors.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/theme/PlasmaColors.ts"],"sourcesContent":["import {color} from '@coveord/plasma-tokens';\nimport {MantineColorsTuple} from '@mantine/core';\n\nconst toMantineColor = (plasmaColor: Record<string, string>): MantineColorsTuple =>\n    Object.values(plasmaColor) as unknown as MantineColorsTuple;\n\nconst navy = toMantineColor(color.primary.navy);\nconst red = toMantineColor(color.accent.red);\nconst yellow = toMantineColor(color.accent.yellow);\nconst teal = toMantineColor(color.accent.teal);\nconst lime = [\n    color.secondary.lime[0],\n    color.secondary.lime[0],\n    color.secondary.lime[0],\n    color.secondary.lime[0],\n    color.secondary.lime[6],\n    color.secondary.lime[6],\n    color.secondary.lime[6],\n    color.secondary.lime[9],\n    color.secondary.lime[9],\n    color.secondary.lime[9],\n] as MantineColorsTuple;\n\nexport const PlasmaColors = {\n    // Primary\n    gray: toMantineColor(color.primary.gray),\n    action: [\n        color.primary.action[1],\n        color.primary.action[1],\n        color.primary.action[2],\n        color.primary.action[3],\n        color.primary.action[4],\n        color.primary.action[6],\n        color.primary.action[6],\n        color.primary.action[8],\n        color.primary.action[8],\n        color.primary.action[9],\n    ] as MantineColorsTuple,\n    navy,\n    info: navy,\n    // Accent\n    blue: toMantineColor(color.accent.blue),\n    red,\n    critical: red,\n    teal,\n    new: teal,\n    yellow,\n    warning: yellow,\n    // Secondary\n    green: toMantineColor(color.secondary.green),\n    indigo: toMantineColor(color.secondary.indigo),\n    lime,\n    success: lime,\n    purple: toMantineColor(color.secondary.purple),\n};\n"],"names":["color","toMantineColor","plasmaColor","Object","values","navy","primary","red","accent","yellow","teal","lime","secondary","PlasmaColors","gray","action","info","blue","critical","new","warning","green","indigo","success","purple"],"mappings":"AAAA,SAAQA,KAAK,QAAO,yBAAyB;AAG7C,MAAMC,iBAAiB,CAACC,cACpBC,OAAOC,MAAM,CAACF;AAElB,MAAMG,OAAOJ,eAAeD,MAAMM,OAAO,CAACD,IAAI;AAC9C,MAAME,MAAMN,eAAeD,MAAMQ,MAAM,CAACD,GAAG;AAC3C,MAAME,SAASR,eAAeD,MAAMQ,MAAM,CAACC,MAAM;AACjD,MAAMC,OAAOT,eAAeD,MAAMQ,MAAM,CAACE,IAAI;AAC7C,MAAMC,OAAO;IACTX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;IACvBX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;IACvBX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;IACvBX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;IACvBX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;IACvBX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;IACvBX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;IACvBX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;IACvBX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;IACvBX,MAAMY,SAAS,CAACD,IAAI,CAAC,EAAE;CAC1B;AAED,OAAO,MAAME,eAAe;IACxB,UAAU;IACVC,MAAMb,eAAeD,MAAMM,OAAO,CAACQ,IAAI;IACvCC,QAAQ;QACJf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;QACvBf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;QACvBf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;QACvBf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;QACvBf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;QACvBf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;QACvBf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;QACvBf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;QACvBf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;QACvBf,MAAMM,OAAO,CAACS,MAAM,CAAC,EAAE;KAC1B;IACDV;IACAW,MAAMX;IACN,SAAS;IACTY,MAAMhB,eAAeD,MAAMQ,MAAM,CAACS,IAAI;IACtCV;IACAW,UAAUX;IACVG;IACAS,KAAKT;IACLD;IACAW,SAASX;IACT,YAAY;IACZY,OAAOpB,eAAeD,MAAMY,SAAS,CAACS,KAAK;IAC3CC,QAAQrB,eAAeD,MAAMY,SAAS,CAACU,MAAM;IAC7CX;IACAY,SAASZ;IACTa,QAAQvB,eAAeD,MAAMY,SAAS,CAACY,MAAM;AACjD,EAAE"}
+{"version":3,"sources":["../../../src/theme/PlasmaColors.ts"],"sourcesContent":["import {color} from '@coveord/plasma-tokens';\nimport {MantineColorsTuple} from '@mantine/core';\n\nconst toMantineColor = (plasmaColor: Record<string, string>): MantineColorsTuple =>\n    Object.values(plasmaColor) as unknown as MantineColorsTuple;\n\nconst navy = toMantineColor(color.primary.navy);\nconst red = toMantineColor(color.accent.red);\nconst yellow = toMantineColor(color.accent.yellow);\nconst teal = toMantineColor(color.accent.teal);\nconst lime = [\n    color.secondary.lime[0],\n    color.secondary.lime[0],\n    color.secondary.lime[0],\n    color.secondary.lime[0],\n    color.secondary.lime[6],\n    color.secondary.lime[6],\n    color.secondary.lime[6],\n    color.secondary.lime[9],\n    color.secondary.lime[9],\n    color.secondary.lime[9],\n] as MantineColorsTuple;\n\nexport const PlasmaColors = {\n    // Primary\n    blue: toMantineColor({\n        'blue-0': '#f8f9ff',\n        'blue-1': '#eef2ff',\n        'blue-2': '#d5defe',\n        'blue-3': '#a6bcfe',\n        'blue-4': '#6e99fd',\n        'blue-5': '#1169da',\n        'blue-6': '#063c82',\n        'blue-7': '#03275a',\n        'blue-8': '#01193f',\n        'blue-9': '#010e29',\n    }),\n    red: toMantineColor({\n        'red-0': '#fff8f8',\n        'red-1': '#feefee',\n        'red-2': '#fdd5d5',\n        'red-3': '#fca7a5',\n        'red-4': '#fb6f6c',\n        'red-5': '#d2271b',\n        'red-6': '#7e0f17',\n        'red-7': '#58050f',\n        'red-8': '#3e020a',\n        'red-9': '#280104',\n    }),\n    gray: toMantineColor({\n        'gray-0': '#f9f9fa',\n        'gray-1': '#f1f2f4',\n        'gray-2': '#dddfe3',\n        'gray-3': '#b9bdc7',\n        'gray-4': '#959cab',\n        'gray-5': '#676d7a',\n        'gray-6': '#3b3e46',\n        'gray-7': '#26292f',\n        'gray-8': '#191b1f',\n        'gray-9': '#0e0f12',\n    }),\n    dark: toMantineColor({\n        'dark-0': '#c9c9c9',\n        'dark-1': '#b8b8b8',\n        'dark-2': '#828282',\n        'dark-3': '#696969',\n        'dark-4': '#424242',\n        'dark-5': '#3b3b3b',\n        'dark-6': '#2e2e2e',\n        'dark-7': '#242424',\n        'dark-8': '#1f1f1f',\n        'dark-9': '#141414',\n    }),\n    teal: toMantineColor({\n        'teal-0': '#e5fff9',\n        'teal-1': '#bffff0',\n        'teal-2': '#1efadc',\n        'teal-3': '#18d4bb',\n        'teal-4': '#0faf99',\n        'teal-5': '#077b6b',\n        'teal-6': '#02473e',\n        'teal-7': '#012f2a',\n        'teal-8': '#011f1b',\n        'teal-9': '#001210',\n    }),\n    yellow: toMantineColor({\n        'yellow-0': '#fff9e5',\n        'yellow-1': '#fff2c0',\n        'yellow-2': '#fbe000',\n        'yellow-3': '#e5b800',\n        'yellow-4': '#c89300',\n        'yellow-5': '#936400',\n        'yellow-6': '#593700',\n        'yellow-7': '#3c2301',\n        'yellow-8': '#291700',\n        'yellow-9': '#180d00',\n    }),\n    violet: toMantineColor({\n        'violet-0': '#faf8ff',\n        'violet-1': '#f4f0ff',\n        'violet-2': '#e3daff',\n        'violet-3': '#c7b2ff',\n        'violet-4': '#ac86ff',\n        'violet-5': '#8a36ff',\n        'violet-6': '#5500aa',\n        'violet-7': '#390076',\n        'violet-8': '#270054',\n        'violet-9': '#180037',\n    }),\n    grape: toMantineColor({\n        'grape-0': '#fbf8fd',\n        'grape-1': '#f6f0fb',\n        'grape-2': '#e7d6f5',\n        'grape-3': '#d2b0ed',\n        'grape-4': '#bc85e3',\n        'grape-5': '#9946c7',\n        'grape-6': '#592676',\n        'grape-7': '#3c1851',\n        'grape-8': '#290e38',\n        'grape-9': '#190624',\n    }),\n    'cyan (Not used)': toMantineColor({\n        'cyan-0': '#e3fafc',\n        'cyan-1': '#c5f6fa',\n        'cyan-2': '#99e9f2',\n        'cyan-3': '#66d9e8',\n        'cyan-4': '#3bc9db',\n        'cyan-5': '#22b8cf',\n        'cyan-6': '#15aabf',\n        'cyan-7': '#1098ad',\n        'cyan-8': '#0c8599',\n        'cyan-9': '#0b7285',\n    }),\n    orange: toMantineColor({\n        'orange-0': '#fff8f5',\n        'orange-1': '#ffefe8',\n        'orange-2': '#ffeedd',\n        'orange-3': '#fea980',\n        'orange-4': '#f27a38',\n        'orange-5': '#b84b11',\n        'orange-6': '#6c2a00',\n        'orange-7': '#491b02',\n        'orange-8': '#301301',\n        'orange-9': '#1c0a00',\n    }),\n    indigo: toMantineColor({\n        'indigo-0': '#f9f9fb',\n        'indigo-1': '#f1f1f9',\n        'indigo-2': '#dbdbf2',\n        'indigo-3': '#babadf',\n        'indigo-4': '#9797cb',\n        'indigo-5': '#6767a4',\n        'indigo-6': '#393968',\n        'indigo-7': '#252547',\n        'indigo-8': '#181831',\n        'indigo-9': '#0d0d1f',\n    }),\n    green: toMantineColor({\n        'green-0': '#e9ffed',\n        'green-1': '#cdfed5',\n        'green-2': '#73fa84',\n        'green-3': '#32d961',\n        'green-4': '#15b43c',\n        'green-5': '#0b7e2f',\n        'green-6': '#044918',\n        'green-7': '#02300f',\n        'green-8': '#012008',\n        'green-9': '#001304',\n    }),\n    navy,\n    info: navy,\n    // Accent\n    critical: red,\n    new: teal,\n    warning: yellow,\n    // Secondary\n    lime,\n    success: lime,\n    purple: toMantineColor(color.secondary.purple),\n};\n"],"names":["color","toMantineColor","plasmaColor","Object","values","navy","primary","red","accent","yellow","teal","lime","secondary","PlasmaColors","blue","gray","dark","violet","grape","orange","indigo","green","info","critical","new","warning","success","purple"],"mappings":"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"}

package/dist/esm/theme/Theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../../src/theme/Theme.tsx"],"names":[],"mappings":"AAUA,OAAO,EAmBH,oBAAoB,EAmBvB,MAAM,eAAe,CAAC;AAiCvB,eAAO,MAAM,WAAW,EAAE,oBAuSxB,CAAC"}
+{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../../src/theme/Theme.tsx"],"names":[],"mappings":"AAUA,OAAO,EAeH,oBAAoB,EAiBvB,MAAM,eAAe,CAAC;AAsBvB,eAAO,MAAM,WAAW,EAAE,oBAuQxB,CAAC"}

package/dist/esm/theme/Theme.js

@@ -1,43 +1,32 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { ArrowHeadLeftSize16Px, ArrowHeadRightSize16Px, CheckSize16Px, CrossSize16Px, FilterSize16Px, InfoSize16Px, InfoSize24Px } from '@coveord/plasma-react-icons';
 import { color } from '@coveord/plasma-tokens';
-import { ActionIcon, Alert, Anchor, AppShellNavbar, Badge, Button, Checkbox, CloseButton, ColorSwatch, Combobox, ComboboxSearch, createTheme, deepMerge, Divider, Input, InputWrapper, List, Loader, MenuItem, Modal, MultiSelect, NavLink, Notification, Pagination, Popover, Radio, ScrollArea, SegmentedControl, Select, Skeleton, Stepper, Switch, Tabs, Text, TextInput, Tooltip } from '@mantine/core';
-import { DatePicker } from '@mantine/dates';
-import ActionIconClasses from '../styles/ActionIcon.module.css';
+import { Alert, Badge, Button, Checkbox, CloseButton, ColorSwatch, Combobox, ComboboxSearch, createTheme, deepMerge, Input, InputWrapper, List, Loader, Modal, MultiSelect, NavLink, Notification, Pagination, Popover, Radio, ScrollArea, SegmentedControl, Select, Skeleton, Stepper, Switch, Tabs, Text, Tooltip } from '@mantine/core';
 import AlertClasses from '../styles/Alert.module.css';
-import AnchorClasses from '../styles/Anchor.module.css';
-import AppShellNavBarClasses from '../styles/AppShellNavBar.module.css';
 import BadgeClasses from '../styles/Badge.module.css';
 import ButtonClasses from '../styles/Button.module.css';
 import CheckboxClasses from '../styles/Checkbox.module.css';
 import ComboboxClasses from '../styles/Combobox.module.css';
-import DatePickerClasses from '../styles/DatePicker.module.css';
-import InputClasses from '../styles/Input.module.css';
 import InputWrapperClasses from '../styles/InputWrapper.module.css';
 import ListClasses from '../styles/List.module.css';
 import ModalClasses from '../styles/Modal.module.css';
 import NavLinkClasses from '../styles/NavLink.module.css';
-import NotificationClasses from '../styles/Notification.module.css';
-import PaginationClasses from '../styles/Pagination.module.css';
 import RadioClasses from '../styles/Radio.module.css';
 import ReadOnlyInputClasses from '../styles/ReadOnlyInput.module.css';
 import ReadOnlyStateClasses from '../styles/ReadOnlyState.module.css';
 import ScrollAreaClasses from '../styles/ScrollArea.module.css';
 import SegmentedControlClasses from '../styles/SegmentedControl.module.css';
-import SelectClasses from '../styles/Select.module.css';
 import SkeletonClasses from '../styles/Skeleton.module.css';
 import StepperClasses from '../styles/Stepper.module.css';
 import TabsClasses from '../styles/Tabs.module.css';
 import TextClasses from '../styles/Text.module.css';
 import TooltipClasses from '../styles/Tooltip.module.css';
-import { NotificationVars } from '../vars/Notification.vars';
-import { TextVars } from '../vars/Text.vars';
 import { PlasmaColors } from './PlasmaColors';
 export const plasmaTheme = createTheme({
     // These are overrides over https://github.com/mantinedev/mantine/blob/master/packages/%40mantine/core/src/core/MantineProvider/default-theme.ts
     fontFamily: 'canada-type-gibson, sans-serif',
     black: color.primary.gray[9],
-    defaultRadius: 8,
+    defaultRadius: 'md',
     lineHeights: {
         md: '1.5'
     },
@@ -49,43 +38,50 @@ export const plasmaTheme = createTheme({
         lg: '32px',
         xl: '40px'
     },
-    primaryColor: 'action',
+    primaryColor: 'blue',
     headings: {
         fontFamily: 'canada-type-gibson, sans-serif',
         fontWeight: '500',
         sizes: {
             h1: {
-                fontSize: '48px',
-                lineHeight: '1.5',
-                fontWeight: '300'
+                fontSize: '40px',
+                lineHeight: '1.2',
+                fontWeight: '500'
             },
             h2: {
                 fontSize: '32px',
-                lineHeight: '1.5',
+                lineHeight: '1.25',
                 fontWeight: '500'
             },
             h3: {
                 fontSize: '24px',
-                lineHeight: '1.5',
+                lineHeight: '1.33',
                 fontWeight: '500'
             },
             h4: {
                 fontSize: '18px',
-                lineHeight: '1.5',
+                lineHeight: '1.2',
                 fontWeight: '300'
             },
             h5: {
-                fontSize: '14px',
-                lineHeight: '1.5',
+                fontSize: '16px',
+                lineHeight: '1.25',
                 fontWeight: '500'
             },
             h6: {
                 fontSize: '12px',
-                lineHeight: '1.5',
+                lineHeight: '1.33',
                 fontWeight: '500'
             }
         }
     },
+    fontSizes: {
+        xs: '12px',
+        sm: '14px',
+        md: '16px',
+        lg: '18px',
+        xl: '20px'
+    },
     shadows: {
         xs: '0px 1px 0px rgba(4, 8, 31, 0.08)',
         sm: '0px 2px 4px rgba(4, 8, 31, 0.12)',
@@ -93,44 +89,29 @@ export const plasmaTheme = createTheme({
         lg: '0px 8px 16px rgba(7, 12, 41, 0.06)',
         xl: '0px 16px 24px rgba(4, 8, 31, 0.06)'
     },
+    primaryShade: 5,
     colors: PlasmaColors,
     components: {
-        ActionIcon: ActionIcon.extend({
-            classNames: {
-                root: ActionIconClasses.root
-            }
-        }),
         Alert: Alert.extend({
             defaultProps: {
                 icon: /*#__PURE__*/ _jsx(InfoSize16Px, {
                     height: 16
                 }),
-                color: 'navy'
+                radius: 'lg'
             },
             classNames: AlertClasses
         }),
-        Anchor: Anchor.extend({
-            defaultProps: {
-                color: 'action.6'
-            },
-            classNames: {
-                root: AnchorClasses.root
-            }
-        }),
-        AppShellNavbar: AppShellNavbar.extend({
-            classNames: {
-                navbar: AppShellNavBarClasses.navbar
-            }
-        }),
         Badge: Badge.extend({
-            classNames: {
-                root: BadgeClasses.root
-            },
+            classNames: BadgeClasses,
             defaultProps: {
                 variant: 'light'
             }
         }),
         Button: Button.extend({
+            defaultProps: {
+                radius: 'lg',
+                size: 'sm'
+            },
             classNames: ButtonClasses
         }),
         Checkbox: Checkbox.extend({
@@ -172,10 +153,7 @@ export const plasmaTheme = createTheme({
             }
         }),
         Combobox: Combobox.extend({
-            classNames: {
-                option: SelectClasses.option,
-                search: ComboboxClasses.search
-            }
+            classNames: ComboboxClasses
         }),
         ComboboxSearch: ComboboxSearch.extend({
             defaultProps: {
@@ -186,28 +164,24 @@ export const plasmaTheme = createTheme({
                 })
             }
         }),
-        DatePicker: DatePicker.extend({
-            classNames: {
-                monthCell: DatePickerClasses.monthCell
-            }
-        }),
-        Divider: Divider.extend({
-            defaultProps: {
-                color: 'gray.3'
-            }
-        }),
         Input: Input.extend({
+            defaultProps: {
+                size: 'sm'
+            },
             classNames: (_theme, props)=>{
                 const anyProps = props;
                 if (anyProps.readOnly && !props.disabled && ![
                     'Select'
                 ].includes(anyProps.__staticSelector)) {
-                    return deepMerge(InputClasses, ReadOnlyInputClasses);
+                    return ReadOnlyInputClasses;
                 }
-                return InputClasses;
+                return {};
             }
         }),
         InputWrapper: InputWrapper.extend({
+            defaultProps: {
+                size: 'sm'
+            },
             classNames: InputWrapperClasses,
             vars: (theme, props)=>{
                 const anyProps = props;
@@ -237,14 +211,7 @@ export const plasmaTheme = createTheme({
             }
         }),
         List: List.extend({
-            classNames: {
-                root: ListClasses.root
-            }
-        }),
-        MenuItem: MenuItem.extend({
-            defaultProps: {
-                fw: 300
-            }
+            classNames: ListClasses
         }),
         Modal: Modal.extend({
             classNames: ModalClasses
@@ -272,23 +239,10 @@ export const plasmaTheme = createTheme({
             defaultProps: {
                 icon: /*#__PURE__*/ _jsx(InfoSize24Px, {
                     height: 24
-                }),
-                color: 'info'
-            },
-            classNames: {
-                root: NotificationClasses.root,
-                icon: NotificationClasses.icon,
-                closeButton: NotificationClasses.closeButton
-            },
-            vars: NotificationVars
+                })
+            }
         }),
         Pagination: Pagination.extend({
-            classNames: PaginationClasses,
-            vars: ()=>({
-                    root: {
-                        '--pagination-control-fz': 'var(--mantine-font-size-sm)'
-                    }
-                }),
             defaultProps: {
                 nextIcon: ArrowHeadRightSize16Px,
                 previousIcon: ArrowHeadLeftSize16Px
@@ -322,41 +276,25 @@ export const plasmaTheme = createTheme({
             }
         }),
         ScrollArea: ScrollArea.extend({
-            classNames: {
-                viewport: ScrollAreaClasses.viewport
-            }
+            classNames: ScrollAreaClasses
         }),
         SegmentedControl: SegmentedControl.extend({
             classNames: SegmentedControlClasses
         }),
         Select: Select.extend({
             defaultProps: {
-                withCheckIcon: false,
                 allowDeselect: false
-            },
-            classNames: {
-                input: SelectClasses.input,
-                option: SelectClasses.option
             }
         }),
         Skeleton: Skeleton.extend({
-            classNames: {
-                root: SkeletonClasses.root
-            }
+            classNames: SkeletonClasses
         }),
         Stepper: Stepper.extend({
             defaultProps: {
                 size: 'xs',
                 completedIcon: /*#__PURE__*/ _jsx(CheckSize16Px, {})
             },
-            classNames: {
-                step: StepperClasses.step,
-                stepIcon: StepperClasses.stepIcon,
-                stepCompletedIcon: StepperClasses.stepCompletedIcon,
-                stepDescription: StepperClasses.stepDescription,
-                separator: StepperClasses.separator,
-                verticalSeparator: StepperClasses.verticalSeparator
-            }
+            classNames: StepperClasses
         }),
         Switch: Switch.extend({
             classNames: (theme, props)=>{
@@ -388,19 +326,11 @@ export const plasmaTheme = createTheme({
         Tabs: Tabs.extend({
             classNames: TabsClasses
         }),
-        TabsTab: Tabs.Tab.extend({
-            defaultProps: {
-                px: 'sm'
-            }
-        }),
         Text: Text.extend({
-            classNames: TextClasses,
-            vars: TextVars
-        }),
-        TextInput: TextInput.extend({
             defaultProps: {
-                radius: 8
-            }
+                size: 'sm'
+            },
+            classNames: TextClasses
         }),
         Tooltip: Tooltip.extend({
             defaultProps: {