@sphereon/ui-components.ssi-react 0.1.3-unstable.24 → 0.1.3-unstable.30

package/dist/index.js

@@ -1,3 +1,4 @@
+import SSIToastContainer from './components/messageBoxes/toasts/SSIToastContainer';
 import SSIStatusLabel from './components/labels/SSIStatusLabel';
 import SSICredentialCardView from './components/views/SSICredentialCardView';
 import SSICredentialMiniCardView from './components/views/SSICredentialMiniCardView';
@@ -19,7 +20,8 @@ import SSITabViewHeader from './components/views/SSITabView/SSITabViewHeader';
 import SSIProfileIcon from './components/assets/icons/SSIProfileIcon';
 import SSISecondaryButton from './components/buttons/SSISecondaryButton';
 import SSICheckbox from './components/fields/SSICheckbox';
-import SSILoader from "./components/assets/loaders/SSILoader";
-export * from './types';
+import SSIHoverText from './components/fields/SSIHoverText';
 export * from './styles/components/fonts';
-export { SSICredentialCardView, SSICredentialMiniCardView, SSIStatusLabel, SSICheckmarkBadge, SSIExclamationMarkBadge, SSIPlaceholderLogo, SSILogo, SSIAddIcon, SSIFilterIcon, SSIArrowDownIcon, SSITypeLabel, SSIIconButton, SSIPrimaryButton, SSISecondaryButton, SSIDropDownList, SSITableView, SSITableViewHeader, SSITabView, SSITabViewHeader, SSIProfileIcon, SSICheckbox, SSILoader };
+export * from './types';
+export * from './helpers';
+export { SSICredentialCardView, SSICredentialMiniCardView, SSIStatusLabel, SSICheckmarkBadge, SSIExclamationMarkBadge, SSIPlaceholderLogo, SSILogo, SSIAddIcon, SSIFilterIcon, SSIArrowDownIcon, SSITypeLabel, SSIIconButton, SSIPrimaryButton, SSISecondaryButton, SSIDropDownList, SSITableView, SSITableViewHeader, SSITabView, SSITabViewHeader, SSIProfileIcon, SSIToastContainer, SSICheckbox, SSIHoverText };

package/dist/styles/components/components/SSIHoverText/index.d.ts

@@ -0,0 +1,3 @@
+export declare const SSIHoverTextTextHoverStyled: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const SSIHoverTextContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SSIHoverTextTextStyled: import("styled-components").StyledComponent<"span", any, {}, never>;

package/dist/styles/components/components/{SSIText → SSIHoverText}/index.js

@@ -1,5 +1,5 @@
 import styled from 'styled-components';
-export const SSITruncatedFullTextStyled = styled.span `
+export const SSIHoverTextTextHoverStyled = styled.span `
   display: none;
   position: absolute;
   top: 100%;
@@ -9,13 +9,13 @@ export const SSITruncatedFullTextStyled = styled.span `
   padding: 5px;
   z-index: 1;
 `;
-export const SSITruncatedContainerStyled = styled.div `
+export const SSIHoverTextContainerStyled = styled.div `
   position: relative;
 
-  &:hover ${SSITruncatedFullTextStyled} {
+  &:hover ${SSIHoverTextTextHoverStyled} {
     display: block;
   }
 `;
-export const SSITruncatedTextStyled = styled.span `
-  display: 'inline';
+export const SSIHoverTextTextStyled = styled.span `
+  display: inline;
 `;

package/dist/styles/components/components/SSISecondaryButton/index.js

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
 import { SSIRoundedContainerStyled } from '../../containers';
 import { gradientColors } from '@sphereon/ui-components.core';
-import { SSITextH3Styled } from "../../fonts";
+import { SSITextH3Styled } from '../../fonts';
 export const SSISecondaryButtonContainerStyled = styled(SSIRoundedContainerStyled) `
   position: relative;
   display: flex;
@@ -21,10 +21,8 @@ export const SSISecondaryButtonContainerStyled = styled(SSIRoundedContainerStyle
     bottom: 0;
     border-radius: 8px;
     border: 1px solid transparent;
-    background: linear-gradient(135deg, #7276F7, #7C40E8) border-box;
-    -webkit-mask:
-            linear-gradient(#fff 0 0) padding-box,
-            linear-gradient(#fff 0 0);
+    background: linear-gradient(135deg, #7276f7, #7c40e8) border-box;
+    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
     -webkit-mask-composite: destination-out;
     mask-composite: exclude;
   }

package/dist/styles/components/components/SSITabView/index.js

@@ -2,5 +2,5 @@ import styled from 'styled-components';
 export const SSITabViewContainerStyled = styled.div `
   display: flex;
   flex-direction: column;
-  width: 100%
+  width: 100%;
 `;

package/dist/styles/components/components/SSIToast/index.d.ts

@@ -0,0 +1,4 @@
+export declare const SSIToastContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SSIToastBadgeContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SSIToastTitleContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SSIToastMessageTextStyled: import("styled-components").StyledComponent<"span", any, {}, never>;

package/dist/styles/components/components/SSIToast/index.js

@@ -0,0 +1,24 @@
+import styled from 'styled-components';
+import { alertColors } from '@sphereon/ui-components.core';
+import { SSIFlexDirectionRowViewStyled, SSIRoundedContainerStyled } from '../../containers';
+import { SSITextH4DarkStyled } from '../../fonts';
+export const SSIToastContainerStyled = styled(SSIRoundedContainerStyled) `
+  //TODO we need better width, use a max width and use content to scale
+  // 96.8%;
+  width: 326px;
+  background-color: ${alertColors.secondaryLight};
+  border-radius: 8px;
+  justify-content: center;
+  padding: 18px 18px 15px 18px;
+`;
+export const SSIToastBadgeContainerStyled = styled.div `
+  margin-right: 10px;
+  justify-content: center;
+`;
+export const SSIToastTitleContainerStyled = styled(SSIFlexDirectionRowViewStyled) `
+  margin-bottom: 12px;
+  width: 100%;
+`;
+export const SSIToastMessageTextStyled = styled(SSITextH4DarkStyled) `
+  width: 100%;
+`;

package/dist/styles/components/components/SSIToastContainer/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const SSIToastContainerContainerStyled: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-toastify").ToastContainerProps & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;

package/dist/styles/components/components/SSIToastContainer/index.js

@@ -0,0 +1,283 @@
+import styled from 'styled-components';
+import { ToastContainer } from 'react-toastify';
+export const SSIToastContainerContainerStyled = styled(ToastContainer) `
+  &&&.Toastify__toast-container {
+    z-index: 9999;
+    -webkit-transform: translate3d(0, 0, 9999);
+    position: fixed;
+    box-sizing: border-box;
+  }
+  &&&.Toastify__toast-container--top-left {
+    top: 1em;
+    left: 1em;
+  }
+  &&&.Toastify__toast-container--top-center {
+    top: 1em;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+  &&&.Toastify__toast-container--top-right {
+    top: 1em;
+    right: 1em;
+  }
+  &&&.Toastify__toast-container--bottom-left {
+    bottom: 1em;
+    left: 1em;
+  }
+  &&&.Toastify__toast-container--bottom-center {
+    bottom: 1em;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+  &&&.Toastify__toast-container--bottom-right {
+    bottom: 1em;
+    right: 1em;
+  }
+
+  @media only screen and (max-width : 480px) {
+    .Toastify__toast-container {
+      width: 100vw;
+      padding: 0;
+      left: 0;
+      margin: 0;
+    }
+    .Toastify__toast-container--top-left, .Toastify__toast-container--top-center, .Toastify__toast-container--top-right {
+      top: 0;
+      transform: translateX(0);
+    }
+    .Toastify__toast-container--bottom-left, .Toastify__toast-container--bottom-center, .Toastify__toast-container--bottom-right {
+      bottom: 0;
+      transform: translateX(0);
+    }
+    .Toastify__toast-container--rtl {
+      right: 0;
+      left: initial;
+    }
+  }
+  .Toastify__toast {
+    position: relative;
+    box-sizing: border-box;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    overflow: hidden;
+    cursor: default;
+    direction: ltr;
+    z-index: 0;
+  }
+  .Toastify__toast--rtl {
+    direction: rtl;
+  }
+  .Toastify__toast--close-on-click {
+    cursor: pointer;
+  }
+  .Toastify__toast-body {
+    margin: auto 0;
+    -ms-flex: 1 1 auto;
+    flex: 1 1 auto;
+    padding: 6px;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-align: center;
+    align-items: center;
+  }
+  .Toastify__toast-body > div:last-child {
+    word-break: break-word;
+    -ms-flex: 1;
+    flex: 1;
+  }
+
+  .Toastify--animate {
+    animation-fill-mode: both;
+    animation-duration: 0.7s;
+  }
+
+  @media only screen and (max-width : 480px) {
+    .Toastify__toast {
+      margin-bottom: 0;
+      border-radius: 0;
+    }
+  }
+
+  @keyframes Toastify__trackProgress {
+    0% {
+      transform: scaleX(1);
+    }
+    100% {
+      transform: scaleX(0);
+    }
+  }
+
+  .Toastify__progress-bar--animated {
+    animation: Toastify__trackProgress linear 1 forwards;
+  }
+  .Toastify__progress-bar--controlled {
+    transition: transform 0.2s;
+  }
+  .Toastify__progress-bar--rtl {
+    right: 0;
+    left: initial;
+    transform-origin: right;
+  }
+
+  @keyframes Toastify__bounceInRight {
+    from, 60%, 75%, 90%, to {
+      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+    }
+    from {
+      opacity: 0;
+      transform: translate3d(3000px, 0, 0);
+    }
+    60% {
+      opacity: 1;
+      transform: translate3d(-25px, 0, 0);
+    }
+    75% {
+      transform: translate3d(10px, 0, 0);
+    }
+    90% {
+      transform: translate3d(-5px, 0, 0);
+    }
+    to {
+      transform: none;
+    }
+  }
+  @keyframes Toastify__bounceOutRight {
+    20% {
+      opacity: 1;
+      transform: translate3d(-20px, 0, 0);
+    }
+    to {
+      opacity: 0;
+      transform: translate3d(2000px, 0, 0);
+    }
+  }
+  @keyframes Toastify__bounceInLeft {
+    from, 60%, 75%, 90%, to {
+      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+    }
+    0% {
+      opacity: 0;
+      transform: translate3d(-3000px, 0, 0);
+    }
+    60% {
+      opacity: 1;
+      transform: translate3d(25px, 0, 0);
+    }
+    75% {
+      transform: translate3d(-10px, 0, 0);
+    }
+    90% {
+      transform: translate3d(5px, 0, 0);
+    }
+    to {
+      transform: none;
+    }
+  }
+  @keyframes Toastify__bounceOutLeft {
+    20% {
+      opacity: 1;
+      transform: translate3d(20px, 0, 0);
+    }
+    to {
+      opacity: 0;
+      transform: translate3d(-2000px, 0, 0);
+    }
+  }
+  @keyframes Toastify__bounceInUp {
+    from, 60%, 75%, 90%, to {
+      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+    }
+    from {
+      opacity: 0;
+      transform: translate3d(0, 3000px, 0);
+    }
+    60% {
+      opacity: 1;
+      transform: translate3d(0, -20px, 0);
+    }
+    75% {
+      transform: translate3d(0, 10px, 0);
+    }
+    90% {
+      transform: translate3d(0, -5px, 0);
+    }
+    to {
+      transform: translate3d(0, 0, 0);
+    }
+  }
+  @keyframes Toastify__bounceOutUp {
+    20% {
+      transform: translate3d(0, -10px, 0);
+    }
+    40%, 45% {
+      opacity: 1;
+      transform: translate3d(0, 20px, 0);
+    }
+    to {
+      opacity: 0;
+      transform: translate3d(0, -2000px, 0);
+    }
+  }
+  @keyframes Toastify__bounceInDown {
+    from, 60%, 75%, 90%, to {
+      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+    }
+    0% {
+      opacity: 0;
+      transform: translate3d(0, -3000px, 0);
+    }
+    60% {
+      opacity: 1;
+      transform: translate3d(0, 25px, 0);
+    }
+    75% {
+      transform: translate3d(0, -10px, 0);
+    }
+    90% {
+      transform: translate3d(0, 5px, 0);
+    }
+    to {
+      transform: none;
+    }
+  }
+  @keyframes Toastify__bounceOutDown {
+    20% {
+      transform: translate3d(0, 10px, 0);
+    }
+    40%, 45% {
+      opacity: 1;
+      transform: translate3d(0, -20px, 0);
+    }
+    to {
+      opacity: 0;
+      transform: translate3d(0, 2000px, 0);
+    }
+  }
+  .Toastify__bounce-enter--top-left, .Toastify__bounce-enter--bottom-left {
+    animation-name: Toastify__bounceInLeft;
+  }
+  .Toastify__bounce-enter--top-right, .Toastify__bounce-enter--bottom-right {
+    animation-name: Toastify__bounceInRight;
+  }
+  .Toastify__bounce-enter--top-center {
+    animation-name: Toastify__bounceInDown;
+  }
+  .Toastify__bounce-enter--bottom-center {
+    animation-name: Toastify__bounceInUp;
+  }
+
+  .Toastify__bounce-exit--top-left, .Toastify__bounce-exit--bottom-left {
+    animation-name: Toastify__bounceOutLeft;
+  }
+  .Toastify__bounce-exit--top-right, .Toastify__bounce-exit--bottom-right {
+    animation-name: Toastify__bounceOutRight;
+  }
+  .Toastify__bounce-exit--top-center {
+    animation-name: Toastify__bounceOutUp;
+  }
+  .Toastify__bounce-exit--bottom-center {
+    animation-name: Toastify__bounceOutDown;
+  }
+`;

package/dist/styles/components/components/index.d.ts

@@ -10,4 +10,8 @@ export * from './SSITableViewHeader';
 export * from './SSITableView';
 export * from './SSITabViewHeader';
 export * from './SSITabView';
+export * from './SSIToast';
+export * from './SSIToastContainer';
+export * from './SSIProfileIcon';
+export * from './SSIHoverText';
 export * from './SSICheckbox';

package/dist/styles/components/components/index.js

@@ -10,4 +10,8 @@ export * from './SSITableViewHeader';
 export * from './SSITableView';
 export * from './SSITabViewHeader';
 export * from './SSITabView';
+export * from './SSIToast';
+export * from './SSIToastContainer';
+export * from './SSIProfileIcon';
+export * from './SSIHoverText';
 export * from './SSICheckbox';

package/dist/styles/components/fonts/index.d.ts

@@ -1,10 +1,12 @@
 export declare const SSITextH1Styled: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const SSITextH2Styled: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const SSITextH2SemiBoldStyled: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const SSITextH3Styled: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const SSITextH3LightStyled: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const SSITextH4Styled: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const SSITextH4SemiBoldStyled: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const SSITextH4LightStyled: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const SSITextH4DarkStyled: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const SSITextH4SemiBoldLightStyled: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const SSITextH5Styled: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const SSITextH5LightStyled: import("styled-components").StyledComponent<"span", any, {}, never>;

package/dist/styles/components/fonts/index.js

@@ -1,12 +1,15 @@
 import styled from 'styled-components';
 import { fontColors } from '@sphereon/ui-components.core';
-import { SSITextH1Css, SSITextH2Css, SSITextH3Css, SSITextH4Css, SSITextH4SemiBoldCss, SSITextH5Css, SSITextH6Css } from '../../css';
+import { SSITextH1Css, SSITextH2Css, SSITextH2SemiBoldStyledCss, SSITextH3Css, SSITextH4Css, SSITextH4SemiBoldCss, SSITextH5Css, SSITextH6Css } from '../../css';
 export const SSITextH1Styled = styled.span `
   ${SSITextH1Css}
 `;
 export const SSITextH2Styled = styled.span `
   ${SSITextH2Css}
 `;
+export const SSITextH2SemiBoldStyled = styled.span `
+  ${SSITextH2SemiBoldStyledCss}
+`;
 export const SSITextH3Styled = styled.span `
   ${SSITextH3Css}
 `;
@@ -22,6 +25,9 @@ export const SSITextH4SemiBoldStyled = styled.span `
 export const SSITextH4LightStyled = styled(SSITextH4Styled) `
   color: ${fontColors.light};
 `;
+export const SSITextH4DarkStyled = styled(SSITextH4Styled) `
+  color: ${fontColors.dark};
+`;
 export const SSITextH4SemiBoldLightStyled = styled(SSITextH4SemiBoldStyled) `
   color: ${fontColors.light};
 `;

package/dist/styles/css/index.d.ts

@@ -1,5 +1,6 @@
 export declare const SSITextH1Css: import("styled-components").FlattenSimpleInterpolation;
 export declare const SSITextH2Css: import("styled-components").FlattenSimpleInterpolation;
+export declare const SSITextH2SemiBoldStyledCss: import("styled-components").FlattenSimpleInterpolation;
 export declare const SSITextH3Css: import("styled-components").FlattenSimpleInterpolation;
 export declare const SSITextH4Css: import("styled-components").FlattenSimpleInterpolation;
 export declare const SSITextH4SemiBoldCss: import("styled-components").FlattenSimpleInterpolation;

package/dist/styles/css/index.js

@@ -14,6 +14,13 @@ export const SSITextH2Css = css `
   line-height: ${fontStyle.h2Regular.lineHeight}px;
   height: auto;
 `;
+export const SSITextH2SemiBoldStyledCss = css `
+  font-family: ${fontStyle.h2SemiBold.fontFamily};
+  font-size: ${fontStyle.h2SemiBold.fontSize}px;
+  font-weight: ${fontStyle.h2SemiBold.fontWeight};
+  line-height: ${fontStyle.h2SemiBold.lineHeight}px;
+  height: auto;
+`;
 export const SSITextH3Css = css `
   font-family: ${fontStyle.h3Regular.fontFamily};
   font-size: ${fontStyle.h3Regular.fontSize}px;

package/dist/styles/index.d.ts

@@ -0,0 +1,3 @@
+export * from './typography';
+export * from './css';
+export * from './components';

package/dist/styles/index.js

@@ -0,0 +1,3 @@
+export * from './typography';
+export * from './css';
+export * from './components';

package/dist/types/button/index.d.ts

@@ -0,0 +1,7 @@
+import { ButtonIcon } from '@sphereon/ui-components.core';
+export type Button = {
+    caption: string;
+    onClick: () => Promise<void>;
+    icon?: ButtonIcon;
+    disabled?: boolean;
+};

package/dist/types/button/index.js

@@ -0,0 +1 @@
+export {};

package/dist/types/index.d.ts

@@ -1 +1,3 @@
-export * from './component';
+export * from './button';
+export * from './table';
+export * from './toast';

package/dist/types/index.js

@@ -1 +1,3 @@
-export * from './component';
+export * from './button';
+export * from './table';
+export * from './toast';

package/dist/types/table/index.d.ts

@@ -0,0 +1,11 @@
+import { AccessorFn, DeepKeys } from '@tanstack/react-table';
+export declare enum TableCellType {
+    TEXT = "text",
+    LABEL = "label"
+}
+export type ColumnHeader<T> = {
+    accessor: AccessorFn<T> | DeepKeys<T>;
+    type: TableCellType;
+    label?: string;
+    truncationLength?: number;
+};

package/dist/types/table/index.js

@@ -0,0 +1,5 @@
+export var TableCellType;
+(function (TableCellType) {
+    TableCellType["TEXT"] = "text";
+    TableCellType["LABEL"] = "label";
+})(TableCellType || (TableCellType = {}));

package/dist/types/toast/index.d.ts

@@ -0,0 +1,6 @@
+export type ToastConfigParams<Props> = {
+    title?: string;
+    message?: string;
+    onClick?: () => Promise<void>;
+    props?: Props;
+};

package/dist/types/toast/index.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sphereon/ui-components.ssi-react",
   "private": false,
-  "version": "0.1.3-unstable.24+b4be06e",
+  "version": "0.1.3-unstable.30+15069b0",
   "description": "SSI UI components for React",
   "repository": "git@github.com:Sphereon-Opensource/UI-Components.git",
   "author": "Sphereon <dev@sphereon.com>",
@@ -28,9 +28,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@sphereon/ui-components.core": "0.1.3-unstable.24+b4be06e",
+    "@sphereon/ui-components.core": "0.1.3-unstable.30+15069b0",
     "@tanstack/react-table": "^8.9.3",
-    "react-loader-spinner": "^5.4.5",
+    "react-toastify": "^9.1.3",
     "styled-components": "^5.3.3"
   },
   "devDependencies": {
@@ -41,5 +41,5 @@
   "peerDependencies": {
     "react": ">= 16.8.0"
   },
-  "gitHead": "b4be06eb6549343f0d9a20d625e3f2e484abc750"
+  "gitHead": "15069b0fe7847904e9a164e3d7a7e8765b1f9578"
 }

package/dist/components/assets/loaders/SSILoader/index.d.ts

@@ -1,22 +0,0 @@
-import React from "react";
-interface SSILoaderProps {
-    ariaLabel?: string;
-    height?: number;
-    width?: number;
-    color?: string;
-    secondaryColor?: string;
-    strokeWidth?: number;
-    strokeWidthSecondary?: number;
-    visible?: boolean;
-    wrapperStyle?: {
-        [key: string]: string;
-    };
-    wrapperClass?: string;
-    timeout?: number;
-    callback: (state?: any) => Promise<void>;
-}
-export default class SSILoader extends React.Component<SSILoaderProps, any> {
-    componentDidMount(): void;
-    render(): JSX.Element;
-}
-export {};

package/dist/components/assets/loaders/SSILoader/index.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from "react";
-import { Oval } from "react-loader-spinner";
-export default class SSILoader extends React.Component {
-    componentDidMount() {
-        setTimeout(async (state) => {
-            await this.props.callback(state);
-        }, this.props.timeout ?? 0);
-    }
-    render() {
-        return (_jsx(Oval, { ...this.props }));
-    }
-}

package/dist/components/labels/SSIText/index.d.ts

@@ -1,7 +0,0 @@
-import { FC } from 'react';
-export type Props = {
-    truncationLength?: number;
-    value: string;
-};
-declare const SSIText: FC<Props>;
-export default SSIText;

package/dist/components/labels/SSIText/index.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { SSITruncatedTextStyled, SSITruncatedContainerStyled, SSITruncatedFullTextStyled } from '../../../styles/components/components/SSIText';
-const SSIText = (props) => {
-    const { value, truncationLength } = props;
-    if (truncationLength && value.length > truncationLength) {
-        const truncatedText = value.substring(0, truncationLength);
-        return (_jsxs(SSITruncatedContainerStyled, { children: [_jsx(SSITruncatedTextStyled, { children: truncatedText }), _jsx(SSITruncatedFullTextStyled, { children: value })] }));
-    }
-    else {
-        return _jsx("p", { children: value });
-    }
-};
-export default SSIText;

package/dist/styles/components/components/SSIText/index.d.ts

@@ -1,3 +0,0 @@
-export declare const SSITruncatedFullTextStyled: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const SSITruncatedContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SSITruncatedTextStyled: import("styled-components").StyledComponent<"span", any, {}, never>;