@inntechcorp/it-design 4.0.0-beta.2 → 4.0.0-beta.4

package/dist/es/notification/container/styled.js

@@ -1,26 +0,0 @@
-import t,{css as o}from"styled-components";const e=t.div`
-  
-  position: fixed;
-  overflow: hidden;
-  z-index: 6;
-  padding: 30px;
-  pointer-events: none;
-
-  ${({$position:t})=>{return"topLeft"===(e=t)?o`
-      left: 0;
-      top: 0;
-    `:"topRight"===e?o`
-      right: 0;
-      top: 0;
-    `:"bottomRight"===e?o`
-      right: 0;
-      bottom: 0;
-    `:"bottomLeft"===e?o`
-      left: 0;
-      bottom: 0;
-    `:o`
-    left: 0;
-    top: 0;
-  `;var e}}
-
-  `;export{e as Wrapper};

package/dist/es/notification/context/NotificationsContext.js

@@ -1 +0,0 @@
-import{createContext as t}from"react";const o=t({});o.displayName="ITDNotificationContext";export{o as default};

package/dist/es/notification/index.js

@@ -1 +0,0 @@
-import{jsxs as t,jsx as i}from"react/jsx-runtime";import{useContext as o,useState as e,useCallback as n}from"react";import r from"./container/Container.js";import a from"./context/NotificationsContext.js";import d from"../node_modules/lodash-es/uniqueId.js";const c=({children:o})=>{const[c,m]=e([]),s=n(({id:t=d("itd-notification"),title:i="",description:o="",placement:e="topRight",autoHide:n=!0,delay:r=3e3,type:a="default"})=>{m(d=>[...d,{id:t,title:i,description:o,placement:e,autoHide:n,delay:r,type:a}])},[m]),f=n(t=>{m(i=>i.filter(i=>i.id!==t))},[m]);return t(a.Provider,{value:{addNotification:s,removeNotification:f},children:[i(r,{notifications:c,onRemove:f}),o]})},m=()=>o(a),s={useNotifications:m};export{c as NotificationProvider,s as default,m as useNotifications};

package/dist/es/notification/item/Item.js

@@ -1 +0,0 @@
-import t,{useEffect as e}from"react";import{Wrapper as i,Title as o,Description as a}from"./styled.js";const l=({id:l,children:n,style:c,autoHide:r=!0,delay:s=3e3,type:m="default",title:d="",description:f="",onRemove:u=null})=>{e(()=>{let t;return r&&(t=setTimeout(()=>{u(l)},s)),()=>{clearTimeout(t)}},[l]);return t.createElement(i,{key:l,$type:m,style:c,onClick:()=>{u(l)},className:"itd-notification-item itd-notification-"+m},t.createElement(o,{className:"itd-notification-title"},d),t.createElement(a,{className:"itd-notification-description"},f))};export{l as default};

package/dist/es/notification/item/styled.js

@@ -1,42 +0,0 @@
-import o,{css as r}from"styled-components";import{a as f}from"../../node_modules/@react-spring/web/dist/react-spring_web.modern.js";const e=o(f.div)`
-  
-  margin-bottom: 10px;
-  max-width: 300px;
-
-  font-size: 12px;
-  position: relative;
-  padding: 16px;
-  border-radius: 3px;
-  word-break: break-word;
-  cursor: pointer;
-  pointer-events: auto;
-
-  ${({$type:o})=>{return"error"===(f=o)?r`
-      background: #f8285a;
-      ${t} { color: #ffffff; }
-      ${n} { color: #ffffffBF; }
-    `:"default"===f||"success"===f?r`
-      background: #0bab65;
-      ${t} { color: #2b2b2b; }
-      ${n} { color: #2b2b2bBF; }
-    `:"warning"===f?r`
-      background: #cfe10c;
-      ${t} { color: #2b2b2b; }
-      ${n} { color: #2b2b2bBF; }
-    `:r`
-    background: #f8285a;
-    ${t} { color: #ffffff; }
-    ${n} { color: #ffffffBF; }
-  `;var f}}
-
-  `,t=o.div`
-  
-  font-size: 13px;
-  font-weight: 600;
-
-  `,n=o.div`
-  
-  font-size: 12px;
-  font-weight: normal;
-
-  `;export{n as Description,t as Title,e as Wrapper};

package/dist/es/progress/styled.js

@@ -1,59 +0,0 @@
-import e,{css as i}from"styled-components";const r={normal:{background:"#1B84FF",remaining:"#efefef"},active:{background:"#1B84FF",remaining:"#efefef"},success:{background:"#17C653",remaining:"#efefef"},exception:{background:"#F8285A",remaining:"#efefef"}},t=e.div`
-
-  position: relative;
-  width: 100%;
-
-  .itd-progress-outer {
-    
-    width: 100%;
-    min-height: 20px;
-    margin: 0;
-    padding: 0;
-    list-style: none;
-
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    gap: 10px;
-
-    .itd-progress-status {
-      display: flex;
-      align-items: center;
-      .itd-progress-status-text {
-        color: #071437;
-      }
-    }
-
-    .itd-progress-inner {
-
-      position: relative;
-      display: inline-block;
-      width: 100%;
-      flex: 1;
-      overflow: hidden;
-      vertical-align: middle;
-      border-radius: 6px;
-
-      .itd-progress-bg {
-        transition: all 0.25s ease-out;
-        width: ${e=>e.$percent+"%"};
-        height: 8px;
-      }
-      
-    }
-
-  }
-
-  ${({$status:e})=>{return i`
-      .itd-progress-inner {
-        background: ${r[t=e].remaining};
-        .itd-progress-bg {
-          background: ${r[t].background};
-        }
-      }
-      .itd-progress-status {
-        color: ${r[t].background};
-      }
-    `;var t}}
-
-`;export{t as Wrapper};

package/dist/es/radio/button/RadioButton.js

@@ -1 +0,0 @@
-import{jsxs as r,jsx as t}from"react/jsx-runtime";import{useId as e,useMemo as o,cloneElement as i}from"react";import s from"../../image/index.js";import"../../context/ITDContext.js";import"../../helpers/theme/cssVariables.js";import"../../helpers/theme/light.js";import"../../helpers/theme/dark.js";import"../../helpers/theme/tokens.js";import"../../enums/enum.js";import"../../utils/InlineSVGCached.js";import"../../helpers/svg/styles.js";import"../../helpers/datetime/dayjsSetup.js";import"../../logger/index.js";import"react-router-dom";import"axios";import"../../html/header/styled.js";import"../../select/index.js";import"../../form/index.js";import"../../checkbox/index.js";import"../../accordion/index.js";import"../../calendar/day/styled.js";import"../../calendar/header/styled.js";import"../../calendar/styled.js";import"../../datepicker/index.js";import"../../input/index.js";import"../../textarea/index.js";import"../../switch/index.js";import"../../upload/index.js";import"react-dom";import"react-transition-group";import d from"../../button/index.js";import"../../modal/modal/styled.js";import"../../modal/container/styled.js";import"../../modal/context/ModalContext.js";import"../../notification/context/NotificationsContext.js";import"../index.js";import"../../alert/index.js";import"../../result/index.js";import"../../alink/index.js";import"../../back-top/styled.js";import"../../progress/styled.js";import"../../node_modules/overlayscrollbars/styles/overlayscrollbars.css.js";import"../../tinyscrollbar/scroll.styled.js";import"../../label/index.js";import"../../card/Card.js";import"../../card/CardHeader.js";import"../../card/CardTitle.js";import"../../card/CardDescription.js";import"../../card/CardAction.js";import"../../card/CardTabs.js";import"../../card/CardContent.js";import"../../card/CardFooter.js";import"../../popover/PopoverContent.js";import"../../popover/Popover.js";import"../../popover/PopoverTrigger.js";import"../../tooltip/Tooltip.js";import"../../tooltip/TooltipTrigger.js";import"../../tooltip/TooltipContent.js";import"../../hovercard/HoverCard.js";import"../../hovercard/HoverCardTrigger.js";import"../../hovercard/HoverCardContent.js";import"../../table/index.js";import"../../flex/styled.js";import{Wrapper as a,Label as l,ErrorBorder as n,InnerButton as p,Left as m,CheckIcon as c,PreIcon as j}from"./styled.js";function h({id:h,name:u="",value:x="",type:C="default",buttonProps:b={},checked:y=!1,hasError:g=!1,className:v="",children:k=null,icon:f=null,image:N=null,component:T=null,onChange:P=()=>{}}){const H=e(),w=o(()=>h||"itd-radio-button-"+H,[h]),D=()=>{console.log("handleOnChange",x),P&&P(x)},F=o(()=>{let r="itd-radio";return y&&(r+=" itd-radio-selected"),g&&(r+=" itd-radio-error"),""!==v&&(r+=" "+v),r},[y,g,v]),I=o(()=>{let r="itd-radio-label";return y&&(r+=" itd-radio-label-selected"),g&&(r+=" itd-radio-label-error"),r},[y,g]);return r(a,{className:F,$hasCustomButton:!T,children:[t("input",{type:"radio",onChange:D,id:w,name:u,value:x,checked:y,"aria-checked":y}),r(l,{className:I,htmlFor:w,children:[null!==T?t("div",{className:"itd-radio-custom-button",children:(()=>{const r={checked:y,value:x,icon:f,children:k};return"childProps"in T?.props&&(r.childProps={...T?.props?.childProps||{},checked:y,value:x,icon:f,children:k}),i(T,r)})()}):"default"===C?r(p,{className:"itd-radio-default-button",children:[r(m,{className:"itd-radio-content",children:[f?t(j,{className:"itd-icon itd-pre-icon "+f}):N?t(s,{className:"itd-image",src:N,height:"20",brokenHeight:"20"}):null,t("span",{children:k})]}),y?t(c,{className:"itd-icon itd-check-icon it-web-check"}):null]}):"primary"===C?t(d,{className:"itd-radio-primary-button"+(y?" itd-button-selected":""),onClick:D,...b,children:t("span",{children:k})}):t("span",{children:k}),g?t(n,{className:"itd-error-border"}):null]})]})}export{h as default};

package/dist/es/radio/button/styled.js

@@ -1,133 +0,0 @@
-import o,{keyframes as e,css as t}from"styled-components";const r=e`
-  0% { transform: scale(.2) rotate(-5deg);}
-  50% { transform: scale(1.3) rotate(5deg);}
-  60% { transform: scale(0.9) rotate(0deg);}
-  80% { transform: scale(1) }
-  100% { transform: scale(1) }
-`,i=o.div`
-  right: 10px;
-  position: absolute;
-  font-size: 20px;
-  color: #3395FA;
-  animation: ${r} 0.75s;
-`,n=o.div`
-  color: #ffffff80;
-  font-size: 20px;
-  margin-right: 4px;
-`,s=o.div`
-  display: flex;
-`,a=o.label`
-  position: relative;
-  height: 100%;
-  width: 100%;
-`,p=o.div`
-
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-
-  span {
-    transition: color 0.2s ease;
-    pointer-events: none;
-    color: #ffffff80;
-    font-size: 13px;
-  }
-
-`,d=o.div`
-
-  border: solid 1px transparent;
-  transition: border-color 0.2s ease;
-  border: 1px solid #DBDFE9;
-  border-radius: 6px;
-  padding: 0 15px;
-
-  height: 46px;
-  width: 100%;
-
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  justify-content: center;
-
-  span {
-    pointer-events: none;
-    color: #071437;
-    font-size: 13px;
-  }
-
-`,l=o.div`
-
-  position: relative;
-
-  input[type=radio] {
-    
-    position: absolute;
-    top: 0;
-    left: 0;
-    visibility: hidden;
-    pointer-events: none;
-    height: 100%;
-
-  }
-
-  ${({$hasCustomButton:o})=>o&&t`
-
-    &:hover:not(&.itd-radio-selected) {
-      ${d} {
-        border-color: #ADB1BB;
-    }
-    ${p} {
-      span {
-        color: #071437;
-      }
-    }
-  }
-
-  input[type=radio] {
-
-    &:checked {
-
-      + ${a} {
-
-        ${d} {
-          
-          border: solid 1px #3598fe;
-
-          span {
-            color: #3598fe;
-          }
-
-          .preIcon {
-            color: #3598fe;
-          }
-          
-        }
-
-        ${p} {
-          span {
-            color: #3598fe;
-          }
-        }
-
-      }
-
-    }
-
-  }
-
-  `}
-
-`,f=o.div`
-
-  position: absolute;
-  border: 1px solid var(--itd-color-error-border);
-  width: 100%;
-  height: 100%;
-  border-radius: 6px;
-  top: 0;
-  left: 0;
-  pointer-events: none;
-  /* z-index: 1; */
-
-`;export{i as CheckIcon,f as ErrorBorder,d as InnerButton,a as Label,s as Left,n as PreIcon,p as SimpleButton,l as Wrapper};

package/dist/es/radio/group/Group.js

@@ -1 +0,0 @@
-import{jsx as r}from"react/jsx-runtime";import e,{forwardRef as o,useId as t,useMemo as n,useState as a,useEffect as l,useImperativeHandle as i,memo as u,Children as p,cloneElement as d}from"react";import{GroupWrapper as s}from"./styled.js";import c from"../button/RadioButton.js";var m=u(o(({id:o,name:u="",message:m="",type:g="default",defaultValue:h="",value:f="",buttonProps:y={},className:$="",direction:V="column",gap:b="10px",length:j=3,onlyFlow:v=!1,autoSize:x=!1,onChange:E=null,onUpdate:w=null,children:z=null},C)=>{const F=t(),N=n(()=>o||"itd-radio-group-"+F,[o]),[P,S]=a(m),[k,B]=a("");l(()=>{h&&(B(h),R(h))},[]),l(()=>{B(f),R(f)},[f]);const R=(r,e=!0,o=!0)=>{w&&w(r,e,o)};i(C,()=>({reset(r=!0,e=!0){B(h),S(""),R(h,r,e)},setValue(r,e=!0,o=!0){B(r),R(r,e,o)},getValue:()=>k,setError(r){S(r)},clear(){}}));const U=r=>{k!==r&&(B(r),R(r,!0,!1),S(""),E&&E(r))},q=n(()=>{let r="itd-radio-group";return r+=" itd-radio-group-"+g,r+=" itd-radio-group-"+V,P&&(r+=" itd-radio-group-error"),""!==$&&(r+=" "+$),r},[P,$]);return r(s,{id:N,className:q,role:"radiogroup",$direction:V,$length:j,$gap:b,$onlyFlow:v,$autoSize:x,children:(()=>{const r=o=>{if(!e.isValidElement(o))return null;if(o.type===c)return d(o,{...o.props,checked:k===o.props.value,onChange:U,hasError:""!==P,name:u,type:g,buttonProps:y});if(o.props.children){const e=p.map(o.props.children,r);return d(o,{...o.props,children:e})}return o};return p.map(z,r)})()})}));export{m as default};

package/dist/es/radio/group/styled.js

@@ -1,7 +0,0 @@
-import o from"styled-components";const t=o.div`
-  display               : grid;
-  grid-auto-flow        : ${o=>o.$onlyFlow?o.$direction:"column"===o.$direction?"row":"column"};
-  grid-template-columns : ${o=>"row"===o.$direction||o.$onlyFlow?"auto":`repeat(${o.$length}, ${o.$autoSize?"auto":"1fr"})`};
-  grid-template-rows    : ${o=>"column"===o.$direction||o.$onlyFlow?"auto":`repeat(${o.$length}, ${o.$autoSize?"auto":"1fr"})`};
-  grid-gap              : ${o=>o.$gap};
-`;export{t as GroupWrapper};

package/dist/es/radio/index.js

@@ -1 +0,0 @@
-import o from"./button/RadioButton.js";import t from"./group/Group.js";const u=()=>null;u.Group=t,u.Button=o;export{o as Button,t as Group,u as default};

package/dist/es/result/styled.js

@@ -1,109 +0,0 @@
-import t,{keyframes as i,css as e}from"styled-components";const n=t.section`
-  width: 100%;
-  height: 100%;
-  position: relative;
-  overflow: hidden;
-`,o=i`
-  0%    { transform: scale(.5);   opacity: 0;}
-  50%   { transform: scale(1.05); opacity: 1;}
-  75%   { transform: scale(0.95); opacity: 1;}
-  100%  { transform: scale(1);    opacity: 1;}
-`,a=t.div`
-
-  width: 100%;
-  height: 100%;
-
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-`,r=t.div`
-
-  opacity: 1;
-
-  padding           : 50px 20px 40px;
-  border-radius     : 6px;
-  width             : 100%;
-  height            : ${t=>"true"===t.$fill?"100%":"auto"};
-  max-width         : ${t=>"true"===t.$fill?"100%":"500px"};
-  background-color  : ${t=>!0===t.$background?"default"===t.$type?"#10233b":"#0E153180":"transparent"};
-
-  display           : flex;
-  justify-content   : center;
-  align-items       : center;
-  flex-direction    : column;
-  gap               : 20px;
-
-  ${t=>{if(t.$animation)return e`
-        animation         : ${o} 0.5s ease-out;
-        transition        : all 0.5s ease-out;
-        transform-origin  : 50% 50%;
-      `}}
-  
-`,c=t.div`
-
-  position: relative;
-  display: flex;
-  justify-content: center;
-
-  width: 100%;
-  min-height: 0;
-  margin-bottom: 1rem;
-
-  background-color: #04112780;
-  border-radius: 100px;
-  width: 84px;
-  height: 84px;
-  
-  img {
-    z-index: 0;
-    width: 44px;
-    height: auto;
-  }
-  
-`,d=t.div`
-  display: flex;
-  justify-content: center;
-  margin-top: 20px;
-
-  a {
-    min-width: 150px;
-
-    &:not(:last-child) {
-      margin-right: 20px;
-    }
-
-  }
-`,l=t.div`
-
-  display: flex;
-  justify-content: center;
-
-  width: 100%;
-
-  >div {
-    width: 100%;
-  }
-  
-`,s=t.div`
-
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 10px;
-
-`,p=t.div`
-  color: #57d43c;
-  font-size: 18px;
-  font-weight: 600;
-  text-align: center;
-  max-width: 80%; 
-`,x=t.div`
-  color: #cccccc;
-  font-size: 13px;
-  line-height: 18px;
-  font-weight: 500;
-  text-align: center;
-  max-width: 80%;
-`;export{s as Body,r as Content,x as ContentDescription,a as ContentWrapper,d as Extras,l as Footer,c as ImageWrapper,p as Title,n as Wrapper};

package/dist/es/status/index.js

@@ -1 +0,0 @@
-import{jsx as F}from"react/jsx-runtime";import t from"../utils/GetSizeSlugBySize.js";import{ComponentSizes as e}from"../enums/enum.js";import{useMemo as r}from"react";const d={"gray-1":{background:"#F9F9F9",text:"#0714374D"},"gray-2":{background:"#F9F9F9",text:"#585455"},"gray-3":{background:"#F5F5F5",text:"#071437"},black:{background:"#071437",text:"#FFFFFF"},green:{background:"#DFFFEA",text:"#17C653"},purple:{background:"#F5F1FF",text:"#7239EA"},yellow:{background:"#FFF8DD",text:"#F6C000"},red:{background:"#FFEEF3",text:"#F8285A"},brown:{background:"#FFF3F1",text:"#CB6F5B"},lavender:{background:"#FCF3FF",text:"#AB60C0"},blue:{background:"#F1F4FF",text:"#3256D9"},pink:{background:"#FFEEF6",text:"#E25698"},violet:{background:"#F5F1FF",text:"#7239EA"},orange:{background:"#FFF4E6",text:"#FF8C00"},teal:{background:"#E6FFFA",text:"#2DD4BF"},indigo:{background:"#EEF2FF",text:"#6366F1"},lime:{background:"#F7FEE7",text:"#65A30D"},"filled-brown":{background:"#F5651A",text:"#FFF9F6"},"filled-violet":{background:"#7239EA",text:"#F5F1FF"},"filled-red":{background:"#F8285A",text:"#F7EFF1"},"filled-yellow":{background:"#F6C000",text:"#FBFAF4"},"filled-pink":{background:"#CC79E3",text:"#F7F3F9"},"filled-blue":{background:"#1B84FF",text:"#EDF0F4"},"filled-green":{background:"#17C653",text:"#F5FAF6"},"filled-purple":{background:"#C417C6",text:"#F6F0F6"},"filled-black":{background:"#071437",text:"#F1F3F7"},"filled-lavender":{background:"#AB60C0",text:"#FCF3FF"},"filled-gray-1":{background:"#585455",text:"#F9F9F9"},"filled-gray-2":{background:"#585455",text:"#F9F9F9"},"filled-gray-3":{background:"#071437",text:"#F5F5F5"},"filled-orange":{background:"#FF8C00",text:"#FFF4E6"},"filled-teal":{background:"#2DD4BF",text:"#E6FFFA"},"filled-indigo":{background:"#6366F1",text:"#EEF2FF"},"filled-lime":{background:"#65A30D",text:"#F7FEE7"}};function l({variant:l="gray-1",size:a=e.DEFAULT,stretch:n=!1,bold:o=!0,children:u="",className:c=""}){const g=r(()=>{let F="itd-status flex items-center justify-center relative";return F+=" itd-status-"+l,F+=" itd-status-"+t(a),n&&(F+=" itd-status-stretch"),o&&(F+=" itd-status-bold"),""!==c&&null!==c&&(F+=" "+c),F},[l,a,n,o,c]),i=r(()=>{const F=d[l];return{background:F.background,color:F.text}},[l]);return F("div",{className:g,style:i,children:F("span",{children:u})})}export{l as default};