@hortonstudio/main 1.1.12 → 1.1.14

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.
@@ -13,7 +13,8 @@
13
13
  "WebFetch(domain:www.compassfacilities.com)",
14
14
  "mcp__webflow__pages_list",
15
15
  "Bash(npm publish:*)",
16
- "Bash(npm version:*)"
16
+ "Bash(npm version:*)",
17
+ "mcp__ide__getDiagnostics"
17
18
  ],
18
19
  "deny": []
19
20
  }
@@ -244,38 +244,6 @@ export async function init() {
244
244
  // Animation timeline
245
245
  document.fonts.ready.then(() => {
246
246
 
247
- // Helper function to extract span mappings and flatten HTML
248
- function extractSpanMappings(element) {
249
- const spanMappings = new Map();
250
- const spans = element.querySelectorAll('span');
251
-
252
- spans.forEach(span => {
253
- const text = span.textContent.trim();
254
- const classes = Array.from(span.classList);
255
- if (text && classes.length > 0) {
256
- spanMappings.set(text, classes);
257
- }
258
-
259
- // Replace span with its text content to flatten HTML
260
- span.replaceWith(document.createTextNode(span.textContent));
261
- });
262
-
263
- return spanMappings;
264
- }
265
-
266
- // Helper function to apply span classes to matching words
267
- function applySpanClasses(splitInstance, spanMappings) {
268
- if (!splitInstance.words || spanMappings.size === 0) return;
269
-
270
- splitInstance.words.forEach(wordElement => {
271
- const wordText = wordElement.textContent.trim();
272
- if (spanMappings.has(wordText)) {
273
- const classes = spanMappings.get(wordText);
274
- wordElement.classList.add(...classes);
275
- }
276
- });
277
- }
278
-
279
247
  // Split text setup (after fonts are loaded)
280
248
  headingSplits = [];
281
249
 
@@ -284,9 +252,6 @@ export async function init() {
284
252
  const textElement = heading[index];
285
253
  const splitType = parent.getAttribute('data-hs-heroconfig') || 'word';
286
254
 
287
- // Extract span mappings before splitting
288
- const spanMappings = extractSpanMappings(textElement);
289
-
290
255
  let splitConfig = {};
291
256
  let elementsClass = '';
292
257
 
@@ -294,25 +259,21 @@ export async function init() {
294
259
  splitConfig = {
295
260
  type: "words,chars",
296
261
  mask: "chars",
297
- charsClass: "char",
298
- reduceWhiteSpace: false
262
+ charsClass: "char"
299
263
  };
300
264
  elementsClass = 'chars';
301
265
  } else if (splitType === 'line') {
302
266
  splitConfig = {
303
- type: "lines,words",
267
+ type: "lines",
304
268
  mask: "lines",
305
- linesClass: "line",
306
- wordsClass: "word",
307
- reduceWhiteSpace: false
269
+ linesClass: "line"
308
270
  };
309
271
  elementsClass = 'lines';
310
272
  } else {
311
273
  splitConfig = {
312
274
  type: "words",
313
275
  mask: "words",
314
- wordsClass: "word",
315
- reduceWhiteSpace: false
276
+ wordsClass: "word"
316
277
  };
317
278
  elementsClass = 'words';
318
279
  }
@@ -321,9 +282,6 @@ export async function init() {
321
282
  split.elementsClass = elementsClass;
322
283
  headingSplits.push(split);
323
284
 
324
- // Apply span classes to matching words
325
- applySpanClasses(split, spanMappings);
326
-
327
285
  gsap.set(split[elementsClass], { yPercent: config.headingSplit.yPercent });
328
286
  gsap.set(textElement, { autoAlpha: 1 });
329
287
  });
@@ -335,9 +293,6 @@ export async function init() {
335
293
  const textElement = subheading[index];
336
294
  const splitType = parent.getAttribute('data-hs-heroconfig') || 'word';
337
295
 
338
- // Extract span mappings before splitting
339
- const spanMappings = extractSpanMappings(textElement);
340
-
341
296
  let splitConfig = {};
342
297
  let elementsClass = '';
343
298
 
@@ -345,25 +300,21 @@ export async function init() {
345
300
  splitConfig = {
346
301
  type: "words,chars",
347
302
  mask: "chars",
348
- charsClass: "char",
349
- reduceWhiteSpace: false
303
+ charsClass: "char"
350
304
  };
351
305
  elementsClass = 'chars';
352
306
  } else if (splitType === 'line') {
353
307
  splitConfig = {
354
- type: "lines,words",
308
+ type: "lines",
355
309
  mask: "lines",
356
- linesClass: "line",
357
- wordsClass: "word",
358
- reduceWhiteSpace: false
310
+ linesClass: "line"
359
311
  };
360
312
  elementsClass = 'lines';
361
313
  } else {
362
314
  splitConfig = {
363
315
  type: "words",
364
316
  mask: "words",
365
- wordsClass: "word",
366
- reduceWhiteSpace: false
317
+ wordsClass: "word"
367
318
  };
368
319
  elementsClass = 'words';
369
320
  }
@@ -372,9 +323,6 @@ export async function init() {
372
323
  split.elementsClass = elementsClass;
373
324
  subheadingSplits.push(split);
374
325
 
375
- // Apply span classes to matching words
376
- applySpanClasses(split, spanMappings);
377
-
378
326
  gsap.set(split[elementsClass], { yPercent: config.subheadingSplit.yPercent });
379
327
  gsap.set(textElement, { autoAlpha: 1 });
380
328
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hortonstudio/main",
3
- "version": "1.1.12",
3
+ "version": "1.1.14",
4
4
  "main": "index.js",
5
5
  "type": "module",
6
6
  "scripts": {
package/styles.css CHANGED
@@ -10,6 +10,12 @@ body .transition {display: block}
10
10
  padding-inline: .1em;
11
11
  margin-inline: -.1em;
12
12
  }
13
+
14
+ /* safari line detection fix */
15
+ [data-hs-hero="heading"] {
16
+ contain: layout style;
17
+ }
18
+
13
19
  /* scroll cleanliness */
14
20
  html, body {
15
21
  overscroll-behavior: none;
package/test-cdn.html DELETED
@@ -1,29 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <title>CDN Import Test</title>
5
- </head>
6
- <body>
7
- <h1>Testing CDN Module Loading</h1>
8
- <div data-hs-hero="heading">Hero Test Element</div>
9
-
10
- <script>
11
- // Test both local and CDN scenarios
12
- console.log('Testing module loading...');
13
-
14
- // Monitor console for debug messages
15
- window.addEventListener('load', () => {
16
- setTimeout(() => {
17
- if (window.hsmain) {
18
- console.log('API Status:', window.hsmain.status());
19
- } else {
20
- console.error('hsmain API not loaded');
21
- }
22
- }, 2000);
23
- });
24
- </script>
25
-
26
- <!-- Test with local file -->
27
- <script type="module" src="./index.js" data-hs-main data-hs-anim-hero></script>
28
- </body>
29
- </html>