@smartsoft001/react 0.0.0-stage → 2.193.0

package/src/lib/components/feed/preset/feed-preset.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartFeedPreset = SmartFeedPreset;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const class_names_1 = require("../../../utils/class-names");
+const preset_classes_1 = require("./preset-classes");
+/** First letter of the author name, used for the comment initials fallback. */
+function initial(name) {
+    return (name?.trim().charAt(0) ?? '').toUpperCase();
+}
+/**
+ * Styled feed / timeline variation (preset). Register it as `components.feed`
+ * on `SmartProvider` to restyle every `<SmartFeed>`, or render it directly.
+ *
+ * Renders the Preline timeline look in vanilla Tailwind: a vertical rail with
+ * per-event markers (icon template > avatar image > dot), a side timestamp
+ * column, the event title (link when `href` is set), description, and nested
+ * comments shown as Preline author rows (avatar or initials fallback).
+ */
+function SmartFeedPreset({ options, className }) {
+    const title = options?.title;
+    const description = options?.description;
+    const events = options?.events ?? [];
+    const emptyTpl = options?.emptyTpl;
+    const commentSubmitTpl = options?.commentSubmitTpl;
+    const footerTpl = options?.footerTpl;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, class_names_1.cn)(preset_classes_1.FEED_ROOT, className), children: [title && ((0, jsx_runtime_1.jsx)("div", { className: preset_classes_1.FEED_HEADING_WRAP, children: (0, jsx_runtime_1.jsx)("h3", { className: preset_classes_1.FEED_HEADING_TEXT, children: title }) })), description && (0, jsx_runtime_1.jsx)("p", { className: preset_classes_1.FEED_DESCRIPTION, children: description }), events.length > 0
+                ? events.map((event, index) => ((0, jsx_runtime_1.jsxs)("div", { className: preset_classes_1.FEED_ITEM, "aria-label": event.ariaLabel ?? undefined, children: [event.timestamp && ((0, jsx_runtime_1.jsx)("div", { className: preset_classes_1.FEED_TIMESTAMP_SIDE, children: (0, jsx_runtime_1.jsx)("span", { className: preset_classes_1.FEED_TIMESTAMP_TEXT, children: event.timestamp }) })), (0, jsx_runtime_1.jsx)("div", { className: preset_classes_1.FEED_MARKER_RAIL, children: (0, jsx_runtime_1.jsx)("div", { className: preset_classes_1.FEED_MARKER_INNER, children: event.iconTpl ? (event.iconTpl) : event.avatarUrl ? ((0, jsx_runtime_1.jsx)("img", { className: preset_classes_1.FEED_AVATAR, src: event.avatarUrl, alt: "" })) : ((0, jsx_runtime_1.jsx)("span", { className: preset_classes_1.FEED_DOT, "aria-hidden": "true" })) }) }), (0, jsx_runtime_1.jsxs)("div", { className: preset_classes_1.FEED_BODY, children: [event.href ? ((0, jsx_runtime_1.jsx)("a", { className: preset_classes_1.FEED_EVENT_TITLE_LINK, href: event.href, children: event.title })) : ((0, jsx_runtime_1.jsx)("h3", { className: preset_classes_1.FEED_EVENT_TITLE, children: event.title })), event.description && ((0, jsx_runtime_1.jsx)("p", { className: preset_classes_1.FEED_EVENT_DESCRIPTION, children: event.description })), event.comments?.map((comment, commentIndex) => ((0, jsx_runtime_1.jsxs)("div", { className: "smart:flex smart:flex-col", children: [(0, jsx_runtime_1.jsxs)("button", { type: "button", className: preset_classes_1.FEED_COMMENT_BUTTON, children: [comment.authorAvatarUrl ? ((0, jsx_runtime_1.jsx)("img", { className: preset_classes_1.FEED_COMMENT_AVATAR, src: comment.authorAvatarUrl, alt: "" })) : ((0, jsx_runtime_1.jsx)("span", { className: preset_classes_1.FEED_COMMENT_INITIALS, children: initial(comment.authorName) })), comment.authorName, comment.timestamp && ((0, jsx_runtime_1.jsx)("time", { className: preset_classes_1.FEED_COMMENT_TIME, children: comment.timestamp }))] }), (0, jsx_runtime_1.jsx)("p", { className: preset_classes_1.FEED_COMMENT_CONTENT, children: comment.content })] }, comment.id ?? commentIndex)))] })] }, event.id ?? index)))
+                : emptyTpl && (0, jsx_runtime_1.jsx)("div", { className: preset_classes_1.FEED_EMPTY, children: emptyTpl }), commentSubmitTpl && ((0, jsx_runtime_1.jsx)("div", { className: preset_classes_1.FEED_COMMENT_SUBMIT, children: commentSubmitTpl })), footerTpl && (0, jsx_runtime_1.jsx)("div", { className: preset_classes_1.FEED_FOOTER, children: footerTpl })] }));
+}
+//# sourceMappingURL=feed-preset.js.map

package/src/lib/components/feed/preset/feed-preset.js.map

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

package/src/lib/components/feed/preset/preset-classes.d.ts

@@ -0,0 +1,51 @@
+import { SmartFeedVariant } from '../../../models';
+export type SmartFeedPresetVariant = SmartFeedVariant;
+/** Root timeline wrapper. */
+export declare const FEED_ROOT = "smart:w-full";
+/** Wrapper around a date / section heading (`first:mt-0` collapses the top gap). */
+export declare const FEED_HEADING_WRAP = "smart:ps-2 smart:my-2 smart:first:mt-0";
+/** Date / section heading text. */
+export declare const FEED_HEADING_TEXT = "smart:text-xs smart:font-medium smart:uppercase smart:text-gray-500 smart:dark:text-gray-400";
+/** Feed-level description (under the title). */
+export declare const FEED_DESCRIPTION = "smart:mt-1 smart:text-sm smart:text-gray-500 smart:dark:text-gray-400";
+/** A single timeline row. */
+export declare const FEED_ITEM = "smart:flex smart:gap-x-3";
+/** Left-hand side timestamp column. */
+export declare const FEED_TIMESTAMP_SIDE = "smart:min-w-14 smart:text-end";
+/** Side timestamp text. */
+export declare const FEED_TIMESTAMP_TEXT = "smart:text-xs smart:text-gray-500 smart:dark:text-gray-400";
+/**
+ * Marker rail: holds the icon/dot and draws the connecting vertical line via the
+ * `after:` pseudo-element (hidden on the last item).
+ */
+export declare const FEED_MARKER_RAIL: string;
+/** Inner circle that centers the marker content. */
+export declare const FEED_MARKER_INNER = "smart:relative smart:z-10 smart:size-7 smart:flex smart:justify-center smart:items-center";
+/** Default dot marker. */
+export declare const FEED_DOT = "smart:size-2 smart:rounded-full smart:bg-gray-400 smart:dark:bg-gray-500";
+/** Avatar marker image. */
+export declare const FEED_AVATAR = "smart:shrink-0 smart:size-7 smart:rounded-full";
+/** Right-hand content column. */
+export declare const FEED_BODY = "smart:grow smart:pt-0.5 smart:pb-8";
+/** Event title (plain). */
+export declare const FEED_EVENT_TITLE = "smart:flex smart:gap-x-1.5 smart:font-medium smart:text-gray-900 smart:dark:text-white";
+/** Event title rendered as a link. */
+export declare const FEED_EVENT_TITLE_LINK = "smart:flex smart:gap-x-1.5 smart:font-medium smart:text-gray-900 smart:dark:text-white smart:hover:underline smart:focus:outline-none smart:focus:underline";
+/** Event description. */
+export declare const FEED_EVENT_DESCRIPTION = "smart:mt-1 smart:text-sm smart:text-gray-500 smart:dark:text-gray-400";
+/** Comment author button (avatar/initials + name). */
+export declare const FEED_COMMENT_BUTTON: string;
+/** Comment author avatar image. */
+export declare const FEED_COMMENT_AVATAR = "smart:shrink-0 smart:size-4 smart:rounded-full";
+/** Comment author initials fallback. */
+export declare const FEED_COMMENT_INITIALS: string;
+/** Comment body text. */
+export declare const FEED_COMMENT_CONTENT = "smart:mt-1 smart:text-sm smart:text-gray-500 smart:dark:text-gray-400";
+/** Comment timestamp. */
+export declare const FEED_COMMENT_TIME = "smart:ms-1 smart:text-xs smart:text-gray-400 smart:dark:text-gray-500";
+/** Empty-state wrapper. */
+export declare const FEED_EMPTY = "smart:py-4 smart:text-sm smart:text-gray-500 smart:dark:text-gray-400";
+/** Comment-submit slot wrapper. */
+export declare const FEED_COMMENT_SUBMIT = "smart:mt-4";
+/** Footer slot wrapper. */
+export declare const FEED_FOOTER = "smart:mt-4";

package/src/lib/components/feed/preset/preset-classes.js

@@ -0,0 +1,99 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FEED_FOOTER = exports.FEED_COMMENT_SUBMIT = exports.FEED_EMPTY = exports.FEED_COMMENT_TIME = exports.FEED_COMMENT_CONTENT = exports.FEED_COMMENT_INITIALS = exports.FEED_COMMENT_AVATAR = exports.FEED_COMMENT_BUTTON = exports.FEED_EVENT_DESCRIPTION = exports.FEED_EVENT_TITLE_LINK = exports.FEED_EVENT_TITLE = exports.FEED_BODY = exports.FEED_AVATAR = exports.FEED_DOT = exports.FEED_MARKER_INNER = exports.FEED_MARKER_RAIL = exports.FEED_TIMESTAMP_TEXT = exports.FEED_TIMESTAMP_SIDE = exports.FEED_ITEM = exports.FEED_DESCRIPTION = exports.FEED_HEADING_TEXT = exports.FEED_HEADING_WRAP = exports.FEED_ROOT = void 0;
+/** Root timeline wrapper. */
+exports.FEED_ROOT = 'smart:w-full';
+/** Wrapper around a date / section heading (`first:mt-0` collapses the top gap). */
+exports.FEED_HEADING_WRAP = 'smart:ps-2 smart:my-2 smart:first:mt-0';
+/** Date / section heading text. */
+exports.FEED_HEADING_TEXT = 'smart:text-xs smart:font-medium smart:uppercase smart:text-gray-500 smart:dark:text-gray-400';
+/** Feed-level description (under the title). */
+exports.FEED_DESCRIPTION = 'smart:mt-1 smart:text-sm smart:text-gray-500 smart:dark:text-gray-400';
+/** A single timeline row. */
+exports.FEED_ITEM = 'smart:flex smart:gap-x-3';
+/** Left-hand side timestamp column. */
+exports.FEED_TIMESTAMP_SIDE = 'smart:min-w-14 smart:text-end';
+/** Side timestamp text. */
+exports.FEED_TIMESTAMP_TEXT = 'smart:text-xs smart:text-gray-500 smart:dark:text-gray-400';
+/**
+ * Marker rail: holds the icon/dot and draws the connecting vertical line via the
+ * `after:` pseudo-element (hidden on the last item).
+ */
+exports.FEED_MARKER_RAIL = [
+    'smart:relative',
+    'smart:last:after:hidden',
+    'smart:after:absolute',
+    'smart:after:top-7',
+    'smart:after:bottom-0',
+    'smart:after:start-3.5',
+    'smart:after:-translate-x-[0.5px]',
+    'smart:after:border-s',
+    'smart:after:border-gray-200',
+    'smart:dark:after:border-gray-700',
+].join(' ');
+/** Inner circle that centers the marker content. */
+exports.FEED_MARKER_INNER = 'smart:relative smart:z-10 smart:size-7 smart:flex smart:justify-center smart:items-center';
+/** Default dot marker. */
+exports.FEED_DOT = 'smart:size-2 smart:rounded-full smart:bg-gray-400 smart:dark:bg-gray-500';
+/** Avatar marker image. */
+exports.FEED_AVATAR = 'smart:shrink-0 smart:size-7 smart:rounded-full';
+/** Right-hand content column. */
+exports.FEED_BODY = 'smart:grow smart:pt-0.5 smart:pb-8';
+/** Event title (plain). */
+exports.FEED_EVENT_TITLE = 'smart:flex smart:gap-x-1.5 smart:font-medium smart:text-gray-900 smart:dark:text-white';
+/** Event title rendered as a link. */
+exports.FEED_EVENT_TITLE_LINK = `${exports.FEED_EVENT_TITLE} smart:hover:underline smart:focus:outline-none smart:focus:underline`;
+/** Event description. */
+exports.FEED_EVENT_DESCRIPTION = 'smart:mt-1 smart:text-sm smart:text-gray-500 smart:dark:text-gray-400';
+/** Comment author button (avatar/initials + name). */
+exports.FEED_COMMENT_BUTTON = [
+    'smart:mt-1',
+    'smart:-ms-1',
+    'smart:p-1',
+    'smart:inline-flex',
+    'smart:items-center',
+    'smart:gap-x-2',
+    'smart:text-xs',
+    'smart:rounded-lg',
+    'smart:text-gray-500',
+    'smart:dark:text-gray-400',
+    'smart:hover:bg-gray-100',
+    'smart:dark:hover:bg-gray-700',
+    'smart:focus:outline-none',
+    'smart:focus:bg-gray-100',
+    'smart:dark:focus:bg-gray-700',
+    'smart:disabled:opacity-50',
+    'smart:disabled:pointer-events-none',
+].join(' ');
+/** Comment author avatar image. */
+exports.FEED_COMMENT_AVATAR = 'smart:shrink-0 smart:size-4 smart:rounded-full';
+/** Comment author initials fallback. */
+exports.FEED_COMMENT_INITIALS = [
+    'smart:flex',
+    'smart:shrink-0',
+    'smart:justify-center',
+    'smart:items-center',
+    'smart:size-4',
+    'smart:bg-white',
+    'smart:dark:bg-gray-800',
+    'smart:border',
+    'smart:border-gray-200',
+    'smart:dark:border-gray-700',
+    'smart:text-[10px]',
+    'smart:font-medium',
+    'smart:uppercase',
+    'smart:text-gray-800',
+    'smart:dark:text-gray-200',
+    'smart:rounded-full',
+].join(' ');
+/** Comment body text. */
+exports.FEED_COMMENT_CONTENT = 'smart:mt-1 smart:text-sm smart:text-gray-500 smart:dark:text-gray-400';
+/** Comment timestamp. */
+exports.FEED_COMMENT_TIME = 'smart:ms-1 smart:text-xs smart:text-gray-400 smart:dark:text-gray-500';
+/** Empty-state wrapper. */
+exports.FEED_EMPTY = 'smart:py-4 smart:text-sm smart:text-gray-500 smart:dark:text-gray-400';
+/** Comment-submit slot wrapper. */
+exports.FEED_COMMENT_SUBMIT = 'smart:mt-4';
+/** Footer slot wrapper. */
+exports.FEED_FOOTER = 'smart:mt-4';
+//# sourceMappingURL=preset-classes.js.map

package/src/lib/components/feed/preset/preset-classes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preset-classes.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/feed/preset/preset-classes.ts"],"names":[],"mappings":";;;AAIA,6BAA6B;AAChB,QAAA,SAAS,GAAG,cAAc,CAAC;AAExC,oFAAoF;AACvE,QAAA,iBAAiB,GAAG,wCAAwC,CAAC;AAE1E,mCAAmC;AACtB,QAAA,iBAAiB,GAC5B,8FAA8F,CAAC;AAEjG,gDAAgD;AACnC,QAAA,gBAAgB,GAC3B,uEAAuE,CAAC;AAE1E,6BAA6B;AAChB,QAAA,SAAS,GAAG,0BAA0B,CAAC;AAEpD,uCAAuC;AAC1B,QAAA,mBAAmB,GAAG,+BAA+B,CAAC;AAEnE,2BAA2B;AACd,QAAA,mBAAmB,GAC9B,4DAA4D,CAAC;AAE/D;;;GAGG;AACU,QAAA,gBAAgB,GAAG;IAC9B,gBAAgB;IAChB,yBAAyB;IACzB,sBAAsB;IACtB,mBAAmB;IACnB,sBAAsB;IACtB,uBAAuB;IACvB,kCAAkC;IAClC,sBAAsB;IACtB,6BAA6B;IAC7B,kCAAkC;CACnC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAEZ,oDAAoD;AACvC,QAAA,iBAAiB,GAC5B,2FAA2F,CAAC;AAE9F,0BAA0B;AACb,QAAA,QAAQ,GACnB,0EAA0E,CAAC;AAE7E,2BAA2B;AACd,QAAA,WAAW,GAAG,gDAAgD,CAAC;AAE5E,iCAAiC;AACpB,QAAA,SAAS,GAAG,oCAAoC,CAAC;AAE9D,2BAA2B;AACd,QAAA,gBAAgB,GAC3B,wFAAwF,CAAC;AAE3F,sCAAsC;AACzB,QAAA,qBAAqB,GAAG,GAAG,wBAAgB,uEAAuE,CAAC;AAEhI,yBAAyB;AACZ,QAAA,sBAAsB,GACjC,uEAAuE,CAAC;AAE1E,sDAAsD;AACzC,QAAA,mBAAmB,GAAG;IACjC,YAAY;IACZ,aAAa;IACb,WAAW;IACX,mBAAmB;IACnB,oBAAoB;IACpB,eAAe;IACf,eAAe;IACf,kBAAkB;IAClB,qBAAqB;IACrB,0BAA0B;IAC1B,yBAAyB;IACzB,8BAA8B;IAC9B,0BAA0B;IAC1B,yBAAyB;IACzB,8BAA8B;IAC9B,2BAA2B;IAC3B,oCAAoC;CACrC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAEZ,mCAAmC;AACtB,QAAA,mBAAmB,GAC9B,gDAAgD,CAAC;AAEnD,wCAAwC;AAC3B,QAAA,qBAAqB,GAAG;IACnC,YAAY;IACZ,gBAAgB;IAChB,sBAAsB;IACtB,oBAAoB;IACpB,cAAc;IACd,gBAAgB;IAChB,wBAAwB;IACxB,cAAc;IACd,uBAAuB;IACvB,4BAA4B;IAC5B,mBAAmB;IACnB,mBAAmB;IACnB,iBAAiB;IACjB,qBAAqB;IACrB,0BAA0B;IAC1B,oBAAoB;CACrB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAEZ,yBAAyB;AACZ,QAAA,oBAAoB,GAC/B,uEAAuE,CAAC;AAE1E,yBAAyB;AACZ,QAAA,iBAAiB,GAC5B,uEAAuE,CAAC;AAE1E,2BAA2B;AACd,QAAA,UAAU,GACrB,uEAAuE,CAAC;AAE1E,mCAAmC;AACtB,QAAA,mBAAmB,GAAG,YAAY,CAAC;AAEhD,2BAA2B;AACd,QAAA,WAAW,GAAG,YAAY,CAAC"}

package/src/lib/components/feed/standard/feed-standard.d.ts

@@ -0,0 +1,8 @@
+import { SmartFeedProps } from '../feed.types';
+/**
+ * The default feed rendering (`<smart-feed-standard>`): an ordered list of
+ * events (icon template > avatar, timestamp, title as a link when `href` is
+ * set, description, nested comments), the `emptyTpl` when there are no events,
+ * then the `commentSubmitTpl` and `footerTpl` slots.
+ */
+export declare function SmartFeedStandard({ options, className }: SmartFeedProps): import("react/jsx-runtime").JSX.Element;

package/src/lib/components/feed/standard/feed-standard.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartFeedStandard = SmartFeedStandard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * The default feed rendering (`<smart-feed-standard>`): an ordered list of
+ * events (icon template > avatar, timestamp, title as a link when `href` is
+ * set, description, nested comments), the `emptyTpl` when there are no events,
+ * then the `commentSubmitTpl` and `footerTpl` slots.
+ */
+function SmartFeedStandard({ options, className }) {
+    const events = options?.events ?? [];
+    return ((0, jsx_runtime_1.jsx)("div", { className: className, children: (0, jsx_runtime_1.jsxs)("div", { className: "feed", children: [options?.title && (0, jsx_runtime_1.jsx)("h3", { className: "title", children: options.title }), options?.description && ((0, jsx_runtime_1.jsx)("p", { className: "description", children: options.description })), events.length > 0 ? ((0, jsx_runtime_1.jsx)("ol", { role: "list", children: events.map((event, index) => ((0, jsx_runtime_1.jsxs)("li", { className: "event", "aria-label": event.ariaLabel ?? undefined, children: [event.iconTpl ? ((0, jsx_runtime_1.jsx)("span", { className: "icon", children: event.iconTpl })) : event.avatarUrl ? ((0, jsx_runtime_1.jsx)("img", { className: "avatar", src: event.avatarUrl, alt: "" })) : null, (0, jsx_runtime_1.jsxs)("div", { className: "body", children: [event.timestamp && ((0, jsx_runtime_1.jsx)("time", { className: "timestamp", children: event.timestamp })), event.href ? ((0, jsx_runtime_1.jsx)("a", { className: "title", href: event.href, children: event.title })) : ((0, jsx_runtime_1.jsx)("span", { className: "title", children: event.title })), event.description && ((0, jsx_runtime_1.jsx)("p", { className: "description", children: event.description })), (event.comments ?? []).length > 0 && ((0, jsx_runtime_1.jsx)("ul", { className: "comments", role: "list", children: event.comments?.map((comment, commentIndex) => ((0, jsx_runtime_1.jsxs)("li", { className: "comment", children: [comment.authorAvatarUrl && ((0, jsx_runtime_1.jsx)("img", { className: "avatar", src: comment.authorAvatarUrl, alt: "" })), (0, jsx_runtime_1.jsx)("span", { className: "author", children: comment.authorName }), comment.timestamp && ((0, jsx_runtime_1.jsx)("time", { className: "timestamp", children: comment.timestamp })), (0, jsx_runtime_1.jsx)("p", { className: "content", children: comment.content })] }, comment.id ?? commentIndex))) }))] })] }, event.id ?? index))) })) : (options?.emptyTpl && (0, jsx_runtime_1.jsx)("div", { className: "empty", children: options.emptyTpl })), options?.commentSubmitTpl && ((0, jsx_runtime_1.jsx)("div", { className: "comment-submit", children: options.commentSubmitTpl })), options?.footerTpl && ((0, jsx_runtime_1.jsx)("div", { className: "footer", children: options.footerTpl }))] }) }));
+}
+//# sourceMappingURL=feed-standard.js.map

package/src/lib/components/feed/standard/feed-standard.js.map

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

package/src/lib/components/form/form.d.ts

@@ -0,0 +1,19 @@
+import { SmartFormProps } from './form.types';
+/**
+ * `<smart-form>`: the form of `options.model`, built by the form factory for
+ * `options.mode` (`'create'` by default) with `options.uniqueProvider`, or
+ * `options.control` when given. Renders the body registered as
+ * `components.form` on `SmartProvider` (the Angular
+ * `FORM_STANDARD_COMPONENT_TOKEN`), `SmartFormStandard` by default.
+ *
+ * Submitting the form or pressing Enter in one of its single-line inputs
+ * emits `onInvokeSubmit` with the form value, once. `options.treeLevel` defaults to 1 and is set as the
+ * `tree-level` / `data-tree-level` attribute of the root element. A form
+ * rendered inside another one (an `object` or `array` field) renders a
+ * `<div>` instead of a nested `<form>`; Enter in its inputs submits the
+ * outer form.
+ *
+ * The export / import buttons of the Angular template are commented out
+ * there and not ported.
+ */
+export declare function SmartForm<T>(props: SmartFormProps<T>): import("react/jsx-runtime").JSX.Element | null;

package/src/lib/components/form/form.js

@@ -0,0 +1,137 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartForm = SmartForm;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const form_standard_1 = require("./standard/form-standard");
+const use_model_form_1 = require("../../factories/form/use-model-form");
+const hooks_1 = require("../../providers/hooks");
+const SINGLE_LINE_INPUT_TYPES = new Set([
+    'text',
+    'email',
+    'number',
+    'password',
+    'search',
+    'tel',
+    'url',
+    'date',
+    'datetime-local',
+    'month',
+    'time',
+    'week',
+]);
+/** True for an `<input>` where Enter has no meaning of its own. */
+function isSingleLineInput(target) {
+    return (target instanceof HTMLInputElement &&
+        SINGLE_LINE_INPUT_TYPES.has(target.type));
+}
+/**
+ * Set inside a `SmartForm`, so a form nested in it (an `object` or `array`
+ * field) does not render a `<form>` inside a `<form>`, which HTML forbids.
+ */
+const SmartFormNestingContext = (0, react_1.createContext)(false);
+/**
+ * The Angular `registerChanges`: after every change of `form` emits its
+ * validity, its value and the values of its dirty controls (`*Confirm` left
+ * out), then runs one update so the current state is emitted at once. Only the
+ * form currently rendered emits; the callbacks of the latest render are used.
+ */
+function useRegisterChanges(form, outputs) {
+    const latest = (0, react_1.useRef)(outputs);
+    (0, react_1.useEffect)(() => {
+        latest.current = outputs;
+    });
+    (0, react_1.useEffect)(() => {
+        if (!form)
+            return undefined;
+        const subscription = form.valueChanges.subscribe(() => {
+            latest.current.onValidChange?.(form.valid);
+            latest.current.onValueChange?.(form.value);
+            const partialModel = {};
+            Object.keys(form.controls)
+                .filter((key) => !key.endsWith('Confirm') && form.controls[key].dirty)
+                .forEach((key) => {
+                partialModel[key] = form.controls[key].value;
+            });
+            latest.current.onValuePartialChange?.(partialModel);
+        });
+        form.updateValueAndValidity();
+        return () => subscription.unsubscribe();
+    }, [form]);
+}
+/**
+ * The Angular `loading$` subscription: the form is disabled while `loading`
+ * is `true` and enabled again once it is `false`. Without `loading` the form
+ * is left alone.
+ */
+function useLoading(form, loading) {
+    (0, react_1.useEffect)(() => {
+        if (!form || loading === undefined)
+            return;
+        if (loading)
+            form.disable();
+        else if (form.disabled)
+            form.enable();
+    }, [form, loading]);
+}
+/**
+ * `<smart-form>`: the form of `options.model`, built by the form factory for
+ * `options.mode` (`'create'` by default) with `options.uniqueProvider`, or
+ * `options.control` when given. Renders the body registered as
+ * `components.form` on `SmartProvider` (the Angular
+ * `FORM_STANDARD_COMPONENT_TOKEN`), `SmartFormStandard` by default.
+ *
+ * Submitting the form or pressing Enter in one of its single-line inputs
+ * emits `onInvokeSubmit` with the form value, once. `options.treeLevel` defaults to 1 and is set as the
+ * `tree-level` / `data-tree-level` attribute of the root element. A form
+ * rendered inside another one (an `object` or `array` field) renders a
+ * `<div>` instead of a nested `<form>`; Enter in its inputs submits the
+ * outer form.
+ *
+ * The export / import buttons of the Angular template are commented out
+ * there and not ported.
+ */
+function SmartForm(props) {
+    const { options, className, onInvokeSubmit, onValueChange, onValuePartialChange, onValidChange, } = props;
+    const control = options.control;
+    const built = (0, use_model_form_1.useModelForm)(options.model, {
+        mode: options.mode ?? 'create',
+        uniqueProvider: options.uniqueProvider,
+        control,
+    });
+    const form = control ?? built;
+    const nested = (0, react_1.useContext)(SmartFormNestingContext);
+    const Component = (0, hooks_1.useSmartComponent)('form', form_standard_1.SmartFormStandard);
+    // The Angular wrapper set `options.treeLevel = 1` when it was not given.
+    const bodyOptions = (0, react_1.useMemo)(() => (options.treeLevel ? options : { ...options, treeLevel: 1 }), [options]);
+    const treeLevel = bodyOptions.treeLevel;
+    useRegisterChanges(form, {
+        onValueChange,
+        onValuePartialChange,
+        onValidChange,
+    });
+    useLoading(form, options.loading);
+    if (!form)
+        return null;
+    const onSubmit = (event) => {
+        event.preventDefault();
+        onInvokeSubmit?.(form.value);
+    };
+    // Angular submitted on `keyup.enter` anywhere in the form. Here Enter in a
+    // single-line input submits once, on keydown, and stops the browser's own
+    // implicit submission, which would submit a second time. Enter keeps its
+    // meaning in a textarea, a rich-text editor, a button or a select.
+    const onKeyDown = (event) => {
+        if (event.key !== 'Enter' || !isSingleLineInput(event.target))
+            return;
+        event.preventDefault();
+        onInvokeSubmit?.(form.value);
+    };
+    const body = ((0, jsx_runtime_1.jsx)(SmartFormNestingContext.Provider, { value: true, children: (0, jsx_runtime_1.jsx)(Component, { options: bodyOptions, form: form, className: className, onInvokeSubmit: onInvokeSubmit }) }));
+    // A nested form leaves Enter to the form around it.
+    if (nested) {
+        return ((0, jsx_runtime_1.jsx)("div", { "tree-level": treeLevel, "data-tree-level": treeLevel, children: body }));
+    }
+    return ((0, jsx_runtime_1.jsx)("form", { "tree-level": treeLevel, "data-tree-level": treeLevel, onSubmit: onSubmit, onKeyDown: onKeyDown, children: body }));
+}
+//# sourceMappingURL=form.js.map

package/src/lib/components/form/form.js.map

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

package/src/lib/components/form/form.types.d.ts

@@ -0,0 +1,26 @@
+import { SmartFormGroup } from '../../forms/form-group';
+import { IFormOptions } from '../../models';
+/** The props of `<SmartForm>` (`<smart-form>`). */
+export interface SmartFormProps<T = any> {
+    options: IFormOptions<T>;
+    className?: string;
+    /** The form value, on submit or Enter (`invokeSubmit`). */
+    onInvokeSubmit?: (value: any) => void;
+    /** The form value after every change (`valueChange`). */
+    onValueChange?: (value: T) => void;
+    /** The dirty controls' values, `*Confirm` left out (`valuePartialChange`). */
+    onValuePartialChange?: (value: Partial<T>) => void;
+    /** The form validity after every change (`validChange`). */
+    onValidChange?: (valid: boolean) => void;
+}
+/**
+ * The props of a form body: `SmartFormStandard`, `SmartFormPreset` or an
+ * implementation registered as `components.form` (the inputs and the output
+ * of the Angular `FormBaseComponent`).
+ */
+export interface SmartFormBaseProps<T = any> {
+    form: SmartFormGroup;
+    options: IFormOptions<T>;
+    className?: string;
+    onInvokeSubmit?: (value: any) => void;
+}

package/src/lib/components/form/form.types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=form.types.js.map

package/src/lib/components/form/form.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form.types.js","sourceRoot":"","sources":["../../../../../../../../packages/shared/react/src/lib/components/form/form.types.ts"],"names":[],"mappings":""}

package/src/lib/components/form/index.d.ts

@@ -0,0 +1,6 @@
+export * from './form';
+export * from './form.types';
+export * from './preset/form-preset';
+export * from './preset/preset-classes';
+export * from './standard/form-standard';
+export * from './use-form-base';

package/src/lib/components/form/index.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./form"), exports);
+tslib_1.__exportStar(require("./form.types"), exports);
+tslib_1.__exportStar(require("./preset/form-preset"), exports);
+tslib_1.__exportStar(require("./preset/preset-classes"), exports);
+tslib_1.__exportStar(require("./standard/form-standard"), exports);
+tslib_1.__exportStar(require("./use-form-base"), exports);
+//# sourceMappingURL=index.js.map

package/src/lib/components/form/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../packages/shared/react/src/lib/components/form/index.ts"],"names":[],"mappings":";;;AAAA,iDAAuB;AACvB,uDAA6B;AAC7B,+DAAqC;AACrC,kEAAwC;AACxC,mEAAyC;AACzC,0DAAgC"}

package/src/lib/components/form/preset/form-preset.d.ts

@@ -0,0 +1,14 @@
+import { SmartFormBaseProps } from '../form.types';
+/**
+ * Styled form variation (preset), `<smart-form-preset>`.
+ *
+ * A minimal restyle of `SmartFormStandard`: the field iteration and every
+ * behaviour of `useFormBase` are reused unchanged — only the shell is
+ * re-spaced. The form root gets a vertical rhythm and each field row a
+ * `data-role="field"` wrapper. Field *internals* are left to the input
+ * presets; register them as `inputFieldComponents` on `SmartProvider`.
+ *
+ * Register it as `components.form` on `SmartProvider` to restyle every
+ * `<SmartForm>`, or render it directly.
+ */
+export declare function SmartFormPreset<T>(props: SmartFormBaseProps<T>): import("react/jsx-runtime").JSX.Element;

package/src/lib/components/form/preset/form-preset.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartFormPreset = SmartFormPreset;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const preset_classes_1 = require("./preset-classes");
+const class_names_1 = require("../../../utils/class-names");
+const input_1 = require("../../input/input");
+const use_form_base_1 = require("../use-form-base");
+/**
+ * Styled form variation (preset), `<smart-form-preset>`.
+ *
+ * A minimal restyle of `SmartFormStandard`: the field iteration and every
+ * behaviour of `useFormBase` are reused unchanged — only the shell is
+ * re-spaced. The form root gets a vertical rhythm and each field row a
+ * `data-role="field"` wrapper. Field *internals* are left to the input
+ * presets; register them as `inputFieldComponents` on `SmartProvider`.
+ *
+ * Register it as `components.form` on `SmartProvider` to restyle every
+ * `<SmartForm>`, or render it directly.
+ */
+function SmartFormPreset(props) {
+    const { className } = props;
+    const { fields, model, mode, possibilities, inputComponents, treeLevel, getControl, } = (0, use_form_base_1.useFormBase)(props);
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, class_names_1.cn)((0, preset_classes_1.getFormShellClasses)(), className), "data-role": "form", children: fields.map((field) => {
+            const control = getControl(field);
+            if (!control || control.smartDisabled)
+                return null;
+            return ((0, jsx_runtime_1.jsx)("div", { className: (0, preset_classes_1.getFormFieldClasses)(), "data-role": "field", "data-key": field, children: (0, jsx_runtime_1.jsx)(input_1.SmartInput, { options: {
+                        treeLevel: treeLevel ?? 0,
+                        fieldKey: field,
+                        control,
+                        model,
+                        mode,
+                        possibilities: possibilities[field],
+                        component: inputComponents[field],
+                    } }) }, field));
+        }) }));
+}
+//# sourceMappingURL=form-preset.js.map

package/src/lib/components/form/preset/form-preset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-preset.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/form/preset/form-preset.tsx"],"names":[],"mappings":";;AAkBA,0CA0CC;;AA5DD,qDAA4E;AAC5E,4DAAgD;AAChD,6CAA+C;AAE/C,oDAA+C;AAE/C;;;;;;;;;;;GAWG;AACH,SAAgB,eAAe,CAAI,KAA4B;IAC7D,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC5B,MAAM,EACJ,MAAM,EACN,KAAK,EACL,IAAI,EACJ,aAAa,EACb,eAAe,EACf,SAAS,EACT,UAAU,GACX,GAAG,IAAA,2BAAW,EAAC,KAAK,CAAC,CAAC;IAEvB,OAAO,CACL,gCAAK,SAAS,EAAE,IAAA,gBAAE,EAAC,IAAA,oCAAmB,GAAE,EAAE,SAAS,CAAC,eAAY,MAAM,YACnE,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;YACpB,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;YAElC,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,aAAa;gBAAE,OAAO,IAAI,CAAC;YAEnD,OAAO,CACL,gCAEE,SAAS,EAAE,IAAA,oCAAmB,GAAE,eACtB,OAAO,cACP,KAAK,YAEf,uBAAC,kBAAU,IACT,OAAO,EAAE;wBACP,SAAS,EAAE,SAAS,IAAI,CAAC;wBACzB,QAAQ,EAAE,KAAK;wBACf,OAAO;wBACP,KAAK;wBACL,IAAI;wBACJ,aAAa,EAAE,aAAa,CAAC,KAAK,CAAC;wBACnC,SAAS,EAAE,eAAe,CAAC,KAAK,CAAC;qBAClC,GACD,IAfG,KAAK,CAgBN,CACP,CAAC;QACJ,CAAC,CAAC,GACE,CACP,CAAC;AACJ,CAAC"}

package/src/lib/components/form/preset/preset-classes.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Class recipes for the styled form variation (preset).
+ *
+ * The preset only restyles the form *shell* — the vertical rhythm of the form
+ * and the spacing around each field row. Field internals are rendered by
+ * `<SmartInput>` (and its own presets), so nothing here touches inputs.
+ */
+/** Vertical rhythm applied to the form root that wraps every field row. */
+export declare function getFormShellClasses(): string;
+/** Consistent spacing applied to each per-field wrapper. */
+export declare function getFormFieldClasses(): string;

package/src/lib/components/form/preset/preset-classes.js

@@ -0,0 +1,20 @@
+"use strict";
+/**
+ * Class recipes for the styled form variation (preset).
+ *
+ * The preset only restyles the form *shell* — the vertical rhythm of the form
+ * and the spacing around each field row. Field internals are rendered by
+ * `<SmartInput>` (and its own presets), so nothing here touches inputs.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getFormShellClasses = getFormShellClasses;
+exports.getFormFieldClasses = getFormFieldClasses;
+/** Vertical rhythm applied to the form root that wraps every field row. */
+function getFormShellClasses() {
+    return 'smart:space-y-5';
+}
+/** Consistent spacing applied to each per-field wrapper. */
+function getFormFieldClasses() {
+    return 'smart:space-y-1.5';
+}
+//# sourceMappingURL=preset-classes.js.map

package/src/lib/components/form/preset/preset-classes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preset-classes.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/form/preset/preset-classes.ts"],"names":[],"mappings":";AAAA;;;;;;GAMG;;AAGH,kDAEC;AAGD,kDAEC;AARD,2EAA2E;AAC3E,SAAgB,mBAAmB;IACjC,OAAO,iBAAiB,CAAC;AAC3B,CAAC;AAED,4DAA4D;AAC5D,SAAgB,mBAAmB;IACjC,OAAO,mBAAmB,CAAC;AAC7B,CAAC"}

package/src/lib/components/form/standard/form-standard.d.ts

@@ -0,0 +1,3 @@
+import { SmartFormBaseProps } from '../form.types';
+/** The default form body (`<smart-form-standard>`): one input per control. */
+export declare function SmartFormStandard<T>(props: SmartFormBaseProps<T>): import("react/jsx-runtime").JSX.Element;

package/src/lib/components/form/standard/form-standard.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartFormStandard = SmartFormStandard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const class_names_1 = require("../../../utils/class-names");
+const input_1 = require("../../input/input");
+const use_form_base_1 = require("../use-form-base");
+/** The default form body (`<smart-form-standard>`): one input per control. */
+function SmartFormStandard(props) {
+    const { className } = props;
+    const { fields, model, mode, possibilities, inputComponents, treeLevel, getControl, } = (0, use_form_base_1.useFormBase)(props);
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, class_names_1.cn)('smart:space-y-4 smart:divide-y smart:divide-gray-100 smart:dark:divide-white/10', className), children: fields.map((field) => {
+            const control = getControl(field);
+            if (!control || control.smartDisabled)
+                return null;
+            return ((0, jsx_runtime_1.jsx)("div", { className: "smart:py-2", children: (0, jsx_runtime_1.jsx)(input_1.SmartInput, { options: {
+                        treeLevel: treeLevel ?? 0,
+                        fieldKey: field,
+                        control,
+                        model,
+                        mode,
+                        possibilities: possibilities[field],
+                        component: inputComponents[field],
+                    } }) }, field));
+        }) }));
+}
+//# sourceMappingURL=form-standard.js.map

package/src/lib/components/form/standard/form-standard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-standard.js","sourceRoot":"","sources":["../../../../../../../../../packages/shared/react/src/lib/components/form/standard/form-standard.tsx"],"names":[],"mappings":";;AAMA,8CA0CC;;AAhDD,4DAAgD;AAChD,6CAA+C;AAE/C,oDAA+C;AAE/C,8EAA8E;AAC9E,SAAgB,iBAAiB,CAAI,KAA4B;IAC/D,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC5B,MAAM,EACJ,MAAM,EACN,KAAK,EACL,IAAI,EACJ,aAAa,EACb,eAAe,EACf,SAAS,EACT,UAAU,GACX,GAAG,IAAA,2BAAW,EAAC,KAAK,CAAC,CAAC;IAEvB,OAAO,CACL,gCACE,SAAS,EAAE,IAAA,gBAAE,EACX,iFAAiF,EACjF,SAAS,CACV,YAEA,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;YACpB,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;YAElC,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,aAAa;gBAAE,OAAO,IAAI,CAAC;YAEnD,OAAO,CACL,gCAAiB,SAAS,EAAC,YAAY,YACrC,uBAAC,kBAAU,IACT,OAAO,EAAE;wBACP,SAAS,EAAE,SAAS,IAAI,CAAC;wBACzB,QAAQ,EAAE,KAAK;wBACf,OAAO;wBACP,KAAK;wBACL,IAAI;wBACJ,aAAa,EAAE,aAAa,CAAC,KAAK,CAAC;wBACnC,SAAS,EAAE,eAAe,CAAC,KAAK,CAAC;qBAClC,GACD,IAXM,KAAK,CAYT,CACP,CAAC;QACJ,CAAC,CAAC,GACE,CACP,CAAC;AACJ,CAAC"}