@itcase/ui-web 1.9.105 → 1.9.107
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/cjs/components/Checkbox.js +1 -1
- package/dist/cjs/components/Notification.js +1 -1
- package/dist/components/Checkbox.js +1 -1
- package/dist/components/Notification.js +1 -1
- package/dist/css/styles/bundles.css +14 -0
- package/dist/types/components/Checkbox/Checkbox.appearance.d.ts +40 -1
- package/dist/types/components/Checkbox/Checkbox.interface.d.ts +2 -1
- package/dist/types/components/Checkbox/Checkbox.js +2 -2
- package/dist/types/components/Checkbox/appearance/checkboxDefault.d.ts +40 -1
- package/dist/types/components/Checkbox/appearance/checkboxDefault.js +40 -1
- package/dist/types/components/Notification/Notification.appearance.d.ts +3 -3
- package/dist/types/components/Notification/appearance/notificationError.d.ts +1 -1
- package/dist/types/components/Notification/appearance/notificationError.js +1 -1
- package/dist/types/components/Notification/appearance/notificationInfo.d.ts +1 -1
- package/dist/types/components/Notification/appearance/notificationInfo.js +1 -1
- package/dist/types/components/Notification/appearance/notificationWarning.d.ts +1 -1
- package/dist/types/components/Notification/appearance/notificationWarning.js +1 -1
- package/dist/types/components/Segmented/appearance/segmentedRequire.js +0 -11
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),r=require("clsx"),o=require("@itcase/ui-core/hooks"),c=require("../../primitives_cjs_ocTnUpml.js");require("@rc-component/tooltip"),require("react"),require("react-inlinesvg"),require("@itcase/ui-core/hoc"),require("@itcase/ui-core/utils");const
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("clsx"),o=require("@itcase/ui-core/hooks"),c=require("../../primitives_cjs_ocTnUpml.js");require("@rc-component/tooltip"),require("react"),require("react-inlinesvg"),require("@itcase/ui-core/hoc"),require("@itcase/ui-core/utils");const a={defaultPrimary:{fill:"surfaceSecondary",fillCheckbox:"surfaceSecondary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverQuaternary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},defaultQuaternary:{fill:"surfaceQuaternary",fillCheckbox:"surfaceQuaternary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverQuaternary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},defaultSecondary:{fill:"surfaceSecondary",fillCheckbox:"surfaceSecondary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverQuaternary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},defaultTertiary:{fill:"surfaceTertiary",fillCheckbox:"surfaceTertiary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverQuaternary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},errorPrimary:{fill:"errorTertiary",fillCheckbox:"errorTertiary",fillCheckboxActive:"errorQuaternary",fillCheckboxActiveHover:"errorActiveHoverPrimary",fillCheckboxHover:"errorHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"errorBorderQuaternary",borderColorCheckboxActive:"errorBorderActiveQuaternary",borderColorCheckboxActiveHover:"errorBorderActivePrimary",borderColorCheckboxHover:"errorBorderHoverPrimary"},successPrimary:{fill:"successTertiary",fillCheckbox:"successTertiary",fillCheckboxActive:"successSecondary",fillCheckboxActiveHover:"successActiveHoverPrimary",fillCheckboxHover:"successHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"successBorderSecondary",borderColorCheckboxActive:"successBorderSecondary",borderColorCheckboxActiveHover:"successBorderActivePrimary",borderColorCheckboxHover:"successBorderHoverPrimary"},requirePrimary:{fill:"warningTertiary",fillCheckbox:"warningTertiary",fillCheckboxActive:"warningPrimary",fillCheckboxActiveHover:"warningActiveHoverPrimary",fillCheckboxHover:"warningHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"warningBorderSecondary",borderColorCheckboxActive:"warningBorderSecondary",borderColorCheckboxActiveHover:"warningBorderActivePrimary",borderColorCheckboxHover:"warningBorderHoverPrimary"},disabledPrimary:{fill:"surfaceSecondary",fillCheckbox:"surfaceSecondary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverTertiary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"disabledTextSecondary",descTextColor:"disabledTextSecondary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},sizeXL:{size:"xl",labelTextSize:"s",descTextSize:"xs"},sizeL:{size:"l",labelTextSize:"s",descTextSize:"xs"},sizeM:{size:"m",labelTextSize:"m",descTextSize:"xs"},sizeS:{size:"s",labelTextSize:"s",descTextSize:"xs"},solid:{borderColorCheckbox:"none",borderColorCheckboxActive:"none",borderColorCheckboxActiveHover:"none",borderColorCheckboxHover:"none"},outlined:{fill:"none",fillHover:"none"},full:{},ghost:{fill:"none",fillHover:"none",borderColorCheckbox:"none",borderColorCheckboxActive:"none",borderColorCheckboxActiveHover:"none",borderColorCheckboxHover:"none"},rounded:{shape:"rounded"}},l={appearance:a,setAppearance:e=>{l.appearance=e}};exports.Checkbox=function(a){const{id:i,appearance:s,className:t,dataTestId:b,dataTour:x,label:C,desc:d,checked:v,disabled:h,indeterminate:u,Tag:f="label",value:n,before:k,after:y,isActive:T,isChecked:H,isDisabled:A,isSkeleton:m,onBlur:_,onChange:P,onFocus:B}=a,S=o.useAppearanceConfig(s,l,A),p=o.useDevicePropsGenerator(a,S),{fillCheckboxActiveClass:Q,fillCheckboxActiveHoverClass:g,fillCheckboxClass:z,fillCheckboxHoverClass:$,fillCheckmarkClass:j,fillClass:w,fillHoverClass:q,labelTextColor:N,labelTextSize:W,labelTextWeight:F,descTextColor:D,descTextSize:L,descTextWeight:G,borderColorCheckboxActiveClass:I,borderColorCheckboxActiveHoverClass:M,borderColorCheckboxClass:X,borderColorCheckboxHoverClass:E,heightClass:J,shapeClass:K,sizeClass:O,widthClass:R}=p;return e.jsxs(f,{className:r(t,"checkbox",w&&`fill_${w}`,q&&`fill_${q}`,O&&`checkbox_size_${O}`,v?Q&&`checkbox_fill_active_${Q}`:z&&`checkbox_fill_${z}`,v?g&&`checkbox_fill_active_hover_${g}`:$&&`checkbox_fill_hover_${$}`,v?I&&`checkbox_border-color_active_${I}`:X&&`checkbox_border-color_${X}`,v?M&&`checkbox_border-color_active_hover_${M}`:E&&`checkbox_border-color_hover_${E}`,R&&`checkbox_width_${R}`,J&&`checkbox_height_${J}`,m&&"skeleton"),"data-testid":b,"data-tour":x,htmlFor:"label"===f&&i,children:[k,e.jsxs("div",{className:"checkbox__item",children:[e.jsx("input",{id:i,className:"checkbox__input",type:"checkbox",checked:T||H||v,disabled:A||h,value:n,onBlur:_,onChange:P,onFocus:B}),e.jsx("div",{className:r("checkbox__state",K&&`shape_${K}`),children:" "}),e.jsx("div",{className:r(u?"checkbox__state-indeterminate":"checkbox__state-checkmark",(v||u)&&j&&`fill_${j}`),children:" "})]}),C&&e.jsx(c.Text,{className:"checkbox__label",size:W,textColor:N,textWeight:F,children:C}),d&&e.jsx(c.Text,{className:"checkbox__desc",size:L,textColor:D,textWeight:G,children:d}),y&&e.jsx("div",{className:"checkbox__after",children:y})]})},exports.checkboxAppearance=a,exports.checkboxConfig=l;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),r=require("clsx"),i=require("@itcase/ui-core/hooks"),o=require("@itcase/ui-core/utils"),a=require("../../Button_cjs_ConzdKae.js"),t=require("../../primitives_cjs_ocTnUpml.js"),s=require("../../Loader_cjs_nwF8h8Ku.js"),c=require("../../default_cjs_BMbs2it-.js"),n=require("@itcase/ui-core/context");require("react"),require("@itcase/common"),require("@rc-component/tooltip"),require("react-inlinesvg"),require("@itcase/ui-core/hoc");const l={...{defaultPrimary:{fill:"surfacePrimary",fillHover:"surfacePrimary",titleTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",textColor:"surfaceTextPrimary",buttonAppearance:"accentPrimary sizeXXL solid rounded",loaderAppearance:"accentTertiary sizeS ghost rounded",closeIcon:c.icons24.Action.Close,closeIconAppearance:"surfacePrimary size12_12 ghost circular"}},circular:{shape:"circular"},rounded:{shape:"rounded"},roundedXL:{shape:"roundedXL"},roundedL:{shape:"roundedL"},roundedM:{shape:"roundedM"},roundedS:{shape:"roundedS"},sizeM:{size:"m",titleTextSize:"xxl",descTextSize:"m",loaderAppearanceSize:"sizeS",closeIconAppearanceSize:"size24_24"},sizeS:{size:"m",titleTextSize:"xl",descTextSize:"m",loaderAppearanceSize:"sizeS",closeIconAppearanceSize:"size24_24"},solid:{borderColor:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none"},...{errorPrimary:{fill:"errorPrimary",fillHover:"errorPrimary",titleTextColor:"errorTextPrimary",descTextColor:"errorTextPrimary",borderColor:"errorBorderPrimary",textColor:"errorTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"errorPrimary sizeS solid rounded",closeIcon:c.icons24.Action.Close,closeIconAppearance:"
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("clsx"),i=require("@itcase/ui-core/hooks"),o=require("@itcase/ui-core/utils"),a=require("../../Button_cjs_ConzdKae.js"),t=require("../../primitives_cjs_ocTnUpml.js"),s=require("../../Loader_cjs_nwF8h8Ku.js"),c=require("../../default_cjs_BMbs2it-.js"),n=require("@itcase/ui-core/context");require("react"),require("@itcase/common"),require("@rc-component/tooltip"),require("react-inlinesvg"),require("@itcase/ui-core/hoc");const l={...{defaultPrimary:{fill:"surfacePrimary",fillHover:"surfacePrimary",titleTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",textColor:"surfaceTextPrimary",buttonAppearance:"accentPrimary sizeXXL solid rounded",loaderAppearance:"accentTertiary sizeS ghost rounded",closeIcon:c.icons24.Action.Close,closeIconAppearance:"surfacePrimary size12_12 ghost circular"}},circular:{shape:"circular"},rounded:{shape:"rounded"},roundedXL:{shape:"roundedXL"},roundedL:{shape:"roundedL"},roundedM:{shape:"roundedM"},roundedS:{shape:"roundedS"},sizeM:{size:"m",titleTextSize:"xxl",descTextSize:"m",loaderAppearanceSize:"sizeS",closeIconAppearanceSize:"size24_24"},sizeS:{size:"m",titleTextSize:"xl",descTextSize:"m",loaderAppearanceSize:"sizeS",closeIconAppearanceSize:"size24_24"},solid:{borderColor:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none"},...{errorPrimary:{fill:"errorPrimary",fillHover:"errorPrimary",titleTextColor:"errorTextPrimary",descTextColor:"errorTextPrimary",borderColor:"errorBorderPrimary",textColor:"errorTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"errorPrimary sizeS solid rounded",closeIcon:c.icons24.Action.Close,closeIconAppearance:"errorPrimary size12_12 solid circular"}},...{infoPrimary:{fill:"infoPrimary",fillHover:"infoPrimary",titleTextColor:"infoTextPrimary",descTextColor:"infoTextPrimary",borderColor:"infoBorderPrimary",textColor:"infoTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"infoPrimary sizeS solid rounded",closeIcon:c.icons24.Action.Close,closeIconAppearance:"infoPrimary size12_12 solid circular"}},...{successPrimary:{fill:"successPrimary",fillHover:"successPrimary",titleTextColor:"successTextPrimary",descTextColor:"successTextPrimary",borderColor:"successBorderPrimary",textColor:"successTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"successPrimary sizeS solid rounded",closeIcon:c.icons24.Action.Close,closeIconAppearance:"successPrimary size12_12 ghost circular"}},...{warningPrimary:{fill:"warningPrimary",fillHover:"warningPrimary",titleTextColor:"warningTextPrimary",descTextColor:"warningTextPrimary",borderColor:"surfaceBorderPrimary",textColor:"warningTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"warningPrimary sizeS solid rounded",closeIcon:c.icons24.Action.Close,closeIconAppearance:"warningPrimary size12_12 solid circular"}}},d={appearance:l,setAppearance:e=>{d.appearance=e}};function p(c){const{id:n,appearance:l,className:p,dataTestId:u,dataTour:m,type:f="float",title:x,text:y,before:P,after:_,isSkeleton:C,isLoading:z,onClickButton:T,onClickClose:A}=c,S=i.useAppearanceConfig(l,d),I=i.useDevicePropsGenerator(c,S),{fillClass:h,fillHoverClass:b,titleTextColor:g,titleTextSize:j,descTextColor:v,descTextSize:L,buttonAppearance:N,buttonLabel:q,elevationClass:w,loaderAppearance:X,loaderAppearanceSize:k,loaderFill:B,loaderItemFill:$,loaderSize:H,loaderType:F="dot",shapeClass:M,sizeClass:K,widthClass:D,closeIcon:G,closeIconAppearance:W,closeIconAppearanceSize:E,closeIconSrc:J}=I,{styles:O}=i.useStyles(c);return e.jsxs("div",{className:r("notification__item",`notification__item_${f}`,D&&`width_${D}`,w&&`elevation_${w}`,h&&`fill_${h}`,K&&`notification__item_size_${K}`,f&&`notification__item_type_${f}`,b&&`fill_${b}`,C&&"skeleton",M&&`shape_${M}`),"data-testid":u,"data-tour":m,style:O,children:[P,e.jsxs("div",{className:r(p,"notification__item-wrapper"),children:[x&&e.jsx(t.Text,{className:"notification__item-title",size:j,textColor:g,children:x}),y&&e.jsx(t.Text,{className:"notification__item-text",size:L,textColor:v,children:y}),z&&e.jsx(s.Loader,{appearance:o.mergeAppearanceKeys(X,k),className:r(p,"button__loader"),type:F,size:H,fill:B,itemFill:$}),A&&e.jsx(t.Icon,{appearance:o.mergeAppearanceKeys(W,E),className:r("notification__item-close","cursor_type_pointer"),imageSrc:J,SvgImage:G,onClick:()=>A&&A(n)}),T&&q&&e.jsx(a.Button,{appearance:N,className:"notification__item-button",width:"fill",label:q,onClick:T})]}),_]})}exports.Notification=p,exports.NotificationWrapper=function(i){const o=n.useNotifications(),{hideNotifications:a}=n.useNotificationsAPI(),{className:t,dataTestId:s,dataTour:c}=i;return e.jsx("div",{className:r("notification",t),"data-testid":s,"data-tour":c,children:e.jsx("div",{className:"notification__wrapper",children:o.map(r=>e.jsx(p,{id:r.id,appearance:r.appearance,type:r.type,title:r.title,status:r.status,text:r.text,buttonLabel:r.buttonLabel,after:r.after,closeIcon:r.closeIcon,closeIconSrc:r.closeIconSrc,isLoading:r.isLoading,onClickButton:r.onClickButton,onClickClose:a},r.id))})})},exports.notificationAppearance=l,exports.notificationConfig=d;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as r}from"react/jsx-runtime";import o from"clsx";import{useAppearanceConfig as c,useDevicePropsGenerator as
|
|
1
|
+
import{jsxs as e,jsx as r}from"react/jsx-runtime";import o from"clsx";import{useAppearanceConfig as c,useDevicePropsGenerator as a}from"@itcase/ui-core/hooks";import{T as l}from"../primitives_es_BQqNcRQk.js";import"@rc-component/tooltip";import"react";import"react-inlinesvg";import"@itcase/ui-core/hoc";import"@itcase/ui-core/utils";const i={defaultPrimary:{fill:"surfaceSecondary",fillCheckbox:"surfaceSecondary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverQuaternary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},defaultQuaternary:{fill:"surfaceQuaternary",fillCheckbox:"surfaceQuaternary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverQuaternary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},defaultSecondary:{fill:"surfaceSecondary",fillCheckbox:"surfaceSecondary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverQuaternary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},defaultTertiary:{fill:"surfaceTertiary",fillCheckbox:"surfaceTertiary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverQuaternary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},errorPrimary:{fill:"errorTertiary",fillCheckbox:"errorTertiary",fillCheckboxActive:"errorQuaternary",fillCheckboxActiveHover:"errorActiveHoverPrimary",fillCheckboxHover:"errorHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"errorBorderQuaternary",borderColorCheckboxActive:"errorBorderActiveQuaternary",borderColorCheckboxActiveHover:"errorBorderActivePrimary",borderColorCheckboxHover:"errorBorderHoverPrimary"},successPrimary:{fill:"successTertiary",fillCheckbox:"successTertiary",fillCheckboxActive:"successSecondary",fillCheckboxActiveHover:"successActiveHoverPrimary",fillCheckboxHover:"successHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"successBorderSecondary",borderColorCheckboxActive:"successBorderSecondary",borderColorCheckboxActiveHover:"successBorderActivePrimary",borderColorCheckboxHover:"successBorderHoverPrimary"},requirePrimary:{fill:"warningTertiary",fillCheckbox:"warningTertiary",fillCheckboxActive:"warningPrimary",fillCheckboxActiveHover:"warningActiveHoverPrimary",fillCheckboxHover:"warningHoverTertiary",labelTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColorCheckbox:"warningBorderSecondary",borderColorCheckboxActive:"warningBorderSecondary",borderColorCheckboxActiveHover:"warningBorderActivePrimary",borderColorCheckboxHover:"warningBorderHoverPrimary"},disabledPrimary:{fill:"surfaceSecondary",fillCheckbox:"surfaceSecondary",fillCheckboxActive:"surfaceQuaternary",fillCheckboxActiveHover:"surfaceActiveHoverTertiary",fillCheckboxHover:"surfaceHoverTertiary",labelTextColor:"disabledTextSecondary",descTextColor:"disabledTextSecondary",borderColorCheckbox:"surfaceBorderQuaternary",borderColorCheckboxActive:"surfaceBorderQuaternary",borderColorCheckboxActiveHover:"surfaceBorderActivePrimary",borderColorCheckboxHover:"surfaceBorderHoverPrimary"},sizeXL:{size:"xl",labelTextSize:"s",descTextSize:"xs"},sizeL:{size:"l",labelTextSize:"s",descTextSize:"xs"},sizeM:{size:"m",labelTextSize:"m",descTextSize:"xs"},sizeS:{size:"s",labelTextSize:"s",descTextSize:"xs"},solid:{borderColorCheckbox:"none",borderColorCheckboxActive:"none",borderColorCheckboxActiveHover:"none",borderColorCheckboxHover:"none"},outlined:{fill:"none",fillHover:"none"},full:{},ghost:{fill:"none",fillHover:"none",borderColorCheckbox:"none",borderColorCheckboxActive:"none",borderColorCheckboxActiveHover:"none",borderColorCheckboxHover:"none"},rounded:{shape:"rounded"}},t={appearance:i,setAppearance:e=>{t.appearance=e}};function s(i){const{id:s,appearance:b,className:C,dataTestId:x,dataTour:d,label:v,desc:h,checked:f,disabled:n,indeterminate:u,Tag:k="label",value:y,before:m,after:T,isActive:H,isChecked:A,isDisabled:_,isSkeleton:P,onBlur:B,onChange:p,onFocus:S}=i,Q=c(b,t,_),z=a(i,Q),{fillCheckboxActiveClass:g,fillCheckboxActiveHoverClass:$,fillCheckboxClass:w,fillCheckboxHoverClass:N,fillCheckmarkClass:W,fillClass:F,fillHoverClass:j,labelTextColor:L,labelTextSize:q,labelTextWeight:D,descTextColor:I,descTextSize:M,descTextWeight:X,borderColorCheckboxActiveClass:E,borderColorCheckboxActiveHoverClass:G,borderColorCheckboxClass:J,borderColorCheckboxHoverClass:K,heightClass:O,shapeClass:R,sizeClass:U,widthClass:V}=z;return e(k,{className:o(C,"checkbox",F&&`fill_${F}`,j&&`fill_${j}`,U&&`checkbox_size_${U}`,f?g&&`checkbox_fill_active_${g}`:w&&`checkbox_fill_${w}`,f?$&&`checkbox_fill_active_hover_${$}`:N&&`checkbox_fill_hover_${N}`,f?E&&`checkbox_border-color_active_${E}`:J&&`checkbox_border-color_${J}`,f?G&&`checkbox_border-color_active_hover_${G}`:K&&`checkbox_border-color_hover_${K}`,V&&`checkbox_width_${V}`,O&&`checkbox_height_${O}`,P&&"skeleton"),"data-testid":x,"data-tour":d,htmlFor:"label"===k&&s,children:[m,e("div",{className:"checkbox__item",children:[r("input",{id:s,className:"checkbox__input",type:"checkbox",checked:H||A||f,disabled:_||n,value:y,onBlur:B,onChange:p,onFocus:S}),r("div",{className:o("checkbox__state",R&&`shape_${R}`),children:" "}),r("div",{className:o(u?"checkbox__state-indeterminate":"checkbox__state-checkmark",(f||u)&&W&&`fill_${W}`),children:" "})]}),v&&r(l,{className:"checkbox__label",size:q,textColor:L,textWeight:D,children:v}),h&&r(l,{className:"checkbox__desc",size:M,textColor:I,textWeight:X,children:h}),T&&r("div",{className:"checkbox__after",children:T})]})}export{s as Checkbox,i as checkboxAppearance,t as checkboxConfig};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as r}from"react/jsx-runtime";import o from"clsx";import{useAppearanceConfig as i,useDevicePropsGenerator as a,useStyles as t}from"@itcase/ui-core/hooks";import{mergeAppearanceKeys as s}from"@itcase/ui-core/utils";import{B as c}from"../Button_es_Ob6KGKAf.js";import{T as l,I as n}from"../primitives_es_BQqNcRQk.js";import{L as d}from"../Loader_es_CwVQZ1L0.js";import{d as m}from"../default_es_CaWUd9iO.js";import{useNotifications as p,useNotificationsAPI as u}from"@itcase/ui-core/context";import"react";import"@itcase/common";import"@rc-component/tooltip";import"react-inlinesvg";import"@itcase/ui-core/hoc";const f={...{defaultPrimary:{fill:"surfacePrimary",fillHover:"surfacePrimary",titleTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",textColor:"surfaceTextPrimary",buttonAppearance:"accentPrimary sizeXXL solid rounded",loaderAppearance:"accentTertiary sizeS ghost rounded",closeIcon:m.Action.Close,closeIconAppearance:"surfacePrimary size12_12 ghost circular"}},circular:{shape:"circular"},rounded:{shape:"rounded"},roundedXL:{shape:"roundedXL"},roundedL:{shape:"roundedL"},roundedM:{shape:"roundedM"},roundedS:{shape:"roundedS"},sizeM:{size:"m",titleTextSize:"xxl",descTextSize:"m",loaderAppearanceSize:"sizeS",closeIconAppearanceSize:"size24_24"},sizeS:{size:"m",titleTextSize:"xl",descTextSize:"m",loaderAppearanceSize:"sizeS",closeIconAppearanceSize:"size24_24"},solid:{borderColor:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none"},...{errorPrimary:{fill:"errorPrimary",fillHover:"errorPrimary",titleTextColor:"errorTextPrimary",descTextColor:"errorTextPrimary",borderColor:"errorBorderPrimary",textColor:"errorTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"errorPrimary sizeS solid rounded",closeIcon:m.Action.Close,closeIconAppearance:"
|
|
1
|
+
import{jsxs as e,jsx as r}from"react/jsx-runtime";import o from"clsx";import{useAppearanceConfig as i,useDevicePropsGenerator as a,useStyles as t}from"@itcase/ui-core/hooks";import{mergeAppearanceKeys as s}from"@itcase/ui-core/utils";import{B as c}from"../Button_es_Ob6KGKAf.js";import{T as l,I as n}from"../primitives_es_BQqNcRQk.js";import{L as d}from"../Loader_es_CwVQZ1L0.js";import{d as m}from"../default_es_CaWUd9iO.js";import{useNotifications as p,useNotificationsAPI as u}from"@itcase/ui-core/context";import"react";import"@itcase/common";import"@rc-component/tooltip";import"react-inlinesvg";import"@itcase/ui-core/hoc";const f={...{defaultPrimary:{fill:"surfacePrimary",fillHover:"surfacePrimary",titleTextColor:"surfaceTextPrimary",descTextColor:"surfaceTextPrimary",borderColor:"surfaceBorderPrimary",textColor:"surfaceTextPrimary",buttonAppearance:"accentPrimary sizeXXL solid rounded",loaderAppearance:"accentTertiary sizeS ghost rounded",closeIcon:m.Action.Close,closeIconAppearance:"surfacePrimary size12_12 ghost circular"}},circular:{shape:"circular"},rounded:{shape:"rounded"},roundedXL:{shape:"roundedXL"},roundedL:{shape:"roundedL"},roundedM:{shape:"roundedM"},roundedS:{shape:"roundedS"},sizeM:{size:"m",titleTextSize:"xxl",descTextSize:"m",loaderAppearanceSize:"sizeS",closeIconAppearanceSize:"size24_24"},sizeS:{size:"m",titleTextSize:"xl",descTextSize:"m",loaderAppearanceSize:"sizeS",closeIconAppearanceSize:"size24_24"},solid:{borderColor:"none"},outlined:{fill:"none"},full:{},ghost:{fill:"none",borderColor:"none"},...{errorPrimary:{fill:"errorPrimary",fillHover:"errorPrimary",titleTextColor:"errorTextPrimary",descTextColor:"errorTextPrimary",borderColor:"errorBorderPrimary",textColor:"errorTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"errorPrimary sizeS solid rounded",closeIcon:m.Action.Close,closeIconAppearance:"errorPrimary size12_12 solid circular"}},...{infoPrimary:{fill:"infoPrimary",fillHover:"infoPrimary",titleTextColor:"infoTextPrimary",descTextColor:"infoTextPrimary",borderColor:"infoBorderPrimary",textColor:"infoTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"infoPrimary sizeS solid rounded",closeIcon:m.Action.Close,closeIconAppearance:"infoPrimary size12_12 solid circular"}},...{successPrimary:{fill:"successPrimary",fillHover:"successPrimary",titleTextColor:"successTextPrimary",descTextColor:"successTextPrimary",borderColor:"successBorderPrimary",textColor:"successTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"successPrimary sizeS solid rounded",closeIcon:m.Action.Close,closeIconAppearance:"successPrimary size12_12 ghost circular"}},...{warningPrimary:{fill:"warningPrimary",fillHover:"warningPrimary",titleTextColor:"warningTextPrimary",descTextColor:"warningTextPrimary",borderColor:"surfaceBorderPrimary",textColor:"warningTextPrimary",buttonAppearance:"surfacePrimary sizeXXL solid rounded",loaderAppearance:"warningPrimary sizeS solid rounded",closeIcon:m.Action.Close,closeIconAppearance:"warningPrimary size12_12 solid circular"}}},y={appearance:f,setAppearance:e=>{y.appearance=e}};function x(m){const{id:p,appearance:u,className:f,dataTestId:x,dataTour:P,type:_="float",title:C,text:z,before:T,after:A,isSkeleton:S,isLoading:I,onClickButton:h,onClickClose:b}=m,g=i(u,y),L=a(m,g),{fillClass:v,fillHoverClass:w,titleTextColor:N,titleTextSize:X,descTextColor:k,descTextSize:B,buttonAppearance:$,buttonLabel:H,elevationClass:j,loaderAppearance:F,loaderAppearanceSize:M,loaderFill:q,loaderItemFill:D,loaderSize:E,loaderType:G="dot",shapeClass:J,sizeClass:K,widthClass:O,closeIcon:Q,closeIconAppearance:R,closeIconAppearanceSize:U,closeIconSrc:V}=L,{styles:W}=t(m);return e("div",{className:o("notification__item",`notification__item_${_}`,O&&`width_${O}`,j&&`elevation_${j}`,v&&`fill_${v}`,K&&`notification__item_size_${K}`,_&&`notification__item_type_${_}`,w&&`fill_${w}`,S&&"skeleton",J&&`shape_${J}`),"data-testid":x,"data-tour":P,style:W,children:[T,e("div",{className:o(f,"notification__item-wrapper"),children:[C&&r(l,{className:"notification__item-title",size:X,textColor:N,children:C}),z&&r(l,{className:"notification__item-text",size:B,textColor:k,children:z}),I&&r(d,{appearance:s(F,M),className:o(f,"button__loader"),type:G,size:E,fill:q,itemFill:D}),b&&r(n,{appearance:s(R,U),className:o("notification__item-close","cursor_type_pointer"),imageSrc:V,SvgImage:Q,onClick:()=>b&&b(p)}),h&&H&&r(c,{appearance:$,className:"notification__item-button",width:"fill",label:H,onClick:h})]}),A]})}function P(e){const i=p(),{hideNotifications:a}=u(),{className:t,dataTestId:s,dataTour:c}=e;return r("div",{className:o("notification",t),"data-testid":s,"data-tour":c,children:r("div",{className:"notification__wrapper",children:i.map(e=>r(x,{id:e.id,appearance:e.appearance,type:e.type,title:e.title,status:e.status,text:e.text,buttonLabel:e.buttonLabel,after:e.after,closeIcon:e.closeIcon,closeIconSrc:e.closeIconSrc,isLoading:e.isLoading,onClickButton:e.onClickButton,onClickClose:a},e.id))})})}export{x as Notification,P as NotificationWrapper,f as notificationAppearance,y as notificationConfig};
|
|
@@ -53716,6 +53716,20 @@ div.avatar-stack {
|
|
|
53716
53716
|
}
|
|
53717
53717
|
}
|
|
53718
53718
|
}
|
|
53719
|
+
.checkbox {
|
|
53720
|
+
&&_width {
|
|
53721
|
+
&_fixed {
|
|
53722
|
+
width: 180px;
|
|
53723
|
+
}
|
|
53724
|
+
&_hug {
|
|
53725
|
+
display: inline-flex;
|
|
53726
|
+
}
|
|
53727
|
+
&_fill {
|
|
53728
|
+
width: 100%;
|
|
53729
|
+
max-width: none !important;
|
|
53730
|
+
}
|
|
53731
|
+
}
|
|
53732
|
+
}
|
|
53719
53733
|
.checkbox_border-color {
|
|
53720
53734
|
&_active_none,
|
|
53721
53735
|
&_active_hover_none,
|
|
@@ -97,7 +97,46 @@ declare const checkboxAppearance: {
|
|
|
97
97
|
fill: "surfaceSecondary";
|
|
98
98
|
fillCheckbox: "surfaceSecondary";
|
|
99
99
|
fillCheckboxActive: "surfaceQuaternary";
|
|
100
|
-
fillCheckboxActiveHover: "
|
|
100
|
+
fillCheckboxActiveHover: "surfaceActiveHoverQuaternary";
|
|
101
|
+
fillCheckboxHover: "surfaceHoverTertiary";
|
|
102
|
+
labelTextColor: "surfaceTextPrimary";
|
|
103
|
+
descTextColor: "surfaceTextPrimary";
|
|
104
|
+
borderColorCheckbox: "surfaceBorderQuaternary";
|
|
105
|
+
borderColorCheckboxActive: "surfaceBorderQuaternary";
|
|
106
|
+
borderColorCheckboxActiveHover: "surfaceBorderActivePrimary";
|
|
107
|
+
borderColorCheckboxHover: "surfaceBorderHoverPrimary";
|
|
108
|
+
};
|
|
109
|
+
defaultQuaternary: {
|
|
110
|
+
fill: "surfaceQuaternary";
|
|
111
|
+
fillCheckbox: "surfaceQuaternary";
|
|
112
|
+
fillCheckboxActive: "surfaceQuaternary";
|
|
113
|
+
fillCheckboxActiveHover: "surfaceActiveHoverQuaternary";
|
|
114
|
+
fillCheckboxHover: "surfaceHoverTertiary";
|
|
115
|
+
labelTextColor: "surfaceTextPrimary";
|
|
116
|
+
descTextColor: "surfaceTextPrimary";
|
|
117
|
+
borderColorCheckbox: "surfaceBorderQuaternary";
|
|
118
|
+
borderColorCheckboxActive: "surfaceBorderQuaternary";
|
|
119
|
+
borderColorCheckboxActiveHover: "surfaceBorderActivePrimary";
|
|
120
|
+
borderColorCheckboxHover: "surfaceBorderHoverPrimary";
|
|
121
|
+
};
|
|
122
|
+
defaultSecondary: {
|
|
123
|
+
fill: "surfaceSecondary";
|
|
124
|
+
fillCheckbox: "surfaceSecondary";
|
|
125
|
+
fillCheckboxActive: "surfaceQuaternary";
|
|
126
|
+
fillCheckboxActiveHover: "surfaceActiveHoverQuaternary";
|
|
127
|
+
fillCheckboxHover: "surfaceHoverTertiary";
|
|
128
|
+
labelTextColor: "surfaceTextPrimary";
|
|
129
|
+
descTextColor: "surfaceTextPrimary";
|
|
130
|
+
borderColorCheckbox: "surfaceBorderQuaternary";
|
|
131
|
+
borderColorCheckboxActive: "surfaceBorderQuaternary";
|
|
132
|
+
borderColorCheckboxActiveHover: "surfaceBorderActivePrimary";
|
|
133
|
+
borderColorCheckboxHover: "surfaceBorderHoverPrimary";
|
|
134
|
+
};
|
|
135
|
+
defaultTertiary: {
|
|
136
|
+
fill: "surfaceTertiary";
|
|
137
|
+
fillCheckbox: "surfaceTertiary";
|
|
138
|
+
fillCheckboxActive: "surfaceQuaternary";
|
|
139
|
+
fillCheckboxActiveHover: "surfaceActiveHoverQuaternary";
|
|
101
140
|
fillCheckboxHover: "surfaceHoverTertiary";
|
|
102
141
|
labelTextColor: "surfaceTextPrimary";
|
|
103
142
|
descTextColor: "surfaceTextPrimary";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { ElementType, ReactNode } from 'react';
|
|
2
|
-
import { AppearanceConfig, AppearanceKeysState, AppearanceShapeKey, AppearanceSizeKey, AppearanceStyleKey, BorderColorActiveProps, BorderColorHoverProps, BorderColorProps, CompositeAppearanceStateDefault, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, ShapeProps, SizeProps, WidthProps } from '@itcase/types-ui';
|
|
2
|
+
import { AppearanceConfig, AppearanceKeysState, AppearanceShapeKey, AppearanceSizeKey, AppearanceStyleKey, BorderColorActiveProps, BorderColorHoverProps, BorderColorProps, CompositeAppearanceStateDefault, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, HeightProps, ShapeProps, SizeProps, WidthProps } from '@itcase/types-ui';
|
|
3
3
|
import type { AppearancePartialRecord, AppearanceRecord } from '@itcase/types-ui';
|
|
4
4
|
import type { StyleAttributes } from '@itcase/ui-core/hooks';
|
|
5
5
|
import type { ComponentGalleryArgs } from 'src/storybook/createComponentGallery';
|
|
@@ -21,6 +21,7 @@ type CheckboxAppearanceProps = {
|
|
|
21
21
|
fillCheckboxHover?: FillHoverProps;
|
|
22
22
|
fillCheckmark?: FillProps;
|
|
23
23
|
fillHover?: FillHoverProps;
|
|
24
|
+
height?: HeightProps;
|
|
24
25
|
labelTextColor?: TextProps['textColor'];
|
|
25
26
|
labelTextSize?: TextProps['size'];
|
|
26
27
|
labelTextWeight?: TextProps['textWeight'];
|
|
@@ -13,7 +13,7 @@ function Checkbox(props) {
|
|
|
13
13
|
const { id, appearance, className, dataTestId, dataTour, label, desc, checked, disabled, indeterminate, Tag = 'label', value, before, after, isActive, isChecked, isDisabled, isSkeleton, onBlur, onChange, onFocus, } = props;
|
|
14
14
|
const appearanceConfig = useAppearanceConfig(appearance, checkboxConfig, isDisabled);
|
|
15
15
|
const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
|
|
16
|
-
const { fillCheckboxActiveClass, fillCheckboxActiveHoverClass, fillCheckboxClass, fillCheckboxHoverClass, fillCheckmarkClass, fillClass, fillHoverClass, labelTextColor, labelTextSize, labelTextWeight, descTextColor, descTextSize, descTextWeight, borderColorCheckboxActiveClass, borderColorCheckboxActiveHoverClass, borderColorCheckboxClass, borderColorCheckboxHoverClass, shapeClass, sizeClass, widthClass, } = propsGenerator;
|
|
16
|
+
const { fillCheckboxActiveClass, fillCheckboxActiveHoverClass, fillCheckboxClass, fillCheckboxHoverClass, fillCheckmarkClass, fillClass, fillHoverClass, labelTextColor, labelTextSize, labelTextWeight, descTextColor, descTextSize, descTextWeight, borderColorCheckboxActiveClass, borderColorCheckboxActiveHoverClass, borderColorCheckboxClass, borderColorCheckboxHoverClass, heightClass, shapeClass, sizeClass, widthClass, } = propsGenerator;
|
|
17
17
|
return (_jsxs(Tag, { className: clsx(className, 'checkbox', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_${fillHoverClass}`, sizeClass && `checkbox_size_${sizeClass}`, !checked
|
|
18
18
|
? fillCheckboxClass && `checkbox_fill_${fillCheckboxClass}`
|
|
19
19
|
: fillCheckboxActiveClass &&
|
|
@@ -29,7 +29,7 @@ function Checkbox(props) {
|
|
|
29
29
|
? borderColorCheckboxHoverClass &&
|
|
30
30
|
`checkbox_border-color_hover_${borderColorCheckboxHoverClass}`
|
|
31
31
|
: borderColorCheckboxActiveHoverClass &&
|
|
32
|
-
`checkbox_border-color_active_hover_${borderColorCheckboxActiveHoverClass}`, widthClass && `
|
|
32
|
+
`checkbox_border-color_active_hover_${borderColorCheckboxActiveHoverClass}`, widthClass && `checkbox_width_${widthClass}`, heightClass && `checkbox_height_${heightClass}`, isSkeleton && `skeleton`), "data-testid": dataTestId, "data-tour": dataTour, htmlFor: Tag === 'label' && id, children: [before, _jsxs("div", { className: "checkbox__item", children: [_jsx("input", { id: id, className: "checkbox__input", type: "checkbox", checked: isActive || isChecked || checked, disabled: isDisabled || disabled, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus }), _jsx("div", { className: clsx('checkbox__state', shapeClass && `shape_${shapeClass}`), children: "\u00A0" }), _jsx("div", { className: clsx(!indeterminate
|
|
33
33
|
? 'checkbox__state-checkmark'
|
|
34
34
|
: 'checkbox__state-indeterminate', (checked || indeterminate) &&
|
|
35
35
|
fillCheckmarkClass &&
|
|
@@ -3,7 +3,46 @@ declare const checkboxAppearanceDefault: {
|
|
|
3
3
|
fill: "surfaceSecondary";
|
|
4
4
|
fillCheckbox: "surfaceSecondary";
|
|
5
5
|
fillCheckboxActive: "surfaceQuaternary";
|
|
6
|
-
fillCheckboxActiveHover: "
|
|
6
|
+
fillCheckboxActiveHover: "surfaceActiveHoverQuaternary";
|
|
7
|
+
fillCheckboxHover: "surfaceHoverTertiary";
|
|
8
|
+
labelTextColor: "surfaceTextPrimary";
|
|
9
|
+
descTextColor: "surfaceTextPrimary";
|
|
10
|
+
borderColorCheckbox: "surfaceBorderQuaternary";
|
|
11
|
+
borderColorCheckboxActive: "surfaceBorderQuaternary";
|
|
12
|
+
borderColorCheckboxActiveHover: "surfaceBorderActivePrimary";
|
|
13
|
+
borderColorCheckboxHover: "surfaceBorderHoverPrimary";
|
|
14
|
+
};
|
|
15
|
+
defaultQuaternary: {
|
|
16
|
+
fill: "surfaceQuaternary";
|
|
17
|
+
fillCheckbox: "surfaceQuaternary";
|
|
18
|
+
fillCheckboxActive: "surfaceQuaternary";
|
|
19
|
+
fillCheckboxActiveHover: "surfaceActiveHoverQuaternary";
|
|
20
|
+
fillCheckboxHover: "surfaceHoverTertiary";
|
|
21
|
+
labelTextColor: "surfaceTextPrimary";
|
|
22
|
+
descTextColor: "surfaceTextPrimary";
|
|
23
|
+
borderColorCheckbox: "surfaceBorderQuaternary";
|
|
24
|
+
borderColorCheckboxActive: "surfaceBorderQuaternary";
|
|
25
|
+
borderColorCheckboxActiveHover: "surfaceBorderActivePrimary";
|
|
26
|
+
borderColorCheckboxHover: "surfaceBorderHoverPrimary";
|
|
27
|
+
};
|
|
28
|
+
defaultSecondary: {
|
|
29
|
+
fill: "surfaceSecondary";
|
|
30
|
+
fillCheckbox: "surfaceSecondary";
|
|
31
|
+
fillCheckboxActive: "surfaceQuaternary";
|
|
32
|
+
fillCheckboxActiveHover: "surfaceActiveHoverQuaternary";
|
|
33
|
+
fillCheckboxHover: "surfaceHoverTertiary";
|
|
34
|
+
labelTextColor: "surfaceTextPrimary";
|
|
35
|
+
descTextColor: "surfaceTextPrimary";
|
|
36
|
+
borderColorCheckbox: "surfaceBorderQuaternary";
|
|
37
|
+
borderColorCheckboxActive: "surfaceBorderQuaternary";
|
|
38
|
+
borderColorCheckboxActiveHover: "surfaceBorderActivePrimary";
|
|
39
|
+
borderColorCheckboxHover: "surfaceBorderHoverPrimary";
|
|
40
|
+
};
|
|
41
|
+
defaultTertiary: {
|
|
42
|
+
fill: "surfaceTertiary";
|
|
43
|
+
fillCheckbox: "surfaceTertiary";
|
|
44
|
+
fillCheckboxActive: "surfaceQuaternary";
|
|
45
|
+
fillCheckboxActiveHover: "surfaceActiveHoverQuaternary";
|
|
7
46
|
fillCheckboxHover: "surfaceHoverTertiary";
|
|
8
47
|
labelTextColor: "surfaceTextPrimary";
|
|
9
48
|
descTextColor: "surfaceTextPrimary";
|
|
@@ -3,7 +3,46 @@ const checkboxAppearanceDefault = {
|
|
|
3
3
|
fill: 'surfaceSecondary',
|
|
4
4
|
fillCheckbox: 'surfaceSecondary',
|
|
5
5
|
fillCheckboxActive: 'surfaceQuaternary',
|
|
6
|
-
fillCheckboxActiveHover: '
|
|
6
|
+
fillCheckboxActiveHover: 'surfaceActiveHoverQuaternary',
|
|
7
|
+
fillCheckboxHover: 'surfaceHoverTertiary',
|
|
8
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
9
|
+
descTextColor: 'surfaceTextPrimary',
|
|
10
|
+
borderColorCheckbox: 'surfaceBorderQuaternary',
|
|
11
|
+
borderColorCheckboxActive: 'surfaceBorderQuaternary',
|
|
12
|
+
borderColorCheckboxActiveHover: 'surfaceBorderActivePrimary',
|
|
13
|
+
borderColorCheckboxHover: 'surfaceBorderHoverPrimary',
|
|
14
|
+
},
|
|
15
|
+
defaultQuaternary: {
|
|
16
|
+
fill: 'surfaceQuaternary',
|
|
17
|
+
fillCheckbox: 'surfaceQuaternary',
|
|
18
|
+
fillCheckboxActive: 'surfaceQuaternary',
|
|
19
|
+
fillCheckboxActiveHover: 'surfaceActiveHoverQuaternary',
|
|
20
|
+
fillCheckboxHover: 'surfaceHoverTertiary',
|
|
21
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
22
|
+
descTextColor: 'surfaceTextPrimary',
|
|
23
|
+
borderColorCheckbox: 'surfaceBorderQuaternary',
|
|
24
|
+
borderColorCheckboxActive: 'surfaceBorderQuaternary',
|
|
25
|
+
borderColorCheckboxActiveHover: 'surfaceBorderActivePrimary',
|
|
26
|
+
borderColorCheckboxHover: 'surfaceBorderHoverPrimary',
|
|
27
|
+
},
|
|
28
|
+
defaultSecondary: {
|
|
29
|
+
fill: 'surfaceSecondary',
|
|
30
|
+
fillCheckbox: 'surfaceSecondary',
|
|
31
|
+
fillCheckboxActive: 'surfaceQuaternary',
|
|
32
|
+
fillCheckboxActiveHover: 'surfaceActiveHoverQuaternary',
|
|
33
|
+
fillCheckboxHover: 'surfaceHoverTertiary',
|
|
34
|
+
labelTextColor: 'surfaceTextPrimary',
|
|
35
|
+
descTextColor: 'surfaceTextPrimary',
|
|
36
|
+
borderColorCheckbox: 'surfaceBorderQuaternary',
|
|
37
|
+
borderColorCheckboxActive: 'surfaceBorderQuaternary',
|
|
38
|
+
borderColorCheckboxActiveHover: 'surfaceBorderActivePrimary',
|
|
39
|
+
borderColorCheckboxHover: 'surfaceBorderHoverPrimary',
|
|
40
|
+
},
|
|
41
|
+
defaultTertiary: {
|
|
42
|
+
fill: 'surfaceTertiary',
|
|
43
|
+
fillCheckbox: 'surfaceTertiary',
|
|
44
|
+
fillCheckboxActive: 'surfaceQuaternary',
|
|
45
|
+
fillCheckboxActiveHover: 'surfaceActiveHoverQuaternary',
|
|
7
46
|
fillCheckboxHover: 'surfaceHoverTertiary',
|
|
8
47
|
labelTextColor: 'surfaceTextPrimary',
|
|
9
48
|
descTextColor: 'surfaceTextPrimary',
|
|
@@ -9,7 +9,7 @@ declare const notificationAppearance: {
|
|
|
9
9
|
buttonAppearance: "surfacePrimary sizeXXL solid rounded";
|
|
10
10
|
loaderAppearance: "warningPrimary sizeS solid rounded";
|
|
11
11
|
closeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
|
|
12
|
-
closeIconAppearance: "
|
|
12
|
+
closeIconAppearance: "warningPrimary size12_12 solid circular";
|
|
13
13
|
};
|
|
14
14
|
successPrimary: {
|
|
15
15
|
fill: "successPrimary";
|
|
@@ -33,7 +33,7 @@ declare const notificationAppearance: {
|
|
|
33
33
|
buttonAppearance: "surfacePrimary sizeXXL solid rounded";
|
|
34
34
|
loaderAppearance: "infoPrimary sizeS solid rounded";
|
|
35
35
|
closeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
|
|
36
|
-
closeIconAppearance: "
|
|
36
|
+
closeIconAppearance: "infoPrimary size12_12 solid circular";
|
|
37
37
|
};
|
|
38
38
|
errorPrimary: {
|
|
39
39
|
fill: "errorPrimary";
|
|
@@ -45,7 +45,7 @@ declare const notificationAppearance: {
|
|
|
45
45
|
buttonAppearance: "surfacePrimary sizeXXL solid rounded";
|
|
46
46
|
loaderAppearance: "errorPrimary sizeS solid rounded";
|
|
47
47
|
closeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
|
|
48
|
-
closeIconAppearance: "
|
|
48
|
+
closeIconAppearance: "errorPrimary size12_12 solid circular";
|
|
49
49
|
};
|
|
50
50
|
solid: {
|
|
51
51
|
borderColor: "none";
|
|
@@ -9,7 +9,7 @@ declare const notificationAppearanceError: {
|
|
|
9
9
|
buttonAppearance: "surfacePrimary sizeXXL solid rounded";
|
|
10
10
|
loaderAppearance: "errorPrimary sizeS solid rounded";
|
|
11
11
|
closeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
|
|
12
|
-
closeIconAppearance: "
|
|
12
|
+
closeIconAppearance: "errorPrimary size12_12 solid circular";
|
|
13
13
|
};
|
|
14
14
|
};
|
|
15
15
|
export { notificationAppearanceError };
|
|
@@ -10,7 +10,7 @@ const notificationAppearanceError = {
|
|
|
10
10
|
buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
|
|
11
11
|
loaderAppearance: 'errorPrimary sizeS solid rounded',
|
|
12
12
|
closeIcon: icons24.Action.Close,
|
|
13
|
-
closeIconAppearance: '
|
|
13
|
+
closeIconAppearance: 'errorPrimary size12_12 solid circular',
|
|
14
14
|
},
|
|
15
15
|
};
|
|
16
16
|
export { notificationAppearanceError };
|
|
@@ -9,7 +9,7 @@ declare const notificationAppearanceInfo: {
|
|
|
9
9
|
buttonAppearance: "surfacePrimary sizeXXL solid rounded";
|
|
10
10
|
loaderAppearance: "infoPrimary sizeS solid rounded";
|
|
11
11
|
closeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
|
|
12
|
-
closeIconAppearance: "
|
|
12
|
+
closeIconAppearance: "infoPrimary size12_12 solid circular";
|
|
13
13
|
};
|
|
14
14
|
};
|
|
15
15
|
export { notificationAppearanceInfo };
|
|
@@ -10,7 +10,7 @@ const notificationAppearanceInfo = {
|
|
|
10
10
|
buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
|
|
11
11
|
loaderAppearance: 'infoPrimary sizeS solid rounded',
|
|
12
12
|
closeIcon: icons24.Action.Close,
|
|
13
|
-
closeIconAppearance: '
|
|
13
|
+
closeIconAppearance: 'infoPrimary size12_12 solid circular',
|
|
14
14
|
},
|
|
15
15
|
};
|
|
16
16
|
export { notificationAppearanceInfo };
|
|
@@ -9,7 +9,7 @@ declare const notificationAppearanceWarning: {
|
|
|
9
9
|
buttonAppearance: "surfacePrimary sizeXXL solid rounded";
|
|
10
10
|
loaderAppearance: "warningPrimary sizeS solid rounded";
|
|
11
11
|
closeIcon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
|
|
12
|
-
closeIconAppearance: "
|
|
12
|
+
closeIconAppearance: "warningPrimary size12_12 solid circular";
|
|
13
13
|
};
|
|
14
14
|
};
|
|
15
15
|
export { notificationAppearanceWarning };
|
|
@@ -10,7 +10,7 @@ const notificationAppearanceWarning = {
|
|
|
10
10
|
buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
|
|
11
11
|
loaderAppearance: 'warningPrimary sizeS solid rounded',
|
|
12
12
|
closeIcon: icons24.Action.Close,
|
|
13
|
-
closeIconAppearance: '
|
|
13
|
+
closeIconAppearance: 'warningPrimary size12_12 solid circular',
|
|
14
14
|
},
|
|
15
15
|
};
|
|
16
16
|
export { notificationAppearanceWarning };
|
|
@@ -12,14 +12,3 @@ const segmentedAppearanceRequire = {
|
|
|
12
12
|
},
|
|
13
13
|
};
|
|
14
14
|
export { segmentedAppearanceRequire };
|
|
15
|
-
// fill: 'surfacePrimary',
|
|
16
|
-
// fillActive: 'accentPrimary',
|
|
17
|
-
// fillActiveHover: 'accentPrimary',
|
|
18
|
-
// fillHover: 'surfaceHoverSecondary',
|
|
19
|
-
// labelTextActiveColor: 'accentTextPrimary',
|
|
20
|
-
// labelTextActiveColorHover: 'accentTextPrimary',
|
|
21
|
-
// labelTextColor: 'surfaceTextPrimary',
|
|
22
|
-
// borderColor: 'surfaceBorderQuaternary',
|
|
23
|
-
// iconFill: 'surfaceItemQuaternary',
|
|
24
|
-
// iconFillActive: 'surfaceItemSecondary',
|
|
25
|
-
// indicatorFill: 'accentPrimary',
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@itcase/ui-web",
|
|
3
|
-
"version": "1.9.
|
|
3
|
+
"version": "1.9.107",
|
|
4
4
|
"description": "UI components",
|
|
5
5
|
"keywords": "",
|
|
6
6
|
"license": "MIT",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"@itcase/tokens-am": "^1.1.57",
|
|
54
54
|
"@itcase/tokens-baikal": "^1.1.54",
|
|
55
55
|
"@itcase/tokens-palette": "^1.1.50",
|
|
56
|
-
"@itcase/ui-core": "^1.9.
|
|
56
|
+
"@itcase/ui-core": "^1.9.106",
|
|
57
57
|
"@rc-component/tooltip": "^1.4.0",
|
|
58
58
|
"clsx": "^2.1.1",
|
|
59
59
|
"date-fns": "^4.2.1",
|
|
@@ -114,5 +114,5 @@
|
|
|
114
114
|
"storybook": "^10.4.0",
|
|
115
115
|
"typescript": "^6.0.3"
|
|
116
116
|
},
|
|
117
|
-
"gitHead": "
|
|
117
|
+
"gitHead": "8c2367886fa45437fb2d2a7f5546924aaa64122d"
|
|
118
118
|
}
|