npm - @activecollab/components - Versions diffs - 1.0.261 → 1.0.262 - Mend

@activecollab/components 1.0.261 → 1.0.262

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (25) hide show

package/dist/cjs/components/CommandPallete/CommandPallete.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandPallete.js","names":["CommandPallete","children","onChangeSearch","search","commands","mode","setMode","rest","handleChange","e","target","value","length","map","command","visible","title","renderIcon","Children","toArray","child","item","React","cloneElement","displayName","List","CommandPalleteList","Item","CommandPalleteItem"],"sources":["../../../../src/components/CommandPallete/CommandPallete.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n Children,\n PropsWithChildren,\n ReactElement,\n ReactNode,\n} from \"react\";\nimport { Dialog, DialogProps } from \"../Dialog\";\n\nimport {\n StyledCommandPallete,\n StyledCommandPalleteWrapper,\n} from \"./CommandPallete.styles\";\nimport { CommandPalleteHeader } from \"./CommandPalleteHeader\";\nimport { CommandPalleteItem } from \"./CommandPalleteItem\";\nimport {\n CommandPalleteList,\n CommandPalleteListProps,\n} from \"./CommandPalleteList\";\nimport { ModeContextProvider } from \"./context/ModeContext\";\n\~~n// eslint-disable-next-line @typescript-eslint/no-empty-interface\~~nexport interface CommandPalleteProps extends DialogProps {\n onChangeSearch: (search: string) => void;\n search: string;\n commands: { visible: boolean; title: string; renderIcon: () => ReactNode }[];\n mode: string;\n setMode: (value: string) => void;\n loading?: boolean;\n}\n\nexport const CommandPallete = ({\n children,\n onChangeSearch,\n search,\n commands,\n mode,\n setMode,\n ...rest\n}: PropsWithChildren<CommandPalleteProps>) => {\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChangeSearch(e.target.value);\n };\n\n return (\n <Dialog {...rest}>\n <StyledCommandPallete>\n <ModeContextProvider value={{ mode, setMode }}>\n <CommandPalleteHeader\n search={search}\n handleChange={handleChange}\n onChangeSearch={onChangeSearch}\n />\n </ModeContextProvider>\n <StyledCommandPalleteWrapper>\n {/* COMMANDS /}\n {search.length > 0 ? (\n <CommandPalleteList visible={true}>\n {commands.map((command) => {\n if (command.visible) {\n return (\n <CommandPalleteItem\n className=\"cp-item cp-command\"\n title={command.title}\n key={command.title}\n renderIcon={command.renderIcon}\n />\n );\n }\n return null;\n })}\n </CommandPalleteList>\n ) : null}\n {/ COMMANDS /}\n\n {/ LISTS AND ITEMS /}\n {Children.toArray(children).map((child) => {\n const item = child as ReactElement<CommandPalleteListProps>;\n return React.cloneElement(item, {});\n })}\n {/ LISTS AND ITEMS */}\n </StyledCommandPalleteWrapper>\n </StyledCommandPallete>\n </Dialog>\n );\n};\n\nCommandPallete.displayName = \"CommandPallete\";\n\nCommandPallete.List = CommandPalleteList;\nCommandPallete.Item = CommandPalleteItem;\n"],"mappings":";;;;;;;AAAA;AAOA;AAEA;AAIA;AACA;AACA;AAIA;AAA4D;AAAA;AAAA;AAAA;AAAA;~~AAYrD~~,IAAMA,cAAc,GAAG,SAAjBA,cAAc,OAQmB;EAAA,IAP5CC,QAAQ,QAARA,QAAQ;IACRC,cAAc,QAAdA,cAAc;IACdC,MAAM,QAANA,MAAM;IACNC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,OAAO,QAAPA,OAAO;IACJC,IAAI;EAEP,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,CAAgC,EAAK;IACzDP,cAAc,CAACO,CAAC,CAACC,MAAM,CAACC,KAAK,CAAC;EAChC,CAAC;EAED,oBACE,6BAAC,cAAM,EAAKJ,IAAI,eACd,6BAAC,oCAAoB,qBACnB,6BAAC,gCAAmB;IAAC,KAAK,EAAE;MAAEF,IAAI,EAAJA,IAAI;MAAEC,OAAO,EAAPA;IAAQ;EAAE,gBAC5C,6BAAC,0CAAoB;IACnB,MAAM,EAAEH,MAAO;IACf,YAAY,EAAEK,YAAa;IAC3B,cAAc,EAAEN;EAAe,EAC/B,CACkB,eACtB,6BAAC,2CAA2B,QAEzBC,MAAM,CAACS,MAAM,GAAG,CAAC,gBAChB,6BAAC,sCAAkB;IAAC,OAAO,EAAE;EAAK,GAC/BR,QAAQ,CAACS,GAAG,CAAC,UAACC,OAAO,EAAK;IACzB,IAAIA,OAAO,CAACC,OAAO,EAAE;MACnB,oBACE,6BAAC,sCAAkB;QACjB,SAAS,EAAC,oBAAoB;QAC9B,KAAK,EAAED,OAAO,CAACE,KAAM;QACrB,GAAG,EAAEF,OAAO,CAACE,KAAM;QACnB,UAAU,EAAEF,OAAO,CAACG;MAAW,EAC/B;IAEN;IACA,OAAO,IAAI;EACb,CAAC,CAAC,CACiB,GACnB,IAAI,EAIPC,eAAQ,CAACC,OAAO,CAAClB,QAAQ,CAAC,CAACY,GAAG,CAAC,UAACO,KAAK,EAAK;IACzC,IAAMC,IAAI,GAAGD,KAA8C;IAC3D,oBAAOE,cAAK,CAACC,YAAY,CAACF,IAAI,EAAE,CAAC,CAAC,CAAC;EACrC,CAAC,CAAC,CAE0B,CACT,CAChB;AAEb,CAAC;AAAC;AAEFrB,cAAc,CAACwB,WAAW,GAAG,gBAAgB;AAE7CxB,cAAc,CAACyB,IAAI,GAAGC,sCAAkB;AACxC1B,cAAc,CAAC2B,IAAI,GAAGC,sCAAkB"}
1	+ {"version":3,"file":"CommandPallete.js","names":["CommandPallete","children","onChangeSearch","search","commands","mode","setMode","rest","handleChange","e","target","value","length","map","command","visible","title","renderIcon","Children","toArray","child","item","React","cloneElement","displayName","List","CommandPalleteList","Item","CommandPalleteItem"],"sources":["../../../../src/components/CommandPallete/CommandPallete.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n Children,\n PropsWithChildren,\n ReactElement,\n ReactNode,\n} from \"react\";\nimport { Dialog, DialogProps } from \"../Dialog\";\n\nimport {\n StyledCommandPallete,\n StyledCommandPalleteWrapper,\n} from \"./CommandPallete.styles\";\nimport { CommandPalleteHeader } from \"./CommandPalleteHeader\";\nimport { CommandPalleteItem } from \"./CommandPalleteItem\";\nimport {\n CommandPalleteList,\n CommandPalleteListProps,\n} from \"./CommandPalleteList\";\nimport { ModeContextProvider } from \"./context/ModeContext\";\n\nexport interface CommandPalleteProps extends DialogProps {\n onChangeSearch: (search: string) => void;\n search: string;\n commands: { visible: boolean; title: string; renderIcon: () => ReactNode }[];\n mode: string;\n setMode: (value: string) => void;\n loading?: boolean;\n}\n\nexport const CommandPallete = ({\n children,\n onChangeSearch,\n search,\n commands,\n mode,\n setMode,\n ...rest\n}: PropsWithChildren<CommandPalleteProps>) => {\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChangeSearch(e.target.value);\n };\n\n return (\n <Dialog {...rest}>\n <StyledCommandPallete>\n <ModeContextProvider value={{ mode, setMode }}>\n <CommandPalleteHeader\n search={search}\n handleChange={handleChange}\n onChangeSearch={onChangeSearch}\n />\n </ModeContextProvider>\n <StyledCommandPalleteWrapper>\n {/* COMMANDS /}\n {search.length > 0 ? (\n <CommandPalleteList visible={true}>\n {commands.map((command) => {\n if (command.visible) {\n return (\n <CommandPalleteItem\n className=\"cp-item cp-command\"\n title={command.title}\n key={command.title}\n renderIcon={command.renderIcon}\n />\n );\n }\n return null;\n })}\n </CommandPalleteList>\n ) : null}\n {/ COMMANDS /}\n\n {/ LISTS AND ITEMS /}\n {Children.toArray(children).map((child) => {\n const item = child as ReactElement<CommandPalleteListProps>;\n return React.cloneElement(item, {});\n })}\n {/ LISTS AND ITEMS */}\n </StyledCommandPalleteWrapper>\n </StyledCommandPallete>\n </Dialog>\n );\n};\n\nCommandPallete.displayName = \"CommandPallete\";\n\nCommandPallete.List = CommandPalleteList;\nCommandPallete.Item = CommandPalleteItem;\n"],"mappings":";;;;;;;AAAA;AAOA;AAEA;AAIA;AACA;AACA;AAIA;AAA4D;AAAA;AAAA;AAAA;AAAA;AAWrD,IAAMA,cAAc,GAAG,SAAjBA,cAAc,OAQmB;EAAA,IAP5CC,QAAQ,QAARA,QAAQ;IACRC,cAAc,QAAdA,cAAc;IACdC,MAAM,QAANA,MAAM;IACNC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,OAAO,QAAPA,OAAO;IACJC,IAAI;EAEP,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,CAAgC,EAAK;IACzDP,cAAc,CAACO,CAAC,CAACC,MAAM,CAACC,KAAK,CAAC;EAChC,CAAC;EAED,oBACE,6BAAC,cAAM,EAAKJ,IAAI,eACd,6BAAC,oCAAoB,qBACnB,6BAAC,gCAAmB;IAAC,KAAK,EAAE;MAAEF,IAAI,EAAJA,IAAI;MAAEC,OAAO,EAAPA;IAAQ;EAAE,gBAC5C,6BAAC,0CAAoB;IACnB,MAAM,EAAEH,MAAO;IACf,YAAY,EAAEK,YAAa;IAC3B,cAAc,EAAEN;EAAe,EAC/B,CACkB,eACtB,6BAAC,2CAA2B,QAEzBC,MAAM,CAACS,MAAM,GAAG,CAAC,gBAChB,6BAAC,sCAAkB;IAAC,OAAO,EAAE;EAAK,GAC/BR,QAAQ,CAACS,GAAG,CAAC,UAACC,OAAO,EAAK;IACzB,IAAIA,OAAO,CAACC,OAAO,EAAE;MACnB,oBACE,6BAAC,sCAAkB;QACjB,SAAS,EAAC,oBAAoB;QAC9B,KAAK,EAAED,OAAO,CAACE,KAAM;QACrB,GAAG,EAAEF,OAAO,CAACE,KAAM;QACnB,UAAU,EAAEF,OAAO,CAACG;MAAW,EAC/B;IAEN;IACA,OAAO,IAAI;EACb,CAAC,CAAC,CACiB,GACnB,IAAI,EAIPC,eAAQ,CAACC,OAAO,CAAClB,QAAQ,CAAC,CAACY,GAAG,CAAC,UAACO,KAAK,EAAK;IACzC,IAAMC,IAAI,GAAGD,KAA8C;IAC3D,oBAAOE,cAAK,CAACC,YAAY,CAACF,IAAI,EAAE,CAAC,CAAC,CAAC;EACrC,CAAC,CAAC,CAE0B,CACT,CAChB;AAEb,CAAC;AAAC;AAEFrB,cAAc,CAACwB,WAAW,GAAG,gBAAgB;AAE7CxB,cAAc,CAACyB,IAAI,GAAGC,sCAAkB;AACxC1B,cAAc,CAAC2B,IAAI,GAAGC,sCAAkB"}

package/dist/cjs/components/CommandPallete/CommandPalleteHeader.js CHANGED Viewed

@@ -54,9 +54,7 @@ var CommandPalleteHeader = function CommandPalleteHeader(_ref) {
     title: "Search by ID",
     placement: "top"
   }, /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
-    variant: "text gray"
-  }, /*#__PURE__*/_react.default.createElement(_Icons.HashtagIcon, {
-    onKeyDown: function onKeyDown(e) {
+    onKeyPress: function onKeyPress(e) {
       if (e.key === "Enter") {
         setMode("id");
         clearInput();
@@ -67,13 +65,14 @@ var CommandPalleteHeader = function CommandPalleteHeader(_ref) {
       setMode("id");
       clearInput();
       focusInput();
-    }
-  }))) : null, search.length > 0 || mode === "id" ? /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
+    },
+    variant: "text gray"
+  }, /*#__PURE__*/_react.default.createElement(_Icons.HashtagIcon, null))) : null, search.length > 0 || mode === "id" ? /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
     title: mode === "id" ? "Close ID mode" : "Clear",
     placement: "top"
   }, /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
     variant: "text gray",
-    onKeyDown: function onKeyDown(e) {
+    onKeyPress: function onKeyPress(e) {
       if (e.key === "Enter") {
         setMode("default");
         clearInput();

package/dist/cjs/components/CommandPallete/CommandPalleteHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandPalleteHeader.js","names":["CommandPalleteHeader","search","handleChange","loading","onChangeSearch","inputRef","useRef","useModeContext","mode","setMode","focusInput","current","focus","clearInput","value","marginRight","length","e","key","displayName"],"sources":["../../../../src/components/CommandPallete/CommandPalleteHeader.tsx"],"sourcesContent":["import React, { ChangeEvent, useRef } from \"react\";\nimport { IconButton } from \"../IconButton\";\nimport { CloseIcon, HashtagIcon, SearchLargeIcon } from \"../Icons\";\nimport { SpinnerLoader } from \"../Loaders\";\nimport { Tooltip } from \"../Tooltip\";\nimport {\n StyledActionWrapper,\n StyledCommandPalleteHeader,\n StyledInput,\n StyledParameter,\n StyledSearchIcon,\n} from \"./CommandPallete.styles\";\nimport { useModeContext } from \"./context/ModeContext\";\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface CommandPalleteHeaderProps {\n search: string;\n handleChange: (e: ChangeEvent<HTMLInputElement>) => void;\n loading?: boolean;\n onChangeSearch: (value: string) => void;\n}\n\nexport const CommandPalleteHeader = ({\n search,\n handleChange,\n loading = false,\n onChangeSearch,\n}: CommandPalleteHeaderProps) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const { mode, setMode } = useModeContext();\n\n const focusInput = () => {\n if (inputRef && inputRef.current) {\n inputRef.current.focus();\n }\n };\n\n const clearInput = () => {\n if (inputRef && inputRef.current) {\n inputRef.current.value = \"\";\n onChangeSearch(\"\");\n }\n };\n\n return (\n <StyledCommandPalleteHeader className=\"cp-header\">\n <StyledSearchIcon>\n <SearchLargeIcon />\n </StyledSearchIcon>\n\n {mode === \"id\" ? <StyledParameter>ID#:</StyledParameter> : null}\n\n <StyledInput\n ref={inputRef}\n autoFocus\n type=\"text\"\n autoCapitalize=\"none\"\n autoComplete=\"none\"\n value={search}\n onChange={handleChange}\n placeholder={mode === \"id\" ? \"22\" : \"Search or jump to\"}\n />\n\n <StyledActionWrapper>\n {loading ? <SpinnerLoader style={{ marginRight: \"4px\" }} /> : null}\n\n {mode !== \"id\" && search.length === 0 ? (\n <Tooltip title=\"Search by ID\" placement=\"top\">\n <IconButton ~~variant=\"text gray~~\~~">\~~n ~~<HashtagIcon\n onKeyDown~~={(e) => {\n if (e.key === \"Enter\") {\n setMode(\"id\");\n clearInput();\n focusInput();\n }\n }}\n onClick={() => {\n setMode(\"id\");\n clearInput();\n focusInput();\n }}\n />\n </IconButton>\n </Tooltip>\n ) : null}\n\n {search.length > 0 \|\| mode === \"id\" ? (\n <Tooltip\n title={mode === \"id\" ? \"Close ID mode\" : \"Clear\"}\n placement=\"top\"\n >\n <IconButton\n variant=\"text gray\"\n ~~onKeyDown~~={(e) => {\n if (e.key === \"Enter\") {\n setMode(\"default\");\n clearInput();\n focusInput();\n }\n }}\n onClick={() => {\n setMode(\"default\");\n clearInput();\n focusInput();\n }}\n >\n <CloseIcon />\n </IconButton>\n </Tooltip>\n ) : null}\n </StyledActionWrapper>\n </StyledCommandPalleteHeader>\n );\n};\n\nCommandPalleteHeader.displayName = \"CommandPalleteItem\";\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAOA;AAAuD;AAAA;AAUhD,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAoB,OAKA;EAAA,IAJ/BC,MAAM,QAANA,MAAM;IACNC,YAAY,QAAZA,YAAY;IAAA,oBACZC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IACfC,cAAc,QAAdA,cAAc;EAEd,IAAMC,QAAQ,GAAG,IAAAC,aAAM,EAAmB,IAAI,CAAC;EAC/C,sBAA0B,IAAAC,2BAAc,GAAE;IAAlCC,IAAI,mBAAJA,IAAI;IAAEC,OAAO,mBAAPA,OAAO;EAErB,IAAMC,UAAU,GAAG,SAAbA,UAAU,GAAS;IACvB,IAAIL,QAAQ,IAAIA,QAAQ,CAACM,OAAO,EAAE;MAChCN,QAAQ,CAACM,OAAO,CAACC,KAAK,EAAE;IAC1B;EACF,CAAC;EAED,IAAMC,UAAU,GAAG,SAAbA,UAAU,GAAS;IACvB,IAAIR,QAAQ,IAAIA,QAAQ,CAACM,OAAO,EAAE;MAChCN,QAAQ,CAACM,OAAO,CAACG,KAAK,GAAG,EAAE;MAC3BV,cAAc,CAAC,EAAE,CAAC;IACpB;EACF,CAAC;EAED,oBACE,6BAAC,0CAA0B;IAAC,SAAS,EAAC;EAAW,gBAC/C,6BAAC,gCAAgB,qBACf,6BAAC,sBAAe,OAAG,CACF,EAElBI,IAAI,KAAK,IAAI,gBAAG,6BAAC,+BAAe,eAAuB,GAAG,IAAI,eAE/D,6BAAC,2BAAW;IACV,GAAG,EAAEH,QAAS;IACd,SAAS;IACT,IAAI,EAAC,MAAM;IACX,cAAc,EAAC,MAAM;IACrB,YAAY,EAAC,MAAM;IACnB,KAAK,EAAEJ,MAAO;IACd,QAAQ,EAAEC,YAAa;IACvB,WAAW,EAAEM,IAAI,KAAK,IAAI,GAAG,IAAI,GAAG;EAAoB,EACxD,eAEF,6BAAC,mCAAmB,QACjBL,OAAO,gBAAG,6BAAC,sBAAa;IAAC,KAAK,EAAE;MAAEY,WAAW,EAAE;IAAM;EAAE,EAAG,GAAG,IAAI,EAEjEP,IAAI,KAAK,IAAI,IAAIP,MAAM,CAACe,MAAM,KAAK,CAAC,gBACnC,6BAAC,gBAAO;IAAC,KAAK,EAAC,cAAc;IAAC,SAAS,EAAC;EAAK,gBAC3C,6BAAC,sBAAU;~~IAAC~~,~~OAAO~~,~~EAAC;EAAW,gBAC7B,6BAAC,kBAAW;IACV,SAAS,~~EAAE,~~mBAACC~~,CAAC,EAAK;~~MAChB~~,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAE;QACrBT,OAAO,CAAC,IAAI,CAAC;QACbI,UAAU,EAAE;QACZH,UAAU,EAAE;MACd;IACF,CAAE;IACF,OAAO,EAAE,mBAAM;MACbD,OAAO,CAAC,IAAI,CAAC;MACbI,UAAU,EAAE;MACZH,UAAU,EAAE;IACd;~~EAAE~~,~~EACF~~,~~CACS~~,CACL,GACR,IAAI,EAEPT,MAAM,CAACe,MAAM,GAAG,CAAC,IAAIR,IAAI,KAAK,IAAI,gBACjC,6BAAC,gBAAO;IACN,KAAK,EAAEA,IAAI,KAAK,IAAI,GAAG,eAAe,GAAG,OAAQ;IACjD,SAAS,EAAC;EAAK,gBAEf,6BAAC,sBAAU;IACT,OAAO,EAAC,WAAW;IACnB,~~SAAS~~,EAAE,~~mBAACS~~,CAAC,EAAK;~~MAChB~~,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAE;QACrBT,OAAO,CAAC,SAAS,CAAC;QAClBI,UAAU,EAAE;QACZH,UAAU,EAAE;MACd;IACF,CAAE;IACF,OAAO,EAAE,mBAAM;MACbD,OAAO,CAAC,SAAS,CAAC;MAClBI,UAAU,EAAE;MACZH,UAAU,EAAE;IACd;EAAE,gBAEF,6BAAC,gBAAS,OAAG,CACF,CACL,GACR,IAAI,CACY,CACK;AAEjC,CAAC;AAAC;AAEFV,oBAAoB,CAACmB,WAAW,GAAG,oBAAoB"}
1	+ {"version":3,"file":"CommandPalleteHeader.js","names":["CommandPalleteHeader","search","handleChange","loading","onChangeSearch","inputRef","useRef","useModeContext","mode","setMode","focusInput","current","focus","clearInput","value","marginRight","length","e","key","displayName"],"sources":["../../../../src/components/CommandPallete/CommandPalleteHeader.tsx"],"sourcesContent":["import React, { ChangeEvent, useRef } from \"react\";\nimport { IconButton } from \"../IconButton\";\nimport { CloseIcon, HashtagIcon, SearchLargeIcon } from \"../Icons\";\nimport { SpinnerLoader } from \"../Loaders\";\nimport { Tooltip } from \"../Tooltip\";\nimport {\n StyledActionWrapper,\n StyledCommandPalleteHeader,\n StyledInput,\n StyledParameter,\n StyledSearchIcon,\n} from \"./CommandPallete.styles\";\nimport { useModeContext } from \"./context/ModeContext\";\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface CommandPalleteHeaderProps {\n search: string;\n handleChange: (e: ChangeEvent<HTMLInputElement>) => void;\n loading?: boolean;\n onChangeSearch: (value: string) => void;\n}\n\nexport const CommandPalleteHeader = ({\n search,\n handleChange,\n loading = false,\n onChangeSearch,\n}: CommandPalleteHeaderProps) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const { mode, setMode } = useModeContext();\n\n const focusInput = () => {\n if (inputRef && inputRef.current) {\n inputRef.current.focus();\n }\n };\n\n const clearInput = () => {\n if (inputRef && inputRef.current) {\n inputRef.current.value = \"\";\n onChangeSearch(\"\");\n }\n };\n\n return (\n <StyledCommandPalleteHeader className=\"cp-header\">\n <StyledSearchIcon>\n <SearchLargeIcon />\n </StyledSearchIcon>\n\n {mode === \"id\" ? <StyledParameter>ID#:</StyledParameter> : null}\n\n <StyledInput\n ref={inputRef}\n autoFocus\n type=\"text\"\n autoCapitalize=\"none\"\n autoComplete=\"none\"\n value={search}\n onChange={handleChange}\n placeholder={mode === \"id\" ? \"22\" : \"Search or jump to\"}\n />\n\n <StyledActionWrapper>\n {loading ? <SpinnerLoader style={{ marginRight: \"4px\" }} /> : null}\n\n {mode !== \"id\" && search.length === 0 ? (\n <Tooltip title=\"Search by ID\" placement=\"top\">\n <IconButton\n onKeyPress={(e) => {\n if (e.key === \"Enter\") {\n setMode(\"id\");\n clearInput();\n focusInput();\n }\n }}\n onClick={() => {\n setMode(\"id\");\n clearInput();\n focusInput();\n }}\n variant=\"text gray\"\n >\n <HashtagIcon />\n </IconButton>\n </Tooltip>\n ) : null}\n\n {search.length > 0 \|\| mode === \"id\" ? (\n <Tooltip\n title={mode === \"id\" ? \"Close ID mode\" : \"Clear\"}\n placement=\"top\"\n >\n <IconButton\n variant=\"text gray\"\n onKeyPress={(e) => {\n if (e.key === \"Enter\") {\n setMode(\"default\");\n clearInput();\n focusInput();\n }\n }}\n onClick={() => {\n setMode(\"default\");\n clearInput();\n focusInput();\n }}\n >\n <CloseIcon />\n </IconButton>\n </Tooltip>\n ) : null}\n </StyledActionWrapper>\n </StyledCommandPalleteHeader>\n );\n};\n\nCommandPalleteHeader.displayName = \"CommandPalleteItem\";\n"],"mappings":"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"}

package/dist/cjs/components/Links/Link.js CHANGED Viewed

@@ -48,7 +48,9 @@ var Link = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     variant: variant,
     size: size,
     $iconOnly: children instanceof Object && !(children instanceof Array)
-  }, args), children instanceof Array ? /*#__PURE__*/_react.default.createElement(_Styles.StyledLinkElements, {
+  }, args, {
+    tabIndex: 1
+  }), children instanceof Array ? /*#__PURE__*/_react.default.createElement(_Styles.StyledLinkElements, {
     className: "c-link__elements"
   }, children.map(function (value, index) {
     return value ? /*#__PURE__*/_react.default.createElement(_Styles.StyledLinkElement, {

package/dist/cjs/components/Links/Link.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Link.js","names":["Link","forwardRef","ref","as","children","variant","size","disabled","className","args","Component","classNames","Object","Array","map","value","index","displayName"],"sources":["../../../../src/components/Links/Link.tsx"],"sourcesContent":["import React, { BaseHTMLAttributes, ReactNode, forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport { StyledLink, StyledLinkElement, StyledLinkElements } from \"./Styles\";\nimport {\n PolymorphicComponentPropsWithRef,\n PolymorphicRef,\n} from \"../../utils/types\";\n\nexport interface ILinkProps extends BaseHTMLAttributes<HTMLElement> {\n /** Children type of node or string /\n children: ReactNode \| string;\n /* Variant Buttons /\n variant?:\n \| \"primary\"\n \| \"secondary\"\n \| \"tertiary\"\n \| \"option\"\n \| \"contained\"\n \| \"outlined\"\n \| \"text colored\"\n \| \"text gray\"\n \| \"dark transparent\"\n \| \"circle raised\";\n /* Button size can be big, medium or small /\n size?: \"big\" \| \"small\";\n /* Disabled prop /\n disabled?: boolean;\n /* CSS classes /\n className?: string;\n}\n\nexport type LinkProps<C extends React.ElementType> =\n PolymorphicComponentPropsWithRef<C, ILinkProps>;\n\nexport type LinkComponent = <C extends React.ElementType = \"a\">(\n props: LinkProps<C>\n) => React.ReactElement \| null;\n\n/\n Link component\n */\nexport const Link: LinkComponent & { displayName?: string } = forwardRef(\n <C extends React.ElementType = \"a\">(\n {\n as,\n children,\n variant = \"contained\",\n size,\n disabled = false,\n className,\n ...args\n }: LinkProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const Component = as \|\| \"a\";\n\n return (\n <StyledLink\n ref={ref}\n as={Component}\n disabled={disabled}\n className={classNames(\"c-link\", className, {\n \"c-link--contained\": variant === \"primary\" \|\| variant === \"contained\",\n \"c-link--outlined\": variant === \"secondary\" \|\| variant === \"outlined\",\n \"c-link--text_colored\":\n variant === \"tertiary\" \|\| variant === \"text colored\",\n \"c-link--text_gray\": variant === \"option\" \|\| variant === \"text gray\",\n \"c-link--dark_transparent\": variant === \"dark transparent\",\n \"c-link--circle_raised\": variant === \"circle raised\",\n \"c-link--big\": size === \"big\",\n \"c-link--small\": size === \"small\",\n \"c-link--icon-only\":\n children instanceof Object && !(children instanceof Array),\n \"c-link--disabled\": disabled,\n })}\n variant={variant}\n size={size}\n $iconOnly={children instanceof Object && !(children instanceof Array)}\n {...args}\n >\n {children instanceof Array ? (\n <StyledLinkElements className=\"c-link__elements\">\n {children.map((value, index) =>\n value ? (\n <StyledLinkElement\n className=\"c-link__elements__element\"\n key={index}\n >\n {value}\n </StyledLinkElement>\n ) : null\n )}\n </StyledLinkElements>\n ) : (\n children\n )}\n </StyledLink>\n );\n }\n);\n\nLink.displayName = \"Link\";\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAA6E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;~~AAoC7E~~;AACA;AACA;AACO,IAAMA,IAA8C,gBAAG,IAAAC,iBAAU,EACtE,gBAUEC,GAAuB,EACpB;EAAA,IATDC,EAAE,QAAFA,EAAE;IACFC,QAAQ,QAARA,QAAQ;IAAA,oBACRC,OAAO;IAAPA,OAAO,6BAAG,WAAW;IACrBC,IAAI,QAAJA,IAAI;IAAA,qBACJC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAChBC,SAAS,QAATA,SAAS;IACNC,IAAI;EAIT,IAAMC,SAAS,GAAGP,EAAE,IAAI,GAAG;EAE3B,oBACE,6BAAC,kBAAU;IACT,GAAG,EAAED,GAAI;IACT,EAAE,EAAEQ,SAAU;IACd,QAAQ,EAAEH,QAAS;IACnB,SAAS,EAAE,IAAAI,mBAAU,EAAC,QAAQ,EAAEH,SAAS,EAAE;MACzC,mBAAmB,EAAEH,OAAO,KAAK,SAAS,IAAIA,OAAO,KAAK,WAAW;MACrE,kBAAkB,EAAEA,OAAO,KAAK,WAAW,IAAIA,OAAO,KAAK,UAAU;MACrE,sBAAsB,EACpBA,OAAO,KAAK,UAAU,IAAIA,OAAO,KAAK,cAAc;MACtD,mBAAmB,EAAEA,OAAO,KAAK,QAAQ,IAAIA,OAAO,KAAK,WAAW;MACpE,0BAA0B,EAAEA,OAAO,KAAK,kBAAkB;MAC1D,uBAAuB,EAAEA,OAAO,KAAK,eAAe;MACpD,aAAa,EAAEC,IAAI,KAAK,KAAK;MAC7B,eAAe,EAAEA,IAAI,KAAK,OAAO;MACjC,mBAAmB,EACjBF,QAAQ,YAAYQ,MAAM,IAAI,EAAER,QAAQ,YAAYS,KAAK,CAAC;MAC5D,kBAAkB,EAAEN;IACtB,CAAC,CAAE;IACH,OAAO,EAAEF,OAAQ;IACjB,IAAI,EAAEC,IAAK;IACX,SAAS,EAAEF,QAAQ,YAAYQ,MAAM,IAAI,EAAER,QAAQ,YAAYS,KAAK;EAAE,GAClEJ,IAAI,~~GAEPL~~,QAAQ,YAAYS,KAAK,gBACxB,6BAAC,0BAAkB;IAAC,SAAS,EAAC;EAAkB,GAC7CT,QAAQ,CAACU,GAAG,CAAC,UAACC,KAAK,EAAEC,KAAK;IAAA,OACzBD,KAAK,gBACH,6BAAC,yBAAiB;MAChB,SAAS,EAAC,2BAA2B;MACrC,GAAG,EAAEC;IAAM,GAEVD,KAAK,CACY,GAClB,IAAI;EAAA,EACT,CACkB,GAErBX,QACD,CACU;AAEjB,CAAC,CACF;AAAC;AAEFJ,IAAI,CAACiB,WAAW,GAAG,MAAM"}
1	+ {"version":3,"file":"Link.js","names":["Link","forwardRef","ref","as","children","variant","size","disabled","className","args","Component","classNames","Object","Array","map","value","index","displayName"],"sources":["../../../../src/components/Links/Link.tsx"],"sourcesContent":["import React, { BaseHTMLAttributes, ReactNode, forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport { StyledLink, StyledLinkElement, StyledLinkElements } from \"./Styles\";\nimport {\n PolymorphicComponentPropsWithRef,\n PolymorphicRef,\n} from \"../../utils/types\";\n\nexport interface ILinkProps extends BaseHTMLAttributes<HTMLElement> {\n /** Children type of node or string /\n children: ReactNode \| string;\n /* Variant Buttons /\n variant?:\n \| \"primary\"\n \| \"secondary\"\n \| \"tertiary\"\n \| \"option\"\n \| \"contained\"\n \| \"outlined\"\n \| \"text colored\"\n \| \"text gray\"\n \| \"dark transparent\"\n \| \"circle raised\"\n \| \"text link-primary\"\n \| \"text link-default\";\n /* Button size can be big, medium or small /\n size?: \"big\" \| \"small\";\n /* Disabled prop /\n disabled?: boolean;\n /* CSS classes /\n className?: string;\n}\n\nexport type LinkProps<C extends React.ElementType> =\n PolymorphicComponentPropsWithRef<C, ILinkProps>;\n\nexport type LinkComponent = <C extends React.ElementType = \"a\">(\n props: LinkProps<C>\n) => React.ReactElement \| null;\n\n/\n Link component\n */\nexport const Link: LinkComponent & { displayName?: string } = forwardRef(\n <C extends React.ElementType = \"a\">(\n {\n as,\n children,\n variant = \"contained\",\n size,\n disabled = false,\n className,\n ...args\n }: LinkProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const Component = as \|\| \"a\";\n\n return (\n <StyledLink\n ref={ref}\n as={Component}\n disabled={disabled}\n className={classNames(\"c-link\", className, {\n \"c-link--contained\": variant === \"primary\" \|\| variant === \"contained\",\n \"c-link--outlined\": variant === \"secondary\" \|\| variant === \"outlined\",\n \"c-link--text_colored\":\n variant === \"tertiary\" \|\| variant === \"text colored\",\n \"c-link--text_gray\": variant === \"option\" \|\| variant === \"text gray\",\n \"c-link--dark_transparent\": variant === \"dark transparent\",\n \"c-link--circle_raised\": variant === \"circle raised\",\n \"c-link--big\": size === \"big\",\n \"c-link--small\": size === \"small\",\n \"c-link--icon-only\":\n children instanceof Object && !(children instanceof Array),\n \"c-link--disabled\": disabled,\n })}\n variant={variant}\n size={size}\n $iconOnly={children instanceof Object && !(children instanceof Array)}\n {...args}\n tabIndex={1}\n >\n {children instanceof Array ? (\n <StyledLinkElements className=\"c-link__elements\">\n {children.map((value, index) =>\n value ? (\n <StyledLinkElement\n className=\"c-link__elements__element\"\n key={index}\n >\n {value}\n </StyledLinkElement>\n ) : null\n )}\n </StyledLinkElements>\n ) : (\n children\n )}\n </StyledLink>\n );\n }\n);\n\nLink.displayName = \"Link\";\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAA6E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsC7E;AACA;AACA;AACO,IAAMA,IAA8C,gBAAG,IAAAC,iBAAU,EACtE,gBAUEC,GAAuB,EACpB;EAAA,IATDC,EAAE,QAAFA,EAAE;IACFC,QAAQ,QAARA,QAAQ;IAAA,oBACRC,OAAO;IAAPA,OAAO,6BAAG,WAAW;IACrBC,IAAI,QAAJA,IAAI;IAAA,qBACJC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAChBC,SAAS,QAATA,SAAS;IACNC,IAAI;EAIT,IAAMC,SAAS,GAAGP,EAAE,IAAI,GAAG;EAE3B,oBACE,6BAAC,kBAAU;IACT,GAAG,EAAED,GAAI;IACT,EAAE,EAAEQ,SAAU;IACd,QAAQ,EAAEH,QAAS;IACnB,SAAS,EAAE,IAAAI,mBAAU,EAAC,QAAQ,EAAEH,SAAS,EAAE;MACzC,mBAAmB,EAAEH,OAAO,KAAK,SAAS,IAAIA,OAAO,KAAK,WAAW;MACrE,kBAAkB,EAAEA,OAAO,KAAK,WAAW,IAAIA,OAAO,KAAK,UAAU;MACrE,sBAAsB,EACpBA,OAAO,KAAK,UAAU,IAAIA,OAAO,KAAK,cAAc;MACtD,mBAAmB,EAAEA,OAAO,KAAK,QAAQ,IAAIA,OAAO,KAAK,WAAW;MACpE,0BAA0B,EAAEA,OAAO,KAAK,kBAAkB;MAC1D,uBAAuB,EAAEA,OAAO,KAAK,eAAe;MACpD,aAAa,EAAEC,IAAI,KAAK,KAAK;MAC7B,eAAe,EAAEA,IAAI,KAAK,OAAO;MACjC,mBAAmB,EACjBF,QAAQ,YAAYQ,MAAM,IAAI,EAAER,QAAQ,YAAYS,KAAK,CAAC;MAC5D,kBAAkB,EAAEN;IACtB,CAAC,CAAE;IACH,OAAO,EAAEF,OAAQ;IACjB,IAAI,EAAEC,IAAK;IACX,SAAS,EAAEF,QAAQ,YAAYQ,MAAM,IAAI,EAAER,QAAQ,YAAYS,KAAK;EAAE,GAClEJ,IAAI;IACR,QAAQ,EAAE;EAAE,IAEXL,QAAQ,YAAYS,KAAK,gBACxB,6BAAC,0BAAkB;IAAC,SAAS,EAAC;EAAkB,GAC7CT,QAAQ,CAACU,GAAG,CAAC,UAACC,KAAK,EAAEC,KAAK;IAAA,OACzBD,KAAK,gBACH,6BAAC,yBAAiB;MAChB,SAAS,EAAC,2BAA2B;MACrC,GAAG,EAAEC;IAAM,GAEVD,KAAK,CACY,GAClB,IAAI;EAAA,EACT,CACkB,GAErBX,QACD,CACU;AAEjB,CAAC,CACF;AAAC;AAEFJ,IAAI,CAACiB,WAAW,GAAG,MAAM"}

package/dist/cjs/components/Links/Styles.js CHANGED Viewed

@@ -18,7 +18,7 @@ exports.StyledLinkElement = StyledLinkElement;
 var StyledLink = _styledComponents.default.a.withConfig({
   displayName: "Styles__StyledLink",
   componentId: "sc-1c1jdox-1"
-})(["", " ", " ", " border:none;height:32px;transition:background-color 0.3s ease,box-shadow 0.3s ease,color 0.3s ease,border-color 0.3s ease;svg{fill:currentColor;}&::-moz-focus-inner{border:0;}&:focus{outline:none;}&:hover{text-decoration:none;}", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle, {
+})(["", " ", " ", " border:none;height:32px;transition:background-color 0.3s ease,box-shadow 0.3s ease,color 0.3s ease,border-color 0.3s ease;svg{fill:currentColor;}&::-moz-focus-inner{border:0;}&:focus{outline:none;}&:hover{text-decoration:none;}", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle, {
   "WebkitFontSmoothing": "antialiased",
   "MozOsxFontSmoothing": "grayscale",
   "fontWeight": "500",
@@ -49,6 +49,10 @@ var StyledLink = _styledComponents.default.a.withConfig({
   return props.variant === "dark transparent" && (0, _styledComponents.css)(["padding:0 8px;background-color:rgba(0,0,0,0.5);border-radius:var(--ac-br-6);color:var(--only-white);&:hover{background-color:rgba(0,0,0,0.85);}&:active{background-color:var(--only-black);}"]);
 }, function (props) {
   return props.variant === "circle raised" && (0, _styledComponents.css)(["padding:0 6px;background-color:transparent;border-radius:var(--ac-br-rounded);color:var(--color-theme-700);transition:ease 0.3s all;&:hover{background-color:var(--page-paper-main);box-shadow:var(--shadow-tertiary);}&:active{background-color:var(--page-paper-main);box-shadow:var(--shadow-tertiary-hover);}"]);
+}, function (props) {
+  return props.variant === "text link-primary" && (0, _styledComponents.css)(["line-height:14px;letter-spacing:0.25px;color:var(--color-primary);text-decoration:underline var(--color-primary);text-underline-offset:3px;height:fit-content;&:hover{text-decoration:none;}&:focus{text-decoration:none;outline:1px solid var(--color-primary);outline-offset:2px;border-radius:2px;}"]);
+}, function (props) {
+  return props.variant === "text link-default" && (0, _styledComponents.css)(["line-height:14px;letter-spacing:0.25px;color:var(--color-theme-500);text-decoration:underline var(--color-theme-500);text-underline-offset:3px;height:fit-content;&:hover{text-decoration:none;}&:focus{text-decoration:none;outline:1px solid var(--color-primary);outline-offset:2px;border-radius:2px;}"]);
 }, function (props) {
   return props.$iconOnly && (0, _styledComponents.css)(["padding:0;width:32px;", " ", ""], props.size === "small" && (0, _styledComponents.css)(["radius:16px;width:24px;"]), props.size === "big" && (0, _styledComponents.css)(["radius:20px;width:40px;"]));
 }, function (props) {

package/dist/cjs/components/Links/Styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Styles.js","names":["StyledLinkElement","styled","div","StyledLink","a","FontStyle","BoxSizingStyle","props","disabled","css","size","variant","$iconOnly","StyledLinkElements","StyledBackLink","displayName"],"sources":["../../../../src/components/Links/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { FontStyle } from \"../FontStyle\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { ILinkProps } from \"./Link\";\n\ninterface StyledLinkProps extends ILinkProps {\n $iconOnly: boolean;\n}\n\nexport const StyledLinkElement = styled.div``;\n\nexport const StyledLink = styled.a<StyledLinkProps>`\n ${FontStyle}\n ${BoxSizingStyle}\n ${tw`\n tw-antialiased\n tw-font-medium\n tw-leading-none\n tw-m-0\n tw-no-underline\n tw-text-sm\n tw-select-none\n tw-cursor-pointer\n tw-inline-flex\n tw-items-center\n tw-justify-center`}\n\n border: none;\n height: 32px;\n transition: background-color 0.3s ease, box-shadow 0.3s ease, color 0.3s ease,\n border-color 0.3s ease;\n\n svg {\n fill: currentColor;\n }\n\n &::-moz-focus-inner {\n border: 0;\n }\n\n &:focus {\n outline: none;\n }\n\n &:hover {\n text-decoration: none;\n }\n\n ${(props) =>\n props.disabled &&\n css`\n cursor: default;\n opacity: 50%;\n pointer-events: none;\n `}\n\n ${(props) =>\n props.size === \"small\" &&\n css`\n height: 24px;\n `}\n\n ${(props) =>\n props.size === \"big\" &&\n css`\n height: 40px;\n `}\n\n ${(props) =>\n (props.variant === \"primary\" \|\| props.variant === \"contained\") &&\n css`\n padding: 0 16px;\n background-color: var(--color-primary);\n border-radius: 16px;\n color: var(--color-theme-100);\n\n &:focus,\n &:hover {\n box-shadow: 0 3px 6px -2px var(--color-primary-500);\n background-color: var(--color-primary-800);\n }\n\n &:active {\n box-shadow: 0 4px 10px -2px var(--color-primary-600);\n background-color: var(--color-primary-800);\n }\n `}\n\n ${(props) =>\n (props.variant === \"secondary\" \|\| props.variant === \"outlined\") &&\n css`\n padding: 0 16px;\n background-color: transparent;\n border-radius: 16px;\n border: solid 1px var(--color-theme-600);\n color: var(--color-theme-600);\n\n &:focus,\n &:hover {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n\n &:active {\n border-color: var(--color-primary);\n color: var(--color-primary);\n background-color: var(--color-primary-200);\n }\n `}\n\n ${(props) =>\n (props.variant === \"tertiary\" \|\| props.variant === \"text colored\") &&\n css`\n padding: 0 8px;\n background-color: transparent;\n border-radius: 6px;\n color: var(--color-primary);\n\n &:focus,\n &:hover {\n background-color: var(--color-primary-200);\n }\n\n &:active {\n background-color: var(--color-primary-300);\n }\n `}\n\n ${(props) =>\n (props.variant === \"option\" \|\| props.variant === \"text gray\") &&\n css`\n padding: 0 8px;\n background-color: transparent;\n border-radius: 6px;\n color: var(--color-theme-600);\n\n &:focus,\n &:hover {\n background-color: var(--color-theme-300);\n color: var(--color-theme-900);\n }\n\n &:active {\n background-color: var(--color-theme-400);\n color: var(--color-theme-900);\n }\n `}\n\n ${(props) =>\n props.variant === \"dark transparent\" &&\n css`\n padding: 0 8px;\n background-color: rgba(0, 0, 0, 0.5);\n border-radius: var(--ac-br-6);\n color: var(--only-white);\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.85);\n }\n\n &:active {\n background-color: var(--only-black);\n }\n `}\n\n ${(props) =>\n props.variant === \"circle raised\" &&\n css`\n padding: 0 6px;\n background-color: transparent;\n border-radius: var(--ac-br-rounded);\n color: var(--color-theme-700);\n transition: ease 0.3s all;\n\n &:hover {\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-tertiary);\n }\n\n &:active {\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-tertiary-hover);\n }\n `}\n\n ${(props) =>\n props.$iconOnly &&\n css`\n padding: 0;\n width: 32px;\n\n ${props.size === \"small\" &&\n css`\n radius: 16px;\n width: 24px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 20px;\n width: 40px;\n `}\n `}\n\n ${(props) =>\n (props.variant === \"primary\" \|\|\n props.variant === \"contained\" \|\|\n props.variant === \"secondary\" \|\|\n props.variant === \"outlined\") &&\n css`\n ${StyledLinkElement}:first-child svg {\n margin-left: -6px;\n }\n ${StyledLinkElement}:last-child svg {\n margin-right: -6px;\n }\n\n ${props.size === \"small\" &&\n css`\n radius: 16px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 20px;\n `}\n `}\n\n ${(props) =>\n (props.variant === \"tertiary\" \|\|\n props.variant === \"text colored\" \|\|\n props.variant === \"option\" \|\|\n props.variant === \"text gray\" \|\|\n props.variant === \"dark transparent\") &&\n css`\n ${StyledLinkElement}:first-child svg {\n margin-left: -4px;\n }\n ${StyledLinkElement}:last-child svg {\n margin-right: -4px;\n }\n\n ${props.size === \"small\" &&\n css`\n radius: 4px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 8px;\n `}\n `}\n`;\n\nexport const StyledLinkElements = styled.div`\n display: flex;\n align-items: center;\n\n ${StyledLinkElement} {\n display: inline-flex;\n svg {\n margin: 0 4px;\n }\n }\n`;\n\nexport const StyledBackLink = styled.a`\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${tw`\n tw-pl-8\n tw-text-xxs\n tw-uppercase\n tw-inline-flex\n tw-align-middle\n tw-pr-4\n tw-text-theme-600\n tw-cursor-pointer\n `}\n\n text-decoration: none;\n border: transparent 1px solid;\n border-radius: 20px;\n height: 32px;\n font-size: 10px;\n font-weight: 500;\n display: table-cell;\n vertical-align: middle;\n\n &:before,\n &:after {\n content: \"\";\n ${tw`\n tw-border-solid\n tw-text-theme-700\n tw-inline-block\n tw-p-0\n tw-w-2\n tw-h-2\n tw-bg-no-repeat\n `}\n border-width: 0 1px 1px 0;\n position: absolute;\n left: 0;\n transition: all ease 0.3s;\n }\n &:before {\n ${tw`tw-opacity-100`}\n transform: translateX(1rem) translateY(0.1rem) rotate(135deg);\n }\n &:after {\n ${tw`tw-opacity-0`}\n transform: translateX(2rem) translateY(0.1rem) rotate(135deg);\n }\n &:hover {\n text-decoration: none;\n border-color: var(--border-primary);\n &:before {\n ${tw`tw-opacity-0`}\n transform: translateX(0rem) translateY(0.1rem) rotate(135deg);\n }\n &:after {\n ${tw`tw-opacity-100`}\n transform: translateX(1rem) translateY(0.1rem) rotate(135deg);\n }\n }\n`;\n\nStyledBackLink.displayName = \"StyledBackLink\";\nStyledLinkElement.displayName = \"StyledLinkElement\";\nStyledLinkElements.displayName = \"StyledLinkElements\";\nStyledLink.displayName = \"StyledLink\";\n"],"mappings":"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"}
1	+ {"version":3,"file":"Styles.js","names":["StyledLinkElement","styled","div","StyledLink","a","FontStyle","BoxSizingStyle","props","disabled","css","size","variant","$iconOnly","StyledLinkElements","StyledBackLink","displayName"],"sources":["../../../../src/components/Links/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { FontStyle } from \"../FontStyle\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { ILinkProps } from \"./Link\";\n\ninterface StyledLinkProps extends ILinkProps {\n $iconOnly: boolean;\n}\n\nexport const StyledLinkElement = styled.div``;\n\nexport const StyledLink = styled.a<StyledLinkProps>`\n ${FontStyle}\n ${BoxSizingStyle}\n ${tw`\n tw-antialiased\n tw-font-medium\n tw-leading-none\n tw-m-0\n tw-no-underline\n tw-text-sm\n tw-select-none\n tw-cursor-pointer\n tw-inline-flex\n tw-items-center\n tw-justify-center`}\n\n border: none;\n height: 32px;\n transition: background-color 0.3s ease, box-shadow 0.3s ease, color 0.3s ease,\n border-color 0.3s ease;\n\n svg {\n fill: currentColor;\n }\n\n &::-moz-focus-inner {\n border: 0;\n }\n\n &:focus {\n outline: none;\n }\n\n &:hover {\n text-decoration: none;\n }\n\n ${(props) =>\n props.disabled &&\n css`\n cursor: default;\n opacity: 50%;\n pointer-events: none;\n `}\n\n ${(props) =>\n props.size === \"small\" &&\n css`\n height: 24px;\n `}\n\n ${(props) =>\n props.size === \"big\" &&\n css`\n height: 40px;\n `}\n\n ${(props) =>\n (props.variant === \"primary\" \|\| props.variant === \"contained\") &&\n css`\n padding: 0 16px;\n background-color: var(--color-primary);\n border-radius: 16px;\n color: var(--color-theme-100);\n\n &:focus,\n &:hover {\n box-shadow: 0 3px 6px -2px var(--color-primary-500);\n background-color: var(--color-primary-800);\n }\n\n &:active {\n box-shadow: 0 4px 10px -2px var(--color-primary-600);\n background-color: var(--color-primary-800);\n }\n `}\n\n ${(props) =>\n (props.variant === \"secondary\" \|\| props.variant === \"outlined\") &&\n css`\n padding: 0 16px;\n background-color: transparent;\n border-radius: 16px;\n border: solid 1px var(--color-theme-600);\n color: var(--color-theme-600);\n\n &:focus,\n &:hover {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n\n &:active {\n border-color: var(--color-primary);\n color: var(--color-primary);\n background-color: var(--color-primary-200);\n }\n `}\n\n ${(props) =>\n (props.variant === \"tertiary\" \|\| props.variant === \"text colored\") &&\n css`\n padding: 0 8px;\n background-color: transparent;\n border-radius: 6px;\n color: var(--color-primary);\n\n &:focus,\n &:hover {\n background-color: var(--color-primary-200);\n }\n\n &:active {\n background-color: var(--color-primary-300);\n }\n `}\n\n ${(props) =>\n (props.variant === \"option\" \|\| props.variant === \"text gray\") &&\n css`\n padding: 0 8px;\n background-color: transparent;\n border-radius: 6px;\n color: var(--color-theme-600);\n\n &:focus,\n &:hover {\n background-color: var(--color-theme-300);\n color: var(--color-theme-900);\n }\n\n &:active {\n background-color: var(--color-theme-400);\n color: var(--color-theme-900);\n }\n `}\n\n ${(props) =>\n props.variant === \"dark transparent\" &&\n css`\n padding: 0 8px;\n background-color: rgba(0, 0, 0, 0.5);\n border-radius: var(--ac-br-6);\n color: var(--only-white);\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.85);\n }\n\n &:active {\n background-color: var(--only-black);\n }\n `}\n\n ${(props) =>\n props.variant === \"circle raised\" &&\n css`\n padding: 0 6px;\n background-color: transparent;\n border-radius: var(--ac-br-rounded);\n color: var(--color-theme-700);\n transition: ease 0.3s all;\n\n &:hover {\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-tertiary);\n }\n\n &:active {\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-tertiary-hover);\n }\n `}\n\n ${(props) =>\n props.variant === \"text link-primary\" &&\n css`\n line-height: 14px;\n letter-spacing: 0.25px;\n color: var(--color-primary);\n text-decoration: underline var(--color-primary);\n text-underline-offset: 3px;\n height: fit-content;\n\n &:hover {\n text-decoration: none;\n }\n\n &:focus {\n text-decoration: none;\n outline: 1px solid var(--color-primary);\n outline-offset: 2px;\n border-radius: 2px;\n }\n `}\n\n ${(props) =>\n props.variant === \"text link-default\" &&\n css`\n line-height: 14px;\n letter-spacing: 0.25px;\n color: var(--color-theme-500);\n text-decoration: underline var(--color-theme-500);\n text-underline-offset: 3px;\n height: fit-content;\n\n &:hover {\n text-decoration: none;\n }\n\n &:focus {\n text-decoration: none;\n outline: 1px solid var(--color-primary);\n outline-offset: 2px;\n border-radius: 2px;\n }\n `}\n\n\n ${(props) =>\n props.$iconOnly &&\n css`\n padding: 0;\n width: 32px;\n\n ${props.size === \"small\" &&\n css`\n radius: 16px;\n width: 24px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 20px;\n width: 40px;\n `}\n `}\n\n ${(props) =>\n (props.variant === \"primary\" \|\|\n props.variant === \"contained\" \|\|\n props.variant === \"secondary\" \|\|\n props.variant === \"outlined\") &&\n css`\n ${StyledLinkElement}:first-child svg {\n margin-left: -6px;\n }\n ${StyledLinkElement}:last-child svg {\n margin-right: -6px;\n }\n\n ${props.size === \"small\" &&\n css`\n radius: 16px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 20px;\n `}\n `}\n\n ${(props) =>\n (props.variant === \"tertiary\" \|\|\n props.variant === \"text colored\" \|\|\n props.variant === \"option\" \|\|\n props.variant === \"text gray\" \|\|\n props.variant === \"dark transparent\") &&\n css`\n ${StyledLinkElement}:first-child svg {\n margin-left: -4px;\n }\n ${StyledLinkElement}:last-child svg {\n margin-right: -4px;\n }\n\n ${props.size === \"small\" &&\n css`\n radius: 4px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 8px;\n `}\n `}\n`;\n\nexport const StyledLinkElements = styled.div`\n display: flex;\n align-items: center;\n\n ${StyledLinkElement} {\n display: inline-flex;\n svg {\n margin: 0 4px;\n }\n }\n`;\n\nexport const StyledBackLink = styled.a`\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${tw`\n tw-pl-8\n tw-text-xxs\n tw-uppercase\n tw-inline-flex\n tw-align-middle\n tw-pr-4\n tw-text-theme-600\n tw-cursor-pointer\n `}\n\n text-decoration: none;\n border: transparent 1px solid;\n border-radius: 20px;\n height: 32px;\n font-size: 10px;\n font-weight: 500;\n display: table-cell;\n vertical-align: middle;\n\n &:before,\n &:after {\n content: \"\";\n ${tw`\n tw-border-solid\n tw-text-theme-700\n tw-inline-block\n tw-p-0\n tw-w-2\n tw-h-2\n tw-bg-no-repeat\n `}\n border-width: 0 1px 1px 0;\n position: absolute;\n left: 0;\n transition: all ease 0.3s;\n }\n &:before {\n ${tw`tw-opacity-100`}\n transform: translateX(1rem) translateY(0.1rem) rotate(135deg);\n }\n &:after {\n ${tw`tw-opacity-0`}\n transform: translateX(2rem) translateY(0.1rem) rotate(135deg);\n }\n &:hover {\n text-decoration: none;\n border-color: var(--border-primary);\n &:before {\n ${tw`tw-opacity-0`}\n transform: translateX(0rem) translateY(0.1rem) rotate(135deg);\n }\n &:after {\n ${tw`tw-opacity-100`}\n transform: translateX(1rem) translateY(0.1rem) rotate(135deg);\n }\n }\n`;\n\nStyledBackLink.displayName = \"StyledBackLink\";\nStyledLinkElement.displayName = \"StyledLinkElement\";\nStyledLinkElements.displayName = \"StyledLinkElements\";\nStyledLink.displayName = \"StyledLink\";\n"],"mappings":"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"}

package/dist/esm/components/CommandPallete/CommandPallete.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandPallete.d.ts","sourceRoot":"","sources":["../../../../src/components/CommandPallete/CommandPallete.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAGZ,iBAAiB,EAEjB,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,EAAU,WAAW,EAAE,MAAM,WAAW,CAAC;AAQhD,OAAO,EAEL,uBAAuB,EACxB,MAAM,sBAAsB,CAAC;~~AAI9B~~,MAAM,WAAW,mBAAoB,SAAQ,WAAW;IACtD,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,SAAS,CAAA;KAAE,EAAE,CAAC;IAC7E,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,cAAc;6EAQxB,kBAAkB,mBAAmB,CAAC;;;;;;;;;;CA8CxC,CAAC"}
1	+ {"version":3,"file":"CommandPallete.d.ts","sourceRoot":"","sources":["../../../../src/components/CommandPallete/CommandPallete.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAGZ,iBAAiB,EAEjB,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,EAAU,WAAW,EAAE,MAAM,WAAW,CAAC;AAQhD,OAAO,EAEL,uBAAuB,EACxB,MAAM,sBAAsB,CAAC;AAG9B,MAAM,WAAW,mBAAoB,SAAQ,WAAW;IACtD,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,SAAS,CAAA;KAAE,EAAE,CAAC;IAC7E,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,cAAc;6EAQxB,kBAAkB,mBAAmB,CAAC;;;;;;;;;;CA8CxC,CAAC"}

package/dist/esm/components/CommandPallete/CommandPallete.js CHANGED Viewed

@@ -7,9 +7,6 @@ import { CommandPalleteHeader } from "./CommandPalleteHeader";
 import { CommandPalleteItem } from "./CommandPalleteItem";
 import { CommandPalleteList } from "./CommandPalleteList";
 import { ModeContextProvider } from "./context/ModeContext";
-// eslint-disable-next-line @typescript-eslint/no-empty-interface
 export var CommandPallete = function CommandPallete(_ref) {
   var children = _ref.children,
     onChangeSearch = _ref.onChangeSearch,

package/dist/esm/components/CommandPallete/CommandPallete.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandPallete.js","names":["React","Children","Dialog","StyledCommandPallete","StyledCommandPalleteWrapper","CommandPalleteHeader","CommandPalleteItem","CommandPalleteList","ModeContextProvider","CommandPallete","children","onChangeSearch","search","commands","mode","setMode","rest","handleChange","e","target","value","length","map","command","visible","title","renderIcon","toArray","child","item","cloneElement","displayName","List","Item"],"sources":["../../../../src/components/CommandPallete/CommandPallete.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n Children,\n PropsWithChildren,\n ReactElement,\n ReactNode,\n} from \"react\";\nimport { Dialog, DialogProps } from \"../Dialog\";\n\nimport {\n StyledCommandPallete,\n StyledCommandPalleteWrapper,\n} from \"./CommandPallete.styles\";\nimport { CommandPalleteHeader } from \"./CommandPalleteHeader\";\nimport { CommandPalleteItem } from \"./CommandPalleteItem\";\nimport {\n CommandPalleteList,\n CommandPalleteListProps,\n} from \"./CommandPalleteList\";\nimport { ModeContextProvider } from \"./context/ModeContext\";\n\~~n// eslint-disable-next-line @typescript-eslint/no-empty-interface\~~nexport interface CommandPalleteProps extends DialogProps {\n onChangeSearch: (search: string) => void;\n search: string;\n commands: { visible: boolean; title: string; renderIcon: () => ReactNode }[];\n mode: string;\n setMode: (value: string) => void;\n loading?: boolean;\n}\n\nexport const CommandPallete = ({\n children,\n onChangeSearch,\n search,\n commands,\n mode,\n setMode,\n ...rest\n}: PropsWithChildren<CommandPalleteProps>) => {\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChangeSearch(e.target.value);\n };\n\n return (\n <Dialog {...rest}>\n <StyledCommandPallete>\n <ModeContextProvider value={{ mode, setMode }}>\n <CommandPalleteHeader\n search={search}\n handleChange={handleChange}\n onChangeSearch={onChangeSearch}\n />\n </ModeContextProvider>\n <StyledCommandPalleteWrapper>\n {/* COMMANDS /}\n {search.length > 0 ? (\n <CommandPalleteList visible={true}>\n {commands.map((command) => {\n if (command.visible) {\n return (\n <CommandPalleteItem\n className=\"cp-item cp-command\"\n title={command.title}\n key={command.title}\n renderIcon={command.renderIcon}\n />\n );\n }\n return null;\n })}\n </CommandPalleteList>\n ) : null}\n {/ COMMANDS /}\n\n {/ LISTS AND ITEMS /}\n {Children.toArray(children).map((child) => {\n const item = child as ReactElement<CommandPalleteListProps>;\n return React.cloneElement(item, {});\n })}\n {/ LISTS AND ITEMS */}\n </StyledCommandPalleteWrapper>\n </StyledCommandPallete>\n </Dialog>\n );\n};\n\nCommandPallete.displayName = \"CommandPallete\";\n\nCommandPallete.List = CommandPalleteList;\nCommandPallete.Item = CommandPalleteItem;\n"],"mappings":";;AAAA,OAAOA,KAAK,IAEVC,QAAQ,QAIH,OAAO;AACd,SAASC,MAAM,QAAqB,WAAW;AAE/C,SACEC,oBAAoB,EACpBC,2BAA2B,QACtB,yBAAyB;AAChC,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SACEC,kBAAkB,QAEb,sBAAsB;AAC7B,SAASC,mBAAmB,QAAQ,uBAAuB~~;;AAE3D;;AAUA~~,OAAO,IAAMC,cAAc,GAAG,SAAjBA,cAAc,OAQmB;EAAA,IAP5CC,QAAQ,QAARA,QAAQ;IACRC,cAAc,QAAdA,cAAc;IACdC,MAAM,QAANA,MAAM;IACNC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,OAAO,QAAPA,OAAO;IACJC,IAAI;EAEP,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,CAAgC,EAAK;IACzDP,cAAc,CAACO,CAAC,CAACC,MAAM,CAACC,KAAK,CAAC;EAChC,CAAC;EAED,oBACE,oBAAC,MAAM,EAAKJ,IAAI,eACd,oBAAC,oBAAoB,qBACnB,oBAAC,mBAAmB;IAAC,KAAK,EAAE;MAAEF,IAAI,EAAJA,IAAI;MAAEC,OAAO,EAAPA;IAAQ;EAAE,gBAC5C,oBAAC,oBAAoB;IACnB,MAAM,EAAEH,MAAO;IACf,YAAY,EAAEK,YAAa;IAC3B,cAAc,EAAEN;EAAe,EAC/B,CACkB,eACtB,oBAAC,2BAA2B,QAEzBC,MAAM,CAACS,MAAM,GAAG,CAAC,gBAChB,oBAAC,kBAAkB;IAAC,OAAO,EAAE;EAAK,GAC/BR,QAAQ,CAACS,GAAG,CAAC,UAACC,OAAO,EAAK;IACzB,IAAIA,OAAO,CAACC,OAAO,EAAE;MACnB,oBACE,oBAAC,kBAAkB;QACjB,SAAS,EAAC,oBAAoB;QAC9B,KAAK,EAAED,OAAO,CAACE,KAAM;QACrB,GAAG,EAAEF,OAAO,CAACE,KAAM;QACnB,UAAU,EAAEF,OAAO,CAACG;MAAW,EAC/B;IAEN;IACA,OAAO,IAAI;EACb,CAAC,CAAC,CACiB,GACnB,IAAI,EAIPzB,QAAQ,CAAC0B,OAAO,CAACjB,QAAQ,CAAC,CAACY,GAAG,CAAC,UAACM,KAAK,EAAK;IACzC,IAAMC,IAAI,GAAGD,KAA8C;IAC3D,oBAAO5B,KAAK,CAAC8B,YAAY,CAACD,IAAI,EAAE,CAAC,CAAC,CAAC;EACrC,CAAC,CAAC,CAE0B,CACT,CAChB;AAEb,CAAC;AAEDpB,cAAc,CAACsB,WAAW,GAAG,gBAAgB;AAE7CtB,cAAc,CAACuB,IAAI,GAAGzB,kBAAkB;AACxCE,cAAc,CAACwB,IAAI,GAAG3B,kBAAkB"}
1	+ {"version":3,"file":"CommandPallete.js","names":["React","Children","Dialog","StyledCommandPallete","StyledCommandPalleteWrapper","CommandPalleteHeader","CommandPalleteItem","CommandPalleteList","ModeContextProvider","CommandPallete","children","onChangeSearch","search","commands","mode","setMode","rest","handleChange","e","target","value","length","map","command","visible","title","renderIcon","toArray","child","item","cloneElement","displayName","List","Item"],"sources":["../../../../src/components/CommandPallete/CommandPallete.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n Children,\n PropsWithChildren,\n ReactElement,\n ReactNode,\n} from \"react\";\nimport { Dialog, DialogProps } from \"../Dialog\";\n\nimport {\n StyledCommandPallete,\n StyledCommandPalleteWrapper,\n} from \"./CommandPallete.styles\";\nimport { CommandPalleteHeader } from \"./CommandPalleteHeader\";\nimport { CommandPalleteItem } from \"./CommandPalleteItem\";\nimport {\n CommandPalleteList,\n CommandPalleteListProps,\n} from \"./CommandPalleteList\";\nimport { ModeContextProvider } from \"./context/ModeContext\";\n\nexport interface CommandPalleteProps extends DialogProps {\n onChangeSearch: (search: string) => void;\n search: string;\n commands: { visible: boolean; title: string; renderIcon: () => ReactNode }[];\n mode: string;\n setMode: (value: string) => void;\n loading?: boolean;\n}\n\nexport const CommandPallete = ({\n children,\n onChangeSearch,\n search,\n commands,\n mode,\n setMode,\n ...rest\n}: PropsWithChildren<CommandPalleteProps>) => {\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChangeSearch(e.target.value);\n };\n\n return (\n <Dialog {...rest}>\n <StyledCommandPallete>\n <ModeContextProvider value={{ mode, setMode }}>\n <CommandPalleteHeader\n search={search}\n handleChange={handleChange}\n onChangeSearch={onChangeSearch}\n />\n </ModeContextProvider>\n <StyledCommandPalleteWrapper>\n {/* COMMANDS /}\n {search.length > 0 ? (\n <CommandPalleteList visible={true}>\n {commands.map((command) => {\n if (command.visible) {\n return (\n <CommandPalleteItem\n className=\"cp-item cp-command\"\n title={command.title}\n key={command.title}\n renderIcon={command.renderIcon}\n />\n );\n }\n return null;\n })}\n </CommandPalleteList>\n ) : null}\n {/ COMMANDS /}\n\n {/ LISTS AND ITEMS /}\n {Children.toArray(children).map((child) => {\n const item = child as ReactElement<CommandPalleteListProps>;\n return React.cloneElement(item, {});\n })}\n {/ LISTS AND ITEMS */}\n </StyledCommandPalleteWrapper>\n </StyledCommandPallete>\n </Dialog>\n );\n};\n\nCommandPallete.displayName = \"CommandPallete\";\n\nCommandPallete.List = CommandPalleteList;\nCommandPallete.Item = CommandPalleteItem;\n"],"mappings":";;AAAA,OAAOA,KAAK,IAEVC,QAAQ,QAIH,OAAO;AACd,SAASC,MAAM,QAAqB,WAAW;AAE/C,SACEC,oBAAoB,EACpBC,2BAA2B,QACtB,yBAAyB;AAChC,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SACEC,kBAAkB,QAEb,sBAAsB;AAC7B,SAASC,mBAAmB,QAAQ,uBAAuB;AAW3D,OAAO,IAAMC,cAAc,GAAG,SAAjBA,cAAc,OAQmB;EAAA,IAP5CC,QAAQ,QAARA,QAAQ;IACRC,cAAc,QAAdA,cAAc;IACdC,MAAM,QAANA,MAAM;IACNC,QAAQ,QAARA,QAAQ;IACRC,IAAI,QAAJA,IAAI;IACJC,OAAO,QAAPA,OAAO;IACJC,IAAI;EAEP,IAAMC,YAAY,GAAG,SAAfA,YAAY,CAAIC,CAAgC,EAAK;IACzDP,cAAc,CAACO,CAAC,CAACC,MAAM,CAACC,KAAK,CAAC;EAChC,CAAC;EAED,oBACE,oBAAC,MAAM,EAAKJ,IAAI,eACd,oBAAC,oBAAoB,qBACnB,oBAAC,mBAAmB;IAAC,KAAK,EAAE;MAAEF,IAAI,EAAJA,IAAI;MAAEC,OAAO,EAAPA;IAAQ;EAAE,gBAC5C,oBAAC,oBAAoB;IACnB,MAAM,EAAEH,MAAO;IACf,YAAY,EAAEK,YAAa;IAC3B,cAAc,EAAEN;EAAe,EAC/B,CACkB,eACtB,oBAAC,2BAA2B,QAEzBC,MAAM,CAACS,MAAM,GAAG,CAAC,gBAChB,oBAAC,kBAAkB;IAAC,OAAO,EAAE;EAAK,GAC/BR,QAAQ,CAACS,GAAG,CAAC,UAACC,OAAO,EAAK;IACzB,IAAIA,OAAO,CAACC,OAAO,EAAE;MACnB,oBACE,oBAAC,kBAAkB;QACjB,SAAS,EAAC,oBAAoB;QAC9B,KAAK,EAAED,OAAO,CAACE,KAAM;QACrB,GAAG,EAAEF,OAAO,CAACE,KAAM;QACnB,UAAU,EAAEF,OAAO,CAACG;MAAW,EAC/B;IAEN;IACA,OAAO,IAAI;EACb,CAAC,CAAC,CACiB,GACnB,IAAI,EAIPzB,QAAQ,CAAC0B,OAAO,CAACjB,QAAQ,CAAC,CAACY,GAAG,CAAC,UAACM,KAAK,EAAK;IACzC,IAAMC,IAAI,GAAGD,KAA8C;IAC3D,oBAAO5B,KAAK,CAAC8B,YAAY,CAACD,IAAI,EAAE,CAAC,CAAC,CAAC;EACrC,CAAC,CAAC,CAE0B,CACT,CAChB;AAEb,CAAC;AAEDpB,cAAc,CAACsB,WAAW,GAAG,gBAAgB;AAE7CtB,cAAc,CAACuB,IAAI,GAAGzB,kBAAkB;AACxCE,cAAc,CAACwB,IAAI,GAAG3B,kBAAkB"}

package/dist/esm/components/CommandPallete/CommandPalleteHeader.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandPalleteHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/CommandPallete/CommandPalleteHeader.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,WAAW,EAAU,MAAM,OAAO,CAAC;AAenD,MAAM,WAAW,yBAAyB;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACzD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,eAAO,MAAM,oBAAoB;yDAK9B,yBAAyB;;~~CAuF3B~~,CAAC"}
1	+ {"version":3,"file":"CommandPalleteHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/CommandPallete/CommandPalleteHeader.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,WAAW,EAAU,MAAM,OAAO,CAAC;AAenD,MAAM,WAAW,yBAAyB;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACzD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,eAAO,MAAM,oBAAoB;yDAK9B,yBAAyB;;CAwF3B,CAAC"}

package/dist/esm/components/CommandPallete/CommandPalleteHeader.js CHANGED Viewed

@@ -48,9 +48,7 @@ export var CommandPalleteHeader = function CommandPalleteHeader(_ref) {
     title: "Search by ID",
     placement: "top"
   }, /*#__PURE__*/React.createElement(IconButton, {
-    variant: "text gray"
-  }, /*#__PURE__*/React.createElement(HashtagIcon, {
-    onKeyDown: function onKeyDown(e) {
+    onKeyPress: function onKeyPress(e) {
       if (e.key === "Enter") {
         setMode("id");
         clearInput();
@@ -61,13 +59,14 @@ export var CommandPalleteHeader = function CommandPalleteHeader(_ref) {
       setMode("id");
       clearInput();
       focusInput();
-    }
-  }))) : null, search.length > 0 || mode === "id" ? /*#__PURE__*/React.createElement(Tooltip, {
+    },
+    variant: "text gray"
+  }, /*#__PURE__*/React.createElement(HashtagIcon, null))) : null, search.length > 0 || mode === "id" ? /*#__PURE__*/React.createElement(Tooltip, {
     title: mode === "id" ? "Close ID mode" : "Clear",
     placement: "top"
   }, /*#__PURE__*/React.createElement(IconButton, {
     variant: "text gray",
-    onKeyDown: function onKeyDown(e) {
+    onKeyPress: function onKeyPress(e) {
       if (e.key === "Enter") {
         setMode("default");
         clearInput();

package/dist/esm/components/CommandPallete/CommandPalleteHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandPalleteHeader.js","names":["React","useRef","IconButton","CloseIcon","HashtagIcon","SearchLargeIcon","SpinnerLoader","Tooltip","StyledActionWrapper","StyledCommandPalleteHeader","StyledInput","StyledParameter","StyledSearchIcon","useModeContext","CommandPalleteHeader","search","handleChange","loading","onChangeSearch","inputRef","mode","setMode","focusInput","current","focus","clearInput","value","marginRight","length","e","key","displayName"],"sources":["../../../../src/components/CommandPallete/CommandPalleteHeader.tsx"],"sourcesContent":["import React, { ChangeEvent, useRef } from \"react\";\nimport { IconButton } from \"../IconButton\";\nimport { CloseIcon, HashtagIcon, SearchLargeIcon } from \"../Icons\";\nimport { SpinnerLoader } from \"../Loaders\";\nimport { Tooltip } from \"../Tooltip\";\nimport {\n StyledActionWrapper,\n StyledCommandPalleteHeader,\n StyledInput,\n StyledParameter,\n StyledSearchIcon,\n} from \"./CommandPallete.styles\";\nimport { useModeContext } from \"./context/ModeContext\";\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface CommandPalleteHeaderProps {\n search: string;\n handleChange: (e: ChangeEvent<HTMLInputElement>) => void;\n loading?: boolean;\n onChangeSearch: (value: string) => void;\n}\n\nexport const CommandPalleteHeader = ({\n search,\n handleChange,\n loading = false,\n onChangeSearch,\n}: CommandPalleteHeaderProps) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const { mode, setMode } = useModeContext();\n\n const focusInput = () => {\n if (inputRef && inputRef.current) {\n inputRef.current.focus();\n }\n };\n\n const clearInput = () => {\n if (inputRef && inputRef.current) {\n inputRef.current.value = \"\";\n onChangeSearch(\"\");\n }\n };\n\n return (\n <StyledCommandPalleteHeader className=\"cp-header\">\n <StyledSearchIcon>\n <SearchLargeIcon />\n </StyledSearchIcon>\n\n {mode === \"id\" ? <StyledParameter>ID#:</StyledParameter> : null}\n\n <StyledInput\n ref={inputRef}\n autoFocus\n type=\"text\"\n autoCapitalize=\"none\"\n autoComplete=\"none\"\n value={search}\n onChange={handleChange}\n placeholder={mode === \"id\" ? \"22\" : \"Search or jump to\"}\n />\n\n <StyledActionWrapper>\n {loading ? <SpinnerLoader style={{ marginRight: \"4px\" }} /> : null}\n\n {mode !== \"id\" && search.length === 0 ? (\n <Tooltip title=\"Search by ID\" placement=\"top\">\n <IconButton ~~variant=\"text gray~~\~~">\~~n ~~<HashtagIcon\n onKeyDown~~={(e) => {\n if (e.key === \"Enter\") {\n setMode(\"id\");\n clearInput();\n focusInput();\n }\n }}\n onClick={() => {\n setMode(\"id\");\n clearInput();\n focusInput();\n }}\n />\n </IconButton>\n </Tooltip>\n ) : null}\n\n {search.length > 0 \|\| mode === \"id\" ? (\n <Tooltip\n title={mode === \"id\" ? \"Close ID mode\" : \"Clear\"}\n placement=\"top\"\n >\n <IconButton\n variant=\"text gray\"\n ~~onKeyDown~~={(e) => {\n if (e.key === \"Enter\") {\n setMode(\"default\");\n clearInput();\n focusInput();\n }\n }}\n onClick={() => {\n setMode(\"default\");\n clearInput();\n focusInput();\n }}\n >\n <CloseIcon />\n </IconButton>\n </Tooltip>\n ) : null}\n </StyledActionWrapper>\n </StyledCommandPalleteHeader>\n );\n};\n\nCommandPalleteHeader.displayName = \"CommandPalleteItem\";\n"],"mappings":"AAAA,OAAOA,KAAK,IAAiBC,MAAM,QAAQ,OAAO;AAClD,SAASC,UAAU,QAAQ,eAAe;AAC1C,SAASC,SAAS,EAAEC,WAAW,EAAEC,eAAe,QAAQ,UAAU;AAClE,SAASC,aAAa,QAAQ,YAAY;AAC1C,SAASC,OAAO,QAAQ,YAAY;AACpC,SACEC,mBAAmB,EACnBC,0BAA0B,EAC1BC,WAAW,EACXC,eAAe,EACfC,gBAAgB,QACX,yBAAyB;AAChC,SAASC,cAAc,QAAQ,uBAAuB;;AAEtD;;AAQA,OAAO,IAAMC,oBAAoB,GAAG,SAAvBA,oBAAoB,OAKA;EAAA,IAJ/BC,MAAM,QAANA,MAAM;IACNC,YAAY,QAAZA,YAAY;IAAA,oBACZC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IACfC,cAAc,QAAdA,cAAc;EAEd,IAAMC,QAAQ,GAAGlB,MAAM,CAAmB,IAAI,CAAC;EAC/C,sBAA0BY,cAAc,EAAE;IAAlCO,IAAI,mBAAJA,IAAI;IAAEC,OAAO,mBAAPA,OAAO;EAErB,IAAMC,UAAU,GAAG,SAAbA,UAAU,GAAS;IACvB,IAAIH,QAAQ,IAAIA,QAAQ,CAACI,OAAO,EAAE;MAChCJ,QAAQ,CAACI,OAAO,CAACC,KAAK,EAAE;IAC1B;EACF,CAAC;EAED,IAAMC,UAAU,GAAG,SAAbA,UAAU,GAAS;IACvB,IAAIN,QAAQ,IAAIA,QAAQ,CAACI,OAAO,EAAE;MAChCJ,QAAQ,CAACI,OAAO,CAACG,KAAK,GAAG,EAAE;MAC3BR,cAAc,CAAC,EAAE,CAAC;IACpB;EACF,CAAC;EAED,oBACE,oBAAC,0BAA0B;IAAC,SAAS,EAAC;EAAW,gBAC/C,oBAAC,gBAAgB,qBACf,oBAAC,eAAe,OAAG,CACF,EAElBE,IAAI,KAAK,IAAI,gBAAG,oBAAC,eAAe,eAAuB,GAAG,IAAI,eAE/D,oBAAC,WAAW;IACV,GAAG,EAAED,QAAS;IACd,SAAS;IACT,IAAI,EAAC,MAAM;IACX,cAAc,EAAC,MAAM;IACrB,YAAY,EAAC,MAAM;IACnB,KAAK,EAAEJ,MAAO;IACd,QAAQ,EAAEC,YAAa;IACvB,WAAW,EAAEI,IAAI,KAAK,IAAI,GAAG,IAAI,GAAG;EAAoB,EACxD,eAEF,oBAAC,mBAAmB,QACjBH,OAAO,gBAAG,oBAAC,aAAa;IAAC,KAAK,EAAE;MAAEU,WAAW,EAAE;IAAM;EAAE,EAAG,GAAG,IAAI,EAEjEP,IAAI,KAAK,IAAI,IAAIL,MAAM,CAACa,MAAM,KAAK,CAAC,gBACnC,oBAAC,OAAO;IAAC,KAAK,EAAC,cAAc;IAAC,SAAS,EAAC;EAAK,gBAC3C,oBAAC,UAAU;~~IAAC~~,~~OAAO~~,~~EAAC;EAAW,gBAC7B,oBAAC,WAAW;IACV,SAAS,~~EAAE,~~mBAACC~~,CAAC,EAAK;~~MAChB~~,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAE;QACrBT,OAAO,CAAC,IAAI,CAAC;QACbI,UAAU,EAAE;QACZH,UAAU,EAAE;MACd;IACF,CAAE;IACF,OAAO,EAAE,mBAAM;MACbD,OAAO,CAAC,IAAI,CAAC;MACbI,UAAU,EAAE;MACZH,UAAU,EAAE;IACd;~~EAAE~~,~~EACF~~,~~CACS~~,CACL,GACR,IAAI,EAEPP,MAAM,CAACa,MAAM,GAAG,CAAC,IAAIR,IAAI,KAAK,IAAI,gBACjC,oBAAC,OAAO;IACN,KAAK,EAAEA,IAAI,KAAK,IAAI,GAAG,eAAe,GAAG,OAAQ;IACjD,SAAS,EAAC;EAAK,gBAEf,oBAAC,UAAU;IACT,OAAO,EAAC,WAAW;IACnB,~~SAAS~~,EAAE,~~mBAACS~~,CAAC,EAAK;~~MAChB~~,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAE;QACrBT,OAAO,CAAC,SAAS,CAAC;QAClBI,UAAU,EAAE;QACZH,UAAU,EAAE;MACd;IACF,CAAE;IACF,OAAO,EAAE,mBAAM;MACbD,OAAO,CAAC,SAAS,CAAC;MAClBI,UAAU,EAAE;MACZH,UAAU,EAAE;IACd;EAAE,gBAEF,oBAAC,SAAS,OAAG,CACF,CACL,GACR,IAAI,CACY,CACK;AAEjC,CAAC;AAEDR,oBAAoB,CAACiB,WAAW,GAAG,oBAAoB"}
1	+ {"version":3,"file":"CommandPalleteHeader.js","names":["React","useRef","IconButton","CloseIcon","HashtagIcon","SearchLargeIcon","SpinnerLoader","Tooltip","StyledActionWrapper","StyledCommandPalleteHeader","StyledInput","StyledParameter","StyledSearchIcon","useModeContext","CommandPalleteHeader","search","handleChange","loading","onChangeSearch","inputRef","mode","setMode","focusInput","current","focus","clearInput","value","marginRight","length","e","key","displayName"],"sources":["../../../../src/components/CommandPallete/CommandPalleteHeader.tsx"],"sourcesContent":["import React, { ChangeEvent, useRef } from \"react\";\nimport { IconButton } from \"../IconButton\";\nimport { CloseIcon, HashtagIcon, SearchLargeIcon } from \"../Icons\";\nimport { SpinnerLoader } from \"../Loaders\";\nimport { Tooltip } from \"../Tooltip\";\nimport {\n StyledActionWrapper,\n StyledCommandPalleteHeader,\n StyledInput,\n StyledParameter,\n StyledSearchIcon,\n} from \"./CommandPallete.styles\";\nimport { useModeContext } from \"./context/ModeContext\";\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface CommandPalleteHeaderProps {\n search: string;\n handleChange: (e: ChangeEvent<HTMLInputElement>) => void;\n loading?: boolean;\n onChangeSearch: (value: string) => void;\n}\n\nexport const CommandPalleteHeader = ({\n search,\n handleChange,\n loading = false,\n onChangeSearch,\n}: CommandPalleteHeaderProps) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const { mode, setMode } = useModeContext();\n\n const focusInput = () => {\n if (inputRef && inputRef.current) {\n inputRef.current.focus();\n }\n };\n\n const clearInput = () => {\n if (inputRef && inputRef.current) {\n inputRef.current.value = \"\";\n onChangeSearch(\"\");\n }\n };\n\n return (\n <StyledCommandPalleteHeader className=\"cp-header\">\n <StyledSearchIcon>\n <SearchLargeIcon />\n </StyledSearchIcon>\n\n {mode === \"id\" ? <StyledParameter>ID#:</StyledParameter> : null}\n\n <StyledInput\n ref={inputRef}\n autoFocus\n type=\"text\"\n autoCapitalize=\"none\"\n autoComplete=\"none\"\n value={search}\n onChange={handleChange}\n placeholder={mode === \"id\" ? \"22\" : \"Search or jump to\"}\n />\n\n <StyledActionWrapper>\n {loading ? <SpinnerLoader style={{ marginRight: \"4px\" }} /> : null}\n\n {mode !== \"id\" && search.length === 0 ? (\n <Tooltip title=\"Search by ID\" placement=\"top\">\n <IconButton\n onKeyPress={(e) => {\n if (e.key === \"Enter\") {\n setMode(\"id\");\n clearInput();\n focusInput();\n }\n }}\n onClick={() => {\n setMode(\"id\");\n clearInput();\n focusInput();\n }}\n variant=\"text gray\"\n >\n <HashtagIcon />\n </IconButton>\n </Tooltip>\n ) : null}\n\n {search.length > 0 \|\| mode === \"id\" ? (\n <Tooltip\n title={mode === \"id\" ? \"Close ID mode\" : \"Clear\"}\n placement=\"top\"\n >\n <IconButton\n variant=\"text gray\"\n onKeyPress={(e) => {\n if (e.key === \"Enter\") {\n setMode(\"default\");\n clearInput();\n focusInput();\n }\n }}\n onClick={() => {\n setMode(\"default\");\n clearInput();\n focusInput();\n }}\n >\n <CloseIcon />\n </IconButton>\n </Tooltip>\n ) : null}\n </StyledActionWrapper>\n </StyledCommandPalleteHeader>\n );\n};\n\nCommandPalleteHeader.displayName = \"CommandPalleteItem\";\n"],"mappings":"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"}

package/dist/esm/components/Links/Link.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ export interface ILinkProps extends BaseHTMLAttributes<HTMLElement> {
     /** Children type of node or string */
     children: ReactNode | string;
     /** Variant Buttons */
-    variant?: "primary" | "secondary" | "tertiary" | "option" | "contained" | "outlined" | "text colored" | "text gray" | "dark transparent" | "circle raised";
+    variant?: "primary" | "secondary" | "tertiary" | "option" | "contained" | "outlined" | "text colored" | "text gray" | "dark transparent" | "circle raised" | "text link-primary" | "text link-default";
     /** Button size can be big, medium or small */
     size?: "big" | "small";
     /** Disabled prop */

package/dist/esm/components/Links/Link.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/components/Links/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,kBAAkB,EAAE,SAAS,EAAc,MAAM,OAAO,CAAC;AAGzE,OAAO,EACL,gCAAgC,EAEjC,MAAM,mBAAmB,CAAC;AAE3B,MAAM,WAAW,UAAW,SAAQ,kBAAkB,CAAC,WAAW,CAAC;IACjE,sCAAsC;IACtC,QAAQ,EAAE,SAAS,GAAG,MAAM,CAAC;IAC7B,sBAAsB;IACtB,OAAO,CAAC,EACJ,SAAS,GACT,WAAW,GACX,UAAU,GACV,QAAQ,GACR,WAAW,GACX,UAAU,GACV,cAAc,GACd,WAAW,GACX,kBAAkB,GAClB,eAAe,CAAC;~~IACpB~~,8CAA8C;IAC9C,IAAI,CAAC,EAAE,KAAK,GAAG,OAAO,CAAC;IACvB,oBAAoB;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kBAAkB;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,oBAAY,SAAS,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAC/C,gCAAgC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC;AAElD,oBAAY,aAAa,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,GAAG,EAC5D,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,KAChB,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B;;GAEG;AACH,eAAO,MAAM,IAAI,EAAE,aAAa,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,CAAA;~~CA0DxD~~,CAAC"}
1	+ {"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/components/Links/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,kBAAkB,EAAE,SAAS,EAAc,MAAM,OAAO,CAAC;AAGzE,OAAO,EACL,gCAAgC,EAEjC,MAAM,mBAAmB,CAAC;AAE3B,MAAM,WAAW,UAAW,SAAQ,kBAAkB,CAAC,WAAW,CAAC;IACjE,sCAAsC;IACtC,QAAQ,EAAE,SAAS,GAAG,MAAM,CAAC;IAC7B,sBAAsB;IACtB,OAAO,CAAC,EACJ,SAAS,GACT,WAAW,GACX,UAAU,GACV,QAAQ,GACR,WAAW,GACX,UAAU,GACV,cAAc,GACd,WAAW,GACX,kBAAkB,GAClB,eAAe,GACf,mBAAmB,GACnB,mBAAmB,CAAC;IACxB,8CAA8C;IAC9C,IAAI,CAAC,EAAE,KAAK,GAAG,OAAO,CAAC;IACvB,oBAAoB;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kBAAkB;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,oBAAY,SAAS,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAC/C,gCAAgC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC;AAElD,oBAAY,aAAa,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,GAAG,EAC5D,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,KAChB,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B;;GAEG;AACH,eAAO,MAAM,IAAI,EAAE,aAAa,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,CAAA;CA2DxD,CAAC"}

package/dist/esm/components/Links/Link.js CHANGED Viewed

@@ -37,7 +37,9 @@ export var Link = /*#__PURE__*/forwardRef(function (_ref, ref) {
     variant: variant,
     size: size,
     $iconOnly: children instanceof Object && !(children instanceof Array)
-  }, args), children instanceof Array ? /*#__PURE__*/React.createElement(StyledLinkElements, {
+  }, args, {
+    tabIndex: 1
+  }), children instanceof Array ? /*#__PURE__*/React.createElement(StyledLinkElements, {
     className: "c-link__elements"
   }, children.map(function (value, index) {
     return value ? /*#__PURE__*/React.createElement(StyledLinkElement, {

package/dist/esm/components/Links/Link.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Link.js","names":["React","forwardRef","classNames","StyledLink","StyledLinkElement","StyledLinkElements","Link","ref","as","children","variant","size","disabled","className","args","Component","Object","Array","map","value","index","displayName"],"sources":["../../../../src/components/Links/Link.tsx"],"sourcesContent":["import React, { BaseHTMLAttributes, ReactNode, forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport { StyledLink, StyledLinkElement, StyledLinkElements } from \"./Styles\";\nimport {\n PolymorphicComponentPropsWithRef,\n PolymorphicRef,\n} from \"../../utils/types\";\n\nexport interface ILinkProps extends BaseHTMLAttributes<HTMLElement> {\n /** Children type of node or string /\n children: ReactNode \| string;\n /* Variant Buttons /\n variant?:\n \| \"primary\"\n \| \"secondary\"\n \| \"tertiary\"\n \| \"option\"\n \| \"contained\"\n \| \"outlined\"\n \| \"text colored\"\n \| \"text gray\"\n \| \"dark transparent\"\n \| \"circle raised\";\n /* Button size can be big, medium or small /\n size?: \"big\" \| \"small\";\n /* Disabled prop /\n disabled?: boolean;\n /* CSS classes /\n className?: string;\n}\n\nexport type LinkProps<C extends React.ElementType> =\n PolymorphicComponentPropsWithRef<C, ILinkProps>;\n\nexport type LinkComponent = <C extends React.ElementType = \"a\">(\n props: LinkProps<C>\n) => React.ReactElement \| null;\n\n/\n Link component\n */\nexport const Link: LinkComponent & { displayName?: string } = forwardRef(\n <C extends React.ElementType = \"a\">(\n {\n as,\n children,\n variant = \"contained\",\n size,\n disabled = false,\n className,\n ...args\n }: LinkProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const Component = as \|\| \"a\";\n\n return (\n <StyledLink\n ref={ref}\n as={Component}\n disabled={disabled}\n className={classNames(\"c-link\", className, {\n \"c-link--contained\": variant === \"primary\" \|\| variant === \"contained\",\n \"c-link--outlined\": variant === \"secondary\" \|\| variant === \"outlined\",\n \"c-link--text_colored\":\n variant === \"tertiary\" \|\| variant === \"text colored\",\n \"c-link--text_gray\": variant === \"option\" \|\| variant === \"text gray\",\n \"c-link--dark_transparent\": variant === \"dark transparent\",\n \"c-link--circle_raised\": variant === \"circle raised\",\n \"c-link--big\": size === \"big\",\n \"c-link--small\": size === \"small\",\n \"c-link--icon-only\":\n children instanceof Object && !(children instanceof Array),\n \"c-link--disabled\": disabled,\n })}\n variant={variant}\n size={size}\n $iconOnly={children instanceof Object && !(children instanceof Array)}\n {...args}\n >\n {children instanceof Array ? (\n <StyledLinkElements className=\"c-link__elements\">\n {children.map((value, index) =>\n value ? (\n <StyledLinkElement\n className=\"c-link__elements__element\"\n key={index}\n >\n {value}\n </StyledLinkElement>\n ) : null\n )}\n </StyledLinkElements>\n ) : (\n children\n )}\n </StyledLink>\n );\n }\n);\n\nLink.displayName = \"Link\";\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAmCC,UAAU,QAAQ,OAAO;AACxE,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,UAAU,EAAEC,iBAAiB,EAAEC,kBAAkB,QAAQ,UAAU;~~AAoC5E~~;AACA;AACA;AACA,OAAO,IAAMC,IAA8C,gBAAGL,UAAU,CACtE,gBAUEM,GAAuB,EACpB;EAAA,IATDC,EAAE,QAAFA,EAAE;IACFC,QAAQ,QAARA,QAAQ;IAAA,oBACRC,OAAO;IAAPA,OAAO,6BAAG,WAAW;IACrBC,IAAI,QAAJA,IAAI;IAAA,qBACJC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAChBC,SAAS,QAATA,SAAS;IACNC,IAAI;EAIT,IAAMC,SAAS,GAAGP,EAAE,IAAI,GAAG;EAE3B,oBACE,oBAAC,UAAU;IACT,GAAG,EAAED,GAAI;IACT,EAAE,EAAEQ,SAAU;IACd,QAAQ,EAAEH,QAAS;IACnB,SAAS,EAAEV,UAAU,CAAC,QAAQ,EAAEW,SAAS,EAAE;MACzC,mBAAmB,EAAEH,OAAO,KAAK,SAAS,IAAIA,OAAO,KAAK,WAAW;MACrE,kBAAkB,EAAEA,OAAO,KAAK,WAAW,IAAIA,OAAO,KAAK,UAAU;MACrE,sBAAsB,EACpBA,OAAO,KAAK,UAAU,IAAIA,OAAO,KAAK,cAAc;MACtD,mBAAmB,EAAEA,OAAO,KAAK,QAAQ,IAAIA,OAAO,KAAK,WAAW;MACpE,0BAA0B,EAAEA,OAAO,KAAK,kBAAkB;MAC1D,uBAAuB,EAAEA,OAAO,KAAK,eAAe;MACpD,aAAa,EAAEC,IAAI,KAAK,KAAK;MAC7B,eAAe,EAAEA,IAAI,KAAK,OAAO;MACjC,mBAAmB,EACjBF,QAAQ,YAAYO,MAAM,IAAI,EAAEP,QAAQ,YAAYQ,KAAK,CAAC;MAC5D,kBAAkB,EAAEL;IACtB,CAAC,CAAE;IACH,OAAO,EAAEF,OAAQ;IACjB,IAAI,EAAEC,IAAK;IACX,SAAS,EAAEF,QAAQ,YAAYO,MAAM,IAAI,EAAEP,QAAQ,YAAYQ,KAAK;EAAE,GAClEH,IAAI,~~GAEPL~~,QAAQ,YAAYQ,KAAK,gBACxB,oBAAC,kBAAkB;IAAC,SAAS,EAAC;EAAkB,GAC7CR,QAAQ,CAACS,GAAG,CAAC,UAACC,KAAK,EAAEC,KAAK;IAAA,OACzBD,KAAK,gBACH,oBAAC,iBAAiB;MAChB,SAAS,EAAC,2BAA2B;MACrC,GAAG,EAAEC;IAAM,GAEVD,KAAK,CACY,GAClB,IAAI;EAAA,EACT,CACkB,GAErBV,QACD,CACU;AAEjB,CAAC,CACF;AAEDH,IAAI,CAACe,WAAW,GAAG,MAAM"}
1	+ {"version":3,"file":"Link.js","names":["React","forwardRef","classNames","StyledLink","StyledLinkElement","StyledLinkElements","Link","ref","as","children","variant","size","disabled","className","args","Component","Object","Array","map","value","index","displayName"],"sources":["../../../../src/components/Links/Link.tsx"],"sourcesContent":["import React, { BaseHTMLAttributes, ReactNode, forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport { StyledLink, StyledLinkElement, StyledLinkElements } from \"./Styles\";\nimport {\n PolymorphicComponentPropsWithRef,\n PolymorphicRef,\n} from \"../../utils/types\";\n\nexport interface ILinkProps extends BaseHTMLAttributes<HTMLElement> {\n /** Children type of node or string /\n children: ReactNode \| string;\n /* Variant Buttons /\n variant?:\n \| \"primary\"\n \| \"secondary\"\n \| \"tertiary\"\n \| \"option\"\n \| \"contained\"\n \| \"outlined\"\n \| \"text colored\"\n \| \"text gray\"\n \| \"dark transparent\"\n \| \"circle raised\"\n \| \"text link-primary\"\n \| \"text link-default\";\n /* Button size can be big, medium or small /\n size?: \"big\" \| \"small\";\n /* Disabled prop /\n disabled?: boolean;\n /* CSS classes /\n className?: string;\n}\n\nexport type LinkProps<C extends React.ElementType> =\n PolymorphicComponentPropsWithRef<C, ILinkProps>;\n\nexport type LinkComponent = <C extends React.ElementType = \"a\">(\n props: LinkProps<C>\n) => React.ReactElement \| null;\n\n/\n Link component\n */\nexport const Link: LinkComponent & { displayName?: string } = forwardRef(\n <C extends React.ElementType = \"a\">(\n {\n as,\n children,\n variant = \"contained\",\n size,\n disabled = false,\n className,\n ...args\n }: LinkProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const Component = as \|\| \"a\";\n\n return (\n <StyledLink\n ref={ref}\n as={Component}\n disabled={disabled}\n className={classNames(\"c-link\", className, {\n \"c-link--contained\": variant === \"primary\" \|\| variant === \"contained\",\n \"c-link--outlined\": variant === \"secondary\" \|\| variant === \"outlined\",\n \"c-link--text_colored\":\n variant === \"tertiary\" \|\| variant === \"text colored\",\n \"c-link--text_gray\": variant === \"option\" \|\| variant === \"text gray\",\n \"c-link--dark_transparent\": variant === \"dark transparent\",\n \"c-link--circle_raised\": variant === \"circle raised\",\n \"c-link--big\": size === \"big\",\n \"c-link--small\": size === \"small\",\n \"c-link--icon-only\":\n children instanceof Object && !(children instanceof Array),\n \"c-link--disabled\": disabled,\n })}\n variant={variant}\n size={size}\n $iconOnly={children instanceof Object && !(children instanceof Array)}\n {...args}\n tabIndex={1}\n >\n {children instanceof Array ? (\n <StyledLinkElements className=\"c-link__elements\">\n {children.map((value, index) =>\n value ? (\n <StyledLinkElement\n className=\"c-link__elements__element\"\n key={index}\n >\n {value}\n </StyledLinkElement>\n ) : null\n )}\n </StyledLinkElements>\n ) : (\n children\n )}\n </StyledLink>\n );\n }\n);\n\nLink.displayName = \"Link\";\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAmCC,UAAU,QAAQ,OAAO;AACxE,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,UAAU,EAAEC,iBAAiB,EAAEC,kBAAkB,QAAQ,UAAU;AAsC5E;AACA;AACA;AACA,OAAO,IAAMC,IAA8C,gBAAGL,UAAU,CACtE,gBAUEM,GAAuB,EACpB;EAAA,IATDC,EAAE,QAAFA,EAAE;IACFC,QAAQ,QAARA,QAAQ;IAAA,oBACRC,OAAO;IAAPA,OAAO,6BAAG,WAAW;IACrBC,IAAI,QAAJA,IAAI;IAAA,qBACJC,QAAQ;IAARA,QAAQ,8BAAG,KAAK;IAChBC,SAAS,QAATA,SAAS;IACNC,IAAI;EAIT,IAAMC,SAAS,GAAGP,EAAE,IAAI,GAAG;EAE3B,oBACE,oBAAC,UAAU;IACT,GAAG,EAAED,GAAI;IACT,EAAE,EAAEQ,SAAU;IACd,QAAQ,EAAEH,QAAS;IACnB,SAAS,EAAEV,UAAU,CAAC,QAAQ,EAAEW,SAAS,EAAE;MACzC,mBAAmB,EAAEH,OAAO,KAAK,SAAS,IAAIA,OAAO,KAAK,WAAW;MACrE,kBAAkB,EAAEA,OAAO,KAAK,WAAW,IAAIA,OAAO,KAAK,UAAU;MACrE,sBAAsB,EACpBA,OAAO,KAAK,UAAU,IAAIA,OAAO,KAAK,cAAc;MACtD,mBAAmB,EAAEA,OAAO,KAAK,QAAQ,IAAIA,OAAO,KAAK,WAAW;MACpE,0BAA0B,EAAEA,OAAO,KAAK,kBAAkB;MAC1D,uBAAuB,EAAEA,OAAO,KAAK,eAAe;MACpD,aAAa,EAAEC,IAAI,KAAK,KAAK;MAC7B,eAAe,EAAEA,IAAI,KAAK,OAAO;MACjC,mBAAmB,EACjBF,QAAQ,YAAYO,MAAM,IAAI,EAAEP,QAAQ,YAAYQ,KAAK,CAAC;MAC5D,kBAAkB,EAAEL;IACtB,CAAC,CAAE;IACH,OAAO,EAAEF,OAAQ;IACjB,IAAI,EAAEC,IAAK;IACX,SAAS,EAAEF,QAAQ,YAAYO,MAAM,IAAI,EAAEP,QAAQ,YAAYQ,KAAK;EAAE,GAClEH,IAAI;IACR,QAAQ,EAAE;EAAE,IAEXL,QAAQ,YAAYQ,KAAK,gBACxB,oBAAC,kBAAkB;IAAC,SAAS,EAAC;EAAkB,GAC7CR,QAAQ,CAACS,GAAG,CAAC,UAACC,KAAK,EAAEC,KAAK;IAAA,OACzBD,KAAK,gBACH,oBAAC,iBAAiB;MAChB,SAAS,EAAC,2BAA2B;MACrC,GAAG,EAAEC;IAAM,GAEVD,KAAK,CACY,GAClB,IAAI;EAAA,EACT,CACkB,GAErBV,QACD,CACU;AAEjB,CAAC,CACF;AAEDH,IAAI,CAACe,WAAW,GAAG,MAAM"}

package/dist/esm/components/Links/Styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Links/Styles.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAEpC,UAAU,eAAgB,SAAQ,UAAU;IAC1C,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,iBAAiB,oEAAe,CAAC;AAE9C,eAAO,MAAM,UAAU,+~~EAiPtB~~,CAAC;AAEF,eAAO,MAAM,kBAAkB,oEAU9B,CAAC;AAEF,eAAO,MAAM,cAAc,kEA6D1B,CAAC"}
1	+ {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Links/Styles.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAEpC,UAAU,eAAgB,SAAQ,UAAU;IAC1C,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,iBAAiB,oEAAe,CAAC;AAE9C,eAAO,MAAM,UAAU,+EA8RtB,CAAC;AAEF,eAAO,MAAM,kBAAkB,oEAU9B,CAAC;AAEF,eAAO,MAAM,cAAc,kEA6D1B,CAAC"}

package/dist/esm/components/Links/Styles.js CHANGED Viewed

@@ -8,7 +8,7 @@ export var StyledLinkElement = styled.div.withConfig({
 export var StyledLink = styled.a.withConfig({
   displayName: "Styles__StyledLink",
   componentId: "sc-1c1jdox-1"
-})(["", " ", " ", " border:none;height:32px;transition:background-color 0.3s ease,box-shadow 0.3s ease,color 0.3s ease,border-color 0.3s ease;svg{fill:currentColor;}&::-moz-focus-inner{border:0;}&:focus{outline:none;}&:hover{text-decoration:none;}", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], FontStyle, BoxSizingStyle, {
+})(["", " ", " ", " border:none;height:32px;transition:background-color 0.3s ease,box-shadow 0.3s ease,color 0.3s ease,border-color 0.3s ease;svg{fill:currentColor;}&::-moz-focus-inner{border:0;}&:focus{outline:none;}&:hover{text-decoration:none;}", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], FontStyle, BoxSizingStyle, {
   "WebkitFontSmoothing": "antialiased",
   "MozOsxFontSmoothing": "grayscale",
   "fontWeight": "500",
@@ -39,6 +39,10 @@ export var StyledLink = styled.a.withConfig({
   return props.variant === "dark transparent" && css(["padding:0 8px;background-color:rgba(0,0,0,0.5);border-radius:var(--ac-br-6);color:var(--only-white);&:hover{background-color:rgba(0,0,0,0.85);}&:active{background-color:var(--only-black);}"]);
 }, function (props) {
   return props.variant === "circle raised" && css(["padding:0 6px;background-color:transparent;border-radius:var(--ac-br-rounded);color:var(--color-theme-700);transition:ease 0.3s all;&:hover{background-color:var(--page-paper-main);box-shadow:var(--shadow-tertiary);}&:active{background-color:var(--page-paper-main);box-shadow:var(--shadow-tertiary-hover);}"]);
+}, function (props) {
+  return props.variant === "text link-primary" && css(["line-height:14px;letter-spacing:0.25px;color:var(--color-primary);text-decoration:underline var(--color-primary);text-underline-offset:3px;height:fit-content;&:hover{text-decoration:none;}&:focus{text-decoration:none;outline:1px solid var(--color-primary);outline-offset:2px;border-radius:2px;}"]);
+}, function (props) {
+  return props.variant === "text link-default" && css(["line-height:14px;letter-spacing:0.25px;color:var(--color-theme-500);text-decoration:underline var(--color-theme-500);text-underline-offset:3px;height:fit-content;&:hover{text-decoration:none;}&:focus{text-decoration:none;outline:1px solid var(--color-primary);outline-offset:2px;border-radius:2px;}"]);
 }, function (props) {
   return props.$iconOnly && css(["padding:0;width:32px;", " ", ""], props.size === "small" && css(["radius:16px;width:24px;"]), props.size === "big" && css(["radius:20px;width:40px;"]));
 }, function (props) {

package/dist/esm/components/Links/Styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Styles.js","names":["styled","css","FontStyle","BoxSizingStyle","StyledLinkElement","div","StyledLink","a","props","disabled","size","variant","$iconOnly","StyledLinkElements","StyledBackLink","displayName"],"sources":["../../../../src/components/Links/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { FontStyle } from \"../FontStyle\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { ILinkProps } from \"./Link\";\n\ninterface StyledLinkProps extends ILinkProps {\n $iconOnly: boolean;\n}\n\nexport const StyledLinkElement = styled.div``;\n\nexport const StyledLink = styled.a<StyledLinkProps>`\n ${FontStyle}\n ${BoxSizingStyle}\n ${tw`\n tw-antialiased\n tw-font-medium\n tw-leading-none\n tw-m-0\n tw-no-underline\n tw-text-sm\n tw-select-none\n tw-cursor-pointer\n tw-inline-flex\n tw-items-center\n tw-justify-center`}\n\n border: none;\n height: 32px;\n transition: background-color 0.3s ease, box-shadow 0.3s ease, color 0.3s ease,\n border-color 0.3s ease;\n\n svg {\n fill: currentColor;\n }\n\n &::-moz-focus-inner {\n border: 0;\n }\n\n &:focus {\n outline: none;\n }\n\n &:hover {\n text-decoration: none;\n }\n\n ${(props) =>\n props.disabled &&\n css`\n cursor: default;\n opacity: 50%;\n pointer-events: none;\n `}\n\n ${(props) =>\n props.size === \"small\" &&\n css`\n height: 24px;\n `}\n\n ${(props) =>\n props.size === \"big\" &&\n css`\n height: 40px;\n `}\n\n ${(props) =>\n (props.variant === \"primary\" \|\| props.variant === \"contained\") &&\n css`\n padding: 0 16px;\n background-color: var(--color-primary);\n border-radius: 16px;\n color: var(--color-theme-100);\n\n &:focus,\n &:hover {\n box-shadow: 0 3px 6px -2px var(--color-primary-500);\n background-color: var(--color-primary-800);\n }\n\n &:active {\n box-shadow: 0 4px 10px -2px var(--color-primary-600);\n background-color: var(--color-primary-800);\n }\n `}\n\n ${(props) =>\n (props.variant === \"secondary\" \|\| props.variant === \"outlined\") &&\n css`\n padding: 0 16px;\n background-color: transparent;\n border-radius: 16px;\n border: solid 1px var(--color-theme-600);\n color: var(--color-theme-600);\n\n &:focus,\n &:hover {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n\n &:active {\n border-color: var(--color-primary);\n color: var(--color-primary);\n background-color: var(--color-primary-200);\n }\n `}\n\n ${(props) =>\n (props.variant === \"tertiary\" \|\| props.variant === \"text colored\") &&\n css`\n padding: 0 8px;\n background-color: transparent;\n border-radius: 6px;\n color: var(--color-primary);\n\n &:focus,\n &:hover {\n background-color: var(--color-primary-200);\n }\n\n &:active {\n background-color: var(--color-primary-300);\n }\n `}\n\n ${(props) =>\n (props.variant === \"option\" \|\| props.variant === \"text gray\") &&\n css`\n padding: 0 8px;\n background-color: transparent;\n border-radius: 6px;\n color: var(--color-theme-600);\n\n &:focus,\n &:hover {\n background-color: var(--color-theme-300);\n color: var(--color-theme-900);\n }\n\n &:active {\n background-color: var(--color-theme-400);\n color: var(--color-theme-900);\n }\n `}\n\n ${(props) =>\n props.variant === \"dark transparent\" &&\n css`\n padding: 0 8px;\n background-color: rgba(0, 0, 0, 0.5);\n border-radius: var(--ac-br-6);\n color: var(--only-white);\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.85);\n }\n\n &:active {\n background-color: var(--only-black);\n }\n `}\n\n ${(props) =>\n props.variant === \"circle raised\" &&\n css`\n padding: 0 6px;\n background-color: transparent;\n border-radius: var(--ac-br-rounded);\n color: var(--color-theme-700);\n transition: ease 0.3s all;\n\n &:hover {\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-tertiary);\n }\n\n &:active {\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-tertiary-hover);\n }\n `}\n\n ${(props) =>\n props.$iconOnly &&\n css`\n padding: 0;\n width: 32px;\n\n ${props.size === \"small\" &&\n css`\n radius: 16px;\n width: 24px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 20px;\n width: 40px;\n `}\n `}\n\n ${(props) =>\n (props.variant === \"primary\" \|\|\n props.variant === \"contained\" \|\|\n props.variant === \"secondary\" \|\|\n props.variant === \"outlined\") &&\n css`\n ${StyledLinkElement}:first-child svg {\n margin-left: -6px;\n }\n ${StyledLinkElement}:last-child svg {\n margin-right: -6px;\n }\n\n ${props.size === \"small\" &&\n css`\n radius: 16px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 20px;\n `}\n `}\n\n ${(props) =>\n (props.variant === \"tertiary\" \|\|\n props.variant === \"text colored\" \|\|\n props.variant === \"option\" \|\|\n props.variant === \"text gray\" \|\|\n props.variant === \"dark transparent\") &&\n css`\n ${StyledLinkElement}:first-child svg {\n margin-left: -4px;\n }\n ${StyledLinkElement}:last-child svg {\n margin-right: -4px;\n }\n\n ${props.size === \"small\" &&\n css`\n radius: 4px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 8px;\n `}\n `}\n`;\n\nexport const StyledLinkElements = styled.div`\n display: flex;\n align-items: center;\n\n ${StyledLinkElement} {\n display: inline-flex;\n svg {\n margin: 0 4px;\n }\n }\n`;\n\nexport const StyledBackLink = styled.a`\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${tw`\n tw-pl-8\n tw-text-xxs\n tw-uppercase\n tw-inline-flex\n tw-align-middle\n tw-pr-4\n tw-text-theme-600\n tw-cursor-pointer\n `}\n\n text-decoration: none;\n border: transparent 1px solid;\n border-radius: 20px;\n height: 32px;\n font-size: 10px;\n font-weight: 500;\n display: table-cell;\n vertical-align: middle;\n\n &:before,\n &:after {\n content: \"\";\n ${tw`\n tw-border-solid\n tw-text-theme-700\n tw-inline-block\n tw-p-0\n tw-w-2\n tw-h-2\n tw-bg-no-repeat\n `}\n border-width: 0 1px 1px 0;\n position: absolute;\n left: 0;\n transition: all ease 0.3s;\n }\n &:before {\n ${tw`tw-opacity-100`}\n transform: translateX(1rem) translateY(0.1rem) rotate(135deg);\n }\n &:after {\n ${tw`tw-opacity-0`}\n transform: translateX(2rem) translateY(0.1rem) rotate(135deg);\n }\n &:hover {\n text-decoration: none;\n border-color: var(--border-primary);\n &:before {\n ${tw`tw-opacity-0`}\n transform: translateX(0rem) translateY(0.1rem) rotate(135deg);\n }\n &:after {\n ${tw`tw-opacity-100`}\n transform: translateX(1rem) translateY(0.1rem) rotate(135deg);\n }\n }\n`;\n\nStyledBackLink.displayName = \"StyledBackLink\";\nStyledLinkElement.displayName = \"StyledLinkElement\";\nStyledLinkElements.displayName = \"StyledLinkElements\";\nStyledLink.displayName = \"StyledLink\";\n"],"mappings":"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"}
1	+ {"version":3,"file":"Styles.js","names":["styled","css","FontStyle","BoxSizingStyle","StyledLinkElement","div","StyledLink","a","props","disabled","size","variant","$iconOnly","StyledLinkElements","StyledBackLink","displayName"],"sources":["../../../../src/components/Links/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { FontStyle } from \"../FontStyle\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { ILinkProps } from \"./Link\";\n\ninterface StyledLinkProps extends ILinkProps {\n $iconOnly: boolean;\n}\n\nexport const StyledLinkElement = styled.div``;\n\nexport const StyledLink = styled.a<StyledLinkProps>`\n ${FontStyle}\n ${BoxSizingStyle}\n ${tw`\n tw-antialiased\n tw-font-medium\n tw-leading-none\n tw-m-0\n tw-no-underline\n tw-text-sm\n tw-select-none\n tw-cursor-pointer\n tw-inline-flex\n tw-items-center\n tw-justify-center`}\n\n border: none;\n height: 32px;\n transition: background-color 0.3s ease, box-shadow 0.3s ease, color 0.3s ease,\n border-color 0.3s ease;\n\n svg {\n fill: currentColor;\n }\n\n &::-moz-focus-inner {\n border: 0;\n }\n\n &:focus {\n outline: none;\n }\n\n &:hover {\n text-decoration: none;\n }\n\n ${(props) =>\n props.disabled &&\n css`\n cursor: default;\n opacity: 50%;\n pointer-events: none;\n `}\n\n ${(props) =>\n props.size === \"small\" &&\n css`\n height: 24px;\n `}\n\n ${(props) =>\n props.size === \"big\" &&\n css`\n height: 40px;\n `}\n\n ${(props) =>\n (props.variant === \"primary\" \|\| props.variant === \"contained\") &&\n css`\n padding: 0 16px;\n background-color: var(--color-primary);\n border-radius: 16px;\n color: var(--color-theme-100);\n\n &:focus,\n &:hover {\n box-shadow: 0 3px 6px -2px var(--color-primary-500);\n background-color: var(--color-primary-800);\n }\n\n &:active {\n box-shadow: 0 4px 10px -2px var(--color-primary-600);\n background-color: var(--color-primary-800);\n }\n `}\n\n ${(props) =>\n (props.variant === \"secondary\" \|\| props.variant === \"outlined\") &&\n css`\n padding: 0 16px;\n background-color: transparent;\n border-radius: 16px;\n border: solid 1px var(--color-theme-600);\n color: var(--color-theme-600);\n\n &:focus,\n &:hover {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n\n &:active {\n border-color: var(--color-primary);\n color: var(--color-primary);\n background-color: var(--color-primary-200);\n }\n `}\n\n ${(props) =>\n (props.variant === \"tertiary\" \|\| props.variant === \"text colored\") &&\n css`\n padding: 0 8px;\n background-color: transparent;\n border-radius: 6px;\n color: var(--color-primary);\n\n &:focus,\n &:hover {\n background-color: var(--color-primary-200);\n }\n\n &:active {\n background-color: var(--color-primary-300);\n }\n `}\n\n ${(props) =>\n (props.variant === \"option\" \|\| props.variant === \"text gray\") &&\n css`\n padding: 0 8px;\n background-color: transparent;\n border-radius: 6px;\n color: var(--color-theme-600);\n\n &:focus,\n &:hover {\n background-color: var(--color-theme-300);\n color: var(--color-theme-900);\n }\n\n &:active {\n background-color: var(--color-theme-400);\n color: var(--color-theme-900);\n }\n `}\n\n ${(props) =>\n props.variant === \"dark transparent\" &&\n css`\n padding: 0 8px;\n background-color: rgba(0, 0, 0, 0.5);\n border-radius: var(--ac-br-6);\n color: var(--only-white);\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.85);\n }\n\n &:active {\n background-color: var(--only-black);\n }\n `}\n\n ${(props) =>\n props.variant === \"circle raised\" &&\n css`\n padding: 0 6px;\n background-color: transparent;\n border-radius: var(--ac-br-rounded);\n color: var(--color-theme-700);\n transition: ease 0.3s all;\n\n &:hover {\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-tertiary);\n }\n\n &:active {\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-tertiary-hover);\n }\n `}\n\n ${(props) =>\n props.variant === \"text link-primary\" &&\n css`\n line-height: 14px;\n letter-spacing: 0.25px;\n color: var(--color-primary);\n text-decoration: underline var(--color-primary);\n text-underline-offset: 3px;\n height: fit-content;\n\n &:hover {\n text-decoration: none;\n }\n\n &:focus {\n text-decoration: none;\n outline: 1px solid var(--color-primary);\n outline-offset: 2px;\n border-radius: 2px;\n }\n `}\n\n ${(props) =>\n props.variant === \"text link-default\" &&\n css`\n line-height: 14px;\n letter-spacing: 0.25px;\n color: var(--color-theme-500);\n text-decoration: underline var(--color-theme-500);\n text-underline-offset: 3px;\n height: fit-content;\n\n &:hover {\n text-decoration: none;\n }\n\n &:focus {\n text-decoration: none;\n outline: 1px solid var(--color-primary);\n outline-offset: 2px;\n border-radius: 2px;\n }\n `}\n\n\n ${(props) =>\n props.$iconOnly &&\n css`\n padding: 0;\n width: 32px;\n\n ${props.size === \"small\" &&\n css`\n radius: 16px;\n width: 24px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 20px;\n width: 40px;\n `}\n `}\n\n ${(props) =>\n (props.variant === \"primary\" \|\|\n props.variant === \"contained\" \|\|\n props.variant === \"secondary\" \|\|\n props.variant === \"outlined\") &&\n css`\n ${StyledLinkElement}:first-child svg {\n margin-left: -6px;\n }\n ${StyledLinkElement}:last-child svg {\n margin-right: -6px;\n }\n\n ${props.size === \"small\" &&\n css`\n radius: 16px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 20px;\n `}\n `}\n\n ${(props) =>\n (props.variant === \"tertiary\" \|\|\n props.variant === \"text colored\" \|\|\n props.variant === \"option\" \|\|\n props.variant === \"text gray\" \|\|\n props.variant === \"dark transparent\") &&\n css`\n ${StyledLinkElement}:first-child svg {\n margin-left: -4px;\n }\n ${StyledLinkElement}:last-child svg {\n margin-right: -4px;\n }\n\n ${props.size === \"small\" &&\n css`\n radius: 4px;\n `}\n\n ${props.size === \"big\" &&\n css`\n radius: 8px;\n `}\n `}\n`;\n\nexport const StyledLinkElements = styled.div`\n display: flex;\n align-items: center;\n\n ${StyledLinkElement} {\n display: inline-flex;\n svg {\n margin: 0 4px;\n }\n }\n`;\n\nexport const StyledBackLink = styled.a`\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${tw`\n tw-pl-8\n tw-text-xxs\n tw-uppercase\n tw-inline-flex\n tw-align-middle\n tw-pr-4\n tw-text-theme-600\n tw-cursor-pointer\n `}\n\n text-decoration: none;\n border: transparent 1px solid;\n border-radius: 20px;\n height: 32px;\n font-size: 10px;\n font-weight: 500;\n display: table-cell;\n vertical-align: middle;\n\n &:before,\n &:after {\n content: \"\";\n ${tw`\n tw-border-solid\n tw-text-theme-700\n tw-inline-block\n tw-p-0\n tw-w-2\n tw-h-2\n tw-bg-no-repeat\n `}\n border-width: 0 1px 1px 0;\n position: absolute;\n left: 0;\n transition: all ease 0.3s;\n }\n &:before {\n ${tw`tw-opacity-100`}\n transform: translateX(1rem) translateY(0.1rem) rotate(135deg);\n }\n &:after {\n ${tw`tw-opacity-0`}\n transform: translateX(2rem) translateY(0.1rem) rotate(135deg);\n }\n &:hover {\n text-decoration: none;\n border-color: var(--border-primary);\n &:before {\n ${tw`tw-opacity-0`}\n transform: translateX(0rem) translateY(0.1rem) rotate(135deg);\n }\n &:after {\n ${tw`tw-opacity-100`}\n transform: translateX(1rem) translateY(0.1rem) rotate(135deg);\n }\n }\n`;\n\nStyledBackLink.displayName = \"StyledBackLink\";\nStyledLinkElement.displayName = \"StyledLinkElement\";\nStyledLinkElements.displayName = \"StyledLinkElements\";\nStyledLink.displayName = \"StyledLink\";\n"],"mappings":"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"}

package/dist/index.js CHANGED Viewed

@@ -12206,7 +12206,7 @@
   var StyledLink = styled__default["default"].a.withConfig({
     displayName: "Styles__StyledLink",
     componentId: "sc-1c1jdox-1"
-  })(["", " ", " ", " border:none;height:32px;transition:background-color 0.3s ease,box-shadow 0.3s ease,color 0.3s ease,border-color 0.3s ease;svg{fill:currentColor;}&::-moz-focus-inner{border:0;}&:focus{outline:none;}&:hover{text-decoration:none;}", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], FontStyle, BoxSizingStyle, {
+  })(["", " ", " ", " border:none;height:32px;transition:background-color 0.3s ease,box-shadow 0.3s ease,color 0.3s ease,border-color 0.3s ease;svg{fill:currentColor;}&::-moz-focus-inner{border:0;}&:focus{outline:none;}&:hover{text-decoration:none;}", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], FontStyle, BoxSizingStyle, {
     "WebkitFontSmoothing": "antialiased",
     "MozOsxFontSmoothing": "grayscale",
     "fontWeight": "500",
@@ -12237,6 +12237,10 @@
     return props.variant === "dark transparent" && styled.css(["padding:0 8px;background-color:rgba(0,0,0,0.5);border-radius:var(--ac-br-6);color:var(--only-white);&:hover{background-color:rgba(0,0,0,0.85);}&:active{background-color:var(--only-black);}"]);
   }, function (props) {
     return props.variant === "circle raised" && styled.css(["padding:0 6px;background-color:transparent;border-radius:var(--ac-br-rounded);color:var(--color-theme-700);transition:ease 0.3s all;&:hover{background-color:var(--page-paper-main);box-shadow:var(--shadow-tertiary);}&:active{background-color:var(--page-paper-main);box-shadow:var(--shadow-tertiary-hover);}"]);
+  }, function (props) {
+    return props.variant === "text link-primary" && styled.css(["line-height:14px;letter-spacing:0.25px;color:var(--color-primary);text-decoration:underline var(--color-primary);text-underline-offset:3px;height:fit-content;&:hover{text-decoration:none;}&:focus{text-decoration:none;outline:1px solid var(--color-primary);outline-offset:2px;border-radius:2px;}"]);
+  }, function (props) {
+    return props.variant === "text link-default" && styled.css(["line-height:14px;letter-spacing:0.25px;color:var(--color-theme-500);text-decoration:underline var(--color-theme-500);text-underline-offset:3px;height:fit-content;&:hover{text-decoration:none;}&:focus{text-decoration:none;outline:1px solid var(--color-primary);outline-offset:2px;border-radius:2px;}"]);
   }, function (props) {
     return props.$iconOnly && styled.css(["padding:0;width:32px;", " ", ""], props.size === "small" && styled.css(["radius:16px;width:24px;"]), props.size === "big" && styled.css(["radius:20px;width:40px;"]));
   }, function (props) {
@@ -12330,7 +12334,9 @@
       variant: variant,
       size: size,
       $iconOnly: children instanceof Object && !(children instanceof Array)
-    }, args), children instanceof Array ? /*#__PURE__*/React__default["default"].createElement(StyledLinkElements, {
+    }, args, {
+      tabIndex: 1
+    }), children instanceof Array ? /*#__PURE__*/React__default["default"].createElement(StyledLinkElements, {
       className: "c-link__elements"
     }, children.map(function (value, index) {
       return value ? /*#__PURE__*/React__default["default"].createElement(StyledLinkElement, {