photosuite 0.1.2 → 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,244 +1,282 @@
1
- ![Sample Image](public/Wild-squirrel-feeding-interaction-with-hand-in-natural-forest.png)
2
-
3
- # Photosuite
4
-
5
- [Official Website](https://photosuite.lhasa.icu) • [Latest Release](https://github.com/achuanya/photosuite/releases) • [Changelog](https://github.com/achuanya/photosuite/main/Changelog.md) • [简体中文](./README.zh-CN.md)
6
-
7
- Photosuite is a simple yet feature-rich image integration tailored for independent blogs. It modularly integrates lightbox, EXIF data, path resolution, and more into a single, zero-config package. Out of the box, no tedious configuration required—give your blog images a fresh look with just one line of code!
8
-
9
- ## Features
10
-
11
- * **Lightbox**: Customized and integrated GLightbox for a more minimalist and practical experience.
12
- * **EXIF**: Integrated `exiftool-vendored.js` for fast execution and broad coverage.
13
- * **Path Resolution**: Simply insert the filename, and it automatically resolves the absolute path.
14
- * **Captions**: Automatically extracts the image's `alt` attribute to display as a caption.
15
- * **Performance**: Purely static, modular features, loaded on demand.
16
- * **Zero-Config Start**: Default settings satisfy most needs, while offering rich options for deep customization.
17
-
18
- ## Installation
19
-
20
- ```bash
21
- pnpm add photosuite
22
- # or
23
- npm install photosuite
24
- # or
25
- yarn add photosuite
26
- ```
27
-
28
- ## Quick Start
29
-
30
- Integrating Photosuite with Astro is very simple, just add the following configuration to `astro.config.js`:
31
-
32
- ```javascript
33
- import { defineConfig } from 'astro/config';
34
- import photosuite from 'photosuite';
35
- import "photosuite/dist/photosuite.css";
36
-
37
- export default defineConfig({
38
- integrations: [
39
- photosuite({
40
- // [Required] Specify the CSS selector for the scope
41
- // Recommended: Your content container to avoid affecting other parts of the site. Supports multiple selectors separated by commas.
42
- scope: '#main',
43
- })
44
- ]
45
- });
46
- ```
47
-
48
- Once configured, Photosuite will automatically process all images in your Markdown/MDX files.
49
-
50
- ## Features & Configuration
51
-
52
- ### 1. Path Resolution
53
-
54
- Managing image paths in blog posts can be tedious. Photosuite offers flexible resolution strategies that you can configure according to your needs.
55
-
56
- **Scenario A: All images in a single domain/directory**
57
-
58
- ```javascript
59
- photosuite({
60
- scope: '#main',
61
- imageBase: 'https://cdn.example.com/images/',
62
- })
63
- ```
64
-
65
- **Markdown Usage:**
66
- ```markdown
67
- ![My Photo](photo.jpg)
68
- <!-- Resolves to: https://cdn.example.com/images/photo.jpg -->
69
- ```
70
-
71
- **Scenario B: Separate image directory per post (Default)**
72
-
73
- You can specify the directory name in the Frontmatter:
74
-
75
- ```yaml
76
- ---
77
- title: My First GitHub PR
78
- imageDir: "2025-11-26-my-first-github-pr"
79
- ---
80
-
81
- ![My Photo](photo.jpg)
82
- <!-- Resolves to: https://cdn.example.com/images/2025-11-26-my-first-github-pr/photo.jpg -->
83
- ```
84
-
85
- **Scenario C: Use filename as directory**
86
-
87
- ```javascript
88
- photosuite({
89
- scope: '#main',
90
- imageBase: 'https://cdn.example.com/',
91
- fileDir: true, // Enable this option
92
- })
93
- ```
94
-
95
- If your post filename is `2025-11-26-my-first-github-pr.md`, the image path automatically resolves to:
96
-
97
- `https://cdn.example.com/images/2025-11-26-my-first-github-pr/photo.jpg`
98
-
99
- ### 2. EXIF Data Display
100
-
101
- Photosuite uses `exiftool-vendored.js` to extract information at build time.
102
-
103
- **Default Configuration:**
104
- Default display: Camera Model, Lens Model, Focal Length, Aperture, Shutter Speed, ISO, Date Original.
105
-
106
- > NIKON Z 30 · NIKKOR Z DX 16-50mm f/3.5-6.3 VR · 20.5 mm · ƒ/3.8 · 1/15 · ISO 1000 · 2025/12/9
107
-
108
- **Custom Configuration:**
109
-
110
- ```javascript
111
- photosuite({
112
- // ...
113
- exif: {
114
- enabled: true,
115
- // Custom fields: Focal Length, Aperture, Shutter Speed, ISO
116
- fields: ['FocalLength', 'FNumber', 'ExposureTime', 'ISO'],
117
- // Custom separator
118
- separator: ' · '
119
- }
120
- })
121
- ```
122
-
123
- ### 3. Lightbox & Captions
124
-
125
- GLightbox has been customized to differ slightly from the official version.
126
-
127
- Supports native configuration, refer to: [GLightbox](https://github.com/achuanya/glightbox)
128
-
129
- ```javascript
130
- photosuite({
131
- // ...
132
- // Disable lightbox
133
- glightbox: false,
134
-
135
- // Disable captions
136
- imageAlts: false,
137
-
138
- // Pass native GLightbox options
139
- glightboxOptions: {
140
- loop: true,
141
- zoomable: true,
142
- }
143
- })
144
- ```
145
-
146
- ## Complete Configuration Reference
147
-
148
- ### Parameter List
149
-
150
- | Parameter | Type | Required | Default | Description |
151
- | :--- | :--- | :---: | :--- | :--- |
152
- | `scope` | `string` | ✅ | - | **Scope**. CSS selector, only processes images within this container. Supports multiple selectors separated by commas. |
153
- | `selector` | `string` | ❌ | `"a.glightbox"` | **Image Selector**. Specifies which images need lightbox effect. |
154
- | `imageBase` | `string` | ❌ | - | **Base Image URL**. Prefix used for splicing relative paths. |
155
- | `imageDir` | `string` | ❌ | `"imageDir"` | **Directory Field Name**. Field name in Markdown Frontmatter to specify image subdirectory. |
156
- | `fileDir` | `boolean` | ❌ | `false` | **Filename Archiving**. Whether to automatically use Markdown filename as image subdirectory. |
157
- | `glightbox` | `boolean` | ❌ | `true` | **Enable Lightbox**. Whether to load GLightbox module. |
158
- | `imageAlts` | `boolean` | ❌ | `true` | **Enable Captions**. Whether to display `alt` attribute as image caption. |
159
- | `exif` | `boolean` \| `object` | ❌ | `true` | **Enable EXIF**. `false` to disable, `true` for default config, or pass object to customize via fields:[]. |
160
- | `glightboxOptions` | `object` | ❌ | - | **Native Lightbox Config**. Configuration items passed through to GLightbox. |
161
-
162
- ### Full Configuration Code Example
163
-
164
- ```javascript
165
- import photosuite from 'photosuite';
166
- import "photosuite/dist/photosuite.css";
167
-
168
- photosuite({
169
- // ----------------
170
- // Required
171
- // ----------------
172
- scope: '#main', // Your content container class name
173
-
174
- // ----------------
175
- // Optional (Values below are defaults)
176
- // ----------------
177
-
178
- // Basic Settings
179
- selector: 'a.glightbox',
180
-
181
- // Path Resolution
182
- imageBase: '',
183
- imageDir: 'imageDir',
184
- fileDir: false,
185
-
186
- // Feature Toggles
187
- glightbox: true,
188
- imageAlts: true,
189
-
190
- // EXIF Detailed Configuration
191
- exif: {
192
- enabled: true,
193
- fields: [
194
- 'Model', // Camera Model
195
- 'LensModel', // Lens Model
196
- 'FocalLength', // Focal Length
197
- 'FNumber', // Aperture
198
- 'ExposureTime', // Shutter Speed
199
- 'ISO', // ISO
200
- 'DateTimeOriginal' // Date Original
201
- ],
202
- separator: ' · ' // Separator
203
- },
204
-
205
- // Native GLightbox Configuration
206
- glightboxOptions: {
207
- loop: true,
208
- touchNavigation: true,
209
- closeOnOutsideClick: true
210
- }
211
- })
212
- ```
213
-
214
- ## FAQ
215
-
216
- **Q: Why isn't EXIF data showing?**
217
- A: Please check the following:
218
- 1. Does the image contain EXIF data? (Some compression tools strip EXIF)
219
- 2. EXIF data is only displayed when at least the exposure triangle (Focal Length, Aperture, Shutter Speed) is present.
220
-
221
- **Q: I only want to use Photosuite on certain images, what should I do?**
222
- A: You can precisely control the scope via CSS selectors (comma-separated for multiple selectors). For example, only take effect inside elements with ID `#main`:
223
-
224
- ```javascript
225
- photosuite({
226
- scope: '#main',
227
- // ... other configurations
228
- })
229
- ```
230
-
231
- ## Contributors
232
-
233
- One line of code, one plugin, for independent blogs, it is insignificant, like dust.
234
-
235
- But we insist on taking root in this soil, letting thought be free, and letting the soul rest!
236
-
237
- [![](https://contrib.rocks/image?repo=achuanya/photosuite)](https://github.com/achuanya/photosuite/graphs/contributors)
238
-
239
- ## Supporters
240
- [![Stargazers repo roster for @achuanya/photosuite](https://reporoster.com/stars/achuanya/photosuite)](https://github.com/achuanya/photosuite/stargazers)
241
-
242
- ## License
243
-
244
- [GPL-3.0](./LICENSE)
1
+ ![Sample Image](public/Wild-squirrel-feeding-interaction-with-hand-in-natural-forest.png)
2
+
3
+ # Photosuite
4
+
5
+ [Official Website](https://photosuite.lhasa.icu) • [Latest Release](https://github.com/achuanya/photosuite/releases) • [Changelog](https://github.com/achuanya/photosuite/main/Changelog.md) • [简体中文](./README.zh-CN.md)
6
+
7
+ Photosuite is a simple yet feature-rich image integration tailored for independent blogs. It modularly integrates lightbox, EXIF data, path resolution, and more into a single, zero-config package. Out of the box, no tedious configuration required—give your blog images a fresh look with just one line of code!
8
+
9
+ ## Features
10
+
11
+ * **Lightbox**: Customized and integrated GLightbox for a more minimalist and practical experience.
12
+ * **EXIF**: Integrated `exiftool-vendored.js` for fast execution and broad coverage.
13
+ * **Path Resolution**: Simply insert the filename, and it automatically resolves the absolute path.
14
+ * **Captions**: Automatically extracts the image's `alt` attribute to display as a caption.
15
+ * **Image Grid**: Automatically combines consecutive images (2-3) into a grid layout, each independently clickable.
16
+ * **Performance**: Purely static, modular features, loaded on demand.
17
+ * **Zero-Config Start**: Default settings satisfy most needs, while offering rich options for deep customization.
18
+
19
+ ## Installation
20
+
21
+ ```bash
22
+ pnpm add photosuite
23
+ # or
24
+ npm install photosuite
25
+ # or
26
+ yarn add photosuite
27
+ ```
28
+
29
+ ## Quick Start
30
+
31
+ Integrating Photosuite with Astro is very simple, just add the following configuration to `astro.config.js`:
32
+
33
+ ```javascript
34
+ import { defineConfig } from 'astro/config';
35
+ import photosuite from 'photosuite';
36
+ import "photosuite/dist/photosuite.css";
37
+
38
+ export default defineConfig({
39
+ integrations: [
40
+ photosuite({
41
+ // [Required] Specify the CSS selector for the scope
42
+ // Recommended: Your content container to avoid affecting other parts of the site. Supports multiple selectors separated by commas.
43
+ scope: '#main',
44
+ })
45
+ ]
46
+ });
47
+ ```
48
+
49
+ Once configured, Photosuite will automatically process all images in your Markdown/MDX files.
50
+
51
+ ## Features & Configuration
52
+
53
+ ### 1. Path Resolution
54
+
55
+ Managing image paths in blog posts can be tedious. Photosuite offers flexible resolution strategies that you can configure according to your needs.
56
+
57
+ **Scenario A: All images in a single domain/directory**
58
+
59
+ ```javascript
60
+ photosuite({
61
+ scope: '#main',
62
+ imageBase: 'https://cdn.example.com/images/',
63
+ })
64
+ ```
65
+
66
+ **Markdown Usage:**
67
+ ```markdown
68
+ ![My Photo](photo.jpg)
69
+ <!-- Resolves to: https://cdn.example.com/images/photo.jpg -->
70
+ ```
71
+
72
+ **Scenario B: Separate image directory per post (Default)**
73
+
74
+ You can specify the directory name in the Frontmatter:
75
+
76
+ ```yaml
77
+ ---
78
+ title: My First GitHub PR
79
+ imageDir: "2025-11-26-my-first-github-pr"
80
+ ---
81
+
82
+ ![My Photo](photo.jpg)
83
+ <!-- Resolves to: https://cdn.example.com/images/2025-11-26-my-first-github-pr/photo.jpg -->
84
+ ```
85
+
86
+ **Scenario C: Use filename as directory**
87
+
88
+ ```javascript
89
+ photosuite({
90
+ scope: '#main',
91
+ imageBase: 'https://cdn.example.com/',
92
+ fileDir: true, // Enable this option
93
+ })
94
+ ```
95
+
96
+ If your post filename is `2025-11-26-my-first-github-pr.md`, the image path automatically resolves to:
97
+
98
+ `https://cdn.example.com/images/2025-11-26-my-first-github-pr/photo.jpg`
99
+
100
+ ### 2. EXIF Data Display
101
+
102
+ Photosuite uses `exiftool-vendored.js` to extract information at build time.
103
+
104
+ **Default Configuration:**
105
+ Default display: Camera Model, Lens Model, Focal Length, Aperture, Shutter Speed, ISO, Date Original.
106
+
107
+ > NIKON Z 30 · NIKKOR Z DX 16-50mm f/3.5-6.3 VR · 20.5 mm · ƒ/3.8 · 1/15 · ISO 1000 · 2025/12/9
108
+
109
+ **Custom Configuration:**
110
+
111
+ ```javascript
112
+ photosuite({
113
+ // ...
114
+ exif: {
115
+ enabled: true,
116
+ // Custom fields: Focal Length, Aperture, Shutter Speed, ISO
117
+ fields: ['FocalLength', 'FNumber', 'ExposureTime', 'ISO'],
118
+ // Custom separator
119
+ separator: ' · '
120
+ }
121
+ })
122
+ ```
123
+
124
+ ### 3. Lightbox & Captions
125
+
126
+ GLightbox has been customized to differ slightly from the official version.
127
+
128
+ Supports native configuration, refer to: [GLightbox](https://github.com/achuanya/glightbox)
129
+
130
+ ```javascript
131
+ photosuite({
132
+ // ...
133
+ // Disable lightbox
134
+ glightbox: false,
135
+
136
+ // Disable captions
137
+ imageAlts: false,
138
+
139
+ // Pass native GLightbox options
140
+ glightboxOptions: {
141
+ loop: true,
142
+ zoomable: true,
143
+ }
144
+ })
145
+ ```
146
+
147
+ ### 4. Image Grid
148
+
149
+ Photosuite supports automatically combining consecutive images into a grid layout. When 2-3 images are placed adjacently in Markdown, they will be automatically combined into a grid, and each image remains independently clickable.
150
+
151
+ **Markdown Usage:**
152
+
153
+ Two-image grid:
154
+ ```markdown
155
+ ![Image 1](photo1.jpg)
156
+ ![Image 2](photo2.jpg)
157
+ ```
158
+
159
+ Three-image grid:
160
+ ```markdown
161
+ ![Image 1](photo1.jpg)
162
+ ![Image 2](photo2.jpg)
163
+ ![Image 3](photo3.jpg)
164
+ ```
165
+
166
+ **Features:**
167
+ - Automatically detects consecutive images (2-3 images)
168
+ - Each image has consistent width, evenly dividing the container
169
+ - Each image is independently clickable with lightbox support
170
+ - Interactive experience: Image zooms in slightly on hover
171
+ - Responsive design: automatically switches to single-column layout on mobile devices
172
+
173
+ **Configuration:**
174
+ ```javascript
175
+ photosuite({
176
+ // ...
177
+ // Disable image grid
178
+ imageGrid: false,
179
+ })
180
+ ```
181
+
182
+ ## Complete Configuration Reference
183
+
184
+ ### Parameter List
185
+
186
+ | Parameter | Type | Required | Default | Description |
187
+ | :--- | :--- | :---: | :--- | :--- |
188
+ | `scope` | `string` | ✅ | - | **Scope**. CSS selector, only processes images within this container. Supports multiple selectors separated by commas. |
189
+ | `selector` | `string` | ❌ | `"a.glightbox"` | **Image Selector**. Specifies which images need lightbox effect. |
190
+ | `imageBase` | `string` | ❌ | - | **Base Image URL**. Prefix used for splicing relative paths. |
191
+ | `imageDir` | `string` | ❌ | `"imageDir"` | **Directory Field Name**. Field name in Markdown Frontmatter to specify image subdirectory. |
192
+ | `fileDir` | `boolean` | ❌ | `false` | **Filename Archiving**. Whether to automatically use Markdown filename as image subdirectory. |
193
+ | `glightbox` | `boolean` | ❌ | `true` | **Enable Lightbox**. Whether to load GLightbox module. |
194
+ | `imageAlts` | `boolean` | ❌ | `true` | **Enable Captions**. Whether to display `alt` attribute as image caption. |
195
+ | `imageGrid` | `boolean` | ❌ | `true` | **Enable Image Grid**. Whether to combine consecutive images (2-3) into a grid layout. |
196
+ | `exif` | `boolean` \| `object` | ❌ | `true` | **Enable EXIF**. `false` to disable, `true` for default config, or pass object to customize via fields:[]. |
197
+ | `glightboxOptions` | `object` | ❌ | - | **Native Lightbox Config**. Configuration items passed through to GLightbox. |
198
+
199
+ ### Full Configuration Code Example
200
+
201
+ ```javascript
202
+ import photosuite from 'photosuite';
203
+ import "photosuite/dist/photosuite.css";
204
+
205
+ photosuite({
206
+ // ----------------
207
+ // Required
208
+ // ----------------
209
+ scope: '#main', // Your content container class name
210
+
211
+ // ----------------
212
+ // Optional (Values below are defaults)
213
+ // ----------------
214
+
215
+ // Basic Settings
216
+ selector: 'a.glightbox',
217
+
218
+ // Path Resolution
219
+ imageBase: '',
220
+ imageDir: 'imageDir',
221
+ fileDir: false,
222
+
223
+ // Feature Toggles
224
+ glightbox: true,
225
+ imageAlts: true,
226
+ imageGrid: true,
227
+
228
+ // EXIF Detailed Configuration
229
+ exif: {
230
+ enabled: true,
231
+ fields: [
232
+ 'Model', // Camera Model
233
+ 'LensModel', // Lens Model
234
+ 'FocalLength', // Focal Length
235
+ 'FNumber', // Aperture
236
+ 'ExposureTime', // Shutter Speed
237
+ 'ISO', // ISO
238
+ 'DateTimeOriginal' // Date Original
239
+ ],
240
+ separator: ' · ' // Separator
241
+ },
242
+
243
+ // Native GLightbox Configuration
244
+ glightboxOptions: {
245
+ loop: true,
246
+ touchNavigation: true,
247
+ closeOnOutsideClick: true
248
+ }
249
+ })
250
+ ```
251
+
252
+ ## FAQ
253
+
254
+ **Q: Why isn't EXIF data showing?**
255
+ A: Please check the following:
256
+ 1. Does the image contain EXIF data? (Some compression tools strip EXIF)
257
+ 2. EXIF data is only displayed when at least the exposure triangle (Focal Length, Aperture, Shutter Speed) is present.
258
+
259
+ **Q: I only want to use Photosuite on certain images, what should I do?**
260
+ A: You can precisely control the scope via CSS selectors (comma-separated for multiple selectors). For example, only take effect inside elements with ID `#main`:
261
+
262
+ ```javascript
263
+ photosuite({
264
+ scope: '#main',
265
+ // ... other configurations
266
+ })
267
+ ```
268
+
269
+ ## Contributors
270
+
271
+ One line of code, one plugin, for independent blogs, it is insignificant, like dust.
272
+
273
+ But we insist on taking root in this soil, letting thought be free, and letting the soul rest!
274
+
275
+ [![](https://contrib.rocks/image?repo=achuanya/photosuite)](https://github.com/achuanya/photosuite/graphs/contributors)
276
+
277
+ ## Supporters
278
+ [![Stargazers repo roster for @achuanya/photosuite](https://reporoster.com/stars/achuanya/photosuite)](https://github.com/achuanya/photosuite/stargazers)
279
+
280
+ ## License
281
+
282
+ [GPL-3.0](./LICENSE)
package/README.zh-CN.md CHANGED
@@ -12,6 +12,7 @@ Photosuite 是一款简单易用但功能丰富的图像插件,它将灯箱、
12
12
  * **EXIF**:集成 exiftool-vendored.js 执行快、覆盖广
13
13
  * **路径**:只需要插入文件名,自动补全绝对路径
14
14
  * **标题**:自动获取图片alt进行标题展示
15
+ * **拼图**:连续的图片(2-3张)自动组合成拼图布局,每张图片独立可点击
15
16
  * **性能**:纯静态,功能模块化,按需加载
16
17
  * **零配置启动**:默认配置即可满足绝大多数需求,同时也提供丰富的选项供深度定制
17
18
 
@@ -143,6 +144,41 @@ photosuite({
143
144
  })
144
145
  ```
145
146
 
147
+ ### 4. 图片拼图
148
+
149
+ Photosuite 支持自动将连续的图片组合成拼图布局。当 Markdown 中有 2-3 张图片紧挨着时,它们会自动组合成拼图,且每张图片都独立可点击。
150
+
151
+ **Markdown 写法:**
152
+
153
+ 两张图片拼图:
154
+ ```markdown
155
+ ![图片1](photo1.jpg)
156
+ ![图片2](photo2.jpg)
157
+ ```
158
+
159
+ 三张图片拼图:
160
+ ```markdown
161
+ ![图片1](photo1.jpg)
162
+ ![图片2](photo2.jpg)
163
+ ![图片3](photo3.jpg)
164
+ ```
165
+
166
+ **特性:**
167
+ - 自动检测连续的图片(2-3张)
168
+ - 每张图片宽度一致,均分容器宽度
169
+ - 每张图片独立可点击,都支持灯箱功能
170
+ - 交互体验:鼠标悬停时图片自动轻微放大
171
+ - 响应式设计:移动端自动切换为单列布局
172
+
173
+ **配置:**
174
+ ```javascript
175
+ photosuite({
176
+ // ...
177
+ // 关闭拼图功能
178
+ imageGrid: false,
179
+ })
180
+ ```
181
+
146
182
  ## 完整配置参考
147
183
 
148
184
  ### 参数列表
@@ -156,6 +192,7 @@ photosuite({
156
192
  | `fileDir` | `boolean` | ❌ | `false` | **文件名归档**。是否自动使用 Markdown 文件名作为图片子目录 |
157
193
  | `glightbox` | `boolean` | ❌ | `true` | **启用灯箱**。是否加载 GLightbox 模块 |
158
194
  | `imageAlts` | `boolean` | ❌ | `true` | **启用标题**。是否将 `alt` 属性显示为图片标题 |
195
+ | `imageGrid` | `boolean` | ❌ | `true` | **启用拼图**。是否将连续的图片(2-3张)组合成拼图布局 |
159
196
  | `exif` | `boolean` \| `object` | ❌ | `true` | **启用 EXIF**。可通过 fields:[] 配置显示选项 |
160
197
  | `glightboxOptions` | `object` | ❌ | - | **灯箱原生配置**。透传给 GLightbox 的配置项 |
161
198
 
@@ -186,6 +223,7 @@ photosuite({
186
223
  // 功能开关
187
224
  glightbox: true,
188
225
  imageAlts: true,
226
+ imageGrid: true,
189
227
 
190
228
  // EXIF 详细配置
191
229
  exif: {
@@ -0,0 +1 @@
1
+ function e(e){let t=e.parentElement;if(!t)return e;let n=e;e.tagName.toLowerCase()===`img`&&t&&t.tagName.toLowerCase()===`a`&&t.classList.contains(`glightbox`)&&(n=t);let r=n.parentElement;if(r&&r.classList.contains(`photosuite-item`))return r;let i=document.createElement(`div`);i.className=`photosuite-item`;let a=n.parentElement;return a?(a.replaceChild(i,n),i.appendChild(n),i):i}function t(t,n,r){let i=new Set,a=t=>{let n=e(t);i.has(n)||n.querySelector(`img`)&&(r(n),i.add(n))};document.querySelectorAll(t).forEach(e=>{e.querySelectorAll(n).forEach(a),e.querySelectorAll(`img`).forEach(a)})}function n(e){if(e.classList.contains(`photosuite-grid-member`)||e.querySelector(`.photosuite-caption`))return;let t=e.querySelector(`img`);if(!t)return;let n=String(t.getAttribute(`alt`)||``).trim();if(!n)return;let r=document.createElement(`div`);r.className=`photosuite-caption`,r.textContent=n,e.appendChild(r)}function r(e){if(e.classList.contains(`photosuite-grid-member`))return;let t=e.querySelector(`.photosuite-exif`);if(t){t.textContent?.trim()||t.remove();return}}Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return t}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return e}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return n}});
@@ -20,7 +20,7 @@ function processMedia(t, n, r) {
20
20
  });
21
21
  }
22
22
  function ensureCaption(e) {
23
- if (e.querySelector(".photosuite-caption")) return;
23
+ if (e.classList.contains("photosuite-grid-member") || e.querySelector(".photosuite-caption")) return;
24
24
  let t = e.querySelector("img");
25
25
  if (!t) return;
26
26
  let n = String(t.getAttribute("alt") || "").trim();
@@ -29,10 +29,11 @@ function ensureCaption(e) {
29
29
  r.className = "photosuite-caption", r.textContent = n, e.appendChild(r);
30
30
  }
31
31
  function ensureExif(e) {
32
+ if (e.classList.contains("photosuite-grid-member")) return;
32
33
  let t = e.querySelector(".photosuite-exif");
33
34
  if (t) {
34
35
  t.textContent?.trim() || t.remove();
35
36
  return;
36
37
  }
37
38
  }
38
- export { ensureExif as n, processMedia as r, ensureCaption as t };
39
+ export { processMedia as i, ensureExif as n, ensurePhotosuiteContainer as r, ensureCaption as t };
@@ -0,0 +1 @@
1
+ const e=require(`./dom-BS5TFy09.cjs`);async function t(t,n){await Promise.resolve().then(()=>require(`./exif-BUTZJSZv.cjs`)),e.i(t,n,t=>{e.n(t)})}exports.enableExif=t;
@@ -0,0 +1,7 @@
1
+ import { i as processMedia, n as ensureExif } from "./dom-D3_J5MTS.js";
2
+ async function enableExif(n, r) {
3
+ await Promise.resolve({ }), processMedia(n, r, (e) => {
4
+ ensureExif(e);
5
+ });
6
+ }
7
+ export { enableExif };
@@ -1,4 +1,4 @@
1
- import { r as processMedia, t as ensureCaption } from "./dom-CLdyQVUy.js";
1
+ import { i as processMedia, t as ensureCaption } from "./dom-D3_J5MTS.js";
2
2
  async function enableImageAlts(n, r) {
3
3
  await Promise.resolve({ }), processMedia(n, r, (e) => {
4
4
  ensureCaption(e);
@@ -0,0 +1 @@
1
+ const e=require(`./dom-BS5TFy09.cjs`);async function t(t,n){await Promise.resolve().then(()=>require(`./image-alts-DeER7mge.cjs`)),e.i(t,n,t=>{e.t(t)})}exports.enableImageAlts=t;
@@ -0,0 +1 @@
1
+ const e=require(`./dom-BS5TFy09.cjs`);async function t(e,t){await Promise.resolve().then(()=>require(`./image-grid-QuSPvblz.cjs`)),document.querySelectorAll(e).forEach(e=>{n(e)})}function n(t){let n=Array.from(t.querySelectorAll(`img`)),a=new Set;for(let t=0;t<n.length;t++){let o=n[t];if(a.has(o))continue;let s=[o];a.add(o);for(let i=t+1;i<n.length&&s.length<3;i++){let t=n[i];if(r(e.r(s[s.length-1]),e.r(t)))s.push(t),a.add(t);else break}s.length>=2&&i(s)}}function r(e,t){let n=e.parentElement;if(n!==t.parentElement||!n)return!1;let r=Array.from(n.children),i=r.indexOf(e);if(r.indexOf(t)!==i+1){let n=!1,r=e.nextSibling;for(;r&&r!==t;){if(r.nodeType===Node.ELEMENT_NODE){n=!0;break}if(r.nodeType===Node.TEXT_NODE&&r.textContent?.trim()){n=!0;break}r=r.nextSibling}return!n&&r===t}return!0}function i(t){if(t.length<2)return;let n=e.r(t[0]),r=n.parentElement;if(!r)return;let i=document.createElement(`div`);i.className=`photosuite-grid`,i.setAttribute(`data-grid-count`,String(t.length)),r.insertBefore(i,n);let o=[];t.forEach(t=>{let n=e.r(t);n.classList.add(`photosuite-grid-member`);let r=n.querySelector(`.photosuite-caption`),a=n.querySelector(`.photosuite-exif`);r&&r.remove(),a&&a.remove();let s=document.createElement(`div`);s.className=`photosuite-grid-item`,n.parentElement&&n.parentElement.removeChild(n),s.appendChild(n),i.appendChild(s),o.push(s)}),a(t,o)}async function a(e,t){let n=[];for(let t of e){let e=await o(t);n.push(e)}let r=n.reduce((e,t)=>e+t,0),i=t.length-1;t.forEach((e,t)=>{if(r>0){let a=n[t],o=`calc(${a/r*100}% - (${i} * var(--photosuite-grid-gap, 4px)) * ${a/r})`;e.style.flex=`0 0 ${o}`,e.style.maxWidth=o}})}function o(e){let t=parseFloat(e.getAttribute(`width`)||``),n=parseFloat(e.getAttribute(`height`)||``);return t&&n?t/n:e.complete&&e.naturalHeight?e.naturalWidth/e.naturalHeight:new Promise(t=>{if(e.complete){t(e.naturalHeight?e.naturalWidth/e.naturalHeight:1);return}let n=()=>{i(),t(e.naturalHeight?e.naturalWidth/e.naturalHeight:1)},r=()=>{i(),t(1)},i=()=>{e.removeEventListener(`load`,n),e.removeEventListener(`error`,r)};e.addEventListener(`load`,n),e.addEventListener(`error`,r)})}exports.enableImageGrid=t;