@solidstarters/solid-core-ui 1.1.69 → 1.1.71

package/dist/redux/features/popupSlice.ts

@@ -0,0 +1,27 @@
+// store/themeSlice.js
+import { createSlice } from '@reduxjs/toolkit';
+
+const popupSlice = createSlice({
+    name: 'theme',
+    initialState: {
+        visibleModulePopup: false,
+        visibleFieldsPopup: false,
+    },
+    reducers: {
+        showModulePopup: (state) => {
+            state.visibleModulePopup = true;
+        },
+        hideModulePopup: (state) => {
+            state.visibleModulePopup = false;
+        },
+        showFieldsPopup: (state) => {
+            state.visibleFieldsPopup = true;
+        },
+        hideFieldsPopup: (state) => {
+            state.visibleFieldsPopup = false;
+        },
+    },
+});
+
+export const { showModulePopup, hideModulePopup, showFieldsPopup, hideFieldsPopup } = popupSlice.actions;
+export default popupSlice.reducer;

package/dist/redux/features/themeSlice.ts

@@ -0,0 +1,17 @@
+// store/themeSlice.js
+import { createSlice } from '@reduxjs/toolkit';
+
+const themeSlice = createSlice({
+    name: 'theme',
+    initialState: {
+        mode: 'light', // Default mode
+    },
+    reducers: {
+        toggleTheme(state) {
+            state.mode = state.mode === 'light' ? 'dark' : 'light';
+        },
+    },
+});
+
+export const { toggleTheme } = themeSlice.actions;
+export default themeSlice.reducer;

package/dist/redux/features/userSlice.ts

@@ -0,0 +1,28 @@
+import { PayloadAction, createSlice } from "@reduxjs/toolkit";
+
+export interface IUserState {
+  user: any;
+  isAuthenticated: boolean;
+}
+
+const initialState: IUserState = {
+  user: null,
+  isAuthenticated: false,
+};
+
+export const userSlice = createSlice({
+  initialState,
+  name: "userSlice",
+  reducers: {
+    setUser: (state, action: PayloadAction<any>) => {
+      state.user = action.payload;
+    },
+    setIsAuthenticated: (state, action: PayloadAction<boolean>) => {
+      state.isAuthenticated = action.payload;
+    },
+  },
+});
+
+export default userSlice.reducer;
+
+export const { setUser, setIsAuthenticated } = userSlice.actions;

package/dist/resources/globals.css

@@ -1673,6 +1673,44 @@ li.header-li-px {
   overflow-y: auto;
 }
 
+
+.chatter-collapse-btn {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  right: -18px;
+  z-index: 10;
+  box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
+  background-color: #fff;
+}
+
+.chatter-section {
+  width: 380px;
+  flex-shrink: 0;
+  transition: width 0.3s ease, padding 0.3s ease;
+  overflow: hidden;
+  min-height: 100%;
+  transition: width 0.3s ease, padding 0.3s ease;
+}
+
+.chatter-section.collapsed {
+  width: 45px !important;
+}
+
+.chatter-collapsed-content {
+  font-size: 0.875rem;
+  background-color: #eff1f4;
+  color: var(--secondary-dark-color);
+  white-space: nowrap;
+  padding: 0.75rem 0.5rem;
+  border-radius: 4px;
+  border: 1px solid var(--primary-light-color);
+  display: inline-block;
+  writing-mode: vertical-rl;
+  transform: rotate(180deg);
+  width: 30px;
+}
+
 .solid-form-header {
   padding: 15px 14px 15px 24px;
   display: flex;
@@ -2810,6 +2848,10 @@ li.header-li-px {
     left: 71% !important;
     top: 17% !important;
   }
+
+  .chatter-section {
+    width: 360px;
+  }
 }
 
 /* 1500px - 1599px */
@@ -2832,6 +2874,10 @@ li.header-li-px {
     left: 69% !important;
     top: 17.3% !important;
   }
+
+  .chatter-section {
+    width: 345px;
+  }
 }
 
 /* 1400px - 1499px */
@@ -2854,6 +2900,11 @@ li.header-li-px {
     left: 67% !important;
     top: 17.5% !important;
   }
+
+
+  .chatter-section {
+    width: 330px;
+  }
 }
 
 /* 1300px - 1399px */
@@ -2876,6 +2927,10 @@ li.header-li-px {
     left: 63.5% !important;
     top: 15% !important;
   }
+
+  .chatter-section {
+    width: 310px;
+  }
 }
 
 /* 1200px - 1299px */
@@ -2898,6 +2953,10 @@ li.header-li-px {
     left: 61% !important;
     top: 15% !important;
   }
+
+  .chatter-section {
+    width: 300px;
+  }
 }
 
 /* 1024px - 1199px */

package/dist/types/index.d.ts

@@ -0,0 +1,60 @@
+declare module "react-star-ratings";
+declare module "react-js-pagination";
+declare module "bcryptjs";
+declare module "nodemailer";
+declare module "mapbox-gl/dist/mapbox-gl.js";
+declare module "react-datepicker";
+declare module "moment";
+
+import React, { ReactNode } from 'react';
+import {
+    LayoutConfig,
+    LayoutState,
+    LayoutContextProps,
+    AppConfigProps
+} from './layout';
+
+import {
+    CommonEntity,
+    ModelMetadata,
+    ModuleMetadata,
+    FieldMetadata,
+    FieldsMetadata,
+    SolidView,
+    LayoutAttribute,
+    LayoutNode,
+    LayoutNodeType,
+    SolidUiEvents,
+    SolidUiEvent,
+    SolidFormWidgetProps
+} from './solid-core';
+
+type ChildContainerProps = {
+    children: ReactNode;
+};
+
+export interface MenuContextProps {
+    activeMenu: string;
+    setActiveMenu: Dispatch<SetStateAction<string>>;
+}
+
+export type {
+    LayoutConfig,
+    LayoutState,
+    LayoutContextProps,
+    ChildContainerProps,
+    AppConfigProps,
+    MenuContextProps,
+    CommonEntity,
+    ModelMetadata,
+    ModuleMetadata,
+    FieldMetadata,
+    FieldsMetadata,
+    SolidView,
+    LayoutAttribute,
+    LayoutNode,
+    LayoutNodeType,
+    SolidUiEvents,
+    SolidUiEvent,
+    SolidFormWidgetProps
+};

package/dist/types/layout.d.ts

@@ -0,0 +1,94 @@
+import React, { ReactElement, Dispatch, SetStateAction, HTMLAttributeAnchorTarget, ReactNode } from 'react';
+import { NextPage } from 'next';
+import { Demo } from './demo';
+import { Toast } from 'primereact/toast';
+
+/* Breadcrumb Types */
+export interface AppBreadcrumbProps {
+    className?: string;
+}
+
+export interface Breadcrumb {
+    labels?: string[];
+    to?: string;
+}
+
+export interface BreadcrumbItem {
+    label: string;
+    to?: string;
+    items?: BreadcrumbItem[];
+}
+
+/* Context Types */
+export type LayoutState = {
+    overlayMenuActive: boolean;
+    profileSidebarVisible: boolean;
+    configSidebarVisible: boolean;
+    staticMenuMobileActive: boolean;
+    menuHoverActive: boolean;
+};
+
+export type LayoutConfig = {
+    inputStyle: string;
+    colorScheme: string;
+    theme: string;
+    scale: number;
+    authLayout : string
+};
+
+export interface LayoutContextProps {
+    layoutConfig: LayoutConfig;
+    setLayoutConfig: Dispatch<SetStateAction<LayoutConfig>>;
+    layoutState: LayoutState;
+    setLayoutState: Dispatch<SetStateAction<LayoutState>>;
+    onMenuToggle: () => void;
+    showProfileSidebar: () => void;
+}
+
+export interface MenuContextProps {
+    activeMenu: string;
+    setActiveMenu: Dispatch<SetStateAction<string>>;
+}
+
+/* AppConfig Types */
+export interface AppConfigProps {
+    simple?: boolean;
+}
+
+/* AppTopbar Types */
+export type NodeRef = MutableRefObject<ReactNode>;
+export interface AppTopbarRef {
+    menubutton?: HTMLButtonElement | null;
+    topbarmenu?: HTMLDivElement | null;
+    topbarmenubutton?: HTMLButtonElement | null;
+}
+
+/* AppMenu Types */
+type CommandProps = {
+    originalEvent: React.MouseEvent<HTMLAnchorElement, MouseEvent>;
+    item: MenuModelItem;
+};
+export interface MenuProps {
+    model: MenuModel[];
+}
+
+
+export interface MenuModel {
+    title: string;
+    key?: string;
+    children?: MenuModel[];
+    path?: string;
+}
+
+export interface AppMenuItem extends MenuModel {
+    children?: AppMenuItem[];
+    key?: string
+}
+
+export interface AppMenuItemProps {
+    item?: AppMenuItem;
+    parentKey?: string;
+    index?: number;
+    root?: boolean;
+    className?: string;
+}

package/dist/types/next.d.ts

@@ -0,0 +1,46 @@
+import { IUser } from "@/backend/models/user";
+import { FetchBaseQueryError } from "@reduxjs/toolkit/query/react";
+import { NextRequest } from "next/server";
+import NextAuth, { DefaultSession, DefaultUser } from 'next-auth';
+import { JWT } from 'next-auth/jwt';
+
+declare module "next/server" {
+  interface NextRequest {
+    user: IUser;
+  }
+}
+
+
+declare module "@reduxjs/toolkit/query/react" {
+  interface FetchBaseQueryError {
+    data?: any;
+  }
+}
+
+
+
+declare module 'next-auth' {
+  interface Session {
+    error:string | null,
+    user: {
+      accessToken: string;
+      refreshToken: string;
+      accessTokenExpires:number;
+    } & DefaultSession['user'];
+  }
+
+  interface User {
+    accessToken: string;
+    refreshToken: string;
+    accessTokenExpires:number;
+  }
+}
+
+declare module 'next-auth/jwt' {
+  interface JWT {
+    accessToken: string;
+    refreshToken: string;
+    error:string;
+    accessTokenExpires:number;
+  }
+}

package/dist/types/solid-core.d.ts

@@ -0,0 +1,139 @@
+// Base type of all Solid entities
+export type CommonEntity = {
+    id: number;
+    createdAt: string;
+    updatedAt: string;
+    deletedAt: string | null;
+    deletedTracker: string;
+};
+
+// Model
+export type ModelMetadata = CommonEntity & {
+    singularName: string;
+    tableName: string;
+    pluralName: string;
+    displayName: string;
+    description: string;
+    dataSource: string;
+    dataSourceType: string;
+    enableSoftDelete: boolean;
+    enableAuditTracking: boolean;
+    internationalisation: boolean;
+    isSystem: boolean;
+    userKeyField: string | null;
+};
+
+// Module 
+export type ModuleMetadata = CommonEntity & {
+    displayName: string;
+    name: string;
+    description: string;
+    menuIconUrl: string | null;
+    menuSequenceNumber: number;
+    defaultDataSource: string;
+    isSystem: boolean;
+};
+
+// Define a general Field type with id and name as required properties
+export type FieldMetadata = CommonEntity & {
+    id: number;
+    name: string;
+    displayName: string;
+
+    // For now we have kept it flexible allowing any number of other key / value pairs...
+    [key: string]: any;
+};
+
+// Represents a collection of fields.
+export type FieldsMetadata = {
+    [key: string]: Field;
+};
+
+// Solid View
+export type SolidView = CommonEntity & {
+    name: string;
+    displayName: string;
+    type: string;
+    // TODO: maybe change this in the future to set this to a json object...
+    context: string;
+    layout: LayoutNode;
+    model: Model;
+    module: Module;
+};
+
+// Layout Types
+export type LayoutAttribute = {
+    name: string;
+    label?: string;
+    className?: string;
+    inlineCreate?: string;
+    renderMode?: string;
+    widget?: string;
+};
+
+// Generic representation of any node in our layout 
+export type LayoutNodeType = "form" | "sheet" | "notebook" | "page" | "row" | "column" | "field" | "div" | "p" | "span" | "h1" | "h2" | "h3";
+export type LayoutNode = {
+    type: LayoutNodeType;
+    attrs: LayoutAttribute;
+    children?: LayoutNode[];
+};
+
+// Event type
+export type SolidUiEvents = "onFieldChange" | "onFieldBlur" | "onCustomWidgetRender" | "onFormDataLoad" | "onFormLayoutLoad";
+export type SolidUiEvent = {
+    type: SolidUiEvents;
+    modifiedField?: string;
+    modifiedFieldValue?: any;
+    // This comes from Formik...
+    formData: Record<string, any>;
+    viewMetadata: SolidView;
+    fieldsMetadata: FieldsMetadata;
+};
+
+export type SolidLoadForm = {
+    type: SolidUiEvents;
+    formData: Record<string, any>;
+    viewMetadata: SolidView;
+    fieldsMetadata: FieldsMetadata;
+}
+
+export type SolidFormWidgetProps = {
+    field: any;
+    // This comes from Formik...
+    formData: Record<string, any>;
+    viewMetadata: SolidView;
+    fieldsMetadata: FieldsMetadata;
+};
+
+export type SolidFormFieldWidgetProps = {
+    formik: any;
+    fieldContext?: SolidFieldProps;
+}
+export type SolidListFieldWidgetProps = {
+    rowData: any;
+    solidListViewMetaData: any
+    fieldMetadata: FieldMetadata;
+    column: any;
+}
+
+
+
+export type SolidMediaListFieldWidgetProps = SolidListFieldWidgetProps & {
+    setLightboxUrls?: any,
+    setOpenLightbox?: any
+}
+
+
+
+
+export type SolidMediaFormFieldWidgetProps = SolidFormFieldWidgetProps & {
+    setLightboxUrls?: any,
+    setOpenLightbox?: any
+}
+
+
+
+export type SolidShortTextImageRenderModeWidgetProps = {
+    data: string;
+}

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@solidstarters/solid-core-ui",
-  "version": "1.1.69",
+  "version": "1.1.71",
   "scripts": {
-    "prebuild": "npm run copy-styles",
+    "prebuild": "npm run copy-resources && npm run copy-styles",
     "build": "tsc && tsc-alias",
     "clean": "rm -rf dist",
     "prepare": "npm run build",
-    "copy-styles": "copyfiles -u 1 \"src/resources/**/*\" dist",
+    "copy-resources": "copyfiles -u 1 \"src/resources/**/*\" dist",
+    "copy-styles": "copyfiles -u 1 \"src/**/*\" dist/",
     "publish:patch": "node publish.js patch",
     "publish:minor": "node publish.js minor",
     "publish:major": "node publish.js major"

package/src/components/Svg/RightArrowSvg.tsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+export const RightArrowSvg = () => {
+    return (
+        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
+            <path d="M11.6667 11L10.7167 10.0667L12.1167 8.66667H2V7.33333H12.1167L10.7333 5.93333L11.6833 5L14.6667 8L11.6667 11Z" fill="black" fill-opacity="0.45" />
+        </svg>
+    )
+}