@kausal/themes 0.8.2 → 0.8.5

package/dist/themes/default/{main-ISMOGQGC.css → main-QOHLYNJI.css}

@@ -1,4 +1,4 @@
-/* common/@fontsource/inter/400.css */
+/* ../../../../../../../var/folders/mf/8_zg1h4n3xsbwv96530g65cw0000gn/T/esbuild-ja4NeX/common/@fontsource/inter/400.css */
 @font-face {
   font-family: "Inter";
   font-style: normal;
@@ -118,7 +118,7 @@
     U+FFFD;
 }
 
-/* common/@fontsource/inter/700.css */
+/* ../../../../../../../var/folders/mf/8_zg1h4n3xsbwv96530g65cw0000gn/T/esbuild-ja4NeX/common/@fontsource/inter/700.css */
 @font-face {
   font-family: "Inter";
   font-style: normal;
@@ -238,7 +238,7 @@
     U+FFFD;
 }
 
-/* default/icons.css */
+/* ../../../../../../../var/folders/mf/8_zg1h4n3xsbwv96530g65cw0000gn/T/esbuild-ja4NeX/default/icons.css */
 :root {
   --theme-icon-action-dependency: url("./icons/action-dependency-YIHDLWKV.svg");
   --theme-icon-angle-down: url("./icons/angle-down-AQWOHY4J.svg");
@@ -307,11 +307,13 @@
   --theme-icon-version: url("./icons/version-LJSCFB3L.svg");
 }
 
-/* default/main.scss */
+/* ../../../../../../../var/folders/mf/8_zg1h4n3xsbwv96530g65cw0000gn/T/esbuild-ja4NeX/default/main.scss */
 :root {
   --theme-logo-url: url("./images/default-logo-white-KUB6ICTS.svg");
   --theme-logo-white-url: url("./images/default-logo-white-KUB6ICTS.svg");
   --theme-favicon-ico: url("./images/favicon/favicon-MGJ3GSCH.ico");
   --theme-favicon-apple: url("./images/favicon/apple-MBMLYIVD.png");
   --theme-favicon-svg: url("./images/favicon/icon-WKA4Z7F2.svg");
+  --theme-default-avatar-png: url("./images/default-avatar-user-M3HOXCCQ.png");
+  --theme-default-avatar-org: url("./images/default-avatar-org-UTHV5FNW.png");
 }

package/dist/themes/default/theme.json

@@ -25,9 +25,11 @@
       "color": "rgb(247, 246, 243)",
       "goalColor": "rgb(86, 195, 142)",
       "latestColor": "rgb(109, 151, 184)",
-      "startColor": "rgb(239, 154, 154)"
+      "startColor": "rgb(239, 154, 154)",
+      "linkToSource": true
     }
   },
+  "orgPageBackgroundColor": "rgb(16, 114, 81)",
   "imageOverlay": "rgb(255, 255, 255)",
   "fontFamily": "Inter",
   "fontFamilyHeadings": "Inter",
@@ -35,6 +37,7 @@
   "fontFamilyTiny": "'-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif",
   "headingsFontWeight": 700,
   "headingsColor": "rgb(26, 24, 23)",
+  "headingsTextTransform": "none",
   "fontFamilyFallback": "'-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif",
   "fontFamilyFallbackHeadings": "'-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif",
   "fontSizeSm": "0.8rem",
@@ -80,6 +83,9 @@
   "brandNavColor": "rgb(247, 246, 243)",
   "brandNavBackground": "rgb(92, 88, 83)",
   "brandNavFontFamily": "Inter",
+  "siteNavColor": "rgb(92, 88, 83)",
+  "siteNavBackground": "rgb(247, 246, 243)",
+  "siteNavHighlightColor": "rgb(16, 114, 81)",
   "navLogoVisible": true,
   "navTitleVisible": true,
   "footerLogoPlacement": "left",
@@ -90,6 +96,7 @@
   "secondFooterColor": "rgb(247, 246, 243)",
   "cardBorderWidth": "1px",
   "cardBorderRadius": "0.5rem",
+  "badgeColor": "rgb(16, 114, 81)",
   "badgeBorderRadius": "3px",
   "badgePaddingY": "0.5em",
   "badgePaddingX": "0.75em",
@@ -107,8 +114,8 @@
   "breakpointXl": "1200px",
   "themeLogoUrl": "default/images/default-logo-white-KUB6ICTS.svg",
   "themeLogoWhiteUrl": "default/images/default-logo-white-KUB6ICTS.svg",
-  "iconIndicatorsUrl": "",
-  "iconActionsUrl": "",
+  "defaultAvatarUserImage": "default/images/default-avatar-user-M3HOXCCQ.png",
+  "defaultAvatarOrgImage": "default/images/default-avatar-org-UTHV5FNW.png",
   "phaseTimelineColor": "rgb(16, 114, 81)",
   "taskStatusColors": {
     "onTime": "rgb(167, 235, 192)",
@@ -150,6 +157,10 @@
     "yellow090": "rgb(60, 19, 0)"
   },
   "settings": {
+    "actionView": {
+      "showPaginationTop": true,
+      "showPaginationBottom": true
+    },
     "dashboard": {
       "showResponsibles": true,
       "showIndicators": true,
@@ -157,11 +168,50 @@
     },
     "homeLink": "text",
     "categories": {
-      "filterIndicatorsByAllLevels": true
+      "filterIndicatorsByAllLevels": true,
+      "collapseLongTexts": true
     },
     "fundingInstruments": [],
     "otherLogos": [],
-    "showFeedbackLink": true
+    "showFeedbackLink": true,
+    "graphs": {
+      "lineShape": "spline",
+      "fillMarkers": false,
+      "goalSymbol": "x",
+      "categorySymbols": [
+        "circle",
+        "square",
+        "diamond",
+        "pentagon",
+        "hexagram",
+        "star-diamond",
+        "hash",
+        "y-down"
+      ],
+      "areaGraphs": false,
+      "showTrendline": true,
+      "drawGoalLine": false,
+      "totalLineColor": "rgb(167, 57, 57)",
+      "trendLineColor": "rgb(239, 154, 154)",
+      "goalLineColors": [
+        "rgb(39, 154, 109)",
+        "rgb(86, 195, 142)",
+        "rgb(16, 114, 81)",
+        "rgb(7, 74, 53)",
+        "rgb(167, 235, 192)"
+      ],
+      "categoryColors": [
+        "rgb(7, 74, 53)",
+        "rgb(78, 128, 166)",
+        "rgb(200, 130, 23)",
+        "rgb(86, 195, 142)",
+        "rgb(167, 57, 57)",
+        "rgb(109, 151, 184)",
+        "rgb(143, 70, 4)",
+        "rgb(16, 114, 81)",
+        "rgb(239, 154, 154)"
+      ]
+    }
   },
   "icons": {
     "arrow-down": "default/icons/arrow-down-MSLGVZVH.svg",
@@ -230,7 +280,7 @@
     "arrow-up": "default/icons/arrow-up-U5XN26IQ.svg",
     "tachometer": "default/icons/tachometer-UE46XP3D.svg"
   },
-  "mainCssFile": "default/main-ISMOGQGC.css",
+  "mainCssFile": "default/main-QOHLYNJI.css",
   "favicons": {
     "apple": "default/images/favicon/apple-MBMLYIVD.png",
     "ico": "default/images/favicon/favicon-MGJ3GSCH.ico",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kausal/themes",
-  "version": "0.8.2",
+  "version": "0.8.5",
   "description": "Themes for Kausal products",
   "type": "module",
   "main": "setup.cjs",

package/props.js

@@ -1,7 +1,17 @@
 import PropTypes from 'prop-types';
 
-const { number, exact, string, oneOfType, bool, array, object, oneOf, objectOf, arrayOf } =
-  PropTypes;
+const {
+  number,
+  exact,
+  string,
+  oneOfType,
+  bool,
+  array,
+  object,
+  oneOf,
+  objectOf,
+  arrayOf,
+} = PropTypes;
 
 export function makeThemePropType(cssv = null) {
   if (!cssv) {
@@ -24,6 +34,7 @@ export function makeThemePropType(cssv = null) {
     actionCompletedColor: cssv('color').isRequired,
     actionContinuousColor: cssv('color').isRequired,
     actionOnTimeColor: cssv('color').isRequired,
+    badgeColor: string.isRequired,
     badgeBorderRadius: oneOfType([string, number]).isRequired,
     badgeFontWeight: number.isRequired,
     badgePaddingX: string.isRequired,
@@ -33,6 +44,9 @@ export function makeThemePropType(cssv = null) {
     brandNavBackground: cssv('color'),
     brandNavColor: cssv('color'),
     brandNavFontFamily: cssv('font-family').allowEmpty,
+    siteNavColor: cssv('color'),
+    siteNavBackground: cssv('color'),
+    siteNavHighlightColor: cssv('color'),
     breakpointLg: string.isRequired,
     breakpointMd: string.isRequired,
     breakpointSm: string.isRequired,
@@ -109,9 +123,8 @@ export function makeThemePropType(cssv = null) {
       yellow090: cssv('color'),
     }).isRequired,
     headingsColor: cssv('color'),
+    headingsTextTransform: cssv('text-transform'),
     headingsFontWeight: cssv('font-weight').isRequired,
-    iconActionsUrl: cssv('path').allowEmpty,
-    iconIndicatorsUrl: cssv('path').allowEmpty,
     imageOverlay: string.isRequired,
     inputBg: string.isRequired,
     inputBorderRadius: string.isRequired,
@@ -122,6 +135,9 @@ export function makeThemePropType(cssv = null) {
     inputLineHeight: number.isRequired,
     inputPaddingX: string.isRequired,
     inputPaddingY: string.isRequired,
+    introModal: exact({
+      videoUrls: objectOf(string).isRequired,
+    }),
     lineHeightBase: number.isRequired,
     lineHeightLg: number.isRequired,
     lineHeightMd: number.isRequired,
@@ -130,6 +146,7 @@ export function makeThemePropType(cssv = null) {
     name: string.isRequired,
     neutralDark: string.isRequired,
     neutralLight: string.isRequired,
+    orgPageBackgroundColor: string.isRequired,
     space: string.isRequired,
     spaces: exact({
       s000: number.isRequired,
@@ -153,6 +170,8 @@ export function makeThemePropType(cssv = null) {
     }).isRequired,
     themeLogoUrl: cssv('hashedFile').isRequired,
     themeLogoWhiteUrl: cssv('hashedFile').isRequired,
+    defaultAvatarUserImage: cssv('hashedFile').isRequired,
+    defaultAvatarOrgImage: cssv('hashedFile').isRequired,
     phaseTimelineColor: string.isRequired,
     textColor: exact({
       primary: cssv('color').isRequired,
@@ -170,6 +189,7 @@ export function makeThemePropType(cssv = null) {
         goalColor: cssv('color').isRequired,
         latestColor: cssv('color').isRequired,
         startColor: cssv('color').isRequired,
+        linkToSource: bool.isRequired,
       }).isRequired,
       categoryList: exact({
         background: cssv('color').isRequired,
@@ -177,6 +197,10 @@ export function makeThemePropType(cssv = null) {
       }),
     }).isRequired,
     settings: exact({
+      actionView: exact({
+        showPaginationTop: bool,
+        showPaginationBottom: bool,
+      }),
       dashboard: exact({
         showResponsibles: bool.isRequired,
         showIndicators: bool.isRequired,
@@ -190,21 +214,26 @@ export function makeThemePropType(cssv = null) {
       categories: exact({
         filterIndicatorsByAllLevels: bool.isRequired,
         categoryPageHideCategoryLabel: bool,
+        collapseLongTexts: bool,
       }),
       hiddenLocales: arrayOf(string),
-      fundingInstruments: arrayOf(exact({
-        id: string,
-        name: string,
-        logo: string,
-        link: string,
-      })).isRequired,
+      fundingInstruments: arrayOf(
+        exact({
+          id: string,
+          name: string,
+          logo: string,
+          link: string,
+        })
+      ).isRequired,
       leftAlignCategoryPages: bool,
-      otherLogos: arrayOf(exact({
-        id: string,
-        name: string,
-        logo: string,
-        link: string,
-      })).isRequired,
+      otherLogos: arrayOf(
+        exact({
+          id: string,
+          name: string,
+          logo: string,
+          link: string,
+        })
+      ).isRequired,
       attentionBannerContent: object,
       footerLogoOnly: bool,
       footerStatement: string,
@@ -225,15 +254,25 @@ export function makeThemePropType(cssv = null) {
       }),
       graphs: exact({
         lineShape: string,
+        fillMarkers: bool,
+        goalSymbol: string,
+        categorySymbols: arrayOf(string),
         areaGraphs: bool,
         customBackground: string,
         showTrendline: bool,
-        goalLineColor: string,
+        drawGoalLine: bool,
+        goalLineColors: arrayOf(string),
+        totalLineColor: string,
+        trendLineColor: string,
+        categoryColors: arrayOf(string),
+        roundIndicatorValue: bool,
       }),
       hideActionGrid: bool,
       hideIconOnActionListCards: bool,
       showActionDescriptionHeader: bool,
       showFeedbackLink: bool,
+      monsidoToken: string,
+      googleAnalyticsId: string,
     }),
     icons: objectOf(cssv('hashedFile')).isRequired,
     favicons: exact({

package/setup.cjs

@@ -23,20 +23,21 @@ function generateThemeSymlinks(destPath, opts) {
   const statRes = fs.lstatSync(destPath, { throwIfNoEntry: false });
   if (statRes) {
     if (statRes.isDirectory()) {
-      fs.rmdirSync(destPath);
+      fs.rmSync(destPath, { recursive: true });
     } else if (!statRes.isSymbolicLink()) {
       console.error(statRes);
       throw new Error(`${destPath} already exists and is not a symlink`);
-    }
-    const existingTarget = fs.readlinkSync(destPath);
-    if (existingTarget !== themesPath) {
-      console.log(`Removing existing symlink ${destPath}`);
-      fs.unlinkSync(destPath);
     } else {
-      if (verbose) {
-        console.log(`${destPath} already exists, not linking`);
+      const existingTarget = fs.readlinkSync(destPath);
+      if (existingTarget !== themesPath) {
+        console.log(`Removing existing symlink ${destPath}`);
+        fs.unlinkSync(destPath);
+      } else {
+        if (verbose) {
+          console.log(`${destPath} already exists, not linking`);
+        }
+        return;
       }
-      return;
     }
   }
   console.log(`🔗 Linking ${themesPath} → ${destPath}`);

package/types.ts

@@ -8,6 +8,7 @@ export interface Theme {
   actionCompletedColor: string;
   actionContinuousColor: string;
   actionOnTimeColor: string;
+  badgeColor: string;
   badgeBorderRadius: string | number;
   badgeFontWeight: number;
   badgePaddingX: string;
@@ -16,6 +17,9 @@ export interface Theme {
   brandLight: cssColor;
   brandNavBackground: cssColor;
   brandNavColor: cssColor;
+  siteNavColor: cssColor;
+  siteNavBackground: cssColor;
+  siteNavHighlightColor: cssColor;
   brandNavFontFamily: string;
   breakpointLg: string;
   breakpointMd: string;
@@ -25,7 +29,6 @@ export interface Theme {
   btnBorderWidth: css['borderWidth'];
   cardBorderRadius: css['borderRadius'];
   cardBorderWidth: css['borderWidth'];
-  combinedIconsFilename: string;
   customSelectIndicator: string;
   fontFamily: string;
   fontFamilyContent: string;
@@ -88,10 +91,9 @@ export interface Theme {
     yellow070: cssColor;
     yellow090: cssColor;
   };
+  headingsTextTransform: css['textTransform'];
   headingsColor: cssColor;
   headingsFontWeight: css['fontWeight'];
-  iconActionsUrl: string;
-  iconIndicatorsUrl: string;
   imageOverlay: string;
   inputBg: string;
   inputBorderRadius: string;
@@ -110,6 +112,7 @@ export interface Theme {
   name: string;
   neutralDark: cssColor;
   neutralLight: cssColor;
+  orgPageBackgroundColor: cssColor;
   space: string;
   taskStatusColors: {
     onTime: cssColor;
@@ -138,6 +141,8 @@ export interface Theme {
   };
   themeLogoUrl: string;
   themeLogoWhiteUrl: string;
+  defaultAvatarUserImage: string;
+  defaultAvatarOrgImage: string;
   phaseTimelineColor: string;
   textColor: {
     primary: string;
@@ -155,6 +160,7 @@ export interface Theme {
       goalColor: string;
       latestColor: string;
       startColor: string;
+      linkToSource: boolean;
     };
     categoryList?: {
       background: string;
@@ -162,6 +168,10 @@ export interface Theme {
     };
   };
   settings: {
+    actionView: {
+      showPaginationTop: boolean;
+      showPaginationBottom: boolean;
+    };
     dashboard: {
       showResponsibles: boolean;
       showIndicators: boolean;
@@ -175,6 +185,7 @@ export interface Theme {
     categories: {
       filterIndicatorsByAllLevels: boolean;
       categoryPageHideCategoryLabel?: boolean;
+      collapseLongTexts?: boolean;
     };
     hiddenLocales?: string[];
     fundingInstruments: {
@@ -193,6 +204,10 @@ export interface Theme {
     attentionBannerContent?: object;
     footerLogoOnly?: boolean;
     footerStatement?: string;
+    footerOwnerLinks?: {
+      title: string;
+      url: string;
+    }[];
     navigationLogoOnly?: boolean;
     stickyNavigation?: boolean;
     homeLink?: string;
@@ -207,15 +222,25 @@ export interface Theme {
     };
     graphs?: {
       lineShape?: string;
+      categorySymbols?: string[];
+      goalSymbol?: string;
+      fillMarkers?: boolean;
       areaGraphs?: boolean;
       customBackground?: cssColor;
       showTrendLine?: boolean;
-      goalLineColor?: cssColor;
+      drawGoalLine?: boolean;
+      goalLineColors: cssColor[];
+      totalLineColor: cssColor;
+      trendLineColor: cssColor;
+      categoryColors: cssColor[];
+      roundIndicatorValue?: boolean;
     };
     hideActionGrid?: boolean;
     hideIconOnActionListCards?: boolean;
     showActionDescriptionHeader?: boolean;
     showFeedbackLink?: boolean;
+    monsidoToken?: string;
+    googleAnalyticsId?: string;
   };
   icons: {
     [icon: string]: string;
@@ -226,4 +251,9 @@ export interface Theme {
     svg: string;
   };
   mainCssFile: string;
+  introModal?: {
+    videoUrls: {
+      [lang: string]: string;
+    };
+  };
 }