@pega/cosmos-react-core 8.0.0-build.3.2 → 8.0.0-build.30.0

package/lib/theme/themes/bootes2025DarkTheme.json

@@ -0,0 +1,148 @@
+{
+    "base": {
+        "palette": {
+            "ai": "#d6bcf5",
+            "app-background": "#212535",
+            "primary-background": "#1d1d20",
+            "secondary-background": "#1C1F2C",
+            "foreground-color": "#E5E2FF",
+            "brand-primary": "#7A8CE6",
+            "urgent": "#f66f78",
+            "warn": "#ffaa75",
+            "success": "#7ee791",
+            "interactive": "#7A8CE6",
+            "pending": "#d6bcf5",
+            "border-line": "#3e3f43",
+            "skeleton": "#9E9E9E",
+            "scrollbar-track": "rgba(0, 0, 0, 0.2)",
+            "scrollbar-thumb": "rgba(255, 255, 255, 0.6)",
+            "scrollbar-thumb-hover": "rgba(255, 255, 255, 0.7)"
+        },
+        "shadow": {
+            "focus": "0 0 0 0.11rem #fff, 0 0 0 0.18rem #71c1ff, 0 0 0 0.3rem #71c1ff1a",
+            "focus-inset": "inset 0 0 0 0.11rem #fff, inset 0 0 0 0.18rem #71c1ff, inset 0 0 0 0.3rem #71c1ff1a",
+            "focus-group": "0 0 0 0.125rem #71c1ff99",
+            "focus-group-inset": "inset 0 0 0 0.125rem #71c1ff99"
+        },
+        "font-family": "'Roboto Flex', sans-serif",
+        "font-stretch": "90%",
+        "line-height": "1.28",
+        "font-scale": "majorSecond",
+        "border-radius": "1rem"
+    },
+    "components": {
+        "avatar": {
+            "background-color": "#2E2E33"
+        },
+        "app-shell": {
+            "nav": {
+                "background": "#262b44",
+                "foreground-color": "#ffffff",
+                "border-color": "transparent",
+                "detached": true
+            },
+            "header": {
+                "background": "#3c4057",
+                "foreground-color": "#ffffff",
+                "border-color": "transparent"
+            }
+        },
+        "button": {
+            "border-radius": 0.5
+        },
+        "form-control": {
+            "border-radius": 0.25,
+            ":hover": {
+                "border-color": "#fafafa"
+            },
+            ":disabled": {
+                "background-color": "#676767"
+            },
+            ":read-only": {
+                "background-color": "#676767"
+            }
+        },
+        "tabs": {
+            "detached": true
+        },
+        "table": {
+            "typography": {
+                "font-stretch": "50%"
+            },
+            "striped-rows": true
+        },
+        "tooltip": {
+            "foreground-color": "#3f3f3f",
+            "background-color": "#fafafa"
+        },
+        "badges": {
+            "font-stretch": "50%",
+            "count": {
+                "default": {
+                    "background": "#E5E2FF1a",
+                    "foreground": "#E5E2FF"
+                }
+            },
+            "keyboard": {
+                "background-color": "#676767",
+                "border-color": "#9E9E9E"
+            },
+            "status": {
+                "success": {
+                    "background": "#156f35",
+                    "foreground": "#d4f7d5"
+                },
+                "warn": {
+                    "background": "#b54703",
+                    "foreground": "#feede2"
+                },
+                "urgent": {
+                    "background": "#a6020d",
+                    "foreground": "#ffdbde"
+                },
+                "pending": {
+                    "background": "#681fc3",
+                    "foreground": "#f1e9fb"
+                },
+                "info": {
+                    "background": "#4c5a67",
+                    "foreground": "#e9eef3"
+                }
+            }
+        },
+        "announcement": {
+            "background": "linear-gradient(4deg, #3D2F98 50% , #282762 100%)",
+            "foreground-color": "#ffffff"
+        },
+        "case-view": {
+            "header": {
+                "background": "linear-gradient(4deg, #3D2F98 50% , #282762 100%)",
+                "foreground-color": "#ffffff"
+            },
+            "summary": { "detached": true },
+            "utilities": { "detached": false, "background": "rgba(255,255,255,0.1)" },
+            "assignments": { "detached": true, "background": "rgba(255,255,255,0.1)" },
+            "stages": {
+                "status": {
+                    "completed": {
+                        "background": "#156f35",
+                        "foreground-color": "#d4f7d5"
+                    },
+                    "current": {
+                        "background": "#7A8CE6",
+                        "foreground-color": "#1C1F2C"
+                    }
+                }
+            }
+        },
+        "field-value-list": {
+            "inline": {
+                "detached": true
+            }
+        },
+        "label": {
+            "foreground-color": "#E5E2FF",
+            "font-size": "s"
+        }
+    }
+}

package/lib/theme/themes/bootes2025Theme.json

@@ -0,0 +1,86 @@
+{
+    "base": {
+        "font-family": "'Roboto Flex', sans-serif",
+        "font-stretch": "90%",
+        "line-height": "1.28",
+        "font-scale": "majorSecond",
+        "palette": {
+            "app-background": "#E0E3F1",
+            "brand-primary": "#3A53E9",
+            "border-line": "#CFCFCF",
+            "secondary-background": "#F6F7FD",
+            "foreground-color": "#000000"
+        },
+        "border-radius": "1rem"
+    },
+    "components": {
+        "avatar": {
+            "background-color": "#2E2E33"
+        },
+        "app-shell": {
+            "nav": {
+                "background": "#E9EBF5",
+                "foreground-color": "#001F5F",
+                "border-color": "transparent",
+                "detached": true
+            },
+            "header": {
+                "background": "#eff1f8",
+                "foreground-color": "#001F5F",
+                "border-color": "transparent"
+            }
+        },
+        "button": {
+            "border-radius": 0.5
+        },
+        "form-control": {
+            "border-radius": 0.25
+        },
+        "tabs": {
+            "detached": true
+        },
+        "table": {
+            "typography": {
+                "font-stretch": "50%"
+            },
+            "striped-rows": true
+        },
+        "badges": {
+            "font-stretch": "50%"
+        },
+        "announcement": {
+            "background": "linear-gradient(4deg, #3A53E9 50%, #0043c8 100%)",
+            "foreground-color": "#ffffff"
+        },
+        "case-view": {
+            "header": {
+                "background": "linear-gradient(4deg, #3A53E9 50%, #0043c8 100%)",
+                "foreground-color": "#ffffff"
+            },
+            "summary": { "detached": true },
+            "utilities": { "detached": false, "background": "rgba(255,255,255,0.5)" },
+            "assignments": { "detached": true, "background": "rgba(255,255,255,0.5)" },
+            "stages": {
+                "status": {
+                    "completed": {
+                        "background": "#d4f7d5",
+                        "foreground-color": "#0b381a"
+                    },
+                    "current": {
+                        "background": "#3A53E9",
+                        "foreground-color": "#ffffff"
+                    }
+                }
+            }
+        },
+        "field-value-list": {
+            "inline": {
+                "detached": true
+            }
+        },
+        "label": {
+            "foreground-color": "#000000",
+            "font-size": "s"
+        }
+    }
+}

package/lib/theme/themes/conciergeDarkTheme.json

@@ -0,0 +1,102 @@
+{
+    "components": {
+        "tabs": {
+            "detached": true
+        },
+        "field-value-list": {
+            "inline": {
+                "detached": true
+            }
+        },
+        "app-shell": {
+            "header": {
+                "background": "rgba(0,0,0,0.7)",
+                "border-color": "transparent",
+                "foreground-color": "#C0AF9F"
+            },
+            "nav": {
+                "background": "#000000",
+                "border-color": "transparent",
+                "foreground-color": "#ffffff"
+            }
+        },
+        "case-view": {
+            "header": {
+                "background": "linear-gradient(45deg, #ab9d8d 0%, #ab9d8d 60%, #bfb3a1 60%, #967d5e 100%)"
+            },
+            "summary": {
+                "detached": true
+            },
+            "utilities": {
+                "detached": false,
+                "background": "rgba(0,0,0,0.5)"
+            },
+            "assignments": {
+                "detached": true,
+                "background": "rgba(0,0,0,0.5)"
+            }
+        },
+        "button": {
+            "color": "#deb78e",
+            "secondary-color": "#deb78e",
+            "border-radius": 0
+        },
+        "avatar": {
+            "background-color": "#2e2e33"
+        },
+        "card": {
+            "background": "#050404",
+            "border-radius": "0rem"
+        },
+        "announcement": {
+            "background": "linear-gradient(45deg, #ab9d8d 0%, #ab9d8d 60%, #bfb3a1 60%, #967d5e 100%)"
+        },
+        "link": {
+            "color": "#deb78e"
+        },
+        "text": {
+            "primary": {
+                "font-family": "'Roboto Flex', sans-serif"
+            },
+            "secondary": {
+                "font-family": "'Roboto Flex', sans-serif"
+            },
+            "h1": {
+                "font-family": "Lora, serif"
+            },
+            "h2": {
+                "font-family": "Lora, serif"
+            },
+            "h3": {
+                "font-family": "Lora, serif"
+            },
+            "h4": {
+                "font-family": "Lora, serif"
+            },
+            "h5": {
+                "font-family": "Lora, serif"
+            },
+            "h6": {
+                "font-family": "Lora, serif"
+            }
+        },
+        "form-control": {
+            "border-radius": 0,
+            "border-color": "#939393"
+        }
+    },
+    "base": {
+        "palette": {
+            "app-background": "url(https://pegasystems.github.io/uplus-wss/img/concierge-dark-bg.png) center / auto repeat",
+            "interactive": "#deb78e",
+            "brand-primary": "#deb78e",
+            "border-line": "#363535",
+            "foreground-color": "#ffffff",
+            "primary-background": "#050404",
+            "secondary-background": "#0c0c0e"
+        },
+        "font-family": "'Roboto Flex', sans-serif",
+        "font-size": "0.875rem",
+        "border-radius": "0rem"
+    }
+}

package/lib/theme/themes/conciergeTheme.json

@@ -0,0 +1,101 @@
+{
+    "components": {
+        "tabs": {
+            "detached": true
+        },
+        "field-value-list": {
+            "inline": {
+                "detached": true
+            }
+        },
+        "app-shell": {
+            "header": {
+                "background": "linear-gradient(90deg, #ffffff 0%, #FFFEFF 100%)",
+                "border-color": "transparent",
+                "foreground-color": "#856447"
+            },
+            "nav": {
+                "background": "#ffffff",
+                "border-color": "transparent",
+                "foreground-color": "#000000"
+            }
+        },
+        "case-view": {
+            "header": {
+                "background": "linear-gradient(45deg, #ab9d8d 0%, #ab9d8d 60%, #bfb3a1 60%, #967d5e 100%)"
+            },
+            "summary": {
+                "detached": true
+            },
+            "utilities": {
+                "detached": false,
+                "background": "rgba(255,255,255,0.5)"
+            },
+            "assignments": {
+                "detached": true,
+                "background": "rgba(255,255,255,0.5)"
+            }
+        },
+        "button": {
+            "color": "#856447",
+            "secondary-color": "#856447",
+            "border-radius": 0
+        },
+        "avatar": {
+            "background-color": "#2e2e33"
+        },
+        "card": {
+            "background": "#ffffff",
+            "border-radius": "0rem"
+        },
+        "announcement": {
+            "background": "linear-gradient(45deg, #ab9d8d 0%, #ab9d8d 60%, #bfb3a1 60%, #967d5e 100%)"
+        },
+        "link": {
+            "color": "#856447"
+        },
+        "text": {
+            "primary": {
+                "font-family": "'Roboto Flex', sans-serif"
+            },
+            "secondary": {
+                "font-family": "'Roboto Flex', sans-serif"
+            },
+            "h1": {
+                "font-family": "Lora, serif"
+            },
+            "h2": {
+                "font-family": "Lora, serif"
+            },
+            "h3": {
+                "font-family": "Lora, serif"
+            },
+            "h4": {
+                "font-family": "Lora, serif"
+            },
+            "h5": {
+                "font-family": "Lora, serif"
+            },
+            "h6": {
+                "font-family": "Lora, serif"
+            }
+        },
+        "form-control": {
+            "border-radius": 0
+        }
+    },
+    "base": {
+        "palette": {
+            "app-background": "url(https://pegasystems.github.io/uplus-wss/img/concierge-light-bg.png) center / auto repeat",
+            "interactive": "#856447",
+            "brand-primary": "#856447",
+            "border-line": "#dfd7cf",
+            "foreground-color": "#050505",
+            "primary-background": "#ffffff",
+            "secondary-background": "#fdf9f5"
+        },
+        "font-family": "'Roboto Flex', sans-serif",
+        "font-size": "0.875rem",
+        "border-radius": "0rem"
+    }
+}

package/lib/theme/themes/elegantDarkTheme.json

@@ -0,0 +1,78 @@
+{
+    "base": {
+        "font-family": "Montserrat, sans-serif",
+        "font-stretch": "90%",
+        "line-height": "1.28",
+        "palette": {
+            "app-background": "#41343c",
+            "brand-primary": "#ad587c",
+            "interactive": "#859dff",
+            "border-line": "#675460",
+            "foreground-color": "#ffffff",
+            "primary-background": "#251d22",
+            "secondary-background": "#080708"
+        },
+        "font-size": "0.8125rem"
+    },
+    "components": {
+        "app-shell": {
+            "nav": {
+                "background": "linear-gradient(180deg, #2a1421 0%, #4f454b 50%, #4f454b 100%)",
+                "foreground-color": "#ffffff",
+                "border-color": "transparent",
+                "detached": true
+            },
+            "header": {
+                "background": "linear-gradient(45deg, #4d3d45 0%, #6b335c 90%, #7e4469 10%, #4a082e 100%)",
+                "foreground-color": "#ffffff",
+                "border-color": "transparent"
+            }
+        },
+        "button": {
+            "border-radius": 9999,
+            "color": "#859dff",
+            "secondary-color": "#859dff"
+        },
+        "form-control": {
+            "border-radius": 1,
+            "border-color": "#8d7785"
+        },
+        "tabs": {
+            "detached": true
+        },
+        "field-value-list": {
+            "inline": {
+                "detached": true
+            }
+        },
+        "table": {
+            "typography": {
+                "font-stretch": "50%"
+            },
+            "striped-rows": true
+        },
+        "badges": {
+            "font-stretch": "50%"
+        },
+        "announcement": {
+            "background": "linear-gradient(225deg, #561a3a 0%, #7a2467 30%, #670f54 10%, #773c64 100%)",
+            "foreground-color": "#ffffff"
+        },
+        "case-view": {
+            "header": {
+                "background": "linear-gradient(225deg, #561a3a 0%, #7a2467 30%, #670f54 10%, #773c64 100%)",
+                "foreground-color": "#ffffff"
+            },
+            "summary": { "detached": true },
+            "utilities": { "detached": false, "background": "rgba(255,255,255,0.05)" },
+            "assignments": {
+                "detached": true,
+                "background": "rgba(255,255,255,0.05)"
+            }
+        },
+        "card": {
+            "background": "linear-gradient(45deg, #251d22 0%, #251d22 80%, #0e0014 100%)",
+            "foreground-color": "#ffffff"
+        }
+    }
+}

package/lib/theme/themes/elegantTheme.json

@@ -0,0 +1,71 @@
+{
+    "base": {
+        "font-family": "Montserrat, sans-serif",
+        "font-stretch": "90%",
+        "line-height": "1.28",
+        "palette": {
+            "app-background": "#e0dbe1",
+            "brand-primary": "#ad587c",
+            "interactive": "#425ab8",
+            "border-line": "#d6b8cb",
+            "foreground-color": "#200024"
+        },
+        "font-size": "0.8125rem"
+    },
+    "components": {
+        "app-shell": {
+            "nav": {
+                "background": "linear-gradient(180deg, #f9f3eb 0%, #eadcea 50%, #eadcea 100%)",
+                "foreground-color": "#001F5F",
+                "border-color": "transparent",
+                "detached": true
+            },
+            "header": {
+                "background": "linear-gradient(45deg, #f9f3eb 0%, #aa4f76 90%, #bd6b8e 10%, #961453 100%)",
+                "foreground-color": "#001F5F",
+                "border-color": "transparent"
+            }
+        },
+        "button": {
+            "border-radius": 9999,
+            "color": "#425ab8",
+            "secondary-color": "#425ab8"
+        },
+        "form-control": {
+            "border-radius": 1,
+            "border-color": "#8d7785"
+        },
+        "tabs": {
+            "detached": true
+        },
+        "field-value-list": { "inline": { "detached": true } },
+        "table": {
+            "typography": {
+                "font-stretch": "50%"
+            },
+            "striped-rows": true
+        },
+        "badges": {
+            "font-stretch": "50%"
+        },
+        "announcement": {
+            "background": "linear-gradient(225deg, #9f305f 0%, #9f305f 30%, #961352 10%, #ad587c 100%)",
+            "foreground-color": "#ffffff"
+        },
+        "case-view": {
+            "header": {
+                "background": "linear-gradient(225deg, #9f305f 0%, #9f305f 30%, #961352 10%, #ad587c 100%)",
+                "foreground-color": "#ffffff"
+            },
+            "summary": { "detached": true },
+            "utilities": { "detached": false, "background": "rgba(255,255,255,0.5)" },
+            "assignments": {
+                "detached": true,
+                "background": "rgba(255,255,255,0.5)"
+            }
+        },
+        "card": {
+            "background": "linear-gradient(45deg, #ffffff 0%, #ffffff 80%, #fdf5ed 100%)"
+        }
+    }
+}

package/lib/theme/themes/pastelTheme.json

@@ -0,0 +1,60 @@
+{
+    "components": {
+        "tabs": {
+            "detached": true
+        },
+        "field-value-list": {
+            "inline": {
+                "detached": true
+            }
+        },
+        "case-view": {
+            "header": {
+                "background": "linear-gradient(135deg, #bd7abb 0%, #e2c2eb 70%, #d1a9df 70%, #d8dffd 100%)"
+            },
+            "summary": {
+                "detached": true
+            },
+            "utilities": {
+                "detached": false,
+                "background": "rgba(255,255,255,0.5)"
+            },
+            "assignments": {
+                "detached": true,
+                "background": "rgba(255,255,255,0.5)"
+            }
+        },
+        "app-shell": {
+            "nav": {
+                "background": "linear-gradient(180deg, #9de0e1 0%, #b09fe0 50%, #d89ae5 100%)",
+                "border-color": "transparent",
+                "detached": true
+            },
+            "header": {
+                "background": "#4a67f7",
+                "foreground-color": "#ffffff",
+                "border-color": "transparent"
+            }
+        },
+        "button": {
+            "color": "#0142d7",
+            "secondary-color": "#0142d7"
+        },
+        "card": {
+            "background": "#ffffff"
+        },
+        "avatar": {
+            "background-color": "#ad39b0"
+        },
+        "announcement": {
+            "background": "linear-gradient(135deg, #bd7abb 0%, #e2c2eb 70%, #d1a9df 70%, #d8dffd 100%)"
+        }
+    },
+    "base": {
+        "palette": {
+            "interactive": "#0142d7",
+            "brand-primary": "#464feb",
+            "app-background": "linear-gradient(135deg, #f9f2ef 0%, #f8e8dc 80%, #fff7f0 80%, #faf2f0 100%)"
+        }
+    }
+}