@laerdal/life-react-components 2.0.1-dev.9 → 2.1.0

package/dist/Toasters/ToastContext.cjs

@@ -1,64 +1,43 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ToastProvider = exports.ToastContext = void 0;
 exports.useToast = useToast;
-
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _functions = require("../Services/functions");
-
 var _Toast = _interopRequireDefault(require("./Toast"));
-
 var _types = require("../types");
-
 var _zIndexes = require("../styles/z-indexes");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 /*export const ToastContext = React.createContext<ToasterValueProps>(null);*/
+
 var ToastContext = /*#__PURE__*/React.createContext({});
 exports.ToastContext = ToastContext;
-
 var ToastBucket = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: fixed;\n  z-index: ", ";\n  display: flex;\n  flex-direction: column-reverse;\n"])), _zIndexes.Z_INDEXES.toast);
-
 var ToastBucketTopLeft = (0, _styledComponents.default)(ToastBucket)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  top: 16px;\n  left: 5%;\n"])));
 var ToastBucketTopMiddle = (0, _styledComponents.default)(ToastBucket)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  top: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n"])));
 var ToastBucketTopRight = (0, _styledComponents.default)(ToastBucket)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  top: 16px;\n  right: 5%;\n"])));
 var ToastBucketBottomLeft = (0, _styledComponents.default)(ToastBucket)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  bottom: 16px;\n  left: 5%;\n"])));
 var ToastBucketBottomMiddle = (0, _styledComponents.default)(ToastBucket)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  bottom: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n"])));
 var ToastBucketBottomRight = (0, _styledComponents.default)(ToastBucket)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  bottom: 16px;\n  right: 5%;\n"])));
-
 var ToastProvider = function ToastProvider(_ref) {
   var children = _ref.children;
-
   var _React$useState = React.useState([]),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      toasts = _React$useState2[0],
-      setToasts = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    toasts = _React$useState2[0],
+    setToasts = _React$useState2[1];
   var add = function add(content, options) {
     var id = (0, _functions.createUUID)();
     setToasts(function (prev) {
@@ -70,13 +49,11 @@ var ToastProvider = function ToastProvider(_ref) {
     });
     return id;
   };
-
   var _remove = function remove(id) {
     return setToasts(toasts.filter(function (t) {
       return t.id !== id;
     }));
   };
-
   var functions = React.useMemo(function () {
     return {
       addToast: add,
@@ -164,17 +141,14 @@ var ToastProvider = function ToastProvider(_ref) {
     }), children]
   });
 };
-
 exports.ToastProvider = ToastProvider;
 ToastProvider.propTypes = {
   children: _propTypes.default.any
 };
-
 function useToast() {
   var _React$useContext = React.useContext(ToastContext),
-      addToast = _React$useContext.addToast,
-      removeToast = _React$useContext.removeToast;
-
+    addToast = _React$useContext.addToast,
+    removeToast = _React$useContext.removeToast;
   return {
     addToast: addToast,
     removeToast: removeToast

package/dist/Toasters/ToastContext.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ToastContext.cjs","names":["ToastContext","React","createContext","ToastBucket","styled","div","Z_INDEXES","toast","ToastBucketTopLeft","ToastBucketTopMiddle","ToastBucketTopRight","ToastBucketBottomLeft","ToastBucketBottomMiddle","ToastBucketBottomRight","ToastProvider","children","useState","toasts","setToasts","add","content","options","id","createUUID","prev","remove","filter","t","functions","useMemo","addToast","removeToast","position","ToastPosition","TOPLEFT","map","TOPMIDDLE","TOPRIGHT","BOTTOMLEFT","BOTTOMMIDDLE","BOTTOMRIGHT","useToast","useContext"],"sources":["../../src/Toasters/ToastContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { createUUID } from '../Services/functions';\nimport Toast, { ToastOptions } from './Toast';\nimport { ToastPosition } from '../types';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nexport type ToastProviderProps = {\n  children?: any;\n};\n\nexport interface toast {\n  options: ToastOptions;\n  id: string;\n  content: any;\n}\nexport type ToasterValueProps = { toasts: toast[]; addToast: (content: any, options: ToastOptions) => string; removeToast: (id: string) => void };\n\n/*export const ToastContext = React.createContext<ToasterValueProps>(null);*/\n\nexport const ToastContext = React.createContext({} as ToasterValueProps);\n\nconst ToastBucket = styled.div`\n  position: fixed;\n  z-index: ${Z_INDEXES.toast};\n  display: flex;\n  flex-direction: column-reverse;\n`;\n\nconst ToastBucketTopLeft = styled(ToastBucket)`\n  top: 16px;\n  left: 5%;\n`;\n\nconst ToastBucketTopMiddle = styled(ToastBucket)`\n  top: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nconst ToastBucketTopRight = styled(ToastBucket)`\n  top: 16px;\n  right: 5%;\n`;\n\nconst ToastBucketBottomLeft = styled(ToastBucket)`\n  bottom: 16px;\n  left: 5%;\n`;\n\nconst ToastBucketBottomMiddle = styled(ToastBucket)`\n  bottom: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nconst ToastBucketBottomRight = styled(ToastBucket)`\n  bottom: 16px;\n  right: 5%;\n`;\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({ children }: ToastProviderProps) => {\n  const [toasts, setToasts] = React.useState<toast[]>([]);\n\n  const add = (content: any, options: ToastOptions) => {\n    const id = createUUID();\n    setToasts(prev => [...prev, { id, content, options }]);\n    return id;\n  };\n\n  const remove = (id: string) => setToasts(toasts.filter(t => t.id !== id));\n\n  const functions = React.useMemo(() => {\n    return { addToast: add, removeToast: remove };\n  }, [toasts]);\n\n  return (\n    <ToastContext.Provider value={{ toasts, addToast: add, removeToast: remove }}>\n      <ToastBucketTopLeft>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPLEFT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopLeft>\n      <ToastBucketTopMiddle>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPMIDDLE)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopMiddle>\n      <ToastBucketTopRight>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPRIGHT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopRight>\n      <ToastBucketBottomLeft>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMLEFT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomLeft>\n      <ToastBucketBottomMiddle>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMMIDDLE)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomMiddle>\n      <ToastBucketBottomRight>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMRIGHT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomRight>\n      {children}\n    </ToastContext.Provider>\n  );\n};\n\nexport function useToast() {\n  const { addToast, removeToast } = React.useContext(ToastContext);\n  return {\n    addToast,\n    removeToast\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"ToastContext.cjs","names":["ToastContext","React","createContext","ToastBucket","styled","div","Z_INDEXES","toast","ToastBucketTopLeft","ToastBucketTopMiddle","ToastBucketTopRight","ToastBucketBottomLeft","ToastBucketBottomMiddle","ToastBucketBottomRight","ToastProvider","children","useState","toasts","setToasts","add","content","options","id","createUUID","prev","remove","filter","t","functions","useMemo","addToast","removeToast","position","ToastPosition","TOPLEFT","map","TOPMIDDLE","TOPRIGHT","BOTTOMLEFT","BOTTOMMIDDLE","BOTTOMRIGHT","useToast","useContext"],"sources":["../../src/Toasters/ToastContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { createUUID } from '../Services/functions';\nimport Toast, { ToastOptions } from './Toast';\nimport { ToastPosition } from '../types';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nexport type ToastProviderProps = {\n  children?: any;\n};\n\nexport interface toast {\n  options: ToastOptions;\n  id: string;\n  content: any;\n}\nexport type ToasterValueProps = { toasts: toast[]; addToast: (content: any, options: ToastOptions) => string; removeToast: (id: string) => void };\n\n/*export const ToastContext = React.createContext<ToasterValueProps>(null);*/\n\nexport const ToastContext = React.createContext({} as ToasterValueProps);\n\nconst ToastBucket = styled.div`\n  position: fixed;\n  z-index: ${Z_INDEXES.toast};\n  display: flex;\n  flex-direction: column-reverse;\n`;\n\nconst ToastBucketTopLeft = styled(ToastBucket)`\n  top: 16px;\n  left: 5%;\n`;\n\nconst ToastBucketTopMiddle = styled(ToastBucket)`\n  top: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nconst ToastBucketTopRight = styled(ToastBucket)`\n  top: 16px;\n  right: 5%;\n`;\n\nconst ToastBucketBottomLeft = styled(ToastBucket)`\n  bottom: 16px;\n  left: 5%;\n`;\n\nconst ToastBucketBottomMiddle = styled(ToastBucket)`\n  bottom: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nconst ToastBucketBottomRight = styled(ToastBucket)`\n  bottom: 16px;\n  right: 5%;\n`;\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({ children }: ToastProviderProps) => {\n  const [toasts, setToasts] = React.useState<toast[]>([]);\n\n  const add = (content: any, options: ToastOptions) => {\n    const id = createUUID();\n    setToasts(prev => [...prev, { id, content, options }]);\n    return id;\n  };\n\n  const remove = (id: string) => setToasts(toasts.filter(t => t.id !== id));\n\n  const functions = React.useMemo(() => {\n    return { addToast: add, removeToast: remove };\n  }, [toasts]);\n\n  return (\n    <ToastContext.Provider value={{ toasts, addToast: add, removeToast: remove }}>\n      <ToastBucketTopLeft>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPLEFT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopLeft>\n      <ToastBucketTopMiddle>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPMIDDLE)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopMiddle>\n      <ToastBucketTopRight>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPRIGHT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopRight>\n      <ToastBucketBottomLeft>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMLEFT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomLeft>\n      <ToastBucketBottomMiddle>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMMIDDLE)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomMiddle>\n      <ToastBucketBottomRight>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMRIGHT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomRight>\n      {children}\n    </ToastContext.Provider>\n  );\n};\n\nexport function useToast() {\n  const { addToast, removeToast } = React.useContext(ToastContext);\n  return {\n    addToast,\n    removeToast\n  };\n}\n"],"mappings":"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"}

package/dist/Toasters/ToastContext.js

@@ -2,9 +2,7 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 import _pt from "prop-types";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
-
 import * as React from 'react';
 import styled from 'styled-components';
 import { createUUID } from '../Services/functions';
@@ -13,8 +11,8 @@ import { ToastPosition } from '../types';
 import { Z_INDEXES } from '../styles/z-indexes';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-
 /*export const ToastContext = React.createContext<ToasterValueProps>(null);*/
+
 export var ToastContext = /*#__PURE__*/React.createContext({});
 var ToastBucket = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: fixed;\n  z-index: ", ";\n  display: flex;\n  flex-direction: column-reverse;\n"])), Z_INDEXES.toast);
 var ToastBucketTopLeft = styled(ToastBucket)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  top: 16px;\n  left: 5%;\n"])));
@@ -25,12 +23,10 @@ var ToastBucketBottomMiddle = styled(ToastBucket)(_templateObject6 || (_template
 var ToastBucketBottomRight = styled(ToastBucket)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  bottom: 16px;\n  right: 5%;\n"])));
 export var ToastProvider = function ToastProvider(_ref) {
   var children = _ref.children;
-
   var _React$useState = React.useState([]),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      toasts = _React$useState2[0],
-      setToasts = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    toasts = _React$useState2[0],
+    setToasts = _React$useState2[1];
   var add = function add(content, options) {
     var id = createUUID();
     setToasts(function (prev) {
@@ -42,13 +38,11 @@ export var ToastProvider = function ToastProvider(_ref) {
     });
     return id;
   };
-
   var _remove = function remove(id) {
     return setToasts(toasts.filter(function (t) {
       return t.id !== id;
     }));
   };
-
   var functions = React.useMemo(function () {
     return {
       addToast: add,
@@ -141,9 +135,8 @@ ToastProvider.propTypes = {
 };
 export function useToast() {
   var _React$useContext = React.useContext(ToastContext),
-      addToast = _React$useContext.addToast,
-      removeToast = _React$useContext.removeToast;
-
+    addToast = _React$useContext.addToast,
+    removeToast = _React$useContext.removeToast;
   return {
     addToast: addToast,
     removeToast: removeToast

package/dist/Toasters/ToastContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastContext.js","names":["React","styled","createUUID","Toast","ToastPosition","Z_INDEXES","ToastContext","createContext","ToastBucket","div","toast","ToastBucketTopLeft","ToastBucketTopMiddle","ToastBucketTopRight","ToastBucketBottomLeft","ToastBucketBottomMiddle","ToastBucketBottomRight","ToastProvider","children","useState","toasts","setToasts","add","content","options","id","prev","remove","filter","t","functions","useMemo","addToast","removeToast","position","TOPLEFT","map","TOPMIDDLE","TOPRIGHT","BOTTOMLEFT","BOTTOMMIDDLE","BOTTOMRIGHT","useToast","useContext"],"sources":["../../src/Toasters/ToastContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { createUUID } from '../Services/functions';\nimport Toast, { ToastOptions } from './Toast';\nimport { ToastPosition } from '../types';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nexport type ToastProviderProps = {\n  children?: any;\n};\n\nexport interface toast {\n  options: ToastOptions;\n  id: string;\n  content: any;\n}\nexport type ToasterValueProps = { toasts: toast[]; addToast: (content: any, options: ToastOptions) => string; removeToast: (id: string) => void };\n\n/*export const ToastContext = React.createContext<ToasterValueProps>(null);*/\n\nexport const ToastContext = React.createContext({} as ToasterValueProps);\n\nconst ToastBucket = styled.div`\n  position: fixed;\n  z-index: ${Z_INDEXES.toast};\n  display: flex;\n  flex-direction: column-reverse;\n`;\n\nconst ToastBucketTopLeft = styled(ToastBucket)`\n  top: 16px;\n  left: 5%;\n`;\n\nconst ToastBucketTopMiddle = styled(ToastBucket)`\n  top: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nconst ToastBucketTopRight = styled(ToastBucket)`\n  top: 16px;\n  right: 5%;\n`;\n\nconst ToastBucketBottomLeft = styled(ToastBucket)`\n  bottom: 16px;\n  left: 5%;\n`;\n\nconst ToastBucketBottomMiddle = styled(ToastBucket)`\n  bottom: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nconst ToastBucketBottomRight = styled(ToastBucket)`\n  bottom: 16px;\n  right: 5%;\n`;\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({ children }: ToastProviderProps) => {\n  const [toasts, setToasts] = React.useState<toast[]>([]);\n\n  const add = (content: any, options: ToastOptions) => {\n    const id = createUUID();\n    setToasts(prev => [...prev, { id, content, options }]);\n    return id;\n  };\n\n  const remove = (id: string) => setToasts(toasts.filter(t => t.id !== id));\n\n  const functions = React.useMemo(() => {\n    return { addToast: add, removeToast: remove };\n  }, [toasts]);\n\n  return (\n    <ToastContext.Provider value={{ toasts, addToast: add, removeToast: remove }}>\n      <ToastBucketTopLeft>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPLEFT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopLeft>\n      <ToastBucketTopMiddle>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPMIDDLE)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopMiddle>\n      <ToastBucketTopRight>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPRIGHT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopRight>\n      <ToastBucketBottomLeft>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMLEFT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomLeft>\n      <ToastBucketBottomMiddle>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMMIDDLE)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomMiddle>\n      <ToastBucketBottomRight>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMRIGHT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomRight>\n      {children}\n    </ToastContext.Provider>\n  );\n};\n\nexport function useToast() {\n  const { addToast, removeToast } = React.useContext(ToastContext);\n  return {\n    addToast,\n    removeToast\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"ToastContext.js","names":["React","styled","createUUID","Toast","ToastPosition","Z_INDEXES","ToastContext","createContext","ToastBucket","div","toast","ToastBucketTopLeft","ToastBucketTopMiddle","ToastBucketTopRight","ToastBucketBottomLeft","ToastBucketBottomMiddle","ToastBucketBottomRight","ToastProvider","children","useState","toasts","setToasts","add","content","options","id","prev","remove","filter","t","functions","useMemo","addToast","removeToast","position","TOPLEFT","map","TOPMIDDLE","TOPRIGHT","BOTTOMLEFT","BOTTOMMIDDLE","BOTTOMRIGHT","useToast","useContext"],"sources":["../../src/Toasters/ToastContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { createUUID } from '../Services/functions';\nimport Toast, { ToastOptions } from './Toast';\nimport { ToastPosition } from '../types';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nexport type ToastProviderProps = {\n  children?: any;\n};\n\nexport interface toast {\n  options: ToastOptions;\n  id: string;\n  content: any;\n}\nexport type ToasterValueProps = { toasts: toast[]; addToast: (content: any, options: ToastOptions) => string; removeToast: (id: string) => void };\n\n/*export const ToastContext = React.createContext<ToasterValueProps>(null);*/\n\nexport const ToastContext = React.createContext({} as ToasterValueProps);\n\nconst ToastBucket = styled.div`\n  position: fixed;\n  z-index: ${Z_INDEXES.toast};\n  display: flex;\n  flex-direction: column-reverse;\n`;\n\nconst ToastBucketTopLeft = styled(ToastBucket)`\n  top: 16px;\n  left: 5%;\n`;\n\nconst ToastBucketTopMiddle = styled(ToastBucket)`\n  top: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nconst ToastBucketTopRight = styled(ToastBucket)`\n  top: 16px;\n  right: 5%;\n`;\n\nconst ToastBucketBottomLeft = styled(ToastBucket)`\n  bottom: 16px;\n  left: 5%;\n`;\n\nconst ToastBucketBottomMiddle = styled(ToastBucket)`\n  bottom: 16px;\n  left: 50%;\n  transform: translateX(-50%);\n`;\n\nconst ToastBucketBottomRight = styled(ToastBucket)`\n  bottom: 16px;\n  right: 5%;\n`;\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({ children }: ToastProviderProps) => {\n  const [toasts, setToasts] = React.useState<toast[]>([]);\n\n  const add = (content: any, options: ToastOptions) => {\n    const id = createUUID();\n    setToasts(prev => [...prev, { id, content, options }]);\n    return id;\n  };\n\n  const remove = (id: string) => setToasts(toasts.filter(t => t.id !== id));\n\n  const functions = React.useMemo(() => {\n    return { addToast: add, removeToast: remove };\n  }, [toasts]);\n\n  return (\n    <ToastContext.Provider value={{ toasts, addToast: add, removeToast: remove }}>\n      <ToastBucketTopLeft>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPLEFT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopLeft>\n      <ToastBucketTopMiddle>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPMIDDLE)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopMiddle>\n      <ToastBucketTopRight>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.TOPRIGHT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketTopRight>\n      <ToastBucketBottomLeft>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMLEFT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomLeft>\n      <ToastBucketBottomMiddle>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMMIDDLE)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomMiddle>\n      <ToastBucketBottomRight>\n        {toasts\n          .filter(t => t.options.position === ToastPosition.BOTTOMRIGHT)\n          .map(t => (\n            <Toast key={t.id} content={t.content} remove={() => remove(t.id)} options={t.options} />\n          ))}\n      </ToastBucketBottomRight>\n      {children}\n    </ToastContext.Provider>\n  );\n};\n\nexport function useToast() {\n  const { addToast, removeToast } = React.useContext(ToastContext);\n  return {\n    addToast,\n    removeToast\n  };\n}\n"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,UAAU,QAAQ,uBAAuB;AAClD,OAAOC,KAAK,MAAwB,SAAS;AAC7C,SAASC,aAAa,QAAQ,UAAU;AACxC,SAAQC,SAAS,QAAO,qBAAqB;AAAC;AAAA;AAa9C;;AAEA,OAAO,IAAMC,YAAY,gBAAGN,KAAK,CAACO,aAAa,CAAC,CAAC,CAAC,CAAsB;AAExE,IAAMC,WAAW,GAAGP,MAAM,CAACQ,GAAG,mKAEjBJ,SAAS,CAACK,KAAK,CAG3B;AAED,IAAMC,kBAAkB,GAAGV,MAAM,CAACO,WAAW,CAAC,oGAG7C;AAED,IAAMI,oBAAoB,GAAGX,MAAM,CAACO,WAAW,CAAC,qIAI/C;AAED,IAAMK,mBAAmB,GAAGZ,MAAM,CAACO,WAAW,CAAC,qGAG9C;AAED,IAAMM,qBAAqB,GAAGb,MAAM,CAACO,WAAW,CAAC,uGAGhD;AAED,IAAMO,uBAAuB,GAAGd,MAAM,CAACO,WAAW,CAAC,wIAIlD;AAED,IAAMQ,sBAAsB,GAAGf,MAAM,CAACO,WAAW,CAAC,wGAGjD;AAED,OAAO,IAAMS,aAA2C,GAAG,SAA9CA,aAA2C,OAAyC;EAAA,IAAnCC,QAAQ,QAARA,QAAQ;EACpE,sBAA4BlB,KAAK,CAACmB,QAAQ,CAAU,EAAE,CAAC;IAAA;IAAhDC,MAAM;IAAEC,SAAS;EAExB,IAAMC,GAAG,GAAG,SAANA,GAAG,CAAIC,OAAY,EAAEC,OAAqB,EAAK;IACnD,IAAMC,EAAE,GAAGvB,UAAU,EAAE;IACvBmB,SAAS,CAAC,UAAAK,IAAI;MAAA,oCAAQA,IAAI,IAAE;QAAED,EAAE,EAAFA,EAAE;QAAEF,OAAO,EAAPA,OAAO;QAAEC,OAAO,EAAPA;MAAQ,CAAC;IAAA,CAAC,CAAC;IACtD,OAAOC,EAAE;EACX,CAAC;EAED,IAAME,OAAM,GAAG,SAATA,MAAM,CAAIF,EAAU;IAAA,OAAKJ,SAAS,CAACD,MAAM,CAACQ,MAAM,CAAC,UAAAC,CAAC;MAAA,OAAIA,CAAC,CAACJ,EAAE,KAAKA,EAAE;IAAA,EAAC,CAAC;EAAA;EAEzE,IAAMK,SAAS,GAAG9B,KAAK,CAAC+B,OAAO,CAAC,YAAM;IACpC,OAAO;MAAEC,QAAQ,EAAEV,GAAG;MAAEW,WAAW,EAAEN;IAAO,CAAC;EAC/C,CAAC,EAAE,CAACP,MAAM,CAAC,CAAC;EAEZ,oBACE,MAAC,YAAY,CAAC,QAAQ;IAAC,KAAK,EAAE;MAAEA,MAAM,EAANA,MAAM;MAAEY,QAAQ,EAAEV,GAAG;MAAEW,WAAW,EAAEN;IAAO,CAAE;IAAA,wBAC3E,KAAC,kBAAkB;MAAA,UAChBP,MAAM,CACJQ,MAAM,CAAC,UAAAC,CAAC;QAAA,OAAIA,CAAC,CAACL,OAAO,CAACU,QAAQ,KAAK9B,aAAa,CAAC+B,OAAO;MAAA,EAAC,CACzDC,GAAG,CAAC,UAAAP,CAAC;QAAA,oBACJ,KAAC,KAAK;UAAY,OAAO,EAAEA,CAAC,CAACN,OAAQ;UAAC,MAAM,EAAE;YAAA,OAAMI,OAAM,CAACE,CAAC,CAACJ,EAAE,CAAC;UAAA,CAAC;UAAC,OAAO,EAAEI,CAAC,CAACL;QAAQ,GAAzEK,CAAC,CAACJ,EAAE,CAAwE;MAAA,CACzF;IAAC,EACe,eACrB,KAAC,oBAAoB;MAAA,UAClBL,MAAM,CACJQ,MAAM,CAAC,UAAAC,CAAC;QAAA,OAAIA,CAAC,CAACL,OAAO,CAACU,QAAQ,KAAK9B,aAAa,CAACiC,SAAS;MAAA,EAAC,CAC3DD,GAAG,CAAC,UAAAP,CAAC;QAAA,oBACJ,KAAC,KAAK;UAAY,OAAO,EAAEA,CAAC,CAACN,OAAQ;UAAC,MAAM,EAAE;YAAA,OAAMI,OAAM,CAACE,CAAC,CAACJ,EAAE,CAAC;UAAA,CAAC;UAAC,OAAO,EAAEI,CAAC,CAACL;QAAQ,GAAzEK,CAAC,CAACJ,EAAE,CAAwE;MAAA,CACzF;IAAC,EACiB,eACvB,KAAC,mBAAmB;MAAA,UACjBL,MAAM,CACJQ,MAAM,CAAC,UAAAC,CAAC;QAAA,OAAIA,CAAC,CAACL,OAAO,CAACU,QAAQ,KAAK9B,aAAa,CAACkC,QAAQ;MAAA,EAAC,CAC1DF,GAAG,CAAC,UAAAP,CAAC;QAAA,oBACJ,KAAC,KAAK;UAAY,OAAO,EAAEA,CAAC,CAACN,OAAQ;UAAC,MAAM,EAAE;YAAA,OAAMI,OAAM,CAACE,CAAC,CAACJ,EAAE,CAAC;UAAA,CAAC;UAAC,OAAO,EAAEI,CAAC,CAACL;QAAQ,GAAzEK,CAAC,CAACJ,EAAE,CAAwE;MAAA,CACzF;IAAC,EACgB,eACtB,KAAC,qBAAqB;MAAA,UACnBL,MAAM,CACJQ,MAAM,CAAC,UAAAC,CAAC;QAAA,OAAIA,CAAC,CAACL,OAAO,CAACU,QAAQ,KAAK9B,aAAa,CAACmC,UAAU;MAAA,EAAC,CAC5DH,GAAG,CAAC,UAAAP,CAAC;QAAA,oBACJ,KAAC,KAAK;UAAY,OAAO,EAAEA,CAAC,CAACN,OAAQ;UAAC,MAAM,EAAE;YAAA,OAAMI,OAAM,CAACE,CAAC,CAACJ,EAAE,CAAC;UAAA,CAAC;UAAC,OAAO,EAAEI,CAAC,CAACL;QAAQ,GAAzEK,CAAC,CAACJ,EAAE,CAAwE;MAAA,CACzF;IAAC,EACkB,eACxB,KAAC,uBAAuB;MAAA,UACrBL,MAAM,CACJQ,MAAM,CAAC,UAAAC,CAAC;QAAA,OAAIA,CAAC,CAACL,OAAO,CAACU,QAAQ,KAAK9B,aAAa,CAACoC,YAAY;MAAA,EAAC,CAC9DJ,GAAG,CAAC,UAAAP,CAAC;QAAA,oBACJ,KAAC,KAAK;UAAY,OAAO,EAAEA,CAAC,CAACN,OAAQ;UAAC,MAAM,EAAE;YAAA,OAAMI,OAAM,CAACE,CAAC,CAACJ,EAAE,CAAC;UAAA,CAAC;UAAC,OAAO,EAAEI,CAAC,CAACL;QAAQ,GAAzEK,CAAC,CAACJ,EAAE,CAAwE;MAAA,CACzF;IAAC,EACoB,eAC1B,KAAC,sBAAsB;MAAA,UACpBL,MAAM,CACJQ,MAAM,CAAC,UAAAC,CAAC;QAAA,OAAIA,CAAC,CAACL,OAAO,CAACU,QAAQ,KAAK9B,aAAa,CAACqC,WAAW;MAAA,EAAC,CAC7DL,GAAG,CAAC,UAAAP,CAAC;QAAA,oBACJ,KAAC,KAAK;UAAY,OAAO,EAAEA,CAAC,CAACN,OAAQ;UAAC,MAAM,EAAE;YAAA,OAAMI,OAAM,CAACE,CAAC,CAACJ,EAAE,CAAC;UAAA,CAAC;UAAC,OAAO,EAAEI,CAAC,CAACL;QAAQ,GAAzEK,CAAC,CAACJ,EAAE,CAAwE;MAAA,CACzF;IAAC,EACmB,EACxBP,QAAQ;EAAA,EACa;AAE5B,CAAC;AAAC;EAnHAA,QAAQ;AAAA;AAqHV,OAAO,SAASwB,QAAQ,GAAG;EACzB,wBAAkC1C,KAAK,CAAC2C,UAAU,CAACrC,YAAY,CAAC;IAAxD0B,QAAQ,qBAARA,QAAQ;IAAEC,WAAW,qBAAXA,WAAW;EAC7B,OAAO;IACLD,QAAQ,EAARA,QAAQ;IACRC,WAAW,EAAXA;EACF,CAAC;AACH"}

package/dist/Toasters/index.cjs

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -29,8 +28,6 @@ Object.defineProperty(exports, "useToast", {
     return _ToastContext.useToast;
   }
 });
-
 var _Toast = _interopRequireDefault(require("./Toast"));
-
 var _ToastContext = require("./ToastContext");
 //# sourceMappingURL=index.cjs.map

package/dist/Toasters/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../src/Toasters/index.tsx"],"sourcesContent":["import Toast from './Toast';\nimport { ToastProvider, useToast, ToastContext } from './ToastContext';\n\nexport { Toast, ToastProvider, useToast, ToastContext };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA"}
+{"version":3,"file":"index.cjs","names":[],"sources":["../../src/Toasters/index.tsx"],"sourcesContent":["import Toast from './Toast';\nimport { ToastProvider, useToast, ToastContext } from './ToastContext';\n\nexport { Toast, ToastProvider, useToast, ToastContext };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA"}

package/dist/Toasters/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Toast","ToastProvider","useToast","ToastContext"],"sources":["../../src/Toasters/index.tsx"],"sourcesContent":["import Toast from './Toast';\nimport { ToastProvider, useToast, ToastContext } from './ToastContext';\n\nexport { Toast, ToastProvider, useToast, ToastContext };\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,SAAlB;AACA,SAASC,aAAT,EAAwBC,QAAxB,EAAkCC,YAAlC,QAAsD,gBAAtD;AAEA,SAASH,KAAT,EAAgBC,aAAhB,EAA+BC,QAA/B,EAAyCC,YAAzC"}
+{"version":3,"file":"index.js","names":["Toast","ToastProvider","useToast","ToastContext"],"sources":["../../src/Toasters/index.tsx"],"sourcesContent":["import Toast from './Toast';\nimport { ToastProvider, useToast, ToastContext } from './ToastContext';\n\nexport { Toast, ToastProvider, useToast, ToastContext };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,SAAS;AAC3B,SAASC,aAAa,EAAEC,QAAQ,EAAEC,YAAY,QAAQ,gBAAgB;AAEtE,SAASH,KAAK,EAAEC,aAAa,EAAEC,QAAQ,EAAEC,YAAY"}

package/dist/Toggles/ToggleButton.cjs

@@ -1,65 +1,43 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ToggleButton = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _Button = require("../Button");
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _Iconbutton = require("../Button/Iconbutton");
-
 var _styles = require("../styles");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _excluded = ["id", "active", "onChange", "disabled", "defaultState", "activeState", "className"];
-
 var _templateObject;
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", " {\n    transition: all 0.1s ease-in-out;\n  }\n\n  &.disabled,\n  &.active:not(.state-change) {\n    ", " {\n      background: ", ";\n    }\n  }\n\n  &.active:not(.state-change) {\n    ", ":after {\n      content: '';\n      position: absolute;\n      left: 12px;\n      bottom: 1px;\n      background-color: ", ";\n      border-radius: 4px;\n      height: 4px;\n      width: 24px;\n    }\n  }\n\n  &.disabled:not(.state-change) {\n    ", ":after {\n      background: ", ";\n    }\n  }\n"])), _Iconbutton.IconButtonContent, _Iconbutton.IconButtonContent, _styles.COLORS.white, _Iconbutton.IconButtonContent, _styles.COLORS.primary_500, _Iconbutton.IconButtonContent, _styles.COLORS.neutral_300);
-
 var ToggleButton = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
   var _activeState$color, _activeState$icon;
-
   var id = _ref.id,
-      active = _ref.active,
-      onChange = _ref.onChange,
-      disabled = _ref.disabled,
-      defaultState = _ref.defaultState,
-      activeState = _ref.activeState,
-      className = _ref.className,
-      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-
+    active = _ref.active,
+    onChange = _ref.onChange,
+    disabled = _ref.disabled,
+    defaultState = _ref.defaultState,
+    activeState = _ref.activeState,
+    className = _ref.className,
+    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var _React$useState = _react.default.useState(false),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      isActive = _React$useState2[0],
-      setIsActive = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    isActive = _React$useState2[0],
+    setIsActive = _React$useState2[1];
   _react.default.useEffect(function () {
     return setIsActive(active);
   }, [active]);
-
   var cls = "".concat(className || '', " ").concat(isActive ? 'active' : '', " ").concat(activeState ? 'state-change' : '', " ").concat(disabled ? 'disabled' : '');
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, {
     className: cls,
@@ -70,7 +48,6 @@ var ToggleButton = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       shape: 'circular',
       action: function action() {
         setIsActive(!isActive);
-
         if (onChange) {
           onChange(!isActive);
         }
@@ -83,7 +60,6 @@ var ToggleButton = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     }))
   });
 });
-
 exports.ToggleButton = ToggleButton;
 ToggleButton.propTypes = {
   active: _propTypes.default.bool.isRequired,

package/dist/Toggles/ToggleButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleButton.cjs","names":["Wrapper","styled","div","IconButtonContent","COLORS","white","primary_500","neutral_300","ToggleButton","React","forwardRef","ref","id","active","onChange","disabled","defaultState","activeState","className","rest","useState","isActive","setIsActive","useEffect","cls","color","icon"],"sources":["../../src/Toggles/ToggleButton.tsx"],"sourcesContent":["import React from 'react';\nimport { IconButton } from '../Button';\nimport styled from 'styled-components';\nimport { IconButtonContent } from '../Button/Iconbutton';\nimport { COLORS } from '../styles';\n\nconst Wrapper = styled.div`\n  ${IconButtonContent} {\n    transition: all 0.1s ease-in-out;\n  }\n\n  &.disabled,\n  &.active:not(.state-change) {\n    ${IconButtonContent} {\n      background: ${COLORS.white};\n    }\n  }\n\n  &.active:not(.state-change) {\n    ${IconButtonContent}:after {\n      content: '';\n      position: absolute;\n      left: 12px;\n      bottom: 1px;\n      background-color: ${COLORS.primary_500};\n      border-radius: 4px;\n      height: 4px;\n      width: 24px;\n    }\n  }\n\n  &.disabled:not(.state-change) {\n    ${IconButtonContent}:after {\n      background: ${COLORS.neutral_300};\n    }\n  }\n`;\n\nexport interface ToggleButtonState {\n  icon: React.ReactNode;\n  color?: string;\n}\n\nexport interface ToggleButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'disabled' | 'onClick'> {\n  active: boolean;\n  onChange?: (value: boolean) => void;\n  disabled?: boolean;\n\n  defaultState: ToggleButtonState;\n  activeState?: ToggleButtonState;\n}\n\nexport const ToggleButton = React.forwardRef(({\n                                                id,\n                                                active,\n                                                onChange,\n                                                disabled,\n                                                defaultState,\n                                                activeState,\n                                                className,\n                                                ...rest\n                                              }: ToggleButtonProps, ref: React.Ref<HTMLButtonElement>) => {\n  const [isActive, setIsActive] = React.useState(false);\n\n  React.useEffect(() => setIsActive(active), [active]);\n\n  const cls = `${className || ''} ${isActive ? 'active' : ''} ${activeState ? 'state-change' : ''} ${disabled ? 'disabled' : ''}`;\n\n  return (\n    <Wrapper className={cls}>\n      <IconButton\n        variant={'secondary'}\n        ref={ref}\n        useTransparentBackground={true}\n        shape={'circular'}\n        action={() => {\n          setIsActive(!isActive);\n          if (onChange) {\n            onChange(!isActive);\n          }\n        }}\n        id={id}\n        iconColor={isActive ? activeState?.color ?? defaultState.color : defaultState.color}\n        disabled={disabled}\n        {...rest}>\n        {isActive ? activeState?.icon ?? defaultState.icon : defaultState.icon}\n      </IconButton>\n    </Wrapper>\n  );\n});\n\nexport default ToggleButton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;AAEA,IAAMA,OAAO,GAAGC,yBAAA,CAAOC,GAAV,okBACTC,6BADS,EAOPA,6BAPO,EAQOC,cAAA,CAAOC,KARd,EAaPF,6BAbO,EAkBaC,cAAA,CAAOE,WAlBpB,EA0BPH,6BA1BO,EA2BOC,cAAA,CAAOG,WA3Bd,CAAb;;AA8CO,IAAMC,YAAY,gBAAGC,cAAA,CAAMC,UAAN,CAAiB,gBASuBC,GATvB,EAS6D;EAAA;;EAAA,IAR1DC,EAQ0D,QAR1DA,EAQ0D;EAAA,IAP1DC,MAO0D,QAP1DA,MAO0D;EAAA,IAN1DC,QAM0D,QAN1DA,QAM0D;EAAA,IAL1DC,QAK0D,QAL1DA,QAK0D;EAAA,IAJ1DC,YAI0D,QAJ1DA,YAI0D;EAAA,IAH1DC,WAG0D,QAH1DA,WAG0D;EAAA,IAF1DC,SAE0D,QAF1DA,SAE0D;EAAA,IADvDC,IACuD;;EACxG,sBAAgCV,cAAA,CAAMW,QAAN,CAAe,KAAf,CAAhC;EAAA;EAAA,IAAOC,QAAP;EAAA,IAAiBC,WAAjB;;EAEAb,cAAA,CAAMc,SAAN,CAAgB;IAAA,OAAMD,WAAW,CAACT,MAAD,CAAjB;EAAA,CAAhB,EAA2C,CAACA,MAAD,CAA3C;;EAEA,IAAMW,GAAG,aAAMN,SAAS,IAAI,EAAnB,cAAyBG,QAAQ,GAAG,QAAH,GAAc,EAA/C,cAAqDJ,WAAW,GAAG,cAAH,GAAoB,EAApF,cAA0FF,QAAQ,GAAG,UAAH,GAAgB,EAAlH,CAAT;EAEA,oBACE,qBAAC,OAAD;IAAS,SAAS,EAAES,GAApB;IAAA,uBACE,qBAAC,kBAAD;MACE,OAAO,EAAE,WADX;MAEE,GAAG,EAAEb,GAFP;MAGE,wBAAwB,EAAE,IAH5B;MAIE,KAAK,EAAE,UAJT;MAKE,MAAM,EAAE,kBAAM;QACZW,WAAW,CAAC,CAACD,QAAF,CAAX;;QACA,IAAIP,QAAJ,EAAc;UACZA,QAAQ,CAAC,CAACO,QAAF,CAAR;QACD;MACF,CAVH;MAWE,EAAE,EAAET,EAXN;MAYE,SAAS,EAAES,QAAQ,yBAAGJ,WAAH,aAAGA,WAAH,uBAAGA,WAAW,CAAEQ,KAAhB,mEAAyBT,YAAY,CAACS,KAAtC,GAA8CT,YAAY,CAACS,KAZhF;MAaE,QAAQ,EAAEV;IAbZ,GAcMI,IAdN;MAAA,UAeGE,QAAQ,wBAAGJ,WAAH,aAAGA,WAAH,uBAAGA,WAAW,CAAES,IAAhB,iEAAwBV,YAAY,CAACU,IAArC,GAA4CV,YAAY,CAACU;IAfpE;EADF,EADF;AAqBD,CArC2B,CAArB;;;;EARLb,M;EACAC,Q;EACAC,Q;EAEAC,Y;IATAU,I;IACAD,K;;EASAR,W;IAVAS,I;IACAD,K;;;eAmDajB,Y"}
+{"version":3,"file":"ToggleButton.cjs","names":["Wrapper","styled","div","IconButtonContent","COLORS","white","primary_500","neutral_300","ToggleButton","React","forwardRef","ref","id","active","onChange","disabled","defaultState","activeState","className","rest","useState","isActive","setIsActive","useEffect","cls","color","icon"],"sources":["../../src/Toggles/ToggleButton.tsx"],"sourcesContent":["import React from 'react';\nimport { IconButton } from '../Button';\nimport styled from 'styled-components';\nimport { IconButtonContent } from '../Button/Iconbutton';\nimport { COLORS } from '../styles';\n\nconst Wrapper = styled.div`\n  ${IconButtonContent} {\n    transition: all 0.1s ease-in-out;\n  }\n\n  &.disabled,\n  &.active:not(.state-change) {\n    ${IconButtonContent} {\n      background: ${COLORS.white};\n    }\n  }\n\n  &.active:not(.state-change) {\n    ${IconButtonContent}:after {\n      content: '';\n      position: absolute;\n      left: 12px;\n      bottom: 1px;\n      background-color: ${COLORS.primary_500};\n      border-radius: 4px;\n      height: 4px;\n      width: 24px;\n    }\n  }\n\n  &.disabled:not(.state-change) {\n    ${IconButtonContent}:after {\n      background: ${COLORS.neutral_300};\n    }\n  }\n`;\n\nexport interface ToggleButtonState {\n  icon: React.ReactNode;\n  color?: string;\n}\n\nexport interface ToggleButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'disabled' | 'onClick'> {\n  active: boolean;\n  onChange?: (value: boolean) => void;\n  disabled?: boolean;\n\n  defaultState: ToggleButtonState;\n  activeState?: ToggleButtonState;\n}\n\nexport const ToggleButton = React.forwardRef(({\n                                                id,\n                                                active,\n                                                onChange,\n                                                disabled,\n                                                defaultState,\n                                                activeState,\n                                                className,\n                                                ...rest\n                                              }: ToggleButtonProps, ref: React.Ref<HTMLButtonElement>) => {\n  const [isActive, setIsActive] = React.useState(false);\n\n  React.useEffect(() => setIsActive(active), [active]);\n\n  const cls = `${className || ''} ${isActive ? 'active' : ''} ${activeState ? 'state-change' : ''} ${disabled ? 'disabled' : ''}`;\n\n  return (\n    <Wrapper className={cls}>\n      <IconButton\n        variant={'secondary'}\n        ref={ref}\n        useTransparentBackground={true}\n        shape={'circular'}\n        action={() => {\n          setIsActive(!isActive);\n          if (onChange) {\n            onChange(!isActive);\n          }\n        }}\n        id={id}\n        iconColor={isActive ? activeState?.color ?? defaultState.color : defaultState.color}\n        disabled={disabled}\n        {...rest}>\n        {isActive ? activeState?.icon ?? defaultState.icon : defaultState.icon}\n      </IconButton>\n    </Wrapper>\n  );\n});\n\nexport default ToggleButton;\n"],"mappings":";;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAAmC;AAAA;AAAA;AAAA;AAAA;AAEnC,IAAMA,OAAO,GAAGC,yBAAM,CAACC,GAAG,okBACtBC,6BAAiB,EAMfA,6BAAiB,EACHC,cAAM,CAACC,KAAK,EAK1BF,6BAAiB,EAKGC,cAAM,CAACE,WAAW,EAQtCH,6BAAiB,EACHC,cAAM,CAACG,WAAW,CAGrC;AAgBM,IAAMC,YAAY,gBAAGC,cAAK,CAACC,UAAU,CAAC,gBASuBC,GAAiC,EAAK;EAAA;EAAA,IAR1DC,EAAE,QAAFA,EAAE;IACFC,MAAM,QAANA,MAAM;IACNC,QAAQ,QAARA,QAAQ;IACRC,QAAQ,QAARA,QAAQ;IACRC,YAAY,QAAZA,YAAY;IACZC,WAAW,QAAXA,WAAW;IACXC,SAAS,QAATA,SAAS;IACNC,IAAI;EAErD,sBAAgCV,cAAK,CAACW,QAAQ,CAAC,KAAK,CAAC;IAAA;IAA9CC,QAAQ;IAAEC,WAAW;EAE5Bb,cAAK,CAACc,SAAS,CAAC;IAAA,OAAMD,WAAW,CAACT,MAAM,CAAC;EAAA,GAAE,CAACA,MAAM,CAAC,CAAC;EAEpD,IAAMW,GAAG,aAAMN,SAAS,IAAI,EAAE,cAAIG,QAAQ,GAAG,QAAQ,GAAG,EAAE,cAAIJ,WAAW,GAAG,cAAc,GAAG,EAAE,cAAIF,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAE;EAE/H,oBACE,qBAAC,OAAO;IAAC,SAAS,EAAES,GAAI;IAAA,uBACtB,qBAAC,kBAAU;MACT,OAAO,EAAE,WAAY;MACrB,GAAG,EAAEb,GAAI;MACT,wBAAwB,EAAE,IAAK;MAC/B,KAAK,EAAE,UAAW;MAClB,MAAM,EAAE,kBAAM;QACZW,WAAW,CAAC,CAACD,QAAQ,CAAC;QACtB,IAAIP,QAAQ,EAAE;UACZA,QAAQ,CAAC,CAACO,QAAQ,CAAC;QACrB;MACF,CAAE;MACF,EAAE,EAAET,EAAG;MACP,SAAS,EAAES,QAAQ,yBAAGJ,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAEQ,KAAK,mEAAIT,YAAY,CAACS,KAAK,GAAGT,YAAY,CAACS,KAAM;MACpF,QAAQ,EAAEV;IAAS,GACfI,IAAI;MAAA,UACPE,QAAQ,wBAAGJ,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAES,IAAI,iEAAIV,YAAY,CAACU,IAAI,GAAGV,YAAY,CAACU;IAAI;EAC3D,EACL;AAEd,CAAC,CAAC;AAAC;AAAA;EA7CDb,MAAM;EACNC,QAAQ;EACRC,QAAQ;EAERC,YAAY;IATZU,IAAI;IACJD,KAAK;EAAA;EASLR,WAAW;IAVXS,IAAI;IACJD,KAAK;EAAA;AAAA;AAAA,eAmDQjB,YAAY;AAAA"}

package/dist/Toggles/ToggleButton.js

@@ -4,13 +4,9 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 import _pt from "prop-types";
 var _excluded = ["id", "active", "onChange", "disabled", "defaultState", "activeState", "className"];
-
 var _templateObject;
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 import React from 'react';
 import { IconButton } from '../Button';
 import styled from 'styled-components';
@@ -20,21 +16,18 @@ import { jsx as _jsx } from "react/jsx-runtime";
 var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", " {\n    transition: all 0.1s ease-in-out;\n  }\n\n  &.disabled,\n  &.active:not(.state-change) {\n    ", " {\n      background: ", ";\n    }\n  }\n\n  &.active:not(.state-change) {\n    ", ":after {\n      content: '';\n      position: absolute;\n      left: 12px;\n      bottom: 1px;\n      background-color: ", ";\n      border-radius: 4px;\n      height: 4px;\n      width: 24px;\n    }\n  }\n\n  &.disabled:not(.state-change) {\n    ", ":after {\n      background: ", ";\n    }\n  }\n"])), IconButtonContent, IconButtonContent, COLORS.white, IconButtonContent, COLORS.primary_500, IconButtonContent, COLORS.neutral_300);
 export var ToggleButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _activeState$color, _activeState$icon;
-
   var id = _ref.id,
-      active = _ref.active,
-      onChange = _ref.onChange,
-      disabled = _ref.disabled,
-      defaultState = _ref.defaultState,
-      activeState = _ref.activeState,
-      className = _ref.className,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    active = _ref.active,
+    onChange = _ref.onChange,
+    disabled = _ref.disabled,
+    defaultState = _ref.defaultState,
+    activeState = _ref.activeState,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
   var _React$useState = React.useState(false),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      isActive = _React$useState2[0],
-      setIsActive = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    isActive = _React$useState2[0],
+    setIsActive = _React$useState2[1];
   React.useEffect(function () {
     return setIsActive(active);
   }, [active]);
@@ -48,7 +41,6 @@ export var ToggleButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       shape: 'circular',
       action: function action() {
         setIsActive(!isActive);
-
         if (onChange) {
           onChange(!isActive);
         }

package/dist/Toggles/ToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleButton.js","names":["React","IconButton","styled","IconButtonContent","COLORS","Wrapper","div","white","primary_500","neutral_300","ToggleButton","forwardRef","ref","id","active","onChange","disabled","defaultState","activeState","className","rest","useState","isActive","setIsActive","useEffect","cls","color","icon"],"sources":["../../src/Toggles/ToggleButton.tsx"],"sourcesContent":["import React from 'react';\nimport { IconButton } from '../Button';\nimport styled from 'styled-components';\nimport { IconButtonContent } from '../Button/Iconbutton';\nimport { COLORS } from '../styles';\n\nconst Wrapper = styled.div`\n  ${IconButtonContent} {\n    transition: all 0.1s ease-in-out;\n  }\n\n  &.disabled,\n  &.active:not(.state-change) {\n    ${IconButtonContent} {\n      background: ${COLORS.white};\n    }\n  }\n\n  &.active:not(.state-change) {\n    ${IconButtonContent}:after {\n      content: '';\n      position: absolute;\n      left: 12px;\n      bottom: 1px;\n      background-color: ${COLORS.primary_500};\n      border-radius: 4px;\n      height: 4px;\n      width: 24px;\n    }\n  }\n\n  &.disabled:not(.state-change) {\n    ${IconButtonContent}:after {\n      background: ${COLORS.neutral_300};\n    }\n  }\n`;\n\nexport interface ToggleButtonState {\n  icon: React.ReactNode;\n  color?: string;\n}\n\nexport interface ToggleButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'disabled' | 'onClick'> {\n  active: boolean;\n  onChange?: (value: boolean) => void;\n  disabled?: boolean;\n\n  defaultState: ToggleButtonState;\n  activeState?: ToggleButtonState;\n}\n\nexport const ToggleButton = React.forwardRef(({\n                                                id,\n                                                active,\n                                                onChange,\n                                                disabled,\n                                                defaultState,\n                                                activeState,\n                                                className,\n                                                ...rest\n                                              }: ToggleButtonProps, ref: React.Ref<HTMLButtonElement>) => {\n  const [isActive, setIsActive] = React.useState(false);\n\n  React.useEffect(() => setIsActive(active), [active]);\n\n  const cls = `${className || ''} ${isActive ? 'active' : ''} ${activeState ? 'state-change' : ''} ${disabled ? 'disabled' : ''}`;\n\n  return (\n    <Wrapper className={cls}>\n      <IconButton\n        variant={'secondary'}\n        ref={ref}\n        useTransparentBackground={true}\n        shape={'circular'}\n        action={() => {\n          setIsActive(!isActive);\n          if (onChange) {\n            onChange(!isActive);\n          }\n        }}\n        id={id}\n        iconColor={isActive ? activeState?.color ?? defaultState.color : defaultState.color}\n        disabled={disabled}\n        {...rest}>\n        {isActive ? activeState?.icon ?? defaultState.icon : defaultState.icon}\n      </IconButton>\n    </Wrapper>\n  );\n});\n\nexport default ToggleButton;\n"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,QAA2B,WAA3B;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,iBAAT,QAAkC,sBAAlC;AACA,SAASC,MAAT,QAAuB,WAAvB;;AAEA,IAAMC,OAAO,GAAGH,MAAM,CAACI,GAAV,sjBACTH,iBADS,EAOPA,iBAPO,EAQOC,MAAM,CAACG,KARd,EAaPJ,iBAbO,EAkBaC,MAAM,CAACI,WAlBpB,EA0BPL,iBA1BO,EA2BOC,MAAM,CAACK,WA3Bd,CAAb;AA8CA,OAAO,IAAMC,YAAY,gBAAGV,KAAK,CAACW,UAAN,CAAiB,gBASuBC,GATvB,EAS6D;EAAA;;EAAA,IAR1DC,EAQ0D,QAR1DA,EAQ0D;EAAA,IAP1DC,MAO0D,QAP1DA,MAO0D;EAAA,IAN1DC,QAM0D,QAN1DA,QAM0D;EAAA,IAL1DC,QAK0D,QAL1DA,QAK0D;EAAA,IAJ1DC,YAI0D,QAJ1DA,YAI0D;EAAA,IAH1DC,WAG0D,QAH1DA,WAG0D;EAAA,IAF1DC,SAE0D,QAF1DA,SAE0D;EAAA,IADvDC,IACuD;;EACxG,sBAAgCpB,KAAK,CAACqB,QAAN,CAAe,KAAf,CAAhC;EAAA;EAAA,IAAOC,QAAP;EAAA,IAAiBC,WAAjB;;EAEAvB,KAAK,CAACwB,SAAN,CAAgB;IAAA,OAAMD,WAAW,CAACT,MAAD,CAAjB;EAAA,CAAhB,EAA2C,CAACA,MAAD,CAA3C;EAEA,IAAMW,GAAG,aAAMN,SAAS,IAAI,EAAnB,cAAyBG,QAAQ,GAAG,QAAH,GAAc,EAA/C,cAAqDJ,WAAW,GAAG,cAAH,GAAoB,EAApF,cAA0FF,QAAQ,GAAG,UAAH,GAAgB,EAAlH,CAAT;EAEA,oBACE,KAAC,OAAD;IAAS,SAAS,EAAES,GAApB;IAAA,uBACE,KAAC,UAAD;MACE,OAAO,EAAE,WADX;MAEE,GAAG,EAAEb,GAFP;MAGE,wBAAwB,EAAE,IAH5B;MAIE,KAAK,EAAE,UAJT;MAKE,MAAM,EAAE,kBAAM;QACZW,WAAW,CAAC,CAACD,QAAF,CAAX;;QACA,IAAIP,QAAJ,EAAc;UACZA,QAAQ,CAAC,CAACO,QAAF,CAAR;QACD;MACF,CAVH;MAWE,EAAE,EAAET,EAXN;MAYE,SAAS,EAAES,QAAQ,yBAAGJ,WAAH,aAAGA,WAAH,uBAAGA,WAAW,CAAEQ,KAAhB,mEAAyBT,YAAY,CAACS,KAAtC,GAA8CT,YAAY,CAACS,KAZhF;MAaE,QAAQ,EAAEV;IAbZ,GAcMI,IAdN;MAAA,UAeGE,QAAQ,wBAAGJ,WAAH,aAAGA,WAAH,uBAAGA,WAAW,CAAES,IAAhB,iEAAwBV,YAAY,CAACU,IAArC,GAA4CV,YAAY,CAACU;IAfpE;EADF,EADF;AAqBD,CArC2B,CAArB;;EARLb,M;EACAC,Q;EACAC,Q;EAEAC,Y;IATAU,I;IACAD,K;;EASAR,W;IAVAS,I;IACAD,K;;;AAmDF,eAAehB,YAAf"}
+{"version":3,"file":"ToggleButton.js","names":["React","IconButton","styled","IconButtonContent","COLORS","Wrapper","div","white","primary_500","neutral_300","ToggleButton","forwardRef","ref","id","active","onChange","disabled","defaultState","activeState","className","rest","useState","isActive","setIsActive","useEffect","cls","color","icon"],"sources":["../../src/Toggles/ToggleButton.tsx"],"sourcesContent":["import React from 'react';\nimport { IconButton } from '../Button';\nimport styled from 'styled-components';\nimport { IconButtonContent } from '../Button/Iconbutton';\nimport { COLORS } from '../styles';\n\nconst Wrapper = styled.div`\n  ${IconButtonContent} {\n    transition: all 0.1s ease-in-out;\n  }\n\n  &.disabled,\n  &.active:not(.state-change) {\n    ${IconButtonContent} {\n      background: ${COLORS.white};\n    }\n  }\n\n  &.active:not(.state-change) {\n    ${IconButtonContent}:after {\n      content: '';\n      position: absolute;\n      left: 12px;\n      bottom: 1px;\n      background-color: ${COLORS.primary_500};\n      border-radius: 4px;\n      height: 4px;\n      width: 24px;\n    }\n  }\n\n  &.disabled:not(.state-change) {\n    ${IconButtonContent}:after {\n      background: ${COLORS.neutral_300};\n    }\n  }\n`;\n\nexport interface ToggleButtonState {\n  icon: React.ReactNode;\n  color?: string;\n}\n\nexport interface ToggleButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'disabled' | 'onClick'> {\n  active: boolean;\n  onChange?: (value: boolean) => void;\n  disabled?: boolean;\n\n  defaultState: ToggleButtonState;\n  activeState?: ToggleButtonState;\n}\n\nexport const ToggleButton = React.forwardRef(({\n                                                id,\n                                                active,\n                                                onChange,\n                                                disabled,\n                                                defaultState,\n                                                activeState,\n                                                className,\n                                                ...rest\n                                              }: ToggleButtonProps, ref: React.Ref<HTMLButtonElement>) => {\n  const [isActive, setIsActive] = React.useState(false);\n\n  React.useEffect(() => setIsActive(active), [active]);\n\n  const cls = `${className || ''} ${isActive ? 'active' : ''} ${activeState ? 'state-change' : ''} ${disabled ? 'disabled' : ''}`;\n\n  return (\n    <Wrapper className={cls}>\n      <IconButton\n        variant={'secondary'}\n        ref={ref}\n        useTransparentBackground={true}\n        shape={'circular'}\n        action={() => {\n          setIsActive(!isActive);\n          if (onChange) {\n            onChange(!isActive);\n          }\n        }}\n        id={id}\n        iconColor={isActive ? activeState?.color ?? defaultState.color : defaultState.color}\n        disabled={disabled}\n        {...rest}>\n        {isActive ? activeState?.icon ?? defaultState.icon : defaultState.icon}\n      </IconButton>\n    </Wrapper>\n  );\n});\n\nexport default ToggleButton;\n"],"mappings":";;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,QAAQ,WAAW;AACtC,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAASC,MAAM,QAAQ,WAAW;AAAC;AAEnC,IAAMC,OAAO,GAAGH,MAAM,CAACI,GAAG,sjBACtBH,iBAAiB,EAMfA,iBAAiB,EACHC,MAAM,CAACG,KAAK,EAK1BJ,iBAAiB,EAKGC,MAAM,CAACI,WAAW,EAQtCL,iBAAiB,EACHC,MAAM,CAACK,WAAW,CAGrC;AAgBD,OAAO,IAAMC,YAAY,gBAAGV,KAAK,CAACW,UAAU,CAAC,gBASuBC,GAAiC,EAAK;EAAA;EAAA,IAR1DC,EAAE,QAAFA,EAAE;IACFC,MAAM,QAANA,MAAM;IACNC,QAAQ,QAARA,QAAQ;IACRC,QAAQ,QAARA,QAAQ;IACRC,YAAY,QAAZA,YAAY;IACZC,WAAW,QAAXA,WAAW;IACXC,SAAS,QAATA,SAAS;IACNC,IAAI;EAErD,sBAAgCpB,KAAK,CAACqB,QAAQ,CAAC,KAAK,CAAC;IAAA;IAA9CC,QAAQ;IAAEC,WAAW;EAE5BvB,KAAK,CAACwB,SAAS,CAAC;IAAA,OAAMD,WAAW,CAACT,MAAM,CAAC;EAAA,GAAE,CAACA,MAAM,CAAC,CAAC;EAEpD,IAAMW,GAAG,aAAMN,SAAS,IAAI,EAAE,cAAIG,QAAQ,GAAG,QAAQ,GAAG,EAAE,cAAIJ,WAAW,GAAG,cAAc,GAAG,EAAE,cAAIF,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAE;EAE/H,oBACE,KAAC,OAAO;IAAC,SAAS,EAAES,GAAI;IAAA,uBACtB,KAAC,UAAU;MACT,OAAO,EAAE,WAAY;MACrB,GAAG,EAAEb,GAAI;MACT,wBAAwB,EAAE,IAAK;MAC/B,KAAK,EAAE,UAAW;MAClB,MAAM,EAAE,kBAAM;QACZW,WAAW,CAAC,CAACD,QAAQ,CAAC;QACtB,IAAIP,QAAQ,EAAE;UACZA,QAAQ,CAAC,CAACO,QAAQ,CAAC;QACrB;MACF,CAAE;MACF,EAAE,EAAET,EAAG;MACP,SAAS,EAAES,QAAQ,yBAAGJ,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAEQ,KAAK,mEAAIT,YAAY,CAACS,KAAK,GAAGT,YAAY,CAACS,KAAM;MACpF,QAAQ,EAAEV;IAAS,GACfI,IAAI;MAAA,UACPE,QAAQ,wBAAGJ,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAES,IAAI,iEAAIV,YAAY,CAACU,IAAI,GAAGV,YAAY,CAACU;IAAI;EAC3D,EACL;AAEd,CAAC,CAAC;AAAC;EA7CDb,MAAM;EACNC,QAAQ;EACRC,QAAQ;EAERC,YAAY;IATZU,IAAI;IACJD,KAAK;EAAA;EASLR,WAAW;IAVXS,IAAI;IACJD,KAAK;EAAA;AAAA;AAmDP,eAAehB,YAAY"}

package/dist/Toggles/ToggleSwitch.cjs

@@ -1,61 +1,44 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _TogglerStyles = require("./TogglerStyles");
-
 var _ = require("..");
-
 var _common = require("../common");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _excluded = ["id", "disabled", "selected", "label", "isSemantic", "size", "onToggle", "className"];
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 var ToggleSwitch = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _size;
-
   var id = _ref.id,
-      disabled = _ref.disabled,
-      selected = _ref.selected,
-      label = _ref.label,
-      isSemantic = _ref.isSemantic,
-      size = _ref.size,
-      onToggle = _ref.onToggle,
-      className = _ref.className,
-      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-
+    disabled = _ref.disabled,
+    selected = _ref.selected,
+    label = _ref.label,
+    isSemantic = _ref.isSemantic,
+    size = _ref.size,
+    onToggle = _ref.onToggle,
+    className = _ref.className,
+    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   /**
    * Does all required pre-requisites and toggles the switcher state.
    */
   var toggle = function toggle() {
     // If disabled, don't do anything
-    if (disabled) return; // Toggle state change
+    if (disabled) return;
 
+    // Toggle state change
     onToggle(!selected);
   };
-
   var focusVisibleRef = (0, _common.useFocusVisibleRef)([]);
   React.useImperativeHandle(ref, function () {
     return focusVisibleRef.current;