@sqrzro/ui 4.0.0-alpha.65 → 4.0.0-alpha.67

package/dist/forms/components/EditableFormFields/index.d.ts

@@ -2,6 +2,7 @@ import type { EditableFormFieldComponentProps } from '../../interfaces';
 import type { ColorInputComponentProps } from '../ColorInput';
 import type { DropdownComponentProps } from '../Dropdown';
 import type { ImageInputComponentProps } from '../ImageInput';
+import type { SwitchComponentProps } from '../Switch';
 import type { TextAreaComponentProps } from '../TextArea';
 import type { TextInputComponentProps } from '../TextInput';
 export type EditableColorFormFieldProps = EditableFormFieldComponentProps<string | undefined> & ColorInputComponentProps;
@@ -10,6 +11,8 @@ export type EditableDropdownFormFieldProps<T> = EditableFormFieldComponentProps<
 export declare function EditableDropdownFormField<T>(props: Readonly<EditableDropdownFormFieldProps<T>>): React.ReactElement;
 export type EditableImageFormFieldProps = EditableFormFieldComponentProps<string | null> & ImageInputComponentProps;
 export declare function EditableImageFormField(props: Readonly<EditableImageFormFieldProps>): React.ReactElement;
+export type EditableSwitchFormFieldProps = EditableFormFieldComponentProps<boolean> & SwitchComponentProps;
+export declare function EditableSwitchFormField(props: Readonly<EditableSwitchFormFieldProps>): React.ReactElement;
 export type EditableTextAreaFormFieldProps = EditableFormFieldComponentProps<string> & TextAreaComponentProps;
 export declare function EditableTextAreaFormField(props: Readonly<EditableTextAreaFormFieldProps>): React.ReactElement;
 export type EditableTextFormFieldProps = EditableFormFieldComponentProps<string> & TextInputComponentProps;

package/dist/forms/components/EditableFormFields/index.js

@@ -5,8 +5,9 @@ import tw from '../../../styles/classnames/utility/tw';
 import extractEditableInputProps from '../../utility/extract-editable-input-props';
 import ColorInput from '../ColorInput';
 import Dropdown from '../Dropdown';
-import ImageInput from '../ImageInput';
 import EditableFormField from '../EditableFormField';
+import ImageInput from '../ImageInput';
+import Switch from '../Switch';
 import TextArea from '../TextArea';
 import TextInput from '../TextInput';
 export function EditableColorFormField(props) {
@@ -42,6 +43,14 @@ export function EditableImageFormField(props) {
     }, [fieldProps.value]);
     return _jsx(EditableFormField, { ...fieldProps, render: renderInput, renderValue: renderValue });
 }
+export function EditableSwitchFormField(props) {
+    const { fieldProps, inputProps } = extractEditableInputProps(props);
+    const renderInput = useCallback((renderProps) => (_jsx(Switch, { ...renderProps, ...inputProps, label: null })), [inputProps]);
+    const renderValue = useCallback((value) => {
+        return _jsx("div", { children: value ? 'Yes' : 'No' });
+    }, [inputProps]);
+    return _jsx(EditableFormField, { ...fieldProps, render: renderInput, renderValue: renderValue });
+}
 export function EditableTextAreaFormField(props) {
     const { fieldProps, inputProps } = extractEditableInputProps(props);
     const renderInput = useCallback((renderProps) => (_jsx(TextArea, { ...renderProps, ...inputProps })), [inputProps]);

package/dist/mail/Mail/index.d.ts

@@ -2,7 +2,7 @@ import { DeepPartial } from '@sqrzro/utility';
 import { MailConfigObject } from '../utility/interfaces';
 export interface MailProps extends DeepPartial<MailConfigObject> {
     children: React.ReactNode;
-    title: string;
+    title?: string;
 }
 declare function Mail({ children, logo, styles, title, }: Readonly<MailProps>): Promise<React.ReactElement>;
 export default Mail;

package/dist/mail/Mail/index.js

@@ -64,14 +64,16 @@ async function Mail({ children, logo, styles, title, }) {
                                                                 }, width: mailConfig.styles.panel.padding }), _jsx("td", { style: {
                                                                     backgroundColor: mailConfig.styles.panel.backgroundColor,
                                                                 }, children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, width: "100%", children: _jsxs("tbody", { children: [logoData ? (_jsxs(Fragment, { children: [_jsx("tr", { children: _jsx("td", { children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, width: 240, children: _jsx("tbody", { children: _jsx("tr", { children: _jsx("td", { children: _jsx("img", { alt: "Logo", src: logoData, width: 240 }) }) }) }) }) }) }), _jsx("tr", { children: _jsx("td", { height: mailConfig.styles.panel
-                                                                                                .padding }) })] })) : null, _jsx("tr", { children: _jsx("td", { style: {
-                                                                                        color: mailConfig.styles.title
-                                                                                            .color,
-                                                                                        fontSize: mailConfig.styles.title
-                                                                                            .fontSize,
-                                                                                        fontWeight: mailConfig.styles.title
-                                                                                            .fontWeight,
-                                                                                    }, children: title }) }), _jsx("tr", { children: _jsx("td", { height: mailConfig.styles.panel.padding }) }), _jsx("tr", { children: _jsx("td", { children: children }) })] }) }) }), _jsx("td", { className: "padding", style: {
+                                                                                                .padding }) })] })) : null, title ? (_jsxs(Fragment, { children: [_jsx("tr", { children: _jsx("td", { style: {
+                                                                                                color: mailConfig.styles
+                                                                                                    .title.color,
+                                                                                                fontSize: mailConfig.styles
+                                                                                                    .title.fontSize,
+                                                                                                fontWeight: mailConfig.styles
+                                                                                                    .title
+                                                                                                    .fontWeight,
+                                                                                            }, children: title }) }), _jsx("tr", { children: _jsx("td", { height: mailConfig.styles.panel
+                                                                                                .padding }) })] })) : null, _jsx("tr", { children: _jsx("td", { children: children }) })] }) }) }), _jsx("td", { className: "padding", style: {
                                                                     backgroundColor: mailConfig.styles.panel.backgroundColor,
                                                                 }, width: mailConfig.styles.panel.padding })] }), _jsxs("tr", { children: [_jsx("td", { className: "padding", height: mailConfig.styles.panel.padding, style: {
                                                                     backgroundColor: mailConfig.styles.panel.backgroundColor,

package/dist/mail/utility/convert-to-datauri.js

@@ -1,11 +1,32 @@
 'use server';
 import fs from 'node:fs';
 import path from 'node:path';
+function isURL(value) {
+    try {
+        const url = new URL(value);
+        return url.protocol === 'http:' || url.protocol === 'https:';
+    }
+    catch {
+        return false;
+    }
+}
+async function read(fileName) {
+    if (isURL(fileName)) {
+        const response = await fetch(fileName);
+        if (!response.ok) {
+            throw new Error(`Failed to fetch ${fileName}: ${response.status}`);
+        }
+        return Buffer.from(await response.arrayBuffer());
+    }
+    return fs.readFileSync(fileName);
+}
 async function convertToDataURI(fileName) {
     try {
-        const filePath = path.join(process.cwd(), fileName);
+        const filePath = path.isAbsolute(fileName) || isURL(fileName)
+            ? fileName
+            : path.join(process.cwd(), fileName);
         const mimeType = 'image/' + path.extname(filePath).slice(1);
-        const imageData = fs.readFileSync(filePath);
+        const imageData = await read(filePath);
         const base64Image = Buffer.from(imageData).toString('base64');
         return Promise.resolve(`data:${mimeType};base64,${base64Image}`);
     }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sqrzro/ui",
   "type": "module",
-  "version": "4.0.0-alpha.65",
+  "version": "4.0.0-alpha.67",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "license": "ISC",