namirasoft-site-react 1.4.560 → 1.4.561

package/dist/components/NSTableChart.module.css

@@ -0,0 +1,120 @@
+.ns_chart_overlay {
+	position: fixed;
+	top: 0;
+	right: 0;
+	left: 0;
+	bottom: 0;
+	z-index: 950;
+	background-color: #ffffff;
+	display: flex;
+}
+
+.ns_chart_modal {
+	background-color: #ffffff;
+	width: 100%;
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	overflow: hidden;
+	color: #141b5c;
+}
+
+.ns_chart_header {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 12px 16px;
+	border-bottom: 1px solid #e6eef5;
+}
+
+.ns_chart_title {
+	font-size: 16px;
+	font-weight: 700;
+}
+
+.ns_chart_close {
+	cursor: pointer;
+}
+
+.ns_chart_body {
+	display: flex;
+	flex-direction: column;
+	flex: 1;
+	min-height: 0;
+	overflow-y: auto;
+}
+
+.ns_chart_canvas {
+	position: relative;
+	flex: none;
+	width: 100%;
+	padding: 16px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	overflow: hidden;
+}
+
+.ns_chart_message {
+	color: #6b73a8;
+	font-size: 16px;
+	text-align: center;
+}
+
+.ns_chart_panel {
+	width: 100%;
+	border-top: 1px solid #e6eef5;
+	padding: 16px;
+	align-items: center;
+	flex-wrap: nowrap;
+}
+
+.ns_chart_field {
+	display: flex;
+	flex-direction: column;
+	gap: 8px;
+}
+
+.ns_chart_label {
+	font-size: 13px;
+	font-weight: 700;
+	color: #141b5c;
+}
+
+.ns_chart_hint {
+	font-size: 12px;
+	color: #8a90bb;
+}
+
+@media only screen and (min-width: 992px) {
+	.ns_chart_header {
+		padding: 16px 20px;
+	}
+
+	.ns_chart_title {
+		font-size: 18px;
+	}
+
+	.ns_chart_body {
+		flex-direction: row;
+		overflow: hidden;
+	}
+
+	.ns_chart_canvas {
+		flex: 1;
+		min-width: 0;
+		min-height: 0;
+		padding: 48px;
+	}
+
+	.ns_chart_panel {
+		flex: 0 0 400px;
+		width: 400px;
+		border-top: none;
+		border-left: 1px solid #e6eef5;
+		padding: 20px;
+		align-items: center;
+		min-height: 0;
+		overflow-y: auto;
+	}
+}

package/dist/main.d.ts

@@ -30,6 +30,7 @@ export * from "./components/NSBoxMoney";
 export * from "./components/NSBoxSensitive";
 export * from "./components/NSBoxPhone";
 export * from "./components/NSBoxRadio";
+export * from "./components/NSBoxOptions";
 export * from "./components/NSBoxSchemaBase";
 export * from "./components/NSBoxSchemaVariable";
 export * from "./components/NSBoxSearch";
@@ -46,11 +47,13 @@ export * from "./components/NSButtonGreen";
 export * from "./components/NSButtonRed";
 export * from "./components/NSCard";
 export * from "./components/NSCardScreenshot";
-export * from "./components/NSChartColumn";
+export * from "./components/NSChartBar";
+export * from "./components/NSChartLine";
 export * from "./components/NSChartDoughnut";
 export * from "./components/NSChartPie";
 export * from "./components/NSChartRange";
-export * from "./components/NSChartTable";
+export * from "./components/NSTableChart";
+export * from "./ColorOperation";
 export * from "./components/NSCopyBox";
 export * from "./components/NSCopy";
 export * from "./components/NSColumn";

package/dist/main.js

@@ -32,6 +32,7 @@ export * from "./components/NSBoxMoney";
 export * from "./components/NSBoxSensitive";
 export * from "./components/NSBoxPhone";
 export * from "./components/NSBoxRadio";
+export * from "./components/NSBoxOptions";
 export * from "./components/NSBoxSchemaBase";
 export * from "./components/NSBoxSchemaVariable";
 export * from "./components/NSBoxSearch";
@@ -48,11 +49,13 @@ export * from "./components/NSButtonGreen";
 export * from "./components/NSButtonRed";
 export * from "./components/NSCard";
 export * from "./components/NSCardScreenshot";
-export * from "./components/NSChartColumn";
+export * from "./components/NSChartBar";
+export * from "./components/NSChartLine";
 export * from "./components/NSChartDoughnut";
 export * from "./components/NSChartPie";
 export * from "./components/NSChartRange";
-export * from "./components/NSChartTable";
+export * from "./components/NSTableChart";
+export * from "./ColorOperation";
 export * from "./components/NSCopyBox";
 export * from "./components/NSCopy";
 export * from "./components/NSColumn";

package/dist/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -8,7 +8,7 @@
     "framework": "npm",
     "application": "package",
     "private": false,
-    "version": "1.4.560",
+    "version": "1.4.561",
     "author": "Amir Abolhasani",
     "license": "MIT",
     "main": "./dist/main.js",

package/src/ColorOperation.ts

@@ -0,0 +1,154 @@
+export class ColorOperation
+{
+    private static readonly GOLDEN_ANGLE = 137.508;
+    private static readonly BASE_HUE = 210;
+    private static readonly SATURATION = 68;
+    private static readonly LIGHTNESS = 56;
+
+    private index: number;
+
+    constructor(startIndex: number = 0)
+    {
+        this.index = startIndex;
+    }
+
+    generate(): string
+    {
+        return ColorOperation.at(this.index++);
+    }
+
+    peek(): string
+    {
+        return ColorOperation.at(this.index);
+    }
+
+    reset(startIndex: number = 0): void
+    {
+        this.index = startIndex;
+    }
+
+    static at(index: number): string
+    {
+        let hue = ColorOperation.normalizeHue(ColorOperation.BASE_HUE + index * ColorOperation.GOLDEN_ANGLE);
+        return ColorOperation.hslToHex(hue, ColorOperation.SATURATION, ColorOperation.LIGHTNESS);
+    }
+
+    static generate(count: number): string[]
+    {
+        let colors: string[] = [];
+        for (let i = 0; i < count; i++)
+            colors.push(ColorOperation.at(i));
+        return colors;
+    }
+
+    static random(): string
+    {
+        return ColorOperation.hslToHex(Math.random() * 360, ColorOperation.SATURATION, ColorOperation.LIGHTNESS);
+    }
+
+    static randoms(count: number): string[]
+    {
+        let start = Math.random() * 360;
+        let colors: string[] = [];
+        for (let i = 0; i < count; i++)
+        {
+            let hue = ColorOperation.normalizeHue(start + i * ColorOperation.GOLDEN_ANGLE);
+            colors.push(ColorOperation.hslToHex(hue, ColorOperation.SATURATION, ColorOperation.LIGHTNESS));
+        }
+        return colors;
+    }
+
+    static next(color: string): string
+    {
+        let { h, s, l } = ColorOperation.toHsl(color);
+        return ColorOperation.hslToHex(ColorOperation.normalizeHue(h + ColorOperation.GOLDEN_ANGLE), s, l);
+    }
+
+    static prev(color: string): string
+    {
+        let { h, s, l } = ColorOperation.toHsl(color);
+        return ColorOperation.hslToHex(ColorOperation.normalizeHue(h - ColorOperation.GOLDEN_ANGLE), s, l);
+    }
+
+    static hslToHex(h: number, s: number, l: number): string
+    {
+        h = ColorOperation.normalizeHue(h);
+        s = Math.max(0, Math.min(100, s)) / 100;
+        l = Math.max(0, Math.min(100, l)) / 100;
+
+        let c = (1 - Math.abs(2 * l - 1)) * s;
+        let x = c * (1 - Math.abs(((h / 60) % 2) - 1));
+        let m = l - c / 2;
+
+        let r = 0, g = 0, b = 0;
+        if (h < 60) { r = c; g = x; b = 0; }
+        else if (h < 120) { r = x; g = c; b = 0; }
+        else if (h < 180) { r = 0; g = c; b = x; }
+        else if (h < 240) { r = 0; g = x; b = c; }
+        else if (h < 300) { r = x; g = 0; b = c; }
+        else { r = c; g = 0; b = x; }
+
+        return ColorOperation.rgbToHex((r + m) * 255, (g + m) * 255, (b + m) * 255);
+    }
+
+    static toHsl(color: string): { h: number, s: number, l: number }
+    {
+        let trimmed = color.trim().toLowerCase();
+        if (trimmed.startsWith("hsl"))
+        {
+            let parts = trimmed.replace(/hsla?\(|\)|%/g, "").split(/[\s,/]+/).filter(Boolean);
+            return {
+                h: ColorOperation.normalizeHue(parseFloat(parts[0]) || 0),
+                s: parseFloat(parts[1]) || 0,
+                l: parseFloat(parts[2]) || 0,
+            };
+        }
+        let { r, g, b } = ColorOperation.hexToRgb(trimmed);
+        return ColorOperation.rgbToHsl(r, g, b);
+    }
+
+    private static normalizeHue(hue: number): number
+    {
+        return ((hue % 360) + 360) % 360;
+    }
+
+    private static hexToRgb(hex: string): { r: number, g: number, b: number }
+    {
+        let value = hex.replace("#", "");
+        if (value.length === 3)
+            value = value.split("").map(ch => ch + ch).join("");
+        let num = parseInt(value, 16);
+        return {
+            r: (num >> 16) & 255,
+            g: (num >> 8) & 255,
+            b: num & 255,
+        };
+    }
+
+    private static rgbToHex(r: number, g: number, b: number): string
+    {
+        let toHex = (v: number) => Math.round(Math.max(0, Math.min(255, v))).toString(16).padStart(2, "0");
+        return `#${toHex(r)}${toHex(g)}${toHex(b)}`.toUpperCase();
+    }
+
+    private static rgbToHsl(r: number, g: number, b: number): { h: number, s: number, l: number }
+    {
+        r /= 255; g /= 255; b /= 255;
+        let max = Math.max(r, g, b), min = Math.min(r, g, b);
+        let l = (max + min) / 2;
+        let d = max - min;
+        let h = 0, s = 0;
+        if (d !== 0)
+        {
+            s = d / (1 - Math.abs(2 * l - 1));
+            switch (max)
+            {
+                case r: h = ((g - b) / d) % 6; break;
+                case g: h = (b - r) / d + 2; break;
+                default: h = (r - g) / d + 4; break;
+            }
+            h *= 60;
+        }
+        return { h: ColorOperation.normalizeHue(h), s: s * 100, l: l * 100 };
+    }
+}

package/src/components/NSBoxBaseCombo.tsx

@@ -24,6 +24,8 @@ export interface INSBoxBaseComboProps<Box> extends INSBoxBaseLayoutProps<Box, st
 {
 	multiple: boolean;
 	searchable?: boolean;
+	reloadable?: boolean;
+	clearable?: boolean;
 	input?: IBaseComponentProps;
 	onLoaded?: (box: any) => void;
 	onList?: () => string | void;
@@ -369,16 +371,18 @@ export class NSBoxBaseCombo<Data> extends React.Component<NSBoxBaseComboProps<Da
 						}
 					});
 			}
-			if (!this.state.loading)
-				items.push({
-					title: "Reload",
-					icon: "https://static.namirasoft.com/image/concept/refresh/blue.svg",
-					onClick: () =>
-					{
-						this.reload();
-					}
-				});
-			if (!this.props.required && (this.state.data || this.state.data_list.length > 0))
+			if (this.props.reloadable !== false)
+				if (!this.state.loading)
+					items.push({
+						title: "Reload",
+						icon: "https://static.namirasoft.com/image/concept/refresh/blue.svg",
+						onClick: () =>
+						{
+							this.reload();
+						}
+					});
+			if (this.props.clearable !== false)
+				if (!this.props.required && (this.state.data || this.state.data_list.length > 0))
 				items.push({
 					title: "Clear",
 					icon: "https://static.namirasoft.com/image/concept/delete/blue.svg",

package/src/components/NSBoxCombo.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { createRef } from "react";
+import { Component, createRef } from "react";
 import { NSBoxBaseCombo, INSBoxBaseComboProps, NSBoxBaseComboOption } from "./NSBoxBaseCombo";
 import { IBaseComponentProps } from "../props/IBaseComponentProps";
 import { IValidationProps } from "../props/IValidationProps";
@@ -12,7 +12,7 @@ export interface NSBoxComboProps extends IBaseComponentProps, IValidationProps,
 	input?: IBaseComponentProps;
 }
 
-export class NSBoxCombo extends React.Component<NSBoxComboProps> implements INSBox
+export class NSBoxCombo extends Component<NSBoxComboProps> implements INSBox
 {
 	public NSBoxBaseCombo = createRef<NSBoxBaseCombo<NSBoxBaseComboOption>>();
 	constructor(props: NSBoxComboProps)

package/src/components/NSBoxOptions.module.css

@@ -0,0 +1,54 @@
+.ns_box_options {
+    width: 100%;
+    min-height: 48px;
+    border: 1px solid #e1e1e1;
+    border-radius: 8px;
+    padding: 8px;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: 4px;
+    background-color: #fff;
+}
+
+.ns_box_options_title {
+    color: #141B5C;
+    font-size: 16px;
+    font-weight: 500;
+    white-space: nowrap;
+    margin-right: 4px;
+}
+
+.ns_box_options_item {
+    padding: 4px 12px;
+    border: 1px solid #d7dbec;
+    border-radius: 9999px;
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 14px;
+    white-space: nowrap;
+    user-select: none;
+    background-color: #fff;
+    color: #141B5C;
+    transition: background-color 0.15s, border-color 0.15s, color 0.15s;
+    cursor: pointer;
+}
+
+.ns_box_options_item:hover {
+    border-color: #0377FF;
+}
+
+.ns_box_options_item_checked {
+    background-color: #0377ff;
+    border-color: #0377FF;
+    color: #fff;
+}
+
+.ns_box_options_item_disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+}
+
+.ns_box_options_item_disabled:hover {
+    border-color: #d7dbec;
+}

package/src/components/NSBoxOptions.tsx

@@ -0,0 +1,183 @@
+import React, { createRef } from "react";
+import Styles from "./NSBoxOptions.module.css";
+import { IBaseComponentProps } from "../props/IBaseComponentProps";
+import { IValidationProps } from "../props/IValidationProps";
+import { IValidationStringProps } from "../props/IValidationStringProps";
+import { safeMenuMenuItem } from "./NSMenuButton";
+import { INSBoxBaseLayoutProps, NSBoxBaseLayout } from "./NSBoxBaseLayout";
+import { Validator } from "../Validator";
+import { INSBox } from "./INSBox";
+
+export interface NSBoxOptionsItem
+{
+    title: string;
+    value: string;
+    disabled?: boolean;
+}
+
+export interface NSBoxOptionsProps extends IBaseComponentProps, IValidationProps, IValidationStringProps, INSBoxBaseLayoutProps<NSBoxOptions, string | string[]>
+{
+    options: NSBoxOptionsItem[];
+    multiple: boolean;
+    input?: IBaseComponentProps;
+}
+
+export interface NSBoxOptionsState
+{
+    values: string[];
+}
+
+export class NSBoxOptions extends React.Component<NSBoxOptionsProps, NSBoxOptionsState> implements INSBox
+{
+    NSBoxBaseLayout_Main = createRef<NSBoxBaseLayout>();
+
+    constructor(props: NSBoxOptionsProps)
+    {
+        super(props);
+        this.state = { values: NSBoxOptions.normalize(props.defaultValue) };
+
+        this.isEmpty = this.isEmpty.bind(this);
+        this.getError = this.getError.bind(this);
+        this.getValue = this.getValue.bind(this);
+        this.setValue = this.setValue.bind(this);
+        this.toggle = this.toggle.bind(this);
+    }
+
+    private static normalize(value: string | string[] | null | undefined): string[]
+    {
+        if (value == null)
+            return [];
+        if (Array.isArray(value))
+            return [...value];
+        return [value];
+    }
+
+    isEmpty(): boolean
+    {
+        return this.state.values.length === 0;
+    }
+
+    getError(): string | null
+    {
+        let value = this.getValue(false);
+        let asString = Array.isArray(value) ? value.join(",") : value;
+        return Validator.getError(this.props.title, asString, this.props);
+    }
+
+    getValue(checkError: boolean = true): string[] | string | null
+    {
+        if (this.props.nullable)
+            if (this.NSBoxBaseLayout_Main.current?.isNull())
+                return null;
+
+        let values = NSBoxBaseLayout.checkGetValue(this, checkError, () => this.state.values) ?? [];
+        if (this.props.multiple)
+            return values;
+        return values[0] ?? null;
+    }
+
+    setValue(value: string[] | string | null, callback?: () => void): void
+    {
+        if (this.props.multiple)
+        {
+            if (value != null && !Array.isArray(value))
+                throw new Error("When props.multiple = true, value must be string[] or null. But it is " + typeof value);
+        }
+        else
+        {
+            if (value != null && typeof value !== "string")
+                throw new Error("When props.multiple = false, value must be string or null. But it is " + typeof value);
+        }
+
+        let values = NSBoxOptions.normalize(value);
+        if (this.props.nullable)
+            this.NSBoxBaseLayout_Main.current?.setNull(values.length === 0);
+
+        this.setState({ values }, () =>
+        {
+            this.props.onChanged?.(this);
+            callback?.();
+        });
+    }
+
+    setDisabled(disabled: boolean): void
+    {
+        this.NSBoxBaseLayout_Main.current?.setDisabled(disabled);
+    }
+
+    private toggle(optionValue: string): void
+    {
+        let values = this.state.values;
+        if (this.props.multiple)
+        {
+            let next = values.includes(optionValue) ? values.filter(value => value !== optionValue) : [...values, optionValue];
+            this.setValue(next);
+        }
+        else
+        {
+            if (values.includes(optionValue))
+            {
+                if (this.props.nullable)
+                    this.setValue(null);
+            }
+            else
+                this.setValue(optionValue);
+        }
+    }
+
+    private getTitleOf(values: string[]): string
+    {
+        return values
+            .map(value => this.props.options.find(option => option.value === value)?.title ?? value)
+            .join(", ");
+    }
+
+    override render()
+    {
+        let menu = safeMenuMenuItem(this.props, () => { });
+        let showInlineTitle = !!(this.props.hideHeader && this.props.title);
+
+        return (
+            <NSBoxBaseLayout
+                ref={this.NSBoxBaseLayout_Main}
+                {...this.props}
+                menu={menu}
+                getValue={() => this.getTitleOf(this.state.values)}
+            >
+                <div className={`${Styles.ns_box_options}`} style={{ ...this.props.input?.style }}>
+                    {
+                        showInlineTitle &&
+                        <span className={Styles.ns_box_options_title}>
+                            {this.props.required && <span style={{ color: "red" }}>*</span>}{this.props.title}
+                        </span>
+                    }
+                    {
+                        this.props.options.map((option) =>
+                        {
+                            let checked = this.state.values.includes(option.value);
+                            return (
+                                <button
+                                    type="button"
+                                    key={option.value}
+                                    disabled={option.disabled}
+                                    className={[
+                                        Styles.ns_box_options_item,
+                                        checked ? Styles.ns_box_options_item_checked : "",
+                                        option.disabled ? Styles.ns_box_options_item_disabled : "",
+                                    ].filter(Boolean).join(" ")}
+                                    onClick={() =>
+                                    {
+                                        this.props.onClicked?.(this);
+                                        this.toggle(option.value);
+                                    }}
+                                >
+                                    {option.title}
+                                </button>
+                            );
+                        })
+                    }
+                </div>
+            </NSBoxBaseLayout>
+        );
+    }
+}