@hanzo/ui 8.4.13 → 8.5.1
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/backends/gui/index.cjs +11 -1
- package/dist/backends/gui/index.d.ts +3 -0
- package/dist/backends/gui/index.d.ts.map +1 -1
- package/dist/backends/gui/index.js +3 -0
- package/dist/backends/gui/index.js.map +1 -1
- package/dist/backends/gui/link.cjs +126 -0
- package/dist/backends/gui/link.d.ts +65 -0
- package/dist/backends/gui/link.d.ts.map +1 -0
- package/dist/backends/gui/link.js +88 -0
- package/dist/backends/gui/link.js.map +1 -0
- package/dist/backends/gui/prose.cjs +33 -0
- package/dist/backends/gui/prose.d.ts +39 -0
- package/dist/backends/gui/prose.d.ts.map +1 -0
- package/dist/backends/gui/prose.js +30 -0
- package/dist/backends/gui/prose.js.map +1 -0
- package/dist/backends/gui/video.cjs +89 -0
- package/dist/backends/gui/video.d.ts +33 -0
- package/dist/backends/gui/video.d.ts.map +1 -0
- package/dist/backends/gui/video.js +53 -0
- package/dist/backends/gui/video.js.map +1 -0
- package/dist/blocks/accordian.cjs +19 -0
- package/dist/blocks/accordian.d.ts +4 -0
- package/dist/blocks/accordian.d.ts.map +1 -0
- package/dist/blocks/accordian.js +16 -0
- package/dist/blocks/accordian.js.map +1 -0
- package/dist/blocks/bullet-cards.cjs +40 -0
- package/dist/blocks/bullet-cards.d.ts +10 -0
- package/dist/blocks/bullet-cards.d.ts.map +1 -0
- package/dist/blocks/bullet-cards.js +37 -0
- package/dist/blocks/bullet-cards.js.map +1 -0
- package/dist/blocks/card.cjs +58 -0
- package/dist/blocks/card.d.ts +14 -0
- package/dist/blocks/card.d.ts.map +1 -0
- package/dist/blocks/card.js +55 -0
- package/dist/blocks/card.js.map +1 -0
- package/dist/blocks/carte-blanche.cjs +38 -0
- package/dist/blocks/carte-blanche.d.ts +13 -0
- package/dist/blocks/carte-blanche.d.ts.map +1 -0
- package/dist/blocks/carte-blanche.js +35 -0
- package/dist/blocks/carte-blanche.js.map +1 -0
- package/dist/blocks/content.cjs +65 -0
- package/dist/blocks/content.d.ts +11 -0
- package/dist/blocks/content.d.ts.map +1 -0
- package/dist/blocks/content.js +61 -0
- package/dist/blocks/content.js.map +1 -0
- package/dist/blocks/cta.cjs +103 -0
- package/dist/blocks/cta.d.ts +13 -0
- package/dist/blocks/cta.d.ts.map +1 -0
- package/dist/blocks/cta.js +67 -0
- package/dist/blocks/cta.js.map +1 -0
- package/dist/blocks/def.cjs +24 -0
- package/dist/blocks/def.d.ts +191 -0
- package/dist/blocks/def.d.ts.map +1 -0
- package/dist/blocks/def.js +22 -0
- package/dist/blocks/def.js.map +1 -0
- package/dist/blocks/enh-heading.cjs +86 -0
- package/dist/blocks/enh-heading.d.ts +7 -0
- package/dist/blocks/enh-heading.d.ts.map +1 -0
- package/dist/blocks/enh-heading.js +83 -0
- package/dist/blocks/enh-heading.js.map +1 -0
- package/dist/blocks/grid.cjs +98 -0
- package/dist/blocks/grid.d.ts +18 -0
- package/dist/blocks/grid.d.ts.map +1 -0
- package/dist/blocks/grid.js +62 -0
- package/dist/blocks/grid.js.map +1 -0
- package/dist/blocks/group.cjs +43 -0
- package/dist/blocks/group.d.ts +4 -0
- package/dist/blocks/group.d.ts.map +1 -0
- package/dist/blocks/group.js +40 -0
- package/dist/blocks/group.js.map +1 -0
- package/dist/blocks/heading.cjs +22 -0
- package/dist/blocks/heading.d.ts +4 -0
- package/dist/blocks/heading.d.ts.map +1 -0
- package/dist/blocks/heading.js +19 -0
- package/dist/blocks/heading.js.map +1 -0
- package/dist/blocks/image.cjs +54 -0
- package/dist/blocks/image.d.ts +19 -0
- package/dist/blocks/image.d.ts.map +1 -0
- package/dist/blocks/image.js +51 -0
- package/dist/blocks/image.js.map +1 -0
- package/dist/blocks/index.cjs +65 -0
- package/dist/blocks/index.d.ts +18 -0
- package/dist/blocks/index.d.ts.map +1 -0
- package/dist/blocks/index.js +30 -0
- package/dist/blocks/index.js.map +1 -0
- package/dist/blocks/screenful.cjs +139 -0
- package/dist/blocks/screenful.d.ts +18 -0
- package/dist/blocks/screenful.d.ts.map +1 -0
- package/dist/blocks/screenful.js +103 -0
- package/dist/blocks/screenful.js.map +1 -0
- package/dist/blocks/space.cjs +38 -0
- package/dist/blocks/space.d.ts +4 -0
- package/dist/blocks/space.d.ts.map +1 -0
- package/dist/blocks/space.js +35 -0
- package/dist/blocks/space.js.map +1 -0
- package/dist/blocks/spec.cjs +58 -0
- package/dist/blocks/spec.d.ts +60 -0
- package/dist/blocks/spec.d.ts.map +1 -0
- package/dist/blocks/spec.js +52 -0
- package/dist/blocks/spec.js.map +1 -0
- package/dist/blocks/video.cjs +103 -0
- package/dist/blocks/video.d.ts +22 -0
- package/dist/blocks/video.d.ts.map +1 -0
- package/dist/blocks/video.js +67 -0
- package/dist/blocks/video.js.map +1 -0
- package/dist/gallery.html +102 -1
- package/dist/index.cjs +9 -2
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.node.js +1 -1
- package/dist/primitives/ApplyTypography.cjs +8 -0
- package/dist/primitives/ApplyTypography.d.ts +2 -0
- package/dist/primitives/ApplyTypography.d.ts.map +1 -0
- package/dist/primitives/ApplyTypography.js +5 -0
- package/dist/primitives/ApplyTypography.js.map +1 -0
- package/dist/primitives/Link.cjs +8 -0
- package/dist/primitives/Link.d.ts +2 -0
- package/dist/primitives/Link.d.ts.map +1 -0
- package/dist/primitives/Link.js +5 -0
- package/dist/primitives/Link.js.map +1 -0
- package/dist/primitives/LinkElement.cjs +8 -0
- package/dist/primitives/LinkElement.d.ts +2 -0
- package/dist/primitives/LinkElement.d.ts.map +1 -0
- package/dist/primitives/LinkElement.js +5 -0
- package/dist/primitives/LinkElement.js.map +1 -0
- package/dist/primitives/MDXLink.cjs +8 -0
- package/dist/primitives/MDXLink.d.ts +2 -0
- package/dist/primitives/MDXLink.d.ts.map +1 -0
- package/dist/primitives/MDXLink.js +5 -0
- package/dist/primitives/MDXLink.js.map +1 -0
- package/dist/primitives/VideoPlayer.cjs +8 -0
- package/dist/primitives/VideoPlayer.d.ts +2 -0
- package/dist/primitives/VideoPlayer.d.ts.map +1 -0
- package/dist/primitives/VideoPlayer.js +5 -0
- package/dist/primitives/VideoPlayer.js.map +1 -0
- package/dist/primitives/YouTubeEmbed.cjs +8 -0
- package/dist/primitives/YouTubeEmbed.d.ts +2 -0
- package/dist/primitives/YouTubeEmbed.d.ts.map +1 -0
- package/dist/primitives/YouTubeEmbed.js +5 -0
- package/dist/primitives/YouTubeEmbed.js.map +1 -0
- package/dist/primitives/useLink.cjs +8 -0
- package/dist/primitives/useLink.d.ts +2 -0
- package/dist/primitives/useLink.d.ts.map +1 -0
- package/dist/primitives/useLink.js +5 -0
- package/dist/primitives/useLink.js.map +1 -0
- package/dist/product/menu/items.d.ts +1 -1
- package/dist/product/menu/items.d.ts.map +1 -1
- package/dist/styles.css +101 -0
- package/dist/theme.css +101 -0
- package/dist/tw.cjs +62 -1
- package/dist/tw.d.ts.map +1 -1
- package/dist/tw.js +62 -1
- package/dist/tw.js.map +1 -1
- package/dist/types.cjs +32 -0
- package/dist/types.d.ts +136 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +30 -0
- package/dist/types.js.map +1 -0
- package/package.json +13 -1
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
'use client';import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { AccordianBlockComponent } from './accordian.js';
|
|
3
|
+
import { BulletCardsBlockComponent } from './bullet-cards.js';
|
|
4
|
+
import { CardBlockComponent } from './card.js';
|
|
5
|
+
import { CarteBlancheBlockComponent } from './carte-blanche.js';
|
|
6
|
+
import { CTABlockComponent } from './cta.js';
|
|
7
|
+
import { EnhHeadingBlockComponent } from './enh-heading.js';
|
|
8
|
+
import { GridBlockComponent } from './grid.js';
|
|
9
|
+
import { GroupBlockComponent } from './group.js';
|
|
10
|
+
import { HeadingBlockComponent } from './heading.js';
|
|
11
|
+
import { ImageBlockComponent } from './image.js';
|
|
12
|
+
import { SpaceBlockComponent } from './space.js';
|
|
13
|
+
import { VideoBlockComponent } from './video.js';
|
|
14
|
+
/**
|
|
15
|
+
* `blockType` → renderer.
|
|
16
|
+
*
|
|
17
|
+
* A Map rather than a switch because it is also the extension point: a host
|
|
18
|
+
* calls `registerBlockType` to add a type of its own, or to replace one of
|
|
19
|
+
* these — which is how a Next app substitutes its optimizing image, and how
|
|
20
|
+
* anything the library does not ship reaches the page.
|
|
21
|
+
*/
|
|
22
|
+
const map = new Map([
|
|
23
|
+
['accordian', AccordianBlockComponent],
|
|
24
|
+
['bullet-cards', BulletCardsBlockComponent],
|
|
25
|
+
['card', CardBlockComponent],
|
|
26
|
+
['carte-blanche', CarteBlancheBlockComponent],
|
|
27
|
+
['cta', CTABlockComponent],
|
|
28
|
+
['enh-heading', EnhHeadingBlockComponent],
|
|
29
|
+
['grid', GridBlockComponent],
|
|
30
|
+
['group', GroupBlockComponent],
|
|
31
|
+
['heading', HeadingBlockComponent],
|
|
32
|
+
['image', ImageBlockComponent],
|
|
33
|
+
['space', SpaceBlockComponent],
|
|
34
|
+
['video', VideoBlockComponent],
|
|
35
|
+
]);
|
|
36
|
+
export const registerBlockType = (key, type) => {
|
|
37
|
+
map.set(key, type);
|
|
38
|
+
};
|
|
39
|
+
/**
|
|
40
|
+
* `element` is the one type with no renderer, by design: it carries a node the
|
|
41
|
+
* author already built, so rendering it means handing it back. That is what
|
|
42
|
+
* makes a page of blocks able to hold anything at all.
|
|
43
|
+
*/
|
|
44
|
+
const one = (block, className, agent, key) => {
|
|
45
|
+
if (block.blockType === 'element')
|
|
46
|
+
return block.element;
|
|
47
|
+
const Comp = map.get(block.blockType);
|
|
48
|
+
if (!Comp)
|
|
49
|
+
return null;
|
|
50
|
+
return _jsx(Comp, { block: block, className: className, agent: agent }, key);
|
|
51
|
+
};
|
|
52
|
+
export const Content = ({ blocks, className, agent, }) => {
|
|
53
|
+
if (!blocks)
|
|
54
|
+
return null;
|
|
55
|
+
if (Array.isArray(blocks)) {
|
|
56
|
+
return (_jsx(_Fragment, { children: blocks.map((b, i) => one(b, className, agent, `${b.blockType}-${i}`)) }));
|
|
57
|
+
}
|
|
58
|
+
return _jsx(_Fragment, { children: one(blocks, className, agent) });
|
|
59
|
+
};
|
|
60
|
+
export default Content;
|
|
61
|
+
//# sourceMappingURL=content.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"content.js","sourceRoot":"","sources":["../../src/blocks/content.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAA;AACrD,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAA;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAA;AAC3C,OAAO,EAAE,0BAA0B,EAAE,MAAM,iBAAiB,CAAA;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAA;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAA;AAC3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAA;AACjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAE7C;;;;;;;GAOG;AACH,MAAM,GAAG,GAAG,IAAI,GAAG,CAAmD;IACpE,CAAC,WAAW,EAAE,uBAAuB,CAAC;IACtC,CAAC,cAAc,EAAE,yBAAyB,CAAC;IAC3C,CAAC,MAAM,EAAE,kBAAkB,CAAC;IAC5B,CAAC,eAAe,EAAE,0BAA0B,CAAC;IAC7C,CAAC,KAAK,EAAE,iBAAiB,CAAC;IAC1B,CAAC,aAAa,EAAE,wBAAwB,CAAC;IACzC,CAAC,MAAM,EAAE,kBAAkB,CAAC;IAC5B,CAAC,OAAO,EAAE,mBAAmB,CAAC;IAC9B,CAAC,SAAS,EAAE,qBAAqB,CAAC;IAClC,CAAC,OAAO,EAAE,mBAAmB,CAAC;IAC9B,CAAC,OAAO,EAAE,mBAAmB,CAAC;IAC9B,CAAC,OAAO,EAAE,mBAAmB,CAAC;CAC/B,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAC/B,GAAW,EACX,IAA8C,EACxC,EAAE;IACR,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,CAAA;AACpB,CAAC,CAAA;AAED;;;;GAIG;AACH,MAAM,GAAG,GAAG,CAAC,KAAY,EAAE,SAAkB,EAAE,KAAc,EAAE,GAAY,EAAmB,EAAE;IAC9F,IAAI,KAAK,CAAC,SAAS,KAAK,SAAS;QAAE,OAAQ,KAAsB,CAAC,OAAO,CAAA;IACzE,MAAM,IAAI,GAAG,GAAG,CAAC,GAAG,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IACrC,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAA;IACtB,OAAO,KAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,IAAO,GAAG,CAAI,CAAA;AAC7E,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,MAAM,EACN,SAAS,EACT,KAAK,GAKN,EAAE,EAAE;IACH,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAA;IACxB,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC;QAC1B,OAAO,CACL,4BACG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,SAAS,IAAI,CAAC,EAAE,CAAC,CAAC,GACrE,CACJ,CAAA;IACH,CAAC;IACD,OAAO,4BAAG,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,CAAC,GAAI,CAAA;AAC7C,CAAC,CAAA;AAED,eAAe,OAAO,CAAA"}
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
'use client';"use strict";
|
|
2
|
+
'use client';
|
|
3
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
4
|
+
if (k2 === undefined) k2 = k;
|
|
5
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
6
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
7
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
8
|
+
}
|
|
9
|
+
Object.defineProperty(o, k2, desc);
|
|
10
|
+
}) : (function(o, m, k, k2) {
|
|
11
|
+
if (k2 === undefined) k2 = k;
|
|
12
|
+
o[k2] = m[k];
|
|
13
|
+
}));
|
|
14
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
15
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
16
|
+
}) : function(o, v) {
|
|
17
|
+
o["default"] = v;
|
|
18
|
+
});
|
|
19
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
20
|
+
var ownKeys = function(o) {
|
|
21
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
22
|
+
var ar = [];
|
|
23
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
24
|
+
return ar;
|
|
25
|
+
};
|
|
26
|
+
return ownKeys(o);
|
|
27
|
+
};
|
|
28
|
+
return function (mod) {
|
|
29
|
+
if (mod && mod.__esModule) return mod;
|
|
30
|
+
var result = {};
|
|
31
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
32
|
+
__setModuleDefault(result, mod);
|
|
33
|
+
return result;
|
|
34
|
+
};
|
|
35
|
+
})();
|
|
36
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
|
+
exports.CTABlockComponent = void 0;
|
|
38
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
39
|
+
const React = __importStar(require("react"));
|
|
40
|
+
const link_1 = require("../backends/gui/link.cjs");
|
|
41
|
+
const box_1 = require("../box.cjs");
|
|
42
|
+
const cn_1 = require("../core/cn.cjs");
|
|
43
|
+
const spec_1 = require("./spec.cjs");
|
|
44
|
+
/**
|
|
45
|
+
* A button whose action is a modal.
|
|
46
|
+
*
|
|
47
|
+
* `ButtonDef` carries the modal COMPONENT rather than a modal, so the library
|
|
48
|
+
* never has to know what the app's dialog is: this opens it, closes it, and
|
|
49
|
+
* hands it the action to run. The 5.x line shipped this file empty, so every
|
|
50
|
+
* `ButtonDef` in a cta rendered nothing at all.
|
|
51
|
+
*/
|
|
52
|
+
const ActionButton = ({ def, size, className, }) => {
|
|
53
|
+
const [open, setOpen] = React.useState(false);
|
|
54
|
+
const modal = def.action.def;
|
|
55
|
+
const { Comp } = modal;
|
|
56
|
+
return ((0, jsx_runtime_1.jsx)(Comp, { open: open, onOpenChange: setOpen, buttonText: def.text, buttonProps: { ...def.props, ...(size ? { size } : {}), className }, title: modal.title, byline: modal.byline, action: modal.action ?? (async () => undefined), actionEnclosure: modal.actionEnclosure }));
|
|
57
|
+
};
|
|
58
|
+
/** A def with a `title` is a link; anything else is a button. */
|
|
59
|
+
const isLink = (e) => 'title' in e || 'href' in e;
|
|
60
|
+
const CTABlockComponent = ({ block, className, itemClasses, itemSize, renderLink, renderButton, agent, }) => {
|
|
61
|
+
if (block.blockType !== 'cta')
|
|
62
|
+
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "cta block required" });
|
|
63
|
+
const { elements, specifiers } = block;
|
|
64
|
+
const spec = (s) => (0, spec_1.has)(specifiers, s);
|
|
65
|
+
const justify = spec('fill')
|
|
66
|
+
? 'w-full'
|
|
67
|
+
: spec('left')
|
|
68
|
+
? 'md:justify-start'
|
|
69
|
+
: spec('right')
|
|
70
|
+
? 'md:justify-end'
|
|
71
|
+
: 'md:justify-center';
|
|
72
|
+
const twoUp = spec('mobile-2-columns');
|
|
73
|
+
const fillEvenly = !spec('desktop-dont-fill');
|
|
74
|
+
const centerFirst = spec('mobile-center-first-if-odd');
|
|
75
|
+
const oddFullWidth = spec('mobile-odd-full-width');
|
|
76
|
+
let layout = 'flex flex-col items-stretch gap-2 self-stretch md:flex-row sm:justify-center';
|
|
77
|
+
let item = spec('fill') ? 'grow shrink min-w-0' : '';
|
|
78
|
+
if (elements.length > 1) {
|
|
79
|
+
if (twoUp || fillEvenly) {
|
|
80
|
+
layout = 'grid grid-cols-2 gap-2 self-stretch';
|
|
81
|
+
item += ' min-w-0';
|
|
82
|
+
}
|
|
83
|
+
else {
|
|
84
|
+
layout = 'flex flex-row justify-center';
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
/** With an odd count in two columns, one element spans both. */
|
|
88
|
+
const span = (i, total) => {
|
|
89
|
+
if (!(agent === 'phone' && twoUp))
|
|
90
|
+
return '';
|
|
91
|
+
const centred = total % 2 === 0 ? -1 : centerFirst ? 0 : total - 1;
|
|
92
|
+
return i === centred ? `col-span-2 ${oddFullWidth ? 'w-full' : 'w-3/5 mx-auto'}` : '';
|
|
93
|
+
};
|
|
94
|
+
return ((0, jsx_runtime_1.jsx)(box_1.Box, { className: (0, cn_1.cn)(layout, justify, className), children: elements.map((element, i) => {
|
|
95
|
+
const extra = (0, cn_1.cn)(item, itemClasses, span(i, elements.length));
|
|
96
|
+
if (isLink(element)) {
|
|
97
|
+
return renderLink ? (renderLink(element, i)) : ((0, jsx_runtime_1.jsx)(link_1.LinkElement, { def: element, size: itemSize, className: extra }, i));
|
|
98
|
+
}
|
|
99
|
+
return renderButton ? (renderButton(element, i)) : ((0, jsx_runtime_1.jsx)(ActionButton, { def: element, size: itemSize, className: extra }, i));
|
|
100
|
+
}) }));
|
|
101
|
+
};
|
|
102
|
+
exports.CTABlockComponent = CTABlockComponent;
|
|
103
|
+
exports.default = exports.CTABlockComponent;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { ButtonSize } from '../backends/gui/button.js';
|
|
3
|
+
import type { ButtonDef, LinkDef } from '../types.js';
|
|
4
|
+
import { type BlockComponentProps } from './spec.js';
|
|
5
|
+
export declare const CTABlockComponent: ({ block, className, itemClasses, itemSize, renderLink, renderButton, agent, }: BlockComponentProps & {
|
|
6
|
+
itemClasses?: string;
|
|
7
|
+
/** Overrides the size in each def. */
|
|
8
|
+
itemSize?: ButtonSize | null;
|
|
9
|
+
renderLink?: (def: LinkDef, key: number) => React.ReactElement;
|
|
10
|
+
renderButton?: (def: ButtonDef, key: number) => React.ReactElement;
|
|
11
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export default CTABlockComponent;
|
|
13
|
+
//# sourceMappingURL=cta.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cta.d.ts","sourceRoot":"","sources":["../../src/blocks/cta.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AACxD,OAAO,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAElD,OAAO,EAAE,KAAK,mBAAmB,EAAO,MAAM,QAAQ,CAAA;AAuCtD,eAAO,MAAM,iBAAiB,kFAQ3B,mBAAmB,GAAG;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,UAAU,GAAG,IAAI,CAAA;IAC5B,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,KAAK,CAAC,YAAY,CAAA;IAC9D,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,KAAK,KAAK,CAAC,YAAY,CAAA;CACnE,4CAyDA,CAAA;eAEc,iBAAiB"}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { LinkElement } from '../backends/gui/link.js';
|
|
5
|
+
import { Box } from '../box.js';
|
|
6
|
+
import { cn } from '../core/cn.js';
|
|
7
|
+
import { has } from './spec.js';
|
|
8
|
+
/**
|
|
9
|
+
* A button whose action is a modal.
|
|
10
|
+
*
|
|
11
|
+
* `ButtonDef` carries the modal COMPONENT rather than a modal, so the library
|
|
12
|
+
* never has to know what the app's dialog is: this opens it, closes it, and
|
|
13
|
+
* hands it the action to run. The 5.x line shipped this file empty, so every
|
|
14
|
+
* `ButtonDef` in a cta rendered nothing at all.
|
|
15
|
+
*/
|
|
16
|
+
const ActionButton = ({ def, size, className, }) => {
|
|
17
|
+
const [open, setOpen] = React.useState(false);
|
|
18
|
+
const modal = def.action.def;
|
|
19
|
+
const { Comp } = modal;
|
|
20
|
+
return (_jsx(Comp, { open: open, onOpenChange: setOpen, buttonText: def.text, buttonProps: { ...def.props, ...(size ? { size } : {}), className }, title: modal.title, byline: modal.byline, action: modal.action ?? (async () => undefined), actionEnclosure: modal.actionEnclosure }));
|
|
21
|
+
};
|
|
22
|
+
/** A def with a `title` is a link; anything else is a button. */
|
|
23
|
+
const isLink = (e) => 'title' in e || 'href' in e;
|
|
24
|
+
export const CTABlockComponent = ({ block, className, itemClasses, itemSize, renderLink, renderButton, agent, }) => {
|
|
25
|
+
if (block.blockType !== 'cta')
|
|
26
|
+
return _jsx(_Fragment, { children: "cta block required" });
|
|
27
|
+
const { elements, specifiers } = block;
|
|
28
|
+
const spec = (s) => has(specifiers, s);
|
|
29
|
+
const justify = spec('fill')
|
|
30
|
+
? 'w-full'
|
|
31
|
+
: spec('left')
|
|
32
|
+
? 'md:justify-start'
|
|
33
|
+
: spec('right')
|
|
34
|
+
? 'md:justify-end'
|
|
35
|
+
: 'md:justify-center';
|
|
36
|
+
const twoUp = spec('mobile-2-columns');
|
|
37
|
+
const fillEvenly = !spec('desktop-dont-fill');
|
|
38
|
+
const centerFirst = spec('mobile-center-first-if-odd');
|
|
39
|
+
const oddFullWidth = spec('mobile-odd-full-width');
|
|
40
|
+
let layout = 'flex flex-col items-stretch gap-2 self-stretch md:flex-row sm:justify-center';
|
|
41
|
+
let item = spec('fill') ? 'grow shrink min-w-0' : '';
|
|
42
|
+
if (elements.length > 1) {
|
|
43
|
+
if (twoUp || fillEvenly) {
|
|
44
|
+
layout = 'grid grid-cols-2 gap-2 self-stretch';
|
|
45
|
+
item += ' min-w-0';
|
|
46
|
+
}
|
|
47
|
+
else {
|
|
48
|
+
layout = 'flex flex-row justify-center';
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
/** With an odd count in two columns, one element spans both. */
|
|
52
|
+
const span = (i, total) => {
|
|
53
|
+
if (!(agent === 'phone' && twoUp))
|
|
54
|
+
return '';
|
|
55
|
+
const centred = total % 2 === 0 ? -1 : centerFirst ? 0 : total - 1;
|
|
56
|
+
return i === centred ? `col-span-2 ${oddFullWidth ? 'w-full' : 'w-3/5 mx-auto'}` : '';
|
|
57
|
+
};
|
|
58
|
+
return (_jsx(Box, { className: cn(layout, justify, className), children: elements.map((element, i) => {
|
|
59
|
+
const extra = cn(item, itemClasses, span(i, elements.length));
|
|
60
|
+
if (isLink(element)) {
|
|
61
|
+
return renderLink ? (renderLink(element, i)) : (_jsx(LinkElement, { def: element, size: itemSize, className: extra }, i));
|
|
62
|
+
}
|
|
63
|
+
return renderButton ? (renderButton(element, i)) : (_jsx(ActionButton, { def: element, size: itemSize, className: extra }, i));
|
|
64
|
+
}) }));
|
|
65
|
+
};
|
|
66
|
+
export default CTABlockComponent;
|
|
67
|
+
//# sourceMappingURL=cta.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cta.js","sourceRoot":"","sources":["../../src/blocks/cta.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
'use client';"use strict";
|
|
2
|
+
// The block vocabulary — what a site AUTHORS, with no renderer attached.
|
|
3
|
+
//
|
|
4
|
+
// A block is data: `blockType` picks the renderer, and the rest of the fields
|
|
5
|
+
// are that renderer's input. So a page is a `Block[]` that can be written in a
|
|
6
|
+
// CMS, checked into a repo, or produced by a server, and typed either way.
|
|
7
|
+
//
|
|
8
|
+
// Every `specifiers` field is a space-separated bag of layout hints read by the
|
|
9
|
+
// matching component. It is deliberately a string rather than a union: a site
|
|
10
|
+
// adds a hint by typing one, and an unrecognised hint is ignored rather than
|
|
11
|
+
// failing the build.
|
|
12
|
+
//
|
|
13
|
+
// Flat, for the reason given in ../types: the 5.x line spread these over
|
|
14
|
+
// sixteen files exporting `default`, so the imported name was never the name the
|
|
15
|
+
// file declared.
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
exports.SPACE_DEFAULTS = void 0;
|
|
18
|
+
exports.SPACE_DEFAULTS = {
|
|
19
|
+
xs: 2,
|
|
20
|
+
sm: 4,
|
|
21
|
+
md: 5,
|
|
22
|
+
lg: 6,
|
|
23
|
+
xl: 8,
|
|
24
|
+
};
|
|
@@ -0,0 +1,191 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
import type { Breakpoint, BulletItem, ButtonDef, GridDef, ImageDef, LinkDef, VideoDef } from '../types.js';
|
|
3
|
+
/** Every block is at least this: a tag naming which renderer reads the rest. */
|
|
4
|
+
export interface Block {
|
|
5
|
+
blockType: string;
|
|
6
|
+
}
|
|
7
|
+
export interface ElementBlock extends Block {
|
|
8
|
+
blockType: 'element';
|
|
9
|
+
element: ReactNode;
|
|
10
|
+
}
|
|
11
|
+
export interface HeadingBlock extends Block {
|
|
12
|
+
blockType: 'heading';
|
|
13
|
+
heading: string;
|
|
14
|
+
byline?: string;
|
|
15
|
+
level?: number;
|
|
16
|
+
bylineLevel?: number;
|
|
17
|
+
spaceBetween?: number;
|
|
18
|
+
spaceAfter?: number;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* A heading with the parts named — an optional pre-heading above it and a byline
|
|
22
|
+
* below, each with its own level and bottom margin.
|
|
23
|
+
*
|
|
24
|
+
* `level` is the heading tag: 1 renders `<h1>`, 0 renders `<p>`.
|
|
25
|
+
* `mb` is bottom margin in spacing units (4 → 1rem), applied only when the
|
|
26
|
+
* element BELOW it is present — so a heading with no byline carries no trailing
|
|
27
|
+
* space.
|
|
28
|
+
*/
|
|
29
|
+
export interface EnhHeadingBlock extends Block {
|
|
30
|
+
blockType: 'enh-heading';
|
|
31
|
+
specifiers?: string;
|
|
32
|
+
/** A node, or a url string to an asset. */
|
|
33
|
+
icon?: ReactNode;
|
|
34
|
+
/** Sizes the icon when it is given as a url. */
|
|
35
|
+
iconSize?: number;
|
|
36
|
+
preheading?: {
|
|
37
|
+
text: string;
|
|
38
|
+
level?: number;
|
|
39
|
+
mb?: number;
|
|
40
|
+
};
|
|
41
|
+
heading: {
|
|
42
|
+
text: string;
|
|
43
|
+
level?: number;
|
|
44
|
+
mb?: number;
|
|
45
|
+
};
|
|
46
|
+
byline?: {
|
|
47
|
+
text: string;
|
|
48
|
+
level?: number;
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
export interface ImageBlock extends Block, ImageDef {
|
|
52
|
+
blockType: 'image';
|
|
53
|
+
/**
|
|
54
|
+
* `left` (default) / `right` / `center` (needs a column parent).
|
|
55
|
+
* `mobile-no-scale` — by default an image scales to 3/4 height below `md`.
|
|
56
|
+
* `mobile-full-width` — overrides dim and fills the width, keeping the ratio.
|
|
57
|
+
*/
|
|
58
|
+
specifiers?: string;
|
|
59
|
+
/** @deprecated Use `mobile-full-width` in specifiers. */
|
|
60
|
+
fullWidthOnMobile?: boolean;
|
|
61
|
+
props?: {
|
|
62
|
+
sizes?: string;
|
|
63
|
+
/** When true, alignment specifiers are ignored. */
|
|
64
|
+
fill?: boolean;
|
|
65
|
+
style?: React.CSSProperties;
|
|
66
|
+
};
|
|
67
|
+
}
|
|
68
|
+
export interface VideoBlock extends VideoDef {
|
|
69
|
+
blockType: 'video';
|
|
70
|
+
}
|
|
71
|
+
export type SpaceUnit = number;
|
|
72
|
+
export type HeadingLevel = 0 | 1 | 2 | 3 | 4 | 5 | 6;
|
|
73
|
+
export declare const SPACE_DEFAULTS: {
|
|
74
|
+
xs: number;
|
|
75
|
+
sm: number;
|
|
76
|
+
md: number;
|
|
77
|
+
lg: number;
|
|
78
|
+
xl: number;
|
|
79
|
+
};
|
|
80
|
+
export interface SpaceBlock extends Block {
|
|
81
|
+
blockType: 'space';
|
|
82
|
+
/**
|
|
83
|
+
* Vertical space in spacing units, per rung and merged over SPACE_DEFAULTS —
|
|
84
|
+
* or one number to use at every rung.
|
|
85
|
+
*/
|
|
86
|
+
sizes?: {
|
|
87
|
+
[k in Breakpoint]?: SpaceUnit;
|
|
88
|
+
} | SpaceUnit;
|
|
89
|
+
/**
|
|
90
|
+
* The space the matching heading tag WOULD occupy, as `<ApplyTypography>`
|
|
91
|
+
* renders it, plus any gap. 0 is 1rem. Default 3.
|
|
92
|
+
*/
|
|
93
|
+
level?: HeadingLevel;
|
|
94
|
+
test?: boolean;
|
|
95
|
+
}
|
|
96
|
+
export interface GroupBlock extends Block {
|
|
97
|
+
blockType: 'group';
|
|
98
|
+
specifiers?: string;
|
|
99
|
+
elements: Block[];
|
|
100
|
+
}
|
|
101
|
+
export interface GridBlock extends Block {
|
|
102
|
+
blockType: 'grid';
|
|
103
|
+
specifiers?: string;
|
|
104
|
+
grid: GridDef;
|
|
105
|
+
/** Ignored when children are passed to the component instead. */
|
|
106
|
+
cells?: Block[];
|
|
107
|
+
}
|
|
108
|
+
export interface AccordianBlock extends Block {
|
|
109
|
+
blockType: 'accordian';
|
|
110
|
+
items: {
|
|
111
|
+
trigger: string;
|
|
112
|
+
content: ReactNode;
|
|
113
|
+
}[];
|
|
114
|
+
}
|
|
115
|
+
export interface BulletCardsBlock extends Block {
|
|
116
|
+
blockType: 'bullet-cards';
|
|
117
|
+
/** `no-card-border` · `mobile-small-text` · `borders-muted-1|3` (default 2). */
|
|
118
|
+
specifiers?: string;
|
|
119
|
+
grid: GridDef;
|
|
120
|
+
cards: BulletItem[];
|
|
121
|
+
/** In px. */
|
|
122
|
+
iconSize?: number;
|
|
123
|
+
}
|
|
124
|
+
/**
|
|
125
|
+
* A call to action: a row of links and buttons.
|
|
126
|
+
*
|
|
127
|
+
* `fill` — the elements fill the parent width.
|
|
128
|
+
* `left` / `right` — justify at `md` and up (centred otherwise).
|
|
129
|
+
* `mobile-2-columns` — two columns on a phone instead of one per line.
|
|
130
|
+
* `mobile-center-first-if-odd` — with an odd count, centre the last one.
|
|
131
|
+
* `mobile-odd-full-width` — the centred one fills both columns.
|
|
132
|
+
*/
|
|
133
|
+
export interface CTABlock extends Block {
|
|
134
|
+
blockType: 'cta';
|
|
135
|
+
specifiers?: string;
|
|
136
|
+
elements: (LinkDef | ButtonDef)[];
|
|
137
|
+
}
|
|
138
|
+
export interface CardBlock extends Block {
|
|
139
|
+
blockType: 'card';
|
|
140
|
+
/** e.g. `media-left`, `appear-disabled`, `no-borders` — combinable. */
|
|
141
|
+
specifiers?: string;
|
|
142
|
+
title?: string;
|
|
143
|
+
byline?: string;
|
|
144
|
+
/** For the title area. */
|
|
145
|
+
icon?: ReactNode;
|
|
146
|
+
iconAfter?: boolean;
|
|
147
|
+
media?: ImageBlock | VideoBlock;
|
|
148
|
+
content?: ReactNode;
|
|
149
|
+
cta?: CTABlock;
|
|
150
|
+
}
|
|
151
|
+
/**
|
|
152
|
+
* A free-form panel: anything above, a heading, anything below, a call to
|
|
153
|
+
* action at the foot.
|
|
154
|
+
*
|
|
155
|
+
* `big-padding` · `no-outer-borders` · `no-internal-borders` ·
|
|
156
|
+
* `style-ghost` (all three at once, and no padding).
|
|
157
|
+
*/
|
|
158
|
+
export interface CarteBlancheBlock extends Block {
|
|
159
|
+
blockType: 'carte-blanche';
|
|
160
|
+
specifiers?: string;
|
|
161
|
+
topContent?: Block[];
|
|
162
|
+
heading?: EnhHeadingBlock;
|
|
163
|
+
content?: Block[];
|
|
164
|
+
cta?: CTABlock;
|
|
165
|
+
}
|
|
166
|
+
/**
|
|
167
|
+
* One screenful: an optional banner over one to three columns of content.
|
|
168
|
+
*
|
|
169
|
+
* A `VideoBlock` banner renders its poster on the server and lazy-loads the
|
|
170
|
+
* `<video>` on the client, playing once 75% of it is in view.
|
|
171
|
+
*/
|
|
172
|
+
export interface ScreenfulBlock extends Block {
|
|
173
|
+
blockType: 'screenful';
|
|
174
|
+
/** An image url, or a video. */
|
|
175
|
+
banner?: string | VideoBlock;
|
|
176
|
+
/** Layout hints for the block as a whole. */
|
|
177
|
+
specifiers?: string;
|
|
178
|
+
/** Layout hints for the matching column. */
|
|
179
|
+
columnSpecifiers?: string[];
|
|
180
|
+
/**
|
|
181
|
+
* The order columns appear in once stacked on a phone, overriding their
|
|
182
|
+
* written order — e.g. `[1, 0, 2]` puts the second of three on top.
|
|
183
|
+
*/
|
|
184
|
+
mobileOrder?: number[];
|
|
185
|
+
/** Content per column. More than three is allowed but rarely readable. */
|
|
186
|
+
contentColumns: Block[][];
|
|
187
|
+
footer?: ReactNode;
|
|
188
|
+
/** For linking to this screenful. */
|
|
189
|
+
anchorId?: string;
|
|
190
|
+
}
|
|
191
|
+
//# sourceMappingURL=def.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"def.d.ts","sourceRoot":"","sources":["../../src/blocks/def.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
'use client';// The block vocabulary — what a site AUTHORS, with no renderer attached.
|
|
2
|
+
//
|
|
3
|
+
// A block is data: `blockType` picks the renderer, and the rest of the fields
|
|
4
|
+
// are that renderer's input. So a page is a `Block[]` that can be written in a
|
|
5
|
+
// CMS, checked into a repo, or produced by a server, and typed either way.
|
|
6
|
+
//
|
|
7
|
+
// Every `specifiers` field is a space-separated bag of layout hints read by the
|
|
8
|
+
// matching component. It is deliberately a string rather than a union: a site
|
|
9
|
+
// adds a hint by typing one, and an unrecognised hint is ignored rather than
|
|
10
|
+
// failing the build.
|
|
11
|
+
//
|
|
12
|
+
// Flat, for the reason given in ../types: the 5.x line spread these over
|
|
13
|
+
// sixteen files exporting `default`, so the imported name was never the name the
|
|
14
|
+
// file declared.
|
|
15
|
+
export const SPACE_DEFAULTS = {
|
|
16
|
+
xs: 2,
|
|
17
|
+
sm: 4,
|
|
18
|
+
md: 5,
|
|
19
|
+
lg: 6,
|
|
20
|
+
xl: 8,
|
|
21
|
+
};
|
|
22
|
+
//# sourceMappingURL=def.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"def.js","sourceRoot":"","sources":["../../src/blocks/def.ts"],"names":[],"mappings":"AAAA,yEAAyE;AACzE,EAAE;AACF,8EAA8E;AAC9E,+EAA+E;AAC/E,2EAA2E;AAC3E,EAAE;AACF,gFAAgF;AAChF,8EAA8E;AAC9E,6EAA6E;AAC7E,qBAAqB;AACrB,EAAE;AACF,yEAAyE;AACzE,iFAAiF;AACjF,iBAAiB;AAkFjB,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;CACsC,CAAA"}
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
'use client';"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.EnhHeadingBlockComponent = void 0;
|
|
4
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
const prose_1 = require("../backends/gui/prose.cjs");
|
|
6
|
+
const box_1 = require("../box.cjs");
|
|
7
|
+
const cn_1 = require("../core/cn.cjs");
|
|
8
|
+
const spec_1 = require("./spec.cjs");
|
|
9
|
+
const DEFAULT = {
|
|
10
|
+
preheading: { tag: 'h4', mb: 2 },
|
|
11
|
+
heading: { tag: 'h1', mb: 2 },
|
|
12
|
+
byline: { tag: 'h6' },
|
|
13
|
+
};
|
|
14
|
+
/** 0 is a paragraph; 1–6 are the heading tags. */
|
|
15
|
+
const tag = (level, fallback) => level === undefined ? fallback : level >= 1 && level <= 6 ? `h${level}` : 'p';
|
|
16
|
+
/** An icon given as a url is drawn at `size`; given as a node it renders as-is. */
|
|
17
|
+
const Mark = ({ icon, size, phone, }) => {
|
|
18
|
+
if (!icon)
|
|
19
|
+
return null;
|
|
20
|
+
if (typeof icon === 'string') {
|
|
21
|
+
const s = phone ? size * 0.75 : size;
|
|
22
|
+
return (0, jsx_runtime_1.jsx)(box_1.Box, { tag: "img", src: icon, width: s, height: s, alt: "" });
|
|
23
|
+
}
|
|
24
|
+
return (0, jsx_runtime_1.jsx)(box_1.Box, { children: icon });
|
|
25
|
+
};
|
|
26
|
+
/**
|
|
27
|
+
* Where the three parts sit.
|
|
28
|
+
*
|
|
29
|
+
* The byline is tracked separately from the heading because it aligns
|
|
30
|
+
* independently — a centred heading over a left-aligned byline is a normal
|
|
31
|
+
* layout, and one value could not express it.
|
|
32
|
+
*/
|
|
33
|
+
const place = (spec, phone) => {
|
|
34
|
+
const centre = spec('center');
|
|
35
|
+
const right = spec('right');
|
|
36
|
+
const at = (c, r) => c ? 'self-center text-center' : r ? 'self-end text-right' : 'self-start text-left';
|
|
37
|
+
let heading = at(centre, right);
|
|
38
|
+
let byline = at(spec('byline-center'), spec('byline-right'));
|
|
39
|
+
if (phone) {
|
|
40
|
+
if (spec('mobile-heading-left'))
|
|
41
|
+
heading = 'self-start text-left';
|
|
42
|
+
else
|
|
43
|
+
heading = at(spec('mobile-heading-centered') || centre, right);
|
|
44
|
+
if (spec('mobile-byline-left'))
|
|
45
|
+
byline = 'self-start text-left';
|
|
46
|
+
}
|
|
47
|
+
else if (spec('mobile-heading-centered')) {
|
|
48
|
+
// Centred on a phone, and whatever was asked for from `md` up.
|
|
49
|
+
heading = `self-center text-center ${heading.split(' ').map((c) => `md:${c}`).join(' ')}`;
|
|
50
|
+
}
|
|
51
|
+
return { heading, byline };
|
|
52
|
+
};
|
|
53
|
+
const EnhHeadingBlockComponent = ({ block, className, agent, applyTypography = true, extraSpecifiers = '', }) => {
|
|
54
|
+
if (block.blockType !== 'enh-heading')
|
|
55
|
+
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "enh-heading block required" });
|
|
56
|
+
const b = block;
|
|
57
|
+
const spec = (s) => (0, spec_1.has)(`${b.specifiers ?? ''} ${extraSpecifiers}`.trim(), s);
|
|
58
|
+
const phone = agent === 'phone';
|
|
59
|
+
const at = place(spec, phone);
|
|
60
|
+
const headFont = spec('preheading-heading-font') ? 'font-heading' : '';
|
|
61
|
+
const parts = [
|
|
62
|
+
b.preheading && {
|
|
63
|
+
Tag: tag(b.preheading.level, DEFAULT.preheading.tag),
|
|
64
|
+
cls: (0, cn_1.cn)(`mb-${b.preheading.mb ?? DEFAULT.preheading.mb}`, at.heading, headFont),
|
|
65
|
+
text: b.preheading.text,
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
Tag: tag(b.heading.level, DEFAULT.heading.tag),
|
|
69
|
+
cls: (0, cn_1.cn)(`mb-${b.heading.mb ?? DEFAULT.heading.mb}`, at.heading),
|
|
70
|
+
text: b.heading.text,
|
|
71
|
+
},
|
|
72
|
+
b.byline && {
|
|
73
|
+
Tag: tag(b.byline.level, DEFAULT.byline.tag),
|
|
74
|
+
cls: at.byline,
|
|
75
|
+
text: b.byline.text,
|
|
76
|
+
},
|
|
77
|
+
].filter(Boolean);
|
|
78
|
+
// The icon rides the FIRST part that renders, whichever that turns out to be.
|
|
79
|
+
const inner = parts.map(({ Tag, cls, text }, i) => b.icon && i === 0 ? ((0, jsx_runtime_1.jsxs)(box_1.Box, { className: (0, cn_1.cn)('flex flex-row items-center gap-2 sm:gap-4', cls), children: [(0, jsx_runtime_1.jsx)(Mark, { icon: b.icon, size: b.iconSize ?? 32, phone: phone }), (0, jsx_runtime_1.jsx)(box_1.Box, { tag: Tag, children: text })] }, i)) : ((0, jsx_runtime_1.jsx)(box_1.Box, { tag: Tag, className: cls, children: text }, i)));
|
|
80
|
+
// `gap-0` because each part carries its own bottom margin — a gap on the
|
|
81
|
+
// column would add to every one of them and double the spacing.
|
|
82
|
+
const cls = (0, cn_1.cn)('flex flex-col w-full gap-0', className, spec('align-middle') && 'my-auto');
|
|
83
|
+
return applyTypography ? ((0, jsx_runtime_1.jsx)(prose_1.ApplyTypography, { className: cls, children: inner })) : ((0, jsx_runtime_1.jsx)(box_1.Box, { className: cls, children: inner }));
|
|
84
|
+
};
|
|
85
|
+
exports.EnhHeadingBlockComponent = EnhHeadingBlockComponent;
|
|
86
|
+
exports.default = exports.EnhHeadingBlockComponent;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { type BlockComponentProps } from './spec.js';
|
|
2
|
+
export declare const EnhHeadingBlockComponent: ({ block, className, agent, applyTypography, extraSpecifiers, }: BlockComponentProps & {
|
|
3
|
+
applyTypography?: boolean;
|
|
4
|
+
extraSpecifiers?: string;
|
|
5
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export default EnhHeadingBlockComponent;
|
|
7
|
+
//# sourceMappingURL=enh-heading.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"enh-heading.d.ts","sourceRoot":"","sources":["../../src/blocks/enh-heading.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,mBAAmB,EAAO,MAAM,QAAQ,CAAA;AA2DtD,eAAO,MAAM,wBAAwB,mEAMlC,mBAAmB,GAAG;IACvB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB,4CAkDA,CAAA;eAEc,wBAAwB"}
|