@archetypeai/ds-ui-svelte-labs 0.14.0 → 0.15.0

package/README.md

@@ -87,6 +87,7 @@ Each primitive lives at its own subpath. There is no barrel `import { Logo } fro
 
 <Menubar />
 <Logo size="lg" />
+<Logo variant="compact" />
 <Slider type="single" bind:value={volume} max={100} />
 ```
 
@@ -108,6 +109,66 @@ Each primitive lives at its own subpath. There is no barrel `import { Logo } fro
 
 Class-merging and element-ref type helpers re-export from console at `@archetypeai/ds-ui-svelte-labs/primitives/utils` (a single `cn`/`twMerge` instance exists in the tree), alongside the labs domain helpers (`healthTier`, `formatMMSS`, `clamp`).
 
+## Logo (primitives/logo)
+
+Two artwork forms behind one component. `variant="default"` is the horizontal wordmark (~5.4:1);
+`variant="compact"` is the stacked social/avatar lockup (~1.6:1) - use it where a wordmark will
+not fit, such as square tiles, avatars, narrow sidebars and splash marks.
+
+Both forms honour the same `size` scale - `sm` | `default` | `lg` maps to `h-4` | `h-6` | `h-8` -
+and take their width from `w-auto`, so swapping variants changes the rendered width, never the
+height. Because of that, `compact` reads small at `sm`; prefer `default` or `lg`, or override with
+`class`.
+
+```svelte
+<Logo />                              <!-- wordmark, h-6 -->
+<Logo variant="compact" size="lg" />  <!-- stacked lockup, h-8 -->
+<Logo variant="compact" class="h-16 w-auto" />
+```
+
+Both forms are single inline SVGs coloured by `currentColor` (`text-foreground` by default), so
+they invert with the theme and accept any `text-*` override. The accessible name is
+`"Archetype AI"` for both; pass `aria-label` / `role` to override when the mark sits next to a
+text logotype and would otherwise double-announce.
+
+## VideoPlayer (primitives/video-player)
+
+The seek track doubles as a timeline. `markers` are named windows **in seconds** (not fractions of
+the duration), drawn as focusable dots; clicking one expands it into a range pill, seeks to its
+start and starts playback. One is expanded at a time, `bind:activeMarker` is its index, and
+scrubbing by hand or clicking the video surface collapses it. While one is expanded the others step
+out of the way entirely, pointer events included.
+
+```svelte
+<VideoPlayer
+  src={clip}
+  bind:time
+  bind:duration
+  bind:activeMarker
+  markers={[{ start: 12, end: 18, label: 'Approach' }]}
+  highlights={brushedWindows}
+  controlsVisibility="always"
+  onMarkerHover={(index) => (hovered = index)}
+/>
+```
+
+`controlsVisibility="always"` is required whenever markers must stay clickable during playback: the
+default `"auto"` fades the control bar, and the markers with it, 2.5s in. For linked brushing,
+`highlights` tints regions another view is pointing at, and `onMarkerHover` reports the marker under
+the cursor **or the keyboard focus**.
+
+Two traps when `src` changes, both invisible from the type signature:
+
+- **A new `src` remounts the player**, and Svelte's media bindings write your bound values into the
+  fresh element — so reset `time = 0` and `paused = true` yourself, or a stale position becomes the
+  next clip's start.
+- **`bind:duration` holds the previous clip's value until `loadedmetadata`.** Reseed it from a known
+  length if marker geometry has to be right on the first frame; while `duration` is 0 every marker
+  collapses onto the left edge.
+
+Marker seeking also needs an origin that serves HTTP Range requests — against one that doesn't,
+seeks silently do nothing. Serve the clip from a blob URL instead.
+
 ## Extending console primitives
 
 Labs adapts console primitives without ever changing console, using this escape-hatch ladder (in order):

package/dist/primitives/logo/index.d.ts

@@ -1,4 +1,4 @@
 import Root from './logo.svelte';
-export { logoVariants, type LogoProps, type LogoSize } from './types.js';
+export { logoVariants, type LogoProps, type LogoSize, type LogoVariant } from './types.js';
 export { Root, Root as Logo };
 export default Root;

package/dist/primitives/logo/logo.svelte

@@ -4,27 +4,69 @@
 
   let {
     class: className,
+    variant = 'default',
     size = 'default',
     role = 'img',
     'aria-label': ariaLabel = 'Archetype AI',
     ...restProps
   }: LogoProps = $props();
+
+  const viewBox = $derived(variant === 'compact' ? '0 0 741 455' : '0 0 190 35');
 </script>
 
 <svg
   {role}
   aria-label={ariaLabel}
   data-slot="logo"
+  data-variant={variant}
   data-size={size}
-  class={cn(logoVariants({ size }), className)}
-  viewBox="0 0 190 35"
+  class={cn(logoVariants({ variant, size }), className)}
+  {viewBox}
   fill="none"
   xmlns="http://www.w3.org/2000/svg"
   {...restProps}
 >
-  <path
-    d="M105.615 1.57812C105.722 1.57812 105.808 1.66398 105.808 1.77051V7.50879C105.808 7.66785 105.906 7.80434 106.045 7.86328C106.09 7.8821 106.14 7.89253 106.192 7.89258H113.744C113.843 7.89258 113.937 7.91818 114.02 7.96289C114.141 8.02708 114.238 8.13281 114.29 8.26562L116.048 12.8408L119.444 21.6826C119.475 21.7628 119.526 21.8231 119.587 21.8643C119.595 21.8697 119.603 21.8742 119.612 21.8789C119.637 21.8931 119.663 21.9049 119.69 21.9131C119.873 21.9666 120.091 21.8866 120.167 21.6738L125.096 8.01855C125.125 7.9418 125.197 7.8916 125.279 7.8916H129.266L129.268 7.89258C129.337 7.89261 129.394 7.92787 129.428 7.97852C129.462 8.02824 129.473 8.09345 129.448 8.15625H129.454L121.633 28.2607C120.696 30.6621 119.683 32.3727 118.621 33.3389C117.542 34.3182 116.19 34.8125 114.597 34.8125C114.39 34.8125 114.173 34.8027 113.944 34.7871C113.813 34.7782 113.679 34.7669 113.542 34.7529C113.102 34.7081 112.627 34.639 112.122 34.542L112.023 34.5254L112.022 34.5244H112.017C111.924 34.5096 111.853 34.4292 111.853 34.333V31.2559C111.853 31.1419 111.953 31.0511 112.068 31.0645L112.176 31.0762C112.617 31.1266 113.004 31.1598 113.334 31.1768C113.497 31.185 113.647 31.1894 113.782 31.1895C114.609 31.189 115.382 30.9116 116.079 30.3662C116.748 29.841 117.265 28.9285 117.613 27.6504C117.631 27.5838 117.627 27.5119 117.601 27.4482L111.117 11.6367C111.088 11.5654 111.039 11.5056 110.978 11.4639C110.916 11.4225 110.841 11.3994 110.763 11.3994H106.391C106.07 11.3997 105.81 11.6591 105.81 11.9785V22.2979C105.81 23.2461 105.956 23.8811 106.243 24.1904C106.278 24.2286 106.318 24.2644 106.361 24.2979L106.496 24.3877C106.8 24.5595 107.243 24.6465 107.818 24.6465C108.294 24.6465 108.633 24.6275 109.214 24.5283L109.411 24.4941C109.447 24.4878 109.483 24.4926 109.514 24.5049C109.587 24.5319 109.64 24.6021 109.64 24.6865V27.7285C109.64 27.8201 109.576 27.8986 109.489 27.918L109.246 27.9678C108.462 28.1216 107.885 28.1504 107.048 28.1504C105.88 28.1504 104.894 27.9608 104.099 27.5879C103.994 27.5384 103.891 27.4857 103.793 27.4297C103.771 27.4171 103.748 27.4055 103.726 27.3926C103.449 27.229 103.2 27.0395 102.979 26.8232C102.081 25.9429 101.626 24.3813 101.626 22.1797V11.5908C101.626 11.4975 101.56 11.4201 101.471 11.4023L101.432 11.3984H98.9547C98.8477 11.3984 98.7615 11.3125 98.7614 11.2061V8.08691C98.7614 8.07827 98.7632 8.06986 98.7643 8.06152C98.7654 8.05289 98.766 8.04437 98.7682 8.03613C98.7754 8.00967 98.7903 7.98738 98.8073 7.9668C98.843 7.9232 98.8949 7.89272 98.9557 7.89258H101.239C101.329 7.89258 101.412 7.86108 101.477 7.80957C101.566 7.73895 101.625 7.63142 101.625 7.50977V1.77051C101.625 1.66398 101.711 1.57812 101.818 1.57812H105.615ZM141.352 7.32031C143.058 7.32034 144.617 7.75709 145.985 8.62109C147.352 9.48369 148.444 10.7278 149.231 12.3184H149.228C150.012 13.903 150.409 15.784 150.409 17.9102C150.409 20.0361 150.012 21.918 149.228 23.501C148.441 25.093 147.349 26.3299 145.982 27.1807C144.614 28.0314 143.055 28.4619 141.35 28.4619C139.88 28.4619 138.609 28.1754 137.579 27.6104C136.862 27.2183 136.241 26.738 135.726 26.1816C135.606 26.0536 135.39 26.1334 135.389 26.3105V34.5479C135.389 34.6542 135.303 34.7401 135.196 34.7402H131.401L131.362 34.7363C131.274 34.7184 131.207 34.6409 131.207 34.5479V8.08984C131.207 7.98339 131.294 7.89564 131.401 7.89551H135.196C135.303 7.89567 135.389 7.98341 135.389 8.08984V8.99805C135.389 9.3309 135.791 9.50893 136.038 9.28125C137.451 7.97921 139.233 7.32031 141.352 7.32031ZM88.8688 7.2793C91.8792 7.27937 94.2532 8.20693 95.9235 10.0371H95.9215C97.5874 11.8644 98.4313 14.3698 98.4313 17.4844C98.4313 18.231 98.418 18.5033 98.3913 18.7178L98.3805 18.9209C98.3745 19.0229 98.2893 19.1025 98.1852 19.1025H83.859C83.5067 19.1025 83.237 19.4117 83.2829 19.7607C83.4584 21.116 83.96 22.294 84.778 23.2734C85.7537 24.4394 87.1551 25.0332 88.946 25.0332C90.4377 25.0332 91.5974 24.6744 92.3962 23.9658C93.2038 23.2497 93.7234 22.4653 93.945 21.6338L93.9743 21.4922C93.9936 21.4036 94.0727 21.3381 94.1647 21.3379H98.0397C98.163 21.3379 98.2571 21.4521 98.2292 21.5732L98.1911 21.7363C97.614 23.7692 96.5358 25.4219 94.9889 26.6484C93.4376 27.8779 91.379 28.501 88.8669 28.501C86.8025 28.501 84.9954 28.0378 83.5006 27.125C82.0044 26.2107 80.8532 24.9396 80.0797 23.3477C79.3093 21.7616 78.9177 19.9478 78.9176 17.8721C78.9176 15.7962 79.3226 13.9391 80.1198 12.3545C80.92 10.7625 82.0845 9.50493 83.5807 8.61719C85.0771 7.72944 86.8563 7.2793 88.8688 7.2793ZM161.463 7.2793C164.473 7.27936 166.847 8.20692 168.517 10.0371H168.515C170.18 11.8644 171.025 14.3698 171.025 17.4844C171.025 18.231 171.012 18.5033 170.985 18.7178L170.974 18.9209C170.968 19.0229 170.883 19.1025 170.779 19.1025H156.453C156.1 19.1025 155.831 19.4117 155.877 19.7607C156.052 21.116 156.554 22.294 157.372 23.2734C158.347 24.4394 159.749 25.0332 161.54 25.0332C163.031 25.0332 164.191 24.6744 164.99 23.9658C165.796 23.2497 166.317 22.4653 166.539 21.6338L166.569 21.4922C166.588 21.4036 166.665 21.3381 166.758 21.3379H170.633C170.757 21.3379 170.851 21.4521 170.823 21.5732L170.786 21.7363C170.209 23.7693 169.131 25.4219 167.583 26.6484C166.031 27.8779 163.971 28.501 161.461 28.501C159.396 28.501 157.589 28.0378 156.094 27.125C154.598 26.2107 153.447 24.9396 152.673 23.3477C151.903 21.7616 151.511 19.9478 151.511 17.8721C151.511 15.7962 151.916 13.9391 152.714 12.3545C153.514 10.7625 154.678 9.50493 156.174 8.61719C157.671 7.72944 159.45 7.2793 161.463 7.2793ZM48.9274 7.29297C50.6036 7.29297 52.1165 7.63016 53.4284 8.2959C54.7433 8.96171 55.8099 9.90612 56.6012 11.0957C56.7097 11.2583 56.8093 11.4238 56.9059 11.5938C56.9401 11.6499 56.9714 11.7065 56.9997 11.7627L57.1012 11.958C57.1206 11.9935 57.1371 12.0309 57.1549 12.0664C57.1697 12.0959 57.1846 12.1253 57.1979 12.1562C57.2202 12.205 57.2435 12.2525 57.2643 12.3027C57.3283 12.4418 57.387 12.584 57.445 12.7275C57.4732 12.8 57.4998 12.8729 57.5251 12.9453C57.5473 13.0103 57.5712 13.0737 57.5905 13.1387C57.6098 13.1905 57.6264 13.2441 57.6413 13.2959C57.6635 13.3682 57.6859 13.4404 57.7067 13.5127C57.7097 13.5216 57.7121 13.5312 57.7135 13.54C57.7834 13.7884 57.8451 14.0411 57.8942 14.2998C57.9105 14.3795 57.9248 14.4627 57.9381 14.5439C57.9724 14.7496 58.0023 14.9574 58.0231 15.1689L58.0309 15.2676C58.0384 15.3784 57.9504 15.4744 57.8376 15.4746H53.9264C53.824 15.4744 53.7405 15.3964 53.7331 15.2959L53.7262 15.21C53.7039 14.9999 53.6727 14.791 53.6296 14.5898L53.6286 14.5889L53.6276 14.5898C53.6158 14.531 53.6043 14.4734 53.5895 14.416C53.5791 14.3672 53.5653 14.3193 53.5534 14.2705C53.54 14.2203 53.5268 14.1684 53.5104 14.1182C53.4985 14.0753 53.4847 14.0321 53.4714 13.9893C53.4253 13.8444 53.3731 13.7039 53.3151 13.5664C53.3047 13.5369 53.2914 13.5071 53.278 13.4775C53.2573 13.4274 53.2353 13.3772 53.2116 13.3271C53.1848 13.268 53.1564 13.2095 53.1266 13.1533C53.0954 13.0927 53.0636 13.0337 53.0309 12.9746C53.0265 12.9673 53.0241 12.9609 53.0212 12.9551C52.9885 12.8974 52.9553 12.8413 52.9196 12.7852C52.884 12.7246 52.8454 12.6655 52.8053 12.6064C52.7667 12.5473 52.7264 12.4893 52.6833 12.4316L52.5544 12.2598C52.5097 12.205 52.4647 12.1504 52.4186 12.0957C51.6868 11.2346 50.5252 10.7979 48.9665 10.7979C47.0841 10.7982 45.6728 11.4763 44.7731 12.8105C43.857 14.1702 43.3932 15.8776 43.3932 17.8838C43.3932 19.8901 43.8574 21.5886 44.7721 22.9365C45.6718 24.2604 47.0811 24.9294 48.9665 24.9297C50.5519 24.9297 51.7269 24.5006 52.4587 23.6514C53.0848 22.9234 53.4863 22.0356 53.6559 21.0029C53.6901 20.8091 53.7128 20.6119 53.7292 20.4092L53.7331 20.3164C53.739 20.2143 53.8243 20.1348 53.9284 20.1348H57.8376C57.946 20.135 58.0349 20.2251 58.0319 20.333L58.029 20.3369L58.0251 20.4395C58.0146 20.6435 57.9981 20.8448 57.9743 21.043C57.8226 22.3241 57.4001 23.5048 56.7174 24.5566C55.9276 25.7743 54.8476 26.7421 53.5075 27.4346C52.1689 28.127 50.6397 28.4775 48.9665 28.4775C47.0047 28.4775 45.2523 28.0268 43.7575 27.1406C42.2598 26.2529 41.0891 24.9875 40.277 23.3838C39.4664 21.7859 39.0554 19.9348 39.0553 17.8857C39.0553 15.8365 39.4664 13.9847 40.277 12.3867C41.0891 10.7831 42.2538 9.52 43.738 8.63086C45.2194 7.74462 46.9671 7.293 48.9274 7.29297ZM15.0993 0C15.1793 0.000152967 15.2516 0.0488926 15.2799 0.124023L25.6569 27.6611H25.6549C25.7024 27.7868 25.6086 27.9209 25.4733 27.9209H20.8288C20.7455 27.9209 20.672 27.8694 20.6452 27.791L18.4499 21.4277C18.4231 21.3494 18.3505 21.2969 18.2672 21.2969H7.24576C7.16247 21.2969 7.08894 21.3493 7.06217 21.4277L4.86686 27.791C4.8401 27.8694 4.76746 27.9208 4.68424 27.9209H0.194007C0.0601917 27.9209 -0.0351022 27.7869 0.0123662 27.6611L10.3112 0.125977C10.3395 0.0505177 10.4125 0 10.4928 0H15.0993ZM37.0407 7.43164C37.551 7.43168 38.4924 7.51575 38.8805 7.55273C38.9785 7.56173 39.0543 7.64616 39.0544 7.74512V11.3672C39.0544 11.4824 38.9534 11.5745 38.8376 11.5586C38.4986 11.5157 37.8531 11.4366 37.5837 11.4365C35.9178 11.4365 34.5325 12.0126 33.4645 13.1475C32.3952 14.2852 31.8523 15.7705 31.8522 17.5605V27.7275C31.852 27.8339 31.7658 27.9209 31.6589 27.9209H27.8649C27.8104 27.9209 27.7607 27.8984 27.7253 27.8623C27.7119 27.8489 27.7029 27.8323 27.694 27.8154C27.6859 27.7999 27.6772 27.7844 27.6735 27.7666C27.6709 27.754 27.6696 27.7409 27.6696 27.7275V8.08594C27.6696 8.01093 27.7133 7.94776 27.776 7.91602C27.8029 7.90203 27.8326 7.8916 27.8649 7.8916H31.6589C31.7659 7.8916 31.8522 7.97941 31.8522 8.08594V9.68457C31.8522 9.9422 32.0797 10.0953 32.2926 10.0684C32.3474 10.0612 32.4003 10.0412 32.4489 10.0088C32.4577 10.003 32.4668 9.99784 32.4753 9.99121C32.504 9.96829 32.531 9.94069 32.5544 9.90723C32.5829 9.86636 32.6133 9.82697 32.6422 9.78711C32.6738 9.74369 32.7049 9.70043 32.737 9.6582C32.7673 9.61826 32.798 9.57892 32.8288 9.54004C32.872 9.48541 32.9164 9.43241 32.9606 9.37988C32.9847 9.35129 33.0076 9.32191 33.0319 9.29395C33.0629 9.25836 33.0951 9.22403 33.1266 9.18945C33.2719 9.02959 33.4213 8.88034 33.5758 8.74219C33.6091 8.71235 33.6427 8.68312 33.6764 8.6543C33.7146 8.62176 33.753 8.58984 33.7917 8.55859C33.8357 8.52297 33.8807 8.48902 33.9255 8.45508C33.9604 8.42863 33.9946 8.4014 34.0299 8.37598C34.0913 8.33181 34.1538 8.2901 34.2165 8.24902C34.2349 8.23694 34.2526 8.22373 34.2712 8.21191C34.3552 8.15831 34.4406 8.10766 34.527 8.05957C34.5438 8.05022 34.5609 8.04137 34.5778 8.03223C34.6508 7.9927 34.7248 7.95556 34.7995 7.91992C34.8254 7.90756 34.8515 7.89568 34.8776 7.88379C34.9395 7.85558 35.0021 7.82928 35.0651 7.80371C35.0938 7.79207 35.1221 7.77965 35.151 7.76855C35.2229 7.74098 35.2956 7.71559 35.3688 7.69141C35.39 7.6844 35.411 7.67664 35.4323 7.66992C35.5275 7.63991 35.6238 7.61223 35.7214 7.58789C35.7301 7.58571 35.739 7.58417 35.7477 7.58203C35.8389 7.55981 35.9309 7.53975 36.0241 7.52246C36.0416 7.51921 36.0592 7.51675 36.0768 7.51367C36.1587 7.49934 36.2414 7.48711 36.3249 7.47656C36.3518 7.47315 36.3788 7.46981 36.4059 7.4668C36.4786 7.45872 36.5518 7.4525 36.6256 7.44727C36.662 7.44469 36.6984 7.44134 36.735 7.43945C36.8357 7.43425 36.9379 7.43164 37.0407 7.43164ZM63.7604 0C63.8675 0 63.9538 0.0858526 63.9538 0.192383V9.08887C63.9538 9.42453 64.3553 9.60079 64.6022 9.37207C65.0751 8.93271 65.6304 8.54336 66.2624 8.20605C67.369 7.6157 68.7425 7.31641 70.3415 7.31641L70.7077 7.32324C72.5199 7.39134 74.0353 7.96955 75.2135 9.04297L75.2155 9.04004L75.445 9.2627C76.5555 10.4047 77.1178 12.0277 77.1178 14.0928V27.7256C77.1178 27.8321 77.0315 27.9179 76.9245 27.918H73.1296C73.0227 27.9177 72.9362 27.832 72.9362 27.7256V15.1328C72.9361 13.7999 72.6194 12.7543 71.9948 12.0234C71.3775 11.3014 70.4047 10.9355 69.1032 10.9355C67.5359 10.9356 66.2719 11.3721 65.3454 12.2314C64.4218 13.0895 63.9539 14.2467 63.9538 15.6729V27.7275C63.9537 27.834 63.8675 27.9199 63.7604 27.9199H59.9665L59.9274 27.916C59.8391 27.8982 59.7732 27.8207 59.7731 27.7275V0.192383C59.7731 0.0858526 59.8594 0 59.9665 0H63.7604ZM140.733 10.8643C139.102 10.8643 137.8 11.4943 136.862 12.7324C135.913 13.9886 135.43 15.7303 135.43 17.9111C135.43 20.092 135.913 21.8347 136.862 23.0908C137.8 24.3292 139.101 24.9579 140.733 24.958C142.461 24.958 143.744 24.3046 144.657 22.9629V22.9639C145.572 21.616 146.038 19.916 146.038 17.9111C146.038 15.9063 145.572 14.2078 144.657 12.8584C143.802 11.599 142.621 10.9476 141.052 10.8711L140.733 10.8643ZM181.645 1.14844C186.251 1.1486 190 4.87842 190 9.45898C190 14.0397 186.252 17.7684 181.645 17.7686C177.039 17.7686 173.29 14.0413 173.29 9.45898C173.29 4.87684 177.039 1.14844 181.645 1.14844ZM13.3307 6.25098C13.1537 5.72451 12.4074 5.72615 12.2301 6.25098L9.40397 14.6846L8.77116 16.5703C8.64665 16.9444 8.92614 17.3298 9.32291 17.3301H16.2682V17.332C16.6651 17.3319 16.9442 16.9445 16.818 16.5703L13.3307 6.25098ZM181.645 2.08691C177.559 2.08691 174.235 5.39358 174.235 9.45801C174.235 13.5223 177.559 16.8291 181.645 16.8291C185.731 16.8289 189.055 13.5222 189.055 9.45801C189.055 5.39368 185.731 2.08707 181.645 2.08691ZM88.7526 10.7461C87.2102 10.7461 85.913 11.2269 84.8971 12.1768C83.9735 13.0394 83.4211 14.1685 83.2546 15.5371C83.2414 15.6508 83.3337 15.7507 83.4479 15.751H93.8903L93.8883 15.7529C93.9999 15.7529 94.0911 15.6593 94.0837 15.5498C94.0033 14.2184 93.512 13.0971 92.6227 12.2109C91.7066 11.2997 90.4625 10.8097 89.0397 10.752L88.7526 10.7461ZM161.347 10.7461C159.805 10.7462 158.508 11.2269 157.492 12.1768C156.568 13.0393 156.017 14.1686 155.85 15.5371C155.836 15.6509 155.929 15.751 156.044 15.751H166.484V15.7529C166.595 15.7528 166.686 15.6592 166.678 15.5498C166.598 14.2185 166.108 13.0971 165.218 12.2109C164.301 11.2996 163.057 10.8096 161.634 10.752L161.347 10.7461ZM181.007 5.69531C181.028 5.69549 181.044 5.70863 181.051 5.72754L183.649 12.6182C183.661 12.6492 183.638 12.6835 183.604 12.6836H182.441L182.413 12.6748C182.405 12.6693 182.399 12.6607 182.395 12.6504L181.846 11.0586C181.839 11.0379 181.82 11.0244 181.799 11.0244H179.043L179.014 11.0342C179.006 11.0401 178.999 11.0483 178.996 11.0586L178.447 12.6504C178.439 12.6711 178.422 12.6836 178.401 12.6836H177.277L177.254 12.6777C177.233 12.6667 177.223 12.6415 177.232 12.6182L179.808 5.72754C179.816 5.70851 179.834 5.69538 179.854 5.69531H181.007ZM185.186 5.69531C185.213 5.69531 185.236 5.71717 185.236 5.74414V12.6328C185.236 12.6598 185.213 12.6816 185.186 12.6816H184.051C184.024 12.6815 184.003 12.6597 184.003 12.6328V5.74414C184.003 5.71729 184.024 5.6955 184.051 5.69531H185.186ZM180.565 7.25879C180.52 7.12618 180.334 7.12753 180.29 7.25879L179.424 9.84082C179.393 9.93548 179.463 10.0322 179.561 10.0322H181.3L181.301 10.0332C181.4 10.0332 181.469 9.93596 181.438 9.84277L180.565 7.25879Z"
-    fill="currentColor"
-    shape-rendering="crispEdges"
-  />
+  {#if variant === 'compact'}
+    <g fill="currentColor">
+      <path
+        d="M672.182 260.009C672.145 259.9 672.043 259.824 671.926 259.824H665.294C665.179 259.824 665.069 259.902 665.029 260.009L650.206 299.865C650.137 300.044 650.268 300.237 650.463 300.237H656.932C657.049 300.237 657.157 300.167 657.196 300.052L660.354 290.844C660.394 290.727 660.501 290.649 660.619 290.649H676.49C676.605 290.649 676.714 290.727 676.754 290.844L679.912 300.052C679.952 300.167 680.059 300.237 680.177 300.237H686.87C687.065 300.237 687.196 300.042 687.127 299.865L672.186 260.009H672.182ZM673.61 284.91H663.604C663.037 284.91 662.633 284.352 662.812 283.809L667.792 268.876C668.048 268.117 669.118 268.109 669.374 268.868L674.402 283.809C674.581 284.352 674.177 284.91 673.61 284.91Z"
+      />
+      <path
+        d="M696.044 259.826H689.505C689.352 259.826 689.227 259.951 689.227 260.105V299.962C689.227 300.116 689.352 300.24 689.505 300.24H696.044C696.198 300.24 696.322 300.116 696.322 299.962V260.105C696.322 259.951 696.198 259.826 696.044 259.826Z"
+      />
+      <path
+        d="M675.642 233.511C649.136 233.511 627.572 255.076 627.572 281.582C627.572 308.088 649.136 329.652 675.642 329.652C702.148 329.652 723.713 308.088 723.713 281.582C723.713 255.076 702.148 233.511 675.642 233.511ZM675.642 324.223C652.131 324.223 633.001 305.095 633.001 281.584C633.001 258.072 652.129 238.942 675.642 238.942C699.155 238.942 718.284 258.07 718.284 281.584C718.284 305.097 699.155 324.223 675.642 324.223Z"
+      />
+      <path
+        d="M138.902 162.16L155.423 210.314C155.626 210.903 156.175 211.298 156.803 211.298H191.775C192.789 211.298 193.499 210.284 193.145 209.33L115.033 0.944584C114.82 0.375845 114.271 0 113.663 0H78.9855C78.377 0 77.8282 0.375845 77.6154 0.954527L0.0938727 209.33C-0.262086 210.284 0.449832 211.298 1.46402 211.298H35.2682C35.8966 211.298 36.4454 210.903 36.6483 210.314L53.1695 162.16C53.3724 161.572 53.9212 161.176 54.5496 161.176H137.522C138.15 161.176 138.699 161.572 138.902 162.16ZM122.462 131.148H70.178C67.1852 131.148 65.0832 128.225 66.0278 125.393L70.7885 111.125L92.0606 47.3028C93.3889 43.3256 99.0127 43.3137 100.351 47.2928L126.604 125.385C127.559 128.217 125.447 131.15 122.464 131.15L122.462 131.148Z"
+      />
+      <path
+        d="M208.951 211.048C209.183 211.208 209.466 211.301 209.77 211.301H238.332C238.533 211.301 238.726 211.259 238.901 211.186C238.909 211.182 238.915 211.178 238.923 211.174C239.432 210.947 239.79 210.438 239.79 209.843V132.903C239.79 119.36 243.874 108.125 251.928 99.506C253.028 98.3307 254.175 97.241 255.364 96.2248C262.861 89.8175 272.102 86.5662 282.928 86.5662C284.287 86.5662 286.912 86.8307 289.262 87.1011C290.425 87.2363 291.523 87.3736 292.366 87.4829C292.977 87.5625 293.526 87.2483 293.804 86.7551C293.923 86.5423 293.999 86.3017 293.999 86.0392V58.6284C293.999 57.8767 293.43 57.2483 292.69 57.1767C291.247 57.0355 288.787 56.8088 286.204 56.6159C283.557 56.4151 280.783 56.25 278.844 56.25C278.16 56.25 277.484 56.2699 276.813 56.3017C276.778 56.3017 276.744 56.3037 276.708 56.3057C276.044 56.3375 275.386 56.3832 274.733 56.4469C274.706 56.4489 274.676 56.4528 274.648 56.4548C273.357 56.5801 272.092 56.767 270.85 57.0116C270.766 57.0275 270.685 57.0435 270.603 57.0614C270.006 57.1827 269.416 57.3139 268.831 57.463C268.787 57.475 268.744 57.4869 268.698 57.4988C268.149 57.64 267.608 57.7951 267.069 57.9602C266.986 57.986 266.902 58.0099 266.819 58.0358C266.276 58.2068 265.739 58.3917 265.206 58.5866C265.089 58.6304 264.973 58.6741 264.856 58.7179C264.321 58.9207 263.79 59.1315 263.265 59.3582C263.227 59.3741 263.19 59.392 263.154 59.4099C262.661 59.6247 262.175 59.8533 261.692 60.092C261.569 60.1516 261.446 60.2113 261.322 60.2749C260.833 60.5215 260.348 60.78 259.867 61.0505C259.751 61.1141 259.638 61.1817 259.525 61.2473C259.079 61.5039 258.638 61.7684 258.202 62.0448C258.135 62.0865 258.067 62.1283 257.999 62.1701C257.516 62.4803 257.039 62.8044 256.566 63.1385C256.46 63.2121 256.357 63.2857 256.251 63.3612C255.772 63.7072 255.297 64.0612 254.827 64.4331C254.784 64.4669 254.74 64.5047 254.696 64.5385C254.217 64.9203 253.744 65.316 253.274 65.7237C253.247 65.7475 253.219 65.7714 253.191 65.7953C252.69 66.2348 252.197 66.6882 251.707 67.1575L251.664 67.1992C250.743 68.0861 249.844 69.0248 248.969 70.0191C248.897 70.0986 248.828 70.1801 248.756 70.2617C247.955 71.1824 247.175 72.1488 246.412 73.1591C246.344 73.2485 246.275 73.34 246.207 73.4315C245.841 73.9227 245.477 74.4218 245.121 74.9349C245.109 74.9528 245.095 74.9707 245.081 74.9886C244.089 76.4164 242.331 76.5337 241.114 75.7601C240.343 75.269 239.786 74.4218 239.786 73.3181V61.2056C239.786 60.7582 239.581 60.3644 239.265 60.0979C239.012 59.8812 238.688 59.746 238.332 59.746H209.764C208.962 59.746 208.302 60.4062 208.302 61.2076V209.841C208.302 210.348 208.559 210.79 208.947 211.052L208.951 211.048Z"
+      />
+      <path
+        d="M329.396 205.412C340.651 212.12 353.844 215.53 368.609 215.53C381.213 215.53 392.721 212.872 402.799 207.636C412.887 202.4 421.014 195.072 426.962 185.857C432.097 177.89 435.275 168.959 436.42 159.257C436.603 157.756 436.724 156.232 436.806 154.691L436.836 153.92C436.865 153.098 436.197 152.418 435.374 152.418H405.955C405.173 152.418 404.533 153.027 404.493 153.798L404.463 154.498C404.342 156.032 404.169 157.523 403.914 158.985C402.636 166.8 399.611 173.517 394.902 179.028C389.392 185.451 380.542 188.708 368.607 188.708C354.42 188.708 343.795 183.633 337.026 173.617C330.135 163.417 326.643 150.561 326.643 135.378C326.643 120.195 330.135 107.277 337.036 96.9861C343.805 86.8781 354.43 81.7534 368.607 81.7534C380.338 81.7534 389.085 85.0625 394.596 91.5771C394.94 91.9828 395.276 92.3984 395.61 92.816C395.62 92.8359 395.63 92.8558 395.65 92.8777C395.974 93.2833 396.29 93.699 396.582 94.1245C396.907 94.56 397.211 94.9975 397.505 95.4449C397.799 95.8924 398.084 96.3378 398.368 96.7952C398.633 97.2208 398.885 97.6483 399.13 98.0838C399.16 98.1236 399.18 98.1753 399.211 98.225C399.456 98.6724 399.699 99.1278 399.931 99.5753C400.154 100.001 400.367 100.438 400.57 100.884C400.753 101.26 400.926 101.635 401.077 102.021C401.178 102.234 401.27 102.459 401.361 102.691C401.797 103.735 402.192 104.803 402.538 105.899C402.64 106.223 402.741 106.549 402.833 106.873C402.954 107.259 403.055 107.645 403.157 108.031C403.248 108.397 403.35 108.763 403.431 109.126C403.543 109.564 403.634 109.999 403.725 110.445C404.05 111.968 404.294 113.541 404.457 115.134L404.507 115.784C404.559 116.546 405.187 117.145 405.959 117.145H435.4C436.243 117.145 436.911 116.425 436.852 115.581L436.8 114.83C436.637 113.227 436.414 111.654 436.162 110.101C436.06 109.482 435.949 108.864 435.827 108.254C435.452 106.295 434.994 104.376 434.467 102.499C434.447 102.427 434.427 102.367 434.406 102.296C434.254 101.747 434.091 101.2 433.918 100.651C433.797 100.255 433.676 99.8596 433.533 99.4639C433.379 98.9767 433.208 98.4895 433.035 98.0023C432.843 97.4534 432.64 96.9066 432.427 96.3577C432.001 95.2719 431.554 94.1961 431.077 93.1402C430.914 92.7643 430.743 92.3984 430.57 92.0345C430.468 91.8018 430.357 91.5771 430.245 91.3544C430.114 91.08 429.981 90.8055 429.84 90.5331C429.657 90.1672 429.464 89.7914 429.271 89.4274C429.209 89.2962 429.14 89.1729 429.078 89.0615C428.855 88.636 428.621 88.2084 428.368 87.7829C427.648 86.4943 426.887 85.2355 426.075 84.0085C420.129 74.9962 412.092 67.8631 402.196 62.818C392.323 57.7849 380.924 55.2275 368.311 55.2275C353.545 55.2275 340.393 58.638 329.239 65.3455C318.065 72.0749 309.297 81.6341 303.188 93.7705C297.089 105.867 293.993 119.871 293.993 135.378C293.993 150.885 297.089 164.889 303.188 176.985C309.307 189.122 318.116 198.693 329.39 205.41L329.396 205.412Z"
+      />
+      <path
+        d="M481.457 209.843V118.622C481.457 107.828 484.978 99.066 491.923 92.5812C498.899 86.0725 508.42 82.7714 520.218 82.7714C530.02 82.7714 537.342 85.5395 541.985 91.0002C546.687 96.5325 549.071 104.451 549.071 114.539V209.841C549.071 210.646 549.723 211.298 550.528 211.298H579.091C579.896 211.298 580.548 210.646 580.548 209.841V106.67C580.548 90 575.732 77.1357 566.23 68.4356C556.765 59.7673 544.422 55.3745 529.543 55.3745C517.506 55.3745 507.173 57.6395 498.835 62.1059C494.074 64.6553 489.898 67.6084 486.337 70.9333C484.479 72.6674 481.455 71.335 481.455 68.7936V1.45764C481.455 0.65226 480.802 0 479.997 0H451.435C450.629 0 449.977 0.65226 449.977 1.45764V209.841C449.977 210.646 450.629 211.298 451.435 211.298H479.997C480.802 211.298 481.455 210.646 481.455 209.841L481.457 209.843Z"
+      />
+      <path
+        d="M722.056 75.9603C709.482 62.1077 691.61 55.0859 668.95 55.0859C653.799 55.0859 640.414 58.4864 629.149 65.2039C617.883 71.9234 609.115 81.4408 603.088 93.4878C597.09 105.483 594.046 119.528 594.046 135.238C594.046 150.948 596.989 164.68 602.794 176.675C608.618 188.722 617.287 198.343 628.55 205.263C639.806 212.173 653.404 215.675 668.95 215.675C687.858 215.675 703.363 210.956 715.034 201.66C726.683 192.373 734.793 179.87 739.136 164.487L739.42 163.26C739.633 162.347 738.933 161.474 737.998 161.474H708.832C708.142 161.474 707.543 161.961 707.4 162.641L707.177 163.717C705.513 170.009 701.595 175.945 695.516 181.366C689.509 186.725 680.771 189.444 669.537 189.444C656.06 189.444 645.507 184.957 638.159 176.128C631.998 168.718 628.224 159.8 626.905 149.55C626.559 146.911 628.58 144.567 631.239 144.567H739.094C739.876 144.567 740.516 143.958 740.556 143.187L740.637 141.654C740.84 140.031 740.942 137.971 740.942 132.317C740.942 108.742 734.588 89.785 722.056 75.9622V75.9603ZM706.744 119.202H628.144C627.281 119.202 626.591 118.441 626.693 117.578C627.951 107.217 632.102 98.672 639.054 92.1454C646.706 84.9606 656.468 81.3175 668.077 81.3175C679.687 81.3175 689.857 85.0422 697.214 92.4C703.912 99.1075 707.607 107.593 708.205 117.669C708.257 118.502 707.577 119.202 706.744 119.202Z"
+      />
+      <path
+        d="M534.055 246.23C518.904 246.23 505.519 249.631 494.253 256.348C482.99 263.068 474.22 272.585 468.193 284.632C462.195 296.628 459.15 310.673 459.15 326.383C459.15 342.093 462.094 355.824 467.898 367.819C473.723 379.866 482.389 389.487 493.655 396.407C504.91 403.318 518.508 406.82 534.055 406.82C552.961 406.82 568.468 402.101 580.139 392.804C591.79 383.517 599.897 371.015 604.241 355.631L604.525 354.404C604.738 353.491 604.038 352.618 603.105 352.618H573.938C573.238 352.618 572.65 353.106 572.508 353.786L572.286 354.862C570.621 361.154 566.694 367.09 560.625 372.51C554.617 377.868 545.879 380.588 534.646 380.588C521.169 380.588 510.613 376.102 503.265 367.272C497.105 359.863 493.33 350.944 492.01 340.695C491.666 338.056 493.684 335.711 496.343 335.711H604.201C604.982 335.711 605.621 335.103 605.662 334.331L605.744 332.798C605.947 331.175 606.048 329.115 606.048 323.462C606.048 299.887 599.685 280.93 587.162 267.107C574.589 253.254 556.717 246.232 534.057 246.232L534.055 246.23ZM571.848 310.349H493.249C492.386 310.349 491.686 309.587 491.797 308.724C493.056 298.364 497.206 289.819 504.158 283.292C511.81 276.107 521.572 272.464 533.182 272.464C544.791 272.464 554.949 276.189 562.317 283.547C569.014 290.254 572.709 298.739 573.308 308.816C573.358 309.649 572.679 310.349 571.846 310.349H571.848Z"
+      />
+      <path
+        d="M292.614 250.899H262.594C261.976 250.899 261.427 251.285 261.224 251.864L224.111 355.196C223.198 357.743 219.615 357.783 218.65 355.257L193.087 288.339L179.853 253.713C179.203 252.019 177.58 250.901 175.762 250.901H118.922C117.31 250.901 115.999 249.593 115.999 247.978V204.553C115.999 203.752 115.349 203.102 114.547 203.102H85.9791C85.1777 203.102 84.5175 203.752 84.5175 204.553V247.978C84.5175 249.591 83.219 250.901 81.6042 250.901H64.4128C63.6114 250.901 62.9512 251.552 62.9512 252.353V275.958C62.9512 276.769 63.6114 277.419 64.4128 277.419H83.0658C83.8672 277.419 84.5175 278.07 84.5175 278.881V359.012C84.5175 375.686 87.9478 387.498 94.717 394.156C101.476 400.824 111.777 404.193 125.314 404.193C131.615 404.193 135.969 403.98 141.865 402.812L143.692 402.427C144.362 402.284 144.84 401.685 144.84 400.995V377.969C144.84 377.066 144.028 376.376 143.145 376.527L141.654 376.782C137.291 377.543 134.744 377.685 131.15 377.685C125.375 377.685 121.388 376.517 119.256 374.214C117.095 371.88 115.999 367.069 115.999 359.895V281.792C115.999 279.378 117.958 277.419 120.372 277.419H153.283C154.46 277.419 155.536 278.139 155.984 279.237L164.205 299.391L204.798 398.907C204.991 399.384 205.021 399.921 204.889 400.418C202.26 410.089 198.385 417.001 193.342 420.978C188.096 425.119 182.279 427.209 176.039 427.209C172.984 427.209 168.924 426.924 163.962 426.355L163.139 426.264C162.276 426.173 161.526 426.843 161.526 427.716V450.996C161.526 451.716 162.053 452.325 162.765 452.438L163.505 452.559C170.578 453.929 176.85 454.609 182.146 454.609C194.131 454.609 204.311 450.865 212.428 443.455C220.414 436.139 228.047 423.2 235.1 405.024L293.971 252.88C294.346 251.926 293.634 250.901 292.61 250.901L292.614 250.899Z"
+      />
+      <path
+        d="M417.491 256.368V256.358C407.19 249.833 395.459 246.524 382.611 246.524C366.658 246.524 353.241 251.508 342.606 261.361C340.749 263.085 337.724 261.747 337.724 259.22V252.349C337.724 251.548 337.074 250.887 336.272 250.887H307.704C306.903 250.887 306.243 251.548 306.243 252.349V452.577C306.243 453.378 306.903 454.029 307.704 454.029H336.272C337.074 454.029 337.724 453.38 337.724 452.577V390.246C337.724 388.906 339.359 388.298 340.272 389.272C344.149 393.484 348.817 397.107 354.216 400.08C361.979 404.363 371.538 406.525 382.611 406.525C395.449 406.525 407.18 403.268 417.481 396.833C427.772 390.399 435.993 381.031 441.919 368.986C447.815 357.001 450.81 342.763 450.81 326.667C450.81 310.571 447.815 296.345 441.919 284.35C435.993 272.315 427.782 262.897 417.493 256.37L417.491 256.368ZM407.484 364.906C400.614 375.065 390.953 380.007 377.944 380.007C365.664 380.007 355.86 375.248 348.797 365.87C341.652 356.361 338.018 343.178 338.018 326.667C338.018 310.156 341.652 296.983 348.797 287.474C355.86 278.095 365.664 273.337 377.944 273.337C390.953 273.337 400.616 278.268 407.484 288.428C414.375 298.638 417.877 311.496 417.877 326.667C417.877 341.838 414.375 354.708 407.484 364.906Z"
+      />
+    </g>
+  {:else}
+    <path
+      d="M105.615 1.57812C105.722 1.57812 105.808 1.66398 105.808 1.77051V7.50879C105.808 7.66785 105.906 7.80434 106.045 7.86328C106.09 7.8821 106.14 7.89253 106.192 7.89258H113.744C113.843 7.89258 113.937 7.91818 114.02 7.96289C114.141 8.02708 114.238 8.13281 114.29 8.26562L116.048 12.8408L119.444 21.6826C119.475 21.7628 119.526 21.8231 119.587 21.8643C119.595 21.8697 119.603 21.8742 119.612 21.8789C119.637 21.8931 119.663 21.9049 119.69 21.9131C119.873 21.9666 120.091 21.8866 120.167 21.6738L125.096 8.01855C125.125 7.9418 125.197 7.8916 125.279 7.8916H129.266L129.268 7.89258C129.337 7.89261 129.394 7.92787 129.428 7.97852C129.462 8.02824 129.473 8.09345 129.448 8.15625H129.454L121.633 28.2607C120.696 30.6621 119.683 32.3727 118.621 33.3389C117.542 34.3182 116.19 34.8125 114.597 34.8125C114.39 34.8125 114.173 34.8027 113.944 34.7871C113.813 34.7782 113.679 34.7669 113.542 34.7529C113.102 34.7081 112.627 34.639 112.122 34.542L112.023 34.5254L112.022 34.5244H112.017C111.924 34.5096 111.853 34.4292 111.853 34.333V31.2559C111.853 31.1419 111.953 31.0511 112.068 31.0645L112.176 31.0762C112.617 31.1266 113.004 31.1598 113.334 31.1768C113.497 31.185 113.647 31.1894 113.782 31.1895C114.609 31.189 115.382 30.9116 116.079 30.3662C116.748 29.841 117.265 28.9285 117.613 27.6504C117.631 27.5838 117.627 27.5119 117.601 27.4482L111.117 11.6367C111.088 11.5654 111.039 11.5056 110.978 11.4639C110.916 11.4225 110.841 11.3994 110.763 11.3994H106.391C106.07 11.3997 105.81 11.6591 105.81 11.9785V22.2979C105.81 23.2461 105.956 23.8811 106.243 24.1904C106.278 24.2286 106.318 24.2644 106.361 24.2979L106.496 24.3877C106.8 24.5595 107.243 24.6465 107.818 24.6465C108.294 24.6465 108.633 24.6275 109.214 24.5283L109.411 24.4941C109.447 24.4878 109.483 24.4926 109.514 24.5049C109.587 24.5319 109.64 24.6021 109.64 24.6865V27.7285C109.64 27.8201 109.576 27.8986 109.489 27.918L109.246 27.9678C108.462 28.1216 107.885 28.1504 107.048 28.1504C105.88 28.1504 104.894 27.9608 104.099 27.5879C103.994 27.5384 103.891 27.4857 103.793 27.4297C103.771 27.4171 103.748 27.4055 103.726 27.3926C103.449 27.229 103.2 27.0395 102.979 26.8232C102.081 25.9429 101.626 24.3813 101.626 22.1797V11.5908C101.626 11.4975 101.56 11.4201 101.471 11.4023L101.432 11.3984H98.9547C98.8477 11.3984 98.7615 11.3125 98.7614 11.2061V8.08691C98.7614 8.07827 98.7632 8.06986 98.7643 8.06152C98.7654 8.05289 98.766 8.04437 98.7682 8.03613C98.7754 8.00967 98.7903 7.98738 98.8073 7.9668C98.843 7.9232 98.8949 7.89272 98.9557 7.89258H101.239C101.329 7.89258 101.412 7.86108 101.477 7.80957C101.566 7.73895 101.625 7.63142 101.625 7.50977V1.77051C101.625 1.66398 101.711 1.57812 101.818 1.57812H105.615ZM141.352 7.32031C143.058 7.32034 144.617 7.75709 145.985 8.62109C147.352 9.48369 148.444 10.7278 149.231 12.3184H149.228C150.012 13.903 150.409 15.784 150.409 17.9102C150.409 20.0361 150.012 21.918 149.228 23.501C148.441 25.093 147.349 26.3299 145.982 27.1807C144.614 28.0314 143.055 28.4619 141.35 28.4619C139.88 28.4619 138.609 28.1754 137.579 27.6104C136.862 27.2183 136.241 26.738 135.726 26.1816C135.606 26.0536 135.39 26.1334 135.389 26.3105V34.5479C135.389 34.6542 135.303 34.7401 135.196 34.7402H131.401L131.362 34.7363C131.274 34.7184 131.207 34.6409 131.207 34.5479V8.08984C131.207 7.98339 131.294 7.89564 131.401 7.89551H135.196C135.303 7.89567 135.389 7.98341 135.389 8.08984V8.99805C135.389 9.3309 135.791 9.50893 136.038 9.28125C137.451 7.97921 139.233 7.32031 141.352 7.32031ZM88.8688 7.2793C91.8792 7.27937 94.2532 8.20693 95.9235 10.0371H95.9215C97.5874 11.8644 98.4313 14.3698 98.4313 17.4844C98.4313 18.231 98.418 18.5033 98.3913 18.7178L98.3805 18.9209C98.3745 19.0229 98.2893 19.1025 98.1852 19.1025H83.859C83.5067 19.1025 83.237 19.4117 83.2829 19.7607C83.4584 21.116 83.96 22.294 84.778 23.2734C85.7537 24.4394 87.1551 25.0332 88.946 25.0332C90.4377 25.0332 91.5974 24.6744 92.3962 23.9658C93.2038 23.2497 93.7234 22.4653 93.945 21.6338L93.9743 21.4922C93.9936 21.4036 94.0727 21.3381 94.1647 21.3379H98.0397C98.163 21.3379 98.2571 21.4521 98.2292 21.5732L98.1911 21.7363C97.614 23.7692 96.5358 25.4219 94.9889 26.6484C93.4376 27.8779 91.379 28.501 88.8669 28.501C86.8025 28.501 84.9954 28.0378 83.5006 27.125C82.0044 26.2107 80.8532 24.9396 80.0797 23.3477C79.3093 21.7616 78.9177 19.9478 78.9176 17.8721C78.9176 15.7962 79.3226 13.9391 80.1198 12.3545C80.92 10.7625 82.0845 9.50493 83.5807 8.61719C85.0771 7.72944 86.8563 7.2793 88.8688 7.2793ZM161.463 7.2793C164.473 7.27936 166.847 8.20692 168.517 10.0371H168.515C170.18 11.8644 171.025 14.3698 171.025 17.4844C171.025 18.231 171.012 18.5033 170.985 18.7178L170.974 18.9209C170.968 19.0229 170.883 19.1025 170.779 19.1025H156.453C156.1 19.1025 155.831 19.4117 155.877 19.7607C156.052 21.116 156.554 22.294 157.372 23.2734C158.347 24.4394 159.749 25.0332 161.54 25.0332C163.031 25.0332 164.191 24.6744 164.99 23.9658C165.796 23.2497 166.317 22.4653 166.539 21.6338L166.569 21.4922C166.588 21.4036 166.665 21.3381 166.758 21.3379H170.633C170.757 21.3379 170.851 21.4521 170.823 21.5732L170.786 21.7363C170.209 23.7693 169.131 25.4219 167.583 26.6484C166.031 27.8779 163.971 28.501 161.461 28.501C159.396 28.501 157.589 28.0378 156.094 27.125C154.598 26.2107 153.447 24.9396 152.673 23.3477C151.903 21.7616 151.511 19.9478 151.511 17.8721C151.511 15.7962 151.916 13.9391 152.714 12.3545C153.514 10.7625 154.678 9.50493 156.174 8.61719C157.671 7.72944 159.45 7.2793 161.463 7.2793ZM48.9274 7.29297C50.6036 7.29297 52.1165 7.63016 53.4284 8.2959C54.7433 8.96171 55.8099 9.90612 56.6012 11.0957C56.7097 11.2583 56.8093 11.4238 56.9059 11.5938C56.9401 11.6499 56.9714 11.7065 56.9997 11.7627L57.1012 11.958C57.1206 11.9935 57.1371 12.0309 57.1549 12.0664C57.1697 12.0959 57.1846 12.1253 57.1979 12.1562C57.2202 12.205 57.2435 12.2525 57.2643 12.3027C57.3283 12.4418 57.387 12.584 57.445 12.7275C57.4732 12.8 57.4998 12.8729 57.5251 12.9453C57.5473 13.0103 57.5712 13.0737 57.5905 13.1387C57.6098 13.1905 57.6264 13.2441 57.6413 13.2959C57.6635 13.3682 57.6859 13.4404 57.7067 13.5127C57.7097 13.5216 57.7121 13.5312 57.7135 13.54C57.7834 13.7884 57.8451 14.0411 57.8942 14.2998C57.9105 14.3795 57.9248 14.4627 57.9381 14.5439C57.9724 14.7496 58.0023 14.9574 58.0231 15.1689L58.0309 15.2676C58.0384 15.3784 57.9504 15.4744 57.8376 15.4746H53.9264C53.824 15.4744 53.7405 15.3964 53.7331 15.2959L53.7262 15.21C53.7039 14.9999 53.6727 14.791 53.6296 14.5898L53.6286 14.5889L53.6276 14.5898C53.6158 14.531 53.6043 14.4734 53.5895 14.416C53.5791 14.3672 53.5653 14.3193 53.5534 14.2705C53.54 14.2203 53.5268 14.1684 53.5104 14.1182C53.4985 14.0753 53.4847 14.0321 53.4714 13.9893C53.4253 13.8444 53.3731 13.7039 53.3151 13.5664C53.3047 13.5369 53.2914 13.5071 53.278 13.4775C53.2573 13.4274 53.2353 13.3772 53.2116 13.3271C53.1848 13.268 53.1564 13.2095 53.1266 13.1533C53.0954 13.0927 53.0636 13.0337 53.0309 12.9746C53.0265 12.9673 53.0241 12.9609 53.0212 12.9551C52.9885 12.8974 52.9553 12.8413 52.9196 12.7852C52.884 12.7246 52.8454 12.6655 52.8053 12.6064C52.7667 12.5473 52.7264 12.4893 52.6833 12.4316L52.5544 12.2598C52.5097 12.205 52.4647 12.1504 52.4186 12.0957C51.6868 11.2346 50.5252 10.7979 48.9665 10.7979C47.0841 10.7982 45.6728 11.4763 44.7731 12.8105C43.857 14.1702 43.3932 15.8776 43.3932 17.8838C43.3932 19.8901 43.8574 21.5886 44.7721 22.9365C45.6718 24.2604 47.0811 24.9294 48.9665 24.9297C50.5519 24.9297 51.7269 24.5006 52.4587 23.6514C53.0848 22.9234 53.4863 22.0356 53.6559 21.0029C53.6901 20.8091 53.7128 20.6119 53.7292 20.4092L53.7331 20.3164C53.739 20.2143 53.8243 20.1348 53.9284 20.1348H57.8376C57.946 20.135 58.0349 20.2251 58.0319 20.333L58.029 20.3369L58.0251 20.4395C58.0146 20.6435 57.9981 20.8448 57.9743 21.043C57.8226 22.3241 57.4001 23.5048 56.7174 24.5566C55.9276 25.7743 54.8476 26.7421 53.5075 27.4346C52.1689 28.127 50.6397 28.4775 48.9665 28.4775C47.0047 28.4775 45.2523 28.0268 43.7575 27.1406C42.2598 26.2529 41.0891 24.9875 40.277 23.3838C39.4664 21.7859 39.0554 19.9348 39.0553 17.8857C39.0553 15.8365 39.4664 13.9847 40.277 12.3867C41.0891 10.7831 42.2538 9.52 43.738 8.63086C45.2194 7.74462 46.9671 7.293 48.9274 7.29297ZM15.0993 0C15.1793 0.000152967 15.2516 0.0488926 15.2799 0.124023L25.6569 27.6611H25.6549C25.7024 27.7868 25.6086 27.9209 25.4733 27.9209H20.8288C20.7455 27.9209 20.672 27.8694 20.6452 27.791L18.4499 21.4277C18.4231 21.3494 18.3505 21.2969 18.2672 21.2969H7.24576C7.16247 21.2969 7.08894 21.3493 7.06217 21.4277L4.86686 27.791C4.8401 27.8694 4.76746 27.9208 4.68424 27.9209H0.194007C0.0601917 27.9209 -0.0351022 27.7869 0.0123662 27.6611L10.3112 0.125977C10.3395 0.0505177 10.4125 0 10.4928 0H15.0993ZM37.0407 7.43164C37.551 7.43168 38.4924 7.51575 38.8805 7.55273C38.9785 7.56173 39.0543 7.64616 39.0544 7.74512V11.3672C39.0544 11.4824 38.9534 11.5745 38.8376 11.5586C38.4986 11.5157 37.8531 11.4366 37.5837 11.4365C35.9178 11.4365 34.5325 12.0126 33.4645 13.1475C32.3952 14.2852 31.8523 15.7705 31.8522 17.5605V27.7275C31.852 27.8339 31.7658 27.9209 31.6589 27.9209H27.8649C27.8104 27.9209 27.7607 27.8984 27.7253 27.8623C27.7119 27.8489 27.7029 27.8323 27.694 27.8154C27.6859 27.7999 27.6772 27.7844 27.6735 27.7666C27.6709 27.754 27.6696 27.7409 27.6696 27.7275V8.08594C27.6696 8.01093 27.7133 7.94776 27.776 7.91602C27.8029 7.90203 27.8326 7.8916 27.8649 7.8916H31.6589C31.7659 7.8916 31.8522 7.97941 31.8522 8.08594V9.68457C31.8522 9.9422 32.0797 10.0953 32.2926 10.0684C32.3474 10.0612 32.4003 10.0412 32.4489 10.0088C32.4577 10.003 32.4668 9.99784 32.4753 9.99121C32.504 9.96829 32.531 9.94069 32.5544 9.90723C32.5829 9.86636 32.6133 9.82697 32.6422 9.78711C32.6738 9.74369 32.7049 9.70043 32.737 9.6582C32.7673 9.61826 32.798 9.57892 32.8288 9.54004C32.872 9.48541 32.9164 9.43241 32.9606 9.37988C32.9847 9.35129 33.0076 9.32191 33.0319 9.29395C33.0629 9.25836 33.0951 9.22403 33.1266 9.18945C33.2719 9.02959 33.4213 8.88034 33.5758 8.74219C33.6091 8.71235 33.6427 8.68312 33.6764 8.6543C33.7146 8.62176 33.753 8.58984 33.7917 8.55859C33.8357 8.52297 33.8807 8.48902 33.9255 8.45508C33.9604 8.42863 33.9946 8.4014 34.0299 8.37598C34.0913 8.33181 34.1538 8.2901 34.2165 8.24902C34.2349 8.23694 34.2526 8.22373 34.2712 8.21191C34.3552 8.15831 34.4406 8.10766 34.527 8.05957C34.5438 8.05022 34.5609 8.04137 34.5778 8.03223C34.6508 7.9927 34.7248 7.95556 34.7995 7.91992C34.8254 7.90756 34.8515 7.89568 34.8776 7.88379C34.9395 7.85558 35.0021 7.82928 35.0651 7.80371C35.0938 7.79207 35.1221 7.77965 35.151 7.76855C35.2229 7.74098 35.2956 7.71559 35.3688 7.69141C35.39 7.6844 35.411 7.67664 35.4323 7.66992C35.5275 7.63991 35.6238 7.61223 35.7214 7.58789C35.7301 7.58571 35.739 7.58417 35.7477 7.58203C35.8389 7.55981 35.9309 7.53975 36.0241 7.52246C36.0416 7.51921 36.0592 7.51675 36.0768 7.51367C36.1587 7.49934 36.2414 7.48711 36.3249 7.47656C36.3518 7.47315 36.3788 7.46981 36.4059 7.4668C36.4786 7.45872 36.5518 7.4525 36.6256 7.44727C36.662 7.44469 36.6984 7.44134 36.735 7.43945C36.8357 7.43425 36.9379 7.43164 37.0407 7.43164ZM63.7604 0C63.8675 0 63.9538 0.0858526 63.9538 0.192383V9.08887C63.9538 9.42453 64.3553 9.60079 64.6022 9.37207C65.0751 8.93271 65.6304 8.54336 66.2624 8.20605C67.369 7.6157 68.7425 7.31641 70.3415 7.31641L70.7077 7.32324C72.5199 7.39134 74.0353 7.96955 75.2135 9.04297L75.2155 9.04004L75.445 9.2627C76.5555 10.4047 77.1178 12.0277 77.1178 14.0928V27.7256C77.1178 27.8321 77.0315 27.9179 76.9245 27.918H73.1296C73.0227 27.9177 72.9362 27.832 72.9362 27.7256V15.1328C72.9361 13.7999 72.6194 12.7543 71.9948 12.0234C71.3775 11.3014 70.4047 10.9355 69.1032 10.9355C67.5359 10.9356 66.2719 11.3721 65.3454 12.2314C64.4218 13.0895 63.9539 14.2467 63.9538 15.6729V27.7275C63.9537 27.834 63.8675 27.9199 63.7604 27.9199H59.9665L59.9274 27.916C59.8391 27.8982 59.7732 27.8207 59.7731 27.7275V0.192383C59.7731 0.0858526 59.8594 0 59.9665 0H63.7604ZM140.733 10.8643C139.102 10.8643 137.8 11.4943 136.862 12.7324C135.913 13.9886 135.43 15.7303 135.43 17.9111C135.43 20.092 135.913 21.8347 136.862 23.0908C137.8 24.3292 139.101 24.9579 140.733 24.958C142.461 24.958 143.744 24.3046 144.657 22.9629V22.9639C145.572 21.616 146.038 19.916 146.038 17.9111C146.038 15.9063 145.572 14.2078 144.657 12.8584C143.802 11.599 142.621 10.9476 141.052 10.8711L140.733 10.8643ZM181.645 1.14844C186.251 1.1486 190 4.87842 190 9.45898C190 14.0397 186.252 17.7684 181.645 17.7686C177.039 17.7686 173.29 14.0413 173.29 9.45898C173.29 4.87684 177.039 1.14844 181.645 1.14844ZM13.3307 6.25098C13.1537 5.72451 12.4074 5.72615 12.2301 6.25098L9.40397 14.6846L8.77116 16.5703C8.64665 16.9444 8.92614 17.3298 9.32291 17.3301H16.2682V17.332C16.6651 17.3319 16.9442 16.9445 16.818 16.5703L13.3307 6.25098ZM181.645 2.08691C177.559 2.08691 174.235 5.39358 174.235 9.45801C174.235 13.5223 177.559 16.8291 181.645 16.8291C185.731 16.8289 189.055 13.5222 189.055 9.45801C189.055 5.39368 185.731 2.08707 181.645 2.08691ZM88.7526 10.7461C87.2102 10.7461 85.913 11.2269 84.8971 12.1768C83.9735 13.0394 83.4211 14.1685 83.2546 15.5371C83.2414 15.6508 83.3337 15.7507 83.4479 15.751H93.8903L93.8883 15.7529C93.9999 15.7529 94.0911 15.6593 94.0837 15.5498C94.0033 14.2184 93.512 13.0971 92.6227 12.2109C91.7066 11.2997 90.4625 10.8097 89.0397 10.752L88.7526 10.7461ZM161.347 10.7461C159.805 10.7462 158.508 11.2269 157.492 12.1768C156.568 13.0393 156.017 14.1686 155.85 15.5371C155.836 15.6509 155.929 15.751 156.044 15.751H166.484V15.7529C166.595 15.7528 166.686 15.6592 166.678 15.5498C166.598 14.2185 166.108 13.0971 165.218 12.2109C164.301 11.2996 163.057 10.8096 161.634 10.752L161.347 10.7461ZM181.007 5.69531C181.028 5.69549 181.044 5.70863 181.051 5.72754L183.649 12.6182C183.661 12.6492 183.638 12.6835 183.604 12.6836H182.441L182.413 12.6748C182.405 12.6693 182.399 12.6607 182.395 12.6504L181.846 11.0586C181.839 11.0379 181.82 11.0244 181.799 11.0244H179.043L179.014 11.0342C179.006 11.0401 178.999 11.0483 178.996 11.0586L178.447 12.6504C178.439 12.6711 178.422 12.6836 178.401 12.6836H177.277L177.254 12.6777C177.233 12.6667 177.223 12.6415 177.232 12.6182L179.808 5.72754C179.816 5.70851 179.834 5.69538 179.854 5.69531H181.007ZM185.186 5.69531C185.213 5.69531 185.236 5.71717 185.236 5.74414V12.6328C185.236 12.6598 185.213 12.6816 185.186 12.6816H184.051C184.024 12.6815 184.003 12.6597 184.003 12.6328V5.74414C184.003 5.71729 184.024 5.6955 184.051 5.69531H185.186ZM180.565 7.25879C180.52 7.12618 180.334 7.12753 180.29 7.25879L179.424 9.84082C179.393 9.93548 179.463 10.0322 179.561 10.0322H181.3L181.301 10.0332C181.4 10.0332 181.469 9.93596 181.438 9.84277L180.565 7.25879Z"
+      fill="currentColor"
+      shape-rendering="crispEdges"
+    />
+  {/if}
 </svg>

package/dist/primitives/logo/types.d.ts

@@ -1,25 +1,39 @@
 import type { SVGAttributes } from 'svelte/elements';
 import { type VariantProps } from 'tailwind-variants';
 export declare const logoVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        compact: string;
+    };
     size: {
         sm: string;
         default: string;
         lg: string;
     };
 }, undefined, "text-foreground shrink-0 antialiased", {
+    variant: {
+        default: string;
+        compact: string;
+    };
     size: {
         sm: string;
         default: string;
         lg: string;
     };
 }, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        compact: string;
+    };
     size: {
         sm: string;
         default: string;
         lg: string;
     };
 }, undefined, "text-foreground shrink-0 antialiased", unknown, unknown, undefined>>;
+export type LogoVariant = VariantProps<typeof logoVariants>['variant'];
 export type LogoSize = VariantProps<typeof logoVariants>['size'];
 export type LogoProps = Omit<SVGAttributes<SVGSVGElement>, 'children'> & {
+    variant?: LogoVariant;
     size?: LogoSize;
 };

package/dist/primitives/logo/types.js

@@ -2,6 +2,10 @@ import { tv } from 'tailwind-variants';
 export const logoVariants = tv({
     base: 'text-foreground shrink-0 antialiased',
     variants: {
+        variant: {
+            default: '',
+            compact: ''
+        },
         size: {
             sm: 'h-4 w-auto',
             default: 'h-6 w-auto',
@@ -9,6 +13,7 @@ export const logoVariants = tv({
         }
     },
     defaultVariants: {
+        variant: 'default',
         size: 'default'
     }
 });

package/dist/primitives/logo/usage.json

@@ -1,6 +1,8 @@
 {
   "description": "Archetype AI brand logo mark.",
   "usage": [
-    "Headers: `<Logo class=\"h-6 w-auto\" />` next to the app title; sizes sm | default | lg."
+    "Headers: `<Logo class=\"h-6 w-auto\" />` next to the app title; sizes sm | default | lg.",
+    "Compact lockup: `variant=\"compact\"` is the stacked social/avatar artwork (~1.6:1 instead of the wordmark's ~5.4:1). Use it where a horizontal wordmark will not fit — square tiles, avatars, narrow sidebars, splash marks. Defaults to `variant=\"default\"`.",
+    "Sizing is shared: both variants honour size sm | default | lg (h-4 | h-6 | h-8) and take their width from the artwork aspect, so compact renders far narrower at the same height. Prefer default or lg for compact."
   ]
 }

package/dist/primitives/video-player/index.d.ts

@@ -1,4 +1,4 @@
 import Root from './video-player.svelte';
-export { videoPlayerVariants, videoPlayerOverlayVariants, videoPlayerControlsVariants, type VideoPlayerProps } from './types.js';
+export { videoPlayerVariants, videoPlayerOverlayVariants, videoPlayerControlsVariants, videoPlayerMarkerTrackVariants, videoPlayerMarkerVariants, videoPlayerMarkerCaptionVariants, videoPlayerHighlightVariants, type VideoPlayerProps, type VideoPlayerMarker, type VideoPlayerHighlight } from './types.js';
 export { Root, Root as VideoPlayer };
 export default Root;

package/dist/primitives/video-player/index.js

@@ -1,5 +1,5 @@
 import Root from './video-player.svelte';
-export { videoPlayerVariants, videoPlayerOverlayVariants, videoPlayerControlsVariants } from './types.js';
+export { videoPlayerVariants, videoPlayerOverlayVariants, videoPlayerControlsVariants, videoPlayerMarkerTrackVariants, videoPlayerMarkerVariants, videoPlayerMarkerCaptionVariants, videoPlayerHighlightVariants } from './types.js';
 export { Root, 
 //
 Root as VideoPlayer };

package/dist/primitives/video-player/types.d.ts

@@ -33,6 +33,67 @@ export declare const videoPlayerControlsVariants: import("tailwind-variants").TV
         false: string;
     };
 }, undefined, "bg-card/20 absolute inset-x-0 bottom-0 flex items-center justify-between gap-4 px-3 py-1.5 backdrop-blur-xs transition-opacity duration-300", unknown, unknown, undefined>>;
+export declare const videoPlayerMarkerTrackVariants: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "text-foreground pointer-events-none absolute inset-0 z-10", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "text-foreground pointer-events-none absolute inset-0 z-10", unknown, unknown, undefined>>;
+export declare const videoPlayerMarkerVariants: import("tailwind-variants").TVReturnType<{
+    expanded: {
+        true: string;
+        false: string;
+    };
+    filled: {
+        true: string;
+        false: string;
+    };
+    emphasis: {
+        hidden: string;
+        full: string;
+        ambient: string;
+    };
+}, undefined, "pointer-events-auto absolute cursor-pointer rounded-full border-current transition-all duration-200 ease-out focus-visible:ring-ring/50 focus-visible:ring-2 focus-visible:outline-hidden", {
+    expanded: {
+        true: string;
+        false: string;
+    };
+    filled: {
+        true: string;
+        false: string;
+    };
+    emphasis: {
+        hidden: string;
+        full: string;
+        ambient: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    expanded: {
+        true: string;
+        false: string;
+    };
+    filled: {
+        true: string;
+        false: string;
+    };
+    emphasis: {
+        hidden: string;
+        full: string;
+        ambient: string;
+    };
+}, undefined, "pointer-events-auto absolute cursor-pointer rounded-full border-current transition-all duration-200 ease-out focus-visible:ring-ring/50 focus-visible:ring-2 focus-visible:outline-hidden", unknown, unknown, undefined>>;
+export declare const videoPlayerMarkerCaptionVariants: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "bg-background/30 text-foreground pointer-events-none absolute bottom-full left-1/2 mb-1.5 -translate-x-1/2 rounded-full px-2 py-0.5 font-mono text-xs whitespace-nowrap backdrop-blur-xs", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "bg-background/30 text-foreground pointer-events-none absolute bottom-full left-1/2 mb-1.5 -translate-x-1/2 rounded-full px-2 py-0.5 font-mono text-xs whitespace-nowrap backdrop-blur-xs", unknown, unknown, undefined>>;
+export declare const videoPlayerHighlightVariants: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "pointer-events-none absolute top-1/2 h-5 -translate-y-1/2 rounded-full bg-current/10", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "pointer-events-none absolute top-1/2 h-5 -translate-y-1/2 rounded-full bg-current/10", unknown, unknown, undefined>>;
+export type VideoPlayerMarker = {
+    /** window start, in seconds */
+    start: number;
+    /** window end, in seconds */
+    end: number;
+    /** tooltip text; the expanded pill captions itself with its formatted time range */
+    label?: string;
+    /** ink for the outline and fill; defaults to the track's foreground */
+    color?: string;
+};
+export type VideoPlayerHighlight = {
+    start: number;
+    end: number;
+    color?: string;
+};
 export type VideoPlayerProps = WithElementRef<HTMLAttributes<HTMLElement>> & {
     /** video source URL (remote or static path) */
     src: string;
@@ -46,4 +107,26 @@ export type VideoPlayerProps = WithElementRef<HTMLAttributes<HTMLElement>> & {
     controls?: boolean;
     /** aspect ratio for the video container */
     ratio?: number;
+    /** preload strategy; metadata so `duration` is known before the first play */
+    preload?: 'none' | 'metadata' | 'auto';
+    /** current playback position in seconds; assigning to it seeks */
+    time?: number;
+    /** media duration in seconds, 0 until metadata loads */
+    duration?: number;
+    /** whether playback is paused; assigning false plays */
+    paused?: boolean;
+    /** named windows drawn on the seek track (chapters, segments, detections) */
+    markers?: VideoPlayerMarker[];
+    /** index of the expanded marker, or null. Expanding seeks to its start and plays. */
+    activeMarker?: number | null;
+    /** regions to tint on the seek track, for linked brushing from another view */
+    highlights?: VideoPlayerHighlight[];
+    /** loop playback within the expanded marker's window */
+    loopActiveMarker?: boolean;
+    /** 'always' pins the control bar open, so markers stay reachable during playback */
+    controlsVisibility?: 'auto' | 'always';
+    /** clock formatter for the time readout and the marker captions */
+    formatTime?: (seconds: number) => string;
+    /** a marker was hovered (its index) or left (null) - for linked brushing out */
+    onMarkerHover?: (index: number | null) => void;
 };

package/dist/primitives/video-player/types.js

@@ -30,3 +30,39 @@ export const videoPlayerControlsVariants = tv({
         visible: true
     }
 });
+// marker and highlight overlay above the seek track
+export const videoPlayerMarkerTrackVariants = tv({
+    base: 'text-foreground pointer-events-none absolute inset-0 z-10'
+});
+// marker dot that expands into a range pill
+export const videoPlayerMarkerVariants = tv({
+    base: 'pointer-events-auto absolute cursor-pointer rounded-full border-current transition-all duration-200 ease-out focus-visible:ring-ring/50 focus-visible:ring-2 focus-visible:outline-hidden',
+    variants: {
+        expanded: {
+            true: 'border-[1.5px]',
+            false: 'border-2'
+        },
+        filled: {
+            true: 'bg-current/10',
+            false: 'bg-transparent'
+        },
+        emphasis: {
+            hidden: 'pointer-events-none opacity-0',
+            full: 'opacity-100',
+            ambient: 'opacity-70'
+        }
+    },
+    defaultVariants: {
+        expanded: false,
+        filled: false,
+        emphasis: 'ambient'
+    }
+});
+// time-range caption above an expanded marker pill
+export const videoPlayerMarkerCaptionVariants = tv({
+    base: 'bg-background/30 text-foreground pointer-events-none absolute bottom-full left-1/2 mb-1.5 -translate-x-1/2 rounded-full px-2 py-0.5 font-mono text-xs whitespace-nowrap backdrop-blur-xs'
+});
+// tinted band for a region another view is pointing at
+export const videoPlayerHighlightVariants = tv({
+    base: 'pointer-events-none absolute top-1/2 h-5 -translate-y-1/2 rounded-full bg-current/10'
+});

package/dist/primitives/video-player/usage.json

@@ -1,6 +1,13 @@
 {
-  "description": "Media-playback card with controls and aspect ratio; composes Card + AspectRatio + Button + Slider.",
+  "description": "Media-playback card whose seek track doubles as a timeline: named marker windows, tinted highlight bands and bindable playback state. Composes Card + AspectRatio + Button + Slider.",
   "usage": [
-    "`<VideoPlayer src muted />` for the standard controlled player; `controls={false}` for ambient/looping footage."
+    "`<VideoPlayer src muted />` for the standard controlled player; `controls={false}` for ambient/looping footage. `preload=\"metadata\"` by default, so `duration` is known before the first play.",
+    "Playback state: `bind:time` / `bind:duration` / `bind:paused` mirror the media element out, and `time` and `paused` are writable - assigning to `time` seeks, assigning `paused = false` plays. That is how another view drives the player.",
+    "Markers: `markers={[{ start, end, label?, color? }]}` in **seconds, not fractions** draws one focusable dot per window on the seek track. Clicking a dot expands it into a range pill, seeks to its start and plays; one is expanded at a time, and `bind:activeMarker` is its index (or null). Scrubbing by hand, or a click on the video surface, collapses it. `loopActiveMarker` loops playback inside the expanded window.",
+    "Linked brushing: `highlights={[{ start, end, color? }]}` tints regions another view is pointing at (brushing in), and `onMarkerHover(index | null)` fires on hover **and focus** so a hovered marker can highlight the matching row elsewhere (brushing out).",
+    "Two lifecycle traps when `src` changes: a new `src` remounts the player and Svelte's media bindings write your bound values into the fresh element, so reset `time = 0` and `paused = true` yourself or a stale position becomes the new clip's start; and `bind:duration` holds the previous clip's value until `loadedmetadata`, so reseed `duration` from a known length if marker geometry must be right on the first frame (`duration === 0` collapses every marker to the left edge).",
+    "`controlsVisibility=\"always\"` pins the control bar open - required whenever markers must stay clickable during playback, since the default `\"auto\"` fades the bar (and the markers with it) 2.5s into playback. `formatTime` replaces the mm:ss clock in the time readout and the marker captions.",
+    "Style hooks: `data-slot` on `video-player`, `-video`, `-overlay`, `-controls`, `-time`, `-markers`, `-marker` (carries `data-expanded`), `-marker-caption`, `-highlight`. A per-marker `color` inks the outline and fill via `currentColor`.",
+    "Marker seeking needs an origin that serves HTTP Range requests; against one that does not, seeks silently do nothing (serve the clip from a blob URL instead)."
   ]
 }

package/dist/primitives/video-player/video-player.svelte

@@ -6,12 +6,17 @@
   import Slider from '../slider/index.js';
   import {
     videoPlayerControlsVariants,
+    videoPlayerHighlightVariants,
+    videoPlayerMarkerCaptionVariants,
+    videoPlayerMarkerTrackVariants,
+    videoPlayerMarkerVariants,
     videoPlayerOverlayVariants,
     videoPlayerVariants,
     type VideoPlayerProps
   } from './types.js';
   import PlayIcon from '@lucide/svelte/icons/play';
   import PauseIcon from '@lucide/svelte/icons/pause';
+  import { fade } from 'svelte/transition';
 
   let {
     ref = $bindable(null),
@@ -21,15 +26,26 @@
     muted = false,
     controls = true,
     ratio = 16 / 9,
+    preload = 'metadata',
+    time = $bindable(0),
+    duration = $bindable(0),
+    paused = $bindable(true),
+    activeMarker = $bindable(null),
+    markers = [],
+    highlights = [],
+    loopActiveMarker = false,
+    controlsVisibility = 'auto',
+    formatTime = formatMMSS,
+    onMarkerHover,
     class: className,
     ...restProps
   }: VideoPlayerProps = $props();
 
-  let time = $state(0);
-  let duration = $state(0);
-  let paused = $state(true);
   let controlsVisible = $state(true);
+  let hoveredMarker = $state<number | null>(null);
   let hideTimer: ReturnType<typeof setTimeout> | undefined;
+  let scrubTime = $state<number | null>(null);
+  let scrubbing = false;
 
   function resetControls() {
     controlsVisible = true;
@@ -37,6 +53,7 @@
   }
 
   function scheduleHide(delay: number) {
+    if (controlsVisibility === 'always') return;
     hideTimer = setTimeout(() => {
       controlsVisible = false;
     }, delay);
@@ -50,8 +67,57 @@
   function handleMouseLeave() {
     if (!paused) scheduleHide(1000);
   }
+
+  function pct(seconds: number) {
+    return duration > 0 ? Math.max(0, Math.min(1, seconds / duration)) * 100 : 0;
+  }
+
+  function toggleMarker(index: number) {
+    if (activeMarker === index) {
+      activeMarker = null;
+      return;
+    }
+    activeMarker = index;
+    const marker = markers[index];
+    if (!marker) return;
+    time = marker.start;
+    paused = false;
+  }
+
+  function handleSurfaceClick() {
+    if (activeMarker !== null) {
+      activeMarker = null;
+      return;
+    }
+    paused = !paused;
+  }
+
+  function hoverMarker(index: number | null) {
+    hoveredMarker = index;
+    onMarkerHover?.(index);
+  }
+
+  function handleTimeUpdate(media: HTMLVideoElement) {
+    if (!loopActiveMarker || activeMarker === null || media.paused) return;
+    const marker = markers[activeMarker];
+    if (!marker) return;
+    if (media.currentTime >= marker.end || media.currentTime >= media.duration) {
+      media.currentTime = marker.start;
+    }
+  }
 </script>
 
+<svelte:window
+  onpointerup={() => {
+    scrubbing = false;
+    scrubTime = null;
+  }}
+  onpointercancel={() => {
+    scrubbing = false;
+    scrubTime = null;
+  }}
+/>
+
 <Card
   bind:ref
   data-slot="video-player"
@@ -68,6 +134,8 @@
       {poster}
       {autoplay}
       {muted}
+      {preload}
+      playsinline
       bind:currentTime={time}
       bind:duration
       bind:paused
@@ -75,6 +143,8 @@
       onplay={showControls}
       onpause={resetControls}
       onended={resetControls}
+      ontimeupdate={(e) => handleTimeUpdate(e.currentTarget)}
+      onclick={handleSurfaceClick}
     ></video>
 
     {#if !controls && (paused || controlsVisible)}
@@ -115,23 +185,101 @@
           {/if}
         </Button>
 
-        <Slider
-          type="multiple"
-          value={[time]}
-          max={duration || 1}
-          step={0.1}
-          aria-label="Seek"
-          class="**:data-[slot=slider-track]:bg-background/60 **:data-[slot=slider-range]:bg-foreground/90 **:data-[slot=slider-thumb]:bg-foreground max-w-100 min-w-0 flex-1 **:data-[slot=slider-thumb]:size-3.5 **:data-[slot=slider-thumb]:cursor-grab **:data-[slot=slider-thumb]:border-0 **:data-[slot=slider-thumb]:shadow-md **:data-[slot=slider-track]:h-1.5"
-          onValueCommit={(v) => {
-            time = v[0];
-          }}
-        />
+        <div class="relative min-w-0 flex-1">
+          <Slider
+            type="multiple"
+            value={[scrubTime ?? time]}
+            max={duration || 1}
+            step={0.1}
+            aria-label="Seek"
+            thumbPositioning="exact"
+            class="**:data-[slot=slider-track]:bg-background/60 **:data-[slot=slider-range]:bg-foreground/90 **:data-[slot=slider-thumb]:bg-foreground w-full **:data-[slot=slider-thumb]:z-20 **:data-[slot=slider-thumb]:size-3.5 **:data-[slot=slider-thumb]:cursor-grab **:data-[slot=slider-thumb]:border-0 **:data-[slot=slider-thumb]:shadow-md **:data-[slot=slider-track]:h-1.5"
+            onpointerdown={() => {
+              scrubbing = true;
+            }}
+            onValueChange={(v) => {
+              if (scrubbing) scrubTime = v[0];
+            }}
+            onValueCommit={(v) => {
+              scrubbing = false;
+              time = v[0];
+              scrubTime = null;
+              activeMarker = null;
+            }}
+          />
+
+          {#if highlights.length > 0 || markers.length > 0}
+            <div data-slot="video-player-markers" class={videoPlayerMarkerTrackVariants()}>
+              {#each highlights as highlight, i (i)}
+                <div
+                  data-slot="video-player-highlight"
+                  class={videoPlayerHighlightVariants()}
+                  style="left: {pct(highlight.start)}%; width: {Math.max(
+                    0.5,
+                    pct(highlight.end) - pct(highlight.start)
+                  )}%;{highlight.color ? ` color: ${highlight.color};` : ''}"
+                ></div>
+              {/each}
+
+              {#each markers as marker, i (i)}
+                {@const startPct = pct(marker.start)}
+                {@const endPct = pct(marker.end)}
+                {@const isExpanded = activeMarker === i}
+                {@const isDimmed = activeMarker !== null && !isExpanded}
+                {@const inRange = time >= marker.start && time <= marker.end}
+                <button
+                  type="button"
+                  data-slot="video-player-marker"
+                  data-expanded={isExpanded || undefined}
+                  class={videoPlayerMarkerVariants({
+                    expanded: isExpanded,
+                    filled: inRange,
+                    emphasis: isDimmed
+                      ? 'hidden'
+                      : hoveredMarker === i || isExpanded || inRange
+                        ? 'full'
+                        : 'ambient'
+                  })}
+                  style="top: 50%; height: {isExpanded ? '1.5rem' : '0.75rem'}; width: {isExpanded
+                    ? `${endPct - startPct}%`
+                    : '0.75rem'}; left: {isExpanded
+                    ? `${startPct}%`
+                    : `${(startPct + endPct) / 2}%`}; transform: {isExpanded
+                    ? 'translateY(-50%)'
+                    : 'translate(-50%, -50%)'};{marker.color ? ` color: ${marker.color};` : ''}"
+                  title={marker.label}
+                  aria-label={marker.label ??
+                    `${formatTime(marker.start)} to ${formatTime(marker.end)}`}
+                  aria-pressed={isExpanded}
+                  onmouseenter={() => hoverMarker(i)}
+                  onmouseleave={() => hoverMarker(null)}
+                  onfocus={() => hoverMarker(i)}
+                  onblur={() => hoverMarker(null)}
+                  onclick={(e) => {
+                    e.stopPropagation();
+                    toggleMarker(i);
+                  }}
+                >
+                  {#if isExpanded}
+                    <span
+                      data-slot="video-player-marker-caption"
+                      class={videoPlayerMarkerCaptionVariants()}
+                      in:fade={{ duration: 200, delay: 200 }}
+                    >
+                      {formatTime(marker.start)} - {formatTime(marker.end)}
+                    </span>
+                  {/if}
+                </button>
+              {/each}
+            </div>
+          {/if}
+        </div>
 
         <span
           data-slot="video-player-time"
           class="bg-background/30 text-foreground rounded-full px-3 py-1.5 font-mono text-xs whitespace-nowrap"
         >
-          {formatMMSS(time)} / {formatMMSS(duration)}
+          {formatTime(scrubTime ?? time)} / {formatTime(duration)}
         </span>
       </div>
     {/if}

package/dist/primitives/video-player/video-player.svelte.d.ts

@@ -1,4 +1,4 @@
 import { type VideoPlayerProps } from './types.js';
-declare const VideoPlayer: import("svelte").Component<VideoPlayerProps, {}, "ref">;
+declare const VideoPlayer: import("svelte").Component<VideoPlayerProps, {}, "ref" | "duration" | "time" | "paused" | "activeMarker">;
 type VideoPlayer = ReturnType<typeof VideoPlayer>;
 export default VideoPlayer;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@archetypeai/ds-ui-svelte-labs",
-    "version": "0.14.0",
+    "version": "0.15.0",
     "description": "Archetype AI Design System Labs Primitives (experimental 0.x tier composing @archetypeai/ds-ui-svelte-console)",
     "type": "module",
     "license": "MIT",