@ntbjs/react-components 2.0.0-rc.3 → 2.0.0-rc.30

package/{esm/components → build}/inputs/Radio/Radio.styled.js

@@ -1,33 +1,28 @@
 import { math } from 'polished';
 import styled, { css } from 'styled-components';
-import { applyDefaultTheme } from '../../../utils/defaultTheme.js';
+import { applyDefaultTheme } from '../../utils/defaultTheme.js';
 
-let _ = t => t,
-  _t,
-  _t2,
-  _t3,
-  _t4;
 const radioSize = '18px';
-const RadioLabel = styled.div.attrs(applyDefaultTheme)(_t || (_t = _`
-  padding-left: ${0};
+const RadioLabel = styled.div.attrs(applyDefaultTheme)`
+  padding-left: ${math(`${radioSize} + 10px`)};
   font-weight: 400;
   font-size: 0.875rem;
 
-  ${0};
-`), math(`${radioSize} + 10px`), props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600')));
-const Radio = styled.label.attrs(applyDefaultTheme)(_t2 || (_t2 = _`
+  ${props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'))};
+`;
+const Radio = styled.label.attrs(applyDefaultTheme)`
   display: block;
   position: relative;
   cursor: pointer;
-  line-height: ${0};
+  line-height: ${radioSize};
   user-select: none;
 
   &::before {
     content: '';
     position: absolute;
-    border: 2px solid ${0};
-    width: ${0};
-    height: ${0};
+    border: 2px solid ${props => props.theme.getColor('gray-300')};
+    width: ${radioSize};
+    height: ${radioSize};
     top: 0;
     border-radius: 50%;
     transition: all 200ms;
@@ -48,15 +43,15 @@ const Radio = styled.label.attrs(applyDefaultTheme)(_t2 || (_t2 = _`
 
   &:has(input:checked) {
     ::before {
-      border-color: ${0};
+      border-color: ${props => props.theme.getColor('emerald-500')};
     }
 
     ::after {
-      background: ${0};
+      background: ${props => props.theme.getColor('emerald-500')};
       transform: scale(1);
     }
 
-    ${0} {
+    ${RadioLabel} {
       opacity: 1;
     }
   }
@@ -68,17 +63,18 @@ const Radio = styled.label.attrs(applyDefaultTheme)(_t2 || (_t2 = _`
     }
   }
 
-  ${0}
-
-  ${0}
-`), radioSize, props => props.theme.getColor('gray-300'), radioSize, radioSize, props => props.theme.getColor('emerald-500'), props => props.theme.getColor('emerald-500'), RadioLabel, props => props.readOnly && css(_t3 || (_t3 = _`
+  ${props => props.readOnly && css`
       opacity: 0.5;
       pointer-events: none;
       user-select: text;
-    `)), props => props.disabled && css(_t4 || (_t4 = _`
+    `}
+
+  ${props => props.disabled && css`
       opacity: 0.5;
       cursor: not-allowed;
       user-select: text;
-    `)));
+    `}
+`;
 
 export { Radio, RadioLabel };
+//# sourceMappingURL=Radio.styled.js.map

package/build/inputs/Radio/Radio.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Radio.styled.js","sources":["../../../src/components/inputs/Radio/Radio.styled.js"],"sourcesContent":["import { math } from 'polished';\nimport styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nconst radioSize = '18px';\n\nexport const RadioLabel = styled.div.attrs(applyDefaultTheme)`\n  padding-left: ${math(`${radioSize} + 10px`)};\n  font-weight: 400;\n  font-size: 0.875rem;\n\n  ${props =>\n    props.theme.themeProp(\n      'color',\n      props.theme.getColor('gray-300'),\n      props.theme.getColor('gray-600')\n    )};\n`;\n\nexport const Radio = styled.label.attrs(applyDefaultTheme)`\n  display: block;\n  position: relative;\n  cursor: pointer;\n  line-height: ${radioSize};\n  user-select: none;\n\n  &::before {\n    content: '';\n    position: absolute;\n    border: 2px solid ${props => props.theme.getColor('gray-300')};\n    width: ${radioSize};\n    height: ${radioSize};\n    top: 0;\n    border-radius: 50%;\n    transition: all 200ms;\n    box-sizing: border-box;\n  }\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 8px;\n    height: 8px;\n    top: 5px;\n    left: 5px;\n    border-radius: 50%;\n    transform: scale(0);\n    transition: all 200ms;\n  }\n\n  &:has(input:checked) {\n    ::before {\n      border-color: ${props => props.theme.getColor('emerald-500')};\n    }\n\n    ::after {\n      background: ${props => props.theme.getColor('emerald-500')};\n      transform: scale(1);\n    }\n\n    ${RadioLabel} {\n      opacity: 1;\n    }\n  }\n  & {\n    input[type='radio'] {\n      position: absolute;\n      opacity: 0;\n      pointer-events: none;\n    }\n  }\n\n  ${props =>\n    props.readOnly &&\n    css`\n      opacity: 0.5;\n      pointer-events: none;\n      user-select: text;\n    `}\n\n  ${props =>\n    props.disabled &&\n    css`\n      opacity: 0.5;\n      cursor: not-allowed;\n      user-select: text;\n    `}\n`;\n"],"names":["radioSize","RadioLabel","styled","div","attrs","applyDefaultTheme","math","props","theme","themeProp","getColor","Radio","label","readOnly","css","disabled"],"mappings":";;;;AAIA,MAAMA,SAAS,GAAG,MAAM,CAAA;AAEjB,MAAMC,UAAU,GAAGC,MAAM,CAACC,GAAG,CAACC,KAAK,CAACC,iBAAiB,CAAC,CAAA;AAC7D,gBAAA,EAAkBC,IAAI,CAAC,CAAGN,EAAAA,SAAS,SAAS,CAAC,CAAA;AAC7C;AACA;AACA;AACA,EAAIO,EAAAA,KAAK,IACLA,KAAK,CAACC,KAAK,CAACC,SAAS,CACnB,OAAO,EACPF,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,EAChCH,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,UAAU,CACjC,CAAC,CAAA;AACL,EAAC;AAEM,MAAMC,KAAK,GAAGT,MAAM,CAACU,KAAK,CAACR,KAAK,CAACC,iBAAiB,CAAC,CAAA;AAC1D;AACA;AACA;AACA,eAAA,EAAiBL,SAAS,CAAA;AAC1B;AACA;AACA;AACA;AACA;AACA,sBAAwBO,EAAAA,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,CAAA;AACjE,WAAA,EAAaV,SAAS,CAAA;AACtB,YAAA,EAAcA,SAAS,CAAA;AACvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAsBO,EAAAA,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,aAAa,CAAC,CAAA;AAClE;AACA;AACA;AACA,kBAAoBH,EAAAA,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,aAAa,CAAC,CAAA;AAChE;AACA;AACA;AACA,IAAA,EAAMT,UAAU,CAAA;AAChB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,EAAA,EAAIM,KAAK,IACLA,KAAK,CAACM,QAAQ,IACdC,GAAG,CAAA;AACP;AACA;AACA;AACA,IAAK,CAAA,CAAA;AACL;AACA,EAAA,EAAIP,KAAK,IACLA,KAAK,CAACQ,QAAQ,IACdD,GAAG,CAAA;AACP;AACA;AACA;AACA,IAAK,CAAA,CAAA;AACL;;;;"}

package/build/inputs/Radio/index.js

@@ -0,0 +1,2 @@
+export { default } from './Radio.js';
+//# sourceMappingURL=index.js.map

package/build/inputs/Radio/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/{esm/components → build}/inputs/Switch/Switch.js

@@ -1,10 +1,9 @@
-import React from '../../../node_modules/react/index.js';
+import React__default, { useState } from 'react';
 import { nanoid } from 'nanoid';
-import PropTypes from '../../../node_modules/prop-types/index.js';
-import { Switch as Switch$2, SwitchLabel, SwitchIndicator, SwitchIndicatorButton, SwitchIndicatorLabelText, Description } from './Switch.styled.js';
-import { r as react } from '../../../_virtual/index.js';
+import PropTypes from 'prop-types';
+import { Switch as Switch$1, SwitchLabel, SwitchIndicator, SwitchIndicatorButton, SwitchIndicatorLabelText, Description } from './Switch.styled.js';
 
-const Switch = React.forwardRef(function Switch({
+const Switch = React__default.forwardRef(function Switch({
   name,
   checked,
   defaultChecked,
@@ -18,15 +17,15 @@ const Switch = React.forwardRef(function Switch({
   onChange,
   onBlur
 }, forwardedRef) {
-  const [uniqueId] = react.exports.useState(nanoid());
-  return React.createElement(Switch$2, {
+  const [uniqueId] = useState(nanoid());
+  return React__default.createElement(Switch$1, {
     disabled: disabled,
     readOnly: readOnly,
     className: className,
     style: style
-  }, React.createElement(SwitchLabel, {
+  }, React__default.createElement(SwitchLabel, {
     htmlFor: uniqueId
-  }, React.createElement("input", {
+  }, React__default.createElement("input", {
     ref: forwardedRef,
     checked: checked,
     defaultChecked: defaultChecked,
@@ -37,7 +36,7 @@ const Switch = React.forwardRef(function Switch({
     type: "checkbox",
     onBlur: onBlur,
     onChange: onChange
-  }), React.createElement(SwitchIndicator, null, React.createElement(SwitchIndicatorButton, null)), typeof label === 'string' && label.length > 0 && React.createElement(SwitchIndicatorLabelText, null, label)), typeof description === 'string' && description.length > 0 && React.createElement(Description, {
+  }), React__default.createElement(SwitchIndicator, null, React__default.createElement(SwitchIndicatorButton, null)), typeof label === 'string' && label.length > 0 && React__default.createElement(SwitchIndicatorLabelText, null, label)), typeof description === 'string' && description.length > 0 && React__default.createElement(Description, {
     spaciousDescription: spaciousDescription
   }, description));
 });
@@ -60,6 +59,6 @@ Switch.defaultProps = {
   disabled: false,
   readOnly: false
 };
-var Switch$1 = Switch;
 
-export { Switch$1 as default };
+export { Switch as default };
+//# sourceMappingURL=Switch.js.map

package/build/inputs/Switch/Switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.js","sources":["../../../src/components/inputs/Switch/Switch.js"],"sourcesContent":["import React, { useState } from 'react';\n\nimport { nanoid } from 'nanoid';\nimport PropTypes from 'prop-types';\n\nimport * as S from './Switch.styled';\n\n/**\n * The Switch allows the user to toggle an option.\n *\n * ### Import\n *\n * ``` js\n * import { Switch } from '@ntbjs/react-components/inputs'\n * // or\n * import Switch from '@ntbjs/react-components/inputs/Switch'\n * ```\n */\nconst Switch = React.forwardRef(function Switch(\n  {\n    name,\n    checked,\n    defaultChecked,\n    label,\n    disabled,\n    readOnly,\n    description,\n    spaciousDescription,\n    className,\n    style,\n    onChange,\n    onBlur\n  },\n  forwardedRef\n) {\n  const [uniqueId] = useState(nanoid());\n\n  return (\n    <S.Switch disabled={disabled} readOnly={readOnly} className={className} style={style}>\n      <S.SwitchLabel htmlFor={uniqueId}>\n        <input\n          ref={forwardedRef}\n          checked={checked}\n          defaultChecked={defaultChecked}\n          disabled={disabled}\n          readOnly={readOnly}\n          id={uniqueId}\n          name={name}\n          type=\"checkbox\"\n          onBlur={onBlur}\n          onChange={onChange}\n        />\n        <S.SwitchIndicator>\n          <S.SwitchIndicatorButton />\n        </S.SwitchIndicator>\n        {typeof label === 'string' && label.length > 0 && (\n          <S.SwitchIndicatorLabelText>{label}</S.SwitchIndicatorLabelText>\n        )}\n      </S.SwitchLabel>\n      {typeof description === 'string' && description.length > 0 && (\n        <S.Description spaciousDescription={spaciousDescription}>{description}</S.Description>\n      )}\n    </S.Switch>\n  );\n});\n\nSwitch.propTypes = {\n  children: PropTypes.any,\n  name: PropTypes.string.isRequired,\n\n  /**\n   * Whether the switch is toggled on or off\n   */\n  checked: PropTypes.bool,\n\n  /**\n   * Whether the switch is toggled on by default\n   */\n  defaultChecked: PropTypes.bool,\n\n  /**\n   * Text displayed next to the switch\n   */\n  label: PropTypes.string,\n\n  /**\n   * Whether the switch is toggled on\n   */\n  disabled: PropTypes.bool,\n\n  /**\n   * Whether the switch is displayed as read-only\n   */\n  readOnly: PropTypes.bool,\n\n  /**\n   * Text displayed underneath the switch\n   */\n  description: PropTypes.string,\n\n  /**\n   * Whether there should be extra `margin` added between the switch and the description\n   */\n  spaciousDescription: PropTypes.bool,\n\n  /**\n   * Add extra classes to the HTML element\n   */\n  className: PropTypes.string,\n\n  /**\n   * Custom CSS styling\n   */\n  style: PropTypes.object,\n\n  /**\n   * Optional callback function for the `onChange` event\n   */\n  onChange: PropTypes.func,\n\n  /**\n   * Optional callback function for the `onBlur` event\n   */\n  onBlur: PropTypes.func\n};\n\nSwitch.defaultProps = {\n  disabled: false,\n  readOnly: false\n};\n\nexport default Switch;\n"],"names":["Switch","React","forwardRef","name","checked","defaultChecked","label","disabled","readOnly","description","spaciousDescription","className","style","onChange","onBlur","forwardedRef","uniqueId","useState","nanoid","createElement","S","htmlFor","ref","id","type","length","propTypes","process","env","NODE_ENV","children","PropTypes","any","string","isRequired","bool","object","func","defaultProps"],"mappings":";;;;;AAkBMA,MAAAA,MAAM,GAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,MAAMA,CAC7C;EACEG,IAAI;EACJC,OAAO;EACPC,cAAc;EACdC,KAAK;EACLC,QAAQ;EACRC,QAAQ;EACRC,WAAW;EACXC,mBAAmB;EACnBC,SAAS;EACTC,KAAK;EACLC,QAAQ;AACRC,EAAAA,MAAAA;AACF,CAAC,EACDC,YAAY,EACZ;EACA,MAAM,CAACC,QAAQ,CAAC,GAAGC,QAAQ,CAACC,MAAM,EAAE,CAAC,CAAA;AAErC,EAAA,OACEjB,cAAA,CAAAkB,aAAA,CAACC,QAAQ,EAAA;AAACb,IAAAA,QAAQ,EAAEA,QAAS;AAACC,IAAAA,QAAQ,EAAEA,QAAS;AAACG,IAAAA,SAAS,EAAEA,SAAU;AAACC,IAAAA,KAAK,EAAEA,KAAAA;AAAM,GAAA,EACnFX,cAAA,CAAAkB,aAAA,CAACC,WAAa,EAAA;AAACC,IAAAA,OAAO,EAAEL,QAAAA;GACtBf,EAAAA,cAAA,CAAAkB,aAAA,CAAA,OAAA,EAAA;AACEG,IAAAA,GAAG,EAAEP,YAAa;AAClBX,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,cAAc,EAAEA,cAAe;AAC/BE,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,QAAQ,EAAEA,QAAS;AACnBe,IAAAA,EAAE,EAAEP,QAAS;AACbb,IAAAA,IAAI,EAAEA,IAAK;AACXqB,IAAAA,IAAI,EAAC,UAAU;AACfV,IAAAA,MAAM,EAAEA,MAAO;AACfD,IAAAA,QAAQ,EAAEA,QAAAA;AAAS,GACpB,CAAC,EACFZ,cAAA,CAAAkB,aAAA,CAACC,eAAiB,EAAA,IAAA,EAChBnB,cAAA,CAAAkB,aAAA,CAACC,qBAAuB,EAAA,IAAE,CACT,CAAC,EACnB,OAAOd,KAAK,KAAK,QAAQ,IAAIA,KAAK,CAACmB,MAAM,GAAG,CAAC,IAC5CxB,cAAA,CAAAkB,aAAA,CAACC,wBAA0B,EAAA,IAAA,EAAEd,KAAkC,CAEpD,CAAC,EACf,OAAOG,WAAW,KAAK,QAAQ,IAAIA,WAAW,CAACgB,MAAM,GAAG,CAAC,IACxDxB,cAAA,CAAAkB,aAAA,CAACC,WAAa,EAAA;AAACV,IAAAA,mBAAmB,EAAEA,mBAAAA;GAAsBD,EAAAA,WAA2B,CAE/E,CAAC,CAAA;AAEf,CAAC,EAAC;AAEFT,MAAM,CAAC0B,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAG,YAAA,GAAA;EACjBC,QAAQ,EAAEC,SAAS,CAACC,GAAG;AACvB7B,EAAAA,IAAI,EAAE4B,SAAS,CAACE,MAAM,CAACC,UAAU;EAKjC9B,OAAO,EAAE2B,SAAS,CAACI,IAAI;EAKvB9B,cAAc,EAAE0B,SAAS,CAACI,IAAI;EAK9B7B,KAAK,EAAEyB,SAAS,CAACE,MAAM;EAKvB1B,QAAQ,EAAEwB,SAAS,CAACI,IAAI;EAKxB3B,QAAQ,EAAEuB,SAAS,CAACI,IAAI;EAKxB1B,WAAW,EAAEsB,SAAS,CAACE,MAAM;EAK7BvB,mBAAmB,EAAEqB,SAAS,CAACI,IAAI;EAKnCxB,SAAS,EAAEoB,SAAS,CAACE,MAAM;EAK3BrB,KAAK,EAAEmB,SAAS,CAACK,MAAM;EAKvBvB,QAAQ,EAAEkB,SAAS,CAACM,IAAI;EAKxBvB,MAAM,EAAEiB,SAAS,CAACM,IAAAA;AACpB,CAAC,GAAA,EAAA,CAAA;AAEDrC,MAAM,CAACsC,YAAY,GAAG;AACpB/B,EAAAA,QAAQ,EAAE,KAAK;AACfC,EAAAA,QAAQ,EAAE,KAAA;AACZ,CAAC;;;;"}

package/build/inputs/Switch/Switch.styled.js

@@ -0,0 +1,102 @@
+import { math, rgba } from 'polished';
+import styled, { css } from 'styled-components';
+import { applyDefaultTheme } from '../../utils/defaultTheme.js';
+
+const switchButtonSize = '16px';
+const Switch = styled.div.attrs(applyDefaultTheme)`
+  * {
+    box-sizing: border-box;
+  }
+
+  display: flex;
+  flex-direction: column;
+
+  ${props => props.readOnly && css`
+      opacity: 0.5;
+      > * {
+        pointer-events: none;
+        user-select: text;
+      }
+    `}
+
+  ${props => props.disabled && css`
+      opacity: 0.5;
+      cursor: not-allowed;
+      * {
+        pointer-events: none;
+        user-select: text;
+      }
+    `}
+`;
+const SwitchIndicator = styled.div.attrs(applyDefaultTheme)`
+  display: inline-block;
+  position: relative;
+  ${props => props.theme.themeProp('background', props.theme.getColor('gray-900'), props.theme.getColor('gray-200'))}
+  height: ${math(`${switchButtonSize} + 2px`)};
+  width: 32px;
+  border-radius: 20px;
+  border: 1px solid;
+  ${props => props.theme.themeProp('border-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-300'))}
+  transition: background 200ms;
+`;
+const SwitchIndicatorButton = styled.div.attrs(applyDefaultTheme)`
+  position: absolute;
+  ${props => props.theme.themeProp('background', props.theme.getColor('gray-200'), props.theme.getColor('white'))}
+  height: ${switchButtonSize};
+  width: ${switchButtonSize};
+  border-radius: 50%;
+  box-shadow: ${props => props.theme.getColor('gray-500')} 0 0px 2px 0px;
+  transition: left 200ms;
+`;
+const SwitchIndicatorLabelText = styled.div.attrs(applyDefaultTheme)`
+  padding-left: 10px;
+  font-weight: 400;
+  font-size: 0.875rem;
+  line-height: 18px;
+
+  ${props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-600'))};
+`;
+const SwitchLabel = styled.label.attrs(applyDefaultTheme)`
+  display: inline-flex;
+  margin-right: auto;
+  cursor: pointer;
+
+  input[type='checkbox'] {
+    position: absolute;
+    opacity: 0;
+  }
+
+  &:has(input[type='checkbox']:not(:checked)) {
+    ${SwitchIndicatorButton} {
+      left: 0;
+    }
+  }
+
+  &:has(input[type='checkbox']:checked) {
+    ${SwitchIndicatorButton} {
+      left: calc(100% - ${switchButtonSize});
+    }
+
+    ${SwitchIndicator} {
+      background: ${props => props.theme.getColor('emerald-500')};
+
+      ${props => props.theme.themeProp('border-color', props.theme.getColor('gray-400'), props.theme.getColor('gray-300'), 1)}
+    }
+  }
+
+  &:has(input[type='checkbox']:focus-visible) {
+    ${SwitchIndicatorButton} {
+      ${props => props.theme.themeProp('outline', `8px solid ${rgba(props.theme.getColor('emerald-500'), 0.5)}`, `8px solid ${rgba(props.theme.getColor('emerald-500'), 0.3)}`, 1)}
+    }
+  }
+`;
+const Description = styled.div.attrs(applyDefaultTheme)`
+  margin: ${props => props.spaciousDescription ? '16px' : '6px'} 0 0 0;
+  font-size: 0.75rem;
+  line-height: 1.333;
+
+  ${props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'))};
+`;
+
+export { Description, Switch, SwitchIndicator, SwitchIndicatorButton, SwitchIndicatorLabelText, SwitchLabel };
+//# sourceMappingURL=Switch.styled.js.map

package/build/inputs/Switch/Switch.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.styled.js","sources":["../../../src/components/inputs/Switch/Switch.styled.js"],"sourcesContent":["import { math, rgba } from 'polished';\nimport styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nconst switchButtonSize = '16px';\n\nexport const Switch = styled.div.attrs(applyDefaultTheme)`\n  * {\n    box-sizing: border-box;\n  }\n\n  display: flex;\n  flex-direction: column;\n\n  ${props =>\n    props.readOnly &&\n    css`\n      opacity: 0.5;\n      > * {\n        pointer-events: none;\n        user-select: text;\n      }\n    `}\n\n  ${props =>\n    props.disabled &&\n    css`\n      opacity: 0.5;\n      cursor: not-allowed;\n      * {\n        pointer-events: none;\n        user-select: text;\n      }\n    `}\n`;\n\nexport const SwitchIndicator = styled.div.attrs(applyDefaultTheme)`\n  display: inline-block;\n  position: relative;\n  ${props =>\n    props.theme.themeProp(\n      'background',\n      props.theme.getColor('gray-900'),\n      props.theme.getColor('gray-200')\n    )}\n  height: ${math(`${switchButtonSize} + 2px`)};\n  width: 32px;\n  border-radius: 20px;\n  border: 1px solid;\n  ${props =>\n    props.theme.themeProp(\n      'border-color',\n      props.theme.getColor('gray-500'),\n      props.theme.getColor('gray-300')\n    )}\n  transition: background 200ms;\n`;\n\nexport const SwitchIndicatorButton = styled.div.attrs(applyDefaultTheme)`\n  position: absolute;\n  ${props =>\n    props.theme.themeProp(\n      'background',\n      props.theme.getColor('gray-200'),\n      props.theme.getColor('white')\n    )}\n  height: ${switchButtonSize};\n  width: ${switchButtonSize};\n  border-radius: 50%;\n  box-shadow: ${props => props.theme.getColor('gray-500')} 0 0px 2px 0px;\n  transition: left 200ms;\n`;\n\nexport const SwitchIndicatorLabelText = styled.div.attrs(applyDefaultTheme)`\n  padding-left: 10px;\n  font-weight: 400;\n  font-size: 0.875rem;\n  line-height: 18px;\n\n  ${props =>\n    props.theme.themeProp(\n      'color',\n      props.theme.getColor('gray-300'),\n      props.theme.getColor('gray-600')\n    )};\n`;\n\nexport const SwitchLabel = styled.label.attrs(applyDefaultTheme)`\n  display: inline-flex;\n  margin-right: auto;\n  cursor: pointer;\n\n  input[type='checkbox'] {\n    position: absolute;\n    opacity: 0;\n  }\n\n  &:has(input[type='checkbox']:not(:checked)) {\n    ${SwitchIndicatorButton} {\n      left: 0;\n    }\n  }\n\n  &:has(input[type='checkbox']:checked) {\n    ${SwitchIndicatorButton} {\n      left: calc(100% - ${switchButtonSize});\n    }\n\n    ${SwitchIndicator} {\n      background: ${props => props.theme.getColor('emerald-500')};\n\n      ${props =>\n        props.theme.themeProp(\n          'border-color',\n          props.theme.getColor('gray-400'),\n          props.theme.getColor('gray-300'),\n          1\n        )}\n    }\n  }\n\n  &:has(input[type='checkbox']:focus-visible) {\n    ${SwitchIndicatorButton} {\n      ${props =>\n        props.theme.themeProp(\n          'outline',\n          `8px solid ${rgba(props.theme.getColor('emerald-500'), 0.5)}`,\n          `8px solid ${rgba(props.theme.getColor('emerald-500'), 0.3)}`,\n          1\n        )}\n    }\n  }\n`;\n\nexport const Description = styled.div.attrs(applyDefaultTheme)`\n  margin: ${props => (props.spaciousDescription ? '16px' : '6px')} 0 0 0;\n  font-size: 0.75rem;\n  line-height: 1.333;\n\n  ${props =>\n    props.theme.themeProp(\n      'color',\n      props.theme.getColor('gray-400'),\n      props.theme.getColor('gray-500')\n    )};\n`;\n"],"names":["switchButtonSize","Switch","styled","div","attrs","applyDefaultTheme","props","readOnly","css","disabled","SwitchIndicator","theme","themeProp","getColor","math","SwitchIndicatorButton","SwitchIndicatorLabelText","SwitchLabel","label","rgba","Description","spaciousDescription"],"mappings":"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"}

package/build/inputs/Switch/index.js

@@ -0,0 +1,2 @@
+export { default } from './Switch.js';
+//# sourceMappingURL=index.js.map

package/build/inputs/Switch/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/{esm/components → build}/inputs/TextArea/TextArea.js

@@ -1,76 +1,78 @@
-import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import React from '../../../node_modules/react/index.js';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default, { useRef, useState, useMemo, useEffect, useCallback } from 'react';
 import { isEmpty } from 'lodash';
-import useMergedRefs from '../../../node_modules/@restart/hooks/esm/useMergedRefs.js';
+import useMergedRefs from '@restart/hooks/useMergedRefs';
 import { nanoid } from 'nanoid';
-import PropTypes from '../../../node_modules/prop-types/index.js';
-import { ReactComponent as SvgEditNote } from '../../../icons/edit-note.svg.js';
-import { TextAreaContainter, Label, SuccessContainerLabel, TextInput, TextInputFieldIconAlert, TextInputField, SuccessContainer, InputIconContainer, TextInputLabel, Description } from './TextArea.styled.js';
+import PropTypes from 'prop-types';
+import '../../data/Alert/Alert.js';
+import '../../data/Badge/Badge.js';
+import '../../data/Popover/Popover.js';
+import '../../data/Tab/Tab.js';
+import '../../data/Tabs/Tabs.js';
 import Tooltip from '../../data/Tooltip/Tooltip.js';
-import { r as react } from '../../../_virtual/index.js';
+import '../../data/VerificationStatusIcon/VerificationStatusIcon.js';
+import { ReactComponent as SvgEditNote } from '../../icons/edit-note.svg.js';
+import { TextAreaContainter, Label, SuccessContainerLabel, TextInput, TextInputFieldIconAlert, TextInputField, SuccessContainer, InputIconContainer, TextInputLabel, Description } from './TextArea.styled.js';
 
-const _excluded = ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "autoComplete", "description", "type", "icon", "rows", "className", "style", "onChange", "onBlur", "noBorder", "instructionsTextArea", "loadingIcon", "successIcon", "padding", "descriptionToolTip", "borderRadius", "fieldLabel"];
-const TextArea = React.forwardRef(function TextArea(_ref, forwardedRef) {
-  let {
-      value,
-      defaultValue,
-      name,
-      label,
-      placeholder,
-      required,
-      disabled,
-      hidden,
-      readOnly,
-      edit,
-      autoComplete,
-      description,
-      type,
-      icon,
-      rows,
-      className,
-      style,
-      onChange,
-      onBlur,
-      noBorder,
-      instructionsTextArea,
-      loadingIcon,
-      successIcon,
-      padding,
-      descriptionToolTip,
-      borderRadius,
-      fieldLabel
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  const textInputDomNode = react.exports.useRef(null);
+const TextArea = React__default.forwardRef(function TextArea({
+  value,
+  defaultValue,
+  name,
+  label,
+  placeholder,
+  required,
+  disabled,
+  hidden,
+  readOnly,
+  edit,
+  autoComplete,
+  description,
+  type,
+  icon,
+  rows,
+  className,
+  style,
+  onChange,
+  onBlur,
+  noBorder,
+  loadingIcon,
+  successIcon,
+  padding,
+  descriptionToolTip,
+  borderRadius,
+  fieldLabel,
+  ...rest
+}, forwardedRef) {
+  const textInputDomNode = useRef(null);
   const textInputRef = useMergedRefs(forwardedRef, textInputDomNode);
-  const [inputIsEmpty, setInputIsEmpty] = react.exports.useState(!(value || defaultValue));
-  const [autoFocus, setAutoFocus] = react.exports.useState(false);
-  const [uniqueId] = react.exports.useState(nanoid());
-  const memoizedDescriptionToolTip = react.exports.useMemo(() => {
+  const [inputIsEmpty, setInputIsEmpty] = useState(!(value || defaultValue));
+  const [autoFocus, setAutoFocus] = useState(false);
+  const [uniqueId] = useState(nanoid());
+  const memoizedDescriptionToolTip = useMemo(() => {
     return descriptionToolTip;
   }, [descriptionToolTip]);
-  react.exports.useEffect(() => {
+  useEffect(() => {
     setAutoFocus(false);
   }, [value, defaultValue]);
-  const onKeyDown = react.exports.useCallback(event => {
+  const onKeyDown = useCallback(event => {
     if (event.key === 'Enter') {
       event.stopPropagation();
     }
   }, []);
   const input = () => {
-    return React.createElement(TextAreaContainter, null, fieldLabel && React.createElement(Label, {
+    return React__default.createElement(TextAreaContainter, null, fieldLabel && React__default.createElement(Label, {
       htmlFor: uniqueId,
       disabled: disabled
-    }, fieldLabel, React.createElement(SuccessContainerLabel, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), React.createElement(TextInput, {
+    }, fieldLabel, React__default.createElement(SuccessContainerLabel, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), React__default.createElement(TextInput, {
       $fieldLabel: !isEmpty(fieldLabel),
       disabled: disabled,
       readOnly: readOnly,
       type: type,
       className: className,
       style: style
-    }, React.createElement(TextInputFieldIconAlert, {
+    }, React__default.createElement(TextInputFieldIconAlert, {
       type: type
-    }, icon), React.createElement(TextInputField, _extends({
+    }, icon), React__default.createElement(TextInputField, _extends({
       autoFocus: autoFocus,
       borderRadius: borderRadius,
       ref: textInputRef,
@@ -83,7 +85,6 @@ const TextArea = React.forwardRef(function TextArea(_ref, forwardedRef) {
       readOnly: readOnly,
       disabled: disabled,
       edit: edit,
-      instructionsTextArea: instructionsTextArea,
       type: type,
       autoComplete: autoComplete,
       hasIcon: Boolean(icon),
@@ -108,22 +109,21 @@ const TextArea = React.forwardRef(function TextArea(_ref, forwardedRef) {
       onKeyDown: onKeyDown,
       onBlur: onBlur,
       noBorder: noBorder
-    }, rest)), !fieldLabel && (type === 'loading' || type === 'success') && React.createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && noBorder && React.createElement(InputIconContainer, {
+    }, rest)), !fieldLabel && (type === 'loading' || type === 'success') && React__default.createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon), !readOnly && noBorder && React__default.createElement(InputIconContainer, {
       disabled: disabled
-    }, React.createElement(SvgEditNote, {
+    }, React__default.createElement(SvgEditNote, {
       className: padding === 'small' ? 'smallPadingIcon' : undefined
-    })), label && React.createElement(TextInputLabel, {
+    })), label && React__default.createElement(TextInputLabel, {
       htmlFor: `text-input-${uniqueId}`,
       hasPlaceholder: Boolean(placeholder),
       hasIcon: Boolean(icon),
-      inputIsEmpty: inputIsEmpty,
-      type: type
-    }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React.createElement(Description, {
+      inputIsEmpty: inputIsEmpty
+    }, label, required && ' *'), typeof description === 'string' && description.length > 0 && React__default.createElement(Description, {
       type: type
     }, description)));
   };
   if (hidden) return null;
-  return React.createElement(React.Fragment, null, !memoizedDescriptionToolTip && input(), memoizedDescriptionToolTip && React.createElement("div", null, React.createElement(Tooltip, {
+  return React__default.createElement(React__default.Fragment, null, !memoizedDescriptionToolTip && input(), memoizedDescriptionToolTip && React__default.createElement("div", null, React__default.createElement(Tooltip, {
     content: memoizedDescriptionToolTip,
     key: "tooltipTextArea1",
     placement: "bottom-end",
@@ -139,7 +139,6 @@ TextArea.defaultProps = {
   hidden: false,
   type: '',
   padding: 'medium',
-  instructionsTextArea: false,
   descriptionToolTip: '',
   isExpanded: () => {},
   onChange: () => {},
@@ -159,8 +158,6 @@ TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
   edit: PropTypes.bool,
   autoComplete: PropTypes.string,
   description: PropTypes.string,
-  error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-  warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
   icon: PropTypes.element,
   rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
   className: PropTypes.string,
@@ -171,12 +168,11 @@ TextArea.propTypes = process.env.NODE_ENV !== "production" ? {
   noBorder: PropTypes.bool,
   isExpanded: PropTypes.func,
   type: PropTypes.oneOf(['', 'error', 'error-border', 'warning-border', 'warning', 'loading', 'success']),
-  instructionsTextArea: PropTypes.bool,
   loadingIcon: PropTypes.element,
   successIcon: PropTypes.element,
   descriptionToolTip: PropTypes.string,
   borderRadius: PropTypes.number
 } : {};
-var TextArea$1 = TextArea;
 
-export { TextArea$1 as default };
+export { TextArea as default };
+//# sourceMappingURL=TextArea.js.map

package/build/inputs/TextArea/TextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.js","sources":["../../../src/components/inputs/TextArea/TextArea.js"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState, useMemo } from 'react';\n\nimport { isEmpty } from 'lodash';\nimport useMergedRefs from '@restart/hooks/useMergedRefs';\nimport { nanoid } from 'nanoid';\nimport PropTypes from 'prop-types';\nimport { Tooltip } from '../../data';\n\nimport { ReactComponent as EditNoteIcon } from '../../../icons/edit-note.svg';\nimport * as S from './TextArea.styled';\n\n/**\n * Text areas let users enter and edit text in the UI. They typically appear in forms and dialogs.\n *\n * ### Import\n *\n * ``` js\n * import { TextArea } from '@ntbjs/react-components/inputs'\n * // or\n * import TextArea from '@ntbjs/react-components/inputs/TextArea'\n * ```\n */\nconst TextArea = React.forwardRef(function TextArea(\n  {\n    value,\n    defaultValue,\n    name,\n    label,\n    placeholder,\n    required,\n    disabled,\n    hidden,\n    readOnly,\n    edit,\n    autoComplete,\n    description,\n    type,\n    icon,\n    rows,\n    className,\n    style,\n    onChange,\n    onBlur,\n    noBorder,\n    loadingIcon,\n    successIcon,\n    padding,\n    descriptionToolTip,\n    borderRadius,\n    fieldLabel,\n    ...rest\n  },\n  forwardedRef\n) {\n  const textInputDomNode = useRef(null);\n  const textInputRef = useMergedRefs(forwardedRef, textInputDomNode);\n\n  const [inputIsEmpty, setInputIsEmpty] = useState(!(value || defaultValue));\n  const [autoFocus, setAutoFocus] = useState(false);\n\n  const [uniqueId] = useState(nanoid());\n\n  const memoizedDescriptionToolTip = useMemo(() => {\n    return descriptionToolTip;\n  }, [descriptionToolTip]);\n\n  useEffect(() => {\n    setAutoFocus(false);\n  }, [value, defaultValue]);\n\n  const onKeyDown = useCallback(event => {\n    if (event.key === 'Enter') {\n      event.stopPropagation();\n    }\n  }, []);\n\n  const input = () => {\n    return (\n      <S.TextAreaContainter>\n        {fieldLabel && (\n          <S.Label htmlFor={uniqueId} disabled={disabled}>\n            {fieldLabel}\n            <S.SuccessContainerLabel>\n              {type === 'loading' && loadingIcon}\n              {type === 'success' && successIcon}\n            </S.SuccessContainerLabel>\n          </S.Label>\n        )}\n        <S.TextInput\n          $fieldLabel={!isEmpty(fieldLabel)}\n          disabled={disabled}\n          readOnly={readOnly}\n          type={type}\n          className={className}\n          style={style}\n        >\n          <S.TextInputFieldIconAlert type={type}>{icon}</S.TextInputFieldIconAlert>\n          <S.TextInputField\n            autoFocus={autoFocus}\n            borderRadius={borderRadius}\n            ref={textInputRef}\n            rows={rows}\n            value={value}\n            defaultValue={defaultValue}\n            name={name}\n            placeholder={placeholder || ' '}\n            required={required}\n            readOnly={readOnly}\n            disabled={disabled}\n            edit={edit}\n            type={type}\n            autoComplete={autoComplete}\n            hasIcon={Boolean(icon)}\n            icon={icon}\n            id={`text-input-${uniqueId}`}\n            key={uniqueId}\n            padding={padding}\n            onChange={e => {\n              if (e.target.value) {\n                setInputIsEmpty(false);\n                if (!autoFocus) {\n                  setAutoFocus(true);\n                }\n              } else {\n                setInputIsEmpty(true);\n                if (!autoFocus) {\n                  setAutoFocus(true);\n                }\n              }\n              onChange(e);\n            }}\n            onKeyDown={onKeyDown}\n            onBlur={onBlur}\n            noBorder={noBorder}\n            {...rest}\n          />\n          {!fieldLabel && (type === 'loading' || type === 'success') && (\n            <S.SuccessContainer>\n              {type === 'loading' && loadingIcon}\n              {type === 'success' && successIcon}\n            </S.SuccessContainer>\n          )}\n          {!readOnly && noBorder && (\n            <S.InputIconContainer disabled={disabled}>\n              <EditNoteIcon className={padding === 'small' ? 'smallPadingIcon' : undefined} />\n            </S.InputIconContainer>\n          )}\n          {label && (\n            <S.TextInputLabel\n              htmlFor={`text-input-${uniqueId}`}\n              hasPlaceholder={Boolean(placeholder)}\n              hasIcon={Boolean(icon)}\n              inputIsEmpty={inputIsEmpty}\n            >\n              {label}\n              {required && ' *'}\n            </S.TextInputLabel>\n          )}\n          {typeof description === 'string' && description.length > 0 && (\n            <S.Description type={type}>{description}</S.Description>\n          )}\n        </S.TextInput>\n      </S.TextAreaContainter>\n    );\n  };\n\n  if (hidden) return null;\n\n  return (\n    <>\n      {!memoizedDescriptionToolTip && input()}\n      {memoizedDescriptionToolTip && (\n        <div>\n          <Tooltip\n            content={memoizedDescriptionToolTip}\n            key=\"tooltipTextArea1\"\n            placement=\"bottom-end\"\n            trigger={'mouseenter'}\n            zIndex={999999}\n          >\n            {input()}\n          </Tooltip>\n        </div>\n      )}\n    </>\n  );\n});\n\nTextArea.defaultProps = {\n  rows: 4,\n  noBorder: false,\n  readOnly: false,\n  edit: false,\n  hidden: false,\n  type: '',\n  padding: 'medium',\n  descriptionToolTip: '',\n  isExpanded: () => {},\n  onChange: () => {},\n  borderRadius: 0\n};\n\nTextArea.propTypes = {\n  /**\n   * Value to be sent. Typically the content of the text area.\n   */\n  value: PropTypes.string,\n\n  /**\n   * Default value/text to be displayed in the text area by default.\n   */\n  defaultValue: PropTypes.string,\n\n  /**\n   * Name of the text area (used when sending form data)\n   */\n  name: PropTypes.string,\n\n  /**\n   * Label text for the text area. If the text area is empty (no input and no placeholder)\n   * and isn't in focus, the label text will be displayed grayed out in the text area itself.\n   * Otherwise, the label text will be displayed in the top left corner.\n   */\n  label: PropTypes.string,\n\n  /**\n   * Field Label text for the text area field. I\n   */\n  fieldLabel: PropTypes.string,\n\n  /**\n   * Placeholder text to be displayed if the text area is empty (no input)\n   */\n  placeholder: PropTypes.string,\n\n  /**\n   * Whether the user is required to fill in the text area\n   */\n  required: PropTypes.bool,\n\n  /**\n   * Whether the text area is disabled\n   */\n  disabled: PropTypes.bool,\n  /**\n   * Whether the component is hidden or visible.\n   */\n  hidden: PropTypes.bool,\n  /**\n   * Whether the text area is read-only\n   */\n  readOnly: PropTypes.bool,\n  /**\n   * Displays a grey background to show that value is editable\n   */\n  edit: PropTypes.bool,\n  /**\n   * ?\n   */\n  autoComplete: PropTypes.string,\n  /**\n   * Descriptive text displayed below the text area\n   */\n  description: PropTypes.string,\n\n  /**\n   * Optional icon to be displayed left of the text inside the text area\n   */\n  icon: PropTypes.element,\n  /**\n   * How many rows/lines of text to be displayed by default\n   */\n  rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n  /**\n   * Add custom class names to the HTML element\n   */\n  className: PropTypes.string,\n  /**\n   * Add custom CSS styling\n   */\n  style: PropTypes.object,\n  /**\n   * Add padding (small-medium-large)\n   */\n  padding: PropTypes.oneOf(['small', 'medium', 'large']),\n  /**\n   * Optional callback function for the `onChange` event\n   */\n  onChange: PropTypes.func,\n  /**\n   * Optional callback function for the `onBlur` event\n   */\n  onBlur: PropTypes.func,\n  noBorder: PropTypes.bool,\n  // warningAlert: PropTypes.bool,\n  // errorAlert: PropTypes.bool,\n  isExpanded: PropTypes.func,\n  /**\n   * Define the type based on error,error-border , warning, loading and success.\n   */\n  type: PropTypes.oneOf([\n    '',\n    'error',\n    'error-border',\n    'warning-border',\n    'warning',\n    'loading',\n    'success'\n  ]),\n  /**\n   * Icon element – E.g: `icon={<Spinner />}`\n   */\n  loadingIcon: PropTypes.element,\n  /**\n   * Icon element – E.g: `icon={<Check />}`\n   */\n  successIcon: PropTypes.element,\n  /**\n   * Description ToolTip text.\n   */\n  descriptionToolTip: PropTypes.string,\n  /**\n   * Border Radius for rounded borders.\n   */\n  borderRadius: PropTypes.number\n};\n\nexport default TextArea;\n"],"names":["TextArea","React","forwardRef","value","defaultValue","name","label","placeholder","required","disabled","hidden","readOnly","edit","autoComplete","description","type","icon","rows","className","style","onChange","onBlur","noBorder","loadingIcon","successIcon","padding","descriptionToolTip","borderRadius","fieldLabel","rest","forwardedRef","textInputDomNode","useRef","textInputRef","useMergedRefs","inputIsEmpty","setInputIsEmpty","useState","autoFocus","setAutoFocus","uniqueId","nanoid","memoizedDescriptionToolTip","useMemo","useEffect","onKeyDown","useCallback","event","key","stopPropagation","input","createElement","S","htmlFor","$fieldLabel","isEmpty","_extends","ref","hasIcon","Boolean","id","e","target","EditNoteIcon","undefined","hasPlaceholder","length","Fragment","Tooltip","content","placement","trigger","zIndex","defaultProps","isExpanded","propTypes","process","env","NODE_ENV","PropTypes","string","bool","element","oneOfType","number","object","oneOf","func"],"mappings":"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"}