@sphereon/ui-components.ssi-react 0.1.3-unstable.99 → 0.2.1-unstable.2

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

@@ -1,4 +1,4 @@
-import styled from 'styled-components';
+import styled, { css } from 'styled-components';
 import { backgroundColors, borderColors, fontColors } from '@sphereon/ui-components.core';
 import { SSITextH2Css, SSITextH3Css } from '../../../css';
 export const SSITableViewContainerStyled = styled.div `
@@ -17,13 +17,27 @@ export const SSITableViewTableContainerStyled = styled.table `
   border-collapse: collapse;
   background-color: ${backgroundColors.lightGrey};
 `;
-export const SSITableViewRowContainerStyled = styled.tr `
+export const SSITableViewHeaderRowContainerStyled = styled.tr `
   border-bottom: 1px solid ${borderColors.lightGrey};
+  background-color: ${backgroundColors.primaryLight};
+`;
+export const SSITableViewRowContainerStyled = styled.tr `
+  background-color: ${backgroundColors.primaryLight};
+
+  &:not(:last-child) {
+    border-bottom: 1px solid ${borderColors.lightGrey};
+  }
+  
+  ${props => props.enableHover &&
+    css `
+        &:hover {
+          background-color: #ececec; // TODO
+        }
+      `}
 `;
 export const SSITableViewCellContainerStyled = styled.td `
   ${SSITextH3Css};
   color: ${fontColors.dark};
-  background-color: ${backgroundColors.primaryLight};
   padding: 20px 16px 20px 16px;
   text-align: left;
   //setting border-box makes padding be included in the width, otherwise content-box is used and then padding is excluded from the width
@@ -43,3 +57,7 @@ export const SSITableViewResultCountCaptionStyled = styled.div `
   ${SSITextH3Css};
   margin-left: 24px;
 `;
+export const TableViewRowSelectionCheckboxContainerStyled = styled.div `
+  width: 20px;
+  height: 20px;
+`;

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

@@ -3,3 +3,4 @@ export declare const SSITableViewHeaderContentContainerStyled: import("styled-co
 export declare const SSITableViewHeaderActionsContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SSITableViewHeaderFilterContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SSITableViewHeaderShowOptionContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TableViewHeaderStaticActionsContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -27,3 +27,11 @@ export const SSITableViewHeaderShowOptionContainerStyled = styled.div `
   text-align: left;
   align-items: center;
 `;
+export const TableViewHeaderStaticActionsContainerStyled = styled.div `
+  height: 48px;
+  flex-grow: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 50px;
+`;

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

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
 import { alertColors } from '@sphereon/ui-components.core';
 import { SSIFlexDirectionRowViewStyled, SSIRoundedContainerStyled } from '../../containers';
-import { SSITextH4DarkStyled } from '../../../fonts';
+import { SSITextH4Styled } from '../../../fonts';
 export const SSIToastContainerStyled = styled(SSIRoundedContainerStyled) `
   //TODO we need better width, use a max width and use content to scale
   // 96.8%;
@@ -19,6 +19,6 @@ export const SSIToastTitleContainerStyled = styled(SSIFlexDirectionRowViewStyled
   margin-bottom: 12px;
   width: 100%;
 `;
-export const SSIToastMessageTextStyled = styled(SSITextH4DarkStyled) `
+export const SSIToastMessageTextStyled = styled(SSITextH4Styled) `
   width: 100%;
 `;

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

@@ -0,0 +1,2 @@
+export declare const TextFieldInputContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TextFieldInputInputStyled: import("styled-components").StyledComponent<"input", any, {}, never>;

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

@@ -0,0 +1,27 @@
+import { borderColors, fontColors } from '@sphereon/ui-components.core';
+import styled from 'styled-components';
+import { SSITextH2Css } from '../../../css';
+export const TextFieldInputContainerStyled = styled.div `
+  display: flex;
+  flex-direction: column;
+`;
+export const TextFieldInputInputStyled = styled.input `
+  ${SSITextH2Css};
+  color: ${fontColors.dark};
+  display: flex;
+  padding: 12px 16px;
+  align-items: center;
+  border-radius: 4px;
+  border: 1px solid ${borderColors.lightGrey};
+  outline: none;
+  background-color: unset;
+  font-family: Poppins, serif;
+
+  &:focus {
+    border-color: ${borderColors.purple};
+  }
+
+  &:hover {
+    border-color: ${borderColors.purple};
+  }
+`;

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

@@ -0,0 +1 @@
+export declare const ButtonFlexRowStyled: import("styled-components").StyledComponent<"button", any, {}, never>;

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

@@ -0,0 +1,4 @@
+import styled from 'styled-components';
+export const ButtonFlexRowStyled = styled('button') `
+  flex-direction: row;
+`;

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

@@ -1,11 +1,12 @@
-export * from './RowActionMenuButton';
+export * from './buttons';
+export * from './DropDownListItem';
 export * from './SSICredentialCardView';
 export * from './SSICredentialMiniCardView';
 export * from './SSIStatusLabel';
 export * from './SSIPrimaryButton';
 export * from './SSISecondaryButton';
 export * from './SSIIconButton';
-export * from './SSIDropDownList';
+export * from './DropDownList';
 export * from './SSITypeLabel';
 export * from './SSITableViewHeader';
 export * from './SSITableView';
@@ -18,3 +19,11 @@ export * from './SSIHoverText';
 export * from './SSICheckbox';
 export * from './ProgressStepIndicator';
 export * from './StepMarker';
+export * from './FileSelectionField';
+export * from './DragAndDropBox';
+export * from './PassportPhotoControl';
+export * from './CredentialIssuanceWizardView';
+export * from './Pagination';
+export * from './CredentialViewItem';
+export * from './JSONDataView';
+export * from './TextInputField';

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

@@ -1,11 +1,12 @@
-export * from './RowActionMenuButton';
+export * from './buttons';
+export * from './DropDownListItem';
 export * from './SSICredentialCardView';
 export * from './SSICredentialMiniCardView';
 export * from './SSIStatusLabel';
 export * from './SSIPrimaryButton';
 export * from './SSISecondaryButton';
 export * from './SSIIconButton';
-export * from './SSIDropDownList';
+export * from './DropDownList';
 export * from './SSITypeLabel';
 export * from './SSITableViewHeader';
 export * from './SSITableView';
@@ -18,3 +19,11 @@ export * from './SSIHoverText';
 export * from './SSICheckbox';
 export * from './ProgressStepIndicator';
 export * from './StepMarker';
+export * from './FileSelectionField';
+export * from './DragAndDropBox';
+export * from './PassportPhotoControl';
+export * from './CredentialIssuanceWizardView';
+export * from './Pagination';
+export * from './CredentialViewItem';
+export * from './JSONDataView';
+export * from './TextInputField';

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

@@ -7,4 +7,6 @@ export declare const SSITextH4Css: import("styled-components").FlattenSimpleInte
 export declare const SSITextH4SemiBoldCss: import("styled-components").FlattenSimpleInterpolation;
 export declare const SSITextH5Css: import("styled-components").FlattenSimpleInterpolation;
 export declare const SSITextH6Css: import("styled-components").FlattenSimpleInterpolation;
+export declare const SSITextH7RegularCss: import("styled-components").FlattenSimpleInterpolation;
+export declare const SSITextH7SemiBoldCss: import("styled-components").FlattenSimpleInterpolation;
 export declare const gradient100TextCss: import("styled-components").FlattenSimpleInterpolation;

package/dist/styles/css/index.js

@@ -64,6 +64,20 @@ export const SSITextH6Css = css `
   line-height: ${fontStyle.h6.lineHeight}px;
   height: auto;
 `;
+export const SSITextH7RegularCss = css `
+  font-family: ${fontStyle.h7Regular.fontFamily};
+  font-size: ${fontStyle.h7Regular.fontSize}px;
+  font-weight: ${fontStyle.h7Regular.fontWeight};
+  line-height: ${fontStyle.h7Regular.lineHeight}px;
+  height: auto;
+`;
+export const SSITextH7SemiBoldCss = css `
+  font-family: ${fontStyle.h7SemiBold.fontFamily};
+  font-size: ${fontStyle.h7SemiBold.fontSize}px;
+  font-weight: ${fontStyle.h7SemiBold.fontWeight};
+  line-height: ${fontStyle.h7SemiBold.lineHeight}px;
+  height: auto;
+`;
 export const gradient100TextCss = css `
   background: ${gradientColors['100']};
   background-clip: text;

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

@@ -8,9 +8,9 @@ export declare const SSITextH3LightStyled: import("styled-components").StyledCom
 export declare const SSITextH4Styled: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SSITextH4SemiBoldStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SSITextH4LightStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SSITextH4DarkStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SSITextH4SemiBoldLightStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SSITextH5Styled: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SSITextH5LightStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SSITextH6Styled: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SSITextH6LightStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SSITextH7RegularStyled: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/styles/fonts/index.js

@@ -1,51 +1,61 @@
 import styled from 'styled-components';
 import { fontColors } from '@sphereon/ui-components.core';
-import { SSITextH1Css, SSITextH1SemiBoldCss, SSITextH2Css, SSITextH2SemiBoldStyledCss, SSITextH3Css, SSITextH4Css, SSITextH4SemiBoldCss, SSITextH5Css, SSITextH6Css, } from '../css';
+import { SSITextH1Css, SSITextH1SemiBoldCss, SSITextH2Css, SSITextH2SemiBoldStyledCss, SSITextH3Css, SSITextH4Css, SSITextH4SemiBoldCss, SSITextH5Css, SSITextH6Css, SSITextH7RegularCss, } from '../css';
 export const SSITextH1Styled = styled.div `
-  ${SSITextH1Css}
+  ${SSITextH1Css};
+  color: ${fontColors.dark};
 `;
 export const SSITextH1SemiBoldStyled = styled.div `
-  ${SSITextH1SemiBoldCss}
+  ${SSITextH1SemiBoldCss};
+  color: ${fontColors.dark};
 `;
 export const SSITextH1SemiBoldLightStyled = styled(SSITextH1SemiBoldStyled) `
   color: ${fontColors.light};
 `;
 export const SSITextH2Styled = styled.div `
-  ${SSITextH2Css}
+  ${SSITextH2Css};
+  color: ${fontColors.dark};
 `;
 export const SSITextH2SemiBoldStyled = styled.div `
-  ${SSITextH2SemiBoldStyledCss}
+  ${SSITextH2SemiBoldStyledCss};
+  color: ${fontColors.dark};
 `;
 export const SSITextH3Styled = styled.div `
-  ${SSITextH3Css}
+  ${SSITextH3Css};
+  color: ${fontColors.dark};
 `;
 export const SSITextH3LightStyled = styled(SSITextH3Styled) `
   color: ${fontColors.light};
 `;
 export const SSITextH4Styled = styled.div `
-  ${SSITextH4Css}
+  ${SSITextH4Css};
+  color: ${fontColors.dark};
 `;
 export const SSITextH4SemiBoldStyled = styled.div `
-  ${SSITextH4SemiBoldCss}
+  ${SSITextH4SemiBoldCss};
+  color: ${fontColors.dark};
 `;
 export const SSITextH4LightStyled = styled(SSITextH4Styled) `
   color: ${fontColors.light};
 `;
-export const SSITextH4DarkStyled = styled(SSITextH4Styled) `
-  color: ${fontColors.dark};
-`;
 export const SSITextH4SemiBoldLightStyled = styled(SSITextH4SemiBoldStyled) `
   color: ${fontColors.light};
 `;
 export const SSITextH5Styled = styled.div `
-  ${SSITextH5Css}
+  ${SSITextH5Css};
+  color: ${fontColors.dark};
 `;
 export const SSITextH5LightStyled = styled(SSITextH5Styled) `
   color: ${fontColors.light};
 `;
 export const SSITextH6Styled = styled.div `
-  ${SSITextH6Css}
+  ${SSITextH6Css};
+  color: ${fontColors.dark};
 `;
 export const SSITextH6LightStyled = styled(SSITextH6Styled) `
   color: ${fontColors.light};
 `;
+export const SSITextH7RegularStyled = styled.div `
+  ${SSITextH7RegularCss};
+  color: ${fontColors.dark};
+`;

package/dist/styles/typography.js

@@ -72,6 +72,12 @@ export const fontStyle = {
         fontWeight: fontWeight[400],
         lineHeight: lineHeight[100],
     },
+    h7Regular: {
+        fontFamily: 'Poppins',
+        fontSize: fontSize[400],
+        fontWeight: fontWeight[400],
+        lineHeight: lineHeight[400],
+    },
     h7SemiBold: {
         fontFamily: 'Poppins',
         fontSize: fontSize[400],

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

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

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

@@ -0,0 +1,21 @@
+export declare enum AssetFilePermission {
+    PUBLIC = "public",
+    PRIVATE = "private"
+}
+export type ValueSelection = {
+    label: string;
+    value: string;
+};
+export declare enum FileSelectionFieldType {
+    FILE = "file",
+    IMAGE = "image"
+}
+export type PassportPhoto = {
+    file: File;
+    base64Uri: string;
+};
+export type PassportPhotoControlData = {
+    fileName: string;
+    mimeType: string;
+    base64Uri: string;
+};

package/dist/types/field/index.js

@@ -0,0 +1,10 @@
+export var AssetFilePermission;
+(function (AssetFilePermission) {
+    AssetFilePermission["PUBLIC"] = "public";
+    AssetFilePermission["PRIVATE"] = "private";
+})(AssetFilePermission || (AssetFilePermission = {}));
+export var FileSelectionFieldType;
+(function (FileSelectionFieldType) {
+    FileSelectionFieldType["FILE"] = "file";
+    FileSelectionFieldType["IMAGE"] = "image";
+})(FileSelectionFieldType || (FileSelectionFieldType = {}));

package/dist/types/index.d.ts

@@ -2,3 +2,5 @@ export * from './button';
 export * from './table';
 export * from './toast';
 export * from './indicator';
+export * from './field';
+export * from './view';

package/dist/types/index.js

@@ -2,3 +2,5 @@ export * from './button';
 export * from './table';
 export * from './toast';
 export * from './indicator';
+export * from './field';
+export * from './view';

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

@@ -1,31 +1,41 @@
 import { AccessorFn, DeepKeys } from '@tanstack/react-table';
-import { ButtonIcon } from '@sphereon/ui-components.core';
+import { Button } from '../button';
+import { ValueSelection } from '../field';
 export declare enum TableCellType {
     TEXT = "text",
     LABEL = "label",
     STATUS = "status",
-    CREDENTIAL_CARD = "credentialCard"
+    CREDENTIAL_CARD = "credentialCard",
+    CREDENTIAL_DETAILS = "credentialDetails",
+    ACTIONS = "actions",
+    COMBOBOX = "combobox"
 }
 export type ColumnHeader<T> = {
     accessor: AccessorFn<T> | DeepKeys<T>;
     type: TableCellType;
     label?: string;
-    opts?: TableCellOptions;
+    columnOptions?: TableColumnOptions;
 };
-export type TableCellOptions = {
-    truncationLength?: number;
-    enableHover?: boolean;
+export type TableColumnOptions = {
     columnMinWidth?: number;
     columnMaxWidth?: number;
     columnWidth?: number;
+    cellOptions?: TableCellOptions;
+};
+export type TableCellOptions = TextCellOptions | ComboboxCellOptions | ActionsCellOptions;
+export type TableRowSelection = {
+    rowId: string;
+    rowData: any;
+};
+export type TextCellOptions = {
+    truncationLength?: number;
+    enableHover?: boolean;
 };
-export type ActionGroup = {
-    caption: string;
-    actions: ActionButton[];
+export type ComboboxCellOptions = {
+    selectOptions?: Array<ValueSelection>;
+    defaultValue?: ValueSelection;
+    onChange?: (value: ValueSelection) => Promise<void>;
 };
-export type ActionButton = {
-    caption: string;
-    onClick: (rowData: any) => Promise<void>;
-    icon?: ButtonIcon;
-    disabled?: boolean;
+export type ActionsCellOptions = {
+    actions: Array<Button>;
 };

package/dist/types/table/index.js

@@ -4,4 +4,7 @@ export var TableCellType;
     TableCellType["LABEL"] = "label";
     TableCellType["STATUS"] = "status";
     TableCellType["CREDENTIAL_CARD"] = "credentialCard";
+    TableCellType["CREDENTIAL_DETAILS"] = "credentialDetails";
+    TableCellType["ACTIONS"] = "actions";
+    TableCellType["COMBOBOX"] = "combobox";
 })(TableCellType || (TableCellType = {}));

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

@@ -0,0 +1,14 @@
+import { JsonFormsCore, JsonSchema, UISchemaElement } from '@jsonforms/core';
+import { ErrorObject } from 'ajv';
+export type CredentialFormInput = Pick<JsonFormsCore, 'data' | 'errors'>;
+export type CredentialFormData = {
+    data?: any;
+    errors?: ErrorObject[];
+    evidence: Array<File>;
+};
+export type CredentialFormSelectionType = {
+    label: string;
+    schema?: JsonSchema;
+    uiSchema?: UISchemaElement;
+    credentialType: Array<string>;
+};

package/dist/types/view/index.js

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

package/dist/utils/FileUtils.d.ts

@@ -0,0 +1 @@
+export declare const base64UriToFile: (base64Uri: string, filename: string, mimeType: string) => File;

package/dist/utils/FileUtils.js

@@ -0,0 +1,7 @@
+import { fromString } from 'uint8arrays';
+export const base64UriToFile = (base64Uri, filename, mimeType) => {
+    const base64 = base64Uri.split(',')[1];
+    const uint8Array = fromString(base64, 'base64');
+    const blob = new Blob([uint8Array]);
+    return new File([blob], filename, { type: mimeType });
+};

package/dist/utils/ImageUtils.d.ts

@@ -0,0 +1,2 @@
+import { ImageSize } from '@sphereon/ui-components.core';
+export declare const getImageSize: (uri: string) => Promise<ImageSize>;

package/dist/utils/ImageUtils.js

@@ -0,0 +1,12 @@
+export const getImageSize = (uri) => {
+    return new Promise((resolve, reject) => {
+        const img = new Image();
+        img.onload = () => {
+            resolve({ width: img.width, height: img.height });
+        };
+        img.onerror = (error) => {
+            reject(error);
+        };
+        img.src = uri;
+    });
+};

package/dist/utils/index.d.ts

@@ -0,0 +1,2 @@
+export * from './FileUtils';
+export * from './ImageUtils';

package/dist/utils/index.js

@@ -0,0 +1,2 @@
+export * from './FileUtils';
+export * from './ImageUtils';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sphereon/ui-components.ssi-react",
   "private": false,
-  "version": "0.1.3-unstable.99+c8885e8",
+  "version": "0.2.1-unstable.2+4c8020a",
   "description": "SSI UI components for React",
   "repository": "git@github.com:Sphereon-Opensource/UI-Components.git",
   "author": "Sphereon <dev@sphereon.com>",
@@ -13,7 +13,8 @@
     "Self-sovereign identity (SSI)"
   ],
   "scripts": {
-    "build": "tsc",
+    "build": "tsc && pnpm run copy-css",
+    "copy-css": "cpy src/**/*.css dist --parents",
     "build:clean": "tsc --build --clean && tsc --build"
   },
   "source": "src/index.ts",
@@ -28,19 +29,35 @@
     "access": "public"
   },
   "dependencies": {
-    "@sphereon/ui-components.core": "0.1.3-unstable.99+c8885e8",
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.0",
+    "@jsonforms/core": "^3.2.1",
+    "@jsonforms/material-renderers": "^3.2.1",
+    "@jsonforms/react": "^3.2.1",
+    "@jsonforms/vanilla-renderers": "^3.2.1",
+    "@mui/icons-material": "^5.15.11",
+    "@mui/material": "^5.15.12",
+    "@mui/styled-engine-sc": "^5.14.12",
+    "@mui/system": "^5.15.12",
+    "@mui/x-date-pickers": "^6.19.5",
+    "@sphereon/ui-components.core": "0.2.1-unstable.2+4c8020a",
     "@tanstack/react-table": "^8.9.3",
-    "react-loader-spinner": "^5.4.5",
+    "react-json-tree": "^0.18.0",
+    "react-loader-spinner": "5.4.5",
+    "react-select": "^5.8.0",
     "react-toastify": "^9.1.3",
-    "styled-components": "^5.3.3"
+    "styled-components": "^5.3.3",
+    "uint8arrays": "^3.1.1"
   },
   "devDependencies": {
-    "@types/react": "~18.0.14",
+    "@types/react": "~18.2.67",
     "@types/styled-components": "^5.1.15",
+    "ajv": "^8.12.0",
+    "cpy-cli": "^5.0.0",
     "typescript": "4.9.5"
   },
   "peerDependencies": {
-    "react": ">= 16.8.0"
+    "react": ">= 18"
   },
-  "gitHead": "c8885e82d8b36ec6f2564dcc33d4aa4933a759ea"
+  "gitHead": "4c8020a435287a10dca85c22eac2a8841a9ad6ed"
 }

package/dist/components/assets/icons/BitterballenIcon/index.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { fontColors } from '@sphereon/ui-components.core';
-const BitterballenIcon = (props) => {
-    const { size = 42, color = fontColors.dark, style } = props;
-    return (_jsx("div", { style: { ...style, width: size, aspectRatio: 1, display: 'flex' }, children: _jsxs("svg", { width: "42", height: "43", viewBox: "0 0 42 43", fill: color, xmlns: "http://www.w3.org/2000/svg", children: [_jsx("circle", { cx: "13", cy: "21.5", r: "2", fill: "#303030" }), _jsx("circle", { cx: "21", cy: "21.5", r: "2", fill: "#303030" }), _jsx("circle", { cx: "29", cy: "21.5", r: "2", fill: "#303030" })] }) }));
-};
-export default BitterballenIcon;

package/dist/components/buttons/RowActionMenuButton/index.d.ts

@@ -1,13 +0,0 @@
-import { CSSProperties, FC } from 'react';
-import { ButtonIcon } from '@sphereon/ui-components.core';
-import { ActionButton } from '../../../index';
-import { Row } from '@tanstack/react-table';
-type Props = {
-    actions: ActionButton[];
-    icon: ButtonIcon;
-    color?: string;
-    style?: CSSProperties;
-    rowData?: Row<any>;
-};
-declare const RowActionMenuButton: FC<Props>;
-export default RowActionMenuButton;

package/dist/components/buttons/RowActionMenuButton/index.js

@@ -1,28 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect, useRef } from 'react';
-import { ButtonIcon } from '@sphereon/ui-components.core';
-import { SSIIconButton } from '../../../index';
-import { RowActionMenuButtonContainerStyled as ButtonContainer, RowActionDropdownContainerStyled as DropdownContainer, ActionItemContainerStyled as ActionItemContainer, ActionItemCaptionStyled as ItemCaption, } from '../../../styles';
-const RowActionMenuButton = ({ actions, icon, color, style = {}, rowData }) => {
-    const [isDropdownVisible, setIsDropdownVisible] = useState(false);
-    const dropdownRef = useRef(null);
-    useEffect(() => {
-        const handleClickOutside = (event) => {
-            if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
-                setIsDropdownVisible(false);
-            }
-        };
-        document.addEventListener('mousedown', handleClickOutside);
-        return () => {
-            document.removeEventListener('mousedown', handleClickOutside);
-        };
-    }, [dropdownRef]);
-    const toggleDropdown = async () => {
-        setIsDropdownVisible(!isDropdownVisible);
-    };
-    const renderDropdown = () => {
-        return (_jsx(DropdownContainer, { ref: dropdownRef, style: { display: isDropdownVisible ? 'block' : 'none' }, children: actions.map((action, index) => (_jsxs(ActionItemContainer, { onClick: () => action.onClick(rowData), children: [_jsx(ItemCaption, { style: { marginLeft: '10px' }, children: action.caption }), action.icon && _jsx(SSIIconButton, { onClick: () => action.onClick(rowData), icon: action.icon })] }, index))) }));
-    };
-    return (_jsxs(ButtonContainer, { style: { ...style }, children: [_jsx(SSIIconButton, { icon: icon || ButtonIcon.BITTERBALLEN, color: color, onClick: toggleDropdown }), renderDropdown()] }));
-};
-export default RowActionMenuButton;

package/dist/components/lists/SSIDropDownList/index.d.ts

@@ -1,7 +0,0 @@
-import { FC } from 'react';
-type Props = {
-    initialValue: string;
-    label?: string;
-};
-declare const SSIDropDownList: FC<Props>;
-export default SSIDropDownList;

package/dist/components/lists/SSIDropDownList/index.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { ButtonIcon } from '@sphereon/ui-components.core';
-import SSIIconButton from '../../buttons/SSIIconButton';
-import { SSIDropDownListContainerStyled as Container, SSITextH3Styled as LabelCaption, SSIDropDownListSelectedValueStyled as SelectedValue, } from '../../../styles';
-const SSIDropDownList = (props) => {
-    const { initialValue, label } = props;
-    const [value, setValue] = React.useState(initialValue);
-    return (_jsxs(Container, { children: [label && _jsx(LabelCaption, { children: label }), _jsx(SelectedValue, { children: value }), _jsx(SSIIconButton, { icon: ButtonIcon.ARROW_DOWN, onClick: async () => console.log('drop down clicked') })] }));
-};
-export default SSIDropDownList;

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

@@ -1,4 +0,0 @@
-export declare const RowActionMenuButtonContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ActionItemContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ActionItemCaptionStyled: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const RowActionDropdownContainerStyled: import("styled-components").StyledComponent<"div", any, {}, never>;