@bonniernews/dn-design-system-web 32.1.2-beta.1 → 32.1.2-beta.2
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/components/teaser-counter/README.md +1 -3
- package/components/teaser-counter/teaser-counter.njk +69 -0
- package/components/teaser-counter/teaser-counter.scss +15 -4
- package/package.json +1 -1
- package/preact/components/teaser-counter/teaser-counter.d.ts +1 -3
- package/preact/components/teaser-counter/teaser-counter.js +4 -10
- package/preact/components/teaser-counter/teaser-counter.js.map +2 -2
|
@@ -18,15 +18,13 @@ The component will not include styling by itself. Make sure to include the right
|
|
|
18
18
|
| areaType | "right", "bauta" | \- |
|
|
19
19
|
| targetLink | string | \- |
|
|
20
20
|
| mediaHtml | string | \- |
|
|
21
|
-
| counterDate | string | \- |
|
|
22
|
-
| countdown | boolean | \- |
|
|
23
21
|
| counterNumber | number | \- |
|
|
24
22
|
| classNames | string | \- |
|
|
25
23
|
| attributes | Ex. { target: "\_blank", "data-test": "lorem ipsum" }<br />object | \- |
|
|
26
24
|
|
|
27
25
|
```jsx
|
|
28
26
|
<TeaserCounter
|
|
29
|
-
|
|
27
|
+
classNames="test-class"
|
|
30
28
|
counterNumber={124}
|
|
31
29
|
counterText="DAGAR I <br> FÄNGELSE"
|
|
32
30
|
mediaHtml="<figure class='ds-teaser-image'><div class='picture picture--placeholder' style='aspect-ratio: 3 / 4;'><img class='picture__img' src='https://cached-images.bonnier.news/gcs/bilder-lab/dn-mly/d5e4cd87-61a5-40fc-8060-c4ad5019a9f3.jpeg?interpolation=lanczos-none&fit=around%7C65:87&crop=65:h;center,top&output-quality=80' alt='' aria-hidden='true'></div></figure>"
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
{% from '@bonniernews/dn-design-system-web/components/teaser-card/teaser-card.njk' import TeaserCard %}
|
|
2
|
+
{% from '@bonniernews/dn-design-system-web/components/icon-sprite/icon-sprite.njk' import IconUse %}
|
|
3
|
+
|
|
4
|
+
{% macro TeaserCounter(params) %}
|
|
5
|
+
{% set componentClassName = "ds-teaser--counter" %}
|
|
6
|
+
|
|
7
|
+
{% set extraClasses = [
|
|
8
|
+
componentClassName,
|
|
9
|
+
params.classNames if params.classNames
|
|
10
|
+
] | join(" ") %}
|
|
11
|
+
|
|
12
|
+
{% call TeaserCard({
|
|
13
|
+
targetLink: params.targetLink,
|
|
14
|
+
areaType: params.areaType,
|
|
15
|
+
attributes: params.attributes,
|
|
16
|
+
classNames: extraClasses
|
|
17
|
+
}) %}
|
|
18
|
+
<div class="ds-teaser__content">
|
|
19
|
+
{% if params.title %}
|
|
20
|
+
<h2 class="{{ componentClassName + '__title' }}">
|
|
21
|
+
<span class="{{ componentClassName + '__title--highlighted' }}">{{ params.title }}</span>
|
|
22
|
+
{% if params.subtitle %}
|
|
23
|
+
– {{ params.subtitle }}
|
|
24
|
+
{% endif %}
|
|
25
|
+
</h2>
|
|
26
|
+
{% endif %}
|
|
27
|
+
|
|
28
|
+
{% if params.counterNumber is not null or params.counterText %}
|
|
29
|
+
<div class="{{ componentClassName + '__counter-wrapper' }}">
|
|
30
|
+
{% if params.counterNumber is not null %}
|
|
31
|
+
<ul class="{{ componentClassName + '__list' }}">
|
|
32
|
+
{% for digit in params.counterNumber | string %}
|
|
33
|
+
<li class="{{ componentClassName + '__item' }}">{{ digit }}</li>
|
|
34
|
+
{% endfor %}
|
|
35
|
+
</ul>
|
|
36
|
+
{% endif %}
|
|
37
|
+
|
|
38
|
+
{% if params.counterText %}
|
|
39
|
+
<p class="{{ componentClassName + '__counter-text' }}">
|
|
40
|
+
{{ params.counterText | safe }}
|
|
41
|
+
</p>
|
|
42
|
+
{% endif %}
|
|
43
|
+
</div>
|
|
44
|
+
{% endif %}
|
|
45
|
+
</div>
|
|
46
|
+
|
|
47
|
+
{% if params.countdown %}
|
|
48
|
+
<div class="{{ componentClassName + '__countdown' }}">
|
|
49
|
+
{{ IconUse({ icon: "clock" }) }}
|
|
50
|
+
<span class="{{ componentClassName + '__countdown-text' }}">
|
|
51
|
+
{{ params.countdown }}
|
|
52
|
+
</span>
|
|
53
|
+
</div>
|
|
54
|
+
{% endif %}
|
|
55
|
+
|
|
56
|
+
{% if params.sectionName %}
|
|
57
|
+
<div class="{{ componentClassName + '__section-name' }}">
|
|
58
|
+
{{ params.sectionName }}
|
|
59
|
+
</div>
|
|
60
|
+
{% endif %}
|
|
61
|
+
|
|
62
|
+
{% if params.mediaHtml %}
|
|
63
|
+
<div class="{{ componentClassName + '__media' }}">
|
|
64
|
+
{{ params.mediaHtml | safe }}
|
|
65
|
+
</div>
|
|
66
|
+
{% endif %}
|
|
67
|
+
|
|
68
|
+
{% endcall %}
|
|
69
|
+
{% endmacro %}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
@use "../../foundations/helpers/forward.helpers.scss" as *;
|
|
2
|
+
@use "../../assets/teaser/teaser.scss" as *;
|
|
2
3
|
|
|
3
4
|
a.ds-teaser--counter.ds-teaser {
|
|
4
5
|
color: inherit;
|
|
@@ -19,13 +20,18 @@ a.ds-teaser--counter.ds-teaser {
|
|
|
19
20
|
justify-content: space-between;
|
|
20
21
|
}
|
|
21
22
|
|
|
23
|
+
.ds-teaser--counter__title,
|
|
24
|
+
.ds-teaser--counter__counter-text {
|
|
25
|
+
color: $ds-color-text-primary;
|
|
26
|
+
}
|
|
27
|
+
|
|
22
28
|
.ds-teaser--counter__title {
|
|
29
|
+
margin: 0;
|
|
23
30
|
@include ds-typography(
|
|
24
31
|
$ds-typography-functional-heading-xs,
|
|
25
32
|
$fontWeight: $ds-fontweight-regular,
|
|
26
33
|
$lineHeight: $ds-lineheight-md
|
|
27
34
|
);
|
|
28
|
-
margin: 0;
|
|
29
35
|
}
|
|
30
36
|
|
|
31
37
|
.ds-teaser--counter__title--highlighted {
|
|
@@ -39,26 +45,31 @@ a.ds-teaser--counter.ds-teaser {
|
|
|
39
45
|
}
|
|
40
46
|
|
|
41
47
|
.ds-teaser--counter__list {
|
|
42
|
-
@include ds-typography($ds-typography-functional-heading-sm, $fontWeight: $ds-fontweight-regular);
|
|
43
48
|
display: flex;
|
|
44
49
|
font-variant-numeric: tabular-nums;
|
|
45
50
|
gap: ds-spacing($ds-s-012);
|
|
46
51
|
list-style: none;
|
|
47
52
|
margin: 0;
|
|
48
53
|
padding: 0;
|
|
54
|
+
@include ds-typography($ds-typography-functional-heading-sm, $fontWeight: $ds-fontweight-regular);
|
|
49
55
|
|
|
50
56
|
.ds-teaser--counter__item {
|
|
57
|
+
align-items: center;
|
|
51
58
|
background-color: $ds-color-brand-600;
|
|
52
59
|
border-radius: ds-border-radius($ds-s-025);
|
|
53
60
|
color: $ds-color-text-on-brand;
|
|
54
|
-
|
|
61
|
+
display: flex;
|
|
62
|
+
height: ds-spacing($ds-s-200);
|
|
63
|
+
justify-content: center;
|
|
64
|
+
width: ds-spacing($ds-s-150);
|
|
55
65
|
}
|
|
56
66
|
}
|
|
57
67
|
|
|
58
68
|
.ds-teaser--counter__counter-text {
|
|
59
|
-
@include ds-typography($ds-typography-functional-meta-md);
|
|
60
69
|
margin: 0;
|
|
70
|
+
@include ds-typography($ds-typography-functional-meta-md);
|
|
61
71
|
}
|
|
72
|
+
|
|
62
73
|
.ds-teaser-image {
|
|
63
74
|
display: flex;
|
|
64
75
|
justify-content: flex-end;
|
package/package.json
CHANGED
|
@@ -5,8 +5,6 @@ export interface TeaserCounterProps {
|
|
|
5
5
|
areaType?: 'right' | 'bauta';
|
|
6
6
|
targetLink?: string;
|
|
7
7
|
mediaHtml?: string;
|
|
8
|
-
counterDate?: string;
|
|
9
|
-
countdown?: boolean;
|
|
10
8
|
counterNumber?: number;
|
|
11
9
|
classNames?: string;
|
|
12
10
|
/** Ex. { target: "_blank", "data-test": "lorem ipsum" } */
|
|
@@ -23,4 +21,4 @@ export interface TeaserCounterProps {
|
|
|
23
21
|
* The component will not include styling by itself. Make sure to include the right styles for the component. See example below:
|
|
24
22
|
* `@use '@bonniernews/dn-design-system-web/components/teaser-counter/teaser-counter.scss'`
|
|
25
23
|
*/
|
|
26
|
-
export declare const TeaserCounter: ({ areaType, targetLink, classNames, attributes, mediaHtml, counterText,
|
|
24
|
+
export declare const TeaserCounter: ({ areaType, targetLink, classNames, attributes, mediaHtml, counterText, counterNumber, title, subtitle, }: TeaserCounterProps) => import("preact").JSX.Element;
|
|
@@ -39,27 +39,21 @@ var TeaserCounter = ({
|
|
|
39
39
|
attributes,
|
|
40
40
|
mediaHtml,
|
|
41
41
|
counterText,
|
|
42
|
-
countdown,
|
|
43
|
-
counterDate,
|
|
44
42
|
counterNumber,
|
|
45
43
|
title,
|
|
46
44
|
subtitle
|
|
47
45
|
}) => {
|
|
48
46
|
const componentClassName = "ds-teaser--counter";
|
|
49
47
|
const classes = formatClassString([componentClassName, classNames]);
|
|
50
|
-
const
|
|
51
|
-
|
|
52
|
-
"data-counter-date": counterDate,
|
|
53
|
-
...countdown ? { "data-countdown": countdown } : {}
|
|
54
|
-
};
|
|
55
|
-
return /* @__PURE__ */ jsxs(TeaserCard, { ...{ areaType, targetLink, classes, attributes: mergedAttributes }, children: [
|
|
48
|
+
const counterNumberIsValid = counterNumber !== void 0 && counterNumber !== null;
|
|
49
|
+
return /* @__PURE__ */ jsxs(TeaserCard, { ...{ areaType, targetLink, classes, attributes }, children: [
|
|
56
50
|
/* @__PURE__ */ jsxs(Content, { children: [
|
|
57
51
|
title && /* @__PURE__ */ jsxs("h2", { className: `${componentClassName}__title`, children: [
|
|
58
52
|
/* @__PURE__ */ jsx3("span", { className: `${componentClassName}__title--highlighted`, children: title }),
|
|
59
53
|
subtitle && ` \u2013 ${subtitle}`
|
|
60
54
|
] }),
|
|
61
|
-
(
|
|
62
|
-
|
|
55
|
+
(counterNumberIsValid || counterText) && /* @__PURE__ */ jsxs("div", { className: `${componentClassName}__counter-wrapper`, children: [
|
|
56
|
+
counterNumberIsValid && /* @__PURE__ */ jsx3("ul", { className: `${componentClassName}__list`, children: counterNumber.toString().split("").map((digit, index) => /* @__PURE__ */ jsx3("li", { className: `${componentClassName}__item`, children: digit }, index)) }),
|
|
63
57
|
counterText && /* @__PURE__ */ jsx3(
|
|
64
58
|
"p",
|
|
65
59
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../helpers/formatClassString.ts", "../../../components/teaser-card/teaser-card.tsx", "../../../helpers/teaser.tsx", "../../../components/teaser-counter/teaser-counter.tsx"],
|
|
4
|
-
"sourcesContent": ["export const formatClassString = (classesArray: (string|undefined|false)[]): string => {\n return classesArray.filter(x => !!x).join(' ');\n}\n", "import { formatClassString } from \"@bonniernews/dn-design-system-web/helpers/formatClassString.ts\";\nimport { ComponentChildren } from \"preact\";\n\nexport interface TeaserCardsProps {\n areaType?: 'right' | 'bauta' | 'bautaxl';\n targetLink?: string;\n theme?: 'kultur' | 'nyheter';\n classes?: string;\n /** Ex. { target: \"_blank\", \"data-test\": \"lorem ipsum\" } */\n attributes?: object;\n children: ComponentChildren;\n}\n\n/**\n * - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-card](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-card)\n * - Storybook: [Subcomponents > TeaserCard](https://designsystem.dn.se/?path=/docs/section-subcomponents-teaserdot--docs)\n *\n * The component will not include styling by itself. Make sure to include the right styles for the component. See example below:\n * `@use '@bonniernews/dn-design-system-web/assets/teaser/teaser.scss'`\n */\nexport const TeaserCard = ({ areaType, targetLink, theme = 'nyheter', classes, attributes, children }: TeaserCardsProps) => {\n const componentClassName = 'ds-teaser';\n\n const classNames = formatClassString([\n componentClassName,\n areaType && `${componentClassName}--${areaType}`,\n areaType == 'bauta' && 'ds-dark',\n `ds-theme--${theme}`,\n classes,\n ])\n\n if (targetLink) {\n return (\n <a className={classNames} href={targetLink } {...attributes}>\n { children }\n </a>\n );\n }\n\n return (\n <div className={classNames}{...attributes}>\n { children }\n </div>\n );\n};\n", "import { ComponentChildren } from \"preact\";\n\ninterface MediaProps {\n mediaHtml?: string;\n rounded?: boolean;\n}\n\nexport const Media = ({ mediaHtml, rounded }: MediaProps) => {\n const classNames = 'ds-teaser__media' + (rounded ? ' ds-teaser__media--rounded' : '');\n return mediaHtml ? (<div className={classNames} dangerouslySetInnerHTML={{ __html: mediaHtml }} />) : (null)\n}\n\ninterface ContentProps {\n children: ComponentChildren;\n}\nexport const Content = ({ children }: ContentProps) => {\n return (<div className=\"ds-teaser__content\">\n {children}\n </div>)\n}\n\ninterface TitleProps {\n title?: string;\n}\nexport const Title = ({ title }: TitleProps) => {\n return title ? (<h2 className=\"ds-teaser__title\">{title}</h2>) : (null)\n}\n\ninterface BodyProps {\n text?: string;\n}\nexport const Body = ({ text }: BodyProps) => {\n return text ? (<p className=\"ds-teaser__text\">{text}</p>) : (null)\n}\n", "import { TeaserCard } from '@bonniernews/dn-design-system-web/components/teaser-card/teaser-card.tsx'\nimport { formatClassString } from '@bonniernews/dn-design-system-web/helpers/formatClassString.ts'\nimport { Content, Media } from '@bonniernews/dn-design-system-web/helpers/teaser.tsx'\nexport interface TeaserCounterProps {\n title: string\n counterText: string\n subtitle?: string\n areaType?: 'right' | 'bauta'\n targetLink?: string\n mediaHtml?: string\n
|
|
5
|
-
"mappings": ";AAAO,IAAM,oBAAoB,CAAC,iBAAqD;AACrF,SAAO,aAAa,OAAO,OAAK,CAAC,CAAC,CAAC,EAAE,KAAK,GAAG;AAC/C;;;AC+BM;AAbC,IAAM,aAAa,CAAC,EAAE,UAAU,YAAY,QAAQ,WAAW,SAAS,YAAY,SAAS,MAAwB;AAC1H,QAAM,qBAAqB;AAE3B,QAAM,aAAa,kBAAkB;AAAA,IACnC;AAAA,IACA,YAAY,GAAG,kBAAkB,KAAK,QAAQ;AAAA,IAC9C,YAAY,WAAW;AAAA,IACvB,aAAa,KAAK;AAAA,IAClB;AAAA,EACF,CAAC;AAED,MAAI,YAAY;AACd,WACE,oBAAC,OAAE,WAAW,YAAY,MAAM,YAAc,GAAG,YAC7C,UACJ;AAAA,EAEJ;AAEA,SACE,oBAAC,SAAI,WAAW,YAAY,GAAG,YAC3B,UACJ;AAEJ;;;ACnCsB,gBAAAA,YAAA;AAFf,IAAM,QAAQ,CAAC,EAAE,WAAW,QAAQ,MAAkB;AAC3D,QAAM,aAAa,sBAAsB,UAAU,+BAA+B;AAClF,SAAO,YAAa,gBAAAA,KAAC,SAAI,WAAW,YAAY,yBAAyB,EAAE,QAAQ,UAAU,GAAG,IAAO;AACzG;AAKO,IAAM,UAAU,CAAC,EAAE,SAAS,MAAoB;AACrD,SAAQ,gBAAAA,KAAC,SAAI,WAAU,sBACpB,UACH;AACF;;;
|
|
4
|
+
"sourcesContent": ["export const formatClassString = (classesArray: (string|undefined|false)[]): string => {\n return classesArray.filter(x => !!x).join(' ');\n}\n", "import { formatClassString } from \"@bonniernews/dn-design-system-web/helpers/formatClassString.ts\";\nimport { ComponentChildren } from \"preact\";\n\nexport interface TeaserCardsProps {\n areaType?: 'right' | 'bauta' | 'bautaxl';\n targetLink?: string;\n theme?: 'kultur' | 'nyheter';\n classes?: string;\n /** Ex. { target: \"_blank\", \"data-test\": \"lorem ipsum\" } */\n attributes?: object;\n children: ComponentChildren;\n}\n\n/**\n * - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-card](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-card)\n * - Storybook: [Subcomponents > TeaserCard](https://designsystem.dn.se/?path=/docs/section-subcomponents-teaserdot--docs)\n *\n * The component will not include styling by itself. Make sure to include the right styles for the component. See example below:\n * `@use '@bonniernews/dn-design-system-web/assets/teaser/teaser.scss'`\n */\nexport const TeaserCard = ({ areaType, targetLink, theme = 'nyheter', classes, attributes, children }: TeaserCardsProps) => {\n const componentClassName = 'ds-teaser';\n\n const classNames = formatClassString([\n componentClassName,\n areaType && `${componentClassName}--${areaType}`,\n areaType == 'bauta' && 'ds-dark',\n `ds-theme--${theme}`,\n classes,\n ])\n\n if (targetLink) {\n return (\n <a className={classNames} href={targetLink } {...attributes}>\n { children }\n </a>\n );\n }\n\n return (\n <div className={classNames}{...attributes}>\n { children }\n </div>\n );\n};\n", "import { ComponentChildren } from \"preact\";\n\ninterface MediaProps {\n mediaHtml?: string;\n rounded?: boolean;\n}\n\nexport const Media = ({ mediaHtml, rounded }: MediaProps) => {\n const classNames = 'ds-teaser__media' + (rounded ? ' ds-teaser__media--rounded' : '');\n return mediaHtml ? (<div className={classNames} dangerouslySetInnerHTML={{ __html: mediaHtml }} />) : (null)\n}\n\ninterface ContentProps {\n children: ComponentChildren;\n}\nexport const Content = ({ children }: ContentProps) => {\n return (<div className=\"ds-teaser__content\">\n {children}\n </div>)\n}\n\ninterface TitleProps {\n title?: string;\n}\nexport const Title = ({ title }: TitleProps) => {\n return title ? (<h2 className=\"ds-teaser__title\">{title}</h2>) : (null)\n}\n\ninterface BodyProps {\n text?: string;\n}\nexport const Body = ({ text }: BodyProps) => {\n return text ? (<p className=\"ds-teaser__text\">{text}</p>) : (null)\n}\n", "import { TeaserCard } from '@bonniernews/dn-design-system-web/components/teaser-card/teaser-card.tsx'\nimport { formatClassString } from '@bonniernews/dn-design-system-web/helpers/formatClassString.ts'\nimport { Content, Media } from '@bonniernews/dn-design-system-web/helpers/teaser.tsx'\nexport interface TeaserCounterProps {\n title: string\n counterText: string\n subtitle?: string\n areaType?: 'right' | 'bauta'\n targetLink?: string\n mediaHtml?: string\n counterNumber?: number\n classNames?: string\n /** Ex. { target: \"_blank\", \"data-test\": \"lorem ipsum\" } */\n attributes?: object\n}\n\n/**\n * Also known as \"P\u00E5 Plats-puffen\".\n *\n * In the CMS title will be set to a location like \"Kiev, Ukraina\" or \"USA\" and text is usually set to some author names like \"Jan Banan och Kalle Kula\"\n *\n * - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-onsite](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-counter)\n * - Storybook: [TeaserCounter](https://designsystem.dn.se/?path=/docs/section-teaser-counter--docs)\n *\n * The component will not include styling by itself. Make sure to include the right styles for the component. See example below:\n * `@use '@bonniernews/dn-design-system-web/components/teaser-counter/teaser-counter.scss'`\n */\nexport const TeaserCounter = ({\n areaType,\n targetLink,\n classNames,\n attributes,\n mediaHtml,\n counterText,\n counterNumber,\n title,\n subtitle,\n}: TeaserCounterProps) => {\n const componentClassName = 'ds-teaser--counter'\n const classes = formatClassString([componentClassName, classNames])\n\n const counterNumberIsValid = counterNumber !== undefined && counterNumber !== null\n\n return (\n <TeaserCard {...{ areaType, targetLink, classes, attributes }}>\n <Content>\n {title && (\n <h2 className={`${componentClassName}__title`}>\n <span className={`${componentClassName}__title--highlighted`}>{title}</span>\n {subtitle && ` \u2013 ${subtitle}`}\n </h2>\n )}\n\n {(counterNumberIsValid || counterText) && (\n <div className={`${componentClassName}__counter-wrapper`}>\n {counterNumberIsValid && (\n <ul className={`${componentClassName}__list`}>\n {counterNumber\n .toString()\n .split('')\n .map((digit, index) => (\n <li key={index} className={`${componentClassName}__item`}>\n {digit}\n </li>\n ))}\n </ul>\n )}\n\n {counterText && (\n <p\n className={`${componentClassName}__counter-text`}\n dangerouslySetInnerHTML={{ __html: counterText }}\n ></p>\n )}\n </div>\n )}\n </Content>\n <Media {...{ mediaHtml }} />\n </TeaserCard>\n )\n}\n"],
|
|
5
|
+
"mappings": ";AAAO,IAAM,oBAAoB,CAAC,iBAAqD;AACrF,SAAO,aAAa,OAAO,OAAK,CAAC,CAAC,CAAC,EAAE,KAAK,GAAG;AAC/C;;;AC+BM;AAbC,IAAM,aAAa,CAAC,EAAE,UAAU,YAAY,QAAQ,WAAW,SAAS,YAAY,SAAS,MAAwB;AAC1H,QAAM,qBAAqB;AAE3B,QAAM,aAAa,kBAAkB;AAAA,IACnC;AAAA,IACA,YAAY,GAAG,kBAAkB,KAAK,QAAQ;AAAA,IAC9C,YAAY,WAAW;AAAA,IACvB,aAAa,KAAK;AAAA,IAClB;AAAA,EACF,CAAC;AAED,MAAI,YAAY;AACd,WACE,oBAAC,OAAE,WAAW,YAAY,MAAM,YAAc,GAAG,YAC7C,UACJ;AAAA,EAEJ;AAEA,SACE,oBAAC,SAAI,WAAW,YAAY,GAAG,YAC3B,UACJ;AAEJ;;;ACnCsB,gBAAAA,YAAA;AAFf,IAAM,QAAQ,CAAC,EAAE,WAAW,QAAQ,MAAkB;AAC3D,QAAM,aAAa,sBAAsB,UAAU,+BAA+B;AAClF,SAAO,YAAa,gBAAAA,KAAC,SAAI,WAAW,YAAY,yBAAyB,EAAE,QAAQ,UAAU,GAAG,IAAO;AACzG;AAKO,IAAM,UAAU,CAAC,EAAE,SAAS,MAAoB;AACrD,SAAQ,gBAAAA,KAAC,SAAI,WAAU,sBACpB,UACH;AACF;;;AC4BU,SACE,OAAAC,MADF;AApBH,IAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA0B;AACxB,QAAM,qBAAqB;AAC3B,QAAM,UAAU,kBAAkB,CAAC,oBAAoB,UAAU,CAAC;AAElE,QAAM,uBAAuB,kBAAkB,UAAa,kBAAkB;AAE9E,SACE,qBAAC,cAAY,GAAG,EAAE,UAAU,YAAY,SAAS,WAAW,GAC1D;AAAA,yBAAC,WACE;AAAA,eACC,qBAAC,QAAG,WAAW,GAAG,kBAAkB,WAClC;AAAA,wBAAAA,KAAC,UAAK,WAAW,GAAG,kBAAkB,wBAAyB,iBAAM;AAAA,QACpE,YAAY,WAAM,QAAQ;AAAA,SAC7B;AAAA,OAGA,wBAAwB,gBACxB,qBAAC,SAAI,WAAW,GAAG,kBAAkB,qBAClC;AAAA,gCACC,gBAAAA,KAAC,QAAG,WAAW,GAAG,kBAAkB,UACjC,wBACE,SAAS,EACT,MAAM,EAAE,EACR,IAAI,CAAC,OAAO,UACX,gBAAAA,KAAC,QAAe,WAAW,GAAG,kBAAkB,UAC7C,mBADM,KAET,CACD,GACL;AAAA,QAGD,eACC,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,kBAAkB;AAAA,YAChC,yBAAyB,EAAE,QAAQ,YAAY;AAAA;AAAA,QAChD;AAAA,SAEL;AAAA,OAEJ;AAAA,IACA,gBAAAA,KAAC,SAAO,GAAG,EAAE,UAAU,GAAG;AAAA,KAC5B;AAEJ;",
|
|
6
6
|
"names": ["jsx", "jsx"]
|
|
7
7
|
}
|