@sphereon/ui-components.ssi-react 0.1.3-unstable.39 → 0.1.3-unstable.40

package/dist/components/views/SSITableView/index.js

@@ -7,6 +7,7 @@ import SSITypeLabel from '../../labels/SSITypeLabel';
 import SSIHoverText from '../../fields/SSIHoverText';
 import { SSITableViewCellContainerStyled as CellContainer, SSITableViewContainerStyled as Container, SSITableViewHeaderCellContainerStyled as HeaderCellContainer, SSITableViewLabelCellStyled as LabelCell, SSITableViewResultCountCaptionStyled as ResultCountCaption, SSITableViewRowContainerStyled as RowContainer, SSITableViewTableContainerStyled as TableContainer, } from '../../../styles';
 import { TableCellType } from '../../../types';
+import { SSIStatusLabel } from "../../../index";
 function IndeterminateCheckbox({ indeterminate, className = '', ...rest }) {
     const ref = React.useRef(null);
     React.useEffect(() => {
@@ -24,6 +25,9 @@ const getCellFormatting = (type, value, truncationLength) => {
             const labels = Array.isArray(value) ? value.map((label) => _jsx(SSITypeLabel, { type: label })) : _jsx(SSITypeLabel, { type: value });
             return _jsx(LabelCell, { children: labels });
         }
+        case TableCellType.STATUS: {
+            return _jsx(SSIStatusLabel, { status: value });
+        }
         default:
             return _jsx("div", {});
     }

package/dist/index.d.ts

@@ -20,9 +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";
 import SSIHoverText from './components/fields/SSIHoverText';
 export * from './styles/components/fonts';
 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, SSILoader, SSIHoverText };
+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/index.js

@@ -20,9 +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";
 import SSIHoverText from './components/fields/SSIHoverText';
 export * from './styles/components/fonts';
 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, SSILoader, SSIHoverText };
+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/SSIStatusLabel/index.js

@@ -4,6 +4,7 @@ import { SSITextH5LightStyled } from '../../fonts';
 export const SSIStatusLabelContainerStyled = styled(SSIFlexDirectionRowViewStyled) `
   border-radius: 9px;
   border: 1px solid #000;
+  width: fit-content;
 `;
 export const SSIStatusLabelStatusCaptionStyled = styled(SSITextH5LightStyled) `
   margin-left: 7px;

package/dist/types/component/index.js

@@ -0,0 +1 @@
+"use strict";

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

@@ -1,7 +1,8 @@
 import { AccessorFn, DeepKeys } from '@tanstack/react-table';
 export declare enum TableCellType {
     TEXT = "text",
-    LABEL = "label"
+    LABEL = "label",
+    STATUS = "status"
 }
 export type ColumnHeader<T> = {
     accessor: AccessorFn<T> | DeepKeys<T>;

package/dist/types/table/index.js

@@ -2,4 +2,5 @@ export var TableCellType;
 (function (TableCellType) {
     TableCellType["TEXT"] = "text";
     TableCellType["LABEL"] = "label";
+    TableCellType["STATUS"] = "status";
 })(TableCellType || (TableCellType = {}));

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sphereon/ui-components.ssi-react",
   "private": false,
-  "version": "0.1.3-unstable.39+14d6b63",
+  "version": "0.1.3-unstable.40+5045248",
   "description": "SSI UI components for React",
   "repository": "git@github.com:Sphereon-Opensource/UI-Components.git",
   "author": "Sphereon <dev@sphereon.com>",
@@ -28,7 +28,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@sphereon/ui-components.core": "0.1.3-unstable.39+14d6b63",
+    "@sphereon/ui-components.core": "0.1.3-unstable.40+5045248",
     "@tanstack/react-table": "^8.9.3",
     "react-toastify": "^9.1.3",
     "styled-components": "^5.3.3"
@@ -41,5 +41,5 @@
   "peerDependencies": {
     "react": ">= 16.8.0"
   },
-  "gitHead": "14d6b6364e68d75fe71454c2cb37cb82dede7cb5"
+  "gitHead": "5045248918930f27e749ef80b78bde21691fc92b"
 }

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

@@ -1,20 +0,0 @@
-import React from "react";
-interface SSILoaderProps {
-    size?: number;
-    color?: string;
-    strokeWidth?: number;
-    timeout?: number;
-    callback: (state?: any) => Promise<void>;
-}
-export default class SSILoader extends React.Component<SSILoaderProps, any> {
-    private strokeWidth;
-    private halfStrokeWidth;
-    private diameter;
-    private radius;
-    private diameterWithoutHalfStrokeWidth;
-    private radiusWithoutHalfStrokeWidth;
-    private color;
-    componentDidMount(): void;
-    render(): JSX.Element;
-}
-export {};

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

@@ -1,22 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from "react";
-export default class SSILoader extends React.Component {
-    strokeWidth = this.props.strokeWidth ?? 16;
-    halfStrokeWidth = (this.strokeWidth / 2);
-    diameter = this.props.size ?? 200;
-    radius = (this.diameter / 2);
-    diameterWithoutHalfStrokeWidth = (this.diameter - this.halfStrokeWidth);
-    radiusWithoutHalfStrokeWidth = (this.radius - this.halfStrokeWidth);
-    color = this.props.color ?? '#0B81FF';
-    componentDidMount() {
-        setTimeout(async (state) => {
-            await this.props.callback(state);
-        }, this.props.timeout ?? 0);
-    }
-    render() {
-        return (_jsx("div", { style: { width: this.diameter, height: this.diameter }, children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", viewBox: `0 0 ${this.diameter} ${this.diameter}`, fill: "none", color: `${this.color}`, children: [_jsxs("defs", { children: [_jsxs("linearGradient", { id: "spinner-secondHalf", children: [_jsx("stop", { offset: "0%", stopOpacity: "0", stopColor: "currentColor" }), _jsx("stop", { offset: "100%", stopOpacity: "0.5", stopColor: "currentColor" })] }), _jsxs("linearGradient", { id: "spinner-firstHalf", children: [_jsx("stop", { offset: "0%", stopOpacity: "1", stopColor: "currentColor" }), _jsx("stop", { offset: "100%", stopOpacity: "0.5", stopColor: "currentColor" })] })] }), _jsxs("g", { strokeWidth: this.strokeWidth, children: [_jsx("path", { stroke: "url(#spinner-secondHalf)", d: `M ${this.halfStrokeWidth} ${this.radius} 
-                    A ${this.radiusWithoutHalfStrokeWidth} ${this.radiusWithoutHalfStrokeWidth} 0 0 1 ${this.diameterWithoutHalfStrokeWidth} ${this.radius}` }), _jsx("path", { stroke: "url(#spinner-firstHalf)", d: `M ${this.diameterWithoutHalfStrokeWidth} ${this.radius} 
-              A ${this.radiusWithoutHalfStrokeWidth} ${this.radiusWithoutHalfStrokeWidth} 0 0 1 ${this.halfStrokeWidth} ${this.radius}` }), _jsx("path", { stroke: "currentColor", strokeLinecap: "round", d: `M ${this.halfStrokeWidth} ${this.radius} 
-              A ${this.radiusWithoutHalfStrokeWidth} ${this.radiusWithoutHalfStrokeWidth} 0 0 1 ${this.halfStrokeWidth} ${this.radiusWithoutHalfStrokeWidth}` })] }), _jsx("animateTransform", { from: "0 0 0", to: "360 0 0", attributeName: "transform", type: "rotate", repeatCount: "indefinite", dur: "1300ms" })] }) }));
-    }
-}