@solidxai/core-ui 0.0.1

package/dist/components/core/list/SolidListViewShimmerLoading.tsx

@@ -0,0 +1,78 @@
+import { Skeleton } from 'primereact/skeleton'
+import React from 'react'
+
+export const SolidListViewShimmerLoading = () => {
+    const rows = Array.from({ length: 14 });
+    return (
+        <div className='h-screen surface-0'>
+            {/* <div className="page-header pl-2 ">
+                <div className='flex align-items-center gap-3'>
+                    <Skeleton width="50px" height='1.4rem' className='md:h-1.3rem border-round-lg '></Skeleton>
+                    <Skeleton width="300px" className='border-round-lg hidden md:flex'></Skeleton>
+                </div>
+                <div className='flex align-items-center gap-3'>
+                    <Skeleton width="2.7rem" height="1.6rem" className="md:w-4rem md:h-2rem" />
+                    <Skeleton width="2.7rem" height="1.6rem" className="md:w-4rem md:h-2rem" />
+                    <Skeleton width="2.7rem" height="1.6rem" className="md:w-4rem md:h-2rem flex md:hidden" />
+                </div>
+            </div> */}
+            <div className='solid-list-skeleton-wrapper'>
+                <table className="solid-list-skeleton-table" style={{ borderCollapse: 'collapse', width: '100%' }}>
+                    <thead>
+                        <tr className="solid-list-skeleton-header">
+                            <th className="solid-list-skeleton-col-1">
+                                <Skeleton width="16px" height='16px' className='border-round-xs' />
+                            </th>
+                            <th className="solid-list-skeleton-col-2">
+                                <Skeleton width="70px" className='border-round-lg' />
+                            </th>
+                            <th className="solid-list-skeleton-col-3">
+                                <Skeleton width="90px" className='border-round-lg' />
+                            </th>
+                            <th className="solid-list-skeleton-col-4">
+                                <Skeleton width="80px" className='border-round-lg' />
+                            </th>
+                            <th className="solid-list-skeleton-col-5">
+                                <Skeleton width="90px" className='border-round-lg' />
+                            </th>
+                            <th className="solid-list-skeleton-col-6">
+                                <Skeleton width="100px" className='border-round-lg' />
+                            </th>
+                            <th className="solid-list-skeleton-col-7">
+                                <Skeleton width="30px" className='border-round-lg' />
+                            </th>
+                            <th className="solid-list-skeleton-col-8">
+                                <Skeleton width="30px" className='border-round-lg' />
+                            </th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        {rows.map((_, i) => (
+                            <tr className="solid-list-skeleton-row" key={i}>
+                                <td><Skeleton width="16px" height='16px' className='border-round-xs'/></td>
+                                <td><Skeleton width="50%" /></td>
+                                <td><Skeleton width="50%" /></td>
+                                <td><Skeleton width="50%" /></td>
+                                <td><Skeleton width="50%" /></td>
+                                <td><Skeleton width="50%" /></td>
+                                <td><Skeleton shape="circle" height='15px' width='15px' /></td>
+                                <td><Skeleton width="5px" height='20px' /></td>
+                            </tr>
+                        ))}
+                    </tbody>
+                </table>
+                <div className='solid-list-skeleton-footer flex align-items-center justify-content-between'>
+                    <div className='flex align-items-center gap-3'>
+                        <Skeleton width="5rem" height="1rem"></Skeleton>
+                        <Skeleton width="30px" height='15px' className='border-round-sm'></Skeleton>
+                    </div>
+                    <div className='flex align-items-center gap-3'>
+                        <Skeleton width="70px"></Skeleton>
+                        <Skeleton width="10px" height='15px' className='border-round-sm'></Skeleton>
+                        <Skeleton width="15px" height='15px' className='border-round-sm'></Skeleton>
+                    </div>
+                </div>
+            </div>
+        </div>
+    )
+}

package/dist/components/core/list/SolidListViewWrapper.module.css

@@ -0,0 +1,49 @@
+.ListContentWrapper{
+  transition: width 0.3s ease;
+  min-width: 0;
+  border-right: 1px solid var(--primary-light-color);
+}
+
+.SolidXAIFloatingBtn {
+    position: absolute;
+    top: 50%;
+    right: -1px;
+    /* transform: translateY(-50%) rotate(-90deg); */
+    z-index: 1000;
+    font-size: 0.875rem;
+    background-color: #eff1f4;
+    color: var(--secondary-dark-color);
+    white-space: nowrap;
+    padding: 0.75rem 0.5rem;
+    border-radius: 4px 4px 4px 0;
+    border-top: 1px solid var(--primary-light-color);
+    border-right: 1px solid var(--primary-light-color);
+    border-bottom: 1px solid var(--primary-light-color);
+    border-left: none;
+    display: inline-block;
+    writing-mode: vertical-rl;
+    transform: rotate(180deg);
+    width: 30px;
+    transition: right 0.3s;
+    margin-top : -50px;
+    cursor: pointer;
+    box-shadow:
+    0 -4px 6px -4px rgba(0, 0, 0, 0.1),
+    4px 0 6px -4px rgba(0, 0, 0, 0.1),
+    0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  }
+
+  .SolidXAIListPanel {
+    position: fixed !important;
+    top: 0;
+    right: -380px; /* Hidden by default */
+    width: 380px;
+    height: 100vh;
+    transition: right 0.3s ease;
+    z-index: 999;
+    border-left: 1px solid var(--primary-light-color);
+  }
+  
+  .SolidXAIListPanelOpen {
+    right: 0;
+  }

package/dist/components/core/list/SolidListingHeader.d.ts

@@ -0,0 +1,3 @@
+declare const SolidListingHeader: () => import("react/jsx-runtime").JSX.Element;
+export default SolidListingHeader;
+//# sourceMappingURL=SolidListingHeader.d.ts.map

package/dist/components/core/list/SolidListingHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidListingHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/core/list/SolidListingHeader.tsx"],"names":[],"mappings":"AAKA,QAAA,MAAM,kBAAkB,+CAkCvB,CAAC;AACF,eAAe,kBAAkB,CAAC"}

package/dist/components/core/list/SolidListingHeader.js

@@ -0,0 +1,12 @@
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { usePathname } from "../../../hooks/usePathname";
+import { plural } from "pluralize";
+var SolidListingHeader = function () {
+    var path = usePathname();
+    var getHeading = path.split('/').slice(-2, -1)[0].replace(/-/g, ' ').replace(/\b\w/g, function (char) { return char.toUpperCase(); });
+    var pathSegments = path.split('/');
+    return (_jsx(_Fragment, { children: pathSegments[pathSegments.length - 1] === "list" &&
+            _jsxs("div", { className: "flex justify-content-between align-items-center px-5 relative lg:static", style: { height: "60px", minHeight: 60, backgroundColor: '#f6f6f9' }, children: [_jsx("div", { className: "flex align-items-center", children: _jsx("div", { className: "", children: _jsxs("div", { className: 'text-xl font-bold', children: ["All ", plural(getHeading)] }) }) }), _jsx("div", { className: "flex align-items-center", children: _jsx("div", {}) }), _jsx("div", { className: "flex align-items-center" })] }) }));
+};
+export default SolidListingHeader;
+//# sourceMappingURL=SolidListingHeader.js.map

package/dist/components/core/list/SolidListingHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidListingHeader.js","sourceRoot":"","sources":["../../../../src/components/core/list/SolidListingHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAInC,IAAM,kBAAkB,GAAG;IACzB,IAAM,IAAI,GAAG,WAAW,EAAE,CAAC;IAC3B,IAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,OAAO,EAAE,UAAA,IAAI,IAAI,OAAA,IAAI,CAAC,WAAW,EAAE,EAAlB,CAAkB,CAAC,CAAC;IACpH,IAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAGrC,OAAO,CACL,4BACG,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,MAAM;YAE/C,eACE,SAAS,EAAC,yEAAyE,EACnF,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE,eAAe,EAAE,SAAS,EAAE,aAEpE,cAAK,SAAS,EAAC,yBAAyB,YACtC,cAAK,SAAS,EAAC,EAAE,YACf,eAAK,SAAS,EAAC,mBAAmB,qBAC3B,MAAM,CAAC,UAAU,CAAC,IACnB,GACF,GACF,EAEN,cAAK,SAAS,EAAC,yBAAyB,YACtC,eAEM,GACF,EACN,cAAK,SAAS,EAAC,yBAAyB,GAClC,IACF,GAEP,CAEJ,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,kBAAkB,CAAC"}

package/dist/components/core/list/SolidListingHeader.tsx

@@ -0,0 +1,41 @@
+import { usePathname } from "../../../hooks/usePathname";
+import { plural } from "pluralize";
+import { } from "react";
+
+
+const SolidListingHeader = () => {
+  const path = usePathname();
+  const getHeading = path.split('/').slice(-2, -1)[0].replace(/-/g, ' ').replace(/\b\w/g, char => char.toUpperCase());
+  const pathSegments = path.split('/');
+
+
+  return (
+    <>
+      {pathSegments[pathSegments.length - 1] === "list" &&
+
+        <div
+          className="flex justify-content-between align-items-center px-5 relative lg:static"
+          style={{ height: "60px", minHeight: 60, backgroundColor: '#f6f6f9' }}
+        >
+          <div className="flex align-items-center">
+            <div className="">
+              <div className='text-xl font-bold'>
+                All {plural(getHeading)}
+              </div>
+            </div>
+          </div>
+          {/* <GlobalSearch /> */}
+          <div className="flex align-items-center">
+            <div>
+              {/* <FilterMenu></FilterMenu> */}
+            </div>
+          </div>
+          <div className="flex align-items-center">
+          </div>
+        </div>
+      }
+    </>
+
+  );
+};
+export default SolidListingHeader;

package/dist/components/core/list/SolidManyToOneFilterElement.d.ts

@@ -0,0 +1,2 @@
+export declare const SolidManyToOneFilterElement: ({ value, updateInputs, index, fieldMetadata }: any) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SolidManyToOneFilterElement.d.ts.map

package/dist/components/core/list/SolidManyToOneFilterElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidManyToOneFilterElement.d.ts","sourceRoot":"","sources":["../../../../src/components/core/list/SolidManyToOneFilterElement.tsx"],"names":[],"mappings":"AAQA,eAAO,MAAM,2BAA2B,kDAAmD,GAAG,4CAmD7F,CAAA"}

package/dist/components/core/list/SolidManyToOneFilterElement.js

@@ -0,0 +1,87 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createSolidEntityApi } from "../../../redux/api/solidEntityApi";
+import { AutoComplete } from "primereact/autocomplete";
+import { useState } from "react";
+import qs from "qs";
+export var SolidManyToOneFilterElement = function (_a) {
+    var value = _a.value, updateInputs = _a.updateInputs, index = _a.index, fieldMetadata = _a.fieldMetadata;
+    var entityApi = createSolidEntityApi(fieldMetadata.relationCoModelSingularName);
+    var useLazyGetSolidEntitiesQuery = entityApi.useLazyGetSolidEntitiesQuery;
+    var triggerGetSolidEntities = useLazyGetSolidEntitiesQuery()[0];
+    var _b = useState([]), autoCompleteItems = _b[0], setAutoCompleteItems = _b[1];
+    var autoCompleteSearch = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var queryData, autocompleteQs, autocompleteResponse, autocompleteData, autoCompleteItems_1;
+        var _a;
+        var _b, _c;
+        return __generator(this, function (_d) {
+            switch (_d.label) {
+                case 0:
+                    queryData = {
+                        offset: 0,
+                        limit: 10,
+                        filters: (_a = {},
+                            _a[(_c = (_b = fieldMetadata === null || fieldMetadata === void 0 ? void 0 : fieldMetadata.relationModel) === null || _b === void 0 ? void 0 : _b.userKeyField) === null || _c === void 0 ? void 0 : _c.name] = {
+                                $containsi: event.query
+                            },
+                            _a)
+                    };
+                    autocompleteQs = qs.stringify(queryData, {
+                        encodeValuesOnly: true,
+                    });
+                    return [4 /*yield*/, triggerGetSolidEntities(autocompleteQs)];
+                case 1:
+                    autocompleteResponse = _d.sent();
+                    autocompleteData = autocompleteResponse.data;
+                    if (autocompleteData) {
+                        autoCompleteItems_1 = autocompleteData.records.map(function (item) {
+                            var _a, _b;
+                            return {
+                                label: item[(_b = (_a = fieldMetadata === null || fieldMetadata === void 0 ? void 0 : fieldMetadata.relationModel) === null || _a === void 0 ? void 0 : _a.userKeyField) === null || _b === void 0 ? void 0 : _b.name],
+                                value: item['id']
+                            };
+                        });
+                        setAutoCompleteItems(autoCompleteItems_1);
+                    }
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    return (_jsx(AutoComplete, { field: "label", value: value, suggestions: autoCompleteItems, completeMethod: autoCompleteSearch, onChange: function (e) { return updateInputs(index, e.value); }, className: "solid-standard-autocomplete" }));
+};
+//# sourceMappingURL=SolidManyToOneFilterElement.js.map

package/dist/components/core/list/SolidManyToOneFilterElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidManyToOneFilterElement.js","sourceRoot":"","sources":["../../../../src/components/core/list/SolidManyToOneFilterElement.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AAEzE,OAAO,EAAE,YAAY,EAA6B,MAAM,yBAAyB,CAAC;AAClF,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,MAAM,IAAI,CAAC;AAGpB,MAAM,CAAC,IAAM,2BAA2B,GAAG,UAAC,EAAkD;QAAhD,KAAK,WAAA,EAAE,YAAY,kBAAA,EAAE,KAAK,WAAA,EAAE,aAAa,mBAAA;IAEnF,IAAM,SAAS,GAAG,oBAAoB,CAAC,aAAa,CAAC,2BAA2B,CAAC,CAAC;IAC1E,IAAA,4BAA4B,GAAK,SAAS,6BAAd,CAAe;IAC5C,IAAA,uBAAuB,GAAI,4BAA4B,EAAE,GAAlC,CAAmC;IAE3D,IAAA,KAA4C,QAAQ,CAAC,EAAE,CAAC,EAAvD,iBAAiB,QAAA,EAAE,oBAAoB,QAAgB,CAAC;IAC/D,IAAM,kBAAkB,GAAG,UAAO,KAAgC;;;;;;;oBAGxD,SAAS,GAAG;wBACd,MAAM,EAAE,CAAC;wBACT,KAAK,EAAE,EAAE;wBACT,OAAO;4BACH,GAAC,MAAA,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,aAAa,0CAAE,YAAY,0CAAE,IAAI,IAAG;gCAChD,UAAU,EAAE,KAAK,CAAC,KAAK;6BAC1B;+BACJ;qBACJ,CAAC;oBAEI,cAAc,GAAG,EAAE,CAAC,SAAS,CAAC,SAAS,EAAE;wBAC3C,gBAAgB,EAAE,IAAI;qBACzB,CAAC,CAAC;oBAG0B,qBAAM,uBAAuB,CAAC,cAAc,CAAC,EAAA;;oBAApE,oBAAoB,GAAG,SAA6C;oBAGpE,gBAAgB,GAAG,oBAAoB,CAAC,IAAI,CAAC;oBAEnD,IAAI,gBAAgB,EAAE;wBACZ,sBAAoB,gBAAgB,CAAC,OAAO,CAAC,GAAG,CAAC,UAAC,IAAS;;4BAC7D,OAAO;gCACH,KAAK,EAAE,IAAI,CAAC,MAAA,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,aAAa,0CAAE,YAAY,0CAAE,IAAI,CAAC;gCAC7D,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC;6BACpB,CAAA;wBACL,CAAC,CAAC,CAAC;wBACH,oBAAoB,CAAC,mBAAiB,CAAC,CAAC;qBAC3C;;;;SACJ,CAAA;IAED,OAAO,CACH,KAAC,YAAY,IACT,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,iBAAiB,EAC9B,cAAc,EAAE,kBAAkB,EAClC,QAAQ,EAAE,UAAC,CAAC,IAAK,OAAA,YAAY,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,EAA5B,CAA4B,EAC7C,SAAS,EAAC,6BAA6B,GACzC,CACL,CAAA;AACL,CAAC,CAAA"}

package/dist/components/core/list/SolidManyToOneFilterElement.tsx

@@ -0,0 +1,60 @@
+
+import { createSolidEntityApi } from "../../../redux/api/solidEntityApi";
+import { InputTypes } from "./SolidVarInputsFilterElement"
+import { AutoComplete, AutoCompleteCompleteEvent } from "primereact/autocomplete";
+import { useState } from "react";
+import qs from "qs";
+
+
+export const SolidManyToOneFilterElement = ({ value, updateInputs, index, fieldMetadata }: any) => {
+
+    const entityApi = createSolidEntityApi(fieldMetadata.relationCoModelSingularName);
+    const { useLazyGetSolidEntitiesQuery } = entityApi;
+    const [triggerGetSolidEntities] = useLazyGetSolidEntitiesQuery();
+
+    const [autoCompleteItems, setAutoCompleteItems] = useState([]);
+    const autoCompleteSearch = async (event: AutoCompleteCompleteEvent) => {
+
+        // Get the list view layout & metadata first. 
+        const queryData = {
+            offset: 0,
+            limit: 10,
+            filters: {
+                [fieldMetadata?.relationModel?.userKeyField?.name]: {
+                    $containsi: event.query
+                }
+            }
+        };
+
+        const autocompleteQs = qs.stringify(queryData, {
+            encodeValuesOnly: true,
+        });
+
+        // TODO: do error handling here, possible errors like modelname is incorrect etc...
+        const autocompleteResponse = await triggerGetSolidEntities(autocompleteQs);
+
+        // TODO: if no data found then can we show no matching "entities", where entities can be replaced with the model plural name,
+        const autocompleteData = autocompleteResponse.data;
+
+        if (autocompleteData) {
+            const autoCompleteItems = autocompleteData.records.map((item: any) => {
+                return {
+                    label: item[fieldMetadata?.relationModel?.userKeyField?.name],
+                    value: item['id']
+                }
+            });
+            setAutoCompleteItems(autoCompleteItems);
+        }
+    }
+
+    return (
+        <AutoComplete
+            field="label"
+            value={value}
+            suggestions={autoCompleteItems}
+            completeMethod={autoCompleteSearch}
+            onChange={(e) => updateInputs(index, e.value)}
+            className="solid-standard-autocomplete"
+        />
+    )
+}

package/dist/components/core/list/SolidSelectionDynamicFilterElement.d.ts

@@ -0,0 +1,2 @@
+export declare const SolidSelectionDynamicFilterElement: ({ value, updateInputs, index, fieldMetadata }: any) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SolidSelectionDynamicFilterElement.d.ts.map

package/dist/components/core/list/SolidSelectionDynamicFilterElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidSelectionDynamicFilterElement.d.ts","sourceRoot":"","sources":["../../../../src/components/core/list/SolidSelectionDynamicFilterElement.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,kCAAkC,kDAAmD,GAAG,4CA0CpG,CAAA"}

package/dist/components/core/list/SolidSelectionDynamicFilterElement.js

@@ -0,0 +1,73 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useLazyGetSelectionDynamicValuesQuery } from "../../../redux/api/fieldApi";
+import { AutoComplete } from "primereact/autocomplete";
+import qs from "qs";
+import { useState } from "react";
+export var SolidSelectionDynamicFilterElement = function (_a) {
+    var value = _a.value, updateInputs = _a.updateInputs, index = _a.index, fieldMetadata = _a.fieldMetadata;
+    // selection dynamic specific code. 
+    var triggerGetSelectionDynamicValues = useLazyGetSelectionDynamicValuesQuery()[0];
+    var _b = useState([]), selectionDynamicItems = _b[0], setSelectionDynamicItems = _b[1];
+    var selectionDynamicSearch = function (event) { return __awaiter(void 0, void 0, void 0, function () {
+        var queryData, sdQs, sdResponse, sdData;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    queryData = {
+                        offset: 0,
+                        limit: 10,
+                        query: event.query,
+                        id: fieldMetadata.id
+                    };
+                    sdQs = qs.stringify(queryData, {
+                        encodeValuesOnly: true,
+                    });
+                    return [4 /*yield*/, triggerGetSelectionDynamicValues(sdQs)];
+                case 1:
+                    sdResponse = _a.sent();
+                    sdData = sdResponse.data.data;
+                    // @ts-ignore
+                    setSelectionDynamicItems(sdData);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    return (_jsx(AutoComplete, { field: "label", value: value, dropdown: true, className: "w-full solid-standard-autocomplete", suggestions: selectionDynamicItems, completeMethod: selectionDynamicSearch, onChange: function (e) { return updateInputs(index, e.value); } }));
+};
+//# sourceMappingURL=SolidSelectionDynamicFilterElement.js.map

package/dist/components/core/list/SolidSelectionDynamicFilterElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidSelectionDynamicFilterElement.js","sourceRoot":"","sources":["../../../../src/components/core/list/SolidSelectionDynamicFilterElement.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,EAAE,qCAAqC,EAAE,MAAM,6BAA6B,CAAC;AACpF,OAAO,EAAE,YAAY,EAA6B,MAAM,yBAAyB,CAAC;AAClF,OAAO,EAAE,MAAM,IAAI,CAAC;AACpB,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGjC,MAAM,CAAC,IAAM,kCAAkC,GAAG,UAAC,EAAkD;QAAhD,KAAK,WAAA,EAAE,YAAY,kBAAA,EAAE,KAAK,WAAA,EAAE,aAAa,mBAAA;IAG1F,oCAAoC;IAC7B,IAAA,gCAAgC,GAAI,qCAAqC,EAAE,GAA3C,CAA4C;IAC7E,IAAA,KAAoD,QAAQ,CAAC,EAAE,CAAC,EAA/D,qBAAqB,QAAA,EAAE,wBAAwB,QAAgB,CAAC;IACvE,IAAM,sBAAsB,GAAG,UAAO,KAAgC;;;;;oBAG5D,SAAS,GAAG;wBACd,MAAM,EAAE,CAAC;wBACT,KAAK,EAAE,EAAE;wBACT,KAAK,EAAE,KAAK,CAAC,KAAK;wBAClB,EAAE,EAAE,aAAa,CAAC,EAAE;qBACvB,CAAC;oBAEI,IAAI,GAAG,EAAE,CAAC,SAAS,CAAC,SAAS,EAAE;wBACjC,gBAAgB,EAAE,IAAI;qBACzB,CAAC,CAAC;oBAGgB,qBAAM,gCAAgC,CAAC,IAAI,CAAC,EAAA;;oBAAzD,UAAU,GAAG,SAA4C;oBAGzD,MAAM,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;oBAEpC,aAAa;oBACb,wBAAwB,CAAC,MAAM,CAAC,CAAC;;;;SACpC,CAAA;IAGD,OAAO,CAEH,KAAC,YAAY,IACT,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,KAAK,EACZ,QAAQ,QACR,SAAS,EAAC,oCAAoC,EAC9C,WAAW,EAAE,qBAAqB,EAClC,cAAc,EAAE,sBAAsB,EACtC,QAAQ,EAAE,UAAC,CAAC,IAAK,OAAA,YAAY,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,EAA5B,CAA4B,GAAI,CACxD,CAAA;AACL,CAAC,CAAA"}

package/dist/components/core/list/SolidSelectionDynamicFilterElement.tsx

@@ -0,0 +1,50 @@
+
+import { useLazyGetSelectionDynamicValuesQuery } from "../../../redux/api/fieldApi";
+import { AutoComplete, AutoCompleteCompleteEvent } from "primereact/autocomplete";
+import qs from "qs";
+import { useState } from "react";
+
+
+export const SolidSelectionDynamicFilterElement = ({ value, updateInputs, index, fieldMetadata }: any) => {
+
+
+    // selection dynamic specific code. 
+    const [triggerGetSelectionDynamicValues] = useLazyGetSelectionDynamicValuesQuery();
+    const [selectionDynamicItems, setSelectionDynamicItems] = useState([]);
+    const selectionDynamicSearch = async (event: AutoCompleteCompleteEvent) => {
+
+        // Get the list view layout & metadata first. 
+        const queryData = {
+            offset: 0,
+            limit: 10,
+            query: event.query,
+            id: fieldMetadata.id
+        };
+
+        const sdQs = qs.stringify(queryData, {
+            encodeValuesOnly: true,
+        });
+
+        // TODO: do error handling here, possible errors like modelname is incorrect etc...
+        const sdResponse = await triggerGetSelectionDynamicValues(sdQs);
+
+        // TODO: if no data found then can we show no matching "entities", where entities can be replaced with the model plural name,
+        const sdData = sdResponse.data.data;
+
+        // @ts-ignore
+        setSelectionDynamicItems(sdData);
+    }
+
+
+    return (
+
+        <AutoComplete
+            field="label"
+            value={value}
+            dropdown
+            className="w-full solid-standard-autocomplete"
+            suggestions={selectionDynamicItems}
+            completeMethod={selectionDynamicSearch}
+            onChange={(e) => updateInputs(index, e.value)} />
+    )
+}

package/dist/components/core/list/SolidSelectionStaticFilterElement.d.ts

@@ -0,0 +1,2 @@
+export declare const SolidSelectionStaticFilterElement: ({ value, updateInputs, index, fieldMetadata }: any) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SolidSelectionStaticFilterElement.d.ts.map

package/dist/components/core/list/SolidSelectionStaticFilterElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidSelectionStaticFilterElement.d.ts","sourceRoot":"","sources":["../../../../src/components/core/list/SolidSelectionStaticFilterElement.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,iCAAiC,kDAAmD,GAAG,4CA0BnG,CAAA"}

package/dist/components/core/list/SolidSelectionStaticFilterElement.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AutoComplete } from "primereact/autocomplete";
+import { useState } from "react";
+export var SolidSelectionStaticFilterElement = function (_a) {
+    var value = _a.value, updateInputs = _a.updateInputs, index = _a.index, fieldMetadata = _a.fieldMetadata;
+    // selection dynamic specific code. 
+    var _b = useState([]), selectionStaticItems = _b[0], setSelectionStaticItems = _b[1];
+    var selectionStaticSearch = function (event) {
+        var selectionStaticData = fieldMetadata.selectionStaticValues.map(function (i) {
+            return {
+                label: i.split(":")[1],
+                value: i.split(":")[0]
+            };
+        });
+        var suggestionData = selectionStaticData.filter(function (t) { return t.value.toLowerCase().startsWith(event.query.toLowerCase()); });
+        setSelectionStaticItems(suggestionData);
+    };
+    return (_jsx(AutoComplete, { field: "label", value: value, dropdown: true, className: "w-full solid-standard-autocomplete", suggestions: selectionStaticItems, completeMethod: selectionStaticSearch, onChange: function (e) { return updateInputs(index, e.value); } }));
+};
+//# sourceMappingURL=SolidSelectionStaticFilterElement.js.map

package/dist/components/core/list/SolidSelectionStaticFilterElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidSelectionStaticFilterElement.js","sourceRoot":"","sources":["../../../../src/components/core/list/SolidSelectionStaticFilterElement.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAA6B,MAAM,yBAAyB,CAAC;AAClF,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGjC,MAAM,CAAC,IAAM,iCAAiC,GAAG,UAAC,EAAkD;QAAhD,KAAK,WAAA,EAAE,YAAY,kBAAA,EAAE,KAAK,WAAA,EAAE,aAAa,mBAAA;IAEzF,oCAAoC;IAC9B,IAAA,KAAkD,QAAQ,CAAC,EAAE,CAAC,EAA7D,oBAAoB,QAAA,EAAE,uBAAuB,QAAgB,CAAC;IACrE,IAAM,qBAAqB,GAAG,UAAC,KAAgC;QAC3D,IAAM,mBAAmB,GAAG,aAAa,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAC,CAAS;YAC1E,OAAO;gBACH,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;gBACtB,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;aACzB,CAAA;QACL,CAAC,CAAC,CAAC;QACH,IAAM,cAAc,GAAG,mBAAmB,CAAC,MAAM,CAAC,UAAC,CAAM,IAAK,OAAA,CAAC,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,EAA3D,CAA2D,CAAC,CAAC;QAC3H,uBAAuB,CAAC,cAAc,CAAC,CAAA;IAC3C,CAAC,CAAA;IAED,OAAO,CAEH,KAAC,YAAY,IACT,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,KAAK,EACZ,QAAQ,QACR,SAAS,EAAC,oCAAoC,EAC9C,WAAW,EAAE,oBAAoB,EACjC,cAAc,EAAE,qBAAqB,EACrC,QAAQ,EAAE,UAAC,CAAC,IAAK,OAAA,YAAY,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,EAA5B,CAA4B,GAAI,CACxD,CAAA;AACL,CAAC,CAAA"}

package/dist/components/core/list/SolidSelectionStaticFilterElement.tsx

@@ -0,0 +1,32 @@
+
+import { AutoComplete, AutoCompleteCompleteEvent } from "primereact/autocomplete";
+import { useState } from "react";
+
+
+export const SolidSelectionStaticFilterElement = ({ value, updateInputs, index, fieldMetadata }: any) => {
+
+    // selection dynamic specific code. 
+    const [selectionStaticItems, setSelectionStaticItems] = useState([]);
+    const selectionStaticSearch = (event: AutoCompleteCompleteEvent) => {
+        const selectionStaticData = fieldMetadata.selectionStaticValues.map((i: string) => {
+            return {
+                label: i.split(":")[1],
+                value: i.split(":")[0]
+            }
+        });
+        const suggestionData = selectionStaticData.filter((t: any) => t.value.toLowerCase().startsWith(event.query.toLowerCase()));
+        setSelectionStaticItems(suggestionData)
+    }
+
+    return (
+
+        <AutoComplete
+            field="label"
+            value={value}
+            dropdown
+            className="w-full solid-standard-autocomplete"
+            suggestions={selectionStaticItems}
+            completeMethod={selectionStaticSearch}
+            onChange={(e) => updateInputs(index, e.value)} />
+    )
+}

package/dist/components/core/list/SolidTableRowCell.d.ts

@@ -0,0 +1,6 @@
+declare const SolidTableRowCell: ({ value, truncateAfter }: {
+    value: string;
+    truncateAfter?: number | undefined;
+}) => import("react/jsx-runtime").JSX.Element;
+export default SolidTableRowCell;
+//# sourceMappingURL=SolidTableRowCell.d.ts.map

package/dist/components/core/list/SolidTableRowCell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidTableRowCell.d.ts","sourceRoot":"","sources":["../../../../src/components/core/list/SolidTableRowCell.tsx"],"names":[],"mappings":"AAEA,QAAA,MAAM,iBAAiB;WAAuC,MAAM;;6CA8BnE,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/core/list/SolidTableRowCell.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tooltip } from "primereact/tooltip";
+var SolidTableRowCell = function (_a) {
+    var value = _a.value, truncateAfter = _a.truncateAfter;
+    var safeValue = value !== null && value !== undefined ? String(value) : "";
+    // Utility function to detect if value contains HTML
+    var isHTML = function (str) { return /<\/?[a-z][\s\S]*>/i.test(str); };
+    // Utility function to strip HTML tags
+    var stripHTML = function (str) { return str.replace(/<[^>]+>/g, ''); };
+    var displayValue = isHTML(safeValue) ? stripHTML(safeValue) : safeValue;
+    return (_jsxs("div", { className: "flex align-items-center", children: [_jsx("div", { className: "solid-table-row", style: truncateAfter ? { maxWidth: "".concat(truncateAfter, "ch") } : {}, children: displayValue }), truncateAfter && displayValue.length > truncateAfter &&
+                _jsxs(_Fragment, { children: [_jsx(Tooltip, { target: ".solid-field-tooltip-icon" }), _jsx("i", { className: "pi pi-info-circle solid-field-tooltip-icon", "data-pr-tooltip": displayValue })] })] }));
+};
+export default SolidTableRowCell;
+//# sourceMappingURL=SolidTableRowCell.js.map

package/dist/components/core/list/SolidTableRowCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidTableRowCell.js","sourceRoot":"","sources":["../../../../src/components/core/list/SolidTableRowCell.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAE7C,IAAM,iBAAiB,GAAG,UAAC,EAAmE;QAAjE,KAAK,WAAA,EAAE,aAAa,mBAAA;IAC7C,IAAM,SAAS,GAAG,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC7E,oDAAoD;IACpD,IAAM,MAAM,GAAG,UAAC,GAAW,IAAK,OAAA,oBAAoB,CAAC,IAAI,CAAC,GAAG,CAAC,EAA9B,CAA8B,CAAC;IAE/D,sCAAsC;IACtC,IAAM,SAAS,GAAG,UAAC,GAAW,IAAK,OAAA,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,EAA3B,CAA2B,CAAC;IAE/D,IAAM,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAE1E,OAAO,CACH,eAAK,SAAS,EAAC,yBAAyB,aACpC,cACI,SAAS,EAAC,iBAAiB,EAC3B,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,UAAG,aAAa,OAAI,EAAE,CAAC,CAAC,CAAC,EAAE,YAG7D,YAAY,GACX,EACL,aAAa,IAAI,YAAY,CAAC,MAAM,GAAG,aAAa;gBACjD,8BACI,KAAC,OAAO,IAAC,MAAM,EAAC,2BAA2B,GAAG,EAC9C,YAAG,SAAS,EAAC,4CAA4C,qBACpC,YAAY,GAC/B,IACH,IAEL,CACT,CAAC;AAEN,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/core/list/SolidTableRowCell.tsx

@@ -0,0 +1,35 @@
+import { Tooltip } from "primereact/tooltip";
+
+const SolidTableRowCell = ({ value, truncateAfter }: { value: string; truncateAfter?: number }) => {
+    const safeValue = value !== null && value !== undefined ? String(value) : "";
+    // Utility function to detect if value contains HTML
+    const isHTML = (str: string) => /<\/?[a-z][\s\S]*>/i.test(str);
+
+    // Utility function to strip HTML tags
+    const stripHTML = (str: string) => str.replace(/<[^>]+>/g, '');
+
+    const displayValue = isHTML(safeValue) ? stripHTML(safeValue) : safeValue;
+
+    return (
+        <div className="flex align-items-center">
+            <div
+                className="solid-table-row"
+                style={truncateAfter ? { maxWidth: `${truncateAfter}ch` } : {}}
+            // title={truncateAfter ? displayValue : undefined}
+            >
+                {displayValue}
+            </div>
+            {truncateAfter && displayValue.length > truncateAfter &&
+                <>
+                    <Tooltip target=".solid-field-tooltip-icon" />
+                    <i className="pi pi-info-circle solid-field-tooltip-icon"
+                        data-pr-tooltip={displayValue}
+                    />
+                </>
+            }
+        </div>
+    );
+
+};
+
+export default SolidTableRowCell;