@inntechcorp/it-design 3.1.3 → 3.1.4

package/dist/es/select/toggle/styled.js

@@ -1,88 +0,0 @@
-import e,{css as r}from"styled-components";import o from"../../icons/Lock.js";export{ErrorBorder,ErrorTooltip}from"../../utils/CommonStyledComponents.js";const t=e.div`
-  
-  display           : flex;
-  align-items       : center;
-  cursor            : ${({$showSearch:e})=>e?"default":"pointer"};
-  box-sizing        : border-box; 
-
-  -webkit-user-select : none;
-  -moz-user-select    : none;
-  -ms-user-select     : none;
-  user-select         : none;
-
-  >svg {
-    width   : auto;
-    height  : 1rem;
-  }
-  
-  .itd-svg > div {
-    display         : flex;
-    align-items     : center;
-    justify-content : center;
-  }
-
-`,i=e.div`
-  
-  display: flex;
-  flex-grow: 1;
-  height: 100%;
-
-`,l=e.div`
-  
-  display: flex;
-  align-items: center;
-  pointer-events: none;
-
-  ${({$open:e})=>e&&r`
-      transform: rotate(-180deg);
-    `}
-
-`,n=e.div`
-
-`,s=e.div`
-
-  margin: 0;
-  margin-right: 0;
-  float: left;
-  height: 100%;
-  position: relative;
-
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-
-  &::before {
-    padding: 0.25rem;
-    border-radius: 3.125rem;
-  }
-
-`;e(s)`
-
-`,e(s)`
-
-`,e(s)`
-  color: ${({theme:e})=>e.colorText};
-  &::before { background-color: ${({theme:e})=>e.colorError}; }
-  svg circle { fill: ${({theme:e})=>e.colorError}; }
-  svg path { fill: ${({theme:e})=>e.colorErrorText}; }
-`;const c=e(o)`
-  
-  fill: ${({theme:e})=>e.colorIconMuted};
-
-`,d=e.div`
-  
-  display: flex;
-  align-items: center;
-  height: 100%;
-  margin-right: 0.4375rem;
-
-`,m=e.div`
-  
-  display: grid;
-  grid-column-gap: 0.75rem;
-  grid-auto-flow: column;
-  align-items: center;
-  justify-self: flex-end;
-  position: relative;
-
-`;export{l as Icon,i as LabelWrapper,c as LockIconWrapper,n as PreIcon,d as Prefix,m as Suffix,t as Wrapper};

package/dist/es/spin/index.js

@@ -1 +0,0 @@
-import{jsxs as i,jsx as t}from"react/jsx-runtime";import{useEffect as n}from"react";import{Wrapper as r,ChildrenWrapper as e,SpinWrapper as d,Spinner as s}from"./styled.js";const l=({updating:l=!0,opacity:a=!0,size:p=32,className:c="",children:u=null})=>{n(()=>{},[]);const o=()=>{let i="itd-spin-spinner";return l&&(i+=" itd-spin-updating"),c&&(i+=" "+c),i},m=()=>t(d,{$size:String(p),className:o(),children:i(s,{children:[t("div",{}),t("div",{}),t("div",{}),t("div",{})]})});return u?i(r,{className:(()=>{let i="itd-spin";return l&&(i+=" itd-spin-updating"),c&&(i+=" "+c),i})(),children:[t(e,{$updating:l,$opacity:a,children:u}),l?m():null]}):l?m():null};export{l as default};

package/dist/es/spin/styled.js

@@ -1,74 +0,0 @@
-import i,{keyframes as t,css as n}from"styled-components";const o=t`
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-`,e=i.div`
-  position: relative;
-  `,a=i.div`
-
-  width   : ${i=>`${i.$size}px`};
-  height  : ${i=>`${i.$size}px`};
-
-  position:absolute;
-
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  `,r=i.div`
-
-  display: block;
-  position: relative;
-  width: 100%;
-  height: 100%;
-
-  div {
-
-    box-sizing: border-box;
-    display: block;
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    border: 3px solid #000000;
-    border-radius: 50%;
-    animation: ${o} 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
-    border-color: #000000 transparent transparent transparent;
-    
-  }
-
-  div:nth-child(1) {
-    animation-delay: -0.45s;
-  }
-  
-  div:nth-child(2) {
-    animation-delay: -0.3s;
-  }
-  
-  div:nth-child(3) {
-    animation-delay: -0.15s;
-  }
-
-  `,s=i.div`
-
-  transition-property: opacity;
-  transition-duration: 500ms;
-  transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
-  
-  pointer-events  : ${i=>""+(i.$updating?"none":"auto")};
-
-  ${i=>!0===i.$opacity?i.$updating?n`
-          opacity : 0.5;
-        `:n`
-          opacity : 1;
-        `:n`
-        opacity : 1;
-      `}
-
-`;export{s as ChildrenWrapper,a as SpinWrapper,r as Spinner,e as Wrapper};

package/dist/es/status/index.js

@@ -1 +0,0 @@
-import{jsx as t}from"react/jsx-runtime";import{Wrapper as s}from"./styled.js";import r from"../utils/GetSizeSlugBySize.js";import{ComponentSizes as e}from"../enums/enum.js";import{useMemo as i}from"react";function a({variant:a="gray-1",size:o=e.DEFAULT,stretch:u=!1,bold:l=!0,children:m="",className:n=""}){const d=i(()=>{let t="itd-status";return t+=" itd-status-"+a,t+=" itd-status-"+r(o),u&&(t+=" itd-status-stretch"),l&&(t+=" itd-status-bold"),""!==n&&null!==n&&(t+=" "+n),t},[a,o,u,l,n]);return t(s,{$status:a,$bold:l,className:d,children:t("span",{children:m})})}export{a as default};

package/dist/es/status/styled.js

@@ -1,75 +0,0 @@
-import t,{css as F}from"styled-components";const e={"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"},"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"},orange:{background:"#FFF4E6",text:"#FF8C00"},"filled-orange":{background:"#FF8C00",text:"#FFF4E6"},teal:{background:"#E6FFFA",text:"#2DD4BF"},"filled-teal":{background:"#2DD4BF",text:"#E6FFFA"},indigo:{background:"#EEF2FF",text:"#6366F1"},"filled-indigo":{background:"#6366F1",text:"#EEF2FF"},lime:{background:"#F7FEE7",text:"#65A30D"},"filled-lime":{background:"#65A30D",text:"#F7FEE7"}},d=t.div`
-
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  position: relative;
-  width: max-content;
-  border-radius: 4px;
-
-  >span {
-    text-align: center;
-    user-select: none;
-    white-space: nowrap;
-  }
-
-  &.itd-status-stretch {
-    width: 100%;
-  }
-
-  &.itd-status-xs {
-    padding: 4px 8px;
-    span {
-      font-size: 9px;
-      font-weight: ${({$bold:t})=>t?600:500};
-    }
-  }
-
-  &.itd-status-sm {
-    padding: 4px 8px;
-    span {
-      font-size: 10px;
-      font-weight: ${({$bold:t})=>t?600:500};
-    }
-  }
-
-  &.itd-status-md {
-    padding: 4px 8px;
-    span {
-      font-size: 11px;
-      font-weight: ${({$bold:t})=>t?600:500};
-    }
-  }
-
-  &.itd-status-df {
-    padding: 6px 10px;
-    span {
-      font-size: 12px;
-      font-weight: ${({$bold:t})=>t?600:500};
-    }
-  }
-
-  &.itd-status-lg {
-    padding: 8px 12px;
-    span {
-      font-size: 12.4px;
-      font-weight: ${({$bold:t})=>t?600:500};
-    }
-  }
-
-  &.itd-status-xlg {
-    padding: 10px 14px;
-    span {
-      font-size: 12.6px;
-      font-weight: ${({$bold:t})=>t?600:500};
-    }
-  }
-
-  ${({$status:t})=>{return F`
-      background: ${e[d=t].background};
-      span {
-        color: ${e[d].text};
-      }
-    `;var d}}
-
-`;export{d as Wrapper};

package/dist/es/switch/index.js

@@ -1 +0,0 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{forwardRef as i,useState as r,useEffect as o,useCallback as d,useMemo as s,useImperativeHandle as a}from"react";import"../index.js";import{Wrapper as n,Body as l,Thumb as c}from"./styled.js";import{ComponentVariants as h}from"../enums/enum.js";import m from"../node_modules/uuid/dist/esm-browser/v4.js";import p from"../spin/index.js";import{ErrorTooltip as u}from"../utils/CommonStyledComponents.js";const f=i(({id:i="",children:f="",checked:w,variant:b=h.DEFAULT,defaultChecked:v=!1,loading:g=!1,disabled:y=!1,onChange:N=null,onUpdate:j=null},k)=>{const[x,_]=r(v||!1),[C,$]=r(""),[D,E]=r(i||`itd-switch-${m()}`);o(()=>{i&&i!==D&&E(i)},[i]);const F=d((e,t=!0,i=!0)=>{j&&("development"===process.env.NODE_ENV?requestAnimationFrame(()=>j(e,t,i)):j(e,t,i))},[j]);o(()=>{void 0!==w&&w!==x&&(_(w),F(w))},[w,F]);const S=s(()=>({reset(e=!0,t=!0){const i=v||!1;_(i),F(i,e,t)},setValue(e,t=!0,i=!0){_(e),F(e,t,i)},getValue:()=>x,setError(e=""){$(e)},forceUpdate(){F(x)},clear(){_(!1)}}),[x,v,F]);a(k,()=>S,[S]);const U=d(e=>{if(g||y)return e.preventDefault(),void e.stopPropagation();const t=!x;_(t),F(t),N&&N(t)},[g,y,x,F,N]),V=s(()=>{let e="itd-switch";return e+=" itd-switch-"+b,x&&(e+=" itd-switch-checked"),y&&(e+=" itd-switch-disabled"),C&&(e+=" itd-switch-error"),g&&(e+=" itd-switch-loading"),e},[x,y,g,b,C]);return e(n,{className:V,children:[t("button",{id:D,type:"button",role:"switch",value:x?"on":"off","aria-checked":x,"aria-invalid":""!==C?"true":void 0,"aria-describedby":""!==C?`${D}__error`:void 0,"data-state":x?"checked":"unchecked","data-disabled":y?"true":"false","data-loading":g&&!y?"true":"false",disabled:y,onClick:U,children:t(l,{className:"itd-switch-body","data-disabled":y,children:t(c,{className:"itd-switch-thumb",children:t(p,{size:12,updating:g&&!y})})})}),f&&t("label",{htmlFor:D,children:f}),(()=>{if(""===C||y)return;return t("p",{id:`${D}__error`,role:"alert","aria-live":"assertive",className:"sr-only",style:{position:"absolute",width:"1px",height:"1px",padding:0,margin:"-1px",overflow:"hidden",clip:"rect(0, 0, 0, 0)",whiteSpace:"nowrap",border:0},children:C})})(),(()=>{if(""!==C&&!y)return t(u,{className:"itd-switch-error-tooltip itd-error-tooltip",$position:"top-left",$offsetX:3,"aria-hidden":"true",children:C})})()]})});f.displayName="ITD-Switch";export{f as default};

package/dist/es/switch/styled.js

@@ -1,209 +0,0 @@
-import{ThemeAppearances as e}from"../enums/enum.js";import r from"styled-components";import{withOpacity as t}from"../helpers/theme/Color.js";import{TYPOGRAPHY_TOKENS as o,SPACING_TOKENS as i}from"../helpers/theme/tokens.js";export{ErrorTooltip}from"../utils/CommonStyledComponents.js";const n=r.span`
-
-  content: '';
-  position: absolute;
-  width: 14px;
-  height: 14px;
-  border-radius: 50px;
-  transition: 0.3s;
-  background: ${({theme:r})=>r.appearance===e.LIGHT?r.background:r.foreground};
-
-  .itd-spin-spinner {
-
-    width: 12px;
-    height: 12px;
-
-    >div>div {
-      border-width: 2px;
-    }
-
-  }
-  
-`,a=r.div`
-  
-  text-indent: -9999px;
-  height: 20px;
-  width: 34px;
-  //background: ${({theme:e})=>e.primary};
-  display: block;
-  position: relative;
-  //box-shadow: inset 0px 0px 20px rgba(0,0,0,0.4);
-
-`,d=r.div`
-
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  position: relative;
-
-  button {
-
-    border            : 1px solid transparent;
-    background-color  : transparent;
-    outline-offset    : ${({theme:e})=>e.ringOffset};
-    outline           : 0 solid transparent;
-
-    transition: 
-      border-color ${({theme:e})=>e.transitionDuration} ${({theme:e})=>e.transitionTimingFunction},
-      outline 100ms linear;
-    
-    cursor            : pointer;
-    border-radius     : 28px;
-    height            : 20px;
-    width             : 34px;
-
-  }
-
-  /* Variant: default → borderlı; filled → bordersız */
-  &.itd-switch-default {
-
-    ${n} {
-      top: 2px;
-      left: 2px;
-    }
-
-    button[data-state="checked"] {
-
-      ${n} {
-      
-        left: calc(100% - 4px);
-        transform: translateX(-100%);
-        background: ${({theme:e})=>e.primary};
-
-        .itd-spin-spinner >div>div {
-          border-color: ${({theme:e})=>e.primaryForeground} transparent transparent;
-        }
-        
-      }
-
-      border: 1px solid ${({theme:e})=>e.primary};
-
-    }
-
-    button {
-      box-shadow    : ${({theme:e})=>e.boxShadow};
-    }
-
-    button[data-state="unchecked"] {
-
-      ${n} {
-        background: ${({theme:e})=>t(e.colorText,.5)};
-
-        .itd-spin-spinner >div>div {
-          border-color: ${({theme:e})=>e.background} transparent transparent;
-        }
-      }
-
-      &:hover {
-        border-color: ${({theme:e})=>e.colorBorderHover};
-      }
-
-      &:focus-visible {
-        border-color: ${({theme:r})=>r.primaryScale[r.appearance===e.LIGHT?400:900]};
-      }
-
-      border: 1px solid ${({theme:e})=>e.colorBorder};
-
-    }
-
-
-  }
-
-  &.itd-switch-filled {
-
-    ${n} {
-      top: 2px;
-      left: 2px;
-    }
-
-    button[data-state="checked"] {
-
-      ${n} {
-        
-        left: calc(100% - 4px);
-        transform: translateX(-100%);
-        background: ${({theme:r})=>r.appearance===e.LIGHT?r.background:r.primaryForeground};
-
-        .itd-spin-spinner >div>div {
-          border-color: ${({theme:e})=>e.primary} transparent transparent;
-        }
-
-      }
-
-      background: ${({theme:e})=>e.primary};
-
-    }
-    
-    button[data-state="unchecked"] {
-      
-      ${n} {
-        
-        .itd-spin-spinner >div>div {
-          border-color: ${({theme:e})=>e.secondary} transparent transparent;
-        }
-
-      }
-
-      background: ${({theme:e})=>e.colorBackgroundAltHover};
-
-    }
-
-  }
-
-  &.itd-switch-custom {
-    button[data-state="checked"] {
-
-      ${n} {
-        left: calc(100% - 3px);
-        transform: translateX(-100%);
-      }
-    }
-  }
-
-  &&.itd-switch-error:not(.itd-switch-disabled) button {
-    border: 1px solid ${({theme:e})=>e.colorErrorBorder};
-  }
-
-  /* Focus görünürlüğü: checked/unchecked fark etmeksizin göster */
-  button:focus-visible {
-    outline: ${({theme:e})=>e.ringWidth} solid ${({theme:r})=>t(r.primaryScale[r.appearance===e.LIGHT?400:900],.5)};
-  }
-
-  /* Error durumunda outline kırmızı */
-  &.itd-switch-error button:focus-visible {
-    outline: ${({theme:e})=>e.ringWidth} solid ${({theme:e})=>t(e.colorErrorBorder,.5)};
-  }
-
-  // Disabled durumları
-  &.itd-switch-disabled {
-    
-    button[data-state="checked"], button[data-state="unchecked"] {
-      background: ${({theme:e})=>e.colorDisabledBg};
-      border: 1px solid ${({theme:e})=>e.colorDisabledBorder};
-      ${n} {
-        background: ${({theme:e})=>e.colorDisabledBorder};
-      }
-    }
-
-    button, label {
-      cursor: not-allowed;
-    }
-
-    label {
-      color: ${({theme:e})=>e.colorDisabledText};
-    }
-    
-  }
-
-  label {
-    color: ${({theme:e})=>e.colorText};
-    font-size: ${o.fontSize.df};
-    font-weight: ${o.fontWeight.normal};
-    margin-left: ${i.gap.sm};
-  }
-
-  &.itd-switch-loading .itd-switch-body {
-    cursor: progress;
-  }
-
-`;export{a as Body,n as Thumb,d as Wrapper};

package/dist/es/table/index.js

@@ -1 +0,0 @@
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import i,{forwardRef as d,useState as n,useImperativeHandle as r,useMemo as l}from"react";import{Wrapper as a,RowTitle as h,EmptyBody as o,Cell as s}from"./styled.js";import"../index.js";import m from"../utils/GetSizeSlugBySize.js";import{useTranslation as c}from"react-i18next";import{ComponentSizes as p}from"../enums/enum.js";import u from"../icons/NoData.js";import b from"../button/index.js";const x=d(({columns:d,data:x,cellHeight:g,className:y="",size:f=p.DEFAULT,headless:w=!1,bordered:W=!1,dashed:S=!1,noGaps:v=!1,hideGroupButtons:j=!1,getTRProps:k},_)=>{const{t:z}=c("itd"),[G,I]=n(new Set),N=t=>{I(e=>{const i=new Set(e);return i.has(t)?i.delete(t):i.add(t),i})};r(_,()=>({toggleRow:N,expandedRows:G}));const $=(t,e)=>{let i={};return"string"==typeof t.width?i.width=t.width:"number"==typeof t.width?i.minWidth=t.width+"px":i.width="auto",void 0!==t.maxWidth&&("string"==typeof t.maxWidth?i.maxWidth=t.maxWidth:"number"==typeof t.maxWidth&&(i.maxWidth=t.maxWidth+"px")),void 0!==t.minWidth&&("string"==typeof t.minWidth?i.minWidth=t.minWidth:"number"==typeof t.minWidth&&(i.minWidth=t.minWidth+"px")),"td"===e&&("string"==typeof g?i.height=g:"number"==typeof g?i.minHeight=g+"px":i.height="auto"),i},D=()=>{let t=!1;return x?.map(e=>{e.hasOwnProperty("children")&&(t=!0)}),!j&&t},L=(t,e,i)=>k?k(t,e,i):{},R=(t,e,i)=>{let d={"data-index":e+"_"+t,"data-level":e};return e>0&&(0===t&&(d["data-first"]="true"),t===i-1&&(d["data-last"]="true")),d},A=(n,r=0)=>n.map((l,a)=>e(i.Fragment,{children:[e("tr",{...R(a,r,n?.length),...L(l,a,r),children:[D()?l.children?t("td",{style:{width:"40px"},children:t("div",{className:"expand-button",children:t(b,{variant:"filled",size:p.X_SMALL,onClick:()=>N(l.key),circle:!0,children:t("span",{children:G.has(l.key)?"-":"+"})})})}):t("td",{}):null,d.map(e=>t("td",{style:$(e,"td"),children:t(s,{$overflow:e.overflow,title:String(l[e.dataIndex]),children:e.render?e.render(l[e.dataIndex],l,r):e.dataIndex?String(l[e.dataIndex]):null})},String(e.key)+"_"+a+"_"+r))]}),l.children&&G.has(l.key)&&A(l.children,r+1)]},String(r+"_"+a+"_"+l.key))),B=l(t=>{let e="itd-table";return e+=" itd-table-"+m(f),w&&(e+=" itd-table-headless"),W&&(e+=" itd-table-bordered"),v&&(e+=" itd-table-no-gaps"),x||(e+=" itd-table-empty"),0===x?.length&&(e+=" itd-table-no-data"),e+=S?" itd-table-dashed":" itd-table-solid",e+=t?" itd-table-inner-table":" itd-table-main-table",""!==y&&(e+=" "+y),e},[f,w,W,v,x,S,y]);return t(a,{$size:f,$noGaps:v,children:e("table",{className:B,children:[(()=>{if(!w)return t("thead",{children:e("tr",{children:[D()&&t("th",{style:{maxWidth:"40px"}}),d.map(e=>t("th",{style:$(e,"th"),children:t(h,{$overflow:e.overflow,children:e.title})},String(e.key)))]})})})(),x?0===x.length?t("tbody",{children:t("tr",{children:t("td",{colSpan:d.length,children:t(o,{children:e("div",{children:[t(u,{height:30}),t("span",{children:z("table.noData")})]})})})})}):t("tbody",{children:A(x)}):t("tbody",{children:t("tr",{children:t("td",{colSpan:d.length,children:t(o,{})})})})]})})});export{x as default};