@odx/websites-react 1.0.34 → 1.0.36

package/dist/web/sections/stageSection/StageSection.js

@@ -1,13 +1,30 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { Block, Headline, SectionWrapper, } from '../../../components';
-// TODO adjust the text element layout after the usage of Container/Block is completed for this component
-const StageSection = ({ button, image, headline, headlineColoredPart, sectionProps, headlineActAs, }) => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Block, Headline } from '../../../components';
+import { cva } from 'class-variance-authority';
+const stageHeadlineBoxVariants = cva('flex flex-col items-start p-8 pt-6 gap-y-16', {
+    variants: {
+        variant: {
+            primary: 'bg-surface-brand',
+            secondary: 'bg-surface-secondary',
+        },
+    },
+    defaultVariants: {
+        variant: 'primary',
+    },
+});
+const StageHeadlineBox = ({ headline, headlineColoredPart, headlineActAs, button, variant, }) => {
+    const hasHeadline = headline || headlineColoredPart;
+    const headlineElement = hasHeadline && (_jsxs(Headline, { headingLevel: "h1", actAs: headlineActAs, className: "text-text-invert", children: [_jsx("span", { className: variant === 'primary' ? 'text-text-invert' : 'text-text-primary', children: headline }), headlineColoredPart && (_jsxs("span", { className: 'text-text-accent', children: ["\u00A0", headlineColoredPart] }))] }));
+    return (_jsx(Block, { elementWidth: 'large', paddingBottom: 'none', className: "!px-0", children: _jsxs("div", { className: stageHeadlineBoxVariants({ variant }), children: [headlineElement, button] }) }));
+};
+const StageSection = ({ button, image, headline, headlineColoredPart, headlineActAs, }) => {
     const hasHeadline = headline || headlineColoredPart;
     const hasContent = Boolean(image || hasHeadline);
     if (!hasContent)
         return;
-    const headlineElement = hasHeadline && (_jsxs(Headline, { headingLevel: "h1", actAs: headlineActAs, className: "text-text-invert", children: [headline, headlineColoredPart && (_jsxs("span", { className: 'text-text-accent', children: ["\u00A0", headlineColoredPart] }))] }));
-    return (_jsxs(SectionWrapper, { ...sectionProps, children: [image && _jsx("div", { className: "w-full -z-10", children: image }), Boolean(hasHeadline || button) && (_jsx("div", { className: "relative flex justify-center", children: _jsxs(Block, { className: "flex flex-col items-start p-8 pt-6 gap-y-16 lg:-mt-40 xl:px-8", background: 'darkBlue', elementWidth: 'medium', paddingBottom: 'none', children: [headlineElement, button] }) }))] }));
+    if (!image && hasHeadline)
+        return (_jsx("section", { className: "flex flex-col items-center w-full bg-surface-secondary", children: _jsx("div", { className: "py-32", children: _jsx(StageHeadlineBox, { variant: 'secondary', button: button, headline: headline, headlineActAs: headlineActAs, headlineColoredPart: headlineColoredPart }) }) }));
+    return (_jsxs("section", { children: [image && _jsx("div", { className: "w-full", children: image }), hasHeadline && (_jsx("div", { className: "relative flex flex-col items-center w-full 2xl:px-6 lg:-mt-40", children: _jsx(StageHeadlineBox, { variant: 'primary', button: button, headline: headline, headlineActAs: headlineActAs, headlineColoredPart: headlineColoredPart }) }))] }));
 };
 export { StageSection };
 //# sourceMappingURL=StageSection.js.map

package/dist/web/sections/stageSection/StageSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"StageSection.js","sourceRoot":"","sources":["../../../../src/web/sections/stageSection/StageSection.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,KAAK,EACL,QAAQ,EAER,cAAc,GAEf,MAAM,qBAAqB,CAAC;AAW7B,yGAAyG;AACzG,MAAM,YAAY,GAAgC,CAAC,EACjD,MAAM,EACN,KAAK,EACL,QAAQ,EACR,mBAAmB,EACnB,YAAY,EACZ,aAAa,GACd,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,QAAQ,IAAI,mBAAmB,CAAC;IACpD,MAAM,UAAU,GAAG,OAAO,CAAC,KAAK,IAAI,WAAW,CAAC,CAAC;IACjD,IAAI,CAAC,UAAU;QAAE,OAAO;IAExB,MAAM,eAAe,GAAG,WAAW,IAAI,CACrC,MAAC,QAAQ,IACP,YAAY,EAAC,IAAI,EACjB,KAAK,EAAE,aAAa,EACpB,SAAS,EAAC,kBAAkB,aAE3B,QAAQ,EACR,mBAAmB,IAAI,CACtB,gBAAM,SAAS,EAAE,kBAAkB,uBAAS,mBAAmB,IAAQ,CACxE,IACQ,CACZ,CAAC;IAEF,OAAO,CACL,MAAC,cAAc,OAAK,YAAY,aAC7B,KAAK,IAAI,cAAK,SAAS,EAAC,cAAc,YAAE,KAAK,GAAO,EACpD,OAAO,CAAC,WAAW,IAAI,MAAM,CAAC,IAAI,CACjC,cAAK,SAAS,EAAC,8BAA8B,YAC3C,MAAC,KAAK,IACJ,SAAS,EAAC,+DAA+D,EACzE,UAAU,EAAE,UAAU,EACtB,YAAY,EAAE,QAAQ,EACtB,aAAa,EAAE,MAAM,aAEpB,eAAe,EACf,MAAM,IACD,GACJ,CACP,IACc,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAC,YAAY,EAAC,CAAC"}
+{"version":3,"file":"StageSection.js","sourceRoot":"","sources":["../../../../src/web/sections/stageSection/StageSection.tsx"],"names":[],"mappings":";AACA,OAAO,EAAC,KAAK,EAAE,QAAQ,EAAgB,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAC,GAAG,EAAe,MAAM,0BAA0B,CAAC;AAgB3D,MAAM,wBAAwB,GAAG,GAAG,CAClC,6CAA6C,EAC7C;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,kBAAkB;YAC3B,SAAS,EAAE,sBAAsB;SAClC;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;CACF,CACF,CAAC;AAEF,MAAM,gBAAgB,GAAoC,CAAC,EACzD,QAAQ,EACR,mBAAmB,EACnB,aAAa,EACb,MAAM,EACN,OAAO,GACR,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,QAAQ,IAAI,mBAAmB,CAAC;IACpD,MAAM,eAAe,GAAG,WAAW,IAAI,CACrC,MAAC,QAAQ,IACP,YAAY,EAAC,IAAI,EACjB,KAAK,EAAE,aAAa,EACpB,SAAS,EAAC,kBAAkB,aAE5B,eACE,SAAS,EACP,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,mBAAmB,YAGjE,QAAQ,GACJ,EACN,mBAAmB,IAAI,CACtB,gBAAM,SAAS,EAAE,kBAAkB,uBAAS,mBAAmB,IAAQ,CACxE,IACQ,CACZ,CAAC;IAEF,OAAO,CACL,KAAC,KAAK,IAAC,YAAY,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,SAAS,EAAC,OAAO,YACpE,eAAK,SAAS,EAAE,wBAAwB,CAAC,EAAC,OAAO,EAAC,CAAC,aAChD,eAAe,EACf,MAAM,IACH,GACA,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,YAAY,GAAgC,CAAC,EACjD,MAAM,EACN,KAAK,EACL,QAAQ,EACR,mBAAmB,EACnB,aAAa,GACd,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,QAAQ,IAAI,mBAAmB,CAAC;IACpD,MAAM,UAAU,GAAG,OAAO,CAAC,KAAK,IAAI,WAAW,CAAC,CAAC;IACjD,IAAI,CAAC,UAAU;QAAE,OAAO;IAExB,IAAI,CAAC,KAAK,IAAI,WAAW;QACvB,OAAO,CACL,kBAAS,SAAS,EAAC,wDAAwD,YACzE,cAAK,SAAS,EAAC,OAAO,YACpB,KAAC,gBAAgB,IACf,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,aAAa,EAC5B,mBAAmB,EAAE,mBAAmB,GACxC,GACE,GACE,CACX,CAAC;IAEJ,OAAO,CACL,8BACG,KAAK,IAAI,cAAK,SAAS,EAAC,QAAQ,YAAE,KAAK,GAAO,EAE9C,WAAW,IAAI,CACd,cAAK,SAAS,EAAC,+DAA+D,YAC5E,KAAC,gBAAgB,IACf,OAAO,EAAE,SAAS,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,aAAa,EAC5B,mBAAmB,EAAE,mBAAmB,GACxC,GACE,CACP,IACO,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAC,YAAY,EAAC,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@odx/websites-react",
   "author": "Drägerwerk AG & Co. KGaA",
-  "version": "1.0.34",
+  "version": "1.0.36",
   "license": "SEE LICENSE IN LICENSE.md",
   "description": "ODX React component library for websites",
   "type": "module",
@@ -82,7 +82,7 @@
     "typescript": "^5.4.5",
     "@odx/eslint-config-websites": "0.0.1",
     "@odx/websites-tsconfig": "0.0.0",
-    "@odx/websites-ui": "0.2.11"
+    "@odx/websites-ui": "0.2.12"
   },
   "peerDependencies": {
     "@odx/websites-ui": ">=0.2.1",