@soxa-ui/setup 0.0.0-stage → 0.3.0-beta.1

package/dist/content/descriptors/components/select/select.descriptor.js

@@ -0,0 +1,267 @@
+import { defineComponent } from "../../../../protected/define/component.js";
+import { defineDescriptor } from "../../../../protected/define/descriptor.js";
+import { defineType } from "../../../../protected/define/prop-type.js";
+import { SelectKeyboardPluginDescriptor } from "../../plugins/select-keyboard.plugin.js";
+import { SelectEditablePluginDescriptor } from "../../plugins/select-editable.plugin.js";
+import { SelectPointerPluginDescriptor } from "../../plugins/select-pointer.plugin.js";
+import { SelectBackspacePluginDescriptor } from "../../plugins/select-backspace.plugin.js";
+import { SwipePluginDescriptor } from "../../plugins/swipe.plugin.js";
+import { DismissPluginDescriptor } from "../../plugins/dismiss.plugin.js";
+import { ActionPluginDescriptor } from "../../plugins/action.plugin.js";
+import { CollectionBundlesPluginDescriptor } from "../../plugins/collection-bundles.plugin.js";
+import { CollectionElementsPluginDescriptor } from "../../plugins/collection-elements.plugin.js";
+import { ListHeightPluginDescriptor } from "../../plugins/list-height.plugin.js";
+import { ListScrollPluginDescriptor } from "../../plugins/list-scroll.plugin.js";
+import { SelectIdsPluginDescriptor } from "../../plugins/select-ids.plugin.js";
+import { InputControlDescriptor } from "../input-control.descriptor.js";
+import { LIST_PROPS } from "../list.js";
+import { TSelect } from "@soxa-ui/core";
+import { TSelectKeyboardPlugin, fieldOf } from "@soxa-ui/plugins";
+//#region content/descriptors/components/select/select.descriptor.ts
+/**
+* Дескриптор Select (TSelect).
+*
+* Наследует InputControlDescriptor: value, name, readonly, required, плюс всё
+* от Control (disabled, focused, size, variant) и ComponentView. Добавляет
+* состояние панели, жест и плагины оверлея.
+*/
+var SelectDescriptor = defineDescriptor(() => defineComponent({
+	ctor: TSelect,
+	extends: InputControlDescriptor(),
+	contribution: {
+		/**
+		* `field` и `clear` отделены от `default` структурно, а не по вкусу:
+		* `default` кладётся внутрь `[role=listbox]`, и всё, что туда попадёт,
+		* скринридер сочтёт опцией. Поле и кнопка очистки живут снаружи панели.
+		*
+		* `empty` показывается вместо списка, когда опций нет: пустой `listbox`
+		* для скринридера — тупик, а сообщение хотя бы объясняет, что происходит.
+		*
+		* `field` отдаёт сам `field` — экземпляр `TInput`, единственный держатель
+		* текста, плейсхолдера и ARIA поля (тем же приёмом, что `:ctrl="field"` у
+		* встроенной разметки, см. `TSelect.field`, `TSelectExtension`). Второго
+		* пути к тем же данным больше нет: раньше слот отдавал `text`/`placeholder`
+		* отдельными пропами, а они дублировали то, что уже есть у `field`, и
+		* `placeholder` при этом расходился с ним — не учитывал теги.
+		*/
+		slots: {
+			field: {
+				scope: { field: defineType(Object) },
+				description: "Содержимое поля вместо встроенного Input"
+			},
+			/**
+			* Ряд тегов в поле, пока выбор множественный. Scope — инстанс тегов и
+			* его коллекция, те же, что встроенный `Tags` берёт `:ctrl` и
+			* `:engine`: связка «опция ⇄ тег» живёт в `TSelectTagsExtension`, и
+			* своя разметка ряда получает её готовой. Так ряд раскладывают
+			* иначе, чем `wrap` и `scroll`, — в ленту или с хвостом в панели, —
+			* не трогая Select.
+			*/
+			tags: {
+				scope: {
+					tags: defineType(Object),
+					engine: defineType(Object)
+				},
+				description: "Ряд тегов в поле при множественном выборе вместо встроенного Tags"
+			},
+			/**
+			* `leading` и `trailing` — проброс одноимённых слотов Input: у него
+			* они уже есть, и заводить своё было бы вторым способом делать то же
+			* самое. `trailing` идёт после кнопки очистки и стрелки, то есть
+			* дополняет их, а не заменяет.
+			*/
+			leading: { description: "Перед полем" },
+			/**
+			* Проброс слота `clear` поля: кнопку очистки рисует поле, а своя
+			* кнопка заменяет её целиком. Scope — команда поля `clear`: она
+			* очищает поле, а выбор Select снимает по её событию.
+			*/
+			clear: {
+				scope: { clear: defineType(Function) },
+				description: "Кнопка очистки значения"
+			},
+			"arrow-icon": { description: "Стрелка состояния панели" },
+			trailing: { description: "После стрелки" },
+			default: { description: "Опции — элементы коллекции" },
+			empty: { description: "Когда опций нет" },
+			/**
+			* Слоты опций при работе через проп `items` — проброс слотов опции:
+			* `item-<слот>` (`default` — `item`), scope — scope слота опции плюс
+			* сама опция.
+			*/
+			item: {
+				scope: {
+					item: defineType(Object),
+					text: defineType(String),
+					selected: defineType(Boolean)
+				},
+				description: "Содержимое опции при работе через проп items"
+			},
+			"item-leading": {
+				scope: { item: defineType(Object) },
+				description: "Перед содержимым опции"
+			},
+			"item-trailing": {
+				scope: { item: defineType(Object) },
+				description: "После содержимого опции"
+			},
+			"item-indicator-icon": {
+				scope: {
+					item: defineType(Object),
+					selected: defineType(Boolean)
+				},
+				description: "Отметка выбранной опции"
+			}
+		},
+		props: {
+			open: {
+				type: Boolean,
+				triggers: ["change:open"]
+			},
+			placeholder: {
+				type: String,
+				triggers: ["change:placeholder"]
+			},
+			closeOnSelect: {
+				type: Boolean,
+				triggers: ["change:closeOnSelect"]
+			},
+			/**
+			* Кнопку очистки рисует поле: `clearable` Select отдаёт ему, как
+			* `name` и `size`, а имя кнопке пишет плагин имён самого поля.
+			*/
+			clearable: {
+				type: Boolean,
+				triggers: ["change:clearable"]
+			},
+			editable: {
+				type: Boolean,
+				triggers: ["change:editable"]
+			},
+			editableMode: {
+				type: String,
+				triggers: ["change:editableMode"]
+			},
+			removeOnBackspace: {
+				type: Boolean,
+				triggers: ["change:removeOnBackspace"]
+			},
+			placement: {
+				type: String,
+				triggers: ["change:placement"]
+			},
+			/** За что панель смахивают, чтобы закрыть. По умолчанию — ни за что. */
+			swipe: {
+				type: String,
+				triggers: ["change:swipe"]
+			},
+			/**
+			* Роль, `id` и множественность списка. Набор Select'а, а не свой:
+			* список — разметка внутри шаблона, экземпляра у него нет.
+			*/
+			listAria: {
+				type: Object,
+				protected: true,
+				triggers: ["change:listAria"]
+			},
+			/** Можно ли открыть панель: запрещает только `disabled`. */
+			openable: {
+				type: Boolean,
+				protected: true,
+				triggers: ["change:disabled"]
+			},
+			/**
+			* Подгонять ли ширину панели под поле — производное от `contentFit`.
+			*
+			* Вычисляет ядро, шаблон только пробрасывает в `anchor_matchWidth`.
+			* Оставь выражение `contentFit !== 'expand'` в разметке — и оно
+			* повторится в каждом из шести адаптеров.
+			*/
+			autoFitWidth: {
+				type: Boolean,
+				protected: true,
+				triggers: ["change:contentFit"]
+			},
+			/**
+			* Сторона панели и разрешение flip для плагина якоря — производные от
+			* `placement`, как `autoFitWidth` от `contentFit`. Вычисляет ядро,
+			* шаблон только пробрасывает в `anchor_placement` и `anchor_flip`.
+			*/
+			panelPlacement: {
+				type: String,
+				protected: true,
+				triggers: ["change:placement"]
+			},
+			panelFlip: {
+				type: Boolean,
+				protected: true,
+				triggers: ["change:placement"]
+			},
+			/**
+			* `data-*` панели: тянут ли её. Панель — Frame без экземпляра в ядре,
+			* и набор для неё — Select'а, как `listAria` списка. Открытость панели
+			* (`data-open`) пишет её слой, сторону (`data-placement`) — плагин
+			* якоря.
+			*/
+			panelDataset: {
+				type: Object,
+				protected: true,
+				triggers: ["change:swiping"]
+			},
+			/**
+			* Рисовать ли полосу, за которую тянут. Вычисляет ядро: разметка
+			* без экземпляра формулу не повторяет.
+			*/
+			handleRendered: {
+				type: Boolean,
+				protected: true,
+				triggers: ["change:swipe"]
+			},
+			/**
+			* Whether the panel's options from data are mounted: from the first
+			* opening on. Options in markup are the consumer's content and are
+			* mounted from the start.
+			*/
+			contentRendered: {
+				type: Boolean,
+				protected: true,
+				triggers: ["change:open"]
+			},
+			...LIST_PROPS
+		},
+		events: [
+			"open",
+			"close",
+			"change:open",
+			"change:placeholder",
+			"change:closeOnSelect",
+			"change:clearable",
+			"change:editable",
+			"change:editableMode",
+			"change:removeOnBackspace",
+			"change:placement",
+			"change:swipe",
+			"change:maxRows",
+			"change:contentFit",
+			"change:scrollBehavior",
+			"change:indicator",
+			"change:groupSeparators"
+		]
+	},
+	plugins: [
+		ActionPluginDescriptor.with({ focusTarget: fieldOf }),
+		CollectionBundlesPluginDescriptor,
+		CollectionElementsPluginDescriptor,
+		ListHeightPluginDescriptor,
+		DismissPluginDescriptor,
+		SelectPointerPluginDescriptor,
+		SelectKeyboardPluginDescriptor,
+		ListScrollPluginDescriptor.with({ navigation: TSelectKeyboardPlugin }),
+		SelectEditablePluginDescriptor,
+		SelectBackspacePluginDescriptor,
+		SelectIdsPluginDescriptor,
+		SwipePluginDescriptor
+	]
+}));
+//#endregion
+export { SelectDescriptor };

package/dist/content/descriptors/components/skeleton.descriptor.d.ts

@@ -0,0 +1,127 @@
+/**
+ * Дескриптор Skeleton (TSkeleton).
+ *
+ * Наследует ComponentViewDescriptor (rendered, visible, present, tag, classes, element, instance)
+ * и добавляет слот `default`, variant, shape, animation, width, height + плагин SkeletonLayout.
+ * `variant` объявлен здесь, а не взят у Stylable: `TSkeleton` наследует
+ * `TComponentView`, и `size` у него нет.
+ */
+import { TSkeleton } from '@soxa-ui/core';
+export declare const SkeletonDescriptor: () => import("../../..").IComponentDescriptor<import("../../../protected/define/inference.types").TContractFrom<{
+    readonly ctor: typeof TSkeleton;
+    readonly extends: import("../../..").IComponentDescriptor<import("../../../protected/define/inference.types").TContractFrom<{
+        readonly ctor: typeof import("@soxa-ui/core").TComponentView;
+        readonly extends: import("../../..").IComponentDescriptor<import("../../../protected/define/inference.types").TContractFrom<{
+            readonly ctor: typeof import("@soxa-ui/core").TComponent;
+            readonly extends: import("../../..").IComponentDescriptor<import("../../../protected/define/inference.types").TContractFrom<{
+                readonly contribution: {
+                    readonly props: {
+                        readonly ctrl: {
+                            readonly type: ObjectConstructor;
+                        };
+                        readonly embedded: {
+                            readonly type: StringConstructor;
+                        };
+                        readonly pluginProps: {
+                            readonly type: ObjectConstructor;
+                        };
+                    };
+                    readonly events: readonly ["bundle:create", "plugin:event"];
+                };
+            }>>;
+            readonly contribution: {};
+        }>>;
+        readonly contribution: {
+            readonly slots: {
+                readonly default: {
+                    readonly description: "Содержимое компонента";
+                };
+            };
+            readonly props: {
+                readonly rendered: {
+                    readonly type: BooleanConstructor;
+                    readonly triggers: readonly ["change:rendered"];
+                };
+                readonly visible: {
+                    readonly type: BooleanConstructor;
+                    readonly triggers: readonly ["change:visible"];
+                };
+                readonly present: {
+                    readonly type: BooleanConstructor;
+                    readonly protected: true;
+                    readonly triggers: readonly ["change:rendered", "change:visible"];
+                };
+                readonly tag: {
+                    readonly type: readonly [StringConstructor, ObjectConstructor];
+                    readonly triggers: readonly ["change:tag"];
+                };
+                readonly direction: {
+                    readonly type: StringConstructor;
+                    readonly triggers: readonly ["change:direction"];
+                };
+                readonly classes: {
+                    readonly type: ObjectConstructor;
+                    readonly protected: true;
+                    readonly triggers: readonly ["change:classes"];
+                };
+                readonly aria: {
+                    readonly type: ObjectConstructor;
+                    readonly protected: true;
+                    readonly triggers: readonly ["change:aria"];
+                };
+                readonly dataset: {
+                    readonly type: ObjectConstructor;
+                    readonly protected: true;
+                    readonly triggers: readonly ["change:dataset"];
+                };
+                readonly attrs: {
+                    readonly type: ObjectConstructor;
+                    readonly protected: true;
+                    readonly triggers: readonly ["change:attrs"];
+                };
+            };
+            readonly events: readonly ["show", "hide", "show:before", "hide:before", "ready", "change:rendered", "change:visible", "change:tag", "change:direction"];
+        };
+        readonly plugins: readonly [import("../../..").IPluginDefinition<import("../../../protected/define/inference.types").TPluginContractFrom<import("@soxa-ui/plugins").TElementPlugin, "element", {
+            readonly events: readonly ["ready", "removed"];
+        }>>, import("../../..").IPluginDefinition<import("../../../protected/define/inference.types").TPluginContractFrom<import("@soxa-ui/plugins").TReadyPlugin, "ready", import("../../..").IContribution>>];
+    }>>;
+    readonly contribution: {
+        readonly slots: {
+            readonly default: {
+                readonly description: "Настоящее содержимое: скрыто, пока видна заглушка";
+            };
+        };
+        readonly props: {
+            readonly variant: {
+                readonly type: StringConstructor;
+                readonly triggers: readonly ["change:variant"];
+            };
+            readonly shape: {
+                readonly type: StringConstructor;
+                readonly triggers: readonly ["change:shape"];
+            };
+            readonly animation: {
+                readonly type: StringConstructor;
+                readonly triggers: readonly ["change:animation"];
+            };
+            readonly width: {
+                readonly type: readonly [NumberConstructor, StringConstructor];
+                readonly triggers: readonly ["change:width"];
+            };
+            readonly height: {
+                readonly type: readonly [NumberConstructor, StringConstructor];
+                readonly triggers: readonly ["change:height"];
+            };
+        };
+        readonly events: readonly ["change:variant", "change:shape", "change:animation", "change:width", "change:height"];
+    };
+    readonly plugins: readonly [import("../../..").IPluginDefinition<import("../../../protected/define/inference.types").TPluginContractFrom<import("@soxa-ui/plugins").TSkeletonLayoutPlugin, "layout", {
+        readonly props: {
+            readonly styles: {
+                readonly protected: true;
+                readonly triggers: readonly ["change:styles"];
+            };
+        };
+    }>>];
+}>>;

package/dist/content/descriptors/components/skeleton.descriptor.js

@@ -0,0 +1,53 @@
+import { defineComponent } from "../../../protected/define/component.js";
+import { defineDescriptor } from "../../../protected/define/descriptor.js";
+import { SkeletonLayoutPluginDescriptor } from "../plugins/skeleton-layout.plugin.js";
+import { ComponentViewDescriptor } from "./component-view.descriptor.js";
+import { TSkeleton } from "@soxa-ui/core";
+//#region content/descriptors/components/skeleton.descriptor.ts
+/**
+* Дескриптор Skeleton (TSkeleton).
+*
+* Наследует ComponentViewDescriptor (rendered, visible, present, tag, classes, element, instance)
+* и добавляет слот `default`, variant, shape, animation, width, height + плагин SkeletonLayout.
+* `variant` объявлен здесь, а не взят у Stylable: `TSkeleton` наследует
+* `TComponentView`, и `size` у него нет.
+*/
+var SkeletonDescriptor = defineDescriptor(() => defineComponent({
+	ctor: TSkeleton,
+	extends: ComponentViewDescriptor(),
+	contribution: {
+		slots: { default: { description: "Настоящее содержимое: скрыто, пока видна заглушка" } },
+		props: {
+			variant: {
+				type: String,
+				triggers: ["change:variant"]
+			},
+			shape: {
+				type: String,
+				triggers: ["change:shape"]
+			},
+			animation: {
+				type: String,
+				triggers: ["change:animation"]
+			},
+			width: {
+				type: [Number, String],
+				triggers: ["change:width"]
+			},
+			height: {
+				type: [Number, String],
+				triggers: ["change:height"]
+			}
+		},
+		events: [
+			"change:variant",
+			"change:shape",
+			"change:animation",
+			"change:width",
+			"change:height"
+		]
+	},
+	plugins: [SkeletonLayoutPluginDescriptor]
+}));
+//#endregion
+export { SkeletonDescriptor };