@activecollab/components 0.1.537 → 1.0.4

package/dist/esm/components/Tables/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","sources":["../../../../src/components/Tables/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const StyledTableHead = styled.thead`\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  ${tw`tw-text-left tw-uppercase`}\n\n  th {\n    ${tw`tw-whitespace-nowrap tw-pl-4 tw-pr-4 tw-pb-8 tw-pt-2 tw-text-theme-700 tw-font-semibold tw-text-xxs`}\n  }\n\n  tr {\n    td:first-child,\n    th:first-child {\n      ${tw`tw-pl-6`}\n    }\n  }\n`;\nStyledTableHead.displayName = \"StyledTableHead\";\n\nexport const StyledTableBody = styled.tbody`\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  ${tw`tw-truncate`}\n\n  td {\n    ${tw`tw-truncate`}\n  }\n\n  &:not(.c-table__grouped__head) {\n    td {\n      ${tw`tw-text-theme-700`}\n    }\n  }\n\n  a {\n    ${tw`tw-no-underline tw-text-primary`}\n    &:hover {\n      ${tw`tw-underline`}\n    }\n  }\n`;\nStyledTableBody.displayName = \"StyledTableBody\";\n\nexport const StyledTableWrapper = styled.div`\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  ${tw`tw-mt-8 tw-mx-4 tw-overflow-x-auto tw-overflow-y-hidden`}\n\n  &:before {\n    ${tw`tw-absolute tw-left-0 tw-right-0 tw-bottom-0 tw-bg-page-paper-main tw-rounded-lg tw-shadow-lg`}\n    content: \"\";\n    top: 39px;\n    z-index: -1;\n  }\n`;\nStyledTableWrapper.displayName = \"StyledTableWrapper\";\n\nexport const StyledTable = styled.table<{\n  $striped: boolean;\n}>`\n  ${tw`tw-w-full tw-p-0 tw-text-xs tw-pb-4`}\n  border-spacing: 0;\n\n  ${StyledTableHead} tr th,\n  ${StyledTableBody} tr td {\n    &:last-child {\n      ${tw`tw-text-right`}\n    }\n  }\n\n  td {\n    ${tw`tw-py-3 tw-px-4`}\n  }\n\n  ${(props) =>\n    props.$striped &&\n    css`\n      ${StyledTableBody}:not(.c-table__grouped__head) {\n        tr:nth-child(odd) {\n          ${tw`tw-bg-theme-200`}\n        }\n      }\n    `}\n`;\nStyledTable.displayName = \"StyledTable\";\n\nexport const StyledDataTable = styled.div`\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  &.c-table__collapsible {\n    .c-table__head {\n      tr {\n        th {\n          position: sticky;\n          top: 0;\n          z-index: 1;\n        }\n      }\n    }\n  }\n  &.c-table__grouped {\n    .c-table__head th {\n      ${tw`tw-pb-4`}\n      &:last-child {\n        ${tw`tw-pr-0`}\n      }\n    }\n  }\n  &.c-data-table {\n    position: relative;\n    .c-table__head th {\n      &:last-child {\n        ${tw`tw-pr-0`}\n      }\n    }\n  }\n  .c-table__cell {\n    ${tw`tw-relative`}\n    &:hover {\n      .c-table__icon {\n        ${tw`tw-opacity-50`}\n      }\n    }\n  }\n  .c-table__overlay {\n    ${tw`tw-absolute tw-w-full tw-left-0 tw-pointer-events-none`}\n    top: 0px;\n    border-top-left-radius: 8px;\n    border-top-right-radius: 8px;\n    background: rgba(0, 0, 0, 0.02);\n    .neon & {\n      background: rgba(0, 0, 0, 0.1);\n    }\n    z-index: 5;\n  }\n  .c-table__icon-wrapper {\n    ${tw`tw-inline-block tw-select-none`}\n  }\n  .c-table__label {\n    ${tw`tw-border-0 tw-border-0 tw-border-transparent tw-border-solid`}\n  }\n  .c-table__icon {\n    transform: translateY(1px);\n    ${tw`tw-ml-1`}\n    fill: var(--color-theme-900);\n\n    &:hover {\n      ${tw`tw-opacity-100`}\n    }\n  }\n  .c-table__icon--inactive {\n    ${tw`tw-opacity-0`}\n  }\n  .c-table__icon--active {\n    ${tw`tw-opacity-100`}\n  }\n  .c-table__icon--desc {\n    transform: rotate(-180deg) scale(-1, 1);\n  }\n  .c-table__grouped__head {\n    ${tw`tw-font-bold`}\n    > :first-child {\n      ${tw`tw-text-theme-900`}\n    }\n    a:first-child {\n      ${tw`tw-text-primary`}\n    }\n  }\n  .c-table__head--hidden {\n    ${tw`tw-pointer-events-none tw-opacity-0`}\n  }\n  .c-table__collapse_icon--expanded {\n    transition-duration: 0.3s;\n    ${tw`tw-cursor-pointer`}\n  }\n  .c-table__collapse_icon--collapsed {\n    transform: rotate(180deg);\n    transition-duration: 0.3s;\n    ${tw`tw-cursor-pointer`}\n  }\n  .c-table__head__icon-wrapper__icon {\n    ${tw`tw-absolute tw-cursor-pointer`}\n    transform: translate(-24px, -5px);\n  }\n  &.c-table__collapsible {\n    .c-table__group {\n      .c-table__row:last-child .c-table__cell {\n        border-bottom: 1px solid var(--border-primary);\n      }\n      &:last-child {\n        .c-table__row:last-child .c-table__cell {\n          border-bottom: 0;\n        }\n      }\n    }\n    .c-table__grouped__head {\n      tr td {\n        border-bottom: 1px solid var(--border-primary);\n      }\n      .c-table__body__collapse td {\n        border-bottom: 0;\n      }\n      &.last {\n        tr td {\n          border-bottom: 0 !important;\n        }\n      }\n    }\n    .c-table__grouped__head--expanded {\n      tr:last-child td {\n        border-bottom: 0;\n      }\n    }\n  }\n  .c-table__collapse_body {\n    tr {\n      background-color: transparent !important;\n    }\n    td:last-child {\n      ${tw`tw-border-0`}\n    }\n    ${tw`tw-absolute`}\n  }\n  .c-table__row {\n    td:first-child {\n      position: sticky;\n      left: 0;\n      z-index: 1;\n    }\n    &:nth-child(odd) {\n      td {\n        ${tw`tw-bg-theme-200`}\n      }\n    }\n    &:nth-child(even) {\n      td {\n        ${tw`tw-bg-page-paper-main`}\n      }\n    }\n  }\n  .c-table__row {\n    th:first-child {\n      position: sticky;\n      left: 0;\n      z-index: 2 !important;\n    }\n  }\n  &.c-table__collapsible .c-table__body {\n    tr {\n      td:first-child,\n      th:first-child {\n        ${tw`tw-pl-6`}\n      }\n    }\n  }\n  .c-table__body__icon {\n    ${tw`tw-p-0`}\n    padding-left: 0 !important;\n    transform: translateY(8px);\n  }\n  &.padding-b-0 {\n    ${tw`tw-pb-0`}\n  }\n  .cursor-pointer {\n    ${tw`tw-cursor-pointer`}\n  }\n  .text-center {\n    ${tw`tw-text-center`}\n  }\n  .opacity-75 {\n    ${tw`tw-opacity-75`}\n  }\n  .hidden {\n    ${tw`tw-hidden`}\n  }\n`;\nStyledDataTable.displayName = \"StyledDataTable\";\n"],"names":["StyledTableHead","styled","thead","FontStyle","BoxSizingStyle","displayName","StyledTableBody","tbody","StyledTableWrapper","div","StyledTable","table","props","$striped","css","StyledDataTable"],"mappings":";;;;IAKaA,eAAe,GAAGC,MAAM,CAACC,KAAV;AAAA;AAAA;AAAA,uEACxBC,SADwB,EAExBC,cAFwB,EAItB;AAAA;AAAA;AAAA,CAJsB,EAOpB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAPoB,EAalB;AAAA;AAAA,CAbkB;AAiB5BJ,eAAe,CAACK,WAAhB,GAA8B,iBAA9B;IAEaC,eAAe,GAAGL,MAAM,CAACM,KAAV;AAAA;AAAA;AAAA,6FACxBJ,SADwB,EAExBC,cAFwB,EAItB;AAAA;AAAA;AAAA;AAAA,CAJsB,EAOpB;AAAA;AAAA;AAAA;AAAA,CAPoB,EAYlB;AAAA;AAAA,CAZkB,EAiBpB;AAAA;AAAA;AAAA,CAjBoB,EAmBlB;AAAA;AAAA,CAnBkB;AAuB5BE,eAAe,CAACD,WAAhB,GAA8B,iBAA9B;IAEaG,kBAAkB,GAAGP,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA,wEAC3BN,SAD2B,EAE3BC,cAF2B,EAIzB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAJyB,EAOvB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAPuB;AAa/BI,kBAAkB,CAACH,WAAnB,GAAiC,oBAAjC;IAEaK,WAAW,GAAGT,MAAM,CAACU,KAAV;AAAA;AAAA;AAAA,oFAGlB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAHkB,EAMpBX,eANoB,EAOpBM,eAPoB,EASd;AAAA;AAAA,CATc,EAchB;AAAA;AAAA;AAAA;AAAA;AAAA,CAdgB,EAiBpB,UAACM,KAAD;AAAA,SACAA,KAAK,CAACC,QAAN,IACAC,GADA,iEAEIR,eAFJ,EAIU;AAAA;AAAA,GAJV,CADA;AAAA,CAjBoB;AA2BxBI,WAAW,CAACL,WAAZ,GAA0B,aAA1B;IAEaU,eAAe,GAAGd,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA,+7DACxBN,SADwB,EAExBC,cAFwB,EAiBlB;AAAA;AAAA,CAjBkB,EAmBhB;AAAA;AAAA,CAnBgB,EA2BhB;AAAA;AAAA,CA3BgB,EAgCpB;AAAA;AAAA,CAhCoB,EAmChB;AAAA;AAAA,CAnCgB,EAwCpB;AAAA;AAAA;AAAA;AAAA;AAAA,CAxCoB,EAmDpB;AAAA;AAAA;AAAA,CAnDoB,EAsDpB;AAAA;AAAA;AAAA;AAAA,CAtDoB,EA0DpB;AAAA;AAAA,CA1DoB,EA8DlB;AAAA;AAAA,CA9DkB,EAkEpB;AAAA;AAAA,CAlEoB,EAqEpB;AAAA;AAAA,CArEoB,EA2EpB;AAAA;AAAA,CA3EoB,EA6ElB;AAAA;AAAA,CA7EkB,EAgFlB;AAAA;AAAA,CAhFkB,EAoFpB;AAAA;AAAA;AAAA,CApFoB,EAwFpB;AAAA;AAAA,CAxFoB,EA6FpB;AAAA;AAAA,CA7FoB,EAgGpB;AAAA;AAAA;AAAA,CAhGoB,EAsIlB;AAAA;AAAA,CAtIkB,EAwIpB;AAAA;AAAA,CAxIoB,EAkJhB;AAAA;AAAA,CAlJgB,EAuJhB;AAAA;AAAA,CAvJgB,EAsKhB;AAAA;AAAA,CAtKgB,EA2KpB;AAAA;AAAA,CA3KoB,EAgLpB;AAAA;AAAA,CAhLoB,EAmLpB;AAAA;AAAA,CAnLoB,EAsLpB;AAAA;AAAA,CAtLoB,EAyLpB;AAAA;AAAA,CAzLoB,EA4LpB;AAAA;AAAA,CA5LoB;AA+L5BW,eAAe,CAACV,WAAhB,GAA8B,iBAA9B;;;;"}

package/dist/esm/components/Tables/Table.d.ts

@@ -1,12 +1,10 @@
 import { ReactNode, FC, RefObject } from "react";
-import "./Table.css";
 interface ITableWithChildren {
     children: ReactNode;
     className?: string;
 }
 export interface ITableProps {
     striped?: boolean;
-    fixed?: boolean;
     className?: string;
     innerRef?: RefObject<HTMLTableElement>;
 }

package/dist/esm/components/Tables/Table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../src/components/Tables/Table.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAExD,OAAO,aAAa,CAAC;AAErB,UAAU,kBAAkB;IAE1B,QAAQ,EAAE,SAAS,CAAC;IAEpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,WAAW;IAE1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,QAAQ,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,WAAW,GAAG,kBAAkB,CAqBtD,CAAC;AAIF,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,kBAAkB,CAIxC,CAAC;AAIF,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,kBAAkB,CAIxC,CAAC"}
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../src/components/Tables/Table.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASxD,UAAU,kBAAkB;IAE1B,QAAQ,EAAE,SAAS,CAAC;IAEpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,WAAW;IAE1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,QAAQ,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,WAAW,GAAG,kBAAkB,CAiBtD,CAAC;AAIF,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,kBAAkB,CAIxC,CAAC;AAIF,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,kBAAkB,CAIxC,CAAC"}

package/dist/esm/components/Tables/Table.js

@@ -0,0 +1,43 @@
+import 'react';
+import classnames from 'classnames';
+import { StyledTableWrapper, StyledTable, StyledTableHead, StyledTableBody } from './Styles.js';
+import { jsx } from 'react/jsx-runtime';
+
+var Table = function Table(_ref) {
+  var children = _ref.children,
+      className = _ref.className,
+      _ref$striped = _ref.striped,
+      striped = _ref$striped === void 0 ? false : _ref$striped,
+      innerRef = _ref.innerRef;
+  return /*#__PURE__*/jsx(StyledTableWrapper, {
+    className: "c-table__wrap",
+    children: /*#__PURE__*/jsx(StyledTable, {
+      ref: innerRef,
+      className: classnames("c-table", className),
+      $striped: striped,
+      children: children
+    })
+  });
+};
+Table.displayName = "Table";
+var Thead = function Thead(_ref2) {
+  var children = _ref2.children,
+      className = _ref2.className;
+  return /*#__PURE__*/jsx(StyledTableHead, {
+    className: classnames("c-table__head", className),
+    children: children
+  });
+};
+Thead.displayName = "Thead";
+var Tbody = function Tbody(_ref3) {
+  var children = _ref3.children,
+      className = _ref3.className;
+  return /*#__PURE__*/jsx(StyledTableBody, {
+    className: classnames("c-table__body", className),
+    children: children
+  });
+};
+Tbody.displayName = "Tbody";
+
+export { Table, Tbody, Thead };
+//# sourceMappingURL=Table.js.map

package/dist/esm/components/Tables/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","sources":["../../../../src/components/Tables/Table.tsx"],"sourcesContent":["import React, { ReactNode, FC, RefObject } from \"react\";\nimport classNames from \"classnames\";\nimport {\n  StyledTableWrapper,\n  StyledTable,\n  StyledTableBody,\n  StyledTableHead,\n} from \"./Styles\";\n\ninterface ITableWithChildren {\n  /** Children prop can be ReactNode. */\n  children: ReactNode;\n  /** Classname prop for custom styling. */\n  className?: string;\n}\n\nexport interface ITableProps {\n  /** Darker color on odd column. */\n  striped?: boolean;\n  /** CSS classes. */\n  className?: string;\n  /** Ref object for table. */\n  innerRef?: RefObject<HTMLTableElement>;\n}\n\nexport const Table: FC<ITableProps & ITableWithChildren> = ({\n  children,\n  className,\n  striped = false,\n  innerRef,\n}) => {\n  return (\n    <StyledTableWrapper className=\"c-table__wrap\">\n      <StyledTable\n        ref={innerRef}\n        className={classNames(\"c-table\", className)}\n        $striped={striped}\n      >\n        {children}\n      </StyledTable>\n    </StyledTableWrapper>\n  );\n};\n\nTable.displayName = \"Table\";\n\nexport const Thead: FC<ITableWithChildren> = ({ children, className }) => (\n  <StyledTableHead className={classNames(\"c-table__head\", className)}>\n    {children}\n  </StyledTableHead>\n);\n\nThead.displayName = \"Thead\";\n\nexport const Tbody: FC<ITableWithChildren> = ({ children, className }) => (\n  <StyledTableBody className={classNames(\"c-table__body\", className)}>\n    {children}\n  </StyledTableBody>\n);\n\nTbody.displayName = \"Tbody\";\n"],"names":["Table","children","className","striped","innerRef","_jsx","classNames","displayName","Thead","Tbody"],"mappings":";;;;;IAyBaA,KAA2C,GAAG,SAA9CA,KAA8C,OAKrD;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,0BAFJC,OAEI;AAAA,MAFJA,OAEI,6BAFM,KAEN;AAAA,MADJC,QACI,QADJA,QACI;AACJ,sBACEC,IAAC,kBAAD;AAAoB,IAAA,SAAS,EAAC,eAA9B;AAAA,2BACEA,IAAC,WAAD;AACE,MAAA,GAAG,EAAED,QADP;AAEE,MAAA,SAAS,EAAEE,UAAU,CAAC,SAAD,EAAYJ,SAAZ,CAFvB;AAGE,MAAA,QAAQ,EAAEC,OAHZ;AAAA,gBAKGF;AALH;AADF,IADF;AAWD;AAEDD,KAAK,CAACO,WAAN,GAAoB,OAApB;IAEaC,KAA6B,GAAG,SAAhCA,KAAgC;AAAA,MAAGP,QAAH,SAAGA,QAAH;AAAA,MAAaC,SAAb,SAAaA,SAAb;AAAA,sBAC3CG,IAAC,eAAD;AAAiB,IAAA,SAAS,EAAEC,UAAU,CAAC,eAAD,EAAkBJ,SAAlB,CAAtC;AAAA,cACGD;AADH,IAD2C;AAAA;AAM7CO,KAAK,CAACD,WAAN,GAAoB,OAApB;IAEaE,KAA6B,GAAG,SAAhCA,KAAgC;AAAA,MAAGR,QAAH,SAAGA,QAAH;AAAA,MAAaC,SAAb,SAAaA,SAAb;AAAA,sBAC3CG,IAAC,eAAD;AAAiB,IAAA,SAAS,EAAEC,UAAU,CAAC,eAAD,EAAkBJ,SAAlB,CAAtC;AAAA,cACGD;AADH,IAD2C;AAAA;AAM7CQ,KAAK,CAACF,WAAN,GAAoB,OAApB;;;;"}

package/dist/esm/components/Textarea/Styles.d.ts

@@ -0,0 +1,6 @@
+interface StyledTextareaProps {
+    disabled: boolean;
+}
+export declare const StyledTextarea: import("styled-components").StyledComponent<"textarea", any, StyledTextareaProps, never>;
+export {};
+//# sourceMappingURL=Styles.d.ts.map

package/dist/esm/components/Textarea/Styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Textarea/Styles.ts"],"names":[],"mappings":"AAKA,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,cAAc,0FA8C1B,CAAC"}

package/dist/esm/components/Textarea/Styles.js

@@ -0,0 +1,24 @@
+import styled, { css } from 'styled-components';
+import { BoxSizingStyle } from '../BoxSizingStyle.js';
+import { FontStyle } from '../FontStyle.js';
+
+var StyledTextarea = styled.textarea.withConfig({
+  displayName: "Styles__StyledTextarea",
+  componentId: "sc-m6jqw8-0"
+})(["border:1px solid var(--border-primary);border-radius:10px;color:var(--color-theme-900);font-size:14px;padding:4px 10px 6px 8px;height:auto;background-color:var(--input-background-color);transition:all 0.3s ease;width:360px;min-height:90px;", " ", " ", " &:active,&:focus{outline:none !important;", "}&:focus{box-shadow:none;}&::placeholder{color:var(--color-theme-600);}", ""], FontStyle, BoxSizingStyle, function (props) {
+  return !props.disabled && css(["&:hover{outline:none !important;", "}"], {
+    "borderColor": "var(--color-primary)"
+  });
+}, {
+  "borderColor": "var(--color-primary)"
+}, function (props) {
+  return props.disabled && css(["outline:none;", " &:hover{border-color:var(--border-primary);}"], {
+    "cursor": "not-allowed",
+    "opacity": "0.5",
+    "borderColor": "var(--color-theme-400)"
+  });
+});
+StyledTextarea.displayName = "StyledTextarea";
+
+export { StyledTextarea };
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/Textarea/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","sources":["../../../../src/components/Textarea/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport tw from \"twin.macro\";\n\ninterface StyledTextareaProps {\n  disabled: boolean;\n}\n\nexport const StyledTextarea = styled.textarea<StyledTextareaProps>`\n  border: 1px solid var(--border-primary);\n  border-radius: 10px;\n  color: var(--color-theme-900);\n  font-size: 14px;\n  padding: 4px 10px 6px 8px;\n  height: auto;\n  background-color: var(--input-background-color);\n  transition: all 0.3s ease;\n  width: 360px;\n  min-height: 90px;\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  ${(props) =>\n    !props.disabled &&\n    css`\n      &:hover {\n        outline: none !important;\n        ${tw`tw-border-primary`}\n      }\n    `}\n\n  &:active, &:focus {\n    outline: none !important;\n    ${tw`tw-border-primary`}\n  }\n\n  &:focus {\n    box-shadow: none;\n  }\n\n  &::placeholder {\n    color: var(--color-theme-600);\n  }\n\n  ${(props) =>\n    props.disabled &&\n    css`\n      outline: none;\n      ${tw`tw-cursor-not-allowed tw-opacity-50 tw-border-theme-400`}\n\n      &:hover {\n        border-color: var(--border-primary);\n      }\n    `}\n`;\n\nStyledTextarea.displayName = \"StyledTextarea\";\n"],"names":["StyledTextarea","styled","textarea","FontStyle","BoxSizingStyle","props","disabled","css","displayName"],"mappings":";;;;IASaA,cAAc,GAAGC,MAAM,CAACC,QAAV;AAAA;AAAA;AAAA,+XAWvBC,SAXuB,EAYvBC,cAZuB,EAcvB,UAACC,KAAD;AAAA,SACA,CAACA,KAAK,CAACC,QAAP,IACAC,GADA,4CAIQ;AAAA;AAAA,GAJR,CADA;AAAA,CAduB,EAyBnB;AAAA;AAAA,CAzBmB,EAoCvB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,QAAN,IACAC,GADA,qEAGM;AAAA;AAAA;AAAA;AAAA,GAHN,CADA;AAAA,CApCuB;AAgD3BP,cAAc,CAACQ,WAAf,GAA6B,gBAA7B;;;;"}

package/dist/esm/components/Textarea/Textarea.d.ts

@@ -1,4 +1,3 @@
 import React from "react";
-import "./Textarea.css";
 export declare const Textarea: React.ForwardRefExoticComponent<React.TextareaHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>>;
 //# sourceMappingURL=Textarea.d.ts.map

package/dist/esm/components/Textarea/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AACvE,OAAO,gBAAgB,CAAC;AAGxB,eAAO,MAAM,QAAQ,+HAsBpB,CAAC"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAIvE,eAAO,MAAM,QAAQ,+HAsBpB,CAAC"}

package/dist/esm/components/Textarea/Textarea.js

@@ -0,0 +1,30 @@
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import { forwardRef } from 'react';
+import classnames from 'classnames';
+import { StyledTextarea } from './Styles.js';
+import { jsx } from 'react/jsx-runtime';
+
+var _excluded = ["className", "disabled"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+var Textarea = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/jsx(StyledTextarea, _objectSpread(_objectSpread({}, rest), {}, {
+    ref: ref,
+    disabled: disabled,
+    className: classnames("c-textarea", {
+      "c-textarea__disabled": disabled
+    }, className)
+  }));
+});
+Textarea.displayName = "Textarea";
+
+export { Textarea };
+//# sourceMappingURL=Textarea.js.map

package/dist/esm/components/Textarea/Textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.js","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import React, { TextareaHTMLAttributes, forwardRef, Ref } from \"react\";\nimport classnames from \"classnames\";\nimport { StyledTextarea } from \"./Styles\";\n\nexport const Textarea = forwardRef(\n  (\n    {\n      className,\n      disabled = false,\n      ...rest\n    }: TextareaHTMLAttributes<HTMLTextAreaElement>,\n    ref: Ref<HTMLTextAreaElement> | null | undefined\n  ) => {\n    return (\n      <StyledTextarea\n        {...rest}\n        ref={ref}\n        disabled={disabled}\n        className={classnames(\n          \"c-textarea\",\n          { \"c-textarea__disabled\": disabled },\n          className\n        )}\n      />\n    );\n  }\n);\n\nTextarea.displayName = \"Textarea\";\n"],"names":["Textarea","forwardRef","ref","className","disabled","rest","_jsx","classnames","displayName"],"mappings":";;;;;;;;;;;;IAIaA,QAAQ,gBAAGC,UAAU,CAChC,gBAMEC,GANF,EAOK;AAAA,MALDC,SAKC,QALDA,SAKC;AAAA,2BAJDC,QAIC;AAAA,MAJDA,QAIC,8BAJU,KAIV;AAAA,MAHEC,IAGF;;AACH,sBACEC,IAAC,cAAD,kCACMD,IADN;AAEE,IAAA,GAAG,EAAEH,GAFP;AAGE,IAAA,QAAQ,EAAEE,QAHZ;AAIE,IAAA,SAAS,EAAEG,UAAU,CACnB,YADmB,EAEnB;AAAE,8BAAwBH;AAA1B,KAFmB,EAGnBD,SAHmB;AAJvB,KADF;AAYD,CArB+B;AAwBlCH,QAAQ,CAACQ,WAAT,GAAuB,UAAvB;;;;"}

package/dist/esm/components/Toggle/Styles.d.ts

@@ -0,0 +1,8 @@
+export declare const StyledToggleSlider: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledToggleSliderOff: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledToggleSliderOn: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledToggleCheckbox: import("styled-components").StyledComponent<"input", any, {}, never>;
+export declare const StyledToggle: import("styled-components").StyledComponent<"label", any, {
+    $isHovered?: boolean | undefined;
+}, never>;
+//# sourceMappingURL=Styles.d.ts.map

package/dist/esm/components/Toggle/Styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Toggle/Styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,kBAAkB,oEA8B9B,CAAC;AAIF,eAAO,MAAM,qBAAqB,oEAOjC,CAAC;AAIF,eAAO,MAAM,oBAAoB,oEAOhC,CAAC;AAIF,eAAO,MAAM,oBAAoB,sEA8BhC,CAAC;AAwBF,eAAO,MAAM,YAAY;;SAqBxB,CAAC"}

package/dist/esm/components/Toggle/Styles.js

@@ -0,0 +1,35 @@
+import styled, { css } from 'styled-components';
+import { FontStyle } from '../FontStyle.js';
+import { BoxSizingStyle } from '../BoxSizingStyle.js';
+
+var StyledToggleSlider = styled.div.withConfig({
+  displayName: "Styles__StyledToggleSlider",
+  componentId: "sc-4n6vdf-0"
+})(["padding-left:6px;position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-evenly;background-color:transparent;border:1px solid var(--color-theme-600);overflow:hidden;border-radius:12.5px;font-size:11px;transition:0.3s;&:before{position:absolute;content:\"\";user-select:none;height:16px;width:16px;left:4px;bottom:3px;background-color:var(--color-theme-600);border-radius:50%;transition:0.3s;}"]);
+StyledToggleSlider.displayName = "StyledToggleSlider";
+var StyledToggleSliderOff = styled.div.withConfig({
+  displayName: "Styles__StyledToggleSliderOff",
+  componentId: "sc-4n6vdf-1"
+})(["user-select:none;transform:translateX(-3px);opacity:1;transition-duration:0.3s;white-space:nowrap;color:var(--color-theme-600);"]);
+StyledToggleSliderOff.displayName = "StyledToggleSliderOff";
+var StyledToggleSliderOn = styled.div.withConfig({
+  displayName: "Styles__StyledToggleSliderOn",
+  componentId: "sc-4n6vdf-2"
+})(["user-select:none;transform:translateX(-30px);opacity:0;transition-duration:0.3s;white-space:nowrap;color:var(--page-paper-main);"]);
+StyledToggleSliderOn.displayName = "StyledToggleSliderOn";
+var StyledToggleCheckbox = styled.input.withConfig({
+  displayName: "Styles__StyledToggleCheckbox",
+  componentId: "sc-4n6vdf-3"
+})(["opacity:0;width:0;height:0;&:checked + ", ":before{background-color:var(--page-paper-main);transform:translateX(25px);}&:checked + ", "{border-color:var(--color-sucess-green);background-color:var(--color-sucess-green);color:var(--color-sucess-green);", "{transform:translateX(30px);opacity:0;}", "{transform:translateX(0);opacity:1;}}&:disabled + ", "{opacity:0.5;cursor:default;}"], StyledToggleSlider, StyledToggleSlider, StyledToggleSliderOff, StyledToggleSliderOn, StyledToggleSlider);
+StyledToggleCheckbox.displayName = "StyledToggleCheckbox";
+var StyledHelper = css(["", "{transform:translateX(0);}", " + ", ":before{transform:translateX(3px);}", ":checked + ", "{&:before{transform:translateX(23px);}", "{transform:translateX(-2px);}}"], StyledToggleSliderOff, StyledToggleCheckbox, StyledToggleSlider, StyledToggleCheckbox, StyledToggleSlider, StyledToggleSliderOn);
+var StyledToggle = styled.label.withConfig({
+  displayName: "Styles__StyledToggle",
+  componentId: "sc-4n6vdf-4"
+})(["", " ", " position:relative;display:inline-block;width:50px;height:24px;font-size:13px;font-weight:bold;line-height:13px;&:hover{", "}", ""], FontStyle, BoxSizingStyle, StyledHelper, function (props) {
+  return props.$isHovered && css(["", ""], StyledHelper);
+});
+StyledToggle.displayName = "StyledToggle";
+
+export { StyledToggle, StyledToggleCheckbox, StyledToggleSlider, StyledToggleSliderOff, StyledToggleSliderOn };
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/Toggle/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","sources":["../../../../src/components/Toggle/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { FontStyle } from \"../FontStyle\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\n\nexport const StyledToggleSlider = styled.div`\n  padding-left: 6px;\n  position: absolute;\n  cursor: pointer;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: space-evenly;\n  background-color: transparent;\n  border: 1px solid var(--color-theme-600);\n  overflow: hidden;\n  border-radius: 12.5px;\n  font-size: 11px;\n  transition: 0.3s;\n\n  &:before {\n    position: absolute;\n    content: \"\";\n    user-select: none;\n    height: 16px;\n    width: 16px;\n    left: 4px;\n    bottom: 3px;\n    background-color: var(--color-theme-600);\n    border-radius: 50%;\n    transition: 0.3s;\n  }\n`;\n\nStyledToggleSlider.displayName = \"StyledToggleSlider\";\n\nexport const StyledToggleSliderOff = styled.div`\n  user-select: none;\n  transform: translateX(-3px);\n  opacity: 1;\n  transition-duration: 0.3s;\n  white-space: nowrap;\n  color: var(--color-theme-600);\n`;\n\nStyledToggleSliderOff.displayName = \"StyledToggleSliderOff\";\n\nexport const StyledToggleSliderOn = styled.div`\n  user-select: none;\n  transform: translateX(-30px);\n  opacity: 0;\n  transition-duration: 0.3s;\n  white-space: nowrap;\n  color: var(--page-paper-main);\n`;\n\nStyledToggleSliderOn.displayName = \"StyledToggleSliderOn\";\n\nexport const StyledToggleCheckbox = styled.input`\n  opacity: 0;\n  width: 0;\n  height: 0;\n\n  &:checked + ${StyledToggleSlider}:before {\n    background-color: var(--page-paper-main);\n    transform: translateX(25px);\n  }\n\n  &:checked + ${StyledToggleSlider} {\n    border-color: var(--color-sucess-green);\n    background-color: var(--color-sucess-green);\n    color: var(--color-sucess-green);\n\n    ${StyledToggleSliderOff} {\n      transform: translateX(30px);\n      opacity: 0;\n    }\n\n    ${StyledToggleSliderOn} {\n      transform: translateX(0);\n      opacity: 1;\n    }\n  }\n\n  &:disabled + ${StyledToggleSlider} {\n    opacity: 0.5;\n    cursor: default;\n  }\n`;\n\nStyledToggleCheckbox.displayName = \"StyledToggleCheckbox\";\n\nconst StyledHelper = css`\n  ${StyledToggleSliderOff} {\n    transform: translateX(0);\n  }\n\n  ${StyledToggleCheckbox} + ${StyledToggleSlider}:before {\n    transform: translateX(3px);\n  }\n\n  ${StyledToggleCheckbox}:checked + ${StyledToggleSlider} {\n    &:before {\n      transform: translateX(23px);\n    }\n\n    ${StyledToggleSliderOn} {\n      transform: translateX(-2px);\n    }\n  }\n`;\n\nexport const StyledToggle = styled.label<{ $isHovered?: boolean }>`\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  position: relative;\n  display: inline-block;\n  width: 50px;\n  height: 24px;\n  font-size: 13px;\n  font-weight: bold;\n  line-height: 13px;\n\n  &:hover {\n    ${StyledHelper}\n  }\n\n  ${(props) =>\n    props.$isHovered &&\n    css`\n      ${StyledHelper}\n    `}\n`;\n\nStyledToggle.displayName = \"StyledToggle\";\n"],"names":["StyledToggleSlider","styled","div","displayName","StyledToggleSliderOff","StyledToggleSliderOn","StyledToggleCheckbox","input","StyledHelper","css","StyledToggle","label","FontStyle","BoxSizingStyle","props","$isHovered"],"mappings":";;;;IAIaA,kBAAkB,GAAGC,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA;AAgC/BF,kBAAkB,CAACG,WAAnB,GAAiC,oBAAjC;IAEaC,qBAAqB,GAAGH,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA;AASlCE,qBAAqB,CAACD,WAAtB,GAAoC,uBAApC;IAEaE,oBAAoB,GAAGJ,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA;AASjCG,oBAAoB,CAACF,WAArB,GAAmC,sBAAnC;IAEaG,oBAAoB,GAAGL,MAAM,CAACM,KAAV;AAAA;AAAA;AAAA,qYAKjBP,kBALiB,EAUjBA,kBAViB,EAe3BI,qBAf2B,EAoB3BC,oBApB2B,EA0BhBL,kBA1BgB;AAgCjCM,oBAAoB,CAACH,WAArB,GAAmC,sBAAnC;AAEA,IAAMK,YAAY,GAAGC,GAAH,8KACdL,qBADc,EAKdE,oBALc,EAKYN,kBALZ,EASdM,oBATc,EASoBN,kBATpB,EAcZK,oBAdY,CAAlB;IAoBaK,YAAY,GAAGT,MAAM,CAACU,KAAV;AAAA;AAAA;AAAA,mJACrBC,SADqB,EAErBC,cAFqB,EAanBL,YAbmB,EAgBrB,UAACM,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,IACAN,GADA,WAEID,YAFJ,CADA;AAAA,CAhBqB;AAuBzBE,YAAY,CAACP,WAAb,GAA2B,cAA3B;;;;"}

package/dist/esm/components/Toggle/Toggle.d.ts

@@ -1,5 +1,4 @@
 import React, { BaseHTMLAttributes } from "react";
-import "./Toggle.css";
 interface IToggleProps extends BaseHTMLAttributes<HTMLInputElement> {
     hovered?: boolean;
     className?: string;

package/dist/esm/components/Toggle/Toggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.d.ts","sourceRoot":"","sources":["../../../../src/components/Toggle/Toggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,kBAAkB,EAAc,MAAM,OAAO,CAAC;AAE9D,OAAO,cAAc,CAAC;AAEtB,UAAU,YAAa,SAAQ,kBAAkB,CAAC,gBAAgB,CAAC;IAEjE,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,MAAM,uFAuBlB,CAAC"}
+{"version":3,"file":"Toggle.d.ts","sourceRoot":"","sources":["../../../../src/components/Toggle/Toggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,kBAAkB,EAAc,MAAM,OAAO,CAAC;AAU9D,UAAU,YAAa,SAAQ,kBAAkB,CAAC,gBAAgB,CAAC;IAEjE,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,MAAM,uFAelB,CAAC"}

package/dist/esm/components/Toggle/Toggle.js

@@ -0,0 +1,36 @@
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import { forwardRef } from 'react';
+import classnames from 'classnames';
+import { StyledToggle, StyledToggleCheckbox, StyledToggleSlider, StyledToggleSliderOn, StyledToggleSliderOff } from './Styles.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var _excluded = ["hovered", "className"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+var Toggle = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var hovered = _ref.hovered,
+      className = _ref.className,
+      args = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/jsxs(StyledToggle, {
+    className: classnames("c-toggle", className),
+    $isHovered: hovered,
+    children: [/*#__PURE__*/jsx(StyledToggleCheckbox, _objectSpread({
+      ref: ref,
+      type: "checkbox"
+    }, args)), /*#__PURE__*/jsxs(StyledToggleSlider, {
+      children: [/*#__PURE__*/jsx(StyledToggleSliderOn, {
+        children: "ON"
+      }), /*#__PURE__*/jsx(StyledToggleSliderOff, {
+        children: "OFF"
+      })]
+    })]
+  });
+});
+Toggle.displayName = "Toggle";
+
+export { Toggle };
+//# sourceMappingURL=Toggle.js.map

package/dist/esm/components/Toggle/Toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.js","sources":["../../../../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import React, { BaseHTMLAttributes, forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport {\n  StyledToggle,\n  StyledToggleCheckbox,\n  StyledToggleSlider,\n  StyledToggleSliderOff,\n  StyledToggleSliderOn,\n} from \"./Styles\";\n\ninterface IToggleProps extends BaseHTMLAttributes<HTMLInputElement> {\n  /** Set hovered state. */\n  hovered?: boolean;\n  /** Custom classname for styling. */\n  className?: string;\n}\n\nexport const Toggle = forwardRef<HTMLInputElement, IToggleProps>(\n  ({ hovered, className, ...args }, ref) => {\n    return (\n      <StyledToggle\n        className={classNames(\"c-toggle\", className)}\n        $isHovered={hovered}\n      >\n        <StyledToggleCheckbox ref={ref} type=\"checkbox\" {...args} />\n        <StyledToggleSlider>\n          <StyledToggleSliderOn>ON</StyledToggleSliderOn>\n          <StyledToggleSliderOff>OFF</StyledToggleSliderOff>\n        </StyledToggleSlider>\n      </StyledToggle>\n    );\n  }\n);\n\nToggle.displayName = \"Toggle\";\n"],"names":["Toggle","forwardRef","ref","hovered","className","args","_jsxs","classNames","_jsx","displayName"],"mappings":";;;;;;;;;;;;IAiBaA,MAAM,gBAAGC,UAAU,CAC9B,gBAAkCC,GAAlC,EAA0C;AAAA,MAAvCC,OAAuC,QAAvCA,OAAuC;AAAA,MAA9BC,SAA8B,QAA9BA,SAA8B;AAAA,MAAhBC,IAAgB;;AACxC,sBACEC,KAAC,YAAD;AACE,IAAA,SAAS,EAAEC,UAAU,CAAC,UAAD,EAAaH,SAAb,CADvB;AAEE,IAAA,UAAU,EAAED,OAFd;AAAA,4BAIEK,IAAC,oBAAD;AAAsB,MAAA,GAAG,EAAEN,GAA3B;AAAgC,MAAA,IAAI,EAAC;AAArC,OAAoDG,IAApD,EAJF,eAKEC,KAAC,kBAAD;AAAA,8BACEE,IAAC,oBAAD;AAAA;AAAA,QADF,eAEEA,IAAC,qBAAD;AAAA;AAAA,QAFF;AAAA,MALF;AAAA,IADF;AAYD,CAd6B;AAiBhCR,MAAM,CAACS,WAAP,GAAqB,QAArB;;;;"}

package/dist/esm/components/Tooltip/Styles.d.ts

@@ -0,0 +1,4 @@
+export declare const StyledTooltip: import("styled-components").StyledComponent<"div", any, {
+    $isLight: boolean;
+}, never>;
+//# sourceMappingURL=Styles.d.ts.map

package/dist/esm/components/Tooltip/Styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Tooltip/Styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,aAAa;cAA0B,OAAO;SAsB1D,CAAC"}

package/dist/esm/components/Tooltip/Styles.js

@@ -0,0 +1,13 @@
+import styled, { css } from 'styled-components';
+import { BoxSizingStyle } from '../BoxSizingStyle.js';
+import { FontStyle } from '../FontStyle.js';
+
+var StyledTooltip = styled.div.withConfig({
+  displayName: "Styles__StyledTooltip",
+  componentId: "sc-rur9b5-0"
+})(["", " ", " border-radius:8px;max-width:200px;padding:4px 10px;text-align:center;background-color:rgba(0,0,0,0.9);font-size:12px;font-weight:500;line-height:normal;color:#fff;margin:4px;", ""], BoxSizingStyle, FontStyle, function (props) {
+  return props.$isLight && css(["background-color:var(--page-paper-main);box-shadow:var(--shadow-secondary);color:var(--color-theme-700);"]);
+});
+
+export { StyledTooltip };
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/Tooltip/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","sources":["../../../../src/components/Tooltip/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const StyledTooltip = styled.div<{ $isLight: boolean }>`\n  ${BoxSizingStyle}\n  ${FontStyle}\n\n  border-radius: 8px;\n  max-width: 200px;\n  padding: 4px 10px;\n  text-align: center;\n  background-color: rgba(0, 0, 0, 0.9);\n  font-size: 12px;\n  font-weight: 500;\n  line-height: normal;\n  color: #fff;\n  margin: 4px;\n\n  ${(props) =>\n    props.$isLight &&\n    css`\n      background-color: var(--page-paper-main);\n      box-shadow: var(--shadow-secondary);\n      color: var(--color-theme-700);\n    `}\n`;\n"],"names":["StyledTooltip","styled","div","BoxSizingStyle","FontStyle","props","$isLight","css"],"mappings":";;;;IAIaA,aAAa,GAAGC,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA,qMACtBC,cADsB,EAEtBC,SAFsB,EAetB,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,QAAN,IACAC,GADA,8GADA;AAAA,CAfsB;;;;"}

package/dist/esm/components/Tooltip/Tooltip.d.ts

@@ -1,7 +1,6 @@
 import React, { ReactElement, CSSProperties, Ref } from "react";
 import { Placement } from "../Popper";
 import { TransitionProps } from "../Transitions";
-import "./Tooltip.css";
 interface ElementWithRef<T> extends ReactElement {
     ref?: Ref<T>;
 }

package/dist/esm/components/Tooltip/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,YAAY,EAEZ,aAAa,EAGb,GAAG,EAEJ,MAAM,OAAO,CAAC;AAEf,OAAO,EAAU,SAAS,EAAE,MAAM,WAAW,CAAC;AAG9C,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEjD,OAAO,eAAe,CAAC;AAEvB,UAAU,cAAc,CAAC,CAAC,CAAE,SAAQ,YAAY;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;CACd;AAED,UAAU,aAAa;IAErB,QAAQ,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IAEtC,KAAK,EAAE,YAAY,GAAG,MAAM,CAAC;IAE7B,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,mBAAmB,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC;IAEhD,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,kBAAkB,CAAC,EAAE,aAAa,CAAC;IAEnC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAEhC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAcD,eAAO,MAAM,OAAO,mFAwFnB,CAAC"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,YAAY,EAEZ,aAAa,EAGb,GAAG,EAEJ,MAAM,OAAO,CAAC;AAEf,OAAO,EAAU,SAAS,EAAE,MAAM,WAAW,CAAC;AAG9C,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAIjD,UAAU,cAAc,CAAC,CAAC,CAAE,SAAQ,YAAY;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;CACd;AAED,UAAU,aAAa;IAErB,QAAQ,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IAEtC,KAAK,EAAE,YAAY,GAAG,MAAM,CAAC;IAE7B,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,mBAAmB,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC;IAEhD,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,kBAAkB,CAAC,EAAE,aAAa,CAAC;IAEnC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAEhC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAcD,eAAO,MAAM,OAAO,mFAqFnB,CAAC"}

package/dist/esm/components/Tooltip/Tooltip.js

@@ -0,0 +1,118 @@
+import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import React, { forwardRef, useState } from 'react';
+import classnames from 'classnames';
+import useForkRef from '../../utils/useForkRef.js';
+import { StyledTooltip } from './Styles.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useLayerContext } from '../../helpers/LayerContext/LayerContext.js';
+import { Portal } from '../../helpers/Portal/Portal.js';
+import { Popper } from '../Popper/Popper.js';
+import { FromElement } from '../Transitions/FromElement/FromElement.js';
+
+var _excluded = ["children"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+var TooltipAnimation = function TooltipAnimation(_ref) {
+  var children = _ref.children,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/jsx(FromElement, _objectSpread(_objectSpread({
+    timeout: 0
+  }, props), {}, {
+    children: children
+  }));
+};
+
+var Tooltip = /*#__PURE__*/forwardRef(function (_ref2, ref) {
+  var children = _ref2.children,
+      title = _ref2.title,
+      className = _ref2.className,
+      style = _ref2.style,
+      _ref2$isLight = _ref2.isLight,
+      isLight = _ref2$isLight === void 0 ? false : _ref2$isLight,
+      _ref2$placement = _ref2.placement,
+      placement = _ref2$placement === void 0 ? "top" : _ref2$placement,
+      _ref2$TransitionCompo = _ref2.TransitionComponent,
+      TransitionComponent = _ref2$TransitionCompo === void 0 ? TooltipAnimation : _ref2$TransitionCompo,
+      popperTooltipStyle = _ref2.popperTooltipStyle,
+      popperTooltipClassName = _ref2.popperTooltipClassName,
+      disable = _ref2.disable;
+
+  var _useLayerContext = useLayerContext(),
+      zIndex = _useLayerContext.zIndex;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      open = _useState2[0],
+      setOpen = _useState2[1];
+
+  var _useState3 = useState(),
+      _useState4 = _slicedToArray(_useState3, 2),
+      childNode = _useState4[0],
+      setChildNode = _useState4[1];
+
+  var handleEnter = function handleEnter(event) {
+    var childrenProps = children.props;
+
+    if (event.type === "mouseover" && childrenProps.onMouseOver) {
+      childrenProps.onMouseOver(event);
+    }
+
+    childNode && childNode.removeAttribute("title");
+    setOpen(true);
+  };
+
+  var handleLeave = function handleLeave(event) {
+    var childrenProps = children.props;
+
+    if (event.type === "mouseleave" && childrenProps.onMouseLeave && event.currentTarget === childNode) {
+      childrenProps.onMouseLeave(event);
+    }
+
+    setOpen(false);
+  };
+
+  var handleOwnRef = useForkRef(children.ref, ref);
+  var handleRef = useForkRef(setChildNode, handleOwnRef);
+  var childrenProps = {
+    onMouseOver: handleEnter,
+    onMouseLeave: handleLeave,
+    ref: handleRef
+  };
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/React.cloneElement(children, childrenProps), !disable && /*#__PURE__*/jsx(Portal, {
+      children: /*#__PURE__*/jsx(Popper, {
+        anchorEl: childNode,
+        open: childNode ? open : false,
+        placement: placement,
+        transition: true,
+        className: popperTooltipClassName,
+        style: _objectSpread({
+          zIndex: zIndex
+        }, popperTooltipStyle),
+        role: "tooltip",
+        children: function children(_ref3) {
+          var _ref3$transitionProps = _ref3.transitionProps,
+              transitionProps = _ref3$transitionProps === void 0 ? {} : _ref3$transitionProps;
+          return /*#__PURE__*/jsx(TransitionComponent, _objectSpread(_objectSpread({}, transitionProps), {}, {
+            style: style,
+            children: /*#__PURE__*/jsx(StyledTooltip, {
+              className: classnames("c-tooltip-ds", className),
+              $isLight: isLight,
+              children: title
+            })
+          }));
+        }
+      })
+    })]
+  });
+});
+Tooltip.displayName = "Tooltip";
+
+export { Tooltip };
+//# sourceMappingURL=Tooltip.js.map

package/dist/esm/components/Tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\n  ReactElement,\n  useState,\n  CSSProperties,\n  MouseEvent,\n  forwardRef,\n  Ref,\n  FC,\n} from \"react\";\nimport classnames from \"classnames\";\nimport { Popper, Placement } from \"../Popper\";\nimport { FromElement } from \"../Transitions/FromElement\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { TransitionProps } from \"../Transitions\";\nimport { Portal, useLayerContext } from \"../../helpers\";\nimport { StyledTooltip } from \"./Styles\";\n\ninterface ElementWithRef<T> extends ReactElement {\n  ref?: Ref<T>;\n}\n\ninterface ITooltipProps {\n  /** Children element. */\n  children: ElementWithRef<HTMLElement>;\n  /** Title element. */\n  title: ReactElement | string;\n  /** Applies passed styles */\n  style?: CSSProperties;\n  /** Applies passed classes */\n  className?: string;\n  /** Open */\n  open?: boolean;\n  /** Placement */\n  placement?: Placement;\n  /** Transition component */\n  TransitionComponent?: React.FC<TransitionProps>;\n  /** Light tooltip */\n  isLight?: boolean;\n  /** Popper Tooltip style */\n  popperTooltipStyle?: CSSProperties;\n  /** Popper Tooltip class name*/\n  popperTooltipClassName?: string;\n  /** Remove tooltip */\n  disable?: boolean;\n}\n\ninterface ITooltipAnimation extends TransitionProps {\n  children: ReactElement;\n}\n\nconst TooltipAnimation: FC<ITooltipAnimation> = ({ children, ...props }) => {\n  return (\n    <FromElement timeout={0} {...props}>\n      {children}\n    </FromElement>\n  );\n};\n\nexport const Tooltip = forwardRef<HTMLElement, ITooltipProps>(\n  (\n    {\n      children,\n      title,\n      className,\n      style,\n      isLight = false,\n      placement = \"top\",\n      TransitionComponent = TooltipAnimation,\n      popperTooltipStyle,\n      popperTooltipClassName,\n      disable,\n    },\n    ref\n  ) => {\n    const { zIndex } = useLayerContext();\n    const [open, setOpen] = useState(false);\n    const [childNode, setChildNode] = useState<HTMLElement | null>();\n\n    const handleEnter = (event: MouseEvent<HTMLElement>): void => {\n      const childrenProps = children.props;\n\n      if (event.type === \"mouseover\" && childrenProps.onMouseOver) {\n        childrenProps.onMouseOver(event);\n      }\n\n      childNode && childNode.removeAttribute(\"title\");\n\n      setOpen(true);\n    };\n\n    const handleLeave = (event: MouseEvent<HTMLElement>): void => {\n      const childrenProps = children.props;\n\n      if (\n        event.type === \"mouseleave\" &&\n        childrenProps.onMouseLeave &&\n        event.currentTarget === childNode\n      ) {\n        childrenProps.onMouseLeave(event);\n      }\n\n      setOpen(false);\n    };\n\n    const handleOwnRef = useForkRef(children.ref, ref);\n    const handleRef = useForkRef(setChildNode, handleOwnRef);\n\n    const childrenProps = {\n      onMouseOver: handleEnter,\n      onMouseLeave: handleLeave,\n      ref: handleRef,\n    };\n\n    return (\n      <>\n        {React.cloneElement(children, childrenProps)}\n        {!disable && (\n          <Portal>\n            <Popper\n              anchorEl={childNode}\n              open={childNode ? open : false}\n              placement={placement}\n              transition\n              className={popperTooltipClassName}\n              style={{ zIndex, ...popperTooltipStyle }}\n              role=\"tooltip\"\n            >\n              {({ transitionProps = {} }): ReactElement => (\n                <TransitionComponent {...transitionProps} style={style}>\n                  <StyledTooltip\n                    className={classnames(\"c-tooltip-ds\", className)}\n                    $isLight={isLight}\n                  >\n                    {title}\n                  </StyledTooltip>\n                </TransitionComponent>\n              )}\n            </Popper>\n          </Portal>\n        )}\n      </>\n    );\n  }\n);\n\nTooltip.displayName = \"Tooltip\";\n"],"names":["TooltipAnimation","children","props","_jsx","Tooltip","forwardRef","ref","title","className","style","isLight","placement","TransitionComponent","popperTooltipStyle","popperTooltipClassName","disable","useLayerContext","zIndex","useState","open","setOpen","childNode","setChildNode","handleEnter","event","childrenProps","type","onMouseOver","removeAttribute","handleLeave","onMouseLeave","currentTarget","handleOwnRef","useForkRef","handleRef","_jsxs","React","cloneElement","transitionProps","classnames","displayName"],"mappings":"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"}

package/dist/esm/components/Transitions/Fade/Fade.js

@@ -0,0 +1,58 @@
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import { cloneElement } from 'react';
+import { Transition } from 'react-transition-group';
+import { jsx } from 'react/jsx-runtime';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+var defaultStyle = function defaultStyle(duration) {
+  return {
+    transition: "all ".concat(duration, "ms ease-in-out"),
+    opacity: 0
+  };
+};
+
+var transitionStyles = {
+  entering: {
+    opacity: 1
+  },
+  entered: {
+    opacity: 1
+  },
+  exiting: {
+    opacity: 0
+  },
+  exited: {
+    opacity: 0
+  }
+};
+var Fade = function Fade(_ref) {
+  var _ref$in = _ref.in,
+      inProp = _ref$in === void 0 ? false : _ref$in,
+      onEnter = _ref.onEnter,
+      onExited = _ref.onExited,
+      _children = _ref.children,
+      style = _ref.style,
+      _ref$timeout = _ref.timeout,
+      timeout = _ref$timeout === void 0 ? 500 : _ref$timeout;
+  return /*#__PURE__*/jsx(Transition, {
+    appear: true,
+    in: inProp,
+    timeout: timeout,
+    onEnter: onEnter,
+    onExited: onExited,
+    children: function children(state) {
+      return /*#__PURE__*/cloneElement(_children, {
+        style: _objectSpread(_objectSpread(_objectSpread(_objectSpread({
+          visibility: state === "exited" && !inProp ? "hidden" : undefined
+        }, defaultStyle(timeout)), transitionStyles[state]), style), _children.props.style)
+      });
+    }
+  });
+};
+Fade.displayName = "Fade";
+
+export { Fade };
+//# sourceMappingURL=Fade.js.map

package/dist/esm/components/Transitions/Fade/Fade.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Fade.js","sources":["../../../../../src/components/Transitions/Fade/Fade.tsx"],"sourcesContent":["import React, { FC, ReactElement, cloneElement } from \"react\";\nimport { Transition } from \"react-transition-group\";\nimport { TransitionProps } from \"../types\";\n\ninterface IFadeProps extends Omit<TransitionProps, \"timeout\"> {\n  children: ReactElement;\n  timeout?: number;\n}\n\nconst defaultStyle = (\n  duration: number\n): Partial<{ transition: string; opacity: number }> => ({\n  transition: `all ${duration}ms ease-in-out`,\n  opacity: 0,\n});\n\nconst transitionStyles = {\n  entering: { opacity: 1 },\n  entered: { opacity: 1 },\n  exiting: { opacity: 0 },\n  exited: { opacity: 0 },\n};\n\nexport const Fade: FC<IFadeProps> = ({\n  in: inProp = false,\n  onEnter,\n  onExited,\n  children,\n  style,\n  timeout = 500,\n}) => (\n  <Transition\n    appear\n    in={inProp}\n    timeout={timeout}\n    onEnter={onEnter}\n    onExited={onExited}\n  >\n    {(state): ReactElement => {\n      return cloneElement(children, {\n        style: {\n          visibility: state === \"exited\" && !inProp ? \"hidden\" : undefined,\n          ...defaultStyle(timeout),\n          ...transitionStyles[state],\n          ...style,\n          ...children.props.style,\n        },\n      });\n    }}\n  </Transition>\n);\n\nFade.displayName = \"Fade\";\n"],"names":["defaultStyle","duration","transition","opacity","transitionStyles","entering","entered","exiting","exited","Fade","in","inProp","onEnter","onExited","children","style","timeout","_jsx","state","cloneElement","visibility","undefined","props","displayName"],"mappings":";;;;;;;;;AASA,IAAMA,YAAY,GAAG,SAAfA,YAAe,CACnBC,QADmB;AAAA,SAEmC;AACtDC,IAAAA,UAAU,gBAASD,QAAT,mBAD4C;AAEtDE,IAAAA,OAAO,EAAE;AAF6C,GAFnC;AAAA,CAArB;;AAOA,IAAMC,gBAAgB,GAAG;AACvBC,EAAAA,QAAQ,EAAE;AAAEF,IAAAA,OAAO,EAAE;AAAX,GADa;AAEvBG,EAAAA,OAAO,EAAE;AAAEH,IAAAA,OAAO,EAAE;AAAX,GAFc;AAGvBI,EAAAA,OAAO,EAAE;AAAEJ,IAAAA,OAAO,EAAE;AAAX,GAHc;AAIvBK,EAAAA,MAAM,EAAE;AAAEL,IAAAA,OAAO,EAAE;AAAX;AAJe,CAAzB;IAOaM,IAAoB,GAAG,SAAvBA,IAAuB;AAAA,qBAClCC,EADkC;AAAA,MAC9BC,MAD8B,wBACrB,KADqB;AAAA,MAElCC,OAFkC,QAElCA,OAFkC;AAAA,MAGlCC,QAHkC,QAGlCA,QAHkC;AAAA,MAIlCC,SAJkC,QAIlCA,QAJkC;AAAA,MAKlCC,KALkC,QAKlCA,KALkC;AAAA,0BAMlCC,OANkC;AAAA,MAMlCA,OANkC,6BAMxB,GANwB;AAAA,sBAQlCC,IAAC,UAAD;AACE,IAAA,MAAM,MADR;AAEE,IAAA,EAAE,EAAEN,MAFN;AAGE,IAAA,OAAO,EAAEK,OAHX;AAIE,IAAA,OAAO,EAAEJ,OAJX;AAKE,IAAA,QAAQ,EAAEC,QALZ;AAAA,cAOG,kBAACK,KAAD,EAAyB;AACxB,0BAAOC,YAAY,CAACL,SAAD,EAAW;AAC5BC,QAAAA,KAAK;AACHK,UAAAA,UAAU,EAAEF,KAAK,KAAK,QAAV,IAAsB,CAACP,MAAvB,GAAgC,QAAhC,GAA2CU;AADpD,WAEArB,YAAY,CAACgB,OAAD,CAFZ,GAGAZ,gBAAgB,CAACc,KAAD,CAHhB,GAIAH,KAJA,GAKAD,SAAQ,CAACQ,KAAT,CAAeP,KALf;AADuB,OAAX,CAAnB;AASD;AAjBH,IARkC;AAAA;AA6BpCN,IAAI,CAACc,WAAL,GAAmB,MAAnB;;;;"}