@cytario/design 7.2.0 → 8.0.0

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.
Files changed (41) hide show
  1. package/README.md +15 -28
  2. package/assets/approvals/.gitkeep +0 -0
  3. package/assets/fonts/.gitkeep +0 -0
  4. package/assets/fonts/Montserrat-Italic-VariableFont_wght.ttf +0 -0
  5. package/assets/fonts/Montserrat-VariableFont_wght.ttf +0 -0
  6. package/assets/logos/.gitkeep +0 -0
  7. package/assets/logos/cytario-logo-mono-black.svg +1 -0
  8. package/assets/logos/cytario-logo-mono-white.svg +1 -0
  9. package/assets/logos/cytario-logo-on-purple.svg +1 -0
  10. package/assets/logos/cytario-logo-purple-tagline.svg +1 -0
  11. package/assets/logos/cytario-logo-purple.svg +1 -0
  12. package/assets/logos/cytario-logo-white-tagline.svg +1 -0
  13. package/assets/logos/cytario-logo-white.svg +1 -0
  14. package/assets/logos/png/cytario-logo-mono-white.png +0 -0
  15. package/assets/logos/png/cytario-logo-on-purple.png +0 -0
  16. package/assets/logos/png/cytario-logo-purple-tagline.png +0 -0
  17. package/assets/logos/png/cytario-logo-purple.png +0 -0
  18. package/assets/logos/png/cytario-logo-white-tagline.png +0 -0
  19. package/assets/logos/png/cytario-logo-white.png +0 -0
  20. package/assets/wireframes/DESIGN-SPEC.md +150 -0
  21. package/assets/wireframes/connection-info-edit-aws.puml +41 -0
  22. package/assets/wireframes/connection-info-edit-custom.puml +34 -0
  23. package/assets/wireframes/connection-info-view.puml +42 -0
  24. package/assets/wireframes/file-info-default.puml +25 -0
  25. package/assets/wireframes/file-info-delete-confirm.puml +28 -0
  26. package/dist/fonts/Montserrat-Italic-VariableFont_wght.ttf +0 -0
  27. package/dist/fonts/Montserrat-VariableFont_wght.ttf +0 -0
  28. package/dist/index.css +1 -1
  29. package/dist/index.d.ts +11 -205
  30. package/dist/index.js +60 -416
  31. package/dist/index.js.map +1 -1
  32. package/package.json +7 -10
  33. package/src/styles/fonts/Montserrat-Italic-VariableFont_wght.ttf +0 -0
  34. package/src/styles/fonts/Montserrat-VariableFont_wght.ttf +0 -0
  35. package/src/styles/tailwind.css +1 -98
  36. package/src/styles/theme.css +558 -0
  37. package/src/styles/tokens.css +189 -0
  38. package/src/styles/global.css +0 -48
  39. package/src/tokens/utilities.css +0 -55
  40. package/src/tokens/variables-dark.css +0 -201
  41. package/src/tokens/variables.css +0 -201
package/README.md CHANGED
@@ -10,7 +10,7 @@ Single source of truth for the cytario corporate identity -- from brand foundati
10
10
  | UI framework | React 19, TypeScript 5.9 |
11
11
  | Styling | Tailwind CSS v4, CSS custom properties |
12
12
  | Accessibility | React Aria Components (Adobe) |
13
- | Design tokens | W3C DTCG JSON, Style Dictionary v4 |
13
+ | Design tokens | CSS custom properties (`src/styles/theme.css`) |
14
14
  | Testing | Vitest, React Testing Library, axe-core (addon-a11y) |
15
15
 
16
16
  ## Getting started
@@ -23,7 +23,6 @@ Single source of truth for the cytario corporate identity -- from brand foundati
23
23
 
24
24
  ```bash
25
25
  npm install
26
- npm run build:tokens # generate CSS variables + TypeScript constants from token JSON
27
26
  npm run dev # start Storybook at http://localhost:6006
28
27
  ```
29
28
 
@@ -36,18 +35,12 @@ cytario-design/
36
35
  logos/ # SVG and PNG logo variants (full, reduced, black, white, on-purple)
37
36
  fonts/ # Montserrat font files
38
37
  approvals/ # approved brand materials
39
- tokens/
40
- base.json # primitive color, spacing, typography tokens (W3C DTCG)
41
- semantic.json # semantic aliases referencing base tokens
42
38
  scripts/
43
- build-tokens.ts # Style Dictionary build script
39
+ validate-tokens.ts # CI script to verify dark-theme invariant
44
40
  src/
45
- tokens/
46
- variables.css # auto-generated CSS custom properties (do not edit)
47
- tokens.ts # auto-generated TypeScript constants (do not edit)
48
41
  styles/
49
- tailwind.css # Tailwind v4 @theme configuration
50
- global.css # global styles and font-face declarations
42
+ theme.css # single hand-maintained token file — primitives, light/dark semantics, @theme inline
43
+ tailwind.css # Tailwind v4 entry point (imports theme.css)
51
44
  components/
52
45
  Button/ # Button.tsx, Button.stories.tsx, Button.test.tsx
53
46
  Input/ # Input.tsx, Input.stories.tsx, Input.test.tsx
@@ -58,26 +51,20 @@ cytario-design/
58
51
 
59
52
  ## Design tokens
60
53
 
61
- Tokens follow the W3C Design Token Community Group (DTCG) format and live in `tokens/`.
54
+ Tokens are hand-maintained in `src/styles/theme.css` — a single CSS file that is the source of truth:
62
55
 
63
- **Pipeline:**
56
+ - **Primitives** (`:root`): raw hex/rgba values (`--color-purple-500`)
57
+ - **Semantic light** (`:root`): `var()` refs to primitives (`--color-primary: var(--color-purple-500)`)
58
+ - **Semantic dark** (`[data-theme="dark"]`): overrides for every semantic token
59
+ - **`@theme inline`**: maps tokens to Tailwind v4 utility names
64
60
 
65
- ```
66
- tokens/base.json + tokens/semantic.json
67
- -> Style Dictionary v4 (scripts/build-tokens.ts)
68
- -> src/tokens/variables.css (CSS custom properties)
69
- -> src/tokens/tokens.ts (TypeScript constants)
70
- ```
71
-
72
- Semantic tokens reference base tokens using `{color.purple.700}` syntax.
61
+ All token CSS lives in `@layer cytario-design` so consumer app styles can override.
73
62
 
74
63
  ### Adding or modifying tokens
75
64
 
76
- 1. Edit `tokens/base.json` (primitives) or `tokens/semantic.json` (aliases).
77
- 2. Run `npm run build:tokens` to regenerate the output files.
78
- 3. If you added a new color scale, also add matching entries to `src/styles/tailwind.css` under the `@theme` block so Tailwind utility classes are available.
79
-
80
- **Do not edit `src/tokens/variables.css` or `src/tokens/tokens.ts` directly** -- they are overwritten on every build.
65
+ 1. Edit `src/styles/theme.css` directly.
66
+ 2. If adding a new color scale, add entries in all four sections (primitives, light semantics, dark semantics, `@theme inline`).
67
+ 3. Run `npm run validate:tokens` to verify the dark-theme invariant (every `:root` color has a `[data-theme="dark"]` counterpart).
81
68
 
82
69
  ## Component development
83
70
 
@@ -113,7 +100,7 @@ The cytario brand is built on two primary colors:
113
100
  | Purple | `#5c2483` | `--color-purple-700` / `--color-brand-primary` | Primary brand color, headings, secondary actions |
114
101
  | Teal | `#35b7b8` | `--color-teal-500` / `--color-brand-accent` | Accent color, primary actions, interactive elements |
115
102
 
116
- Both colors have a full 50--900 scale defined in `tokens/base.json` for use in hover states, backgrounds, and subtle tints.
103
+ Both colors have a full 50--900 scale defined in `src/styles/theme.css` for use in hover states, backgrounds, and subtle tints.
117
104
 
118
105
  ## Available components
119
106
 
@@ -130,7 +117,7 @@ Both colors have a full 50--900 scale defined in `tokens/base.json` for use in h
130
117
  |---|---|
131
118
  | `npm run dev` | Start Storybook dev server on port 6006 |
132
119
  | `npm run build` | Build static Storybook site to `storybook-static/` |
133
- | `npm run build:tokens` | Generate CSS and TypeScript from token JSON |
120
+ | `npm run validate:tokens` | Verify dark-theme invariant in token CSS |
134
121
  | `npm test` | Run Vitest test suite (watch mode) |
135
122
  | `npx vitest run` | Run tests once (CI mode) |
136
123
  | `npm run lint` | Lint `src/` with ESLint |
package/assets/approvals/.gitkeep ADDED
File without changes
package/assets/fonts/.gitkeep ADDED
File without changes
package/assets/logos/.gitkeep ADDED
File without changes
package/assets/logos/cytario-logo-mono-black.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="164.722" height="59.067" viewBox="0 0 164.722 59.067"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M-69.177-50.044h769.89v382.677h-769.89Z"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><path d="M-75.73-70.113h769.89v382.677H-75.73Z"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><path d="M-104.176-50.128h769.89V332.55h-769.89Z"/></clipPath><clipPath id="d" clipPathUnits="userSpaceOnUse"><path d="M-118.087-58.675h769.89v382.677h-769.89Z"/></clipPath><clipPath id="e" clipPathUnits="userSpaceOnUse"><path d="M-129.896-70.113h769.89v382.677h-769.89Z"/></clipPath><clipPath id="f" clipPathUnits="userSpaceOnUse"><path d="M-139.93-70.196h769.89v382.677h-769.89Z"/></clipPath><clipPath id="g" clipPathUnits="userSpaceOnUse"><path d="M-158.597-53.39h769.89v382.677h-769.89Z"/></clipPath><clipPath id="h" clipPathUnits="userSpaceOnUse"><path d="M-174.335-67.593h769.89v382.677h-769.89Z"/></clipPath></defs><path d="M0 0c0-.21-.041-.295-.209-.335-1.34-.546-3.017-.672-4.651-.672-6.788 0-10.809 4.653-10.809 10.684 0 6.202 4.609 10.812 11.522 10.812 2.096 0 3.226-.21 3.938-.461.168-.083.209-.209.209-.461l-.041-3.728c0-.293-.168-.293-.335-.253-.88.335-1.97.546-3.603.546-3.814 0-6.496-2.264-6.496-6.286 0-4.569 3.31-6.327 6.536-6.327 1.509 0 2.809.127 3.646.42.209.082.293-.044.293-.211Z" clip-path="url(#a)" style="fill:#000;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 20.892 46.213)"/><path d="M0 0c.167 0 .293-.041.376-.251C3.1-8.086 4.525-12.612 5.069-14.665c1.382 4.233 2.85 8.547 4.735 14.414.084.167.209.251.461.251h4.316c.251 0 .293-.125.251-.334-3.018-9.261-7.819-20.925-11.213-28.674-.085-.169-.209-.295-.544-.295l-4.59-.406c-.251 0-.309.139-.209.336a164 164 0 0 1 4.196 9.092c.084.253.125.379.041.672C1.382-16.844-2.64-6.872-5.154-.293c-.084.168.04.293.251.293Z" clip-path="url(#b)" style="fill:#000;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 29.63 19.455)"/><path d="M0 0c0-.252-.041-.419-.251-.503-1.132-.42-2.179-.586-3.561-.586-3.436 0-5.49 1.675-5.49 5.824v11.019h-2.639c-.208.041-.294.127-.294.378v3.52c0 .25.086.334.335.334l2.598.009c.041 1.468 0 3.703 0 5.145.041.209.126.335.335.377l4.447.394c.2.02.293 0 .293-.209v-5.707l4.102-.009c.211 0 .293-.084.293-.293v-3.646c0-.208-.082-.293-.293-.293h-4.107V5.823c0-1.842.586-2.723 2.39-2.723.542 0 1.005.041 1.591.167.126.043.251 0 .251-.25Z" clip-path="url(#c)" style="fill:#000;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 67.558 46.102)"/><path d="M0 0c-.63.084-1.342.126-2.305.126-3.311 0-4.776-1.089-4.776-2.891 0-1.551 1.088-2.891 4.104-2.891 1.091 0 2.054.126 2.977.502zm4.902-4.944c0-.921 0-1.76.084-2.64 0-.083 0-.125-.084-.168C1.467-9.218-.963-9.637-3.814-9.637c-4.567 0-8.212 2.137-8.212 6.872 0 4.441 3.98 6.663 9.428 6.663 1.256 0 2.219-.044 2.598-.084v.502c0 .965-.546 3.143-4.233 3.143-2.093 0-3.939-.42-5.49-1.175-.126-.04-.335 0-.335.253v3.645c0 .209.042.293.253.418 1.802.839 4.107 1.259 6.37 1.259 5.823 0 8.337-3.647 8.337-8.298z" clip-path="url(#d)" style="fill:#000;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 86.105 34.706)"/><path d="M0 0c.252 0 .379-.084.461-.334.209-.545.376-1.594.42-2.515C2.305-1.088 4.582.419 7.473.419c.251 0 .446-.121.446-.433v-4.3c0-.211-.084-.295-.377-.295-2.974.084-5.446-.963-6.41-2.221v-13.491c0-.253-.125-.335-.378-.335h-4.357c-.292 0-.378.126-.378.335 0 0 .015 18.591.015 20.07 0 .21.042.251.253.251z" clip-path="url(#e)" style="fill:#000;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 101.851 19.455)"/><path d="M0 0c0 .186.152.338.338.338a4.773 4.773 0 0 0 4.773-4.774v-15.972c0-.251-.086-.334-.379-.334H.419c-.293 0-.419.126-.419.377Z" clip-path="url(#f)" style="fill:#000;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 115.228 19.345)"/><path d="M0 0a6.415 6.415 0 0 0-6.356 6.475 6.415 6.415 0 1 0 12.831-.119A6.415 6.415 0 0 0 0 0m1.573 16.958c-1.684.25-4.143.078-5.373.158-4.321.291-7.287 4.505-7.295 8.695-.001 3.185-1.797 4.984-4.168 5.418a5.08 5.08 0 0 1-4.086-1.023 5.08 5.08 0 0 1-1.845-3.785c-.066-2.409 1.322-4.539 4.439-5.198 4.098-.875 7.606-4.651 6.996-8.937-.177-1.22-.867-3.725-.969-5.425C-11.099.951-6.335-4.203-.305-4.331c2.655-.057 5.118.828 7.028 2.376s3.318 3.767 3.778 6.383c1.068 5.825-2.936 11.643-8.928 12.53" clip-path="url(#g)" style="fill:#000;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 140.119 41.753)"/><path d="M0 0c0 .424-.31.73-.905.73h-.751V-.712h.751C-.31-.712 0-.443 0 0m-1.656-1.195v-1.481h-.538v3.887h1.289C-.018 1.211.559.75.559.018c0-.577-.367-.962-.905-1.115L.751-2.676H.114L-.887-1.195zm3.811.463c0 1.79-1.25 3.061-3.06 3.061-1.809 0-3.08-1.271-3.08-3.061 0-1.809 1.271-3.08 3.08-3.08s3.06 1.271 3.06 3.08m-6.68 0c0 2.06 1.523 3.581 3.62 3.581S2.714 1.328 2.714-.732c0-2.08-1.521-3.6-3.619-3.6-2.097 0-3.62 1.52-3.62 3.6" clip-path="url(#h)" style="fill:#000;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 161.103 22.815)"/></svg>
package/assets/logos/cytario-logo-mono-white.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="164.722" height="59.067" viewBox="0 0 164.722 59.067"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M-338.197-50.044h769.89v382.677h-769.89Z"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><path d="M-344.75-70.113h769.89v382.677h-769.89Z"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><path d="M-373.196-50.128h769.89V332.55h-769.89Z"/></clipPath><clipPath id="d" clipPathUnits="userSpaceOnUse"><path d="M-387.107-58.675h769.89v382.677h-769.89Z"/></clipPath><clipPath id="e" clipPathUnits="userSpaceOnUse"><path d="M-398.916-70.113h769.89v382.677h-769.89Z"/></clipPath><clipPath id="f" clipPathUnits="userSpaceOnUse"><path d="M-408.95-70.196h769.89v382.677h-769.89Z"/></clipPath><clipPath id="g" clipPathUnits="userSpaceOnUse"><path d="M-427.617-53.39h769.89v382.677h-769.89Z"/></clipPath><clipPath id="h" clipPathUnits="userSpaceOnUse"><path d="M-443.355-67.593h769.89v382.677h-769.89Z"/></clipPath></defs><path d="M0 0c0-.21-.041-.295-.209-.335-1.34-.546-3.017-.672-4.651-.672-6.787 0-10.809 4.653-10.809 10.684 0 6.202 4.609 10.812 11.522 10.812 2.096 0 3.226-.21 3.938-.461.168-.083.209-.209.209-.461l-.041-3.728c0-.293-.168-.293-.335-.253-.88.335-1.97.546-3.603.546-3.814 0-6.496-2.264-6.496-6.286 0-4.569 3.31-6.327 6.536-6.327 1.509 0 2.809.127 3.646.42.209.082.293-.044.293-.211Z" clip-path="url(#a)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 20.892 46.213)"/><path d="M0 0c.167 0 .293-.041.376-.251C3.1-8.086 4.525-12.612 5.069-14.665c1.382 4.233 2.85 8.547 4.735 14.414.084.167.209.251.461.251h4.316c.251 0 .293-.125.251-.334-3.018-9.261-7.819-20.925-11.214-28.674-.084-.169-.208-.295-.543-.295l-4.59-.406c-.251 0-.309.139-.209.336a164 164 0 0 1 4.196 9.092c.084.253.125.379.041.672C1.382-16.844-2.64-6.872-5.154-.293c-.084.168.04.293.251.293Z" clip-path="url(#b)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 29.63 19.455)"/><path d="M0 0c0-.252-.041-.419-.251-.503-1.132-.42-2.179-.586-3.561-.586-3.436 0-5.49 1.675-5.49 5.824v11.019h-2.639c-.208.041-.294.127-.294.378v3.52c0 .25.086.334.335.334l2.598.009c.041 1.468 0 3.703 0 5.145.041.209.126.335.335.377l4.447.394c.2.02.293 0 .293-.209v-5.707l4.102-.009c.211 0 .293-.084.293-.293v-3.646c0-.208-.082-.293-.293-.293h-4.107V5.823c0-1.842.586-2.723 2.39-2.723.542 0 1.005.041 1.591.167.126.043.251 0 .251-.25Z" clip-path="url(#c)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 67.558 46.102)"/><path d="M0 0c-.63.084-1.342.126-2.305.126-3.311 0-4.776-1.089-4.776-2.891 0-1.551 1.088-2.891 4.104-2.891 1.091 0 2.054.126 2.977.502zm4.902-4.944c0-.921 0-1.76.084-2.64 0-.083 0-.125-.084-.168C1.467-9.218-.963-9.637-3.814-9.637c-4.567 0-8.212 2.137-8.212 6.872 0 4.441 3.98 6.663 9.428 6.663 1.256 0 2.219-.044 2.598-.084v.502c0 .965-.545 3.143-4.233 3.143-2.093 0-3.939-.42-5.49-1.175-.126-.04-.335 0-.335.253v3.645c0 .209.042.293.253.418 1.802.839 4.107 1.259 6.37 1.259 5.823 0 8.337-3.647 8.337-8.298z" clip-path="url(#d)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 86.105 34.706)"/><path d="M0 0c.252 0 .379-.084.461-.334.209-.545.376-1.594.42-2.515C2.305-1.088 4.582.419 7.473.419c.251 0 .446-.121.446-.433v-4.3c0-.211-.084-.295-.377-.295-2.974.084-5.446-.963-6.41-2.221v-13.491c0-.253-.125-.335-.378-.335h-4.358c-.291 0-.377.126-.377.335 0 0 .015 18.591.015 20.07 0 .21.042.251.253.251z" clip-path="url(#e)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 101.851 19.455)"/><path d="M0 0c0 .186.152.338.338.338a4.773 4.773 0 0 0 4.773-4.774v-15.972c0-.251-.086-.334-.379-.334H.419c-.293 0-.419.126-.419.377Z" clip-path="url(#f)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 115.229 19.345)"/><path d="M0 0a6.415 6.415 0 0 0-6.356 6.475 6.415 6.415 0 1 0 12.831-.119A6.415 6.415 0 0 0 0 0m1.573 16.958c-1.684.25-4.143.078-5.373.158-4.321.291-7.287 4.505-7.295 8.695-.001 3.185-1.797 4.984-4.168 5.418a5.08 5.08 0 0 1-4.086-1.023 5.08 5.08 0 0 1-1.845-3.785c-.066-2.409 1.322-4.539 4.439-5.198 4.098-.875 7.607-4.651 6.996-8.937-.177-1.22-.867-3.725-.969-5.425C-11.099.951-6.335-4.203-.305-4.331c2.655-.057 5.118.828 7.028 2.376s3.318 3.767 3.778 6.383c1.068 5.825-2.936 11.643-8.928 12.53" clip-path="url(#g)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 140.119 41.753)"/><path d="M0 0c0 .424-.31.73-.905.73h-.751V-.712h.751C-.31-.712 0-.443 0 0m-1.656-1.195v-1.481h-.538v3.887h1.289C-.018 1.211.559.75.559.018c0-.577-.367-.962-.905-1.115L.751-2.676H.114L-.887-1.195zm3.811.463c0 1.79-1.25 3.061-3.06 3.061-1.809 0-3.08-1.271-3.08-3.061 0-1.809 1.271-3.08 3.08-3.08s3.06 1.271 3.06 3.08m-6.68 0c0 2.06 1.523 3.581 3.62 3.581S2.714 1.328 2.714-.732c0-2.08-1.521-3.6-3.619-3.6-2.097 0-3.62 1.52-3.62 3.6" clip-path="url(#h)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 161.103 22.815)"/></svg>
package/assets/logos/cytario-logo-on-purple.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="319.783" height="146.484" viewBox="0 0 319.783 146.484"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M36 136.063h769.89V518.74H36Z"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><path d="M-338.072-186.979h769.89v382.677h-769.89Z"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><path d="M-344.75-207.048h769.89v382.677h-769.89Z"/></clipPath><clipPath id="d" clipPathUnits="userSpaceOnUse"><path d="M-373.196-187.062h769.89v382.677h-769.89Z"/></clipPath><clipPath id="e" clipPathUnits="userSpaceOnUse"><path d="M-387.107-195.61h769.89v382.677h-769.89Z"/></clipPath><clipPath id="f" clipPathUnits="userSpaceOnUse"><path d="M-398.916-207.048h769.89v382.677h-769.89Z"/></clipPath><clipPath id="g" clipPathUnits="userSpaceOnUse"><path d="M-408.95-207.13h769.89v382.677h-769.89Z"/></clipPath><clipPath id="h" clipPathUnits="userSpaceOnUse"><path d="M-427.617-190.325h769.89v382.677h-769.89Z"/></clipPath><clipPath id="i" clipPathUnits="userSpaceOnUse"><path d="M-443.355-204.527h769.89V178.15h-769.89Z"/></clipPath></defs><path d="M541.439 278.926H301.602v109.863h239.837z" clip-path="url(#a)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 -402.136 518.385)"/><path d="M0 0c0-.21-.041-.295-.209-.335-1.34-.546-3.017-.672-4.651-.672-6.788 0-10.809 4.653-10.809 10.684 0 6.202 4.609 10.812 11.522 10.812 2.096 0 3.226-.21 3.938-.461.168-.083.209-.209.209-.461l-.041-3.728c0-.293-.168-.293-.335-.253-.88.335-1.97.546-3.603.546-3.814 0-6.496-2.264-6.496-6.286 0-4.569 3.31-6.327 6.536-6.327 1.509 0 2.809.127 3.646.42.209.082.293-.044.293-.211Z" clip-path="url(#b)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 96.626 87.663)"/><path d="M0 0c.167 0 .293-.041.376-.251C3.1-8.086 4.525-12.612 5.069-14.665c1.382 4.233 2.85 8.547 4.735 14.414.084.167.209.251.461.251h4.316c.251 0 .293-.125.251-.334-3.018-9.261-7.819-20.925-11.214-28.674-.084-.169-.208-.295-.543-.295l-4.59-.406c-.251 0-.309.139-.209.336a164 164 0 0 1 4.196 9.092c.084.253.125.379.041.672C1.382-16.844-2.64-6.872-5.154-.293c-.084.168.04.293.251.293Z" clip-path="url(#c)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 105.53 60.904)"/><path d="M0 0c0-.253-.041-.419-.251-.503-1.132-.42-2.179-.586-3.561-.586-3.436 0-5.49 1.675-5.49 5.824v11.019h-2.639c-.208.041-.294.127-.294.378v3.52c0 .25.086.334.335.334l2.598.009c.041 1.468 0 3.703 0 5.145.041.209.126.335.335.377l4.447.394c.2.02.293 0 .293-.209v-5.707l4.102-.009c.211 0 .293-.084.293-.293v-3.646c0-.208-.082-.293-.293-.293h-4.107V5.823c0-1.842.586-2.723 2.39-2.723.542 0 1.005.041 1.591.167.126.043.251 0 .251-.25Z" clip-path="url(#d)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 143.459 87.551)"/><path d="M0 0c-.63.084-1.342.126-2.305.126-3.311 0-4.776-1.089-4.776-2.891 0-1.551 1.088-2.891 4.104-2.891 1.091 0 2.054.126 2.977.502zm4.902-4.944c0-.921 0-1.76.084-2.64 0-.083 0-.125-.084-.169C1.467-9.218-.963-9.637-3.814-9.637c-4.567 0-8.212 2.137-8.212 6.872 0 4.441 3.98 6.663 9.428 6.663 1.256 0 2.219-.044 2.598-.084v.502c0 .965-.545 3.143-4.233 3.143-2.093 0-3.939-.42-5.49-1.175-.126-.04-.335 0-.335.253v3.645c0 .209.042.293.253.418 1.802.839 4.107 1.259 6.37 1.259 5.823 0 8.337-3.647 8.337-8.298z" clip-path="url(#e)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 162.006 76.155)"/><path d="M0 0c.252 0 .379-.084.461-.334.209-.545.376-1.594.42-2.515C2.305-1.088 4.582.419 7.473.419c.251 0 .446-.121.446-.433v-4.3c0-.211-.084-.295-.377-.295-2.974.084-5.446-.963-6.41-2.221v-13.491c0-.253-.125-.335-.378-.335h-4.358c-.291 0-.377.126-.377.335 0 0 .015 18.591.015 20.07 0 .21.042.251.253.251z" clip-path="url(#f)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 177.752 60.904)"/><path d="M0 0c0 .186.152.338.338.338a4.773 4.773 0 0 0 4.773-4.774v-15.972c0-.251-.086-.334-.379-.334H.419c-.293 0-.419.126-.419.377Z" clip-path="url(#g)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 191.13 60.794)"/><path d="M0 0a6.415 6.415 0 0 0-6.356 6.475 6.415 6.415 0 1 0 12.831-.119A6.415 6.415 0 0 0 0 0m1.573 16.958c-1.684.25-4.143.078-5.373.158-4.321.291-7.287 4.505-7.295 8.695-.001 3.185-1.797 4.984-4.168 5.418a5.08 5.08 0 0 1-4.086-1.023 5.08 5.08 0 0 1-1.845-3.785c-.066-2.409 1.322-4.539 4.439-5.198 4.098-.875 7.607-4.651 6.996-8.937-.177-1.22-.867-3.725-.969-5.425C-11.099.951-6.335-4.203-.305-4.331c2.655-.057 5.118.828 7.028 2.376s3.318 3.767 3.778 6.383c1.068 5.825-2.936 11.643-8.928 12.53" clip-path="url(#h)" style="fill:#35b7b8;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 216.02 83.202)"/><path d="M0 0c0 .424-.31.73-.905.73h-.751V-.712h.751C-.31-.712 0-.443 0 0m-1.656-1.195v-1.481h-.538v3.887h1.289C-.018 1.211.559.75.559.018c0-.577-.367-.962-.905-1.115L.751-2.676H.114L-.887-1.195zm3.811.463c0 1.79-1.25 3.061-3.06 3.061-1.809 0-3.08-1.271-3.08-3.061 0-1.809 1.271-3.08 3.08-3.08s3.06 1.271 3.06 3.08m-6.68 0c0 2.06 1.523 3.581 3.62 3.581S2.714 1.328 2.714-.732c0-2.08-1.521-3.6-3.619-3.6-2.097 0-3.62 1.52-3.62 3.6" clip-path="url(#i)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 237.004 64.265)"/></svg>
package/assets/logos/cytario-logo-purple-tagline.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="1813" height="674" viewBox="0 0 479.69 178.329"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M-126.403-77.682H295.92v193.455h-422.323Z"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><path d="M-137.943-113.021H284.38V80.434h-422.323Z"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><path d="M-188.033-77.829H234.29v193.455h-422.323Z"/></clipPath><clipPath id="d" clipPathUnits="userSpaceOnUse"><path d="M-212.528-92.88h422.323v193.455h-422.323Z"/></clipPath><clipPath id="e" clipPathUnits="userSpaceOnUse"><path d="M-233.323-113.021H189V80.434h-422.323Z"/></clipPath><clipPath id="f" clipPathUnits="userSpaceOnUse"><path d="M-250.99-113.166h422.323V80.29H-250.99Z"/></clipPath><clipPath id="g" clipPathUnits="userSpaceOnUse"><path d="M-283.861-83.573h422.323v193.455h-422.323Z"/></clipPath><clipPath id="h" clipPathUnits="userSpaceOnUse"><path d="M-311.575-108.582h422.323V84.873h-422.323Z"/></clipPath><clipPath id="i" clipPathUnits="userSpaceOnUse"><path d="M-161.955-60.606h422.323v193.455h-422.323Z"/></clipPath><clipPath id="j" clipPathUnits="userSpaceOnUse"><path d="M-172.278-63.873h422.323v193.455h-422.323Z"/></clipPath><clipPath id="k" clipPathUnits="userSpaceOnUse"><path d="M-175.428-67h422.323v193.454h-422.323Z"/></clipPath><clipPath id="l" clipPathUnits="userSpaceOnUse"><path d="M-183.632-67H238.69v193.454h-422.323Z"/></clipPath><clipPath id="m" clipPathUnits="userSpaceOnUse"><path d="M-196.508-64.295h422.323V129.16h-422.323Z"/></clipPath><clipPath id="n" clipPathUnits="userSpaceOnUse"><path d="M-202.454-60.606H219.87v193.455h-422.323Z"/></clipPath><clipPath id="o" clipPathUnits="userSpaceOnUse"><path d="M-205.946-67h422.323v193.454h-422.323Z"/></clipPath><clipPath id="p" clipPathUnits="userSpaceOnUse"><path d="M397.362 229.278h422.323v193.455H397.362Z"/></clipPath><clipPath id="q" clipPathUnits="userSpaceOnUse"><path d="M-215.822-67H206.5v193.454h-422.323Z"/></clipPath><clipPath id="r" clipPathUnits="userSpaceOnUse"><path d="M-226.694-61.359h422.323v193.455h-422.323Z"/></clipPath><clipPath id="s" clipPathUnits="userSpaceOnUse"><path d="M-238.756-65.214h422.323v193.455h-422.323Z"/></clipPath><clipPath id="t" clipPathUnits="userSpaceOnUse"><path d="M-247.917-62.01h422.323v193.455h-422.323Z"/></clipPath><clipPath id="u" clipPathUnits="userSpaceOnUse"><path d="M-250.787-67h422.323v193.454h-422.323Z"/></clipPath><clipPath id="v" clipPathUnits="userSpaceOnUse"><path d="M-257.046-70.485h422.323V122.97h-422.323Z"/></clipPath><clipPath id="w" clipPathUnits="userSpaceOnUse"><path d="M-270.534-63.873h422.323v193.455h-422.323Z"/></clipPath><clipPath id="x" clipPathUnits="userSpaceOnUse"><path d="M397.362 229.278h422.323v193.455H397.362Z"/></clipPath><clipPath id="y" clipPathUnits="userSpaceOnUse"><path d="M-282.586-63.873h422.323v193.455h-422.323Z"/></clipPath><clipPath id="z" clipPathUnits="userSpaceOnUse"><path d="M-288.403-61.359H133.92v193.455h-422.323Z"/></clipPath><clipPath id="A" clipPathUnits="userSpaceOnUse"><path d="M-294.116-57.926h422.323V135.53h-422.323Z"/></clipPath></defs><path d="M0 0c0-.373-.071-.519-.368-.59-2.36-.961-5.313-1.183-8.189-1.183-11.953 0-19.034 8.192-19.034 18.814 0 10.92 8.116 19.038 20.288 19.038 3.691 0 5.681-.37 6.935-.812.297-.146.368-.368.368-.812l-.071-6.565c0-.516-.297-.516-.59-.445-1.551.59-3.47.961-6.346.961-6.716 0-11.439-3.985-11.439-11.069 0-8.044 5.829-11.14 11.511-11.14 2.656 0 4.945.222 6.419.738.368.146.516-.076.516-.37Z" clip-path="url(#a)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 65.002 133.915)"/><path d="M0 0c.294 0 .516-.071.661-.442 4.798-13.797 7.306-21.767 8.264-25.381 2.435 7.454 5.02 15.051 8.338 25.381.148.294.368.442.812.442h7.6c.442 0 .516-.22.442-.587C20.803-16.895 12.349-37.434 6.372-51.08c-.148-.296-.368-.519-.958-.519l-8.081-.714c-.442 0-.545.243-.368.59 2.215 4.43 5.025 10.404 7.388 16.011.148.445.219.667.071 1.183-1.99 4.869-9.073 22.428-13.5 34.013-.148.296.071.516.442.516Z" clip-path="url(#b)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 90.006 57.338)"/><path d="M0 0c0-.445-.071-.738-.442-.886-1.992-.739-3.837-1.032-6.271-1.032-6.049 0-9.666 2.95-9.666 10.256v19.404h-4.647c-.368.071-.518.222-.518.664v6.199c0 .44.15.588.59.588l4.575.016c.071 2.585 0 6.52 0 9.06.071.368.222.59.59.664l7.83.693c.351.035.516 0 .516-.367v-10.05l7.223-.016c.371 0 .516-.148.516-.516v-6.419c0-.368-.145-.516-.516-.516h-7.231V10.254c0-3.245 1.032-4.795 4.207-4.795.955 0 1.77.071 2.802.294.222.076.442 0 .442-.44Z" clip-path="url(#c)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 198.546 133.596)"/><path d="M0 0c-1.109.148-2.363.222-4.059.222-5.829 0-8.409-1.918-8.409-5.091 0-2.731 1.915-5.091 7.226-5.091 1.921 0 3.617.222 5.242.884zm8.632-8.706c0-1.622 0-3.098.148-4.649 0-.145 0-.219-.148-.296-6.049-2.58-10.328-3.318-15.348-3.318-8.041 0-14.461 3.762-14.461 12.1 0 7.819 7.01 11.733 16.602 11.733 2.212 0 3.908-.077 4.575-.148V7.6c0 1.698-.961 5.535-7.454 5.535-3.686 0-6.935-.741-9.666-2.069-.222-.072-.59 0-.59.444v6.42c0 .368.074.516.444.735 3.173 1.477 7.232 2.218 11.217 2.218 10.254 0 14.681-6.422 14.681-14.612z" clip-path="url(#d)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 251.624 100.983)"/><path d="M0 0c.445 0 .667-.148.812-.587.368-.961.662-2.808.739-4.43C4.059-1.916 8.068.738 13.159.738c.442 0 .786-.214.786-.762v-7.573c0-.37-.148-.519-.664-.519-5.237.149-9.59-1.696-11.289-3.91v-23.757c0-.445-.219-.59-.664-.59h-7.673c-.514 0-.665.222-.665.59 0 0 .027 32.737.027 35.341 0 .371.074.442.444.442z" clip-path="url(#e)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 296.685 57.338)"/><path d="M0 0c0 .328.267.595.595.595a8.404 8.404 0 0 0 8.404-8.406v-28.125c0-.442-.151-.588-.667-.588H.738c-.516 0-.738.222-.738.664Z" clip-path="url(#f)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 334.966 57.025)"/><path d="M0 0c-6.24.058-11.251 5.163-11.193 11.402.056 6.239 5.162 11.254 11.402 11.196 6.239-.059 11.251-5.163 11.193-11.405C11.346 4.953 6.239-.058 0 0m2.77 29.861c-2.966.439-7.295.138-9.462.278-7.607.513-12.831 7.933-12.844 15.31-.003 5.61-3.165 8.777-7.34 9.542-2.654.495-5.242-.259-7.195-1.802-1.911-1.588-3.186-3.967-3.249-6.666-.117-4.241 2.328-7.991 7.816-9.152 7.216-1.54 13.395-8.19 12.32-15.737-.312-2.148-1.527-6.559-1.706-9.552C-19.544 1.675-11.156-7.401-.537-7.626c4.675-.101 9.012 1.458 12.376 4.183 3.36 2.726 5.842 6.634 6.652 11.241C20.372 18.054 13.32 28.3 2.77 29.861" clip-path="url(#g)" style="fill:#35b7b8;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 406.194 121.15)"/><path d="M0 0c0 .746-.545 1.286-1.593 1.286h-1.323v-2.54h1.323C-.545-1.254 0-.781 0 0m-2.916-2.104v-2.609h-.947v6.846h2.27C-.032 2.133.984 1.32.984.032c0-1.016-.645-1.694-1.593-1.964l1.932-2.781H.201l-1.762 2.609zm6.71.815c0 3.152-2.201 5.39-5.387 5.39s-5.424-2.238-5.424-5.39c0-3.186 2.238-5.424 5.424-5.424s5.387 2.238 5.387 5.424m-11.761 0c0 3.628 2.68 6.306 6.374 6.306s6.372-2.678 6.372-6.306c0-3.662-2.678-6.34-6.372-6.34s-6.374 2.678-6.374 6.34" clip-path="url(#h)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 466.246 66.957)"/><path d="M0 0c-2.757 0-4.76 2.043-4.76 4.736 0 2.678 1.966 4.761 4.747 4.761.984 0 1.876-.257 2.604-.704v-.855A4.47 4.47 0 0 1 0 8.769c-2.336 0-3.982-1.736-3.982-4.009C-3.982 2.477-2.35.728.037.728c1.011 0 1.916.33 2.644.868V.754C1.94.267.982 0 0 0" clip-path="url(#i)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 142.038 170.916)"/><path d="M0 0c0 1.455-1.058 2.567-2.501 2.567S-5.004 1.455-5.004 0c0-1.469 1.061-2.577 2.503-2.577S0-1.469 0 0m-5.755 0c0 1.826 1.378 3.255 3.254 3.255S.754 1.826.754 0c0-1.839-1.378-3.268-3.255-3.268-1.876 0-3.254 1.429-3.254 3.268" clip-path="url(#j)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 164.407 163.836)"/><path d="M0 0h.754v-.855l.024-.013c.55.511 1.378.995 2.387.995.664 0 1.212-.204 1.622-.624.42-.434.574-1.009.574-1.863v-3.906h-.754v3.802c0 .691-.101 1.136-.408 1.443-.293.293-.701.447-1.212.447-.844 0-1.635-.421-2.233-1.022v-4.67H0Z" clip-path="url(#k)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 171.233 157.06)"/><path d="M0 0h.754v-.855l.024-.013c.55.511 1.379.995 2.387.995.664 0 1.212-.204 1.622-.624.42-.434.574-1.009.574-1.863v-3.906h-.754v3.802c0 .691-.101 1.136-.408 1.443-.293.293-.701.447-1.212.447-.844 0-1.635-.421-2.233-1.022v-4.67H0Z" clip-path="url(#l)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 189.01 157.06)"/><path d="M0 0c-.026 1.646-1.188 2.143-2.08 2.143-1.085 0-2.146-.727-2.297-2.143Zm-1.799-3.689c-1.953 0-3.345 1.289-3.345 3.242 0 1.966 1.365 3.281 3.077 3.281C-.548 2.834.728 1.786.728-.103c0-.191-.014-.394-.027-.521H-4.39c.087-1.443 1.109-2.377 2.628-2.377.804 0 1.545.27 2.132.704v-.791c-.574-.37-1.391-.601-2.169-.601" clip-path="url(#m)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 216.91 162.923)"/><path d="M0 0c-1.926 0-3.281 1.392-3.281 3.255 0 1.876 1.378 3.268 3.307 3.268.662 0 1.289-.167 1.787-.474v-.778a3.04 3.04 0 0 1-1.749.561c-1.519 0-2.591-1.085-2.591-2.577C-2.527 1.749-1.442.688.05.688c.715 0 1.355.23 1.813.601V.511C1.352.18.688 0 0 0" clip-path="url(#n)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 229.793 170.916)"/><path d="M0 0h1.302v1.762l.754.178V0h2.016v-.677H2.056v-3.649c0-.908.368-1.379 1.135-1.379.331 0 .638.077.881.191v-.675a2.4 2.4 0 0 0-1.008-.207c-1.188 0-1.762.755-1.762 2.019v3.7H0Z" clip-path="url(#o)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 237.36 157.06)"/><path d="M609.567 296.279h.754v-6.266h-.754zm-.203 2.194c0 .32.254.587.574.587a.585.585 0 0 0 .587-.587.576.576 0 0 0-.587-.574.57.57 0 0 0-.574.574" clip-path="url(#p)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 -1069.938 799.061)"/><path d="M0 0h.754v-.855l.024-.013c.55.511 1.378.995 2.387.995.664 0 1.212-.204 1.622-.624.42-.434.574-1.009.574-1.863v-3.906h-.754v3.802c0 .691-.101 1.136-.408 1.443-.293.293-.701.447-1.212.447-.844 0-1.635-.421-2.233-1.022v-4.67H0Z" clip-path="url(#q)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 258.762 157.06)"/><path d="M0 0c.714 0 1.405.307 1.863.778v3.805a3.36 3.36 0 0 1-1.749.511c-1.53 0-2.488-1.138-2.488-2.58C-2.374 1.058-1.416 0 0 0m-.408-2.871c1.416 0 2.271.804 2.271 2.143v.792L1.85.077A2.93 2.93 0 0 0-.127-.664c-1.712 0-3.001 1.288-3.001 3.141 0 1.812 1.265 3.291 3.218 3.291.741 0 1.392-.217 1.926-.523l.601.142V-.741c0-1.709-1.098-2.807-3.001-2.807-.791 0-1.492.203-2.04.537v.764c.548-.394 1.276-.624 2.016-.624" clip-path="url(#r)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 282.32 169.284)"/><path d="M0 0c.831 0 1.392.09 1.889.421.485.333.805.918.805 1.609 0 .677-.32 1.275-.805 1.608-.497.331-1.058.408-1.889.408h-1.99V0Zm-2.77 4.76H.026c1.009 0 1.736-.127 2.374-.574.651-.447 1.072-1.225 1.072-2.156 0-.932-.421-1.699-1.072-2.144-.638-.46-1.365-.587-2.374-.587H-1.99V-4.48h-.78z" clip-path="url(#s)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 308.456 160.932)"/><path d="M0 0v1.506c-.497.09-1.072.14-1.569.14-.971 0-1.839-.281-1.839-1.212 0-.831.714-1.175 1.492-1.175A2.9 2.9 0 0 1 0 0m1.275-1.365c-.561 0-.981.267-1.148.764H.103a3.3 3.3 0 0 0-2.133-.791c-1.188 0-2.119.627-2.119 1.776 0 1.302 1.048 1.863 2.516 1.863.535 0 1.096-.064 1.633-.141v.818C0 3.943-.677 4.43-1.85 4.43c-.741 0-1.354-.204-1.825-.498v.701c.433.268 1.098.485 1.926.485 1.635 0 2.49-.792 2.49-2.08V.153c0-.433.14-.854.714-.854.167 0 .331.05.461.1v-.651a2.2 2.2 0 0 0-.641-.113" clip-path="url(#t)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 328.308 167.874)"/><path d="M0 0h1.302v1.762l.754.178V0h2.016v-.677H2.056v-3.649c0-.908.368-1.379 1.135-1.379.331 0 .638.077.881.191v-.675a2.4 2.4 0 0 0-1.008-.207c-1.188 0-1.762.755-1.762 2.019v3.7H0Z" clip-path="url(#u)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 334.526 157.06)"/><path d="M0 0h.754v-4.34l.024-.013c.55.511 1.378.995 2.387.995.664 0 1.212-.204 1.622-.624.42-.434.574-1.009.574-1.863v-3.906h-.754v3.803c0 .69-.101 1.137-.408 1.442-.293.293-.701.447-1.212.447-.844 0-1.635-.421-2.233-1.021v-4.671H0Z" clip-path="url(#v)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 348.089 149.51)"/><path d="M0 0c0 1.455-1.058 2.567-2.501 2.567S-5.004 1.455-5.004 0c0-1.469 1.061-2.577 2.503-2.577S0-1.469 0 0m-5.755 0c0 1.826 1.378 3.255 3.254 3.255S.754 1.826.754 0c0-1.839-1.379-3.268-3.255-3.268S-5.755-1.839-5.755 0" clip-path="url(#w)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 377.317 163.836)"/><path d="M671.047 299.764h.754v-9.751h-.754z" clip-path="url(#x)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 -1069.938 799.061)"/><path d="M0 0c0 1.455-1.058 2.567-2.501 2.567S-5.004 1.455-5.004 0c0-1.469 1.061-2.577 2.503-2.577S0-1.469 0 0m-5.755 0c0 1.826 1.378 3.255 3.254 3.255S.754 1.826.754 0c0-1.839-1.378-3.268-3.255-3.268-1.876 0-3.254 1.429-3.254 3.268" clip-path="url(#y)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 403.43 163.836)"/><path d="M0 0c.714 0 1.405.307 1.863.778v3.805a3.36 3.36 0 0 1-1.749.511c-1.53 0-2.488-1.138-2.488-2.58C-2.374 1.058-1.416 0 0 0m-.408-2.871c1.416 0 2.271.804 2.271 2.143v.792L1.85.077A2.93 2.93 0 0 0-.127-.664c-1.712 0-3.001 1.288-3.001 3.141 0 1.812 1.265 3.291 3.218 3.291.741 0 1.392-.217 1.926-.523l.601.142V-.741c0-1.709-1.098-2.807-3.001-2.807-.791 0-1.492.203-2.04.537v.764c.548-.394 1.276-.624 2.016-.624" clip-path="url(#z)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 416.036 169.284)"/><path d="m0 0 1.709 3.485-2.667 5.591h.831l1.249-2.657c.333-.701.69-1.455.971-2.106h.027c.317.704.637 1.405.981 2.12l1.252 2.643h.791L.818 0Z" clip-path="url(#A)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 428.416 176.724)"/></svg>
package/assets/logos/cytario-logo-purple.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="1813" height="674" viewBox="0 0 479.69 178.329"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M-126.403-77.682H295.92v193.455h-422.323Z"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><path d="M-137.943-113.021H284.38V80.434h-422.323Z"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><path d="M-188.033-77.829H234.29v193.455h-422.323Z"/></clipPath><clipPath id="d" clipPathUnits="userSpaceOnUse"><path d="M-212.528-92.88h422.323v193.455h-422.323Z"/></clipPath><clipPath id="e" clipPathUnits="userSpaceOnUse"><path d="M-233.323-113.021H189V80.434h-422.323Z"/></clipPath><clipPath id="f" clipPathUnits="userSpaceOnUse"><path d="M-250.99-113.166h422.323V80.29H-250.99Z"/></clipPath><clipPath id="g" clipPathUnits="userSpaceOnUse"><path d="M-283.861-83.573h422.323v193.455h-422.323Z"/></clipPath><clipPath id="h" clipPathUnits="userSpaceOnUse"><path d="M-311.575-108.582h422.323V84.873h-422.323Z"/></clipPath></defs><path d="M0 0c0-.373-.071-.519-.368-.59-2.36-.961-5.313-1.183-8.189-1.183-11.953 0-19.034 8.192-19.034 18.814 0 10.92 8.116 19.038 20.288 19.038 3.691 0 5.681-.37 6.935-.812.297-.146.368-.368.368-.812l-.071-6.565c0-.516-.297-.516-.59-.445-1.551.59-3.47.961-6.346.961-6.716 0-11.439-3.985-11.439-11.069 0-8.044 5.829-11.14 11.511-11.14 2.656 0 4.945.222 6.419.738.368.146.516-.076.516-.37Z" clip-path="url(#a)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 65.002 133.915)"/><path d="M0 0c.294 0 .516-.071.661-.442 4.798-13.797 7.306-21.767 8.264-25.381 2.435 7.454 5.02 15.051 8.338 25.381.148.294.368.442.812.442h7.6c.442 0 .516-.22.442-.587C20.803-16.895 12.349-37.434 6.372-51.08c-.148-.296-.368-.519-.958-.519l-8.081-.714c-.442 0-.545.243-.368.59 2.215 4.43 5.025 10.404 7.388 16.011.148.445.219.667.071 1.183-1.99 4.869-9.073 22.428-13.5 34.013-.148.296.071.516.442.516Z" clip-path="url(#b)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 90.006 57.338)"/><path d="M0 0c0-.445-.071-.738-.442-.886-1.992-.739-3.837-1.032-6.271-1.032-6.049 0-9.666 2.95-9.666 10.256v19.404h-4.647c-.368.071-.518.222-.518.664v6.199c0 .44.15.588.59.588l4.575.016c.071 2.585 0 6.52 0 9.06.071.368.222.59.59.664l7.83.693c.351.035.516 0 .516-.367v-10.05l7.223-.016c.371 0 .516-.148.516-.516v-6.419c0-.368-.145-.516-.516-.516h-7.231V10.254c0-3.245 1.032-4.795 4.207-4.795.955 0 1.77.071 2.802.294.222.076.442 0 .442-.44Z" clip-path="url(#c)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 198.546 133.596)"/><path d="M0 0c-1.109.148-2.363.222-4.059.222-5.829 0-8.409-1.918-8.409-5.091 0-2.731 1.915-5.091 7.226-5.091 1.921 0 3.617.222 5.242.884zm8.632-8.706c0-1.622 0-3.098.148-4.649 0-.145 0-.219-.148-.296-6.049-2.58-10.328-3.318-15.348-3.318-8.041 0-14.461 3.762-14.461 12.1 0 7.819 7.01 11.733 16.602 11.733 2.212 0 3.908-.077 4.575-.148V7.6c0 1.698-.961 5.535-7.454 5.535-3.686 0-6.935-.741-9.666-2.069-.222-.072-.59 0-.59.444v6.42c0 .368.074.516.444.735 3.173 1.477 7.232 2.218 11.217 2.218 10.254 0 14.681-6.422 14.681-14.612z" clip-path="url(#d)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 251.624 100.983)"/><path d="M0 0c.445 0 .667-.148.812-.587.368-.961.662-2.808.739-4.43C4.059-1.916 8.068.738 13.159.738c.442 0 .786-.214.786-.762v-7.573c0-.37-.148-.519-.664-.519-5.237.149-9.59-1.696-11.289-3.91v-23.757c0-.445-.219-.59-.664-.59h-7.673c-.514 0-.665.222-.665.59 0 0 .027 32.737.027 35.341 0 .371.074.442.444.442z" clip-path="url(#e)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 296.685 57.338)"/><path d="M0 0c0 .328.267.595.595.595a8.404 8.404 0 0 0 8.404-8.406v-28.125c0-.442-.151-.588-.667-.588H.738c-.516 0-.738.222-.738.664Z" clip-path="url(#f)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 334.966 57.025)"/><path d="M0 0c-6.24.058-11.251 5.163-11.193 11.402.056 6.239 5.162 11.254 11.402 11.196 6.239-.059 11.251-5.163 11.193-11.405C11.346 4.953 6.239-.058 0 0m2.77 29.861c-2.966.439-7.295.138-9.462.278-7.607.513-12.831 7.933-12.844 15.31-.003 5.61-3.165 8.777-7.34 9.542-2.654.495-5.242-.259-7.195-1.802-1.911-1.588-3.186-3.967-3.249-6.666-.117-4.241 2.328-7.991 7.816-9.152 7.216-1.54 13.395-8.19 12.32-15.737-.312-2.148-1.527-6.559-1.706-9.552C-19.544 1.675-11.156-7.401-.537-7.626c4.675-.101 9.012 1.458 12.376 4.183 3.36 2.726 5.842 6.634 6.652 11.241C20.372 18.054 13.32 28.3 2.77 29.861" clip-path="url(#g)" style="fill:#35b7b8;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 406.194 121.15)"/><path d="M0 0c0 .746-.545 1.286-1.593 1.286h-1.323v-2.54h1.323C-.545-1.254 0-.781 0 0m-2.916-2.104v-2.609h-.947v6.846h2.27C-.032 2.133.984 1.32.984.032c0-1.016-.645-1.694-1.593-1.964l1.932-2.781H.201l-1.762 2.609zm6.71.815c0 3.152-2.201 5.39-5.387 5.39s-5.424-2.238-5.424-5.39c0-3.186 2.238-5.424 5.424-5.424s5.387 2.238 5.387 5.424m-11.761 0c0 3.628 2.68 6.306 6.374 6.306s6.372-2.678 6.372-6.306c0-3.662-2.678-6.34-6.372-6.34s-6.374 2.678-6.374 6.34" clip-path="url(#h)" style="fill:#5c2483;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 466.246 66.957)"/></svg>
package/assets/logos/cytario-logo-white-tagline.svg ADDED
@@ -0,0 +1 @@
1
+ <svg width="1813" height="674" viewBox="0 0 479.69 178.329" xmlns="http://www.w3.org/2000/svg"><defs> <clipPath id="a" clipPathUnits="userSpaceOnUse"> <path d="M-126.403-77.682H295.92v193.455h-422.323Z"/> </clipPath> <clipPath id="b" clipPathUnits="userSpaceOnUse"> <path d="M-137.943-113.021H284.38V80.434h-422.323Z"/> </clipPath> <clipPath id="c" clipPathUnits="userSpaceOnUse"> <path d="M-188.033-77.829H234.29v193.455h-422.323Z"/> </clipPath> <clipPath id="d" clipPathUnits="userSpaceOnUse"> <path d="M-212.528-92.88h422.323v193.455h-422.323Z"/> </clipPath> <clipPath id="e" clipPathUnits="userSpaceOnUse"> <path d="M-233.323-113.021H189V80.434h-422.323Z"/> </clipPath> <clipPath id="f" clipPathUnits="userSpaceOnUse"> <path d="M-250.99-113.166h422.323V80.29H-250.99Z"/> </clipPath> <clipPath id="g" clipPathUnits="userSpaceOnUse"> <path d="M-283.861-83.573h422.323v193.455h-422.323Z"/> </clipPath> <clipPath id="h" clipPathUnits="userSpaceOnUse"> <path d="M-311.575-108.582h422.323V84.873h-422.323Z"/> </clipPath> <clipPath id="i" clipPathUnits="userSpaceOnUse"> <path d="M-161.955-60.606h422.323v193.455h-422.323Z"/> </clipPath> <clipPath id="j" clipPathUnits="userSpaceOnUse"> <path d="M-172.278-63.873h422.323v193.455h-422.323Z"/> </clipPath> <clipPath id="k" clipPathUnits="userSpaceOnUse"> <path d="M-175.428-67h422.323v193.454h-422.323Z"/> </clipPath> <clipPath id="l" clipPathUnits="userSpaceOnUse"> <path d="M-183.632-67H238.69v193.454h-422.323Z"/> </clipPath> <clipPath id="m" clipPathUnits="userSpaceOnUse"> <path d="M-196.508-64.295h422.323V129.16h-422.323Z"/> </clipPath> <clipPath id="n" clipPathUnits="userSpaceOnUse"> <path d="M-202.454-60.606H219.87v193.455h-422.323Z"/> </clipPath> <clipPath id="o" clipPathUnits="userSpaceOnUse"> <path d="M-205.946-67h422.323v193.454h-422.323Z"/> </clipPath> <clipPath id="p" clipPathUnits="userSpaceOnUse"> <path d="M397.362 229.278h422.323v193.455H397.362Z"/> </clipPath> <clipPath id="q" clipPathUnits="userSpaceOnUse"> <path d="M-215.822-67H206.5v193.454h-422.323Z"/> </clipPath> <clipPath id="r" clipPathUnits="userSpaceOnUse"> <path d="M-226.694-61.359h422.323v193.455h-422.323Z"/> </clipPath> <clipPath id="s" clipPathUnits="userSpaceOnUse"> <path d="M-238.756-65.214h422.323v193.455h-422.323Z"/> </clipPath> <clipPath id="t" clipPathUnits="userSpaceOnUse"> <path d="M-247.917-62.01h422.323v193.455h-422.323Z"/> </clipPath> <clipPath id="u" clipPathUnits="userSpaceOnUse"> <path d="M-250.787-67h422.323v193.454h-422.323Z"/> </clipPath> <clipPath id="v" clipPathUnits="userSpaceOnUse"> <path d="M-257.046-70.485h422.323V122.97h-422.323Z"/> </clipPath> <clipPath id="w" clipPathUnits="userSpaceOnUse"> <path d="M-270.534-63.873h422.323v193.455h-422.323Z"/> </clipPath> <clipPath id="x" clipPathUnits="userSpaceOnUse"> <path d="M397.362 229.278h422.323v193.455H397.362Z"/> </clipPath> <clipPath id="y" clipPathUnits="userSpaceOnUse"> <path d="M-282.586-63.873h422.323v193.455h-422.323Z"/> </clipPath> <clipPath id="z" clipPathUnits="userSpaceOnUse"> <path d="M-288.403-61.359H133.92v193.455h-422.323Z"/> </clipPath> <clipPath id="A" clipPathUnits="userSpaceOnUse"> <path d="M-294.116-57.926h422.323V135.53h-422.323Z"/> </clipPath> </defs> <path d="M0 0c0-.373-.071-.519-.368-.59-2.36-.961-5.313-1.183-8.189-1.183-11.953 0-19.034 8.192-19.034 18.814 0 10.92 8.116 19.038 20.288 19.038 3.691 0 5.681-.37 6.935-.812.297-.146.368-.368.368-.812l-.071-6.565c0-.516-.297-.516-.59-.445-1.551.59-3.47.961-6.346.961-6.716 0-11.439-3.985-11.439-11.069 0-8.044 5.829-11.14 11.511-11.14 2.656 0 4.945.222 6.419.738.368.146.516-.076.516-.37Z" clip-path="url(#a)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 65.002 133.915)"/> <path d="M0 0c.294 0 .516-.071.661-.442 4.798-13.797 7.306-21.767 8.264-25.381 2.435 7.454 5.02 15.051 8.338 25.381.148.294.368.442.812.442h7.6c.442 0 .516-.22.442-.587C20.803-16.895 12.349-37.434 6.372-51.08c-.148-.296-.368-.519-.958-.519l-8.081-.714c-.442 0-.545.243-.368.59 2.215 4.43 5.025 10.404 7.388 16.011.148.445.219.667.071 1.183-1.99 4.869-9.073 22.428-13.5 34.013-.148.296.071.516.442.516Z" clip-path="url(#b)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 90.006 57.338)"/> <path d="M0 0c0-.445-.071-.738-.442-.886-1.992-.739-3.837-1.032-6.271-1.032-6.049 0-9.666 2.95-9.666 10.256v19.404h-4.647c-.368.071-.518.222-.518.664v6.199c0 .44.15.588.59.588l4.575.016c.071 2.585 0 6.52 0 9.06.071.368.222.59.59.664l7.83.693c.351.035.516 0 .516-.367v-10.05l7.223-.016c.371 0 .516-.148.516-.516v-6.419c0-.368-.145-.516-.516-.516h-7.231V10.254c0-3.245 1.032-4.795 4.207-4.795.955 0 1.77.071 2.802.294.222.076.442 0 .442-.44Z" clip-path="url(#c)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 198.546 133.596)"/> <path d="M0 0c-1.109.148-2.363.222-4.059.222-5.829 0-8.409-1.918-8.409-5.091 0-2.731 1.915-5.091 7.226-5.091 1.921 0 3.617.222 5.242.884zm8.632-8.706c0-1.622 0-3.098.148-4.649 0-.145 0-.219-.148-.296-6.049-2.58-10.328-3.318-15.348-3.318-8.041 0-14.461 3.762-14.461 12.1 0 7.819 7.01 11.733 16.602 11.733 2.212 0 3.908-.077 4.575-.148V7.6c0 1.698-.961 5.535-7.454 5.535-3.686 0-6.935-.741-9.666-2.069-.222-.072-.59 0-.59.444v6.42c0 .368.074.516.444.735 3.173 1.477 7.232 2.218 11.217 2.218 10.254 0 14.681-6.422 14.681-14.612z" clip-path="url(#d)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 251.624 100.983)"/> <path d="M0 0c.445 0 .667-.148.812-.587.368-.961.662-2.808.739-4.43C4.059-1.916 8.068.738 13.159.738c.442 0 .786-.214.786-.762v-7.573c0-.37-.148-.519-.664-.519-5.237.149-9.59-1.696-11.289-3.91v-23.757c0-.445-.219-.59-.664-.59h-7.673c-.514 0-.665.222-.665.59 0 0 .027 32.737.027 35.341 0 .371.074.442.444.442z" clip-path="url(#e)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 296.685 57.338)"/> <path d="M0 0c0 .328.267.595.595.595a8.404 8.404 0 0 0 8.404-8.406v-28.125c0-.442-.151-.588-.667-.588H.738c-.516 0-.738.222-.738.664Z" clip-path="url(#f)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 334.966 57.025)"/> <path d="M0 0c-6.24.058-11.251 5.163-11.193 11.402.056 6.239 5.162 11.254 11.402 11.196 6.239-.059 11.251-5.163 11.193-11.405C11.346 4.953 6.239-.058 0 0m2.77 29.861c-2.966.439-7.295.138-9.462.278-7.607.513-12.831 7.933-12.844 15.31-.003 5.61-3.165 8.777-7.34 9.542-2.654.495-5.242-.259-7.195-1.802-1.911-1.588-3.186-3.967-3.249-6.666-.117-4.241 2.328-7.991 7.816-9.152 7.216-1.54 13.395-8.19 12.32-15.737-.312-2.148-1.527-6.559-1.706-9.552C-19.544 1.675-11.156-7.401-.537-7.626c4.675-.101 9.012 1.458 12.376 4.183 3.36 2.726 5.842 6.634 6.652 11.241C20.372 18.054 13.32 28.3 2.77 29.861" clip-path="url(#g)" style="fill:#35b7b8;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 406.194 121.15)"/> <path d="M0 0c0 .746-.545 1.286-1.593 1.286h-1.323v-2.54h1.323C-.545-1.254 0-.781 0 0m-2.916-2.104v-2.609h-.947v6.846h2.27C-.032 2.133.984 1.32.984.032c0-1.016-.645-1.694-1.593-1.964l1.932-2.781H.201l-1.762 2.609zm6.71.815c0 3.152-2.201 5.39-5.387 5.39s-5.424-2.238-5.424-5.39c0-3.186 2.238-5.424 5.424-5.424s5.387 2.238 5.387 5.424m-11.761 0c0 3.628 2.68 6.306 6.374 6.306s6.372-2.678 6.372-6.306c0-3.662-2.678-6.34-6.372-6.34s-6.374 2.678-6.374 6.34" clip-path="url(#h)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 466.246 66.957)"/> <path d="M0 0c-2.757 0-4.76 2.043-4.76 4.736 0 2.678 1.966 4.761 4.747 4.761.984 0 1.876-.257 2.604-.704v-.855A4.47 4.47 0 0 1 0 8.769c-2.336 0-3.982-1.736-3.982-4.009C-3.982 2.477-2.35.728.037.728c1.011 0 1.916.33 2.644.868V.754C1.94.267.982 0 0 0" clip-path="url(#i)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 142.038 170.916)"/> <path d="M0 0c0 1.455-1.058 2.567-2.501 2.567S-5.004 1.455-5.004 0c0-1.469 1.061-2.577 2.503-2.577S0-1.469 0 0m-5.755 0c0 1.826 1.378 3.255 3.254 3.255S.754 1.826.754 0c0-1.839-1.378-3.268-3.255-3.268-1.876 0-3.254 1.429-3.254 3.268" clip-path="url(#j)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 164.407 163.836)"/> <path d="M0 0h.754v-.855l.024-.013c.55.511 1.378.995 2.387.995.664 0 1.212-.204 1.622-.624.42-.434.574-1.009.574-1.863v-3.906h-.754v3.802c0 .691-.101 1.136-.408 1.443-.293.293-.701.447-1.212.447-.844 0-1.635-.421-2.233-1.022v-4.67H0Z" clip-path="url(#k)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 171.233 157.06)"/> <path d="M0 0h.754v-.855l.024-.013c.55.511 1.379.995 2.387.995.664 0 1.212-.204 1.622-.624.42-.434.574-1.009.574-1.863v-3.906h-.754v3.802c0 .691-.101 1.136-.408 1.443-.293.293-.701.447-1.212.447-.844 0-1.635-.421-2.233-1.022v-4.67H0Z" clip-path="url(#l)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 189.01 157.06)"/> <path d="M0 0c-.026 1.646-1.188 2.143-2.08 2.143-1.085 0-2.146-.727-2.297-2.143Zm-1.799-3.689c-1.953 0-3.345 1.289-3.345 3.242 0 1.966 1.365 3.281 3.077 3.281C-.548 2.834.728 1.786.728-.103c0-.191-.014-.394-.027-.521H-4.39c.087-1.443 1.109-2.377 2.628-2.377.804 0 1.545.27 2.132.704v-.791c-.574-.37-1.391-.601-2.169-.601" clip-path="url(#m)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 216.91 162.923)"/> <path d="M0 0c-1.926 0-3.281 1.392-3.281 3.255 0 1.876 1.378 3.268 3.307 3.268.662 0 1.289-.167 1.787-.474v-.778a3.04 3.04 0 0 1-1.749.561c-1.519 0-2.591-1.085-2.591-2.577C-2.527 1.749-1.442.688.05.688c.715 0 1.355.23 1.813.601V.511C1.352.18.688 0 0 0" clip-path="url(#n)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 229.793 170.916)"/> <path d="M0 0h1.302v1.762l.754.178V0h2.016v-.677H2.056v-3.649c0-.908.368-1.379 1.135-1.379.331 0 .638.077.881.191v-.675a2.4 2.4 0 0 0-1.008-.207c-1.188 0-1.762.755-1.762 2.019v3.7H0Z" clip-path="url(#o)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 237.36 157.06)"/> <path d="M609.567 296.279h.754v-6.266h-.754zm-.203 2.194c0 .32.254.587.574.587a.585.585 0 0 0 .587-.587.576.576 0 0 0-.587-.574.57.57 0 0 0-.574.574" clip-path="url(#p)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 -1069.938 799.061)"/> <path d="M0 0h.754v-.855l.024-.013c.55.511 1.378.995 2.387.995.664 0 1.212-.204 1.622-.624.42-.434.574-1.009.574-1.863v-3.906h-.754v3.802c0 .691-.101 1.136-.408 1.443-.293.293-.701.447-1.212.447-.844 0-1.635-.421-2.233-1.022v-4.67H0Z" clip-path="url(#q)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 258.762 157.06)"/> <path d="M0 0c.714 0 1.405.307 1.863.778v3.805a3.36 3.36 0 0 1-1.749.511c-1.53 0-2.488-1.138-2.488-2.58C-2.374 1.058-1.416 0 0 0m-.408-2.871c1.416 0 2.271.804 2.271 2.143v.792L1.85.077A2.93 2.93 0 0 0-.127-.664c-1.712 0-3.001 1.288-3.001 3.141 0 1.812 1.265 3.291 3.218 3.291.741 0 1.392-.217 1.926-.523l.601.142V-.741c0-1.709-1.098-2.807-3.001-2.807-.791 0-1.492.203-2.04.537v.764c.548-.394 1.276-.624 2.016-.624" clip-path="url(#r)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 282.32 169.284)"/> <path d="M0 0c.831 0 1.392.09 1.889.421.485.333.805.918.805 1.609 0 .677-.32 1.275-.805 1.608-.497.331-1.058.408-1.889.408h-1.99V0Zm-2.77 4.76H.026c1.009 0 1.736-.127 2.374-.574.651-.447 1.072-1.225 1.072-2.156 0-.932-.421-1.699-1.072-2.144-.638-.46-1.365-.587-2.374-.587H-1.99V-4.48h-.78z" clip-path="url(#s)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 308.456 160.932)"/> <path d="M0 0v1.506c-.497.09-1.072.14-1.569.14-.971 0-1.839-.281-1.839-1.212 0-.831.714-1.175 1.492-1.175A2.9 2.9 0 0 1 0 0m1.275-1.365c-.561 0-.981.267-1.148.764H.103a3.3 3.3 0 0 0-2.133-.791c-1.188 0-2.119.627-2.119 1.776 0 1.302 1.048 1.863 2.516 1.863.535 0 1.096-.064 1.633-.141v.818C0 3.943-.677 4.43-1.85 4.43c-.741 0-1.354-.204-1.825-.498v.701c.433.268 1.098.485 1.926.485 1.635 0 2.49-.792 2.49-2.08V.153c0-.433.14-.854.714-.854.167 0 .331.05.461.1v-.651a2.2 2.2 0 0 0-.641-.113" clip-path="url(#t)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 328.308 167.874)"/> <path d="M0 0h1.302v1.762l.754.178V0h2.016v-.677H2.056v-3.649c0-.908.368-1.379 1.135-1.379.331 0 .638.077.881.191v-.675a2.4 2.4 0 0 0-1.008-.207c-1.188 0-1.762.755-1.762 2.019v3.7H0Z" clip-path="url(#u)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 334.526 157.06)"/> <path d="M0 0h.754v-4.34l.024-.013c.55.511 1.378.995 2.387.995.664 0 1.212-.204 1.622-.624.42-.434.574-1.009.574-1.863v-3.906h-.754v3.803c0 .69-.101 1.137-.408 1.442-.293.293-.701.447-1.212.447-.844 0-1.635-.421-2.233-1.021v-4.671H0Z" clip-path="url(#v)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 348.089 149.51)"/> <path d="M0 0c0 1.455-1.058 2.567-2.501 2.567S-5.004 1.455-5.004 0c0-1.469 1.061-2.577 2.503-2.577S0-1.469 0 0m-5.755 0c0 1.826 1.378 3.255 3.254 3.255S.754 1.826.754 0c0-1.839-1.379-3.268-3.255-3.268S-5.755-1.839-5.755 0" clip-path="url(#w)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 377.317 163.836)"/> <path d="M671.047 299.764h.754v-9.751h-.754z" clip-path="url(#x)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 -1069.938 799.061)"/> <path d="M0 0c0 1.455-1.058 2.567-2.501 2.567S-5.004 1.455-5.004 0c0-1.469 1.061-2.577 2.503-2.577S0-1.469 0 0m-5.755 0c0 1.826 1.378 3.255 3.254 3.255S.754 1.826.754 0c0-1.839-1.378-3.268-3.255-3.268-1.876 0-3.254 1.429-3.254 3.268" clip-path="url(#y)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 403.43 163.836)"/> <path d="M0 0c.714 0 1.405.307 1.863.778v3.805a3.36 3.36 0 0 1-1.749.511c-1.53 0-2.488-1.138-2.488-2.58C-2.374 1.058-1.416 0 0 0m-.408-2.871c1.416 0 2.271.804 2.271 2.143v.792L1.85.077A2.93 2.93 0 0 0-.127-.664c-1.712 0-3.001 1.288-3.001 3.141 0 1.812 1.265 3.291 3.218 3.291.741 0 1.392-.217 1.926-.523l.601.142V-.741c0-1.709-1.098-2.807-3.001-2.807-.791 0-1.492.203-2.04.537v.764c.548-.394 1.276-.624 2.016-.624" clip-path="url(#z)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 416.036 169.284)"/> <path d="m0 0 1.709 3.485-2.667 5.591h.831l1.249-2.657c.333-.701.69-1.455.971-2.106h.027c.317.704.637 1.405.981 2.12l1.252 2.643h.791L.818 0Z" clip-path="url(#A)" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(2.16689 0 0 -2.16689 428.416 176.724)"/> </svg>
package/assets/logos/cytario-logo-white.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="164.889" height="59.067" viewBox="0 0 164.889 59.067"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M-338.072-186.979h769.89v382.677h-769.89Z"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><path d="M-344.75-207.048h769.89v382.677h-769.89Z"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><path d="M-373.196-187.062h769.89v382.677h-769.89Z"/></clipPath><clipPath id="d" clipPathUnits="userSpaceOnUse"><path d="M-387.107-195.61h769.89v382.677h-769.89Z"/></clipPath><clipPath id="e" clipPathUnits="userSpaceOnUse"><path d="M-398.916-207.048h769.89v382.677h-769.89Z"/></clipPath><clipPath id="f" clipPathUnits="userSpaceOnUse"><path d="M-408.95-207.13h769.89v382.677h-769.89Z"/></clipPath><clipPath id="g" clipPathUnits="userSpaceOnUse"><path d="M-427.617-190.325h769.89v382.677h-769.89Z"/></clipPath><clipPath id="h" clipPathUnits="userSpaceOnUse"><path d="M-443.355-204.527h769.89V178.15h-769.89Z"/></clipPath></defs><path d="M0 0c0-.21-.041-.295-.209-.335-1.34-.546-3.017-.672-4.651-.672-6.788 0-10.809 4.653-10.809 10.684 0 6.202 4.609 10.812 11.522 10.812 2.096 0 3.226-.21 3.938-.461.168-.083.209-.209.209-.461l-.041-3.728c0-.293-.168-.293-.335-.253-.88.335-1.97.546-3.603.546-3.814 0-6.496-2.264-6.496-6.286 0-4.569 3.31-6.327 6.536-6.327 1.509 0 2.809.127 3.646.42.209.082.293-.044.293-.211Z" clip-path="url(#a)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 20.892 46.214)"/><path d="M0 0c.167 0 .293-.041.376-.251C3.1-8.086 4.525-12.612 5.069-14.665c1.382 4.233 2.85 8.547 4.735 14.414.084.167.209.251.461.251h4.316c.251 0 .293-.125.251-.334-3.018-9.261-7.819-20.925-11.214-28.674-.084-.169-.208-.295-.543-.295l-4.59-.406c-.251 0-.309.139-.209.336a164 164 0 0 1 4.196 9.092c.084.253.125.379.041.672C1.382-16.844-2.64-6.872-5.154-.293c-.084.168.04.293.251.293Z" clip-path="url(#b)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 29.796 19.455)"/><path d="M0 0c0-.253-.041-.419-.251-.503-1.132-.42-2.179-.586-3.561-.586-3.436 0-5.49 1.675-5.49 5.824v11.019h-2.639c-.208.041-.294.127-.294.378v3.52c0 .25.086.334.335.334l2.598.009c.041 1.468 0 3.703 0 5.145.041.209.126.335.335.377l4.447.394c.2.02.293 0 .293-.209v-5.707l4.102-.009c.211 0 .293-.084.293-.293v-3.646c0-.208-.082-.293-.293-.293h-4.107V5.823c0-1.842.586-2.723 2.39-2.723.542 0 1.005.041 1.591.167.126.043.251 0 .251-.25Z" clip-path="url(#c)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 67.724 46.102)"/><path d="M0 0c-.63.084-1.342.126-2.305.126-3.311 0-4.776-1.089-4.776-2.891 0-1.551 1.088-2.891 4.104-2.891 1.091 0 2.054.126 2.977.502zm4.902-4.944c0-.921 0-1.76.084-2.64 0-.083 0-.125-.084-.169C1.467-9.218-.963-9.637-3.814-9.637c-4.567 0-8.212 2.137-8.212 6.872 0 4.441 3.98 6.663 9.428 6.663 1.256 0 2.219-.044 2.598-.084v.502c0 .965-.545 3.143-4.233 3.143-2.093 0-3.939-.42-5.49-1.175-.126-.04-.335 0-.335.253v3.645c0 .209.042.293.253.418 1.802.839 4.107 1.259 6.37 1.259 5.823 0 8.337-3.647 8.337-8.298z" clip-path="url(#d)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 86.272 34.706)"/><path d="M0 0c.252 0 .379-.084.461-.334.209-.545.376-1.594.42-2.515C2.305-1.088 4.582.419 7.473.419c.251 0 .446-.121.446-.433v-4.3c0-.211-.084-.295-.377-.295-2.974.084-5.446-.963-6.41-2.221v-13.491c0-.253-.125-.335-.378-.335h-4.358c-.291 0-.377.126-.377.335 0 0 .015 18.591.015 20.07 0 .21.042.251.253.251z" clip-path="url(#e)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 102.018 19.455)"/><path d="M0 0c0 .186.152.338.338.338a4.773 4.773 0 0 0 4.773-4.774v-15.972c0-.251-.086-.334-.379-.334H.419c-.293 0-.419.126-.419.377Z" clip-path="url(#f)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 115.395 19.345)"/><path d="M0 0a6.415 6.415 0 0 0-6.356 6.475 6.415 6.415 0 1 0 12.831-.119A6.415 6.415 0 0 0 0 0m1.573 16.958c-1.684.25-4.143.078-5.373.158-4.321.291-7.287 4.505-7.295 8.695-.001 3.185-1.797 4.984-4.168 5.418a5.08 5.08 0 0 1-4.086-1.023 5.08 5.08 0 0 1-1.845-3.785c-.066-2.409 1.322-4.539 4.439-5.198 4.098-.875 7.607-4.651 6.996-8.937-.177-1.22-.867-3.725-.969-5.425C-11.099.951-6.335-4.203-.305-4.331c2.655-.057 5.118.828 7.028 2.376s3.318 3.767 3.778 6.383c1.068 5.825-2.936 11.643-8.928 12.53" clip-path="url(#g)" style="fill:#35b7b8;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 140.285 41.753)"/><path d="M0 0c0 .424-.31.73-.905.73h-.751V-.712h.751C-.31-.712 0-.443 0 0m-1.656-1.195v-1.481h-.538v3.887h1.289C-.018 1.211.559.75.559.018c0-.577-.367-.962-.905-1.115L.751-2.676H.114L-.887-1.195zm3.811.463c0 1.79-1.25 3.061-3.06 3.061-1.809 0-3.08-1.271-3.08-3.061 0-1.809 1.271-3.08 3.08-3.08s3.06 1.271 3.06 3.08m-6.68 0c0 2.06 1.523 3.581 3.62 3.581S2.714 1.328 2.714-.732c0-2.08-1.521-3.6-3.619-3.6-2.097 0-3.62 1.52-3.62 3.6" clip-path="url(#h)" style="fill:#fff;fill-opacity:1;fill-rule:nonzero;stroke:none" transform="matrix(1.33333 0 0 -1.33333 161.27 22.816)"/></svg>
package/assets/wireframes/DESIGN-SPEC.md ADDED
@@ -0,0 +1,150 @@
1
+ # Modal Redesign -- UX Wireframes & Design Specification
2
+
3
+ ## Overview
4
+
5
+ Wireframes for two redesigned modal dialogs: **ConnectionInfoDialog** and **FileInfoDialog**. These replace the current minimal modals (title + 2 buttons only) with information-rich views that eliminate the need to navigate away from the current context.
6
+
7
+ ## Design Principles Applied
8
+
9
+ 1. **Information density over whitespace** -- These are professional tools for pathologists and lab administrators. Show all relevant metadata at a glance.
10
+ 2. **Inline edit mode** -- No navigation to a separate edit page. Click "Edit" and fields become editable in place. This saves context switches.
11
+ 3. **Progressive disclosure** -- AWS-specific fields (Region, Role ARN) only appear when provider is AWS. Custom providers show Endpoint as required instead.
12
+ 4. **Destructive action confirmation** -- Delete requires an inline confirmation step within the same modal, not a second modal on top of a modal.
13
+
14
+ ## Wireframe Files
15
+
16
+ | File | State |
17
+ |------|-------|
18
+ | `connection-info-view.puml` | Connection dialog, view mode |
19
+ | `connection-info-edit-aws.puml` | Connection dialog, edit mode, AWS provider selected |
20
+ | `connection-info-edit-custom.puml` | Connection dialog, edit mode, custom provider (MinIO) |
21
+ | `file-info-default.puml` | File info dialog, default view |
22
+ | `file-info-delete-confirm.puml` | File info dialog, delete confirmation state |
23
+
24
+ ---
25
+
26
+ ## ConnectionInfoDialog
27
+
28
+ ### Dialog Size
29
+ - **lg** (`max-w-2xl`) -- needs room for form fields with prefixes and long ARN values.
30
+
31
+ ### View Mode Layout
32
+
33
+ **Header**: Alias as dialog title (e.g., "vericura internal") + close button (X).
34
+
35
+ **Body**: Stacked label/value pairs using a consistent two-column layout:
36
+ - **Provider** -- Shown as a Badge component (purple for AWS, teal for MinIO/custom)
37
+ - **Visibility** -- Group name (the ownerScope concept, presented as human-readable "Shared with: {group}")
38
+ - **S3 URI** -- Composite of `s3://{name}/{prefix}`, displayed with the `s3://` protocol grayed out
39
+ - **Region** -- Only shown for AWS provider
40
+ - **Endpoint** -- Shows "(default AWS endpoint)" if empty for AWS; shows the actual URL for custom providers
41
+ - **Role ARN** -- Only shown for AWS provider; hidden if empty
42
+ - **Created by** -- Read-only, visually de-emphasized with `--color-muted-foreground`
43
+ - **Connection ID** -- Read-only, visually de-emphasized with `--color-muted-foreground`, shown last (least important)
44
+
45
+ **Footer**: Three action groups, spread with space-between:
46
+ - Left: "Open Bucket" (secondary variant)
47
+ - Center: "Edit" (ghost variant)
48
+ - Right: "Remove Connection" (destructive variant)
49
+
50
+ ### Edit Mode Layout
51
+
52
+ **Header**: Changes title to "Edit Connection" to signal mode change.
53
+
54
+ **Body**: Same field order, but editable:
55
+ - **Alias** -- Input component
56
+ - **Provider** -- Select dropdown (AWS, MinIO, Custom)
57
+ - **Visibility** -- Select dropdown listing available groups
58
+ - **S3 URI** -- Input with `s3://` prefix (uses the Input prefix prop)
59
+ - **Region** -- Input (only visible when provider is AWS)
60
+ - **Endpoint** -- Input with description text ("Leave empty for default AWS endpoint" for AWS; "Required for non-AWS providers" for custom)
61
+ - **Role ARN** -- Input with description text (only visible when provider is AWS)
62
+
63
+ **Footer**: Two actions:
64
+ - Left: "Cancel" (ghost variant) -- returns to view mode without saving
65
+ - Right: "Save Changes" (primary variant)
66
+
67
+ ### Provider-Conditional Fields
68
+
69
+ | Field | AWS | Custom (MinIO, etc.) |
70
+ |-------|-----|---------------------|
71
+ | Region | Shown | Hidden |
72
+ | Endpoint | Optional (description: "Leave empty for default") | Required |
73
+ | Role ARN | Optional | Hidden |
74
+
75
+ ### Interaction Notes
76
+
77
+ - Clicking "Edit" transitions view mode to edit mode in-place (no navigation, no second modal)
78
+ - Clicking "Cancel" discards changes and returns to view mode
79
+ - Changing the Provider dropdown immediately shows/hides conditional fields
80
+ - "Remove Connection" in view mode should trigger an inline confirmation (similar pattern to file delete), but this is a future state -- for now, the wireframe shows the button placement
81
+
82
+ ---
83
+
84
+ ## FileInfoDialog
85
+
86
+ ### Dialog Size
87
+ - **md** (`max-w-lg`) -- compact metadata table, no form fields needed.
88
+
89
+ ### Default View Layout
90
+
91
+ **Header**: Filename as dialog title (e.g., "case-2024-0193_HE.ome.tif") + close button.
92
+
93
+ **Body**: Two-column key/value table:
94
+ - **Size** -- Human-readable (e.g., "2.4 GB")
95
+ - **Last Modified** -- ISO-ish datetime with UTC (e.g., "2026-02-18 14:32 UTC")
96
+ - **Content Type** -- MIME type (e.g., "image/tiff")
97
+ - **Storage Class** -- S3 storage class (e.g., "STANDARD", "GLACIER")
98
+ - **ETag** -- Truncated S3 hash, visually de-emphasized with `--color-muted-foreground`
99
+ - **Version ID** -- Truncated, de-emphasized with `--color-muted-foreground`; hidden entirely if bucket is not versioned
100
+
101
+ **Footer**: Three actions:
102
+ - Left: "Open File" (secondary variant) -- navigates to the file viewer
103
+ - Center: "Download" (primary variant)
104
+ - Right: "Delete" (destructive variant)
105
+
106
+ ### Delete Confirmation State
107
+
108
+ When "Delete" is clicked, the footer region transforms into an inline confirmation panel:
109
+ - Red warning text: "Are you sure you want to delete this file?"
110
+ - Subtext: "This action cannot be undone."
111
+ - Separator line
112
+ - Two buttons: "Cancel" (ghost, returns to default footer) and "Yes, Delete File" (destructive)
113
+
114
+ The body metadata remains visible during confirmation -- the user can still see what they are about to delete. This is intentional: showing the filename and size during confirmation reduces accidental deletion errors.
115
+
116
+ ### Interaction Notes
117
+
118
+ - The confirmation replaces the footer, not the entire dialog body
119
+ - "Cancel" in the confirmation returns to the normal 3-button footer
120
+ - "Yes, Delete File" triggers the actual deletion and closes the dialog
121
+ - No second modal -- everything happens in-place
122
+
123
+ ---
124
+
125
+ ## Component Mapping
126
+
127
+ | Wireframe Element | Design System Component | Props/Variant |
128
+ |-------------------|------------------------|---------------|
129
+ | Dialog shell | `Dialog` | size="lg" (connection) / size="md" (file) |
130
+ | Action buttons | `Button` | variant: primary/secondary/ghost/destructive |
131
+ | Provider badge | `ProviderBadge` (wraps `Pill`) | aws=purple, azure=teal, gcp=slate, minio=rose, unknown=neutral |
132
+ | Text inputs | `Input` | with label, prefix for S3 URI |
133
+ | Dropdowns | `Select` | for Provider, Visibility |
134
+ | Key/value pairs | Custom layout | Tailwind grid or description list |
135
+ | Confirmation panel | Inline div | Replaces footer, not a nested dialog |
136
+
137
+ ---
138
+
139
+ ## Accessibility Considerations
140
+
141
+ - Dialog title changes from alias to "Edit Connection" when entering edit mode -- `aria-label` should update accordingly
142
+ - Destructive confirmation uses `role="alert"` for screen reader announcement
143
+ - All form fields have visible labels (no placeholder-only fields)
144
+ - Tab order follows visual layout: top-to-bottom through fields, then footer buttons left-to-right
145
+ - Escape key closes the dialog from any state (view mode, edit mode, or delete confirmation)
146
+ - **Contrast**: Read-only / de-emphasized values use `--color-muted-foreground` (slate-600, ~7:1 ratio). The old `--color-text-tertiary` (slate-400, ~2.9:1, fails WCAG AA at body-text sizes) was removed from the token system for exactly this reason -- there is no longer a third, lower-contrast text tier
147
+
148
+ ## Review Notes
149
+
150
+ - **Graphics Designer review (Task #2)**: Approved. Flagged `--color-text-tertiary` contrast issue (corrected above). Confirmed `ProviderBadge` component (wrapping `Pill`, not `Badge`) should be reused and extracted to a shared location from `StorageConnectionCard.tsx`.
package/assets/wireframes/connection-info-edit-aws.puml ADDED
@@ -0,0 +1,41 @@
1
+ @startsalt
2
+ title Connection Info Dialog -- Edit Mode (AWS)
3
+ {
4
+ {+
5
+ {
6
+ <b>Edit Connection</b> | | | | | | | | <&x>
7
+ }
8
+ --
9
+ {
10
+ {
11
+ <b>Alias</b>
12
+ "vericura internal "
13
+ .
14
+ <b>Provider</b>
15
+ ^AWS^
16
+ .
17
+ <b>Visibility</b>
18
+ ^vericura-pathology^
19
+ .
20
+ <b>S3 URI</b>
21
+ { <color:gray>s3://</color> | "cytario-research-data/slides/ " }
22
+ .
23
+ <b>Region</b>
24
+ "eu-central-1 "
25
+ .
26
+ <b>Endpoint</b>
27
+ " "
28
+ <color:gray>Leave empty for default AWS endpoint</color>
29
+ .
30
+ <b>Role ARN</b>
31
+ "arn:aws:iam::123456789012:role/cytario-read"
32
+ <color:gray>Optional. IAM role for cross-account access</color>
33
+ }
34
+ }
35
+ --
36
+ {
37
+ [ Cancel ] | | | | | | | | [ Save Changes ]
38
+ }
39
+ }
40
+ }
41
+ @endsalt
package/assets/wireframes/connection-info-edit-custom.puml ADDED
@@ -0,0 +1,34 @@
1
+ @startsalt
2
+ title Connection Info Dialog -- Edit Mode (Custom / MinIO)
3
+ {
4
+ {+
5
+ {
6
+ <b>Edit Connection</b> | | | | | | | | <&x>
7
+ }
8
+ --
9
+ {
10
+ {
11
+ <b>Alias</b>
12
+ "local dev storage "
13
+ .
14
+ <b>Provider</b>
15
+ ^MinIO^
16
+ .
17
+ <b>Visibility</b>
18
+ ^cytario-dev^
19
+ .
20
+ <b>S3 URI</b>
21
+ { <color:gray>s3://</color> | "dev-pathology-bucket/wsi/ " }
22
+ .
23
+ <b>Endpoint</b>
24
+ "https://minio.internal.cytario.io:9000 "
25
+ <color:gray>Required for non-AWS providers</color>
26
+ }
27
+ }
28
+ --
29
+ {
30
+ [ Cancel ] | | | | | | | | [ Save Changes ]
31
+ }
32
+ }
33
+ }
34
+ @endsalt
package/assets/wireframes/connection-info-view.puml ADDED
@@ -0,0 +1,42 @@
1
+ @startsalt
2
+ title Connection Info Dialog -- View Mode
3
+ {
4
+ {+
5
+ {
6
+ <b>vericura internal</b> | | | | | | | | <&x>
7
+ }
8
+ --
9
+ {
10
+ {
11
+ <b>Provider</b>
12
+ [ AWS ] | " "
13
+ .
14
+ <b>Visibility</b>
15
+ Shared with: <b>vericura-pathology</b>
16
+ .
17
+ <b>S3 URI</b>
18
+ <color:gray>s3://</color>cytario-research-data/slides/
19
+ .
20
+ <b>Region</b>
21
+ eu-central-1
22
+ .
23
+ <b>Endpoint</b>
24
+ <color:gray>(default AWS endpoint)</color>
25
+ .
26
+ <b>Role ARN</b>
27
+ arn:aws:iam::123456789012:role/cytario-read
28
+ .
29
+ <b>Created by</b>
30
+ <color:gray>m.schneider@vericura.com</color>
31
+ .
32
+ <b>Connection ID</b>
33
+ <color:gray>conn-a8f3e21b</color>
34
+ }
35
+ }
36
+ --
37
+ {
38
+ [ Open Bucket ] | [ Edit ] | | | | [ Remove Connection ]
39
+ }
40
+ }
41
+ }
42
+ @endsalt
package/assets/wireframes/file-info-default.puml ADDED
@@ -0,0 +1,25 @@
1
+ @startsalt
2
+ title File Info Dialog -- Default View
3
+ {
4
+ {+
5
+ {
6
+ <b>case-2024-0193_HE.ome.tif</b> | | | | | | <&x>
7
+ }
8
+ --
9
+ {
10
+ {
11
+ <b>Size</b> | 2.4 GB
12
+ <b>Last Modified</b> | 2026-02-18 14:32 UTC
13
+ <b>Content Type</b> | image/tiff
14
+ <b>Storage Class</b> | STANDARD
15
+ <b>ETag</b> | <color:gray>"a3f8c91b2d..."</color>
16
+ <b>Version ID</b> | <color:gray>v8Kj2mNpQ3...</color>
17
+ }
18
+ }
19
+ --
20
+ {
21
+ [ Open File ] | [ Download ] | | | | [ Delete ]
22
+ }
23
+ }
24
+ }
25
+ @endsalt
package/assets/wireframes/file-info-delete-confirm.puml ADDED
@@ -0,0 +1,28 @@
1
+ @startsalt
2
+ title File Info Dialog -- Delete Confirmation
3
+ {
4
+ {+
5
+ {
6
+ <b>case-2024-0193_HE.ome.tif</b> | | | | | | <&x>
7
+ }
8
+ --
9
+ {
10
+ {
11
+ <b>Size</b> | 2.4 GB
12
+ <b>Last Modified</b> | 2026-02-18 14:32 UTC
13
+ <b>Content Type</b> | image/tiff
14
+ <b>Storage Class</b> | STANDARD
15
+ <b>ETag</b> | <color:gray>"a3f8c91b2d..."</color>
16
+ <b>Version ID</b> | <color:gray>v8Kj2mNpQ3...</color>
17
+ }
18
+ }
19
+ --
20
+ {+
21
+ <color:red><b>Are you sure you want to delete this file?</b></color>
22
+ This action cannot be undone.
23
+ --
24
+ { [ Cancel ] | | | [ Yes, Delete File ] }
25
+ }
26
+ }
27
+ }
28
+ @endsalt