@bikdotai/bik-component-library 0.0.627-colorFill → 0.0.627-containerStyle-2

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.
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
@@ -14,6 +14,5 @@ export type CheckBoxProps = {
14
14
  boldOnChecked?: boolean;
15
15
  style?: React.CSSProperties;
16
16
  enableHover?: boolean;
17
- activeColor?: string;
18
17
  };
19
18
  export declare const CheckBox: React.FC<CheckBoxProps>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),s=require("./CheckBox.styled.js"),l=require("../TypographyStyle.js"),t=require("../../constants/Theme.js");const a=s=>{const l=i.useMemo((()=>s.activeColor||t.COLORS.background.positive.vibrant),[s.activeColor]);return e.jsxs("svg",Object.assign({width:s.isSmall?"16":"18",height:s.isSmall?"16":"18",viewBox:s.isSmall?"0 0 16 16":"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("rect",{x:"0",y:"0",width:s.isSmall?"16":"18",height:s.isSmall?"16":"18",rx:"4",fill:s.isDisabled?t.COLORS.content.inactive:l}),!s.isPartial&&e.jsx("svg",Object.assign({width:s.isSmall?"8":"10",height:s.isSmall?"7":"9",x:"4",y:"4",viewBox:"0 0 10 9",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z",fill:"white"})})),s.isPartial&&e.jsx("rect",{x:"5",y:s.isSmall?"7":"8",width:s.isSmall?"6":"8",height:"2",rx:"1",fill:t.COLORS.surface.standard})]}))};exports.CheckBox=r=>{var o;const[c,d]=i.useState(r.isChecked||!1),[n,h]=i.useState(r.isPartiallyChecked||!1),[b,x]=i.useState(r.isDisabled||!1),[C,S]=i.useState(!1),[u,O]=i.useState(!1);i.useEffect((()=>{d(r.isChecked)}),[r.isChecked]),i.useEffect((()=>{x(r.isDisabled||!1)}),[r.isDisabled]),i.useEffect((()=>{h(r.isPartiallyChecked||!1)}),[r.isPartiallyChecked]);return e.jsxs(s.CheckboxContainer,Object.assign({onClick:e=>{var i;if(!r.isDisabled){const s=!c;n?h(!n):d(s),null===(i=r.onValueChange)||void 0===i||i.call(r,s,r.value,e)}},onMouseEnter:()=>S(!r.skipHoverState),onMouseLeave:()=>S(!1),onMouseDown:()=>O(!r.skipHoverState),onMouseUp:()=>O(!1),isDisabled:b,enableHover:r.enableHover,style:null!==(o=r.style)&&void 0!==o?o:{}},{children:[e.jsx(s.CheckboxIcon,Object.assign({checked:c,hovered:C,clicked:u,isDisabled:b,size:r.size,borderColor:r.checkboxBorderColor},{children:c&&e.jsx(a,{isPartial:n||!1,isDisabled:b,isSmall:"SMALL"===r.size,activeColor:null==r?void 0:r.activeColor})})),r.label?r.boldOnChecked&&c?"DEFAULT"===r.labelSize?e.jsx(l.TitleRegular,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})):e.jsx(l.TitleSmall,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})):"SMALL"===r.size||"SMALL"===r.labelSize?e.jsx(l.BodySecondary,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})):e.jsx(l.BodyPrimary,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})):e.jsx(e.Fragment,{}),r.rightComponent]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),s=require("./CheckBox.styled.js"),l=require("../TypographyStyle.js"),t=require("../../constants/Theme.js");const a=i=>e.jsxs("svg",Object.assign({width:i.isSmall?"16":"18",height:i.isSmall?"16":"18",viewBox:i.isSmall?"0 0 16 16":"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("rect",{x:"0",y:"0",width:i.isSmall?"16":"18",height:i.isSmall?"16":"18",rx:"4",fill:i.isDisabled?t.COLORS.content.inactive:t.COLORS.background.positive.vibrant}),!i.isPartial&&e.jsx("svg",Object.assign({width:i.isSmall?"8":"10",height:i.isSmall?"7":"9",x:"4",y:"4",viewBox:"0 0 10 9",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z",fill:"white"})})),i.isPartial&&e.jsx("rect",{x:"5",y:i.isSmall?"7":"8",width:i.isSmall?"6":"8",height:"2",rx:"1",fill:t.COLORS.surface.standard})]}));exports.CheckBox=r=>{var o;const[d,c]=i.useState(r.isChecked||!1),[n,h]=i.useState(r.isPartiallyChecked||!1),[b,x]=i.useState(r.isDisabled||!1),[S,C]=i.useState(!1),[O,u]=i.useState(!1);i.useEffect((()=>{c(r.isChecked)}),[r.isChecked]),i.useEffect((()=>{x(r.isDisabled||!1)}),[r.isDisabled]),i.useEffect((()=>{h(r.isPartiallyChecked||!1)}),[r.isPartiallyChecked]);return e.jsxs(s.CheckboxContainer,Object.assign({onClick:e=>{var i;if(!r.isDisabled){const s=!d;n?h(!n):c(s),null===(i=r.onValueChange)||void 0===i||i.call(r,s,r.value,e)}},onMouseEnter:()=>C(!r.skipHoverState),onMouseLeave:()=>C(!1),onMouseDown:()=>u(!r.skipHoverState),onMouseUp:()=>u(!1),isDisabled:b,enableHover:r.enableHover,style:null!==(o=r.style)&&void 0!==o?o:{}},{children:[e.jsx(s.CheckboxIcon,Object.assign({checked:d,hovered:S,clicked:O,isDisabled:b,size:r.size,borderColor:r.checkboxBorderColor},{children:d&&e.jsx(a,{isPartial:n||!1,isDisabled:b,isSmall:"SMALL"===r.size})})),r.label?r.boldOnChecked&&d?"DEFAULT"===r.labelSize?e.jsx(l.TitleRegular,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})):e.jsx(l.TitleSmall,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})):"SMALL"===r.size||"SMALL"===r.labelSize?e.jsx(l.BodySecondary,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})):e.jsx(l.BodyPrimary,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})):e.jsx(e.Fragment,{}),r.rightComponent]}))};
@@ -12,6 +12,5 @@ export type RadioButtonProps = {
12
12
  labelSize?: 'DEFAULT' | 'MEDIUM';
13
13
  boldOnChecked?: boolean;
14
14
  alwaysBold?: boolean;
15
- activeColor?: string;
16
15
  };
17
16
  export declare const RadioButton: React.FC<RadioButtonProps>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),s=require("./RadioButton.styled.js"),t=require("../TypographyStyle.js"),l=require("../../constants/Theme.js");const a=s=>{const t=i.useMemo((()=>(null==s?void 0:s.activeColor)||l.COLORS.background.positive.vibrant),[s.activeColor]),a=i.useMemo((()=>s.isDisabled?l.COLORS.content.inactive:s.isActive?t:l.COLORS.content.primary),[s.isDisabled,s.isActive,t]);return e.jsxs("svg",Object.assign({width:s.isSmall?"16":"20",height:s.isSmall?"16":"20",viewBox:s.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?6:9,stroke:a,strokeWidth:s.isSmall?1.5:2}),s.isActive&&e.jsx("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?3:5,fill:s.isDisabled?l.COLORS.content.inactive:t})]}))};exports.RadioButton=o=>{const[r,c]=i.useState(o.isActive||!1),[n,d]=i.useState(!1),[O,S]=i.useState(!1);i.useEffect((()=>{c(o.isActive)}),[o.isActive]);return e.jsxs(s.RadioButtonContainer,Object.assign({onClick:()=>{var e;if(!o.skipSelectingOff&&!o.isDisabled){const i=!r;c(i),null===(e=o.onValueChange)||void 0===e||e.call(o,i,o.value)}},onMouseEnter:()=>d(!o.skipHoverState),onMouseLeave:()=>d(!1),onMouseDown:()=>S(!o.skipHoverState),onMouseUp:()=>S(!1),style:o.caption?{alignItems:"flex-start"}:{}},{children:[e.jsx(s.RadioButtonIcon,Object.assign({checked:r,hovered:n,clicked:O,isDisabled:o.isDisabled||!1,size:o.size,style:o.caption?{margin:"2px 0"}:{}},{children:e.jsx(a,{isSmall:"SMALL"===o.size,isActive:r,isDisabled:o.isDisabled||!1,activeColor:o.activeColor})})),e.jsxs("div",{children:[o.label?o.boldOnChecked&&r||o.alwaysBold?e.jsx(t.TitleSmall,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):"SMALL"===o.size?e.jsx(t.BodyCaption,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):"MEDIUM"===o.labelSize?e.jsx(t.BodySecondary,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):e.jsx(t.BodyPrimary,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):e.jsx(e.Fragment,{}),o.caption&&e.jsx(t.BodyCaption,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.secondary},{children:o.caption}))]})]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),s=require("./RadioButton.styled.js"),t=require("../TypographyStyle.js"),l=require("../../constants/Theme.js");const a=i=>{const s=i.isDisabled?l.COLORS.content.inactive:i.isActive?l.COLORS.background.positive.vibrant:l.COLORS.content.primary;return e.jsxs("svg",Object.assign({width:i.isSmall?"16":"20",height:i.isSmall?"16":"20",viewBox:i.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("circle",{cx:i.isSmall?"8":"10",cy:i.isSmall?"8":"10",r:i.isSmall?6:9,stroke:s,strokeWidth:i.isSmall?1.5:2}),i.isActive&&e.jsx("circle",{cx:i.isSmall?"8":"10",cy:i.isSmall?"8":"10",r:i.isSmall?3:5,fill:i.isDisabled?l.COLORS.content.inactive:l.COLORS.background.positive.vibrant})]}))};exports.RadioButton=n=>{const[r,o]=i.useState(n.isActive||!1),[c,d]=i.useState(!1),[O,S]=i.useState(!1);i.useEffect((()=>{o(n.isActive)}),[n.isActive]);return e.jsxs(s.RadioButtonContainer,Object.assign({onClick:()=>{var e;if(!n.skipSelectingOff&&!n.isDisabled){const i=!r;o(i),null===(e=n.onValueChange)||void 0===e||e.call(n,i,n.value)}},onMouseEnter:()=>d(!n.skipHoverState),onMouseLeave:()=>d(!1),onMouseDown:()=>S(!n.skipHoverState),onMouseUp:()=>S(!1),style:n.caption?{alignItems:"flex-start"}:{}},{children:[e.jsx(s.RadioButtonIcon,Object.assign({checked:r,hovered:c,clicked:O,isDisabled:n.isDisabled||!1,size:n.size,style:n.caption?{margin:"2px 0"}:{}},{children:e.jsx(a,{isSmall:"SMALL"===n.size,isActive:r,isDisabled:n.isDisabled||!1})})),e.jsxs("div",{children:[n.label?n.boldOnChecked&&r||n.alwaysBold?e.jsx(t.TitleSmall,Object.assign({color:n.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:n.label})):"SMALL"===n.size?e.jsx(t.BodyCaption,Object.assign({color:n.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:n.label})):"MEDIUM"===n.labelSize?e.jsx(t.BodySecondary,Object.assign({color:n.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:n.label})):e.jsx(t.BodyPrimary,Object.assign({color:n.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:n.label})):e.jsx(e.Fragment,{}),n.caption&&e.jsx(t.BodyCaption,Object.assign({color:n.isDisabled?l.COLORS.text.disabled:l.COLORS.text.secondary},{children:n.caption}))]})]}))};
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
@@ -14,6 +14,5 @@ export type CheckBoxProps = {
14
14
  boldOnChecked?: boolean;
15
15
  style?: React.CSSProperties;
16
16
  enableHover?: boolean;
17
- activeColor?: string;
18
17
  };
19
18
  export declare const CheckBox: React.FC<CheckBoxProps>;
@@ -1 +1 @@
1
- import{jsxs as e,jsx as i,Fragment as l}from"react/jsx-runtime";import{useState as s,useEffect as t,useMemo as a}from"react";import{CheckboxContainer as o,CheckboxIcon as r}from"./CheckBox.styled.js";import{TitleRegular as d,TitleSmall as n,BodySecondary as c,BodyPrimary as h}from"../TypographyStyle.js";import{COLORS as b}from"../../constants/Theme.js";const m=l=>{const s=a((()=>l.activeColor||b.background.positive.vibrant),[l.activeColor]);return e("svg",Object.assign({width:l.isSmall?"16":"18",height:l.isSmall?"16":"18",viewBox:l.isSmall?"0 0 16 16":"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[i("rect",{x:"0",y:"0",width:l.isSmall?"16":"18",height:l.isSmall?"16":"18",rx:"4",fill:l.isDisabled?b.content.inactive:s}),!l.isPartial&&i("svg",Object.assign({width:l.isSmall?"8":"10",height:l.isSmall?"7":"9",x:"4",y:"4",viewBox:"0 0 10 9",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:i("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z",fill:"white"})})),l.isPartial&&i("rect",{x:"5",y:l.isSmall?"7":"8",width:l.isSmall?"6":"8",height:"2",rx:"1",fill:b.surface.standard})]}))},v=a=>{var v;const[g,C]=s(a.isChecked||!1),[p,x]=s(a.isPartiallyChecked||!1),[S,u]=s(a.isDisabled||!1),[w,y]=s(!1),[k,D]=s(!1);t((()=>{C(a.isChecked)}),[a.isChecked]),t((()=>{u(a.isDisabled||!1)}),[a.isDisabled]),t((()=>{x(a.isPartiallyChecked||!1)}),[a.isPartiallyChecked]);return e(o,Object.assign({onClick:e=>{var i;if(!a.isDisabled){const l=!g;p?x(!p):C(l),null===(i=a.onValueChange)||void 0===i||i.call(a,l,a.value,e)}},onMouseEnter:()=>y(!a.skipHoverState),onMouseLeave:()=>y(!1),onMouseDown:()=>D(!a.skipHoverState),onMouseUp:()=>D(!1),isDisabled:S,enableHover:a.enableHover,style:null!==(v=a.style)&&void 0!==v?v:{}},{children:[i(r,Object.assign({checked:g,hovered:w,clicked:k,isDisabled:S,size:a.size,borderColor:a.checkboxBorderColor},{children:g&&i(m,{isPartial:p||!1,isDisabled:S,isSmall:"SMALL"===a.size,activeColor:null==a?void 0:a.activeColor})})),a.label?a.boldOnChecked&&g?"DEFAULT"===a.labelSize?i(d,Object.assign({color:a.isDisabled?b.text.disabled:b.text.primary},{children:a.label})):i(n,Object.assign({color:a.isDisabled?b.text.disabled:b.text.primary},{children:a.label})):"SMALL"===a.size||"SMALL"===a.labelSize?i(c,Object.assign({color:a.isDisabled?b.text.disabled:b.text.primary},{children:a.label})):i(h,Object.assign({color:a.isDisabled?b.text.disabled:b.text.primary},{children:a.label})):i(l,{}),a.rightComponent]}))};export{v as CheckBox};
1
+ import{jsxs as e,jsx as i,Fragment as l}from"react/jsx-runtime";import{useState as s,useEffect as a}from"react";import{CheckboxContainer as t,CheckboxIcon as r}from"./CheckBox.styled.js";import{TitleRegular as o,TitleSmall as d,BodySecondary as n,BodyPrimary as c}from"../TypographyStyle.js";import{COLORS as h}from"../../constants/Theme.js";const b=l=>e("svg",Object.assign({width:l.isSmall?"16":"18",height:l.isSmall?"16":"18",viewBox:l.isSmall?"0 0 16 16":"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[i("rect",{x:"0",y:"0",width:l.isSmall?"16":"18",height:l.isSmall?"16":"18",rx:"4",fill:l.isDisabled?h.content.inactive:h.background.positive.vibrant}),!l.isPartial&&i("svg",Object.assign({width:l.isSmall?"8":"10",height:l.isSmall?"7":"9",x:"4",y:"4",viewBox:"0 0 10 9",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:i("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z",fill:"white"})})),l.isPartial&&i("rect",{x:"5",y:l.isSmall?"7":"8",width:l.isSmall?"6":"8",height:"2",rx:"1",fill:h.surface.standard})]})),m=m=>{var g;const[v,p]=s(m.isChecked||!1),[x,C]=s(m.isPartiallyChecked||!1),[S,w]=s(m.isDisabled||!1),[y,k]=s(!1),[u,D]=s(!1);a((()=>{p(m.isChecked)}),[m.isChecked]),a((()=>{w(m.isDisabled||!1)}),[m.isDisabled]),a((()=>{C(m.isPartiallyChecked||!1)}),[m.isPartiallyChecked]);return e(t,Object.assign({onClick:e=>{var i;if(!m.isDisabled){const l=!v;x?C(!x):p(l),null===(i=m.onValueChange)||void 0===i||i.call(m,l,m.value,e)}},onMouseEnter:()=>k(!m.skipHoverState),onMouseLeave:()=>k(!1),onMouseDown:()=>D(!m.skipHoverState),onMouseUp:()=>D(!1),isDisabled:S,enableHover:m.enableHover,style:null!==(g=m.style)&&void 0!==g?g:{}},{children:[i(r,Object.assign({checked:v,hovered:y,clicked:u,isDisabled:S,size:m.size,borderColor:m.checkboxBorderColor},{children:v&&i(b,{isPartial:x||!1,isDisabled:S,isSmall:"SMALL"===m.size})})),m.label?m.boldOnChecked&&v?"DEFAULT"===m.labelSize?i(o,Object.assign({color:m.isDisabled?h.text.disabled:h.text.primary},{children:m.label})):i(d,Object.assign({color:m.isDisabled?h.text.disabled:h.text.primary},{children:m.label})):"SMALL"===m.size||"SMALL"===m.labelSize?i(n,Object.assign({color:m.isDisabled?h.text.disabled:h.text.primary},{children:m.label})):i(c,Object.assign({color:m.isDisabled?h.text.disabled:h.text.primary},{children:m.label})):i(l,{}),m.rightComponent]}))};export{m as CheckBox};
@@ -12,6 +12,5 @@ export type RadioButtonProps = {
12
12
  labelSize?: 'DEFAULT' | 'MEDIUM';
13
13
  boldOnChecked?: boolean;
14
14
  alwaysBold?: boolean;
15
- activeColor?: string;
16
15
  };
17
16
  export declare const RadioButton: React.FC<RadioButtonProps>;
@@ -1 +1 @@
1
- import{jsxs as i,jsx as e,Fragment as s}from"react/jsx-runtime";import{useState as l,useEffect as t,useMemo as a}from"react";import{RadioButtonContainer as o,RadioButtonIcon as c}from"./RadioButton.styled.js";import{BodyCaption as r,TitleSmall as n,BodySecondary as d,BodyPrimary as b}from"../TypographyStyle.js";import{COLORS as m}from"../../constants/Theme.js";const v=s=>{const l=a((()=>(null==s?void 0:s.activeColor)||m.background.positive.vibrant),[s.activeColor]),t=a((()=>s.isDisabled?m.content.inactive:s.isActive?l:m.content.primary),[s.isDisabled,s.isActive,l]);return i("svg",Object.assign({width:s.isSmall?"16":"20",height:s.isSmall?"16":"20",viewBox:s.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?6:9,stroke:t,strokeWidth:s.isSmall?1.5:2}),s.isActive&&e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?3:5,fill:s.isDisabled?m.content.inactive:l})]}))},p=a=>{const[p,h]=l(a.isActive||!1),[g,x]=l(!1),[S,y]=l(!1);t((()=>{h(a.isActive)}),[a.isActive]);return i(o,Object.assign({onClick:()=>{var i;if(!a.skipSelectingOff&&!a.isDisabled){const e=!p;h(e),null===(i=a.onValueChange)||void 0===i||i.call(a,e,a.value)}},onMouseEnter:()=>x(!a.skipHoverState),onMouseLeave:()=>x(!1),onMouseDown:()=>y(!a.skipHoverState),onMouseUp:()=>y(!1),style:a.caption?{alignItems:"flex-start"}:{}},{children:[e(c,Object.assign({checked:p,hovered:g,clicked:S,isDisabled:a.isDisabled||!1,size:a.size,style:a.caption?{margin:"2px 0"}:{}},{children:e(v,{isSmall:"SMALL"===a.size,isActive:p,isDisabled:a.isDisabled||!1,activeColor:a.activeColor})})),i("div",{children:[a.label?a.boldOnChecked&&p||a.alwaysBold?e(n,Object.assign({color:a.isDisabled?m.text.disabled:m.text.primary},{children:a.label})):"SMALL"===a.size?e(r,Object.assign({color:a.isDisabled?m.text.disabled:m.text.primary},{children:a.label})):"MEDIUM"===a.labelSize?e(d,Object.assign({color:a.isDisabled?m.text.disabled:m.text.primary},{children:a.label})):e(b,Object.assign({color:a.isDisabled?m.text.disabled:m.text.primary},{children:a.label})):e(s,{}),a.caption&&e(r,Object.assign({color:a.isDisabled?m.text.disabled:m.text.secondary},{children:a.caption}))]})]}))};export{p as RadioButton};
1
+ import{jsxs as i,jsx as e,Fragment as s}from"react/jsx-runtime";import{useState as l,useEffect as t}from"react";import{RadioButtonContainer as a,RadioButtonIcon as c}from"./RadioButton.styled.js";import{BodyCaption as o,TitleSmall as r,BodySecondary as n,BodyPrimary as d}from"../TypographyStyle.js";import{COLORS as b}from"../../constants/Theme.js";const m=s=>{const l=s.isDisabled?b.content.inactive:s.isActive?b.background.positive.vibrant:b.content.primary;return i("svg",Object.assign({width:s.isSmall?"16":"20",height:s.isSmall?"16":"20",viewBox:s.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?6:9,stroke:l,strokeWidth:s.isSmall?1.5:2}),s.isActive&&e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?3:5,fill:s.isDisabled?b.content.inactive:b.background.positive.vibrant})]}))},p=p=>{const[v,h]=l(p.isActive||!1),[g,x]=l(!1),[S,y]=l(!1);t((()=>{h(p.isActive)}),[p.isActive]);return i(a,Object.assign({onClick:()=>{var i;if(!p.skipSelectingOff&&!p.isDisabled){const e=!v;h(e),null===(i=p.onValueChange)||void 0===i||i.call(p,e,p.value)}},onMouseEnter:()=>x(!p.skipHoverState),onMouseLeave:()=>x(!1),onMouseDown:()=>y(!p.skipHoverState),onMouseUp:()=>y(!1),style:p.caption?{alignItems:"flex-start"}:{}},{children:[e(c,Object.assign({checked:v,hovered:g,clicked:S,isDisabled:p.isDisabled||!1,size:p.size,style:p.caption?{margin:"2px 0"}:{}},{children:e(m,{isSmall:"SMALL"===p.size,isActive:v,isDisabled:p.isDisabled||!1})})),i("div",{children:[p.label?p.boldOnChecked&&v||p.alwaysBold?e(r,Object.assign({color:p.isDisabled?b.text.disabled:b.text.primary},{children:p.label})):"SMALL"===p.size?e(o,Object.assign({color:p.isDisabled?b.text.disabled:b.text.primary},{children:p.label})):"MEDIUM"===p.labelSize?e(n,Object.assign({color:p.isDisabled?b.text.disabled:b.text.primary},{children:p.label})):e(d,Object.assign({color:p.isDisabled?b.text.disabled:b.text.primary},{children:p.label})):e(s,{}),p.caption&&e(o,Object.assign({color:p.isDisabled?b.text.disabled:b.text.secondary},{children:p.caption}))]})]}))};export{p as RadioButton};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.627-colorFill",
3
+ "version": "0.0.627-containerStyle-2",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",