@smartsoft001/react 0.0.0-stage → 2.193.0

package/src/lib/components/input/logo/preset/input-logo-preset.js

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartInputLogoPreset = SmartInputLogoPreset;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const hooks_1 = require("../../../../providers/hooks");
+const class_names_1 = require("../../../../utils/class-names");
+const button_1 = require("../../../button/button");
+const use_input_image_1 = require("../../image/use-input-image");
+const LABEL_CLASSES = [
+    'smart:block',
+    'smart:text-sm/6',
+    'smart:font-medium',
+    'smart:text-gray-900',
+    'smart:dark:text-white',
+].join(' ');
+const GROUP_CLASSES = [
+    'smart:mt-2',
+    'smart:flex',
+    'smart:items-center',
+    'smart:gap-x-3',
+    'smart:flex-wrap',
+].join(' ');
+// Avatar-style circular thumbnail (FRA-266: presentation like the avatar component).
+const AVATAR_CLASSES = [
+    'smart:inline-block',
+    'smart:object-cover',
+    'smart:size-20',
+    'smart:rounded-full',
+    'smart:ring-2',
+    'smart:ring-white',
+    'smart:dark:ring-gray-800',
+    'smart:border',
+    'smart:border-gray-200',
+    'smart:dark:border-gray-700',
+].join(' ');
+const PLACEHOLDER_CLASSES = [
+    'smart:inline-block',
+    'smart:overflow-hidden',
+    'smart:size-20',
+    'smart:rounded-full',
+    'smart:bg-gray-100',
+    'smart:dark:bg-gray-700',
+].join(' ');
+/**
+ * Styled `logo` field (preset, the Angular `InputLogoPresetComponent`).
+ * Unlike {@link SmartInputLogo} it uploads the picked `.jpg,.png,.jpeg` file
+ * like the image field ({@link useInputImage}) and shows it as a circular
+ * avatar (a person placeholder without a value), with add / change / delete
+ * buttons and the upload progress. `className` is appended to the group's
+ * classes.
+ */
+function SmartInputLogoPreset(props) {
+    const { className } = props;
+    const t = (0, hooks_1.useTranslate)();
+    const { control, value, required, label, inputRef, loading, percent, onFileChange, addButtonOptions, deleteButtonOptions, imageUrl, } = (0, use_input_image_1.useInputImage)(props);
+    const id = (0, react_1.useId)();
+    if (!control)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("label", { htmlFor: id, className: LABEL_CLASSES, children: [label, ' ', required && (0, jsx_runtime_1.jsx)("span", { className: "smart:text-red-500 smart:ml-0.5", children: "*" })] }), (0, jsx_runtime_1.jsxs)("div", { className: (0, class_names_1.cn)(GROUP_CLASSES, className), children: [imageUrl ? ((0, jsx_runtime_1.jsx)("img", { src: imageUrl, alt: "", className: AVATAR_CLASSES })) : ((0, jsx_runtime_1.jsx)("span", { className: PLACEHOLDER_CLASSES, children: (0, jsx_runtime_1.jsxs)("svg", { className: "smart:size-full smart:text-gray-400 smart:dark:text-gray-500", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: [(0, jsx_runtime_1.jsx)("rect", { x: "0.62854", y: "0.359985", width: "15", height: "15", rx: "7.5", fill: "currentColor", className: "smart:fill-white smart:dark:fill-gray-800" }), (0, jsx_runtime_1.jsx)("path", { d: "M8.12421 7.20374C9.21151 7.20374 10.093 6.32229 10.093 5.23499C10.093 4.14767 9.21151 3.26624 8.12421 3.26624C7.0369 3.26624 6.15546 4.14767 6.15546 5.23499C6.15546 6.32229 7.0369 7.20374 8.12421 7.20374Z", fill: "currentColor" }), (0, jsx_runtime_1.jsx)("path", { d: "M11.818 10.5975C10.2992 12.6412 7.42106 13.0631 5.37731 11.5537C5.01171 11.2818 4.69296 10.9631 4.42107 10.5975C4.28982 10.4006 4.27107 10.1475 4.37419 9.94123L4.51482 9.65059C4.84296 8.95684 5.53671 8.51624 6.30546 8.51624H9.95231C10.7023 8.51624 11.3867 8.94749 11.7242 9.62249L11.8742 9.93184C11.968 10.1475 11.9586 10.4006 11.818 10.5975Z", fill: "currentColor" })] }) })), (0, jsx_runtime_1.jsxs)("div", { className: "smart:flex smart:flex-col smart:gap-y-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "smart:flex smart:items-center smart:gap-x-2 smart:flex-wrap", children: [(0, jsx_runtime_1.jsx)(button_1.SmartButton, { options: addButtonOptions, children: t(value ? 'change' : 'add') }), value && ((0, jsx_runtime_1.jsx)(button_1.SmartButton, { options: deleteButtonOptions, children: t('delete') }))] }), loading && ((0, jsx_runtime_1.jsx)("div", { className: "smart:h-1 smart:w-24 smart:overflow-hidden smart:rounded smart:bg-gray-200 smart:dark:bg-gray-700", children: (0, jsx_runtime_1.jsx)("div", { className: "smart:h-full smart:bg-blue-600 smart:dark:bg-blue-500", style: { width: `${percent ?? 0}%` } }) }))] }), (0, jsx_runtime_1.jsx)("input", { id: id, ref: inputRef, type: "file", accept: ".jpg,.png,.jpeg", hidden: true, onChange: onFileChange })] })] }));
+}
+//# sourceMappingURL=input-logo-preset.js.map

package/src/lib/components/input/logo/preset/input-logo-preset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-logo-preset.js","sourceRoot":"","sources":["../../../../../../../../../../packages/shared/react/src/lib/components/input/logo/preset/input-logo-preset.tsx"],"names":[],"mappings":"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"}

package/src/lib/components/input/long-text/index.d.ts

@@ -0,0 +1,4 @@
+export * from './input-long-text';
+export * from './preset/input-long-text-preset';
+export { SmartRichTextEditor } from './rich-text-editor';
+export type { SmartRichTextEditorProps } from './rich-text-editor';

package/src/lib/components/input/long-text/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartRichTextEditor = void 0;
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./input-long-text"), exports);
+tslib_1.__exportStar(require("./preset/input-long-text-preset"), exports);
+var rich_text_editor_1 = require("./rich-text-editor");
+Object.defineProperty(exports, "SmartRichTextEditor", { enumerable: true, get: function () { return rich_text_editor_1.SmartRichTextEditor; } });
+//# sourceMappingURL=index.js.map

package/src/lib/components/input/long-text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/input/long-text/index.ts"],"names":[],"mappings":";;;;AAAA,4DAAkC;AAClC,0EAAgD;AAChD,uDAAyD;AAAhD,uHAAA,mBAAmB,OAAA"}

package/src/lib/components/input/long-text/input-long-text.d.ts

@@ -0,0 +1,12 @@
+import { SmartInputFieldProps } from '../input.types';
+/**
+ * The long text field (`<smart-input-long-text>`, Angular
+ * `InputLongTextComponent`): a rich-text editor whose value is HTML.
+ *
+ * Angular rendered the `ngx-editor` menu and editor; this renders
+ * `SmartRichTextEditor`, a dependency-free `contentEditable` editor with the
+ * same menu (bold, italic, underline, strike, code, blockquote, lists,
+ * headings, link, image, text and background colour, alignment). The value is
+ * shown sanitised (`toInnerHtml`) when it is loaded or set from outside.
+ */
+export declare function SmartInputLongText<T>(props: SmartInputFieldProps<T>): import("react/jsx-runtime").JSX.Element | null;

package/src/lib/components/input/long-text/input-long-text.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartInputLongText = SmartInputLongText;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const hooks_1 = require("../../../providers/hooks");
+const class_names_1 = require("../../../utils/class-names");
+const use_input_1 = require("../base/use-input");
+const rich_text_editor_1 = require("./rich-text-editor");
+const LABEL_CLASSES = 'smart:block smart:text-sm/6 smart:font-medium smart:text-gray-900 smart:dark:text-white';
+const EDITOR_CLASSES = [
+    'smart:mt-2',
+    'smart:block',
+    'smart:w-full',
+    'smart:rounded-md',
+    'smart:bg-white',
+    'smart:text-gray-900',
+    'smart:outline-1',
+    '-outline-offset-1',
+    'smart:outline-gray-300',
+    'smart:dark:bg-white/5',
+    'smart:dark:text-white',
+    'smart:dark:outline-white/10',
+];
+/**
+ * The long text field (`<smart-input-long-text>`, Angular
+ * `InputLongTextComponent`): a rich-text editor whose value is HTML.
+ *
+ * Angular rendered the `ngx-editor` menu and editor; this renders
+ * `SmartRichTextEditor`, a dependency-free `contentEditable` editor with the
+ * same menu (bold, italic, underline, strike, code, blockquote, lists,
+ * headings, link, image, text and background colour, alignment). The value is
+ * shown sanitised (`toInnerHtml`) when it is loaded or set from outside.
+ */
+function SmartInputLongText(props) {
+    const { className } = props;
+    const labelId = (0, react_1.useId)();
+    const t = (0, hooks_1.useTranslate)();
+    const { control, value, required, disabled, label, setValue, markAsTouched } = (0, use_input_1.useInput)(props);
+    if (!control)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("label", { id: labelId, className: LABEL_CLASSES, children: [label, ' ', required && (0, jsx_runtime_1.jsx)("span", { className: "smart:text-red-500 smart:ml-0.5", children: "*" })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, class_names_1.cn)(EDITOR_CLASSES, className), style: { minHeight: '220px' }, children: (0, jsx_runtime_1.jsx)(rich_text_editor_1.SmartRichTextEditor, { value: value, placeholder: t('writeHere') + '...', disabled: disabled, labelledBy: labelId, onChange: setValue, onBlur: markAsTouched }) })] }));
+}
+//# sourceMappingURL=input-long-text.js.map

package/src/lib/components/input/long-text/input-long-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-long-text.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/input/long-text/input-long-text.tsx"],"names":[],"mappings":";;AAoCA,gDA8BC;;AAlED,iCAA8B;AAE9B,oDAAwD;AACxD,4DAAgD;AAChD,iDAA6C;AAE7C,yDAAyD;AAEzD,MAAM,aAAa,GACjB,yFAAyF,CAAC;AAE5F,MAAM,cAAc,GAAG;IACrB,YAAY;IACZ,aAAa;IACb,cAAc;IACd,kBAAkB;IAClB,gBAAgB;IAChB,qBAAqB;IACrB,iBAAiB;IACjB,mBAAmB;IACnB,wBAAwB;IACxB,uBAAuB;IACvB,uBAAuB;IACvB,6BAA6B;CAC9B,CAAC;AAEF;;;;;;;;;GASG;AACH,SAAgB,kBAAkB,CAAI,KAA8B;IAClE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC5B,MAAM,OAAO,GAAG,IAAA,aAAK,GAAE,CAAC;IACxB,MAAM,CAAC,GAAG,IAAA,oBAAY,GAAE,CAAC;IACzB,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,GAC1E,IAAA,oBAAQ,EAAC,KAAK,CAAC,CAAC;IAElB,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,OAAO,CACL,6DACE,mCAAO,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,aAAa,aACzC,KAAK,EAAE,GAAG,EACV,QAAQ,IAAI,iCAAM,SAAS,EAAC,iCAAiC,kBAAS,IACjE,EACR,gCACE,SAAS,EAAE,IAAA,gBAAE,EAAC,cAAc,EAAE,SAAS,CAAC,EACxC,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,YAE7B,uBAAC,sCAAmB,IAClB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,CAAC,CAAC,WAAW,CAAC,GAAG,KAAK,EACnC,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,OAAO,EACnB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,aAAa,GACrB,GACE,IACL,CACJ,CAAC;AACJ,CAAC"}

package/src/lib/components/input/long-text/preset/input-long-text-preset.d.ts

@@ -0,0 +1,8 @@
+import { SmartInputFieldProps } from '../../input.types';
+/**
+ * Preline-styled long text field (preset, Angular
+ * `InputLongTextPresetComponent`). Unlike `SmartInputLongText` (the rich-text
+ * editor), this renders a plain `<textarea>`, as the Angular preset does
+ * (FRA-267), so the value is plain text.
+ */
+export declare function SmartInputLongTextPreset<T>(props: SmartInputFieldProps<T>): import("react/jsx-runtime").JSX.Element | null;

package/src/lib/components/input/long-text/preset/input-long-text-preset.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartInputLongTextPreset = SmartInputLongTextPreset;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const hooks_1 = require("../../../../providers/hooks");
+const class_names_1 = require("../../../../utils/class-names");
+const use_input_1 = require("../../base/use-input");
+const LABEL_CLASSES = 'smart:block smart:mb-3 smart:text-sm smart:font-medium smart:text-gray-900 smart:dark:text-white';
+const TEXTAREA_CLASSES = [
+    'smart:py-2',
+    'smart:px-3',
+    'smart:sm:py-3',
+    'smart:sm:px-4',
+    'smart:block',
+    'smart:w-full',
+    'smart:rounded-lg',
+    'smart:border',
+    'smart:bg-white',
+    'smart:dark:bg-gray-800',
+    'smart:border-gray-200',
+    'smart:dark:border-gray-700',
+    'smart:sm:text-sm',
+    'smart:text-gray-900',
+    'smart:dark:text-white',
+    'smart:placeholder:text-gray-500',
+    'smart:dark:placeholder:text-gray-400',
+    'smart:focus:border-blue-700',
+    'smart:dark:focus:border-blue-600',
+    'smart:focus:ring-blue-700',
+    'smart:dark:focus:ring-blue-600',
+    'smart:disabled:opacity-50',
+    'smart:disabled:pointer-events-none',
+    'smart:[&::-webkit-scrollbar]:w-2',
+    'smart:[&::-webkit-scrollbar-thumb]:rounded-none',
+    'smart:[&::-webkit-scrollbar-track]:bg-gray-100',
+    'smart:dark:[&::-webkit-scrollbar-track]:bg-gray-800',
+    'smart:[&::-webkit-scrollbar-thumb]:bg-gray-300',
+    'smart:dark:[&::-webkit-scrollbar-thumb]:bg-gray-600',
+];
+/**
+ * Preline-styled long text field (preset, Angular
+ * `InputLongTextPresetComponent`). Unlike `SmartInputLongText` (the rich-text
+ * editor), this renders a plain `<textarea>`, as the Angular preset does
+ * (FRA-267), so the value is plain text.
+ */
+function SmartInputLongTextPreset(props) {
+    const { className } = props;
+    const id = (0, react_1.useId)();
+    const t = (0, hooks_1.useTranslate)();
+    const { control, value, required, disabled, label, autoFocus, setValue, markAsTouched, } = (0, use_input_1.useInput)(props);
+    if (!control)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("label", { htmlFor: id, className: LABEL_CLASSES, children: [label, ' ', required && (0, jsx_runtime_1.jsx)("span", { className: "smart:text-red-500 smart:ml-0.5", children: "*" })] }), (0, jsx_runtime_1.jsx)("textarea", { id: id, rows: 3, className: (0, class_names_1.cn)(TEXTAREA_CLASSES, className), placeholder: t('writeHere') + '...', value: value ?? '', disabled: disabled, autoFocus: autoFocus, onChange: (e) => setValue(e.target.value), onBlur: markAsTouched })] }));
+}
+//# sourceMappingURL=input-long-text-preset.js.map

package/src/lib/components/input/long-text/preset/input-long-text-preset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-long-text-preset.js","sourceRoot":"","sources":["../../../../../../../../../../packages/shared/react/src/lib/components/input/long-text/preset/input-long-text-preset.tsx"],"names":[],"mappings":";;AAgDA,4DAoCC;;AApFD,iCAA8B;AAE9B,uDAA2D;AAC3D,+DAAmD;AACnD,oDAAgD;AAGhD,MAAM,aAAa,GACjB,kGAAkG,CAAC;AAErG,MAAM,gBAAgB,GAAG;IACvB,YAAY;IACZ,YAAY;IACZ,eAAe;IACf,eAAe;IACf,aAAa;IACb,cAAc;IACd,kBAAkB;IAClB,cAAc;IACd,gBAAgB;IAChB,wBAAwB;IACxB,uBAAuB;IACvB,4BAA4B;IAC5B,kBAAkB;IAClB,qBAAqB;IACrB,uBAAuB;IACvB,iCAAiC;IACjC,sCAAsC;IACtC,6BAA6B;IAC7B,kCAAkC;IAClC,2BAA2B;IAC3B,gCAAgC;IAChC,2BAA2B;IAC3B,oCAAoC;IACpC,kCAAkC;IAClC,iDAAiD;IACjD,gDAAgD;IAChD,qDAAqD;IACrD,gDAAgD;IAChD,qDAAqD;CACtD,CAAC;AAEF;;;;;GAKG;AACH,SAAgB,wBAAwB,CAAI,KAA8B;IACxE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC5B,MAAM,EAAE,GAAG,IAAA,aAAK,GAAE,CAAC;IACnB,MAAM,CAAC,GAAG,IAAA,oBAAY,GAAE,CAAC;IACzB,MAAM,EACJ,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,SAAS,EACT,QAAQ,EACR,aAAa,GACd,GAAG,IAAA,oBAAQ,EAAC,KAAK,CAAC,CAAC;IAEpB,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,OAAO,CACL,6DACE,mCAAO,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,aAAa,aACzC,KAAK,EAAE,GAAG,EACV,QAAQ,IAAI,iCAAM,SAAS,EAAC,iCAAiC,kBAAS,IACjE,EACR,qCACE,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,CAAC,EACP,SAAS,EAAE,IAAA,gBAAE,EAAC,gBAAgB,EAAE,SAAS,CAAC,EAC1C,WAAW,EAAE,CAAC,CAAC,WAAW,CAAC,GAAG,KAAK,EACnC,KAAK,EAAE,KAAK,IAAI,EAAE,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACzC,MAAM,EAAE,aAAa,GACrB,IACD,CACJ,CAAC;AACJ,CAAC"}

package/src/lib/components/input/long-text/rich-text-commands.d.ts

@@ -0,0 +1,57 @@
+import { SmartRichTextColorKind, SmartRichTextHeading, SmartRichTextToggle } from './rich-text-toolbar';
+/** What a menu item asks the editor to do. */
+export type SmartRichTextCommand = {
+    type: 'toggle';
+    item: SmartRichTextToggle;
+} | {
+    type: 'heading';
+    level: SmartRichTextHeading;
+} | {
+    type: 'link';
+    href: string;
+    text: string;
+    openInNewTab: boolean;
+} | {
+    type: 'unlink';
+} | {
+    type: 'image';
+    src: string;
+    alt: string;
+    title: string;
+} | {
+    type: 'color';
+    kind: SmartRichTextColorKind;
+    color: string;
+} | {
+    type: 'removeColor';
+    kind: SmartRichTextColorKind;
+};
+/** The formats at the selection, which press the menu buttons. */
+export interface SmartRichTextState {
+    toggles: Partial<Record<SmartRichTextToggle, boolean>>;
+    heading: SmartRichTextHeading | null;
+    link: boolean;
+    text_color: string | null;
+    background_color: string | null;
+}
+export declare const EMPTY_RICH_TEXT_STATE: SmartRichTextState;
+/** `document.execCommand`, where the document has it. */
+export declare function execCommand(command: string, value?: string): boolean;
+/** `rgb(182, 2, 5)` -> `#b60205`; other colours lower-cased. */
+export declare function toHexColor(color: string): string;
+/** The selected range, when it lies in `editor`. */
+export declare function getEditorRange(editor: HTMLElement): Range | null;
+/** Selects `range` again (after the focus left the editor). */
+export declare function restoreRange(range: Range | null): void;
+/** The formats at `range` in `editor`. */
+export declare function getRichTextState(editor: HTMLElement, range: Range | null): SmartRichTextState;
+/** Whether two states press the same buttons. */
+export declare function isSameRichTextState(a: SmartRichTextState, b: SmartRichTextState): boolean;
+/**
+ * Runs `command` on the selection of `editor`. Formats the browser has a
+ * command for go through `document.execCommand`, links and images are
+ * inserted as escaped HTML; removing code, quotes, links and colours edits
+ * the DOM directly. Choosing the active heading again turns it back into a paragraph,
+ * as in `ngx-editor`.
+ */
+export declare function applyRichTextCommand(editor: HTMLElement, range: Range | null, command: SmartRichTextCommand): void;

package/src/lib/components/input/long-text/rich-text-commands.js

@@ -0,0 +1,231 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EMPTY_RICH_TEXT_STATE = void 0;
+exports.execCommand = execCommand;
+exports.toHexColor = toHexColor;
+exports.getEditorRange = getEditorRange;
+exports.restoreRange = restoreRange;
+exports.getRichTextState = getRichTextState;
+exports.isSameRichTextState = isSameRichTextState;
+exports.applyRichTextCommand = applyRichTextCommand;
+const html_1 = require("../../../utils/html");
+exports.EMPTY_RICH_TEXT_STATE = {
+    toggles: {},
+    heading: null,
+    link: false,
+    text_color: null,
+    background_color: null,
+};
+/** The `document.execCommand` command of the toggles the browser handles. */
+const EXEC_COMMANDS = {
+    bold: 'bold',
+    italic: 'italic',
+    underline: 'underline',
+    strike: 'strikeThrough',
+    ordered_list: 'insertOrderedList',
+    bullet_list: 'insertUnorderedList',
+    align_left: 'justifyLeft',
+    align_center: 'justifyCenter',
+    align_right: 'justifyRight',
+    align_justify: 'justifyFull',
+};
+/** `document.execCommand`, where the document has it. */
+function execCommand(command, value) {
+    if (typeof document.execCommand !== 'function')
+        return false;
+    return document.execCommand(command, false, value);
+}
+function queryCommandState(command) {
+    if (typeof document.queryCommandState !== 'function')
+        return false;
+    try {
+        return document.queryCommandState(command);
+    }
+    catch {
+        return false;
+    }
+}
+/** The element matching `selector` around the start of `range`, in `editor`. */
+function closestInEditor(editor, range, selector) {
+    const node = range?.startContainer ?? null;
+    const element = node && node.nodeType === 1 ? node : node?.parentElement;
+    const found = element?.closest(selector) ?? null;
+    return found && found !== editor && editor.contains(found) ? found : null;
+}
+/** Replaces `element` with its children. */
+function unwrap(element) {
+    element.replaceWith(...Array.from(element.childNodes));
+}
+const BLOCK_SELECTOR = 'p, div, h1, h2, h3, h4, h5, h6, ul, ol, pre';
+/** Replaces a block with its blocks, or with a paragraph of its text. */
+function liftBlock(element) {
+    const hasBlocks = Array.from(element.children).some((child) => child.matches(BLOCK_SELECTOR));
+    if (hasBlocks) {
+        unwrap(element);
+        return;
+    }
+    const paragraph = element.ownerDocument.createElement('p');
+    paragraph.append(...Array.from(element.childNodes));
+    element.replaceWith(paragraph);
+}
+const HEADING_SELECTOR = 'h1, h2, h3, h4, h5, h6';
+/** The colour an element gives its text or background, if any. */
+function colorOf(element, kind) {
+    return kind === 'text_color'
+        ? element.style.color || element.getAttribute('color') || ''
+        : element.style.backgroundColor;
+}
+/** The innermost element colouring the start of `range`, in `editor`. */
+function findColorElement(editor, range, kind) {
+    const node = range?.startContainer ?? null;
+    let element = node && node.nodeType === 1 ? node : node?.parentElement;
+    while (element && element !== editor && editor.contains(element)) {
+        if (colorOf(element, kind))
+            return element;
+        element = element.parentElement;
+    }
+    return null;
+}
+/** Drops the colour of `element`, and the element when it held only that. */
+function removeColor(element, kind) {
+    if (kind === 'text_color') {
+        element.style.removeProperty('color');
+        element.removeAttribute('color');
+    }
+    else {
+        element.style.removeProperty('background-color');
+    }
+    if (!element.getAttribute('style'))
+        element.removeAttribute('style');
+    if (/^(SPAN|FONT)$/.test(element.tagName) && !element.attributes.length) {
+        unwrap(element);
+    }
+}
+/** `rgb(182, 2, 5)` -> `#b60205`; other colours lower-cased. */
+function toHexColor(color) {
+    const match = /^rgba?\((\d+),\s*(\d+),\s*(\d+)/i.exec(color);
+    if (!match)
+        return color.toLowerCase();
+    return `#${match
+        .slice(1, 4)
+        .map((channel) => Number(channel).toString(16).padStart(2, '0'))
+        .join('')}`;
+}
+/** The selected range, when it lies in `editor`. */
+function getEditorRange(editor) {
+    const selection = document.getSelection();
+    if (!selection || !selection.rangeCount)
+        return null;
+    const range = selection.getRangeAt(0);
+    return editor.contains(range.commonAncestorContainer)
+        ? range.cloneRange()
+        : null;
+}
+/** Selects `range` again (after the focus left the editor). */
+function restoreRange(range) {
+    const selection = document.getSelection();
+    if (!range || !selection)
+        return;
+    selection.removeAllRanges();
+    selection.addRange(range);
+}
+/** The formats at `range` in `editor`. */
+function getRichTextState(editor, range) {
+    if (!range)
+        return exports.EMPTY_RICH_TEXT_STATE;
+    const toggles = {};
+    for (const [item, command] of Object.entries(EXEC_COMMANDS)) {
+        toggles[item] = queryCommandState(command);
+    }
+    toggles.code = !!closestInEditor(editor, range, 'code');
+    toggles.blockquote = !!closestInEditor(editor, range, 'blockquote');
+    const heading = closestInEditor(editor, range, HEADING_SELECTOR);
+    const color = (kind) => {
+        const element = findColorElement(editor, range, kind);
+        return element ? toHexColor(colorOf(element, kind)) : null;
+    };
+    return {
+        ...exports.EMPTY_RICH_TEXT_STATE,
+        toggles,
+        link: !!closestInEditor(editor, range, 'a'),
+        heading: heading
+            ? heading.tagName.toLowerCase()
+            : null,
+        text_color: color('text_color'),
+        background_color: color('background_color'),
+    };
+}
+/** Whether two states press the same buttons. */
+function isSameRichTextState(a, b) {
+    return JSON.stringify(a) === JSON.stringify(b);
+}
+function toggle(editor, range, item) {
+    if (item === 'code') {
+        const code = closestInEditor(editor, range, 'code');
+        if (code)
+            unwrap(code);
+        else if (range && !range.collapsed)
+            execCommand('insertHTML', `<code>${(0, html_1.escapeHtml)(range.toString())}</code>`);
+        return;
+    }
+    if (item === 'blockquote') {
+        const quote = closestInEditor(editor, range, 'blockquote');
+        if (quote)
+            liftBlock(quote);
+        else
+            execCommand('formatBlock', 'blockquote');
+        return;
+    }
+    const exec = EXEC_COMMANDS[item];
+    if (exec)
+        execCommand(exec);
+}
+/**
+ * Runs `command` on the selection of `editor`. Formats the browser has a
+ * command for go through `document.execCommand`, links and images are
+ * inserted as escaped HTML; removing code, quotes, links and colours edits
+ * the DOM directly. Choosing the active heading again turns it back into a paragraph,
+ * as in `ngx-editor`.
+ */
+function applyRichTextCommand(editor, range, command) {
+    switch (command.type) {
+        case 'toggle':
+            toggle(editor, range, command.item);
+            return;
+        case 'heading': {
+            const active = closestInEditor(editor, range, HEADING_SELECTOR);
+            execCommand('formatBlock', active?.tagName.toLowerCase() === command.level ? 'p' : command.level);
+            return;
+        }
+        case 'link': {
+            const href = (0, html_1.escapeHtml)(command.href);
+            const target = command.openInNewTab ? '_blank' : '_self';
+            execCommand('insertHTML', `<a href="${href}" title="${href}" target="${target}">${(0, html_1.escapeHtml)(command.text)}</a>`);
+            return;
+        }
+        case 'unlink': {
+            const link = closestInEditor(editor, range, 'a');
+            if (link)
+                unwrap(link);
+            return;
+        }
+        case 'image':
+            execCommand('insertHTML', `<img src="${(0, html_1.escapeHtml)(command.src)}" alt="${(0, html_1.escapeHtml)(command.alt)}" title="${(0, html_1.escapeHtml)(command.title)}">`);
+            return;
+        case 'color':
+            if (command.kind === 'text_color') {
+                execCommand('foreColor', command.color);
+            }
+            else if (!execCommand('hiliteColor', command.color)) {
+                execCommand('backColor', command.color);
+            }
+            return;
+        case 'removeColor': {
+            const element = findColorElement(editor, range, command.kind);
+            if (element)
+                removeColor(element, command.kind);
+            return;
+        }
+    }
+}
+//# sourceMappingURL=rich-text-commands.js.map

package/src/lib/components/input/long-text/rich-text-commands.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rich-text-commands.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/input/long-text/rich-text-commands.ts"],"names":[],"mappings":"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"}

package/src/lib/components/input/long-text/rich-text-editor.d.ts

@@ -0,0 +1,22 @@
+import { SmartRichTextToolbar } from './rich-text-toolbar';
+export interface SmartRichTextEditorProps {
+    /** The HTML to edit; rendered sanitised when it does not come from here. */
+    value?: string | null;
+    placeholder?: string;
+    disabled?: boolean;
+    /** The menu; the menu of the Angular long-text field by default. */
+    toolbar?: SmartRichTextToolbar;
+    /** The id of the element labelling the editor. */
+    labelledBy?: string;
+    /** Called with the HTML of the content after every change. */
+    onChange?: (html: string) => void;
+    onBlur?: () => void;
+}
+/**
+ * A dependency-free rich-text editor: a menu bar over a `contentEditable`
+ * element whose HTML is the value. It stands in for the `ngx-editor` menu and
+ * editor the Angular `InputLongTextComponent` rendered; the menu runs its
+ * commands through `document.execCommand` on the last selection made in the
+ * editor.
+ */
+export declare function SmartRichTextEditor({ value, placeholder, disabled, toolbar, labelledBy, onChange, onBlur, }: SmartRichTextEditorProps): import("react/jsx-runtime").JSX.Element;