@broxium/compiler 1.3.1 → 1.3.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/dist/index.js +13 -5
- package/dist/index.mjs +13 -5
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -117,7 +117,18 @@ import { createElement, Fragment, Children } from 'react';
|
|
|
117
117
|
var __islandSeq = 0;
|
|
118
118
|
function __nextIslandId() { return 'bi-' + (++__islandSeq) + '-' + Math.random().toString(36).slice(2,7); }
|
|
119
119
|
|
|
120
|
-
export function BrodoxImage({ src, alt, width, height, fill, className, style, priority, quality = 75, sizes }) {
|
|
120
|
+
export function BrodoxImage({ src, alt, width, height, fill, className, style, priority, quality = 75, sizes, direct = false }) {
|
|
121
|
+
const imgStyle = fill
|
|
122
|
+
? Object.assign({ position: 'absolute', inset: 0, width: '100%', height: '100%', objectFit: 'cover' }, style || {})
|
|
123
|
+
: (style || {});
|
|
124
|
+
if (direct) {
|
|
125
|
+
return createElement('img', {
|
|
126
|
+
src, alt: alt || '',
|
|
127
|
+
width: fill ? undefined : width, height: fill ? undefined : height,
|
|
128
|
+
loading: priority ? 'eager' : 'lazy', decoding: 'async',
|
|
129
|
+
className, style: imgStyle,
|
|
130
|
+
});
|
|
131
|
+
}
|
|
121
132
|
const maxW = width || 1920;
|
|
122
133
|
const widths = [320, 640, 768, 1024, 1280, 1920].filter(w => w <= maxW);
|
|
123
134
|
if (!widths.length) widths.push(maxW);
|
|
@@ -125,9 +136,6 @@ export function BrodoxImage({ src, alt, width, height, fill, className, style, p
|
|
|
125
136
|
const enc = encodeURIComponent(src);
|
|
126
137
|
const optimisedSrc = '/api/image?src=' + enc + '&w=' + maxW + '&q=' + q + '&fmt=webp';
|
|
127
138
|
const srcSet = widths.map(w => '/api/image?src=' + enc + '&w=' + w + '&q=' + q + '&fmt=webp ' + w + 'w').join(', ');
|
|
128
|
-
const imgStyle = fill
|
|
129
|
-
? Object.assign({ position: 'absolute', inset: 0, width: '100%', height: '100%', objectFit: 'cover' }, style || {})
|
|
130
|
-
: (style || {});
|
|
131
139
|
return createElement('img', {
|
|
132
140
|
src: optimisedSrc, srcSet, sizes, alt: alt || '',
|
|
133
141
|
width: fill ? undefined : width, height: fill ? undefined : height,
|
|
@@ -137,7 +145,7 @@ export function BrodoxImage({ src, alt, width, height, fill, className, style, p
|
|
|
137
145
|
}
|
|
138
146
|
|
|
139
147
|
export function BrodoxLink({ href, children, className, style }) {
|
|
140
|
-
return createElement('a', { href, className, style }, children);
|
|
148
|
+
return createElement('a', { href, className, style, 'data-brodox-link': true }, children);
|
|
141
149
|
}
|
|
142
150
|
|
|
143
151
|
export function useRouter() {
|
package/dist/index.mjs
CHANGED
|
@@ -88,7 +88,18 @@ import { createElement, Fragment, Children } from 'react';
|
|
|
88
88
|
var __islandSeq = 0;
|
|
89
89
|
function __nextIslandId() { return 'bi-' + (++__islandSeq) + '-' + Math.random().toString(36).slice(2,7); }
|
|
90
90
|
|
|
91
|
-
export function BrodoxImage({ src, alt, width, height, fill, className, style, priority, quality = 75, sizes }) {
|
|
91
|
+
export function BrodoxImage({ src, alt, width, height, fill, className, style, priority, quality = 75, sizes, direct = false }) {
|
|
92
|
+
const imgStyle = fill
|
|
93
|
+
? Object.assign({ position: 'absolute', inset: 0, width: '100%', height: '100%', objectFit: 'cover' }, style || {})
|
|
94
|
+
: (style || {});
|
|
95
|
+
if (direct) {
|
|
96
|
+
return createElement('img', {
|
|
97
|
+
src, alt: alt || '',
|
|
98
|
+
width: fill ? undefined : width, height: fill ? undefined : height,
|
|
99
|
+
loading: priority ? 'eager' : 'lazy', decoding: 'async',
|
|
100
|
+
className, style: imgStyle,
|
|
101
|
+
});
|
|
102
|
+
}
|
|
92
103
|
const maxW = width || 1920;
|
|
93
104
|
const widths = [320, 640, 768, 1024, 1280, 1920].filter(w => w <= maxW);
|
|
94
105
|
if (!widths.length) widths.push(maxW);
|
|
@@ -96,9 +107,6 @@ export function BrodoxImage({ src, alt, width, height, fill, className, style, p
|
|
|
96
107
|
const enc = encodeURIComponent(src);
|
|
97
108
|
const optimisedSrc = '/api/image?src=' + enc + '&w=' + maxW + '&q=' + q + '&fmt=webp';
|
|
98
109
|
const srcSet = widths.map(w => '/api/image?src=' + enc + '&w=' + w + '&q=' + q + '&fmt=webp ' + w + 'w').join(', ');
|
|
99
|
-
const imgStyle = fill
|
|
100
|
-
? Object.assign({ position: 'absolute', inset: 0, width: '100%', height: '100%', objectFit: 'cover' }, style || {})
|
|
101
|
-
: (style || {});
|
|
102
110
|
return createElement('img', {
|
|
103
111
|
src: optimisedSrc, srcSet, sizes, alt: alt || '',
|
|
104
112
|
width: fill ? undefined : width, height: fill ? undefined : height,
|
|
@@ -108,7 +116,7 @@ export function BrodoxImage({ src, alt, width, height, fill, className, style, p
|
|
|
108
116
|
}
|
|
109
117
|
|
|
110
118
|
export function BrodoxLink({ href, children, className, style }) {
|
|
111
|
-
return createElement('a', { href, className, style }, children);
|
|
119
|
+
return createElement('a', { href, className, style, 'data-brodox-link': true }, children);
|
|
112
120
|
}
|
|
113
121
|
|
|
114
122
|
export function useRouter() {
|