namirasoft-site-react 1.5.22 → 1.5.23

package/src/components/NSDialogPageSelection.tsx

@@ -1,234 +1,234 @@
-import { CronOperation } from 'namirasoft-core';
-import React, { Component, createRef } from 'react';
-import { NSBoxBoolean } from './NSBoxBoolean';
-import { NSBoxRadio } from './NSBoxRadio';
-import { NSBoxString } from './NSBoxString';
-import { NSButtonBlue } from './NSButtonBlue';
-import Styles from './NSDialogPageSelection.module.css';
-import { NSLabelErrorNotifier } from './NSLabelErrorNotifier';
-import { NSSpace, NSSpaceSizeType } from './NSSpace';
-
-export interface NSDialogPageSelectionProps<RowType>
-{
-    current_page: number;
-    current_size: number;
-    max_page: number;
-    onClose: () => void;
-    getItems: (page: number, size: number, selected: boolean) => Promise<RowType[]>;
-    onFinish: (items: RowType[], expandAll: boolean) => Promise<void>;
-    icon?: string;
-    showExpandAll?: boolean;
-}
-
-interface NSDialogPageSelectionState
-{
-    selectedRadio: string;
-    showNoItemError: boolean;
-}
-
-export class NSDialogPageSelection<RowType> extends Component<NSDialogPageSelectionProps<RowType>, NSDialogPageSelectionState>
-{
-    private toastRef: React.RefObject<HTMLDivElement> = createRef();
-    private NSBoxBoolean_CurrentPage: React.RefObject<NSBoxRadio> = createRef();
-    private NSBoxBoolean_SelectedItems: React.RefObject<NSBoxRadio> = createRef();
-    private NSBoxBoolean_CustomPage: React.RefObject<NSBoxRadio> = createRef();
-    private NSBoxBoolean_AllPage: React.RefObject<NSBoxRadio> = createRef();
-    private NSBoxString_Pages: React.RefObject<NSBoxString> = createRef();
-    private NSBoxBoolean_ExpandAll: React.RefObject<NSBoxBoolean> = createRef();
-
-    constructor(props: NSDialogPageSelectionProps<RowType>)
-    {
-        super(props);
-        this.state = {
-            selectedRadio: 'current_page',
-            showNoItemError: false
-        };
-        this.onClickOutside = this.onClickOutside.bind(this);
-        this.handleRadioChange = this.handleRadioChange.bind(this);
-    }
-    override componentDidMount(): void
-    {
-        document.addEventListener('mousedown', this.onClickOutside);
-    }
-    override componentWillUnmount(): void
-    {
-        document.removeEventListener('mousedown', this.onClickOutside);
-    }
-    private onClickOutside(event: MouseEvent)
-    {
-        if (this.toastRef.current && !this.toastRef.current.contains(event.target as Node))
-        {
-            this.props.onClose();
-        }
-    }
-    private handleRadioChange(selectedRadio: string)
-    {
-        this.setState((prev) => ({ ...prev, selectedRadio }));
-    }
-    override render()
-    {
-        return (
-            <>
-                <div className={Styles.ns_print_container} ref={this.toastRef}>
-                    <div className={Styles.ns_header_print}>
-                        <img
-                            src="https://static.namirasoft.com/image/concept/close/blue.svg"
-                            alt="Close"
-                            width={24}
-                            height={24}
-                            onClick={(e) =>
-                            {
-                                e.stopPropagation();
-                                this.props.onClose();
-                            }}
-                            className={Styles.ns_close_icon}
-                        />
-                        <div className={Styles.ns_print_title}>
-                            <img
-                                src={this.props.icon && this.props.icon}
-                                alt="Print"
-                                width={24}
-                                height={24}
-                            />
-                            <h2 className='m-0'>Page Selection</h2>
-                        </div>
-                        <NSSpace size={NSSpaceSizeType.SMALL} />
-                        <p className={Styles.ns_print_description}>Please select which pages you want to continue with</p>
-                        <NSSpace size={NSSpaceSizeType.SMALL} />
-                        <div className={Styles.ns_parent_checkboxs}>
-                            {/* todo: input id for check when click on labels */}
-                            <NSBoxRadio
-                                ref={this.NSBoxBoolean_CurrentPage}
-                                required={false}
-                                defaultValue={true}
-                                title={"Current page"}
-                                hideHeader
-                                checked={this.state.selectedRadio === 'current_page'}
-                                onClicked={() => this.handleRadioChange('current_page')}
-                            />
-                            <NSBoxRadio
-                                ref={this.NSBoxBoolean_SelectedItems}
-                                required={false}
-                                title={"Only Selected Items"}
-                                hideHeader
-                                checked={this.state.selectedRadio === 'selected_items'}
-                                onClicked={() => this.handleRadioChange('selected_items')}
-                            />
-                            <NSBoxRadio
-                                ref={this.NSBoxBoolean_CustomPage}
-                                title={"Custom Pages"}
-                                required={false}
-                                hideHeader
-                                checked={this.state.selectedRadio === 'custom_page'}
-                                onClicked={() => this.handleRadioChange('custom_page')}
-                            />
-                            <NSBoxRadio
-                                ref={this.NSBoxBoolean_AllPage}
-                                title={"All Pages"}
-                                required={false}
-                                hideHeader
-                                checked={this.state.selectedRadio === 'all_page'}
-                                onClicked={() => this.handleRadioChange('all_page')}
-                            />
-                            {
-                                this.state.selectedRadio === 'custom_page' && (
-                                    <NSBoxString
-                                        ref={this.NSBoxString_Pages}
-                                        classList={[Styles.ns_w_box_string]}
-                                        required={false}
-                                        title="Custom Pages"
-                                        validator={(_, value) =>
-                                        {
-                                            try
-                                            {
-                                                CronOperation.check(value)
-                                                return null;
-                                            }
-                                            catch (error: any)
-                                            {
-                                                return error.message;
-                                            }
-                                        }}
-                                    />
-                                )
-                            }
-                            {
-                                this.props.showExpandAll && (
-                                    <NSBoxBoolean
-                                        ref={this.NSBoxBoolean_ExpandAll}
-                                        required={false}
-                                        defaultValue={false}
-                                        title={"Print with all rows expanded"}
-                                        hideHeader
-                                    />
-                                )
-                            }
-                        </div>
-                        {
-                            this.state.showNoItemError && (
-                                <>
-                                    <NSSpace size={NSSpaceSizeType.MINI} />
-                                    <NSLabelErrorNotifier
-                                        error="No items found for the selected option."
-                                        clearError={() => this.setState((prev) => ({ ...prev, showNoItemError: false }))}
-                                    />
-                                </>
-                            )
-                        }
-                        <NSSpace size={NSSpaceSizeType.MEDUIM} />
-                        <NSButtonBlue
-                            style={{ width: "100%" }}
-                            title='Apply'
-                            onClick={{
-                                action: async (onFinished) =>
-                                {
-                                    try
-                                    {
-                                        let items: RowType[] = [];
-                                        if (this.NSBoxBoolean_CurrentPage.current?.getValue())
-                                        {
-                                            let is = await this.props.getItems(this.props.current_page, this.props.current_size, false);
-                                            items.push(...is);
-                                        }
-                                        else if (this.NSBoxBoolean_SelectedItems.current?.getValue())
-                                        {
-                                            let is = await this.props.getItems(this.props.current_page, this.props.current_size, true);
-                                            items.push(...is);
-                                        }
-                                        else if (this.NSBoxBoolean_CustomPage.current?.getValue())
-                                        {
-                                            let pages_value = this.NSBoxString_Pages.current?.getValue() ?? "";
-                                            let pages = CronOperation.getNumbers(pages_value, 1, this.props.max_page);
-
-                                            for (let p = 0; p < pages.length; p++)
-                                            {
-                                                let is = await this.props.getItems(pages[p], this.props.current_size, false);
-                                                items.push(...is);
-                                            }
-                                        }
-                                        else if (this.NSBoxBoolean_AllPage.current?.getValue())
-                                        {
-                                            for (let p = 1; p <= this.props.max_page; p++)
-                                            {
-                                                let is = await this.props.getItems(p, this.props.current_size, false);
-                                                items.push(...is);
-                                            }
-                                        }
-
-                                        if (items.length > 0)
-                                            await this.props.onFinish(items, this.NSBoxBoolean_ExpandAll.current?.getValue() === true);
-                                        else
-                                            this.setState((prev) => ({ ...prev, showNoItemError: true }));
-                                    } catch (error)
-                                    {
-                                    }
-                                    onFinished();
-                                }
-                            }} />
-                    </div>
-                </div>
-                <div className={Styles.ns_toast_background}></div>
-            </>
-        );
-    }
+import { CronOperation } from 'namirasoft-core';
+import React, { Component, createRef } from 'react';
+import { NSBoxBoolean } from './NSBoxBoolean';
+import { NSBoxRadio } from './NSBoxRadio';
+import { NSBoxString } from './NSBoxString';
+import { NSButtonBlue } from './NSButtonBlue';
+import Styles from './NSDialogPageSelection.module.css';
+import { NSLabelErrorNotifier } from './NSLabelErrorNotifier';
+import { NSSpace, NSSpaceSizeType } from './NSSpace';
+
+export interface NSDialogPageSelectionProps<RowType>
+{
+    current_page: number;
+    current_size: number;
+    max_page: number;
+    onClose: () => void;
+    getItems: (page: number, size: number, selected: boolean) => Promise<RowType[]>;
+    onFinish: (items: RowType[], expandAll: boolean) => Promise<void>;
+    icon?: string;
+    showExpandAll?: boolean;
+}
+
+interface NSDialogPageSelectionState
+{
+    selectedRadio: string;
+    showNoItemError: boolean;
+}
+
+export class NSDialogPageSelection<RowType> extends Component<NSDialogPageSelectionProps<RowType>, NSDialogPageSelectionState>
+{
+    private toastRef: React.RefObject<HTMLDivElement> = createRef();
+    private NSBoxBoolean_CurrentPage: React.RefObject<NSBoxRadio> = createRef();
+    private NSBoxBoolean_SelectedItems: React.RefObject<NSBoxRadio> = createRef();
+    private NSBoxBoolean_CustomPage: React.RefObject<NSBoxRadio> = createRef();
+    private NSBoxBoolean_AllPage: React.RefObject<NSBoxRadio> = createRef();
+    private NSBoxString_Pages: React.RefObject<NSBoxString> = createRef();
+    private NSBoxBoolean_ExpandAll: React.RefObject<NSBoxBoolean> = createRef();
+
+    constructor(props: NSDialogPageSelectionProps<RowType>)
+    {
+        super(props);
+        this.state = {
+            selectedRadio: 'current_page',
+            showNoItemError: false
+        };
+        this.onClickOutside = this.onClickOutside.bind(this);
+        this.handleRadioChange = this.handleRadioChange.bind(this);
+    }
+    override componentDidMount(): void
+    {
+        document.addEventListener('mousedown', this.onClickOutside);
+    }
+    override componentWillUnmount(): void
+    {
+        document.removeEventListener('mousedown', this.onClickOutside);
+    }
+    private onClickOutside(event: MouseEvent)
+    {
+        if (this.toastRef.current && !this.toastRef.current.contains(event.target as Node))
+        {
+            this.props.onClose();
+        }
+    }
+    private handleRadioChange(selectedRadio: string)
+    {
+        this.setState((prev) => ({ ...prev, selectedRadio }));
+    }
+    override render()
+    {
+        return (
+            <>
+                <div className={Styles.ns_print_container} ref={this.toastRef}>
+                    <div className={Styles.ns_header_print}>
+                        <img
+                            src="https://static.namirasoft.com/image/concept/close/blue.svg"
+                            alt="Close"
+                            width={24}
+                            height={24}
+                            onClick={(e) =>
+                            {
+                                e.stopPropagation();
+                                this.props.onClose();
+                            }}
+                            className={Styles.ns_close_icon}
+                        />
+                        <div className={Styles.ns_print_title}>
+                            <img
+                                src={this.props.icon && this.props.icon}
+                                alt="Print"
+                                width={24}
+                                height={24}
+                            />
+                            <h2 className='m-0'>Page Selection</h2>
+                        </div>
+                        <NSSpace size={NSSpaceSizeType.SMALL} />
+                        <p className={Styles.ns_print_description}>Please select which pages you want to continue with</p>
+                        <NSSpace size={NSSpaceSizeType.SMALL} />
+                        <div className={Styles.ns_parent_checkboxs}>
+                            {/* todo: input id for check when click on labels */}
+                            <NSBoxRadio
+                                ref={this.NSBoxBoolean_CurrentPage}
+                                required={false}
+                                defaultValue={true}
+                                title={"Current page"}
+                                hideHeader
+                                checked={this.state.selectedRadio === 'current_page'}
+                                onClicked={() => this.handleRadioChange('current_page')}
+                            />
+                            <NSBoxRadio
+                                ref={this.NSBoxBoolean_SelectedItems}
+                                required={false}
+                                title={"Only Selected Items"}
+                                hideHeader
+                                checked={this.state.selectedRadio === 'selected_items'}
+                                onClicked={() => this.handleRadioChange('selected_items')}
+                            />
+                            <NSBoxRadio
+                                ref={this.NSBoxBoolean_CustomPage}
+                                title={"Custom Pages"}
+                                required={false}
+                                hideHeader
+                                checked={this.state.selectedRadio === 'custom_page'}
+                                onClicked={() => this.handleRadioChange('custom_page')}
+                            />
+                            <NSBoxRadio
+                                ref={this.NSBoxBoolean_AllPage}
+                                title={"All Pages"}
+                                required={false}
+                                hideHeader
+                                checked={this.state.selectedRadio === 'all_page'}
+                                onClicked={() => this.handleRadioChange('all_page')}
+                            />
+                            {
+                                this.state.selectedRadio === 'custom_page' && (
+                                    <NSBoxString
+                                        ref={this.NSBoxString_Pages}
+                                        classList={[Styles.ns_w_box_string]}
+                                        required={false}
+                                        title="Custom Pages"
+                                        validator={(_, value) =>
+                                        {
+                                            try
+                                            {
+                                                CronOperation.check(value)
+                                                return null;
+                                            }
+                                            catch (error: any)
+                                            {
+                                                return error.message;
+                                            }
+                                        }}
+                                    />
+                                )
+                            }
+                            {
+                                this.props.showExpandAll && (
+                                    <NSBoxBoolean
+                                        ref={this.NSBoxBoolean_ExpandAll}
+                                        required={false}
+                                        defaultValue={false}
+                                        title={"Print with all rows expanded"}
+                                        hideHeader
+                                    />
+                                )
+                            }
+                        </div>
+                        {
+                            this.state.showNoItemError && (
+                                <>
+                                    <NSSpace size={NSSpaceSizeType.MINI} />
+                                    <NSLabelErrorNotifier
+                                        error="No items found for the selected option."
+                                        clearError={() => this.setState((prev) => ({ ...prev, showNoItemError: false }))}
+                                    />
+                                </>
+                            )
+                        }
+                        <NSSpace size={NSSpaceSizeType.MEDUIM} />
+                        <NSButtonBlue
+                            style={{ width: "100%" }}
+                            title='Apply'
+                            onClick={{
+                                action: async (onFinished) =>
+                                {
+                                    try
+                                    {
+                                        let items: RowType[] = [];
+                                        if (this.NSBoxBoolean_CurrentPage.current?.getValue())
+                                        {
+                                            let is = await this.props.getItems(this.props.current_page, this.props.current_size, false);
+                                            items.push(...is);
+                                        }
+                                        else if (this.NSBoxBoolean_SelectedItems.current?.getValue())
+                                        {
+                                            let is = await this.props.getItems(this.props.current_page, this.props.current_size, true);
+                                            items.push(...is);
+                                        }
+                                        else if (this.NSBoxBoolean_CustomPage.current?.getValue())
+                                        {
+                                            let pages_value = this.NSBoxString_Pages.current?.getValue() ?? "";
+                                            let pages = CronOperation.getNumbers(pages_value, 1, this.props.max_page);
+
+                                            for (let p = 0; p < pages.length; p++)
+                                            {
+                                                let is = await this.props.getItems(pages[p], this.props.current_size, false);
+                                                items.push(...is);
+                                            }
+                                        }
+                                        else if (this.NSBoxBoolean_AllPage.current?.getValue())
+                                        {
+                                            for (let p = 1; p <= this.props.max_page; p++)
+                                            {
+                                                let is = await this.props.getItems(p, this.props.current_size, false);
+                                                items.push(...is);
+                                            }
+                                        }
+
+                                        if (items.length > 0)
+                                            await this.props.onFinish(items, this.NSBoxBoolean_ExpandAll.current?.getValue() === true);
+                                        else
+                                            this.setState((prev) => ({ ...prev, showNoItemError: true }));
+                                    } catch (error)
+                                    {
+                                    }
+                                    onFinished();
+                                }
+                            }} />
+                    </div>
+                </div>
+                <div className={Styles.ns_toast_background}></div>
+            </>
+        );
+    }
 }

package/src/components/NSDownTimer.module.css

@@ -1,56 +1,56 @@
-.ns_down_timer_container {
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	justify-content: center;
-}
-
-.ns_figure {
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	justify-content: center;
-	margin: 0;
-}
-
-.ns_figure figcaption {
-	font-size: 14px;
-	font-weight: 500;
-	margin: 0 0 0 8px;
-	color: #141B5C;
-	padding: 2px 0;
-	max-width: 100px;
-}
-
-.ns_down_timer_time_container {
-	display: flex;
-	flex-direction: row;
-	justify-content: center;
-	gap: 4px;
-	align-items: flex-start;
-	padding: 0 8px;
-}
-
-.ns_down_timer_time_left {
-	font-size: 16px;
-	font-weight: 600;
-	color: #141B5C;
-	margin: 0;
-	padding-left: 2px;
-}
-
-.ns_down_timer_time_left_unit {
-	font-size: 12px;
-	font-weight: 400;
-	color: #141B5C;
-	margin: 0;
-	padding-left: 2px;
-}
-
-.ns_semi_colon {
-	display: flex;
-	flex-direction: row;
-	padding: 0;
-	color: #141B5C;
-	margin: 0;
+.ns_down_timer_container {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: center;
+}
+
+.ns_figure {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: center;
+	margin: 0;
+}
+
+.ns_figure figcaption {
+	font-size: 14px;
+	font-weight: 500;
+	margin: 0 0 0 8px;
+	color: #141B5C;
+	padding: 2px 0;
+	max-width: 100px;
+}
+
+.ns_down_timer_time_container {
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	gap: 4px;
+	align-items: flex-start;
+	padding: 0 8px;
+}
+
+.ns_down_timer_time_left {
+	font-size: 16px;
+	font-weight: 600;
+	color: #141B5C;
+	margin: 0;
+	padding-left: 2px;
+}
+
+.ns_down_timer_time_left_unit {
+	font-size: 12px;
+	font-weight: 400;
+	color: #141B5C;
+	margin: 0;
+	padding-left: 2px;
+}
+
+.ns_semi_colon {
+	display: flex;
+	flex-direction: row;
+	padding: 0;
+	color: #141B5C;
+	margin: 0;
 }