@shelamkoff/rector 1.0.1 → 1.0.3

package/dist/plugins/carousel/locale/en.d.ts

@@ -7,10 +7,25 @@ declare const _default: {
     'plugin.carousel.upload': string;
     'plugin.carousel.back': string;
     'plugin.carousel.dropzoneText': string;
+    'plugin.carousel.dropzoneUrlPrefix': string;
+    'plugin.carousel.dropzoneUrl': string;
+    'plugin.carousel.dropzoneHtmlPrefix': string;
+    'plugin.carousel.dropzoneHtml': string;
+    'plugin.carousel.urlEditorTitle': string;
+    'plugin.carousel.urlEditorLabel': string;
+    'plugin.carousel.urlEditorPlaceholder': string;
+    'plugin.carousel.htmlEditorTitle': string;
+    'plugin.carousel.htmlEditorLabel': string;
+    'plugin.carousel.htmlEditorPlaceholder': string;
+    'plugin.carousel.sourceSubmit': string;
+    'plugin.carousel.sourceCancel': string;
+    'plugin.carousel.invalidUrl': string;
+    'plugin.carousel.invalidHtml': string;
     'plugin.carousel.empty': string;
     'plugin.carousel.emptyReadonly': string;
     'plugin.carousel.html': string;
     'plugin.carousel.source': string;
+    'plugin.carousel.embeddedSource': string;
     'plugin.carousel.alt': string;
     'plugin.carousel.poster': string;
     'plugin.carousel.caption': string;

package/dist/plugins/carousel/locale/en.js

@@ -7,10 +7,25 @@ export default {
   'plugin.carousel.upload': 'Upload',
   'plugin.carousel.back': 'Back',
   'plugin.carousel.dropzoneText': 'images or videos from your device or drag and drop them here',
+  'plugin.carousel.dropzoneUrlPrefix': 'or',
+  'plugin.carousel.dropzoneUrl': 'insert by URL',
+  'plugin.carousel.dropzoneHtmlPrefix': 'or',
+  'plugin.carousel.dropzoneHtml': 'insert HTML',
+  'plugin.carousel.urlEditorTitle': 'Add media by URL',
+  'plugin.carousel.urlEditorLabel': 'Media URL',
+  'plugin.carousel.urlEditorPlaceholder': 'https://example.com/image.jpg',
+  'plugin.carousel.htmlEditorTitle': 'Add HTML slide',
+  'plugin.carousel.htmlEditorLabel': 'Slide HTML',
+  'plugin.carousel.htmlEditorPlaceholder': '<article>...</article>',
+  'plugin.carousel.sourceSubmit': 'Add',
+  'plugin.carousel.sourceCancel': 'Cancel',
+  'plugin.carousel.invalidUrl': 'Enter a valid media URL.',
+  'plugin.carousel.invalidHtml': 'Enter valid slide HTML.',
   'plugin.carousel.empty': 'Add the first slide',
   'plugin.carousel.emptyReadonly': 'No slides',
   'plugin.carousel.html': 'HTML',
   'plugin.carousel.source': 'Source URL',
+  'plugin.carousel.embeddedSource': 'Local file — paste a URL to replace it',
   'plugin.carousel.alt': 'Alternative text',
   'plugin.carousel.poster': 'Poster URL',
   'plugin.carousel.caption': 'Caption',
@@ -22,9 +37,9 @@ export default {
   'plugin.carousel.movePreviousShort': 'Earlier',
   'plugin.carousel.moveNextShort': 'Later',
   'plugin.carousel.remove': 'Remove',
-  'plugin.carousel.removeSlide': 'Remove slide',
-  'plugin.carousel.deleteAll': 'Remove all slides',
-  'plugin.carousel.video': 'Video slide',
+  'plugin.carousel.removeSlide': 'Remove slide',
+  'plugin.carousel.deleteAll': 'Remove all slides',
+  'plugin.carousel.video': 'Video slide',
   'plugin.carousel.settings': 'Settings',
   'plugin.carousel.currentSlide': 'Current slide',
   'plugin.carousel.behavior': 'Behavior',

package/dist/plugins/carousel/locale/ru.d.ts

@@ -7,10 +7,25 @@ declare const _default: {
     'plugin.carousel.upload': string;
     'plugin.carousel.back': string;
     'plugin.carousel.dropzoneText': string;
+    'plugin.carousel.dropzoneUrlPrefix': string;
+    'plugin.carousel.dropzoneUrl': string;
+    'plugin.carousel.dropzoneHtmlPrefix': string;
+    'plugin.carousel.dropzoneHtml': string;
+    'plugin.carousel.urlEditorTitle': string;
+    'plugin.carousel.urlEditorLabel': string;
+    'plugin.carousel.urlEditorPlaceholder': string;
+    'plugin.carousel.htmlEditorTitle': string;
+    'plugin.carousel.htmlEditorLabel': string;
+    'plugin.carousel.htmlEditorPlaceholder': string;
+    'plugin.carousel.sourceSubmit': string;
+    'plugin.carousel.sourceCancel': string;
+    'plugin.carousel.invalidUrl': string;
+    'plugin.carousel.invalidHtml': string;
     'plugin.carousel.empty': string;
     'plugin.carousel.emptyReadonly': string;
     'plugin.carousel.html': string;
     'plugin.carousel.source': string;
+    'plugin.carousel.embeddedSource': string;
     'plugin.carousel.alt': string;
     'plugin.carousel.poster': string;
     'plugin.carousel.caption': string;

package/dist/plugins/carousel/locale/ru.js

@@ -7,10 +7,25 @@ export default {
   'plugin.carousel.upload': 'Загрузить',
   'plugin.carousel.back': 'Назад',
   'plugin.carousel.dropzoneText': 'изображения или видео с устройства либо перетащите их сюда',
+  'plugin.carousel.dropzoneUrlPrefix': 'или',
+  'plugin.carousel.dropzoneUrl': 'вставьте по URL',
+  'plugin.carousel.dropzoneHtmlPrefix': 'или',
+  'plugin.carousel.dropzoneHtml': 'вставьте HTML',
+  'plugin.carousel.urlEditorTitle': 'Добавление медиафайла по URL',
+  'plugin.carousel.urlEditorLabel': 'URL медиафайла',
+  'plugin.carousel.urlEditorPlaceholder': 'https://example.com/image.jpg',
+  'plugin.carousel.htmlEditorTitle': 'Добавление HTML-слайда',
+  'plugin.carousel.htmlEditorLabel': 'HTML-код слайда',
+  'plugin.carousel.htmlEditorPlaceholder': '<article>...</article>',
+  'plugin.carousel.sourceSubmit': 'Добавить',
+  'plugin.carousel.sourceCancel': 'Отмена',
+  'plugin.carousel.invalidUrl': 'Введите корректный URL медиафайла.',
+  'plugin.carousel.invalidHtml': 'Введите корректный HTML-код слайда.',
   'plugin.carousel.empty': 'Добавьте первый слайд',
   'plugin.carousel.emptyReadonly': 'Слайдов нет',
   'plugin.carousel.html': 'HTML',
   'plugin.carousel.source': 'URL источника',
+  'plugin.carousel.embeddedSource': 'Локальный файл — вставьте URL для замены',
   'plugin.carousel.alt': 'Альтернативный текст',
   'plugin.carousel.poster': 'URL постера',
   'plugin.carousel.caption': 'Подпись',
@@ -22,9 +37,9 @@ export default {
   'plugin.carousel.movePreviousShort': 'Раньше',
   'plugin.carousel.moveNextShort': 'Позже',
   'plugin.carousel.remove': 'Удалить',
-  'plugin.carousel.removeSlide': 'Удалить слайд',
-  'plugin.carousel.deleteAll': 'Удалить все слайды',
-  'plugin.carousel.video': 'Видеослайд',
+  'plugin.carousel.removeSlide': 'Удалить слайд',
+  'plugin.carousel.deleteAll': 'Удалить все слайды',
+  'plugin.carousel.video': 'Видеослайд',
   'plugin.carousel.settings': 'Настройки',
   'plugin.carousel.currentSlide': 'Текущий слайд',
   'plugin.carousel.behavior': 'Поведение',

package/dist/plugins/gallery/README.md

@@ -1,92 +1,92 @@
-# Gallery block plugin
-
-Multi-image gallery with layouts, captions, appearance settings, reordering, and viewer options.
-
-## Install and register
-
-```bash
-npm install @shelamkoff/rector
-```
-
-```js
-import { createEditor } from '@shelamkoff/rector'
-import { Gallery } from '@shelamkoff/rector/plugins/gallery'
-import '@shelamkoff/rector/styles/editor.css'
-
-const editor = createEditor({
-  holder: document.querySelector('#editor'),
-  plugins: [new Gallery()],
-})
-```
-
-The registered block type is `gallery`. The class is also exported by the complete `@shelamkoff/rector/plugins` preset and can be loaded through `@shelamkoff/rector/plugins/async`.
-
-## Data
-
-```json
-{
-  "images": [{ "url": "https://cdn.example/a.jpg", "caption": "A" }],
-  "layout": "auto",
-  "styles": { "gap": "8px", "borderRadius": "8px", "height": "420px" },
-  "options": { "loop": true, "zoom": true, "navigation": true, "captions": true, "thumbnails": true, "fullscreen": true, "autoplayInterval": 3000 }
-}
-```
-
-### Field reference
-
-| Field | Required | Meaning and constraints |
-| --- | --- | --- |
-| `images` | yes | Non-empty array. Every item requires a media-policy `url`; `caption` is an optional string. |
-| `layout` | yes | One of `auto`, `1`, `2`, `3a`, `3b`, `3c`, `4a`, `4b`, `4c`, `5a`, `5b`, `5c`, `6a`, `6b`, `6c`, `triptych`, `masonry`, `poly-5`, `poly-3arch`, `poly-5flat`, or `poly-3steps`. |
-| `styles` | no | String-valued map. The built-in settings UI uses `gap`, `borderRadius`, and `height`. |
-| `options.loop` | no | Wraps viewer navigation from the last image to the first. The new-block default is `true`. |
-| `options.zoom`, `navigation`, `captions`, `fullscreen` | no | Boolean viewer controls; new-block defaults are `true`. |
-| `options.thumbnails` | no | Shows viewer thumbnails; the new-block default is `false`. |
-| `options.autoplayInterval` | no | Positive finite interval in milliseconds. Omit it to disable autoplay. `0` is not valid persisted data. |
-
-Without `uploadFile`, local files become data URLs. Callback results are accepted only when `url` passes the shared media URL policy. The viewer requires `@shelamkoff/expose`.
-
-## Configuration
-
-Every built-in block plugin accepts two style ownership options: `injectStyles?: boolean` defaults to `true`; set it to `false` when the host bundles that plugin's CSS. `css?: string` adds one host-provided stylesheet URL after the plugin default, or acts as the replacement URL when default injection is disabled.
-
-`uploadFile?: (file: File, context: { signal: AbortSignal }) => Promise<{ url: string; alt?: string }>` uploads each file. `actions?: Array<{ icon?; label; handler(context: { signal: AbortSignal }): Promise<Array<{ url: string; alt?: string }> | null> }>` adds application media sources. Both callbacks must stop work when the supplied signal is aborted.
-
-## Application file sources
-
-Use `uploadFile` for browser `File` objects and `actions` for existing assets selected from a media library, cloud drive, or another application-owned catalog. An action may return several images; the complete selection becomes one undo/redo step.
-
-```js
-const gallery = new Gallery({
-  actions: [{
-    label: 'Media library',
-    async handler({ signal }) {
-      const assets = await openMediaLibrary({
-        accept: ['image/*'],
-        multiple: true,
-        signal,
-      })
-      return assets?.map(asset => ({
-        url: asset.url,
-        alt: asset.alt,
-      })) ?? null
-    },
-  }],
-})
-```
-
-Return `null` when selection is cancelled. The optional `alt` value initializes the image caption. Multiple independent sources may be added as separate `actions` entries. See [File sources and media libraries](https://shelamkoff.github.io/editor/guide/file-sources) for upload, cancellation, validation, and reusable adapter guidance.
-
-## Capabilities
-
-Multi-file upload; image-file paste with an async transaction; layout/style controls; drag reordering; custom media actions.
-
-## Undo, lifecycle, and styles
-
-User actions exposed by the plugin enter the command pipeline through the supplied `context.mutate()` capability, so each completed action is one undo/redo step. The editor reference-counts the plugin's declared stylesheet URLs. Removing a block calls its cleanup hook; removing the editor calls `destroy()` for every remaining block and then releases shared plugin resources.
-
-Do not remove the editor holder without first calling `editor.destroy()`.
-
-## Document output
-
-Use the matching renderer from `@shelamkoff/rector/renderer/renderers/gallery`. The VitePress guide documents configuration, commands and history, extension contracts, document migrations, styling, security, and lifecycle in a sequential form.
+# Gallery block plugin
+
+Multi-image gallery with layouts, captions, appearance settings, reordering, and viewer options.
+
+## Install and register
+
+```bash
+npm install @shelamkoff/rector
+```
+
+```js
+import { createEditor } from '@shelamkoff/rector'
+import { Gallery } from '@shelamkoff/rector/plugins/gallery'
+import '@shelamkoff/rector/styles/editor.css'
+
+const editor = createEditor({
+  holder: document.querySelector('#editor'),
+  plugins: [new Gallery()],
+})
+```
+
+The registered block type is `gallery`. The class is also exported by the complete `@shelamkoff/rector/plugins` preset and can be loaded through `@shelamkoff/rector/plugins/async`.
+
+## Data
+
+```json
+{
+  "images": [{ "url": "https://cdn.example/a.jpg", "caption": "A" }],
+  "layout": "auto",
+  "styles": { "gap": "8px", "borderRadius": "8px", "height": "420px" },
+  "options": { "loop": true, "zoom": true, "navigation": true, "captions": true, "thumbnails": true, "fullscreen": true, "autoplayInterval": 3000 }
+}
+```
+
+### Field reference
+
+| Field | Required | Meaning and constraints |
+| --- | --- | --- |
+| `images` | yes | Non-empty array. Every item requires a media-policy `url`; `caption` is an optional string. |
+| `layout` | yes | One of `auto`, `1`, `2`, `3a`, `3b`, `3c`, `4a`, `4b`, `4c`, `5a`, `5b`, `5c`, `6a`, `6b`, `6c`, `triptych`, `masonry`, `poly-5`, `poly-3arch`, `poly-5flat`, or `poly-3steps`. |
+| `styles` | no | String-valued map. The built-in settings UI uses `gap`, `borderRadius`, and `height`. |
+| `options.loop` | no | Wraps viewer navigation from the last image to the first. The new-block default is `true`. |
+| `options.zoom`, `navigation`, `captions`, `fullscreen` | no | Boolean viewer controls; new-block defaults are `true`. |
+| `options.thumbnails` | no | Shows viewer thumbnails; the new-block default is `false`. |
+| `options.autoplayInterval` | no | Positive finite interval in milliseconds. Omit it to disable autoplay. `0` is not valid persisted data. |
+
+Without `uploadFile`, local files become data URLs. Callback results are accepted only when `url` passes the shared media URL policy. The viewer requires `@shelamkoff/expose`. The `masonry` layout is measured and positioned by `@shelamkoff/masonry`; it is not a CSS-columns approximation.
+
+## Configuration
+
+Every built-in block plugin accepts two style ownership options: `injectStyles?: boolean` defaults to `true`; set it to `false` when the host bundles that plugin's CSS. `css?: string` adds one host-provided stylesheet URL after the plugin default, or acts as the replacement URL when default injection is disabled.
+
+`uploadFile?: (file: File, context: { signal: AbortSignal }) => Promise<{ url: string; alt?: string }>` uploads each file. `actions?: Array<{ icon?; label; handler(context: { signal: AbortSignal }): Promise<Array<{ url: string; alt?: string }> | null> }>` adds application media sources. Both callbacks must stop work when the supplied signal is aborted.
+
+## Application file sources
+
+Use `uploadFile` for browser `File` objects and `actions` for existing assets selected from a media library, cloud drive, or another application-owned catalog. An action may return several images; the complete selection becomes one undo/redo step.
+
+```js
+const gallery = new Gallery({
+  actions: [{
+    label: 'Media library',
+    async handler({ signal }) {
+      const assets = await openMediaLibrary({
+        accept: ['image/*'],
+        multiple: true,
+        signal,
+      })
+      return assets?.map(asset => ({
+        url: asset.url,
+        alt: asset.alt,
+      })) ?? null
+    },
+  }],
+})
+```
+
+Return `null` when selection is cancelled. The optional `alt` value initializes the image caption. Multiple independent sources may be added as separate `actions` entries. See [File sources and media libraries](https://shelamkoff.github.io/editor/guide/file-sources) for upload, cancellation, validation, and reusable adapter guidance.
+
+## Capabilities
+
+Multi-file upload; image-file paste with an async transaction; layout/style controls; drag reordering; custom media actions.
+
+## Undo, lifecycle, and styles
+
+User actions exposed by the plugin enter the command pipeline through the supplied `context.mutate()` capability, so each completed action is one undo/redo step. The editor reference-counts the plugin's declared stylesheet URLs. Removing a block calls its cleanup hook; removing the editor calls `destroy()` for every remaining block and then releases shared plugin resources.
+
+Do not remove the editor holder without first calling `editor.destroy()`.
+
+## Document output
+
+Use the matching renderer from `@shelamkoff/rector/renderer/renderers/gallery`. The VitePress guide documents configuration, commands and history, extension contracts, document migrations, styling, security, and lifecycle in a sequential form.

package/dist/plugins/gallery/README.ru.md

@@ -28,23 +28,23 @@ const editor = createEditor({
   "images": [{ "url": "https://cdn.example/a.jpg", "caption": "A" }],
   "layout": "auto",
   "styles": { "gap": "8px", "borderRadius": "8px", "height": "420px" },
-  "options": { "loop": true, "zoom": true, "navigation": true, "captions": true, "thumbnails": true, "fullscreen": true, "autoplayInterval": 3000 }
-}
-```
-
-### Поля данных
-
-| Поле | Обязательное | Назначение и ограничения |
-| --- | --- | --- |
-| `images` | да | Непустой массив. Каждому элементу нужен разрешённый политикой медиафайлов `url`; `caption` — необязательная строка. |
-| `layout` | да | Одно из значений `auto`, `1`, `2`, `3a`, `3b`, `3c`, `4a`, `4b`, `4c`, `5a`, `5b`, `5c`, `6a`, `6b`, `6c`, `triptych`, `masonry`, `poly-5`, `poly-3arch`, `poly-5flat` или `poly-3steps`. |
-| `styles` | нет | Карта строковых значений. Встроенная панель настроек использует `gap`, `borderRadius` и `height`. |
-| `options.loop` | нет | После последнего изображения переходит к первому; для нового блока по умолчанию `true`. |
-| `options.zoom`, `navigation`, `captions`, `fullscreen` | нет | Логические параметры просмотра; для нового блока по умолчанию `true`. |
-| `options.thumbnails` | нет | Показывает миниатюры; для нового блока по умолчанию `false`. |
-| `options.autoplayInterval` | нет | Положительный конечный интервал в миллисекундах. Отсутствие поля отключает автовоспроизведение. Значение `0` недопустимо в сохранённых данных. |
-
-Без `uploadFile` файлы сохраняются как URL со встроенными данными. Для полноэкранного просмотра нужен `@shelamkoff/expose`.
+  "options": { "loop": true, "zoom": true, "navigation": true, "captions": true, "thumbnails": true, "fullscreen": true, "autoplayInterval": 3000 }
+}
+```
+
+### Поля данных
+
+| Поле | Обязательное | Назначение и ограничения |
+| --- | --- | --- |
+| `images` | да | Непустой массив. Каждому элементу нужен разрешённый политикой медиафайлов `url`; `caption` — необязательная строка. |
+| `layout` | да | Одно из значений `auto`, `1`, `2`, `3a`, `3b`, `3c`, `4a`, `4b`, `4c`, `5a`, `5b`, `5c`, `6a`, `6b`, `6c`, `triptych`, `masonry`, `poly-5`, `poly-3arch`, `poly-5flat` или `poly-3steps`. |
+| `styles` | нет | Карта строковых значений. Встроенная панель настроек использует `gap`, `borderRadius` и `height`. |
+| `options.loop` | нет | После последнего изображения переходит к первому; для нового блока по умолчанию `true`. |
+| `options.zoom`, `navigation`, `captions`, `fullscreen` | нет | Логические параметры просмотра; для нового блока по умолчанию `true`. |
+| `options.thumbnails` | нет | Показывает миниатюры; для нового блока по умолчанию `false`. |
+| `options.autoplayInterval` | нет | Положительный конечный интервал в миллисекундах. Отсутствие поля отключает автовоспроизведение. Значение `0` недопустимо в сохранённых данных. |
+
+Без `uploadFile` файлы сохраняются как URL со встроенными данными. Для полноэкранного просмотра нужен `@shelamkoff/expose`. Раскладка `masonry` измеряется и позиционируется библиотекой `@shelamkoff/masonry`, а не имитацией через CSS columns.
 
 ## Конфигурация
 

package/dist/plugins/gallery/gallery.css

@@ -1,4 +1,5 @@
 .oe-gallery {
+  position: relative;
   border-radius: 0.5rem;
   overflow-anchor: none;
   text-align: center;
@@ -433,19 +434,40 @@
   aspect-ratio: 3 / 1.5;
 }
 
-/* Masonry: CSS columns */
-.eg--masonry {
-  column-count: 3;
-  column-gap: 0.25rem;
-}
-.eg--masonry .oe-gallery__slot {
-  break-inside: avoid;
-  margin-bottom: 0.25rem;
-}
-.eg--masonry .oe-gallery__slot-img {
-  height: auto;
-}
-
+/* Masonry: layout is calculated by @shelamkoff/masonry. */
+.eg--masonry {
+  position: relative;
+  width: 100%;
+  gap: 0.25rem;
+}
+
+.eg--masonry.masonry-container > .masonry-item {
+  position: absolute;
+  top: 0;
+  left: 0;
+  will-change: transform;
+  opacity: 0;
+}
+
+.eg--masonry.masonry-container > .masonry-item--visible {
+  opacity: 1;
+}
+
+.eg--masonry .oe-gallery__slot {
+  width: 100%;
+  margin: 0;
+}
+
+.eg--masonry .oe-gallery__slot-img {
+  height: auto;
+}
+
+.eg--masonry-fallback {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr));
+  height: auto !important;
+}
+
 /* ── Polyptych templates ── */
 
 /* poly-5: Classic 5-panel pyramid, center tallest */
@@ -510,11 +532,10 @@
   .eg--6b {
     grid-template-columns: repeat(3, 1fr);
     grid-template-rows: 1fr 1fr;
-  }
-  .eg--6b .oe-gallery__slot:nth-child(1) { grid-column: 1 / -1; grid-row: auto; }
-  .eg--6b .oe-gallery__slot:nth-child(n+2) { grid-column: auto; }
-  .eg--masonry { column-count: 2; }
-}
+  }
+  .eg--6b .oe-gallery__slot:nth-child(1) { grid-column: 1 / -1; grid-row: auto; }
+  .eg--6b .oe-gallery__slot:nth-child(n+2) { grid-column: auto; }
+}
 
 /* ── Action bar ───────────────────────────────────────────────────────────── */
 
@@ -615,7 +636,7 @@
   border-radius: 8px;
   box-shadow: var(--oe-toolbar-shadow, 0 8px 24px rgba(0, 0, 0, 0.4));
   padding: 10px;
-  z-index: 100;
+  z-index: var(--oe-plugin-panel-z-index, 1100);
 }
 
 .oe-gallery__dropdown--open .oe-gallery__dropdown-panel {
@@ -805,6 +826,10 @@
   color: var(--oe-text-1, #1a1a1a);
 }
 
+.oe-theme-light .oe-gallery__action-btn:hover {
+  color: var(--oe-text-on-accent, #fff);
+}
+
 .oe-theme-light .oe-gallery__action-btn--active {
   color: var(--oe-accent, #4357b4);
 }