@inntechcorp/it-design 3.1.3 → 3.1.4

package/dist/es/accordion/submenu/styled.js

@@ -1,214 +0,0 @@
-import o from"styled-components";const e=o.div`
-
-  &.itd-accordion-menu-sub-menu {
-
-    &:not(:last-child) {
-      .itd-accordion-menu-header {
-        margin-bottom: 1px;
-      }
-    }
-
-    /**
-     * SINGLE
-     */
-    &.itd-accordion-menu-sub-menu-single {
-      .itd-accordion-menu-header svg.itd-accordion-menu-header-arrow-icon.itd-svg svg {
-        transform: rotate(-90deg);
-      }
-    }
-    
-    /**
-     * MULTIPLE
-     */
-    &.itd-accordion-menu-sub-menu-multiple.itd-accordion-menu-sub-menu-open {
-      .itd-accordion-menu-header {
-        background-color: #f1f1f4;
-      }
-      .itd-accordion-menu-header svg.itd-accordion-menu-header-arrow-icon.itd-svg svg {
-        transform: rotate(-180deg);
-      }
-    }
-    
-    /**
-     * SINGLE AND MULTIPLE
-     */
-    &.itd-accordion-menu-sub-menu-single, &.itd-accordion-menu-sub-menu-multiple {
-    
-      /**
-       * DEFAULT
-       */
-      .itd-accordion-menu-header {
-
-        background-color: #f9f9f9;
-        transition: all 0.25s ease-out;
-        text-decoration: none;
-
-        span.itd-accordion-menu-header-text {
-          font-size: 14px;
-          font-weight: 500;
-          color: #071437;
-          transition: all 0.25s ease-out;
-        }
-
-        .itd-icon {
-          margin-right: 8px;
-          color: #071437;
-          transition: all 0.25s ease-out;
-        }
-
-        svg.itd-accordion-menu-header-arrow-icon.itd-svg svg {
-          fill: #071437;
-          transition: all 0.25s ease-out;
-        }
-
-        /* HOVER */
-        &:hover {
-
-          background-color: #f1f1f4;
-
-          span.itd-accordion-menu-header-text {
-            color: #071437;
-          }
-
-          .itd-icon {
-            color: #071437;
-          }
-
-          svg.itd-accordion-menu-header-arrow-icon.itd-svg svg {
-            fill: #071437;
-          }
-          
-        }
-
-      }
-
-      ul.itd-accordion-menu-collapse {
-        
-        li.itd-accordion-menu-content-item {
-          
-          .itd-accordion-menu-content {
-
-            background-color: #f9f9f950;
-            transition: all 0.25s ease-out;
-            
-            span.itd-accordion-menu-content-header-text {
-              font-size: 13px;
-              font-weight: 500;
-              color: #071437;
-              transition: all 0.25s ease-out;
-            }
-
-            .itd-svg svg {
-              transition: all 0.25s ease-out;
-              fill: #071437;
-            }
-
-            /* HOVER */
-            &:hover {
-              background-color: #f1f1f4;
-            }
-
-          }
-          
-        }
-        
-      }
-
-      /**
-       * ACTIVE
-       */
-      &.itd-accordion-menu-sub-menu-active {
-      
-        .itd-accordion-menu-header {
-
-          transition-duration: 0ms;
-          background-color: #071437;
-
-          span.itd-accordion-menu-header-text {
-            color: #ffffff;
-          }
-
-          .itd-icon {
-            color: #ffffff;
-          }
-
-          .itd-svg svg {
-            fill: #ffffff;
-          }
-          
-        }
-
-        ul.itd-accordion-menu-collapse li.itd-accordion-menu-content-item {
-          
-          .itd-accordion-menu-content {
-
-            &.active {
-
-              background-color: #E9F3FF;
-
-              span.itd-accordion-menu-content-header-text {
-                color: #1b84ff;
-              }
-  
-              .itd-svg svg {
-                fill: #1b84ff;
-              }
-
-            }
-
-            
-          }
-
-        }
-
-      }
-
-    }
-
-  }
-
-`,t=o.div`
-
-  font-size: ${o=>`${o.$size}px`};
-  width: ${o=>`${o.$size}px`};
-  height: ${o=>`${o.$size}px`};
-  
-  display: flex;
-  align-items: center;
-  
-`,i=o.ul`
-
-  overflow: hidden;
-  transition: max-height 0.25s ease-out;
-  margin: 0px;
-  padding: 0px;
-  list-style-type: none;
-
-`,n=o.div`
-
-  transition  : all 0.25s ease-out;
-  margin-left : auto;
-  transform   : ${o=>o.$isSingle?"rotate(-90deg)":o.$isOpen?"rotate(-180deg)":"rotate(0deg)"};
-
-  width: ${o=>o.$width+"px"};
-  height: ${o=>o.$height+"px"};
-
-  svg {
-    width: ${o=>o.$width+"px"};
-    height: ${o=>o.$height+"px"};
-  }
-
-`,a=o.div`
-
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  height: ${o=>`${o.$height}px`};
-  padding: 0 20px 0 0;
-  cursor: pointer;
-  
-  span {
-    user-select: none;
-  }
-
-`;export{n as Arrow,i as Content,t as Icon,a as Title,e as Wrapper};

package/dist/es/alert/Description.js

@@ -1 +0,0 @@
-import{jsx as e}from"react/jsx-runtime";import{Description as r}from"./styled.js";const t=({children:t,className:s})=>e(r,{className:`itd-alert-description ${s||""}`,children:t});t.displayName="ITD-Alert-Description";export{t as AlertDescription,t as default};

package/dist/es/alert/Title.js

@@ -1 +0,0 @@
-import{jsx as e}from"react/jsx-runtime";import{Title as t}from"./styled.js";const l=({children:l,className:r})=>e(t,{className:`itd-alert-title ${r||""}`,children:l});l.displayName="ITD-Alert-Title";export{l as AlertTitle,l as default};

package/dist/es/alert/alert.style.error.js

@@ -1,32 +0,0 @@
-import{css as r}from"styled-components";const e=()=>r`
-
-    &.itd-alert-error {
-
-      &.itd-alert-default {
-        border: 1px solid ${({theme:r})=>r.colorAlertErrorBorder};
-      }
-
-      &.itd-alert-filled {
-        border: 1px solid transparent;
-      }
-
-      &.itd-alert-default, &.itd-alert-filled {
-
-        background: ${({theme:r})=>r.colorAlertErrorBackground};
-
-        .itd-alert-title {
-          color: ${({theme:r})=>r.colorAlertErrorTitle};
-        }
-
-        .itd-alert-description {
-          color: ${({theme:r})=>r.colorAlertErrorText};
-        }
-        
-        svg {
-          color: ${({theme:r})=>r.colorAlertErrorText};
-        }
-        
-      }
-
-    }
-  `;export{e as getErrorAlert};

package/dist/es/alert/alert.style.info.js

@@ -1,32 +0,0 @@
-import{css as t}from"styled-components";const e=()=>t`
-
-    &.itd-alert-info {
-
-      &.itd-alert-default {
-        border: 1px solid ${({theme:t})=>t.colorAlertInfoBorder};
-      }
-
-      &.itd-alert-filled {
-        border: 1px solid transparent;
-      }
-
-      &.itd-alert-default, &.itd-alert-filled {
-
-        background: ${({theme:t})=>t.colorAlertInfoBackground};
-
-        .itd-alert-title {
-          color: ${({theme:t})=>t.colorAlertInfoTitle};
-        }
-
-        .itd-alert-description {
-          color: ${({theme:t})=>t.colorAlertInfoText};
-        }
-        
-        svg {
-          color: ${({theme:t})=>t.colorAlertInfoText};
-        }
-
-      }
-
-    }
-  `;export{e as getInfoAlert};

package/dist/es/alert/alert.style.neutral.js

@@ -1,32 +0,0 @@
-import{css as t}from"styled-components";const e=()=>t`
-
-    &.itd-alert-neutral {
-
-      &.itd-alert-default {
-        background: ${({theme:t})=>t.card};
-        border: 1px solid ${({theme:t})=>t.colorBorder};
-      }
-
-      &.itd-alert-filled {
-        background: ${({theme:t})=>t.colorBackgroundAlt};
-        border: 1px solid transparent;
-      }
-
-      &.itd-alert-default, &.itd-alert-filled {
-
-        .itd-alert-title {
-          color: ${({theme:t})=>t.colorText};
-        }
-
-        .itd-alert-description {
-          color: ${({theme:t})=>t.colorTextMuted};
-        }
-
-        svg {
-          color: ${({theme:t})=>t.colorText};
-        }
-
-      }
-
-    }
-  `;export{e as getNeutralAlert};

package/dist/es/alert/alert.style.success.js

@@ -1,32 +0,0 @@
-import{css as e}from"styled-components";const t=()=>e`
-
-    &.itd-alert-success {
-
-      &.itd-alert-default {
-        border: 1px solid ${({theme:e})=>e.colorAlertSuccessBorder};
-      }
-
-      &.itd-alert-filled {
-        border: 1px solid transparent;
-      }
-
-      &.itd-alert-default, &.itd-alert-filled {
-
-        background: ${({theme:e})=>e.colorAlertSuccessBackground};
-
-        .itd-alert-title {
-          color: ${({theme:e})=>e.colorAlertSuccessTitle};
-        }
-
-        .itd-alert-description {
-          color: ${({theme:e})=>e.colorAlertSuccessText};
-        }
-
-        svg {
-          color: ${({theme:e})=>e.colorAlertSuccessText};
-        }
-
-      }
-
-    }
-  `;export{t as getSuccessAlert};

package/dist/es/alert/alert.style.warning.js

@@ -1,32 +0,0 @@
-import{css as r}from"styled-components";const t=()=>r`
-
-    &.itd-alert-warning {
-
-      &.itd-alert-default {
-        border: 1px solid ${({theme:r})=>r.colorAlertWarningBorder};
-      }
-
-      &.itd-alert-filled {
-        border: 1px solid transparent;
-      }
-
-      &.itd-alert-default, &.itd-alert-filled {
-
-        background: ${({theme:r})=>r.colorAlertWarningBackground};
-
-        .itd-alert-title {
-          color: ${({theme:r})=>r.colorAlertWarningTitle};
-        }
-
-        .itd-alert-description {
-          color: ${({theme:r})=>r.colorAlertWarningText};
-        }
-
-        svg {
-          color: ${({theme:r})=>r.colorAlertWarningText};
-        }
-
-      } 
-      
-    }
-  `;export{t as getWarningAlert};

package/dist/es/alert/index.js

@@ -1 +0,0 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{ComponentVariants as r,ComponentSizes as i,ComponentSizesSlug as s}from"../enums/enum.js";import l from"../utils/InlineSVGCached.js";import{Wrapper as o}from"./styled.js";import{useMemo as n,Children as a,isValidElement as c}from"react";import{AlertTitle as m}from"./Title.js";import{AlertDescription as d}from"./Description.js";import p from"../node_modules/lucide-react/dist/esm/icons/info.js";const L=({type:L="info",size:f=i.SMALL,variant:u=r.DEFAULT,title:A,className:D,children:E,icon:h})=>{const y=n(()=>{let e="itd-alert";return e+=" itd-alert-"+L,e+=" itd-alert-"+(f===i.X_SMALL?s.X_SMALL:f===i.SMALL?s.SMALL:f===i.MEDIUM?s.MEDIUM:f===i.DEFAULT?s.DEFAULT:f===i.LARGE?s.LARGE:f===i.X_LARGE?s.X_LARGE:s.DEFAULT),e+=" itd-alert-"+u,""!==D&&(e+=" "+D),e},[L,f,u,D]),M=a.toArray(E);let T=h,j=null,I=null,S=[];M.forEach(t=>{if(c(t)){const e=t.type?.displayName||t.type?.name;"ITD-Alert-Title"===e?j=t:"ITD-Alert-Description"===e?I=t:!T&&(e?.includes("Icon")||e?.includes("Lucide")||t.type?.$$typeof?.toString().includes("react.forward_ref")||!j&&!I)?T=t:S.push(t)}else t&&!I&&(I=e(d,{children:t}))}),A&&!j&&(j=e(m,{children:A})),S.length>0&&!I&&(I=e(d,{children:S}));const U=!!T;return t(o,{className:y,"data-has-icon":U?"true":"false",children:[U&&(T?"string"==typeof T?e(l,{src:T}):T:e(p,{size:16})),j,I]})};L.displayName="ITD-Alert";export{d as AlertDescription,m as AlertTitle,L as default};

package/dist/es/alert/styled.js

@@ -1,68 +0,0 @@
-import t from"styled-components";import{ALERT_TOKENS as i}from"../helpers/theme/tokens.js";import{getNeutralAlert as e}from"./alert.style.neutral.js";import{getSuccessAlert as r}from"./alert.style.success.js";import{getErrorAlert as a}from"./alert.style.error.js";import{getInfoAlert as o}from"./alert.style.info.js";import{getWarningAlert as l}from"./alert.style.warning.js";const s=t.div`
-
-  display       : grid;
-  align-items   : flex-start;
-  width         : 100%;
-  position      : relative;
-
-  row-gap               : calc(var(--itd-spacing) * .5);
-  padding-block         : calc(var(--itd-spacing) * 3);
-  padding-inline        : calc(var(--itd-spacing) * 4);
-  border-radius         : calc( ${({theme:t})=>t.borderRadius});
-
-  &:has(>svg) {
-    grid-template-columns : calc(var(--itd-spacing) * 4) 1fr;
-    column-gap            : calc(var(--itd-spacing) * 3);
-  }
-
-  &:not(:has(>svg)) {
-    grid-template-columns : 0 1fr;
-    column-gap            : 0;
-  }
-
-  /* Icon varsa ilk kolonda */
-  >svg {
-    width                 : calc(var(--itd-spacing) * 4);
-    height                : calc(var(--itd-spacing) * 4);
-    --itd-translate-y         : calc(var(--itd-spacing) * .5);
-    translate             : var(--itd-translate-x) var(--itd-translate-y);
-  }
-
-  /* ------------------------ */
-  // NEUTRAL
-  /* ------------------------ */
-  ${()=>e()}
-  
-  /* ------------------------ */
-  // SUCCESS
-  /* ------------------------ */
-  ${()=>r()}
-
-  /* ------------------------ */
-  // INFO
-  /* ------------------------ */
-  ${()=>o()}
-
-  /* ------------------------ */
-  // WARNING
-  /* ------------------------ */
-  ${()=>l()}
-
-  /* ------------------------ */
-  // ERROR
-  /* ------------------------ */
-  ${()=>a()}
-  
-`,n=t.div`
-  font-size         : ${i.title.fontSize};
-  line-height       : ${i.title.lineHeight};
-  font-weight       : ${i.title.fontWeight};
-  color             : ${({theme:t})=>t.colorText};
-  grid-column-start : 2;
-`,c=t.div`
-  font-size         : ${i.description.fontSize};
-  line-height       : ${i.description.lineHeight};
-  font-weight       : ${i.description.fontWeight};
-  color             : ${({theme:t})=>t.colorTextMuted};
-  grid-column-start : 2;
-`;export{c as Description,n as Title,s as Wrapper};

package/dist/es/alink/index.js

@@ -1 +0,0 @@
-import{jsx as r}from"react/jsx-runtime";import{memo as t}from"react";import{NavigationLink as e}from"./styled.js";var o=t(t=>(()=>{const{to:o,children:s,...l}=t;return r(e,{...l,to:o,children:s})})(),(r,t)=>r.to===t.to&&r.className===t.className&&r.style===t.style&&r.children===t.children);export{o as default};

package/dist/es/alink/styled.js

@@ -1,5 +0,0 @@
-import{NavLink as o}from"react-router-dom";import t from"styled-components";const r=t(o)`
-
-  text-decoration: none;
-  
-`;export{r as NavigationLink};

package/dist/es/back-top/index.js

@@ -1 +0,0 @@
-import{jsx as o}from"react/jsx-runtime";import{useState as t,useEffect as e}from"react";import{Wrapper as r,Show as n}from"./styled.js";import i from"../icons/BackToTop.js";function c(c){const{children:s=null}=c,[l,d]=t(!1);e(()=>(document.addEventListener("scroll",m),()=>{document.removeEventListener("scroll",m)}),[]);const m=()=>{d(document.body.scrollTop>window.innerHeight)};return o(r,{className:"itd-back-to-top",children:o(n,{onClick:()=>{window.scrollTo({top:0,behavior:"smooth"})},$show:l,children:s||o(i,{width:30,height:30})})})}export{c as default};

package/dist/es/back-top/styled.js

@@ -1,25 +0,0 @@
-import i,{keyframes as o}from"styled-components";const s=i.div`
-  position: fixed;
-  bottom: 80px;
-  right: 30px;
-  visibility: hidden;
-  `,t=i.a`
-
-  visibility: ${i=>i.$show?"visible":"hidden"};
-  animation: ${i=>i.$show?n:"none"} 0.5s;
-
-  display: block;
-  transition: fill .3s ease-out;
-  cursor: pointer;
-  fill: #ffffff80;
-
-  &:hover {
-    fill: #3396fb;
-  }
-  
-  `,n=o`
-  0% { transform: scale(.2) }
-  50% { transform: scale(1.1) }
-  75% { transform: scale(0.9) }
-  100% { transform: scale(1) }
-`;export{t as Show,s as Wrapper};

package/dist/es/button/button.style.circle.js

@@ -1,38 +0,0 @@
-import{css as t}from"styled-components";const o=()=>t`
-    &.itd-button-circle {
-
-      border-radius: 100%;
-
-      /* X-SMALL */
-      &.itd-button-xs {
-        width: 24px;
-      }
-
-      /* SMALL */
-      &.itd-button-sm {
-        width: 28px;
-      }
-
-      /* MEDIUM */
-      &.itd-button-md {
-        width: 32px;
-      }
-
-      /* LARGE */
-      &.itd-button-lg {
-        width: 44px;
-      }
-
-      /* X-LARGE */
-      &.itd-button-xlg {
-        width: 46px;
-      }
-
-      /* DEFAULT */
-      &:not(&.itd-button-xs):not(&.itd-button-sm):not(&.itd-button-md):not(&.itd-button-lg):not(&.itd-button-xlg)
-      {
-        width: 40px;
-      }
-
-    }
-  `;export{o as getCircle};

package/dist/es/button/button.style.default.js

@@ -1,44 +0,0 @@
-import{css as r}from"styled-components";const o=()=>r`
-
-    &.itd-button-default {
-
-      box-shadow        : ${({theme:r})=>r.boxShadow};
-      background-color  : ${({theme:r})=>r.primary};
-      border            : 1px solid transparent;
-
-      span, div.icon svg{
-        color : ${({theme:r})=>r.primaryForeground};
-      }
-
-      &:hover, &.active {
-        background-color: ${({theme:r})=>r.primaryHover};
-      }
-
-      &.itd-button-selected {
-        
-        border: 2px solid #3598FE;
-
-        span {
-          color: #3598FE;
-          font-weight: 600;
-          margin: -1px;
-        }
-
-      }
-
-      &[disabled] {
-        
-        span, div.icon svg {
-          color: ${({theme:r})=>r.primaryForeground};
-        }
-
-      }
-
-      .itd-spin-spinner {
-        >div>div {
-          border-color: ${({theme:r})=>r.primaryForeground} transparent transparent;
-        }
-      }
-      
-    }
-  `;export{o as getDefaultButton};

package/dist/es/button/button.style.filled.js

@@ -1,49 +0,0 @@
-import{css as o}from"styled-components";const r=()=>o`
-
-    &.itd-button-filled {
-
-      background-color: #e9f3ff;
-      border: transparent;
-
-      span, div.icon svg {
-        color: #1b84ff;
-      }
-
-      &:hover, &.active {
-        background-color: #1b84ff;
-        span, div.icon svg {
-          color: #ffffff;
-        }
-      }
-
-      &.itd-button-selected {
-        
-        border: transparent;
-
-        span, div.icon svg {
-          color: #3598FE;
-          font-weight: 600;
-          margin: -1px;
-        }
-
-      }
-
-      &[disabled] {
-
-        background-color: #f9f9f9;
-        border: transparent;
-
-        span, div.icon svg {
-          color: #07143790;
-        }
-        
-      }
-
-      .itd-spin-spinner {
-        >div>div {
-          border-color: #1b84ff transparent transparent;
-        }
-      }
-      
-    }
-  `;export{r as getFilledButton};

package/dist/es/button/button.style.ghost.js

@@ -1,47 +0,0 @@
-import{css as o}from"styled-components";const r=()=>o`
-
-    &.itd-button-ghost {
-
-      background-color: transparent;
-      border: 1px solid transparent;
-
-      span, div.icon svg {
-        color: #252f4a;
-      }
-
-      &:hover, &.active {
-        
-        background-color: #f9f9f9;
-
-        span, div.icon svg {
-          color: #1b84ff;
-        }
-
-      }
-
-      &.itd-button-selected {
-        
-        border: 2px solid #3598FE;
-
-        span {
-          color: #3598FE;
-          font-weight: 600;
-          margin: -1px;
-        }
-
-      }
-
-      &[disabled] {
-        span, div.icon svg {
-          color: #0000004D;
-        }
-      }
-
-      .itd-spin-spinner {
-        >div>div {
-          border-color: #071437 transparent transparent;
-        }
-      }
-      
-    }
-  `;export{r as getGhostButton};