fictoan-react 0.39.2 → 0.39.3
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.
- package/CHANGELOG.md +4 -0
- package/dist/cjs/components/Form/Select/Select.styled.js +1 -1
- package/dist/cjs/components/Form/Select/Select.styled.js.map +1 -1
- package/dist/cjs/components/Notifications/NotificationsItem/NotificationItem.d.ts +1 -1
- package/dist/cjs/components/Notifications/NotificationsItem/NotificationItem.js +1 -1
- package/dist/cjs/components/Notifications/NotificationsItem/NotificationItem.js.map +1 -1
- package/dist/cjs/components/Toast/ToastItem/ToastItem.d.ts +1 -1
- package/dist/cjs/components/Toast/ToastItem/ToastItem.js +1 -1
- package/dist/cjs/components/Toast/ToastItem/ToastItem.js.map +1 -1
- package/dist/es/components/Form/Select/Select.styled.js +1 -1
- package/dist/es/components/Form/Select/Select.styled.js.map +1 -1
- package/dist/es/components/Notifications/NotificationsItem/NotificationItem.d.ts +1 -1
- package/dist/es/components/Notifications/NotificationsItem/NotificationItem.js +1 -1
- package/dist/es/components/Notifications/NotificationsItem/NotificationItem.js.map +1 -1
- package/dist/es/components/Toast/ToastItem/ToastItem.d.ts +1 -1
- package/dist/es/components/Toast/ToastItem/ToastItem.js +1 -1
- package/dist/es/components/Toast/ToastItem/ToastItem.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});var t=/*#__PURE__*/e(require("styled-components"));const o=t.default.div.withConfig({displayName:"SelectWrapperStyled",componentId:"-zuatoe"})`position:relative;width:max-content;align-self:flex-start;border-radius:${e=>e.theme.inputField.default.borderRadius};&::after{content:"";display:inline-block;position:absolute;top:50%;right:12px;width:10px;height:10px;border-style:solid;border-width:0 2px 2px 0;transform:translateY(-50%)rotate(45deg);color:${e=>e.theme.select.chevron};transition:transform 0.2s linear;z-index:500;pointer-events:none;}&[disabled]::after{color:${e=>e.theme.inputField.isReadOnly.text};}`,i=t.default.select.withConfig({displayName:"SelectStyled",componentId:"-1o98hth"})`display:flex;height:100%;padding:12px 36px 12px 8px;font-family:${e=>e.theme.text.font.sans};background-color:${e=>e.theme.inputField.default.bg};border-radius
|
|
1
|
+
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});var t=/*#__PURE__*/e(require("styled-components"));const o=t.default.div.withConfig({displayName:"SelectWrapperStyled",componentId:"-zuatoe"})`position:relative;width:max-content;align-self:flex-start;border-radius:${e=>e.theme.inputField.default.borderRadius};&::after{content:"";display:inline-block;position:absolute;top:50%;right:12px;width:10px;height:10px;border-style:solid;border-width:0 2px 2px 0;transform:translateY(-50%)rotate(45deg);color:${e=>e.theme.select.chevron};transition:transform 0.2s linear;z-index:500;pointer-events:none;}&[disabled]::after{color:${e=>e.theme.inputField.isReadOnly.text};}`,i=t.default.select.withConfig({displayName:"SelectStyled",componentId:"-1o98hth"})`display:flex;height:100%;padding:12px 36px 12px 8px;font-family:${e=>e.theme.text.font.sans};background-color:${e=>e.theme.inputField.default.bg};border-radius:${e=>e.theme.inputField.default.borderRadius};align-items:center;border:1px solid ${e=>e.theme.inputField.default.border};width:100%;&:focus{background-color:${e=>e.theme.inputField.onFocus.bg};border:2px solid ${e=>e.theme.inputField.onFocus.border};padding:11px 35px 11px 7px;}`;exports.SelectStyled=i,exports.SelectWrapperStyled=o;
|
|
2
2
|
//# sourceMappingURL=Select.styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.styled.js","sources":["../../../../../src/components/Form/Select/Select.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { SelectProps } from \"./Select\";\n\n\nexport const SelectWrapperStyled = styled.div`\n position
|
|
1
|
+
{"version":3,"file":"Select.styled.js","sources":["../../../../../src/components/Form/Select/Select.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { SelectProps } from \"./Select\";\n\n\nexport const SelectWrapperStyled = styled.div`\n position : relative;\n width : max-content;\n align-self : flex-start;\n border-radius : ${(props : SelectProps) => props.theme.inputField.default.borderRadius};\n\n &::after {\n content : \"\";\n display : inline-block;\n position : absolute;\n top : 50%;\n right : 12px;\n width : 10px;\n height : 10px;\n border-style : solid;\n border-width : 0 2px 2px 0;\n transform : translateY(-50%) rotate(45deg);\n color : ${(props : SelectProps) => props.theme.select.chevron};\n transition : transform 0.2s linear;\n z-index : 500;\n pointer-events : none;\n }\n\n &[disabled]::after {\n color : ${(props : SelectProps) => props.theme.inputField.isReadOnly.text};\n }\n`;\n\nexport const SelectStyled = styled.select`\n display : flex;\n height : 100%;\n padding : 12px 36px 12px 8px;\n font-family : ${(props : SelectProps) => props.theme.text.font.sans};\n background-color : ${(props : SelectProps) => props.theme.inputField.default.bg};\n border-radius : ${(props : SelectProps) => props.theme.inputField.default.borderRadius};\n align-items : center;\n border : 1px solid ${(props : SelectProps) => props.theme.inputField.default.border};\n width : 100%;\n\n &:focus {\n background-color : ${(props : SelectProps) => props.theme.inputField.onFocus.bg};\n border : 2px solid ${(props : SelectProps) => props.theme.inputField.onFocus.border};\n padding : 11px 35px 11px 7px;\n }\n`;\n"],"names":["SelectWrapperStyled","styled","div","props","theme","inputField","default","borderRadius","select","chevron","isReadOnly","text","SelectStyled","font","sans","bg","border","onFocus"],"mappings":"qMAKaA,EAAsBC,UAAOC,oJAInBC,GAAwBA,EAAMC,MAAMC,WAAWC,QAAQC,+MAalDJ,GAAwBA,EAAMC,MAAMI,OAAOC,sGAOpDN,GAAwBA,EAAMC,MAAMC,WAAWK,WAAWC,SAIhEC,EAAeX,UAAOO,yIAITL,GAAwBA,EAAMC,MAAMO,KAAKE,KAAKC,yBAC9CX,GAAwBA,EAAMC,MAAMC,WAAWC,QAAQS,oBACvDZ,GAAwBA,EAAMC,MAAMC,WAAWC,QAAQC,oDAE7CJ,GAAwBA,EAAMC,MAAMC,WAAWC,QAAQU,8CAI7Db,GAAwBA,EAAMC,MAAMC,WAAWY,QAAQF,uBAC7CZ,GAAwBA,EAAMC,MAAMC,WAAWY,QAAQD"}
|
|
@@ -5,7 +5,7 @@ export interface NotificationItemCustomProps {
|
|
|
5
5
|
show: boolean;
|
|
6
6
|
isDismissible?: boolean;
|
|
7
7
|
onCloseCallback: () => void;
|
|
8
|
-
|
|
8
|
+
showFor?: number;
|
|
9
9
|
}
|
|
10
10
|
export declare type NotificationItemElementType = HTMLDivElement;
|
|
11
11
|
export declare type NotificationItemProps = Omit<CommonAndHTMLProps<NotificationItemElementType>, keyof NotificationItemCustomProps> & NotificationItemCustomProps;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../external/Element.js"),t=require("react"),n=require("./NotificationItem.styled.js");function
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../external/Element.js"),t=require("react"),n=require("./NotificationItem.styled.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("styled-components"),require("../../../external/lighten.js"),require("../../../external/rgba.js");var i=/*#__PURE__*/s(t);const o=i.default.forwardRef(((s,o)=>{var{show:a,onCloseCallback:r,kind:l,children:c,isDismissible:d,showFor:u}=s,m=e.__rest(s,["show","onCloseCallback","kind","children","isDismissible","showFor"]);let f=[];const[b,p]=t.useState(a);t.useEffect((()=>{a&&p(!0);const e=a?setTimeout((()=>{r()}),null!=u?u:8e3):void 0;return()=>{clearTimeout(e)}}),[a]),l&&f.push(l),d&&f.push("dismissible");const h=e=>{e.preventDefault(),r()};return b&&i.default.createElement(e.Element,Object.assign({as:n.NotificationsItemStyled,classNames:[...f,a?"":"dismissed"],onTransitionEnd:()=>{a||p(!1)},padding:"nano",marginTop:"nano",marginBottom:"nano"},m),i.default.createElement(e.Element,{as:"div",padding:"nano",className:"notification-content"},c),d&&i.default.createElement("div",{className:"dismiss-button",onClick:h,onKeyDown:h,role:"button",tabIndex:-1}))}));exports.NotificationItem=o;
|
|
2
2
|
//# sourceMappingURL=NotificationItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationItem.js","sources":["../../../../../src/components/Notifications/NotificationsItem/NotificationItem.tsx"],"sourcesContent":["import React, { useState, useEffect, SyntheticEvent } from \"react\";\n\nimport { Element } from \"../../Element/Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { NotificationsItemStyled } from \"./NotificationItem.styled\";\n\n// prettier-ignore\nexport interface NotificationItemCustomProps {\n kind ? : \"info\" | \"warning\" | \"error\" | \"success\";\n show : boolean;\n isDismissible ? : boolean;\n onCloseCallback : () => void;\n
|
|
1
|
+
{"version":3,"file":"NotificationItem.js","sources":["../../../../../src/components/Notifications/NotificationsItem/NotificationItem.tsx"],"sourcesContent":["import React, { useState, useEffect, SyntheticEvent } from \"react\";\n\nimport { Element } from \"../../Element/Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { NotificationsItemStyled } from \"./NotificationItem.styled\";\n\n// prettier-ignore\nexport interface NotificationItemCustomProps {\n kind ? : \"info\" | \"warning\" | \"error\" | \"success\";\n show : boolean;\n isDismissible ? : boolean;\n onCloseCallback : () => void;\n showFor ? : number;\n}\n\nexport type NotificationItemElementType = HTMLDivElement;\nexport type NotificationItemProps = Omit<CommonAndHTMLProps<NotificationItemElementType>, keyof NotificationItemCustomProps> & NotificationItemCustomProps;\n\nexport const NotificationItem = React.forwardRef(\n (\n { show, onCloseCallback, kind, children, isDismissible, showFor, ...props }: NotificationItemProps,\n ref: React.Ref<NotificationItemElementType>\n ) => {\n let classNames = [];\n const [isVisible, setIsVisible] = useState<boolean>(show);\n\n useEffect(() => {\n if (show) {\n setIsVisible(true);\n }\n\n const timer = show\n ? setTimeout(() => {\n onCloseCallback();\n }, showFor ?? 8000)\n : undefined;\n\n return () => {\n clearTimeout(timer);\n };\n }, [show]);\n\n if (kind) {\n classNames.push(kind);\n }\n\n if (isDismissible) {\n classNames.push(\"dismissible\");\n }\n\n const onDismissClick = (event: SyntheticEvent<HTMLDivElement>) => {\n event.preventDefault();\n onCloseCallback();\n };\n\n const onTransitionEnd = () => {\n if (!show) setIsVisible(false);\n };\n\n return (\n isVisible && (\n <Element<NotificationItemElementType>\n as={NotificationsItemStyled}\n classNames={[...classNames, !show ? \"dismissed\" : \"\"]}\n onTransitionEnd={onTransitionEnd}\n padding=\"nano\"\n marginTop=\"nano\"\n marginBottom=\"nano\"\n {...props}\n >\n <Element as=\"div\" padding=\"nano\" className=\"notification-content\">\n {children}\n </Element>\n\n {isDismissible && (\n <div\n className=\"dismiss-button\"\n onClick={onDismissClick}\n onKeyDown={onDismissClick}\n role=\"button\"\n tabIndex={-1}\n />\n )}\n </Element>\n )\n );\n }\n);\n"],"names":["NotificationItem","React","forwardRef","_a","ref","show","onCloseCallback","kind","children","isDismissible","showFor","props","classNames","isVisible","setIsVisible","useState","useEffect","timer","setTimeout","undefined","clearTimeout","push","onDismissClick","event","preventDefault","Element","as","NotificationsItemStyled","onTransitionEnd","padding","marginTop","marginBottom","className","onClick","onKeyDown","role","tabIndex"],"mappings":"+XAmBaA,EAAmBC,UAAMC,YAClC,CACIC,EACAC,SADAC,KAAEA,EAAFC,gBAAQA,EAARC,KAAyBA,EAAzBC,SAA+BA,EAA/BC,cAAyCA,EAAzCC,QAAwDA,KAAYC,aAApE,4EAGIC,EAAa,SACVC,EAAWC,GAAgBC,WAAkBV,GAEpDW,aAAU,KACFX,GACAS,GAAa,SAGXG,EAAQZ,EACRa,YAAW,KACPZ,MACDI,MAAAA,EAAAA,EAAW,UACdS,QAEC,KACHC,aAAaH,MAElB,CAACZ,IAEAE,GACAK,EAAWS,KAAKd,GAGhBE,GACAG,EAAWS,KAAK,qBAGdC,EAAkBC,IACpBA,EAAMC,iBACNlB,YAQAO,GACIZ,wBAACwB,yBACGC,GAAIC,0BACJf,WAAY,IAAIA,EAAaP,EAAqB,GAAd,aACpCuB,gBATY,KACfvB,GAAMS,GAAa,IAShBe,QAAQ,OACRC,UAAU,OACVC,aAAa,QACTpB,GAEJV,wBAACwB,WAAQC,GAAG,MAAMG,QAAQ,OAAOG,UAAU,wBACtCxB,GAGJC,GACGR,+BACI+B,UAAU,iBACVC,QAASX,EACTY,UAAWZ,EACXa,KAAK,SACLC,UAAW"}
|
|
@@ -2,7 +2,7 @@ import React from "react";
|
|
|
2
2
|
import { CommonAndHTMLProps } from "../../Element/constants";
|
|
3
3
|
export interface ToastItemCustomProps {
|
|
4
4
|
show?: boolean;
|
|
5
|
-
|
|
5
|
+
showFor?: number;
|
|
6
6
|
onCloseCallback: () => void;
|
|
7
7
|
}
|
|
8
8
|
export declare type ToastItemElementType = HTMLDivElement;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../external/Element.js"),r=require("react"),t=require("./ToastItem.styled.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("styled-components"),require("../ToastsWrapper/ToastsWrapper.styled.js"),require("../../Sidebar/SidebarWrapper/SidebarWrapper.styled.js"),require("../../Sidebar/SidebarHeader/SidebarHeader.styled.js"),require("../../Sidebar/SidebarItem/SidebarItem.styled.js"),require("../../Sidebar/SidebarItemText/SidebarItemText.styled.js"),require("../../Sidebar/SidebarItemIcon/SidebarItemIcon.styled.js"),require("../../Sidebar/SidebarFooter/SidebarFooter.styled.js"),require("../../ContentWrapper/ContentWrapper.styled.js");var s=/*#__PURE__*/a(r);const i=s.default.forwardRef(((a,i)=>{var{show:d,children:o,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../external/Element.js"),r=require("react"),t=require("./ToastItem.styled.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("styled-components"),require("../ToastsWrapper/ToastsWrapper.styled.js"),require("../../Sidebar/SidebarWrapper/SidebarWrapper.styled.js"),require("../../Sidebar/SidebarHeader/SidebarHeader.styled.js"),require("../../Sidebar/SidebarItem/SidebarItem.styled.js"),require("../../Sidebar/SidebarItemText/SidebarItemText.styled.js"),require("../../Sidebar/SidebarItemIcon/SidebarItemIcon.styled.js"),require("../../Sidebar/SidebarFooter/SidebarFooter.styled.js"),require("../../ContentWrapper/ContentWrapper.styled.js");var s=/*#__PURE__*/a(r);const i=s.default.forwardRef(((a,i)=>{var{show:d,children:o,showFor:n,onCloseCallback:l}=a,u=e.__rest(a,["show","children","showFor","onCloseCallback"]);const[b,c]=r.useState(d);r.useEffect((()=>{d&&c(!0);const e=d?setTimeout((()=>{l()}),null!=n?n:4e3):void 0;return()=>{clearTimeout(e)}}),[d]);return b&&s.default.createElement(e.Element,Object.assign({as:t.ToastItemStyled,classNames:[d?"visible":""],onTransitionEnd:()=>{d||c(!1)},padding:"nano"},u),o)}));exports.ToastItem=i;
|
|
2
2
|
//# sourceMappingURL=ToastItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastItem.js","sources":["../../../../../src/components/Toast/ToastItem/ToastItem.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\n\nimport { Element } from \"../../Element/Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { ToastItemStyled } from \"./ToastItem.styled\";\n\n// prettier-ignore\nexport interface ToastItemCustomProps {\n show ? : boolean;\n
|
|
1
|
+
{"version":3,"file":"ToastItem.js","sources":["../../../../../src/components/Toast/ToastItem/ToastItem.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\n\nimport { Element } from \"../../Element/Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { ToastItemStyled } from \"./ToastItem.styled\";\n\n// prettier-ignore\nexport interface ToastItemCustomProps {\n show ? : boolean;\n showFor ? : number;\n onCloseCallback : () => void;\n}\n\nexport type ToastItemElementType = HTMLDivElement;\nexport type ToastItemProps = Omit<CommonAndHTMLProps<ToastItemElementType>, keyof ToastItemCustomProps> & ToastItemCustomProps;\n\nexport const ToastItem = React.forwardRef(\n (\n { show, children, showFor, onCloseCallback, ...props }: ToastItemProps,\n ref: React.Ref<ToastItemElementType>\n ) => {\n let classNames: string[] = [];\n const [isVisible, setIsVisible] = useState<boolean>(show);\n\n useEffect(() => {\n if (show) { setIsVisible(true); }\n\n const timer = show\n ? setTimeout(() => {\n onCloseCallback();\n }, showFor ?? 4000)\n : undefined;\n\n return () => {\n clearTimeout(timer);\n };\n }, [show]);\n\n const onTransitionEnd = () => {\n if (!show) setIsVisible(false);\n };\n\n return (\n isVisible && (\n <Element<ToastItemElementType>\n as={ToastItemStyled}\n classNames={[...classNames, show ? \"visible\" : \"\"]}\n onTransitionEnd={onTransitionEnd}\n padding=\"nano\"\n {...props}\n >\n {children}\n </Element>\n )\n );\n }\n);\n"],"names":["ToastItem","React","forwardRef","_a","ref","show","children","showFor","onCloseCallback","props","isVisible","setIsVisible","useState","useEffect","timer","setTimeout","undefined","clearTimeout","Element","as","ToastItemStyled","classNames","onTransitionEnd","padding"],"mappings":"wxBAiBaA,EAAYC,UAAMC,YAC3B,CACIC,EACAC,SADAC,KAAEA,EAAFC,SAAQA,EAARC,QAAkBA,EAAlBC,gBAA2BA,KAAoBC,aAA/C,uDAIOC,EAAWC,GAAgBC,WAAkBP,GAEpDQ,aAAU,KACFR,GAAQM,GAAa,SAEnBG,EAAQT,EACRU,YAAW,KACTP,MACDD,MAAAA,EAAAA,EAAW,UACZS,QAEC,KACHC,aAAaH,MAElB,CAACT,WAOAK,GACIT,wBAACiB,yBACGC,GAAIC,kBACJC,WAAY,CAAgBhB,EAAO,UAAY,IAC/CiB,gBATY,KACfjB,GAAMM,GAAa,IAShBY,QAAQ,QACJd,GAEHH"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"styled-components";const t=e.div.withConfig({displayName:"SelectWrapperStyled",componentId:"-zuatoe"})`position:relative;width:max-content;align-self:flex-start;border-radius:${e=>e.theme.inputField.default.borderRadius};&::after{content:"";display:inline-block;position:absolute;top:50%;right:12px;width:10px;height:10px;border-style:solid;border-width:0 2px 2px 0;transform:translateY(-50%)rotate(45deg);color:${e=>e.theme.select.chevron};transition:transform 0.2s linear;z-index:500;pointer-events:none;}&[disabled]::after{color:${e=>e.theme.inputField.isReadOnly.text};}`,o=e.select.withConfig({displayName:"SelectStyled",componentId:"-1o98hth"})`display:flex;height:100%;padding:12px 36px 12px 8px;font-family:${e=>e.theme.text.font.sans};background-color:${e=>e.theme.inputField.default.bg};border-radius
|
|
1
|
+
import e from"styled-components";const t=e.div.withConfig({displayName:"SelectWrapperStyled",componentId:"-zuatoe"})`position:relative;width:max-content;align-self:flex-start;border-radius:${e=>e.theme.inputField.default.borderRadius};&::after{content:"";display:inline-block;position:absolute;top:50%;right:12px;width:10px;height:10px;border-style:solid;border-width:0 2px 2px 0;transform:translateY(-50%)rotate(45deg);color:${e=>e.theme.select.chevron};transition:transform 0.2s linear;z-index:500;pointer-events:none;}&[disabled]::after{color:${e=>e.theme.inputField.isReadOnly.text};}`,o=e.select.withConfig({displayName:"SelectStyled",componentId:"-1o98hth"})`display:flex;height:100%;padding:12px 36px 12px 8px;font-family:${e=>e.theme.text.font.sans};background-color:${e=>e.theme.inputField.default.bg};border-radius:${e=>e.theme.inputField.default.borderRadius};align-items:center;border:1px solid ${e=>e.theme.inputField.default.border};width:100%;&:focus{background-color:${e=>e.theme.inputField.onFocus.bg};border:2px solid ${e=>e.theme.inputField.onFocus.border};padding:11px 35px 11px 7px;}`;export{o as SelectStyled,t as SelectWrapperStyled};
|
|
2
2
|
//# sourceMappingURL=Select.styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.styled.js","sources":["../../../../../src/components/Form/Select/Select.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { SelectProps } from \"./Select\";\n\n\nexport const SelectWrapperStyled = styled.div`\n position
|
|
1
|
+
{"version":3,"file":"Select.styled.js","sources":["../../../../../src/components/Form/Select/Select.styled.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { SelectProps } from \"./Select\";\n\n\nexport const SelectWrapperStyled = styled.div`\n position : relative;\n width : max-content;\n align-self : flex-start;\n border-radius : ${(props : SelectProps) => props.theme.inputField.default.borderRadius};\n\n &::after {\n content : \"\";\n display : inline-block;\n position : absolute;\n top : 50%;\n right : 12px;\n width : 10px;\n height : 10px;\n border-style : solid;\n border-width : 0 2px 2px 0;\n transform : translateY(-50%) rotate(45deg);\n color : ${(props : SelectProps) => props.theme.select.chevron};\n transition : transform 0.2s linear;\n z-index : 500;\n pointer-events : none;\n }\n\n &[disabled]::after {\n color : ${(props : SelectProps) => props.theme.inputField.isReadOnly.text};\n }\n`;\n\nexport const SelectStyled = styled.select`\n display : flex;\n height : 100%;\n padding : 12px 36px 12px 8px;\n font-family : ${(props : SelectProps) => props.theme.text.font.sans};\n background-color : ${(props : SelectProps) => props.theme.inputField.default.bg};\n border-radius : ${(props : SelectProps) => props.theme.inputField.default.borderRadius};\n align-items : center;\n border : 1px solid ${(props : SelectProps) => props.theme.inputField.default.border};\n width : 100%;\n\n &:focus {\n background-color : ${(props : SelectProps) => props.theme.inputField.onFocus.bg};\n border : 2px solid ${(props : SelectProps) => props.theme.inputField.onFocus.border};\n padding : 11px 35px 11px 7px;\n }\n`;\n"],"names":["SelectWrapperStyled","styled","div","props","theme","inputField","default","borderRadius","select","chevron","isReadOnly","text","SelectStyled","font","sans","bg","border","onFocus"],"mappings":"uCAKaA,EAAsBC,EAAOC,oJAInBC,GAAwBA,EAAMC,MAAMC,WAAWC,QAAQC,+MAalDJ,GAAwBA,EAAMC,MAAMI,OAAOC,sGAOpDN,GAAwBA,EAAMC,MAAMC,WAAWK,WAAWC,SAIhEC,EAAeX,EAAOO,yIAITL,GAAwBA,EAAMC,MAAMO,KAAKE,KAAKC,yBAC9CX,GAAwBA,EAAMC,MAAMC,WAAWC,QAAQS,oBACvDZ,GAAwBA,EAAMC,MAAMC,WAAWC,QAAQC,oDAE7CJ,GAAwBA,EAAMC,MAAMC,WAAWC,QAAQU,8CAI7Db,GAAwBA,EAAMC,MAAMC,WAAWY,QAAQF,uBAC7CZ,GAAwBA,EAAMC,MAAMC,WAAWY,QAAQD"}
|
|
@@ -5,7 +5,7 @@ export interface NotificationItemCustomProps {
|
|
|
5
5
|
show: boolean;
|
|
6
6
|
isDismissible?: boolean;
|
|
7
7
|
onCloseCallback: () => void;
|
|
8
|
-
|
|
8
|
+
showFor?: number;
|
|
9
9
|
}
|
|
10
10
|
export declare type NotificationItemElementType = HTMLDivElement;
|
|
11
11
|
export declare type NotificationItemProps = Omit<CommonAndHTMLProps<NotificationItemElementType>, keyof NotificationItemCustomProps> & NotificationItemCustomProps;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{_ as e,E as
|
|
1
|
+
import{_ as e,E as n}from"../../../external/Element.js";import s,{useState as o,useEffect as t}from"react";import{NotificationsItemStyled as i}from"./NotificationItem.styled.js";import"styled-components";import"../../../external/lighten.js";import"../../../external/rgba.js";const a=/*#__PURE__*/s.forwardRef(((a,r)=>{var{show:l,onCloseCallback:m,kind:c,children:d,isDismissible:p,showFor:b}=a,u=e(a,["show","onCloseCallback","kind","children","isDismissible","showFor"]);let h=[];const[f,g]=o(l);t((()=>{l&&g(!0);const e=l?setTimeout((()=>{m()}),null!=b?b:8e3):void 0;return()=>{clearTimeout(e)}}),[l]),c&&h.push(c),p&&h.push("dismissible");const w=e=>{e.preventDefault(),m()};return f&&/*#__PURE__*/s.createElement(n,Object.assign({as:i,classNames:[...h,l?"":"dismissed"],onTransitionEnd:()=>{l||g(!1)},padding:"nano",marginTop:"nano",marginBottom:"nano"},u),/*#__PURE__*/s.createElement(n,{as:"div",padding:"nano",className:"notification-content"},d),p&&/*#__PURE__*/s.createElement("div",{className:"dismiss-button",onClick:w,onKeyDown:w,role:"button",tabIndex:-1}))}));export{a as NotificationItem};
|
|
2
2
|
//# sourceMappingURL=NotificationItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationItem.js","sources":["../../../../../src/components/Notifications/NotificationsItem/NotificationItem.tsx"],"sourcesContent":["import React, { useState, useEffect, SyntheticEvent } from \"react\";\n\nimport { Element } from \"../../Element/Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { NotificationsItemStyled } from \"./NotificationItem.styled\";\n\n// prettier-ignore\nexport interface NotificationItemCustomProps {\n kind ? : \"info\" | \"warning\" | \"error\" | \"success\";\n show : boolean;\n isDismissible ? : boolean;\n onCloseCallback : () => void;\n
|
|
1
|
+
{"version":3,"file":"NotificationItem.js","sources":["../../../../../src/components/Notifications/NotificationsItem/NotificationItem.tsx"],"sourcesContent":["import React, { useState, useEffect, SyntheticEvent } from \"react\";\n\nimport { Element } from \"../../Element/Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { NotificationsItemStyled } from \"./NotificationItem.styled\";\n\n// prettier-ignore\nexport interface NotificationItemCustomProps {\n kind ? : \"info\" | \"warning\" | \"error\" | \"success\";\n show : boolean;\n isDismissible ? : boolean;\n onCloseCallback : () => void;\n showFor ? : number;\n}\n\nexport type NotificationItemElementType = HTMLDivElement;\nexport type NotificationItemProps = Omit<CommonAndHTMLProps<NotificationItemElementType>, keyof NotificationItemCustomProps> & NotificationItemCustomProps;\n\nexport const NotificationItem = React.forwardRef(\n (\n { show, onCloseCallback, kind, children, isDismissible, showFor, ...props }: NotificationItemProps,\n ref: React.Ref<NotificationItemElementType>\n ) => {\n let classNames = [];\n const [isVisible, setIsVisible] = useState<boolean>(show);\n\n useEffect(() => {\n if (show) {\n setIsVisible(true);\n }\n\n const timer = show\n ? setTimeout(() => {\n onCloseCallback();\n }, showFor ?? 8000)\n : undefined;\n\n return () => {\n clearTimeout(timer);\n };\n }, [show]);\n\n if (kind) {\n classNames.push(kind);\n }\n\n if (isDismissible) {\n classNames.push(\"dismissible\");\n }\n\n const onDismissClick = (event: SyntheticEvent<HTMLDivElement>) => {\n event.preventDefault();\n onCloseCallback();\n };\n\n const onTransitionEnd = () => {\n if (!show) setIsVisible(false);\n };\n\n return (\n isVisible && (\n <Element<NotificationItemElementType>\n as={NotificationsItemStyled}\n classNames={[...classNames, !show ? \"dismissed\" : \"\"]}\n onTransitionEnd={onTransitionEnd}\n padding=\"nano\"\n marginTop=\"nano\"\n marginBottom=\"nano\"\n {...props}\n >\n <Element as=\"div\" padding=\"nano\" className=\"notification-content\">\n {children}\n </Element>\n\n {isDismissible && (\n <div\n className=\"dismiss-button\"\n onClick={onDismissClick}\n onKeyDown={onDismissClick}\n role=\"button\"\n tabIndex={-1}\n />\n )}\n </Element>\n )\n );\n }\n);\n"],"names":["NotificationItem","React","forwardRef","_a","ref","show","onCloseCallback","kind","children","isDismissible","showFor","props","classNames","isVisible","setIsVisible","useState","useEffect","timer","setTimeout","undefined","clearTimeout","push","onDismissClick","event","preventDefault","Element","as","NotificationsItemStyled","onTransitionEnd","padding","marginTop","marginBottom","className","onClick","onKeyDown","role","tabIndex"],"mappings":"yRAmBaA,eAAmBC,EAAMC,YAClC,CACIC,EACAC,SADAC,KAAEA,EAAFC,gBAAQA,EAARC,KAAyBA,EAAzBC,SAA+BA,EAA/BC,cAAyCA,EAAzCC,QAAwDA,KAAYC,MAApE,4EAGIC,EAAa,SACVC,EAAWC,GAAgBC,EAAkBV,GAEpDW,GAAU,KACFX,GACAS,GAAa,SAGXG,EAAQZ,EACRa,YAAW,KACPZ,MACDI,MAAAA,EAAAA,EAAW,UACdS,QAEC,KACHC,aAAaH,MAElB,CAACZ,IAEAE,GACAK,EAAWS,KAAKd,GAGhBE,GACAG,EAAWS,KAAK,qBAGdC,EAAkBC,IACpBA,EAAMC,iBACNlB,YAQAO,gBACIZ,gBAACwB,iBACGC,GAAIC,EACJf,WAAY,IAAIA,EAAaP,EAAqB,GAAd,aACpCuB,gBATY,KACfvB,GAAMS,GAAa,IAShBe,QAAQ,OACRC,UAAU,OACVC,aAAa,QACTpB,gBAEJV,gBAACwB,GAAQC,GAAG,MAAMG,QAAQ,OAAOG,UAAU,wBACtCxB,GAGJC,gBACGR,uBACI+B,UAAU,iBACVC,QAASX,EACTY,UAAWZ,EACXa,KAAK,SACLC,UAAW"}
|
|
@@ -2,7 +2,7 @@ import React from "react";
|
|
|
2
2
|
import { CommonAndHTMLProps } from "../../Element/constants";
|
|
3
3
|
export interface ToastItemCustomProps {
|
|
4
4
|
show?: boolean;
|
|
5
|
-
|
|
5
|
+
showFor?: number;
|
|
6
6
|
onCloseCallback: () => void;
|
|
7
7
|
}
|
|
8
8
|
export declare type ToastItemElementType = HTMLDivElement;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{_ as e,E as r}from"../../../external/Element.js";import t,{useState as
|
|
1
|
+
import{_ as e,E as r}from"../../../external/Element.js";import t,{useState as o,useEffect as a}from"react";import{ToastItemStyled as s}from"./ToastItem.styled.js";import"styled-components";import"../ToastsWrapper/ToastsWrapper.styled.js";import"../../Sidebar/SidebarWrapper/SidebarWrapper.styled.js";import"../../Sidebar/SidebarHeader/SidebarHeader.styled.js";import"../../Sidebar/SidebarItem/SidebarItem.styled.js";import"../../Sidebar/SidebarItemText/SidebarItemText.styled.js";import"../../Sidebar/SidebarItemIcon/SidebarItemIcon.styled.js";import"../../Sidebar/SidebarFooter/SidebarFooter.styled.js";import"../../ContentWrapper/ContentWrapper.styled.js";const i=/*#__PURE__*/t.forwardRef(((i,d)=>{var{show:n,children:m,showFor:p,onCloseCallback:l}=i,b=e(i,["show","children","showFor","onCloseCallback"]);const[S,c]=o(n);a((()=>{n&&c(!0);const e=n?setTimeout((()=>{l()}),null!=p?p:4e3):void 0;return()=>{clearTimeout(e)}}),[n]);return S&&/*#__PURE__*/t.createElement(r,Object.assign({as:s,classNames:[n?"visible":""],onTransitionEnd:()=>{n||c(!1)},padding:"nano"},b),m)}));export{i as ToastItem};
|
|
2
2
|
//# sourceMappingURL=ToastItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastItem.js","sources":["../../../../../src/components/Toast/ToastItem/ToastItem.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\n\nimport { Element } from \"../../Element/Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { ToastItemStyled } from \"./ToastItem.styled\";\n\n// prettier-ignore\nexport interface ToastItemCustomProps {\n show ? : boolean;\n
|
|
1
|
+
{"version":3,"file":"ToastItem.js","sources":["../../../../../src/components/Toast/ToastItem/ToastItem.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\n\nimport { Element } from \"../../Element/Element\";\nimport { CommonAndHTMLProps } from \"../../Element/constants\";\n\nimport { ToastItemStyled } from \"./ToastItem.styled\";\n\n// prettier-ignore\nexport interface ToastItemCustomProps {\n show ? : boolean;\n showFor ? : number;\n onCloseCallback : () => void;\n}\n\nexport type ToastItemElementType = HTMLDivElement;\nexport type ToastItemProps = Omit<CommonAndHTMLProps<ToastItemElementType>, keyof ToastItemCustomProps> & ToastItemCustomProps;\n\nexport const ToastItem = React.forwardRef(\n (\n { show, children, showFor, onCloseCallback, ...props }: ToastItemProps,\n ref: React.Ref<ToastItemElementType>\n ) => {\n let classNames: string[] = [];\n const [isVisible, setIsVisible] = useState<boolean>(show);\n\n useEffect(() => {\n if (show) { setIsVisible(true); }\n\n const timer = show\n ? setTimeout(() => {\n onCloseCallback();\n }, showFor ?? 4000)\n : undefined;\n\n return () => {\n clearTimeout(timer);\n };\n }, [show]);\n\n const onTransitionEnd = () => {\n if (!show) setIsVisible(false);\n };\n\n return (\n isVisible && (\n <Element<ToastItemElementType>\n as={ToastItemStyled}\n classNames={[...classNames, show ? \"visible\" : \"\"]}\n onTransitionEnd={onTransitionEnd}\n padding=\"nano\"\n {...props}\n >\n {children}\n </Element>\n )\n );\n }\n);\n"],"names":["ToastItem","React","forwardRef","_a","ref","show","children","showFor","onCloseCallback","props","isVisible","setIsVisible","useState","useEffect","timer","setTimeout","undefined","clearTimeout","Element","as","ToastItemStyled","classNames","onTransitionEnd","padding"],"mappings":"wpBAiBaA,eAAYC,EAAMC,YAC3B,CACIC,EACAC,SADAC,KAAEA,EAAFC,SAAQA,EAARC,QAAkBA,EAAlBC,gBAA2BA,KAAoBC,MAA/C,uDAIOC,EAAWC,GAAgBC,EAAkBP,GAEpDQ,GAAU,KACFR,GAAQM,GAAa,SAEnBG,EAAQT,EACRU,YAAW,KACTP,MACDD,MAAAA,EAAAA,EAAW,UACZS,QAEC,KACHC,aAAaH,MAElB,CAACT,WAOAK,gBACIT,gBAACiB,iBACGC,GAAIC,EACJC,WAAY,CAAgBhB,EAAO,UAAY,IAC/CiB,gBATY,KACfjB,GAAMM,GAAa,IAShBY,QAAQ,QACJd,GAEHH"}
|