kwant-ui 3.38.1-dev.7 → 3.38.1-dev.8
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.
- package/dist/components/Tag/types.d.ts +1 -1
- package/dist/index.es.js +51 -4
- package/dist/index.js +51 -4
- package/dist/package.json +1 -1
- package/dist/themes/colors.ts +8 -7
- package/dist/themes/types.d.ts +1 -0
- package/package.json +1 -1
- package/themes/colors.ts +8 -7
- package/themes/types.ts +1 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export type TGTypes = {
|
|
3
|
-
type: 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'orange' | 'grey';
|
|
3
|
+
type: 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'orange' | 'grey' | 'insight';
|
|
4
4
|
size?: 'small' | 'default';
|
|
5
5
|
avatar?: any;
|
|
6
6
|
icon?: any;
|
package/dist/index.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import n,{css as a,createGlobalStyle as c}from"styled-components";import*as i from"react";import o,{Fragment as s,useEffect as l,forwardRef as h,useId as v,useState as p,useRef as u,cloneElement as g,createContext as m,useContext as d,createElement as f,useMemo as _,useCallback as w,isValidElement as b,Children as y,PureComponent as x,useImperativeHandle as Z,Component as O}from"react";import M,{createPortal as E}from"react-dom";import{ViewportList as H}from"react-viewport-list";var P;!function(e){var t,r;(t=e.Variant||(e.Variant={})).outline="outline",t.filled="filled",t.filter="filter",t.ghost="ghost",t.ghostSecondary="ghostSecondary",(r=e.ButtonEnum||(e.ButtonEnum={}))[r.primary=0]="primary",r[r.secondary=1]="secondary",r[r.error=2]="error",r[r.success=3]="success"}(P||(P={}));const j={regular:400,medium:500,semiBold:600},V={subtitle1:"\n font-size: 1.5rem;\n font-style: normal;\n line-height: 2rem;\n",subtitle2:"\n font-size: 1.25rem;\n font-style: normal;\n line-height: 1.75rem;\n ",body1:"\n font-size: 1rem;\n font-style: normal;\n line-height: 1.5rem;\n",body2:"\n font-size: 0.875rem;\n font-style: normal;\n line-height: 1.25rem;\n ",prefix:"\n font-weight: 400;\n font-size: 12px;\n line-height: 16px;\n text-transform: uppercase;\n",caption:"\n font-size: 0.75rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1re;\n",link:"\n font-size: 14px;\n line-height: 20px;\n text-decoration-line: underline;\n"},C=e=>{const{category:t,weight:r}=e;return t?`\n ${V[t]}\n font-weight:${(e=>e?j[e]:j.regular)(r)};\n `:V.body1},A={primary:{primary100:"#0B1B2A",primary90:"#1C2E40",primary80:"#2A4055",primary70:"#39526B",primary60:"#455F7B",primary50:"#5F758F",primary40:"#455F7B",primary30:"#9CACC0",primary20:"#C0CEDE",primary10:"#E4EBF8",primary5:"#F9FAFD"},secondary:{secondary100:"#103FE8",secondary90:"#2852EA",secondary80:"#4065ED",secondary70:"#5879EF",secondary60:"#708CF1",secondary50:"#889FF4",secondary40:"#9FB2F6",secondary30:"#B7C5F8",secondary20:"#CFD9FA",secondary10:"#E7ECFD",secondary5:"#F3F5FE"},tertiary:{tertiary100:"#174189",tertiary90:"#2E5495",tertiary80:"#4567A1",tertiary70:"#5D7AAC",tertiary60:"#748DB8",tertiary50:"#8BA0C4",tertiary40:"#A2B3D0",tertiary30:"#B9C6DC",tertiary20:"#D1D9E7",tertiary10:"#E8ECF3",tertiary5:"#F3F5F9"},accent:{accent500:"#BD9E2C",accent100:"#ECC537",accent75:"#FFC665",accent50:"#F4DC87",accent15:"#FFF4E0"},link:{linkHigh:"#002C99",linkMedium:"#0053CB",linkLow:"#5D7FFF"},error:{errorHigh:"#AB000D",errorMedium:"#E53935",errorLow:"#FF6F60",errorLow2:"#F8B4B4",errorLow3:"#FDE8E8",errorLower:"#FCF4F4"},success:{successDark:"#009624",successMedium:"#00C853",successLow:"#5EFC82"},black:{blackHigh:"#212121",blackMedium:"#666666",blackLow:"#757575",black:"#000000"},white:{white:"#FFFFFF"},grey:{grey5:"#F9FAFD",grey10:"#F2F5FA",grey20:"#C0CEDE",grey30:"#9CACC0",grey50:"#F9FAFD",grey90:"#1C2E40",grey100:"#F5F7FA",grey200:"#
|
|
1
|
+
import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import n,{css as a,createGlobalStyle as c}from"styled-components";import*as i from"react";import o,{Fragment as s,useEffect as l,forwardRef as h,useId as v,useState as p,useRef as u,cloneElement as g,createContext as m,useContext as d,createElement as f,useMemo as _,useCallback as w,isValidElement as b,Children as y,PureComponent as x,useImperativeHandle as Z,Component as O}from"react";import M,{createPortal as E}from"react-dom";import{ViewportList as H}from"react-viewport-list";var P;!function(e){var t,r;(t=e.Variant||(e.Variant={})).outline="outline",t.filled="filled",t.filter="filter",t.ghost="ghost",t.ghostSecondary="ghostSecondary",(r=e.ButtonEnum||(e.ButtonEnum={}))[r.primary=0]="primary",r[r.secondary=1]="secondary",r[r.error=2]="error",r[r.success=3]="success"}(P||(P={}));const j={regular:400,medium:500,semiBold:600},V={subtitle1:"\n font-size: 1.5rem;\n font-style: normal;\n line-height: 2rem;\n",subtitle2:"\n font-size: 1.25rem;\n font-style: normal;\n line-height: 1.75rem;\n ",body1:"\n font-size: 1rem;\n font-style: normal;\n line-height: 1.5rem;\n",body2:"\n font-size: 0.875rem;\n font-style: normal;\n line-height: 1.25rem;\n ",prefix:"\n font-weight: 400;\n font-size: 12px;\n line-height: 16px;\n text-transform: uppercase;\n",caption:"\n font-size: 0.75rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1re;\n",link:"\n font-size: 14px;\n line-height: 20px;\n text-decoration-line: underline;\n"},C=e=>{const{category:t,weight:r}=e;return t?`\n ${V[t]}\n font-weight:${(e=>e?j[e]:j.regular)(r)};\n `:V.body1},A={primary:{primary100:"#0B1B2A",primary90:"#1C2E40",primary80:"#2A4055",primary70:"#39526B",primary60:"#455F7B",primary50:"#5F758F",primary40:"#455F7B",primary30:"#9CACC0",primary20:"#C0CEDE",primary10:"#E4EBF8",primary5:"#F9FAFD"},secondary:{secondary100:"#103FE8",secondary90:"#2852EA",secondary80:"#4065ED",secondary70:"#5879EF",secondary60:"#708CF1",secondary50:"#889FF4",secondary40:"#9FB2F6",secondary30:"#B7C5F8",secondary20:"#CFD9FA",secondary10:"#E7ECFD",secondary5:"#F3F5FE"},tertiary:{tertiary100:"#174189",tertiary90:"#2E5495",tertiary80:"#4567A1",tertiary70:"#5D7AAC",tertiary60:"#748DB8",tertiary50:"#8BA0C4",tertiary40:"#A2B3D0",tertiary30:"#B9C6DC",tertiary20:"#D1D9E7",tertiary10:"#E8ECF3",tertiary5:"#F3F5F9"},accent:{accent500:"#BD9E2C",accent100:"#ECC537",accent75:"#FFC665",accent50:"#F4DC87",accent15:"#FFF4E0"},link:{linkHigh:"#002C99",linkMedium:"#0053CB",linkLow:"#5D7FFF"},error:{errorHigh:"#AB000D",errorMedium:"#E53935",errorLow:"#FF6F60",errorLow2:"#F8B4B4",errorLow3:"#FDE8E8",errorLower:"#FCF4F4"},success:{successDark:"#009624",successMedium:"#00C853",successLow:"#5EFC82"},black:{blackHigh:"#212121",blackMedium:"#666666",blackLow:"#757575",black:"#000000"},white:{white:"#FFFFFF"},grey:{grey5:"#F9FAFD",grey10:"#F2F5FA",grey20:"#C0CEDE",grey30:"#9CACC0",grey50:"#F9FAFD",grey90:"#1C2E40",grey100:"#F5F7FA",grey200:"#E4E9F2",grey250:"#e4e9f2",grey300:"#C8D2DE",grey400:"#A1AFC0",grey500:"#798CA4",grey600:"#5F758F",grey700:"#455F7B",grey800:"#2A4055",grey900:"#1C2E40",grey1000:"#0B1B2A",greyHigh:"#C2C2C2",greyMedium:"#E5E5E5",greyLow:"#F5F5F5"},warning:{warningHigh:"#C67100",warningMedium:"#FFA000",warningLow:"#FFD149",warningLower:"#FED7AA",warningLower2:"#FFEDD5"},disabled:{disabledHigh:"#B1B1B1",disabledMedium:"#CFCFCF",disabledLow:"#ECECEC"},text:{primary:"#24292E"},input:{focused:"0px 0px 0px 4px rgba(16, 63, 232, 0.25)",focusedShadowButton:"0px 0px 0px 4px rgba(16, 63, 232, 0.30)",focusedShadow:"0px 0px 0px 4px rgba(16, 63, 232, 0.25)",focusedShadowFilter:"rgba(102, 130, 231, 0.30)",focusedShadowError:" 0px 0px 0px 4px rgba(239, 68, 68, 0.25)",focusedSecondary:"rgba(102, 130, 231, 0.30)"},button:{primaryButton:"0px 0px 0px 4px rgba(16, 63, 232, 0.30)",primaryOutlineButton:"0px 0px 0px 4px rgba(16, 63, 232, 0.30)",secondaryButton:"0px 0px 0px 4px rgba(28, 46, 64, 0.10)",errorButton:"0px 0px 0px 4px rgba(229, 57, 53, 0.20)",successButton:"0px 0px 0px 4px rgba(45, 161, 96, 0.20)",filterButton:"0px 0px 0px 4px rgba(102, 130, 231, 0.30)"},green:{green40:"#2DA170",green10:"#9FD4B5",green8:"#D8F0E0",green5:"#F1FAF4",green50:"#F1FAF4",green100:"#D8F0E0",green200:"#9FD4B5",green300:"#52B87A",green400:"#2DA170",green500:"#10855E",green600:"#21765A",green700:"#246650",green800:"#0D533C",green900:"#0A402E",green1000:"#072B1F"},blue:{blue5:"#F6F8FE",blue50:"#F6F8FE",blue100:"#E7ECFD",blue200:"#CFD9FA",blue300:"#B7C5F8",blue400:"#9FB2F6",blue500:"#889FF4",blue600:"#708CF1",blue700:"#5879EF",blue800:"#4065ED",blue900:"#2852EA",blue1000:"#103FE8"},yellow:{yellow50:"#FCF9DC",yellow100:"#FAF4B4",yellow200:"#FAEC88",yellow300:"#F9DD69",yellow400:"#FACC15",yellow500:"#EAB308",yellow600:"#CA8A04",yellow700:"#A16207",yellow800:"#854D0E",yellow900:"#713F12",yellow1000:"#713F12"},red:{red050:"#FDF2F2",red50:"#FDF2F2",red100:"#FDE8E8",red200:"#FBD5D5",red300:"#F8B4B4",red400:"#F98080",red500:"#F05252",red600:"#DF4242",red700:"#CE3434",red800:"#9B1C1C",red900:"#771D1D"},orange:{orange050:"#FFF7ED",orange50:"#FFF7ED",orange100:"#FFEDD5",orange200:"#FED7AA",orange300:"#FDBA74",orange400:"#FFA84C",orange500:"#F98016",orange600:"#EA580C",orange700:"#C2410C",orange800:"#9A3412",orange900:"#7C2D12"},scrollbar:{track:"#F2F5FA",thumb:"#9CACC0"},transparent:{blueHover:"rgba(16, 63, 232, 0.06)",transparent:"#ffffff78"}},L={...A},{blue:{blue1000:z,blue900:B,blue300:k,blue100:S,blue50:R},button:{primaryButton:D,primaryOutlineButton:I,secondaryButton:T,errorButton:N,successButton:F,filterButton:Q},white:{white:$},grey:{grey900:Y,grey800:U,grey400:W,grey300:X,grey100:K,grey50:q},red:{red700:G,red300:J,red50:ee},green:{green400:te,green5:re,green200:ne}}=L,ae={primary:{backgroundColor:z,textColor:$,borderColor:"transparent",hoverColor:B,focusColor:D,disabledBackgroundColor:k,disabledTextColor:$,disabledBorderColor:"transparent",disabledOutlineTextColor:k,disabledOutlineBorderColor:k,outlineHoverColor:R,outlineTextColor:z,outlineBorderColor:z,outlineFocusColor:I},secondary:{backgroundColor:"transparent",textColor:Y,borderColor:Y,hoverColor:R,focusColor:T,disabledBackgroundColor:R,disabledOutlineTextColor:W,disabledBorderColor:X,disabledOutlineBorderColor:X,disabledTextColor:W,outlineHoverColor:R,outlineTextColor:Y,outlineBorderColor:Y,outlineFocusColor:T},error:{backgroundColor:"transparent",textColor:G,borderColor:J,hoverColor:ee,focusColor:N,disabledBackgroundColor:"transparent",disabledBorderColor:J,disabledTextColor:J,disabledOutlineTextColor:J,disabledOutlineBorderColor:J,outlineHoverColor:ee,outlineTextColor:G,outlineBorderColor:J,outlineFocusColor:N},success:{backgroundColor:"transparent",textColor:te,borderColor:te,hoverColor:re,focusColor:F,disabledBackgroundColor:"transparent",disabledOutlineTextColor:te,disabledOutlineBorderColor:te,disabledTextColor:ne,disabledBorderColor:ne,outlineHoverColor:re,outlineTextColor:te,outlineBorderColor:te,outlineFocusColor:F},filter:{backgroundColor:q,textColor:U,borderColor:X,hoverColor:R,hoverTextColor:z,hoverBorderColor:z,focusColor:Q,disabledOutlineTextColor:W,disabledOutlineBorderColor:X,disabledBackgroundColor:"transparent",disabledTextColor:W,disabledBorderColor:X,outlineHoverColor:R,outlineTextColor:z,outlineBorderColor:z,outlineFocusColor:Q},ghost:{backgroundColor:"transparent",textColor:z,borderColor:"transparent",hoverColor:R,focusColor:S,disabledBackgroundColor:"transparent",disabledTextColor:k,disabledBorderColor:"transparent",disabledOutlineTextColor:k,disabledOutlineBorderColor:k,outlineHoverColor:R,outlineTextColor:z,outlineBorderColor:z,outlineFocusColor:I},ghostSecondary:{backgroundColor:$,textColor:Y,borderColor:"trasparent",hoverColor:q,focusColor:K,disabledBackgroundColor:$,disabledTextColor:W,disabledBorderColor:"transparent",disabledOutlineBorderColor:X,disabledOutlineTextColor:k,outlineHoverColor:R,outlineTextColor:Y,outlineBorderColor:Y,outlineFocusColor:T}},ce=(e,t)=>{if(e&&t===P.Variant.filter)return a`
|
|
2
2
|
padding: 0.75rem;
|
|
3
3
|
border: 1px solid ${ae.filter.disabledBorderColor};
|
|
4
4
|
background-color: 1px solid ${ae.filter.disabledBackgroundColor};
|
|
@@ -2429,7 +2429,8 @@ import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import n,{css as
|
|
|
2429
2429
|
}
|
|
2430
2430
|
}
|
|
2431
2431
|
|
|
2432
|
-
.orange,
|
|
2432
|
+
.orange,
|
|
2433
|
+
.warning {
|
|
2433
2434
|
border-color: ${e=>e.disableAction?e.theme.warning.warningLower2:e.theme.warning.warningLower};
|
|
2434
2435
|
background: ${A.orange.orange50};
|
|
2435
2436
|
font-family: Poppins;
|
|
@@ -2454,7 +2455,8 @@ import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import n,{css as
|
|
|
2454
2455
|
}
|
|
2455
2456
|
}
|
|
2456
2457
|
|
|
2457
|
-
.orange-inverted,
|
|
2458
|
+
.orange-inverted,
|
|
2459
|
+
.warning-inverted {
|
|
2458
2460
|
background-color: ${A.orange.orange500};
|
|
2459
2461
|
border-width: 0px;
|
|
2460
2462
|
> .label {
|
|
@@ -2474,6 +2476,51 @@ import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import n,{css as
|
|
|
2474
2476
|
}
|
|
2475
2477
|
}
|
|
2476
2478
|
|
|
2479
|
+
.insight {
|
|
2480
|
+
border-color: ${e=>e.disableAction?A.yellow.yellow100:A.yellow.yellow200};
|
|
2481
|
+
background: ${A.yellow.yellow50};
|
|
2482
|
+
font-family: Poppins;
|
|
2483
|
+
font-size: 12px;
|
|
2484
|
+
font-style: normal;
|
|
2485
|
+
font-weight: 500;
|
|
2486
|
+
line-height: 16px;
|
|
2487
|
+
.label {
|
|
2488
|
+
color: ${A.yellow.yellow800};
|
|
2489
|
+
}
|
|
2490
|
+
|
|
2491
|
+
.action-container {
|
|
2492
|
+
svg {
|
|
2493
|
+
fill: ${A.yellow.yellow800};
|
|
2494
|
+
}
|
|
2495
|
+
}
|
|
2496
|
+
|
|
2497
|
+
.icon {
|
|
2498
|
+
svg {
|
|
2499
|
+
fill: ${A.yellow.yellow800} !important;
|
|
2500
|
+
}
|
|
2501
|
+
}
|
|
2502
|
+
}
|
|
2503
|
+
|
|
2504
|
+
.insight-inverted {
|
|
2505
|
+
background-color: ${A.yellow.yellow500};
|
|
2506
|
+
border-width: 0px;
|
|
2507
|
+
> .label {
|
|
2508
|
+
color: ${e=>e.theme.white.white};
|
|
2509
|
+
}
|
|
2510
|
+
|
|
2511
|
+
.action-container {
|
|
2512
|
+
svg {
|
|
2513
|
+
fill: ${e=>e.theme.grey.grey250} !important;
|
|
2514
|
+
}
|
|
2515
|
+
}
|
|
2516
|
+
|
|
2517
|
+
.icon {
|
|
2518
|
+
svg {
|
|
2519
|
+
fill: ${e=>e.theme.white.white} !important;
|
|
2520
|
+
}
|
|
2521
|
+
}
|
|
2522
|
+
}
|
|
2523
|
+
|
|
2477
2524
|
.grey {
|
|
2478
2525
|
border-color: ${e=>e.disableAction?e.theme.grey.grey250:e.theme.grey.grey300};
|
|
2479
2526
|
background: ${e=>e.disableAction?e.theme.white.white:e.theme.grey.grey5};
|
|
@@ -2518,7 +2565,7 @@ import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import n,{css as
|
|
|
2518
2565
|
}
|
|
2519
2566
|
}
|
|
2520
2567
|
}
|
|
2521
|
-
`;function Ya(r){const{size:n,type:a,label:c,inverted:i,avatar:o,icon:s,showActionButton:l,disable:h,onClose:v,onClick:u}=r,[g,m]=p(!1);return e($a,{onMouseEnter:()=>m(!0),onMouseLeave:()=>m(!1),disableAction:!h&&!g,children:t("div",{onClick:u,className:`tag ${n||"default"} ${a||"secondary"} ${i
|
|
2568
|
+
`;function Ya(r){const{size:n,type:a,label:c,inverted:i,avatar:o,icon:s,showActionButton:l,disable:h,onClose:v,onClick:u}=r,[g,m]=p(!1);return e($a,{onMouseEnter:()=>m(!0),onMouseLeave:()=>m(!1),disableAction:!h&&!g,children:t("div",{onClick:u,className:`tag ${n||"default"} ${a||"secondary"} ${i?`${a||"warning"}-inverted`:""} ${h?"disabled":""}`,children:[o&&e("div",{className:"avatar",children:e("img",{src:o})}),s&&e("div",{className:"icon",children:s}),c&&e("div",{className:`label ${n||"default"}__label`,children:c||"test"}),r?.children&&e("div",{className:"tag-body",children:r?.children}),l&&e("div",{onClick:v,className:"action-container",children:e("svg",{viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M9.72683 5.33301L8.00016 7.05967L6.2735 5.33301L5.3335 6.27301L7.06016 7.99967L5.3335 9.72634L6.2735 10.6663L8.00016 8.93967L9.72683 10.6663L10.6668 9.72634L8.94016 7.99967L10.6668 6.27301L9.72683 5.33301ZM8.00016 1.33301C4.3135 1.33301 1.3335 4.31301 1.3335 7.99967C1.3335 11.6863 4.3135 14.6663 8.00016 14.6663C11.6868 14.6663 14.6668 11.6863 14.6668 7.99967C14.6668 4.31301 11.6868 1.33301 8.00016 1.33301ZM8.00016 13.333C5.06016 13.333 2.66683 10.9397 2.66683 7.99967C2.66683 5.05967 5.06016 2.66634 8.00016 2.66634C10.9402 2.66634 13.3335 5.05967 13.3335 7.99967C13.3335 10.9397 10.9402 13.333 8.00016 13.333Z"})})})]})})}const Ua=n.div`
|
|
2522
2569
|
width: 100%;
|
|
2523
2570
|
display: flex;
|
|
2524
2571
|
align-items: center;
|
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),t=require("styled-components"),r=require("react"),n=require("react-dom"),a=require("react-viewport-list");function c(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var i,o=c(r);!function(e){var t,r;(t=e.Variant||(e.Variant={})).outline="outline",t.filled="filled",t.filter="filter",t.ghost="ghost",t.ghostSecondary="ghostSecondary",(r=e.ButtonEnum||(e.ButtonEnum={}))[r.primary=0]="primary",r[r.secondary=1]="secondary",r[r.error=2]="error",r[r.success=3]="success"}(i||(i={}));const s={regular:400,medium:500,semiBold:600},l={subtitle1:"\n font-size: 1.5rem;\n font-style: normal;\n line-height: 2rem;\n",subtitle2:"\n font-size: 1.25rem;\n font-style: normal;\n line-height: 1.75rem;\n ",body1:"\n font-size: 1rem;\n font-style: normal;\n line-height: 1.5rem;\n",body2:"\n font-size: 0.875rem;\n font-style: normal;\n line-height: 1.25rem;\n ",prefix:"\n font-weight: 400;\n font-size: 12px;\n line-height: 16px;\n text-transform: uppercase;\n",caption:"\n font-size: 0.75rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1re;\n",link:"\n font-size: 14px;\n line-height: 20px;\n text-decoration-line: underline;\n"},h=e=>{const{category:t,weight:r}=e;return t?`\n ${l[t]}\n font-weight:${(e=>e?s[e]:s.regular)(r)};\n `:l.body1},v={primary:{primary100:"#0B1B2A",primary90:"#1C2E40",primary80:"#2A4055",primary70:"#39526B",primary60:"#455F7B",primary50:"#5F758F",primary40:"#455F7B",primary30:"#9CACC0",primary20:"#C0CEDE",primary10:"#E4EBF8",primary5:"#F9FAFD"},secondary:{secondary100:"#103FE8",secondary90:"#2852EA",secondary80:"#4065ED",secondary70:"#5879EF",secondary60:"#708CF1",secondary50:"#889FF4",secondary40:"#9FB2F6",secondary30:"#B7C5F8",secondary20:"#CFD9FA",secondary10:"#E7ECFD",secondary5:"#F3F5FE"},tertiary:{tertiary100:"#174189",tertiary90:"#2E5495",tertiary80:"#4567A1",tertiary70:"#5D7AAC",tertiary60:"#748DB8",tertiary50:"#8BA0C4",tertiary40:"#A2B3D0",tertiary30:"#B9C6DC",tertiary20:"#D1D9E7",tertiary10:"#E8ECF3",tertiary5:"#F3F5F9"},accent:{accent500:"#BD9E2C",accent100:"#ECC537",accent75:"#FFC665",accent50:"#F4DC87",accent15:"#FFF4E0"},link:{linkHigh:"#002C99",linkMedium:"#0053CB",linkLow:"#5D7FFF"},error:{errorHigh:"#AB000D",errorMedium:"#E53935",errorLow:"#FF6F60",errorLow2:"#F8B4B4",errorLow3:"#FDE8E8",errorLower:"#FCF4F4"},success:{successDark:"#009624",successMedium:"#00C853",successLow:"#5EFC82"},black:{blackHigh:"#212121",blackMedium:"#666666",blackLow:"#757575",black:"#000000"},white:{white:"#FFFFFF"},grey:{grey5:"#F9FAFD",grey10:"#F2F5FA",grey20:"#C0CEDE",grey30:"#9CACC0",grey50:"#F9FAFD",grey90:"#1C2E40",grey100:"#F5F7FA",grey200:"#
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),t=require("styled-components"),r=require("react"),n=require("react-dom"),a=require("react-viewport-list");function c(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var i,o=c(r);!function(e){var t,r;(t=e.Variant||(e.Variant={})).outline="outline",t.filled="filled",t.filter="filter",t.ghost="ghost",t.ghostSecondary="ghostSecondary",(r=e.ButtonEnum||(e.ButtonEnum={}))[r.primary=0]="primary",r[r.secondary=1]="secondary",r[r.error=2]="error",r[r.success=3]="success"}(i||(i={}));const s={regular:400,medium:500,semiBold:600},l={subtitle1:"\n font-size: 1.5rem;\n font-style: normal;\n line-height: 2rem;\n",subtitle2:"\n font-size: 1.25rem;\n font-style: normal;\n line-height: 1.75rem;\n ",body1:"\n font-size: 1rem;\n font-style: normal;\n line-height: 1.5rem;\n",body2:"\n font-size: 0.875rem;\n font-style: normal;\n line-height: 1.25rem;\n ",prefix:"\n font-weight: 400;\n font-size: 12px;\n line-height: 16px;\n text-transform: uppercase;\n",caption:"\n font-size: 0.75rem;\n font-style: normal;\n font-weight: 400;\n line-height: 1re;\n",link:"\n font-size: 14px;\n line-height: 20px;\n text-decoration-line: underline;\n"},h=e=>{const{category:t,weight:r}=e;return t?`\n ${l[t]}\n font-weight:${(e=>e?s[e]:s.regular)(r)};\n `:l.body1},v={primary:{primary100:"#0B1B2A",primary90:"#1C2E40",primary80:"#2A4055",primary70:"#39526B",primary60:"#455F7B",primary50:"#5F758F",primary40:"#455F7B",primary30:"#9CACC0",primary20:"#C0CEDE",primary10:"#E4EBF8",primary5:"#F9FAFD"},secondary:{secondary100:"#103FE8",secondary90:"#2852EA",secondary80:"#4065ED",secondary70:"#5879EF",secondary60:"#708CF1",secondary50:"#889FF4",secondary40:"#9FB2F6",secondary30:"#B7C5F8",secondary20:"#CFD9FA",secondary10:"#E7ECFD",secondary5:"#F3F5FE"},tertiary:{tertiary100:"#174189",tertiary90:"#2E5495",tertiary80:"#4567A1",tertiary70:"#5D7AAC",tertiary60:"#748DB8",tertiary50:"#8BA0C4",tertiary40:"#A2B3D0",tertiary30:"#B9C6DC",tertiary20:"#D1D9E7",tertiary10:"#E8ECF3",tertiary5:"#F3F5F9"},accent:{accent500:"#BD9E2C",accent100:"#ECC537",accent75:"#FFC665",accent50:"#F4DC87",accent15:"#FFF4E0"},link:{linkHigh:"#002C99",linkMedium:"#0053CB",linkLow:"#5D7FFF"},error:{errorHigh:"#AB000D",errorMedium:"#E53935",errorLow:"#FF6F60",errorLow2:"#F8B4B4",errorLow3:"#FDE8E8",errorLower:"#FCF4F4"},success:{successDark:"#009624",successMedium:"#00C853",successLow:"#5EFC82"},black:{blackHigh:"#212121",blackMedium:"#666666",blackLow:"#757575",black:"#000000"},white:{white:"#FFFFFF"},grey:{grey5:"#F9FAFD",grey10:"#F2F5FA",grey20:"#C0CEDE",grey30:"#9CACC0",grey50:"#F9FAFD",grey90:"#1C2E40",grey100:"#F5F7FA",grey200:"#E4E9F2",grey250:"#e4e9f2",grey300:"#C8D2DE",grey400:"#A1AFC0",grey500:"#798CA4",grey600:"#5F758F",grey700:"#455F7B",grey800:"#2A4055",grey900:"#1C2E40",grey1000:"#0B1B2A",greyHigh:"#C2C2C2",greyMedium:"#E5E5E5",greyLow:"#F5F5F5"},warning:{warningHigh:"#C67100",warningMedium:"#FFA000",warningLow:"#FFD149",warningLower:"#FED7AA",warningLower2:"#FFEDD5"},disabled:{disabledHigh:"#B1B1B1",disabledMedium:"#CFCFCF",disabledLow:"#ECECEC"},text:{primary:"#24292E"},input:{focused:"0px 0px 0px 4px rgba(16, 63, 232, 0.25)",focusedShadowButton:"0px 0px 0px 4px rgba(16, 63, 232, 0.30)",focusedShadow:"0px 0px 0px 4px rgba(16, 63, 232, 0.25)",focusedShadowFilter:"rgba(102, 130, 231, 0.30)",focusedShadowError:" 0px 0px 0px 4px rgba(239, 68, 68, 0.25)",focusedSecondary:"rgba(102, 130, 231, 0.30)"},button:{primaryButton:"0px 0px 0px 4px rgba(16, 63, 232, 0.30)",primaryOutlineButton:"0px 0px 0px 4px rgba(16, 63, 232, 0.30)",secondaryButton:"0px 0px 0px 4px rgba(28, 46, 64, 0.10)",errorButton:"0px 0px 0px 4px rgba(229, 57, 53, 0.20)",successButton:"0px 0px 0px 4px rgba(45, 161, 96, 0.20)",filterButton:"0px 0px 0px 4px rgba(102, 130, 231, 0.30)"},green:{green40:"#2DA170",green10:"#9FD4B5",green8:"#D8F0E0",green5:"#F1FAF4",green50:"#F1FAF4",green100:"#D8F0E0",green200:"#9FD4B5",green300:"#52B87A",green400:"#2DA170",green500:"#10855E",green600:"#21765A",green700:"#246650",green800:"#0D533C",green900:"#0A402E",green1000:"#072B1F"},blue:{blue5:"#F6F8FE",blue50:"#F6F8FE",blue100:"#E7ECFD",blue200:"#CFD9FA",blue300:"#B7C5F8",blue400:"#9FB2F6",blue500:"#889FF4",blue600:"#708CF1",blue700:"#5879EF",blue800:"#4065ED",blue900:"#2852EA",blue1000:"#103FE8"},yellow:{yellow50:"#FCF9DC",yellow100:"#FAF4B4",yellow200:"#FAEC88",yellow300:"#F9DD69",yellow400:"#FACC15",yellow500:"#EAB308",yellow600:"#CA8A04",yellow700:"#A16207",yellow800:"#854D0E",yellow900:"#713F12",yellow1000:"#713F12"},red:{red050:"#FDF2F2",red50:"#FDF2F2",red100:"#FDE8E8",red200:"#FBD5D5",red300:"#F8B4B4",red400:"#F98080",red500:"#F05252",red600:"#DF4242",red700:"#CE3434",red800:"#9B1C1C",red900:"#771D1D"},orange:{orange050:"#FFF7ED",orange50:"#FFF7ED",orange100:"#FFEDD5",orange200:"#FED7AA",orange300:"#FDBA74",orange400:"#FFA84C",orange500:"#F98016",orange600:"#EA580C",orange700:"#C2410C",orange800:"#9A3412",orange900:"#7C2D12"},scrollbar:{track:"#F2F5FA",thumb:"#9CACC0"},transparent:{blueHover:"rgba(16, 63, 232, 0.06)",transparent:"#ffffff78"}},p={...v},{blue:{blue1000:u,blue900:g,blue300:m,blue100:d,blue50:f},button:{primaryButton:_,primaryOutlineButton:w,secondaryButton:b,errorButton:y,successButton:x,filterButton:Z},white:{white:O},grey:{grey900:M,grey800:E,grey400:H,grey300:P,grey100:j,grey50:V},red:{red700:C,red300:A,red50:L},green:{green400:z,green5:B,green200:k}}=p,S={primary:{backgroundColor:u,textColor:O,borderColor:"transparent",hoverColor:g,focusColor:_,disabledBackgroundColor:m,disabledTextColor:O,disabledBorderColor:"transparent",disabledOutlineTextColor:m,disabledOutlineBorderColor:m,outlineHoverColor:f,outlineTextColor:u,outlineBorderColor:u,outlineFocusColor:w},secondary:{backgroundColor:"transparent",textColor:M,borderColor:M,hoverColor:f,focusColor:b,disabledBackgroundColor:f,disabledOutlineTextColor:H,disabledBorderColor:P,disabledOutlineBorderColor:P,disabledTextColor:H,outlineHoverColor:f,outlineTextColor:M,outlineBorderColor:M,outlineFocusColor:b},error:{backgroundColor:"transparent",textColor:C,borderColor:A,hoverColor:L,focusColor:y,disabledBackgroundColor:"transparent",disabledBorderColor:A,disabledTextColor:A,disabledOutlineTextColor:A,disabledOutlineBorderColor:A,outlineHoverColor:L,outlineTextColor:C,outlineBorderColor:A,outlineFocusColor:y},success:{backgroundColor:"transparent",textColor:z,borderColor:z,hoverColor:B,focusColor:x,disabledBackgroundColor:"transparent",disabledOutlineTextColor:z,disabledOutlineBorderColor:z,disabledTextColor:k,disabledBorderColor:k,outlineHoverColor:B,outlineTextColor:z,outlineBorderColor:z,outlineFocusColor:x},filter:{backgroundColor:V,textColor:E,borderColor:P,hoverColor:f,hoverTextColor:u,hoverBorderColor:u,focusColor:Z,disabledOutlineTextColor:H,disabledOutlineBorderColor:P,disabledBackgroundColor:"transparent",disabledTextColor:H,disabledBorderColor:P,outlineHoverColor:f,outlineTextColor:u,outlineBorderColor:u,outlineFocusColor:Z},ghost:{backgroundColor:"transparent",textColor:u,borderColor:"transparent",hoverColor:f,focusColor:d,disabledBackgroundColor:"transparent",disabledTextColor:m,disabledBorderColor:"transparent",disabledOutlineTextColor:m,disabledOutlineBorderColor:m,outlineHoverColor:f,outlineTextColor:u,outlineBorderColor:u,outlineFocusColor:w},ghostSecondary:{backgroundColor:O,textColor:M,borderColor:"trasparent",hoverColor:V,focusColor:j,disabledBackgroundColor:O,disabledTextColor:H,disabledBorderColor:"transparent",disabledOutlineBorderColor:P,disabledOutlineTextColor:m,outlineHoverColor:f,outlineTextColor:M,outlineBorderColor:M,outlineFocusColor:b}},R=(e,r)=>{if(e&&r===i.Variant.filter)return t.css`
|
|
2
2
|
padding: 0.75rem;
|
|
3
3
|
border: 1px solid ${S.filter.disabledBorderColor};
|
|
4
4
|
background-color: 1px solid ${S.filter.disabledBackgroundColor};
|
|
@@ -2429,7 +2429,8 @@
|
|
|
2429
2429
|
}
|
|
2430
2430
|
}
|
|
2431
2431
|
|
|
2432
|
-
.orange,
|
|
2432
|
+
.orange,
|
|
2433
|
+
.warning {
|
|
2433
2434
|
border-color: ${e=>e.disableAction?e.theme.warning.warningLower2:e.theme.warning.warningLower};
|
|
2434
2435
|
background: ${v.orange.orange50};
|
|
2435
2436
|
font-family: Poppins;
|
|
@@ -2454,7 +2455,8 @@
|
|
|
2454
2455
|
}
|
|
2455
2456
|
}
|
|
2456
2457
|
|
|
2457
|
-
.orange-inverted,
|
|
2458
|
+
.orange-inverted,
|
|
2459
|
+
.warning-inverted {
|
|
2458
2460
|
background-color: ${v.orange.orange500};
|
|
2459
2461
|
border-width: 0px;
|
|
2460
2462
|
> .label {
|
|
@@ -2474,6 +2476,51 @@
|
|
|
2474
2476
|
}
|
|
2475
2477
|
}
|
|
2476
2478
|
|
|
2479
|
+
.insight {
|
|
2480
|
+
border-color: ${e=>e.disableAction?v.yellow.yellow100:v.yellow.yellow200};
|
|
2481
|
+
background: ${v.yellow.yellow50};
|
|
2482
|
+
font-family: Poppins;
|
|
2483
|
+
font-size: 12px;
|
|
2484
|
+
font-style: normal;
|
|
2485
|
+
font-weight: 500;
|
|
2486
|
+
line-height: 16px;
|
|
2487
|
+
.label {
|
|
2488
|
+
color: ${v.yellow.yellow800};
|
|
2489
|
+
}
|
|
2490
|
+
|
|
2491
|
+
.action-container {
|
|
2492
|
+
svg {
|
|
2493
|
+
fill: ${v.yellow.yellow800};
|
|
2494
|
+
}
|
|
2495
|
+
}
|
|
2496
|
+
|
|
2497
|
+
.icon {
|
|
2498
|
+
svg {
|
|
2499
|
+
fill: ${v.yellow.yellow800} !important;
|
|
2500
|
+
}
|
|
2501
|
+
}
|
|
2502
|
+
}
|
|
2503
|
+
|
|
2504
|
+
.insight-inverted {
|
|
2505
|
+
background-color: ${v.yellow.yellow500};
|
|
2506
|
+
border-width: 0px;
|
|
2507
|
+
> .label {
|
|
2508
|
+
color: ${e=>e.theme.white.white};
|
|
2509
|
+
}
|
|
2510
|
+
|
|
2511
|
+
.action-container {
|
|
2512
|
+
svg {
|
|
2513
|
+
fill: ${e=>e.theme.grey.grey250} !important;
|
|
2514
|
+
}
|
|
2515
|
+
}
|
|
2516
|
+
|
|
2517
|
+
.icon {
|
|
2518
|
+
svg {
|
|
2519
|
+
fill: ${e=>e.theme.white.white} !important;
|
|
2520
|
+
}
|
|
2521
|
+
}
|
|
2522
|
+
}
|
|
2523
|
+
|
|
2477
2524
|
.grey {
|
|
2478
2525
|
border-color: ${e=>e.disableAction?e.theme.grey.grey250:e.theme.grey.grey300};
|
|
2479
2526
|
background: ${e=>e.disableAction?e.theme.white.white:e.theme.grey.grey5};
|
|
@@ -2518,7 +2565,7 @@
|
|
|
2518
2565
|
}
|
|
2519
2566
|
}
|
|
2520
2567
|
}
|
|
2521
|
-
`;function ia(t){const{size:n,type:a,label:c,inverted:i,avatar:o,icon:s,showActionButton:l,disable:h,onClose:v,onClick:p}=t,[u,g]=r.useState(!1);return e.jsx(ca,{onMouseEnter:()=>g(!0),onMouseLeave:()=>g(!1),disableAction:!h&&!u,children:e.jsxs("div",{onClick:p,className:`tag ${n||"default"} ${a||"secondary"} ${i
|
|
2568
|
+
`;function ia(t){const{size:n,type:a,label:c,inverted:i,avatar:o,icon:s,showActionButton:l,disable:h,onClose:v,onClick:p}=t,[u,g]=r.useState(!1);return e.jsx(ca,{onMouseEnter:()=>g(!0),onMouseLeave:()=>g(!1),disableAction:!h&&!u,children:e.jsxs("div",{onClick:p,className:`tag ${n||"default"} ${a||"secondary"} ${i?`${a||"warning"}-inverted`:""} ${h?"disabled":""}`,children:[o&&e.jsx("div",{className:"avatar",children:e.jsx("img",{src:o})}),s&&e.jsx("div",{className:"icon",children:s}),c&&e.jsx("div",{className:`label ${n||"default"}__label`,children:c||"test"}),t?.children&&e.jsx("div",{className:"tag-body",children:t?.children}),l&&e.jsx("div",{onClick:v,className:"action-container",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M9.72683 5.33301L8.00016 7.05967L6.2735 5.33301L5.3335 6.27301L7.06016 7.99967L5.3335 9.72634L6.2735 10.6663L8.00016 8.93967L9.72683 10.6663L10.6668 9.72634L8.94016 7.99967L10.6668 6.27301L9.72683 5.33301ZM8.00016 1.33301C4.3135 1.33301 1.3335 4.31301 1.3335 7.99967C1.3335 11.6863 4.3135 14.6663 8.00016 14.6663C11.6868 14.6663 14.6668 11.6863 14.6668 7.99967C14.6668 4.31301 11.6868 1.33301 8.00016 1.33301ZM8.00016 13.333C5.06016 13.333 2.66683 10.9397 2.66683 7.99967C2.66683 5.05967 5.06016 2.66634 8.00016 2.66634C10.9402 2.66634 13.3335 5.05967 13.3335 7.99967C13.3335 10.9397 10.9402 13.333 8.00016 13.333Z"})})})]})})}const oa=t.div`
|
|
2522
2569
|
width: 100%;
|
|
2523
2570
|
display: flex;
|
|
2524
2571
|
align-items: center;
|
package/dist/package.json
CHANGED
package/dist/themes/colors.ts
CHANGED
|
@@ -90,14 +90,14 @@ const colors: Color = {
|
|
|
90
90
|
grey50: '#F9FAFD',
|
|
91
91
|
grey90: '#1C2E40',
|
|
92
92
|
grey100: '#F5F7FA',
|
|
93
|
-
grey200: '#
|
|
93
|
+
grey200: '#E4E9F2',
|
|
94
94
|
grey250: '#e4e9f2',
|
|
95
95
|
grey300: '#C8D2DE',
|
|
96
96
|
grey400: '#A1AFC0',
|
|
97
97
|
grey500: '#798CA4',
|
|
98
98
|
grey600: '#5F758F',
|
|
99
99
|
grey700: '#455F7B',
|
|
100
|
-
grey800: '#
|
|
100
|
+
grey800: '#2A4055',
|
|
101
101
|
grey900: '#1C2E40',
|
|
102
102
|
grey1000: '#0B1B2A',
|
|
103
103
|
greyHigh: '#C2C2C2',
|
|
@@ -152,6 +152,7 @@ const colors: Color = {
|
|
|
152
152
|
green700: '#246650',
|
|
153
153
|
green800: '#0D533C',
|
|
154
154
|
green900: '#0A402E',
|
|
155
|
+
green1000: '#072B1F',
|
|
155
156
|
},
|
|
156
157
|
blue: {
|
|
157
158
|
blue5: '#F6F8FE',
|
|
@@ -169,16 +170,16 @@ const colors: Color = {
|
|
|
169
170
|
},
|
|
170
171
|
|
|
171
172
|
yellow: {
|
|
172
|
-
yellow50: '#
|
|
173
|
-
yellow100: '#
|
|
174
|
-
yellow200: '#
|
|
175
|
-
yellow300: '#
|
|
173
|
+
yellow50: '#FCF9DC',
|
|
174
|
+
yellow100: '#FAF4B4',
|
|
175
|
+
yellow200: '#FAEC88',
|
|
176
|
+
yellow300: '#F9DD69',
|
|
176
177
|
yellow400: '#FACC15',
|
|
177
178
|
yellow500: '#EAB308',
|
|
178
179
|
yellow600: '#CA8A04',
|
|
179
180
|
yellow700: '#A16207',
|
|
180
181
|
yellow800: '#854D0E',
|
|
181
|
-
yellow900: '#
|
|
182
|
+
yellow900: '#713F12',
|
|
182
183
|
yellow1000: '#713F12',
|
|
183
184
|
},
|
|
184
185
|
|
package/dist/themes/types.d.ts
CHANGED
package/package.json
CHANGED
package/themes/colors.ts
CHANGED
|
@@ -90,14 +90,14 @@ const colors: Color = {
|
|
|
90
90
|
grey50: '#F9FAFD',
|
|
91
91
|
grey90: '#1C2E40',
|
|
92
92
|
grey100: '#F5F7FA',
|
|
93
|
-
grey200: '#
|
|
93
|
+
grey200: '#E4E9F2',
|
|
94
94
|
grey250: '#e4e9f2',
|
|
95
95
|
grey300: '#C8D2DE',
|
|
96
96
|
grey400: '#A1AFC0',
|
|
97
97
|
grey500: '#798CA4',
|
|
98
98
|
grey600: '#5F758F',
|
|
99
99
|
grey700: '#455F7B',
|
|
100
|
-
grey800: '#
|
|
100
|
+
grey800: '#2A4055',
|
|
101
101
|
grey900: '#1C2E40',
|
|
102
102
|
grey1000: '#0B1B2A',
|
|
103
103
|
greyHigh: '#C2C2C2',
|
|
@@ -152,6 +152,7 @@ const colors: Color = {
|
|
|
152
152
|
green700: '#246650',
|
|
153
153
|
green800: '#0D533C',
|
|
154
154
|
green900: '#0A402E',
|
|
155
|
+
green1000: '#072B1F',
|
|
155
156
|
},
|
|
156
157
|
blue: {
|
|
157
158
|
blue5: '#F6F8FE',
|
|
@@ -169,16 +170,16 @@ const colors: Color = {
|
|
|
169
170
|
},
|
|
170
171
|
|
|
171
172
|
yellow: {
|
|
172
|
-
yellow50: '#
|
|
173
|
-
yellow100: '#
|
|
174
|
-
yellow200: '#
|
|
175
|
-
yellow300: '#
|
|
173
|
+
yellow50: '#FCF9DC',
|
|
174
|
+
yellow100: '#FAF4B4',
|
|
175
|
+
yellow200: '#FAEC88',
|
|
176
|
+
yellow300: '#F9DD69',
|
|
176
177
|
yellow400: '#FACC15',
|
|
177
178
|
yellow500: '#EAB308',
|
|
178
179
|
yellow600: '#CA8A04',
|
|
179
180
|
yellow700: '#A16207',
|
|
180
181
|
yellow800: '#854D0E',
|
|
181
|
-
yellow900: '#
|
|
182
|
+
yellow900: '#713F12',
|
|
182
183
|
yellow1000: '#713F12',
|
|
183
184
|
},
|
|
184
185
|
|