pixelize-design-library 2.3.1-beta.1 → 2.3.1-beta.2

package/dist/Pages/table.js

@@ -1,174 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TableExample = void 0;
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var Table_1 = __importDefault(require("../Components/Table/Table"));
-var Button_1 = __importDefault(require("../Components/Button/Button"));
-// ---------------------------------------------------------------------------
-// Demo data
-// ---------------------------------------------------------------------------
-var STATUSES = ["Working on it", "Done", "Stuck", "Not started"];
-var PRIORITIES = ["High", "Medium", "Low"];
-var OWNERS = ["Alex Rowe", "Jamie Soto", "Priya Nair", "Chen Wei"];
-var STATUS_COLORS = {
-    Done: "#23b85c",
-    "Working on it": "#f59e0b",
-    Stuck: "#e2483d",
-    "Not started": "#7d6ea0",
-};
-var PRIORITY_COLORS = {
-    High: "#e2483d",
-    Medium: "#f59e0b",
-    Low: "#23b85c",
-};
-var initials = function (name) {
-    return name.split(" ").map(function (p) { return p[0]; }).slice(0, 2).join("").toUpperCase();
-};
-// ~600 rows so grouped virtualization is exercised. NOTE: expandable `content`
-// is intentionally omitted here — expandable rows have variable height and
-// disable virtualization (use a smaller dataset if you want expandable rows).
-var makeData = function () {
-    return Array.from({ length: 600 }, function (_, i) { return ({
-        id: i + 1,
-        name: "Deal ".concat(i + 1),
-        status: STATUSES[i % STATUSES.length],
-        priority: PRIORITIES[i % PRIORITIES.length],
-        owner: OWNERS[i % OWNERS.length],
-        amount: 500 + ((i * 137) % 9500),
-        date: new Date(2026, i % 12, ((i * 7) % 27) + 1).toISOString().slice(0, 10),
-        // Row actions (auto-renders the kebab action column)
-        onLink: function (row) { return console.log("view", row.id); },
-        onEdit: function (row) { return console.log("edit", row.id); },
-        onDelete: function (row) { return console.log("delete", row.id); },
-    }); });
-};
-var columns = [
-    { label: "Name", id: "name", isFreeze: true, isSort: true, isSearch: true },
-    { label: "Status", id: "status", type: "status", statusColors: STATUS_COLORS },
-    { label: "Priority", id: "priority", type: "status", statusColors: PRIORITY_COLORS },
-    {
-        label: "Owner",
-        id: "owner",
-        node: function (row) { return (react_1.default.createElement(react_2.Flex, { align: "center", gap: 2 },
-            react_1.default.createElement(react_2.Box, { boxSize: "1.5rem", borderRadius: "full", bg: "primary.opacity.16", color: "primary.600", display: "flex", alignItems: "center", justifyContent: "center", fontSize: "0.625rem", fontWeight: 700 }, initials(row.owner)),
-            react_1.default.createElement(react_2.Text, { fontSize: "0.8125rem" }, row.owner))); },
-    },
-    { label: "Amount", id: "amount", isSort: true, node: function (row) { return "$".concat(row.amount.toLocaleString()); } },
-    { label: "Date", id: "date", isSort: true },
-];
-var users = [
-    { id: "1", label: "User 1" },
-    { id: "2", label: "User 2" },
-    { id: "3", label: "User 3" },
-];
-var defaultSections = [
-    {
-        id: "system",
-        label: "System Defined Filters",
-        initiallyExpanded: true,
-        items: [
-            { id: "touched", label: "Touched Records", type: "text" },
-            { id: "untouched", label: "Untouched Records", type: "select", option: users },
-            { id: "record_action", label: "Record Action", type: "user", option: users },
-            { id: "latest_email", label: "Latest Email Status", type: "date" },
-        ],
-    },
-    {
-        id: "fields",
-        label: "Filter By Fields",
-        radio: true,
-        items: [
-            { id: "status", label: "Status", type: "select", option: STATUSES.map(function (s) { return ({ id: s, label: s }); }) },
-            { id: "owner", label: "Owner" },
-        ],
-    },
-];
-var TableExample = function () {
-    var data = (0, react_1.useState)(makeData)[0];
-    var _a = (0, react_1.useState)(true), grouped = _a[0], setGrouped = _a[1];
-    var _b = (0, react_1.useState)(false), infinite = _b[0], setInfinite = _b[1];
-    var _c = (0, react_1.useState)(50), loadedCount = _c[0], setLoadedCount = _c[1];
-    var _d = (0, react_1.useState)(false), isLoadingMore = _d[0], setIsLoadingMore = _d[1];
-    var _e = (0, react_1.useState)(false), isLoading = _e[0], setIsLoading = _e[1];
-    var _f = (0, react_1.useState)(false), isFilterSidebar = _f[0], setIsFilterSidebar = _f[1];
-    var _g = (0, react_1.useState)({}), selected = _g[0], setSelected = _g[1];
-    var reload = function () {
-        setIsLoading(true);
-        setTimeout(function () { return setIsLoading(false); }, 600);
-    };
-    // Infinite-scroll simulation: reveal more rows from `data` on demand.
-    var displayData = (0, react_1.useMemo)(function () { return (infinite ? data.slice(0, loadedCount) : data); }, [infinite, data, loadedCount]);
-    var hasMore = loadedCount < data.length;
-    // Infinite scroll reuses onPagination: append the next page on "next".
-    var handlePagination = function (_page, size, _record, direction) {
-        if (!infinite || direction !== "next" || isLoadingMore || !hasMore)
-            return;
-        setIsLoadingMore(true);
-        setTimeout(function () {
-            setLoadedCount(function (c) { return Math.min(c + (size || 20), data.length); });
-            setIsLoadingMore(false);
-        }, 700);
-    };
-    var groupColors = (0, react_1.useMemo)(function () { return STATUS_COLORS; }, []);
-    return (react_1.default.createElement(react_2.Box, null,
-        react_1.default.createElement(react_2.Flex, { align: "center", gap: 3, mb: 3, flexWrap: "wrap" },
-            react_1.default.createElement(Button_1.default, { size: "xs", variant: grouped && !infinite ? "gradient" : "outline", colorScheme: "gray", isDisabled: infinite, onClick: function () { return setGrouped(function (g) { return !g; }); }, label: grouped ? "Grouped by status" : "Group by status" }),
-            react_1.default.createElement(Button_1.default, { size: "xs", variant: infinite ? "gradient" : "outline", colorScheme: "gray", onClick: function () { setInfinite(function (v) { return !v; }); setLoadedCount(50); }, label: infinite ? "Infinite scroll: on" : "Infinite scroll" }),
-            react_1.default.createElement(Button_1.default, { size: "xs", variant: "outline", colorScheme: "gray", onClick: reload, label: "Reload" })),
-        react_1.default.createElement(Table_1.default, { columns: columns, data: displayData, isCheckbox: true, density: "compact", groupBy: !infinite && grouped ? "status" : undefined, groupColors: groupColors, onAddItem: function (group) { return console.log("add item to", group); }, isLoading: isLoading, loadingSkeletonRows: 6, isPagination: true, paginationMode: infinite ? "server" : "client", totalRecords: data.length, infiniteScroll: infinite, onPagination: handlePagination, hasMore: hasMore, isLoadingMore: isLoadingMore, noOfRowsPerPage: 20, onSelection: function (sel) { return console.log("selection", sel); }, onRowClick: function (row, header) { return console.log("row click", row, header); }, onGlobalSearch: function (v) { return console.log("search", v); }, isTableSettings: true, 
-            // emptyState={{ title: "No deals yet", description: "Create your first deal to get started." }}
-            headerActions: {
-                isDelete: { enabled: true, onClick: function (s) { return console.log("delete", s); } },
-                isUpdate: { enabled: true, onClick: function (s) { return console.log("update", s); } },
-            }, filterSidebar: {
-                isFilterSidebar: isFilterSidebar,
-                filterSidebarToggle: function () { return setIsFilterSidebar(function (v) { return !v; }); },
-                sidebarOptions: defaultSections,
-                onApply: function (filters) { console.log("apply", filters); setSelected(filters); },
-                onClearAllHandler: function () { return setSelected({}); },
-                selected: selected,
-            }, tableSettings: {
-                filters: ["status", "priority", "owner"],
-                filterSelected: ["status"],
-                onFilterSelection: function (f) { return console.log("settings filters", f); },
-            } })));
-};
-exports.TableExample = TableExample;
-exports.default = exports.TableExample;

package/dist/Pages/textArea.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-declare const TextAreaPage: () => React.JSX.Element;
-export default TextAreaPage;

package/dist/Pages/textArea.js

@@ -1,15 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var InputTextArea_1 = __importDefault(require("../Components/InputTextArea/InputTextArea"));
-var TextAreaPage = function () {
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(InputTextArea_1.default, { label: "hello", helperText: "Hello", 
-            // errorMessage="Required"
-            // error={true}
-            rows: 5 })));
-};
-exports.default = TextAreaPage;

package/dist/Pages/timeline.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-declare const TimelinePage: () => React.JSX.Element;
-export default TimelinePage;

package/dist/Pages/timeline.js

@@ -1,74 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var Timeline_1 = __importDefault(require("../Components/Timeline/Timeline"));
-var TimelinePage = function () {
-    var timeline = [
-        {
-            logs_id: 1,
-            title: "Created",
-            primary_id: 66,
-            is_from: "Accounts",
-            action_from: "Accounts",
-            action_by: "pixelize technology",
-            created_at: 1723104998797,
-            changes: null,
-        },
-        {
-            logs_id: 2,
-            title: "Updated",
-            primary_id: 66,
-            is_from: "Accounts",
-            action_from: "Accounts",
-            action_by: "pixelize technology",
-            created_at: 1723105040247,
-            changes: null,
-        },
-        {
-            logs_id: 10,
-            title: "Created",
-            primary_id: 66,
-            is_from: "Accounts",
-            action_from: "Notes",
-            action_by: "pixelize technology",
-            created_at: 1723202829694,
-            changes: null,
-        },
-        {
-            logs_id: 3,
-            title: "Created",
-            primary_id: 66,
-            is_from: "Accounts",
-            action_from: "Notes",
-            action_by: "pixelize technology",
-            created_at: 1723105099207,
-            changes: null,
-        },
-        {
-            logs_id: 7,
-            title: "Created",
-            primary_id: 66,
-            is_from: "Accounts",
-            action_from: "Notes",
-            action_by: "pixelize technology",
-            created_at: 1723105603033,
-            changes: null,
-        },
-        {
-            logs_id: 8,
-            title: "Delete",
-            primary_id: 66,
-            is_from: "Accounts",
-            action_from: "Notes",
-            action_by: "pixelize technology",
-            created_at: 1723202829694,
-            changes: '{"shipping_code":{"original":null,"updated":"aaa"},"shipping_country":{"original":null,"updated":"QQdd"},"description":{"original":null,"updated":"ssAA"},"profile":{"updated":"profile updated"}}',
-        },
-    ];
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(Timeline_1.default, { timelineEvents: timeline })));
-};
-exports.default = TimelinePage;

package/dist/Pages/tooltip.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-declare const TooltipPage: () => React.JSX.Element;
-export default TooltipPage;

package/dist/Pages/tooltip.js

@@ -1,12 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var ToolTip_1 = __importDefault(require("../Components/ToolTip/ToolTip"));
-var TooltipPage = function () {
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(ToolTip_1.default, { label: "Hello", placement: "top", hasArrow: true }, "hai")));
-};
-exports.default = TooltipPage;

package/dist/Pages/toster.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-declare const TosterPage: () => React.JSX.Element;
-export default TosterPage;

package/dist/Pages/toster.js

@@ -1,68 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var Button_1 = __importDefault(require("../Components/Button/Button"));
-var Toaster_1 = require("../Components/Toaster/Toaster");
-var TosterPage = function () {
-    var showToast = (0, Toaster_1.useToaster)().showToast;
-    var handleOnclick = function () {
-        showToast({
-            title: "Hello",
-            duration: 3000,
-            status: "success",
-        });
-        //setIsOpen(true);
-    };
-    var handleOnclick1 = function () {
-        showToast({
-            title: "Hello",
-            duration: 3000,
-            status: "error",
-        });
-        //setIsOpen(true);
-    };
-    var handleOnclick2 = function () {
-        showToast({
-            title: "Hello",
-            duration: 3000,
-            status: "warning",
-        });
-        //setIsOpen(true);
-    };
-    var handleOnclick3 = function () {
-        showToast({
-            title: "Hello",
-            duration: 3000,
-            status: "info",
-        });
-        //setIsOpen(true);
-    };
-    var handleOnclick4 = function () {
-        showToast({
-            title: "Hello",
-            duration: 3000,
-            status: "loading",
-        });
-        //setIsOpen(true);
-    };
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(Button_1.default, { label: "Success", onClick: handleOnclick, variant: "solid", size: "md", width: 100 }),
-        react_1.default.createElement("br", null),
-        react_1.default.createElement(Button_1.default, { label: "Success", onClick: handleOnclick1, variant: "solid", size: "md", width: 100 }),
-        react_1.default.createElement("br", null),
-        react_1.default.createElement(Button_1.default, { label: "Success", onClick: handleOnclick2, variant: "solid", size: "md", width: 100 }),
-        react_1.default.createElement("br", null),
-        react_1.default.createElement(Button_1.default, { label: "Success", onClick: handleOnclick3, variant: "solid", size: "md", width: 100 }),
-        react_1.default.createElement("br", null),
-        react_1.default.createElement(Button_1.default, { label: "Success", onClick: handleOnclick4, variant: "solid", size: "md", width: 100 }),
-        react_1.default.createElement("br", null),
-        react_1.default.createElement("br", null),
-        " ",
-        react_1.default.createElement("br", null),
-        " ",
-        react_1.default.createElement("br", null)));
-};
-exports.default = TosterPage;

package/dist/Pages/verifyEmail.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-declare const VerifyEmailPage: () => React.JSX.Element;
-export default VerifyEmailPage;

package/dist/Pages/verifyEmail.js

@@ -1,18 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var VerifyEmailOtp_1 = __importDefault(require("../Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp"));
-var VerifyEmailPage = function () {
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(VerifyEmailOtp_1.default, { resendMail: function () {
-                console.log("hello");
-            }, onChange: function (val) {
-                console.log("onchange", val);
-            }, onComplete: function (val) {
-                console.log("onComplete", val);
-            }, pins: 6, title: "Please Verify Account", description: "Enter the six digit code we sent to your email address to verify", styles: { width: "70%", padding: "2px" } })));
-};
-exports.default = VerifyEmailPage;