@resee-movies/nuxt-ux 0.0.4 → 0.1.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 (48) hide show
  1. package/dist/module.json +1 -1
  2. package/dist/module.mjs +42 -9
  3. package/dist/runtime/components/{UiButton.vue → Button.vue} +6 -4
  4. package/dist/runtime/components/{UiButton.vue.d.ts → Button.vue.d.ts} +6 -6
  5. package/dist/runtime/components/CloseButton.vue +14 -0
  6. package/dist/runtime/components/Dialog.vue +121 -0
  7. package/dist/runtime/components/Dialog.vue.d.ts +31 -0
  8. package/dist/runtime/components/Drawer.vue +91 -0
  9. package/dist/runtime/components/Drawer.vue.d.ts +23 -0
  10. package/dist/runtime/components/Icon.vue +24 -0
  11. package/dist/runtime/components/Icon.vue.d.ts +14 -0
  12. package/dist/runtime/components/{UiIconTextPair.vue → IconTextPair.vue} +3 -3
  13. package/dist/runtime/components/{UiIconTextPair.vue.d.ts → IconTextPair.vue.d.ts} +5 -5
  14. package/dist/runtime/components/Image.vue +149 -0
  15. package/dist/runtime/components/Image.vue.d.ts +59 -0
  16. package/dist/runtime/components/{UiLayoutPageColumn.vue.d.ts → LayoutPageColumn.vue.d.ts} +2 -2
  17. package/dist/runtime/components/{UiLayoutPageContainer.vue.d.ts → LayoutPageContainer.vue.d.ts} +2 -2
  18. package/dist/runtime/components/{UiLink.vue → Link.vue} +3 -2
  19. package/dist/runtime/components/{UiLink.vue.d.ts → Link.vue.d.ts} +4 -4
  20. package/dist/runtime/components/{UiLoadingIndicator.vue.d.ts → LoadingIndicator.vue.d.ts} +2 -2
  21. package/dist/runtime/components/{UiMessage.vue → Message.vue} +2 -1
  22. package/dist/runtime/components/{UiMessage.vue.d.ts → Message.vue.d.ts} +2 -2
  23. package/dist/runtime/components/{UiNotificationContainer.vue → NotificationContainer.vue} +1 -0
  24. package/dist/runtime/components/NotificationContainer.vue.d.ts +3 -0
  25. package/dist/runtime/components/{UiProgressBar.vue → ProgressBar.vue} +1 -0
  26. package/dist/runtime/components/{UiTag.vue → Tag.vue} +5 -2
  27. package/dist/runtime/composables/use-load-image.d.ts +23 -0
  28. package/dist/runtime/composables/use-load-image.js +109 -0
  29. package/dist/runtime/theme/css/brand/theme.css +1 -1
  30. package/dist/runtime/theme/css/brand/tooltip.css +1 -1
  31. package/dist/runtime/theme/css/brand/transition.css +1 -1
  32. package/dist/runtime/theme/css/brand/utilities.css +1 -1
  33. package/dist/runtime/types/index.d.ts +6 -0
  34. package/package.json +3 -2
  35. package/dist/runtime/components/UiIcon.vue +0 -23
  36. package/dist/runtime/components/UiIcon.vue.d.ts +0 -12
  37. /package/dist/runtime/components/{UiCard.vue → Card.vue} +0 -0
  38. /package/dist/runtime/components/{UiCard.vue.d.ts → Card.vue.d.ts} +0 -0
  39. /package/dist/runtime/components/{UiNotificationContainer.vue.d.ts → CloseButton.vue.d.ts} +0 -0
  40. /package/dist/runtime/components/{UiHeading.vue → Heading.vue} +0 -0
  41. /package/dist/runtime/components/{UiHeading.vue.d.ts → Heading.vue.d.ts} +0 -0
  42. /package/dist/runtime/components/{UiLayoutPageColumn.vue → LayoutPageColumn.vue} +0 -0
  43. /package/dist/runtime/components/{UiLayoutPageContainer.vue → LayoutPageContainer.vue} +0 -0
  44. /package/dist/runtime/components/{UiLoadingIndicator.vue → LoadingIndicator.vue} +0 -0
  45. /package/dist/runtime/components/{UiLorem.vue → Lorem.vue} +0 -0
  46. /package/dist/runtime/components/{UiLorem.vue.d.ts → Lorem.vue.d.ts} +0 -0
  47. /package/dist/runtime/components/{UiProgressBar.vue.d.ts → ProgressBar.vue.d.ts} +0 -0
  48. /package/dist/runtime/components/{UiTag.vue.d.ts → Tag.vue.d.ts} +0 -0
@@ -0,0 +1,149 @@
1
+ <template>
2
+ <div
3
+ ref = "container"
4
+ :class = "['image', {
5
+ loading: imgLoading || imgBgLoading || props.showLoading,
6
+ glass: props.glassy,
7
+ bordered: props.bordered,
8
+ beveled: props.beveled,
9
+ raised: props.raised
10
+ }]"
11
+ >
12
+ <Icon
13
+ v-if = "props.defaultIcon && (!imgSrc || imgError || imgLoading || props.showLoading)"
14
+ :name = "props.defaultIcon"
15
+ :size = "props.iconSize"
16
+ :color-cycle = "imgLoading || props.showLoading"
17
+ />
18
+
19
+ <img
20
+ :src = "imgSrc"
21
+ :alt = "altText"
22
+ :width = "dimensions.width"
23
+ :height = "dimensions.height"
24
+ :loading = "props.loading"
25
+ class = "transition-opacity duration-300"
26
+ :class = "[aspectRatioClass, objectFitClass, {
27
+ 'opacity-0': !imgSrc || imgLoading
28
+ }]"
29
+ >
30
+ </div>
31
+ </template>
32
+
33
+ <script>
34
+ export const AspectRatioClassNames = {
35
+ "1/1": "aspect-square",
36
+ "square": "aspect-square",
37
+ "2/3": "aspect-poster",
38
+ "poster": "aspect-poster",
39
+ "4/5": "aspect-tall",
40
+ "16/9": "aspect-video",
41
+ "video": "aspect-video"
42
+ };
43
+ export const ObjectFitClassNames = {
44
+ cover: "object-cover",
45
+ outside: "object-cover",
46
+ contain: "object-contain",
47
+ inside: "object-contain"
48
+ };
49
+ </script>
50
+
51
+ <script setup>
52
+ import { normalizeImageFileDescriptor } from "@resee-movies/utilities/images/normalize-image-file-descriptor";
53
+ import { getAspectRatio } from "@resee-movies/utilities/numbers/get-aspect-ratio";
54
+ import { fromTmdbImageSize } from "@resee-movies/utilities/tmdb/from-tmdb-image-size";
55
+ import { computed, ref } from "vue";
56
+ import { useLoadImage } from "../composables/use-load-image";
57
+ import { useSharedIntersectionObserver } from "../composables/use-shared-intersection-observer";
58
+ import Icon from "./Icon.vue";
59
+ const props = defineProps({
60
+ src: { type: null, required: true },
61
+ alt: { type: [String, null, Function], required: false, default: "" },
62
+ type: { type: String, required: false, default: void 0 },
63
+ width: { type: null, required: false, default: "w185" },
64
+ height: { type: [String, Number], required: false, default: void 0 },
65
+ aspect: { type: String, required: false, default: void 0 },
66
+ fit: { type: String, required: false, default: "cover" },
67
+ showLoading: { type: Boolean, required: false, default: false },
68
+ defaultIcon: { type: String, required: false, default: "i-ph-image-thin" },
69
+ iconSize: { type: String, required: false, default: "xl" },
70
+ loading: { type: String, required: false, default: "lazy" },
71
+ glassy: { type: Boolean, required: false, default: false },
72
+ bordered: { type: Boolean, required: false, default: false },
73
+ beveled: { type: Boolean, required: false, default: false },
74
+ raised: { type: Boolean, required: false, default: false },
75
+ overlayClasses: { type: null, required: false, default: void 0 }
76
+ });
77
+ const deferLoad = ref(props.loading === "lazy");
78
+ const container = ref();
79
+ const normalizedSource = computed(() => {
80
+ const result = normalizeImageFileDescriptor(props.src);
81
+ if (props.type) {
82
+ result.sourceType = props.type;
83
+ }
84
+ return result;
85
+ });
86
+ const dimensions = computed(() => {
87
+ let intWidth = normalizedSource.value.width;
88
+ let intHeight = normalizedSource.value.height;
89
+ if (props.width || props.height) {
90
+ intWidth = fromTmdbImageSize(props.width);
91
+ intHeight = fromTmdbImageSize(props.height);
92
+ }
93
+ if (!props.aspect || props.aspect === "auto" || intWidth && intHeight) {
94
+ return { width: intWidth, height: intHeight };
95
+ }
96
+ if (intHeight) {
97
+ const aspect = getAspectRatio(intHeight, "y", props.aspect);
98
+ return { width: aspect.x, height: aspect.y };
99
+ }
100
+ if (intWidth) {
101
+ const aspect = getAspectRatio(intWidth, "x", props.aspect);
102
+ return { width: aspect.x, height: aspect.y };
103
+ }
104
+ return { width: void 0, height: void 0 };
105
+ });
106
+ const imgLoadInfo = useLoadImage(
107
+ () => normalizedSource.value.identifier,
108
+ {
109
+ deferLoad,
110
+ type: () => normalizedSource.value.sourceType,
111
+ width: () => props.width,
112
+ friendlyName: () => normalizedSource.value.friendlyName,
113
+ reseeConfig: () => ({
114
+ width: dimensions.value.width,
115
+ height: dimensions.value.height,
116
+ fit: props.fit
117
+ })
118
+ }
119
+ );
120
+ const {
121
+ src: imgSrc,
122
+ loading: imgLoading,
123
+ bgLoading: imgBgLoading,
124
+ error: imgError
125
+ } = imgLoadInfo;
126
+ if (deferLoad.value) {
127
+ useSharedIntersectionObserver(container, {
128
+ once: true,
129
+ onChange(isIntersecting) {
130
+ if (isIntersecting) {
131
+ deferLoad.value = false;
132
+ }
133
+ }
134
+ });
135
+ }
136
+ const aspectRatioClass = computed(() => {
137
+ return !props.aspect || props.aspect === "auto" ? void 0 : AspectRatioClassNames[props.aspect];
138
+ });
139
+ const objectFitClass = computed(() => {
140
+ return !props.fit ? void 0 : ObjectFitClassNames[props.fit];
141
+ });
142
+ const altText = computed(() => {
143
+ return typeof props.alt === "function" ? props.alt(imgError.value) : props.alt ?? normalizedSource.value.description ?? "";
144
+ });
145
+ </script>
146
+
147
+ <style scoped>
148
+ @reference "tailwindcss";.image{background-color:#fff;overflow:clip;position:relative;width:-moz-max-content;width:max-content;@variant dark{background-color:#000}}.image.bordered{border:2px solid var(--color-global-background-accent)}.image.beveled{border-bottom-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl)}.image.raised{box-shadow:var(--shadow-heavy)}.image.glass:after{background-image:linear-gradient(110deg,transparent 25%,hsla(0,0%,100%,.15) 80%,transparent);content:var(--zero-width-space);inset:0;position:absolute}.image .icon{color:var(--color-global-background-accent);left:50%;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%)}
149
+ </style>
@@ -0,0 +1,59 @@
1
+ import type { ImageFileDescriptor } from '@resee-movies/utilities/images/normalize-image-file-descriptor';
2
+ import type { AspectRatio } from '@resee-movies/utilities/numbers/get-aspect-ratio';
3
+ import type { MediaAssetTransformConfig } from '@resee-movies/utilities/resee/get-media-asset-url';
4
+ import type { TmdbImageSize } from '@resee-movies/utilities/tmdb/get-tmdb-image-url';
5
+ import type { LoadImageType } from '../composables/use-load-image.js';
6
+ import type { HTMLElementClassNames } from '../types/index.js';
7
+ import type { IconProps } from './Icon.vue.js';
8
+ export type UiImgProps = {
9
+ src: ImageFileDescriptor | null | undefined;
10
+ alt?: string | null | ((error: unknown) => string);
11
+ type?: LoadImageType;
12
+ width?: TmdbImageSize | string | number;
13
+ height?: string | number;
14
+ aspect?: AspectRatio | 'auto';
15
+ fit?: MediaAssetTransformConfig['fit'];
16
+ showLoading?: boolean;
17
+ defaultIcon?: string;
18
+ iconSize?: IconProps['size'];
19
+ loading?: 'lazy' | 'eager';
20
+ glassy?: boolean;
21
+ bordered?: boolean;
22
+ beveled?: boolean;
23
+ raised?: boolean;
24
+ overlayClasses?: HTMLElementClassNames;
25
+ };
26
+ export declare const AspectRatioClassNames: {
27
+ readonly '1/1': "aspect-square";
28
+ readonly square: "aspect-square";
29
+ readonly '2/3': "aspect-poster";
30
+ readonly poster: "aspect-poster";
31
+ readonly '4/5': "aspect-tall";
32
+ readonly '16/9': "aspect-video";
33
+ readonly video: "aspect-video";
34
+ };
35
+ export declare const ObjectFitClassNames: {
36
+ readonly cover: "object-cover";
37
+ readonly outside: "object-cover";
38
+ readonly contain: "object-contain";
39
+ readonly inside: "object-contain";
40
+ };
41
+ declare const __VLS_export: import("vue").DefineComponent<UiImgProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<UiImgProps> & Readonly<{}>, {
42
+ type: LoadImageType;
43
+ loading: "lazy" | "eager";
44
+ iconSize: "sm" | "md" | "lg" | "xl";
45
+ bordered: boolean;
46
+ showLoading: boolean;
47
+ fit: "cover" | "contain" | "inside" | "outside";
48
+ width: TmdbImageSize | string | number;
49
+ height: string | number;
50
+ alt: string | null | ((error: unknown) => string);
51
+ aspect: AspectRatio | "auto";
52
+ defaultIcon: string;
53
+ glassy: boolean;
54
+ beveled: boolean;
55
+ raised: boolean;
56
+ overlayClasses: string | HTMLElementClassNames[] | Record<string, boolean> | null;
57
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
58
+ declare const _default: typeof __VLS_export;
59
+ export default _default;
@@ -1,8 +1,8 @@
1
- export type UiLayoutPageColumn = {
1
+ export type LayoutPageColumn = {
2
2
  is?: string;
3
3
  layout?: 'main' | 'vista';
4
4
  };
5
- declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<UiLayoutPageColumn, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<UiLayoutPageColumn> & Readonly<{}>, {
5
+ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LayoutPageColumn, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LayoutPageColumn> & Readonly<{}>, {
6
6
  layout: "main" | "vista";
7
7
  is: string;
8
8
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
@@ -1,10 +1,10 @@
1
1
  import type { HintedString } from '../types/index.js';
2
- export type UiLayoutPageContainerProps = {
2
+ export type LayoutPageContainerProps = {
3
3
  is?: HintedString<'div' | 'main' | 'section' | 'article' | 'nav'>;
4
4
  glassEffect?: boolean;
5
5
  accentColor?: string;
6
6
  };
7
- declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<UiLayoutPageContainerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<UiLayoutPageContainerProps> & Readonly<{}>, {
7
+ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LayoutPageContainerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LayoutPageContainerProps> & Readonly<{}>, {
8
8
  is: HintedString<"div" | "main" | "section" | "article" | "nav">;
9
9
  glassEffect: boolean;
10
10
  accentColor: string;
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <UiButton
2
+ <Button
3
3
  :is = "LinkComponent"
4
4
  :to = "props.to"
5
5
  :variant = "props.variant"
@@ -8,7 +8,7 @@
8
8
  :spacing = "props.spacing"
9
9
  >
10
10
  <slot />
11
- </UiButton>
11
+ </Button>
12
12
  </template>
13
13
 
14
14
  <script>
@@ -16,6 +16,7 @@ import { useNuxtUxConfig } from "../composables/use-nuxt-ux-config";
16
16
  </script>
17
17
 
18
18
  <script setup>
19
+ import Button from "./Button.vue";
19
20
  const LinkComponent = useNuxtUxConfig().getConfig("UiLinkBaseComponent");
20
21
  const props = defineProps({
21
22
  to: { type: null, required: true },
@@ -1,13 +1,13 @@
1
1
  import type { RouteLocationRaw } from 'vue-router';
2
- import type { UiButtonProps } from './UiButton.vue.js';
2
+ import type { ButtonProps } from './Button.vue.js';
3
3
  export type UiLinkProps = {
4
4
  to: RouteLocationRaw;
5
5
  external?: boolean;
6
6
  target?: '_blank' | '_parent' | '_self' | '_top';
7
7
  underline?: boolean;
8
- variant?: UiButtonProps['variant'];
9
- spacing?: UiButtonProps['spacing'];
10
- } & /* @vue-ignore */ Omit<UiButtonProps, 'bordered' | 'variant' | 'spacing'>;
8
+ variant?: ButtonProps['variant'];
9
+ spacing?: ButtonProps['spacing'];
10
+ } & /* @vue-ignore */ Omit<ButtonProps, 'bordered' | 'variant' | 'spacing'>;
11
11
  declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<UiLinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<UiLinkProps> & Readonly<{}>, {
12
12
  target: "_blank" | "_parent" | "_self" | "_top";
13
13
  spacing: "wide" | "normal";
@@ -1,6 +1,6 @@
1
- import type { UiIconProps } from './UiIcon.vue.js';
1
+ import type { IconProps } from './Icon.vue.js';
2
2
  type __VLS_Props = {
3
- size?: UiIconProps['size'];
3
+ size?: IconProps['size'];
4
4
  };
5
5
  declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
6
6
  size: "sm" | "md" | "lg" | "xl";
@@ -11,6 +11,7 @@ import { computed } from "vue";
11
11
  </script>
12
12
 
13
13
  <script setup>
14
+ import PrimeMessage from "primevue/message";
14
15
  const props = defineProps({
15
16
  severity: { type: String, required: false },
16
17
  text: { type: String, required: false },
@@ -34,7 +35,7 @@ const passthroughProps = computed(() => {
34
35
  class: "close"
35
36
  },
36
37
  transition: {
37
- name: "slide-y",
38
+ name: "grow-y",
38
39
  appear: false
39
40
  }
40
41
  };
@@ -1,12 +1,12 @@
1
1
  import type { StatusLevel } from '../types/index.js';
2
- export type UiMessageProps = {
2
+ export type MessageProps = {
3
3
  severity?: StatusLevel;
4
4
  text?: string;
5
5
  class?: string;
6
6
  style?: string;
7
7
  accented?: boolean;
8
8
  };
9
- declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<UiMessageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<UiMessageProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
9
+ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<MessageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MessageProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
10
10
  default?: (props: {}) => any;
11
11
  }>;
12
12
  declare const _default: typeof __VLS_export;
@@ -7,6 +7,7 @@
7
7
  </template>
8
8
 
9
9
  <script setup>
10
+ import PrimeToast, {} from "primevue/toast";
10
11
  import { StatusLevelIcons } from "../constants";
11
12
  const passthroughProps = {
12
13
  message: ({ props }) => ({
@@ -0,0 +1,3 @@
1
+ declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
2
+ declare const _default: typeof __VLS_export;
3
+ export default _default;
@@ -10,6 +10,7 @@
10
10
 
11
11
  <script setup>
12
12
  import { computed } from "vue";
13
+ import PrimeProgressBar from "primevue/progressbar";
13
14
  const props = defineProps({
14
15
  value: { type: null, required: false, default: void 0 },
15
16
  showValue: { type: Boolean, required: false, default: false },
@@ -7,13 +7,16 @@
7
7
  props.size,
8
8
  props.tooltip ? 'has-tooltip' : void 0
9
9
  ]"
10
- v-primetooltip.top="{ value: props.tooltip, showDelay: 500 }"
10
+ v-prime-tooltip.top="{ value: props.tooltip, showDelay: 500 }"
11
11
  >
12
- <UiIconTextPair :icon="props.icon" :text="props.text" />
12
+ <IconTextPair :icon="props.icon" :text="props.text" />
13
13
  </PrimeTag>
14
14
  </template>
15
15
 
16
16
  <script setup>
17
+ import PrimeTag from "primevue/tag";
18
+ import vPrimeTooltip from "primevue/tooltip";
19
+ import IconTextPair from "./IconTextPair.vue";
17
20
  const props = defineProps({
18
21
  text: { type: String, required: false, default: void 0 },
19
22
  icon: { type: String, required: false, default: void 0 },
@@ -0,0 +1,23 @@
1
+ import type { NormalizedFileDescriptorSource } from '@resee-movies/utilities/images/normalize-image-file-descriptor';
2
+ import { type MediaAssetTransformConfig } from '@resee-movies/utilities/resee/get-media-asset-url';
3
+ import { type MaybeRefOrGetter, type Ref } from 'vue';
4
+ export type LoadImageType = NormalizedFileDescriptorSource;
5
+ export type LoadImageOptions = {
6
+ friendlyName?: MaybeRefOrGetter<string | undefined>;
7
+ placeholderSrc?: MaybeRefOrGetter<string>;
8
+ errorSrc?: MaybeRefOrGetter<string>;
9
+ width?: MaybeRefOrGetter<string | number>;
10
+ type?: MaybeRefOrGetter<LoadImageType>;
11
+ reseeConfig?: MaybeRefOrGetter<MediaAssetTransformConfig | undefined>;
12
+ deferLoad?: Ref<boolean>;
13
+ };
14
+ /**
15
+ * Exposes the {@link loadImage} utility as a set of reactive properties.
16
+ */
17
+ export declare function useLoadImage(source: MaybeRefOrGetter<string | null | undefined>, config?: LoadImageOptions): {
18
+ src: Ref<string | undefined, string | undefined>;
19
+ key: Ref<string | undefined, string | undefined>;
20
+ error: Ref<unknown, unknown>;
21
+ loading: Ref<boolean, boolean>;
22
+ bgLoading: Ref<boolean, boolean>;
23
+ };
@@ -0,0 +1,109 @@
1
+ import { useNuxtApp } from "#imports";
2
+ import { loadImage } from "@resee-movies/utilities/dom/load-image";
3
+ import { getMediaAssetUrl } from "@resee-movies/utilities/resee/get-media-asset-url";
4
+ import { isString } from "@resee-movies/utilities/strings/is-string";
5
+ import { fromTmdbImageSize } from "@resee-movies/utilities/tmdb/from-tmdb-image-size";
6
+ import { getTmdbImageCache } from "@resee-movies/utilities/tmdb/get-tmdb-image-cache";
7
+ import { getTmdbImageUrl } from "@resee-movies/utilities/tmdb/get-tmdb-image-url";
8
+ import { toTmdbImageSize } from "@resee-movies/utilities/tmdb/to-tmdb-image-size";
9
+ import { ref, toRef, toValue, watch } from "vue";
10
+ export function useLoadImage(source, config = {}) {
11
+ const nuxtApp = useNuxtApp();
12
+ const src = ref();
13
+ const key = ref();
14
+ const error = ref();
15
+ const loading = ref(false);
16
+ const bgLoading = ref(false);
17
+ watch(
18
+ [
19
+ toRef(source),
20
+ toRef(config.friendlyName),
21
+ toRef(config.placeholderSrc),
22
+ toRef(config.errorSrc),
23
+ toRef(config.width),
24
+ toRef(config.reseeConfig),
25
+ toRef(config.type),
26
+ toRef(config.deferLoad)
27
+ ],
28
+ () => {
29
+ const sourceUnwrapped = toValue(source);
30
+ if (!isString(sourceUnwrapped) || sourceUnwrapped.trim() === "") {
31
+ src.value = toValue(config.errorSrc);
32
+ key.value = src.value;
33
+ error.value = new Error('"src" is not defined');
34
+ return;
35
+ }
36
+ const loadType = toValue(config.type);
37
+ const imgWidth = toValue(config.width);
38
+ if (import.meta.server || nuxtApp.isHydrating) {
39
+ switch (loadType) {
40
+ case "tmdb": {
41
+ src.value = getTmdbImageUrl(sourceUnwrapped, imgWidth ? toTmdbImageSize(imgWidth) : void 0);
42
+ break;
43
+ }
44
+ case "resee": {
45
+ const filename = toValue(config.friendlyName);
46
+ const reseeConfig = toValue(config.reseeConfig);
47
+ const width = fromTmdbImageSize(imgWidth, { originalIsUndefined: true });
48
+ src.value = getMediaAssetUrl(sourceUnwrapped, filename, { width, format: "webp", ...reseeConfig });
49
+ break;
50
+ }
51
+ default: {
52
+ src.value = sourceUnwrapped;
53
+ }
54
+ }
55
+ key.value = sourceUnwrapped;
56
+ return;
57
+ }
58
+ if (toValue(config.deferLoad)) {
59
+ return;
60
+ }
61
+ let pendingSource;
62
+ let pendingLoader;
63
+ if (loadType === "tmdb") {
64
+ const result = getTmdbImageCache().getImage(sourceUnwrapped, imgWidth);
65
+ pendingSource = isString(result) ? void 0 : result.placeholderUrl;
66
+ pendingLoader = result;
67
+ } else if (loadType === "resee") {
68
+ const filename = toValue(config.friendlyName);
69
+ const reseeConfig = toValue(config.reseeConfig);
70
+ const width = fromTmdbImageSize(imgWidth, { originalIsUndefined: true });
71
+ pendingLoader = loadImage(
72
+ getMediaAssetUrl(sourceUnwrapped, filename, { width, format: "webp", ...reseeConfig })
73
+ );
74
+ } else {
75
+ pendingLoader = loadImage(sourceUnwrapped);
76
+ }
77
+ if (isString(pendingLoader)) {
78
+ src.value = pendingLoader;
79
+ key.value = sourceUnwrapped;
80
+ loading.value = false;
81
+ bgLoading.value = false;
82
+ error.value = void 0;
83
+ return;
84
+ }
85
+ src.value = pendingSource ?? toValue(config.placeholderSrc) ?? src.value;
86
+ key.value = pendingSource ? sourceUnwrapped : void 0;
87
+ loading.value = !pendingSource;
88
+ bgLoading.value = !!pendingSource;
89
+ pendingLoader.then(
90
+ (loadedSrc) => {
91
+ src.value = loadedSrc;
92
+ key.value = sourceUnwrapped;
93
+ loading.value = false;
94
+ bgLoading.value = false;
95
+ error.value = void 0;
96
+ },
97
+ (e) => {
98
+ src.value = toValue(config.errorSrc) ?? toValue(config.placeholderSrc);
99
+ key.value = src.value;
100
+ loading.value = false;
101
+ bgLoading.value = false;
102
+ error.value = e;
103
+ }
104
+ );
105
+ },
106
+ { immediate: true }
107
+ );
108
+ return { src, key, error, loading, bgLoading };
109
+ }
@@ -1 +1 @@
1
- @custom-variant dark (&:where(.dark, .dark *));@variant dark{--color-global-background:var(--color-global-background-dark);--color-global-background-accent:var(--color-global-background-accent-dark);--color-global-foreground:var(--color-global-foreground-dark);--color-global-foreground-accent:var(--color-global-foreground-accent-dark);--color-invert-global-background:var(--color-global-background-lite);--color-invert-global-background-accent:var(--color-global-background-accent-lite);--color-invert-global-foreground:var(--color-global-foreground-lite);--color-invert-global-foreground-accent:var(--color-global-foreground-accent-lite);--color-background-scale-a:var(--color-background-scale-a-dark);--color-background-scale-b:var(--color-background-scale-b-dark);--color-background-scale-c:var(--color-background-scale-c-dark);--color-background-scale-d:var(--color-background-scale-d-dark);--color-background-scale-e:var(--color-background-scale-e-dark);--color-background-scale-f:var(--color-background-scale-f-dark);--color-background-scale-g:var(--color-background-scale-g-dark);--color-foreground-scale-a:var(--color-foreground-scale-a-dark);--color-foreground-scale-b:var(--color-foreground-scale-b-dark);--color-foreground-scale-c:var(--color-foreground-scale-c-dark);--color-foreground-scale-d:var(--color-foreground-scale-d-dark);--color-foreground-scale-e:var(--color-foreground-scale-e-dark);--color-foreground-scale-f:var(--color-foreground-scale-f-dark);--color-foreground-scale-g:var(--color-foreground-scale-g-dark);--color-invert-background-scale-a:var(--color-background-scale-a-lite);--color-invert-background-scale-b:var(--color-background-scale-b-lite);--color-invert-background-scale-c:var(--color-background-scale-c-lite);--color-invert-background-scale-d:var(--color-background-scale-d-lite);--color-invert-background-scale-e:var(--color-background-scale-e-lite);--color-invert-background-scale-f:var(--color-background-scale-f-lite);--color-invert-background-scale-g:var(--color-background-scale-g-lite);--color-invert-foreground-scale-a:var(--color-foreground-scale-a-lite);--color-invert-foreground-scale-b:var(--color-foreground-scale-b-lite);--color-invert-foreground-scale-c:var(--color-foreground-scale-c-lite);--color-invert-foreground-scale-d:var(--color-foreground-scale-d-lite);--color-invert-foreground-scale-e:var(--color-foreground-scale-e-lite);--color-invert-foreground-scale-f:var(--color-foreground-scale-f-lite);--color-invert-foreground-scale-g:var(--color-foreground-scale-g-lite);--color-info:var(--color-info-dark);--color-info-emphasis:var(--color-info-emphasis-dark);--color-info-contrast:var(--color-info-contrast-dark);--color-help:var(--color-help-dark);--color-help-emphasis:var(--color-help-emphasis-dark);--color-help-contrast:var(--color-help-contrast-dark);--color-success:var(--color-success-dark);--color-success-emphasis:var(--color-success-emphasis-dark);--color-success-contrast:var(--color-success-contrast-dark);--color-warning:var(--color-warning-dark);--color-warning-emphasis:var(--color-warning-emphasis-dark);--color-warning-contrast:var(--color-warning-contrast-dark);--color-danger:var(--color-danger-dark);--color-danger-emphasis:var(--color-danger-emphasis-dark);--color-danger-contrast:var(--color-danger-contrast-dark);--shadow-heavy:var(--shadow-heavy-dark);--shadow-heavy-right:var(--shadow-heavy-right-dark);--shadow-heavy-left:var(--shadow-heavy-left-dark);--shadow-heavy-top:var(--shadow-heavy-top-dark)}@theme{--font-sans:"Archivo",ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--zero-width-space:"​";--radius-full:9999px;--custom-accent-color:unset;--icon-size-small:--spacing(3.5);--icon-size-medium:--spacing(4);--icon-size-large:--spacing(6);--icon-size-jumbo:--spacing(12);--color-surface-0:oklch(100.0% 0 0);--color-surface-50:oklch(97.31% 0 0);--color-surface-100:oklch(92.80% 0 0);--color-surface-200:oklch(86.07% 0 0);--color-surface-300:oklch(75.72% 0 0);--color-surface-400:oklch(62.68% 0 0);--color-surface-500:oklch(53.48% 0 0);--color-surface-600:oklch(47.84% 0 0);--color-surface-700:oklch(42.76% 0 0);--color-surface-800:oklch(39.04% 0 0);--color-surface-850:oklch(37.53% 0 0);--color-surface-900:oklch(36.00% 0 0);--color-surface-925:oklch(28.50% 0 0);--color-surface-950:oklch(20.02% 0 0);--color-primary-50:oklch(97.94% 0.0171 103.14);--color-primary-100:oklch(94.93% 0.0459 101.86);--color-primary-200:oklch(89.80% 0.0854 99.1);--color-primary-300:oklch(83.23% 0.1222 96.48);--color-primary-400:oklch(76.65% 0.1387 91.06);--color-primary-500:oklch(71.00% 0.1307 86.56);--color-primary-600:oklch(61.31% 0.1146 77.38);--color-primary-700:oklch(50.50% 0.0943 67.44);--color-primary-800:oklch(44.38% 0.0782 62.58);--color-primary-900:oklch(39.94% 0.0661 58.15);--color-primary-950:oklch(27.10% 0.0457 53.29);--color-resee-red:oklch(57.47% 0.2229 28.19);--color-resee-orange:oklch(67.79% 0.201 41.61);--color-resee-yellow:oklch(84.78% 0.171 89.53);--color-resee-green:oklch(71.41% 0.1907 132.48);--color-resee-seaweed:oklch(59.95% 0.1179 167.71);--color-resee-aqua:oklch(74.55% 0.1224 209.96);--color-resee-blue:oklch(42.42% 0.1982 265.5);--color-resee-indigo:oklch(39.67% 0.1568 293.38);--color-resee-violet:oklch(46.25% 0.1488 353.55);--color-resee-lite-red:oklch(from var(--color-resee-red) calc(l + 0.22) c h);--color-resee-lite-orange:oklch(from var(--color-resee-orange) calc(l + 0.25) c h);--color-resee-lite-yellow:oklch(from var(--color-resee-yellow) calc(l + 0.30) calc(c - 0.03) h);--color-resee-lite-green:oklch(from var(--color-resee-green) calc(l + 0.30) calc(c + 0.02) h);--color-resee-lite-seaweed:oklch(from var(--color-resee-seaweed) calc(l + 0.20) c h);--color-resee-lite-aqua:oklch(from var(--color-resee-aqua) calc(l + 0.25) calc(c - 0.03) h);--color-resee-lite-blue:oklch(from var(--color-resee-blue) calc(l + 0.38) c h);--color-resee-lite-indigo:oklch(from var(--color-resee-indigo) calc(l + 0.45) calc(c + 0.1) h);--color-resee-lite-violet:oklch(from var(--color-resee-violet) calc(l + 0.30) calc(c - 0.05) h);--color-global-background-lite:var(--color-surface-50);--color-global-background-accent-lite:oklch(from var(--color-surface-50) calc(l - 0.15) c h);--color-global-foreground-lite:var(--color-surface-950);--color-global-foreground-accent-lite:var(--color-surface-700);--color-global-background-dark:var(--color-surface-950);--color-global-background-accent-dark:oklch(from var(--color-surface-950) calc(l + 0.15) c h);--color-global-foreground-dark:var(--color-surface-0);--color-global-foreground-accent-dark:var(--color-surface-400);--color-background-scale-a-lite:color-mix(in oklch,var(--color-surface-950) 5%,var(--color-global-background-lite));--color-background-scale-b-lite:color-mix(in oklch,var(--color-surface-950) 8%,var(--color-global-background-lite));--color-background-scale-c-lite:color-mix(in oklch,var(--color-surface-950) 11%,var(--color-global-background-lite));--color-background-scale-d-lite:color-mix(in oklch,var(--color-surface-950) 14%,var(--color-global-background-lite));--color-background-scale-e-lite:color-mix(in oklch,var(--color-surface-950) 17%,var(--color-global-background-lite));--color-background-scale-f-lite:color-mix(in oklch,var(--color-surface-950) 20%,var(--color-global-background-lite));--color-background-scale-g-lite:color-mix(in oklch,var(--color-surface-950) 29%,var(--color-global-background-lite));--color-background-scale-a-dark:color-mix(in oklch,var(--color-surface-0) 5%,var(--color-global-background-dark));--color-background-scale-b-dark:color-mix(in oklch,var(--color-surface-0) 8%,var(--color-global-background-dark));--color-background-scale-c-dark:color-mix(in oklch,var(--color-surface-0) 11%,var(--color-global-background-dark));--color-background-scale-d-dark:color-mix(in oklch,var(--color-surface-0) 14%,var(--color-global-background-dark));--color-background-scale-e-dark:color-mix(in oklch,var(--color-surface-0) 17%,var(--color-global-background-dark));--color-background-scale-f-dark:color-mix(in oklch,var(--color-surface-0) 20%,var(--color-global-background-dark));--color-background-scale-g-dark:color-mix(in oklch,var(--color-surface-0) 29%,var(--color-global-background-dark));--color-foreground-scale-a-lite:var(--color-background-scale-a-dark);--color-foreground-scale-b-lite:var(--color-background-scale-b-dark);--color-foreground-scale-c-lite:var(--color-background-scale-c-dark);--color-foreground-scale-d-lite:var(--color-background-scale-d-dark);--color-foreground-scale-e-lite:var(--color-background-scale-e-dark);--color-foreground-scale-f-lite:var(--color-background-scale-f-dark);--color-foreground-scale-g-lite:var(--color-background-scale-g-dark);--color-foreground-scale-a-dark:var(--color-background-scale-a-lite);--color-foreground-scale-b-dark:var(--color-background-scale-b-lite);--color-foreground-scale-c-dark:var(--color-background-scale-c-lite);--color-foreground-scale-d-dark:var(--color-background-scale-d-lite);--color-foreground-scale-e-dark:var(--color-background-scale-e-lite);--color-foreground-scale-f-dark:var(--color-background-scale-f-lite);--color-foreground-scale-g-dark:var(--color-background-scale-g-lite);--color-info-lite:#3b82f6;--color-info-emphasis-lite:#2563eb;--color-info-contrast-lite:#fff;--color-info-dark:var(--color-resee-aqua);--color-info-emphasis-dark:oklch(from var(--color-resee-aqua) calc(l + 0.1) c h);--color-info-contrast-dark:var(--color-surface-950);--color-help-lite:#8b5cf6;--color-help-emphasis-lite:#7c3aed;--color-help-contrast-lite:var(--color-surface-50);--color-help-dark:#c4b5fd;--color-help-emphasis-dark:#ddd6fe;--color-help-contrast-dark:var(--color-surface-950);--color-success-lite:#15803d;--color-success-emphasis-lite:#166534;--color-success-contrast-lite:var(--color-surface-50);--color-success-dark:var(--color-resee-lite-seaweed);--color-success-emphasis-dark:oklch(from var(--color-resee-lite-seaweed) calc(l + 0.02) c h);--color-success-contrast-dark:var(--color-surface-950);--color-warning-lite:#b45309;--color-warning-emphasis-lite:#92400e;--color-warning-contrast-lite:var(--color-surface-50);--color-warning-dark:#fbbf24;--color-warning-emphasis-dark:#fcd34d;--color-warning-contrast-dark:var(--color-surface-950);--color-danger-lite:#991b1b;--color-danger-emphasis-lite:#7f1d1d;--color-danger-contrast-lite:var(--color-surface-50);--color-danger-dark:#ef4444;--color-danger-emphasis-dark:#f87171;--color-danger-contrast-dark:var(--color-surface-950);--color-global-background:var(--color-global-background-lite);--color-global-background-accent:var(--color-global-background-accent-lite);--color-global-foreground:var(--color-global-foreground-lite);--color-global-foreground-accent:var(--color-global-foreground-accent-lite);--color-background-scale-a:var(--color-background-scale-a-lite);--color-background-scale-b:var(--color-background-scale-b-lite);--color-background-scale-c:var(--color-background-scale-c-lite);--color-background-scale-d:var(--color-background-scale-d-lite);--color-background-scale-e:var(--color-background-scale-e-lite);--color-background-scale-f:var(--color-background-scale-f-lite);--color-background-scale-g:var(--color-background-scale-g-lite);--color-foreground-scale-a:var(--color-foreground-scale-a-lite);--color-foreground-scale-b:var(--color-foreground-scale-b-lite);--color-foreground-scale-c:var(--color-foreground-scale-c-lite);--color-foreground-scale-d:var(--color-foreground-scale-d-lite);--color-foreground-scale-e:var(--color-foreground-scale-e-lite);--color-foreground-scale-f:var(--color-foreground-scale-f-lite);--color-foreground-scale-g:var(--color-foreground-scale-g-lite);--color-invert-global-background:var(--color-global-background-dark);--color-invert-global-background-accent:var(--color-global-background-accent-dark);--color-invert-global-foreground:var(--color-global-foreground-dark);--color-invert-global-foreground-accent:var(--color-global-foreground-accent-dark);--color-invert-background-scale-a:var(--color-background-scale-a-dark);--color-invert-background-scale-b:var(--color-background-scale-b-dark);--color-invert-background-scale-c:var(--color-background-scale-c-dark);--color-invert-background-scale-d:var(--color-background-scale-d-dark);--color-invert-background-scale-e:var(--color-background-scale-e-dark);--color-invert-background-scale-f:var(--color-background-scale-f-dark);--color-invert-background-scale-g:var(--color-background-scale-g-dark);--color-invert-foreground-scale-a:var(--color-foreground-scale-a-dark);--color-invert-foreground-scale-b:var(--color-foreground-scale-b-dark);--color-invert-foreground-scale-c:var(--color-foreground-scale-c-dark);--color-invert-foreground-scale-d:var(--color-foreground-scale-d-dark);--color-invert-foreground-scale-e:var(--color-foreground-scale-e-dark);--color-invert-foreground-scale-f:var(--color-foreground-scale-f-dark);--color-invert-foreground-scale-g:var(--color-foreground-scale-g-dark);--color-info:var(--color-info-lite);--color-info-emphasis:var(--color-info-emphasis-lite);--color-info-contrast:var(--color-info-contrast-lite);--color-help:var(--color-help-lite);--color-help-emphasis:var(--color-help-emphasis-lite);--color-help-contrast:var(--color-help-contrast-lite);--color-success:var(--color-success-lite);--color-success-emphasis:var(--color-success-emphasis-lite);--color-success-contrast:var(--color-success-contrast-lite);--color-warning:var(--color-warning-lite);--color-warning-emphasis:var(--color-warning-emphasis-lite);--color-warning-contrast:var(--color-warning-contrast-lite);--color-danger:var(--color-danger-lite);--color-danger-emphasis:var(--color-danger-emphasis-lite);--color-danger-contrast:var(--color-danger-contrast-lite);--colorscale-resee-linear:var(--color-resee-red) 0%,var(--color-resee-orange) 16.666%,var(--color-resee-yellow) 27.777%,var(--color-resee-green) 38.888%,var(--color-resee-seaweed) 49.999%,var(--color-resee-aqua) 60.000%,var(--color-resee-blue) 71.111%,var(--color-resee-indigo) 82.222%,var(--color-resee-violet) 100%;--colorscale-resee-linear-step:var(--color-resee-red) 0% 11.111%,var(--color-resee-orange) 11.111% 22.222%,var(--color-resee-yellow) 22.222% 33.333%,var(--color-resee-green) 33.333% 44.444%,var(--color-resee-seaweed) 44.444% 55.555%,var(--color-resee-aqua) 55.555% 66.666%,var(--color-resee-blue) 66.666% 77.777%,var(--color-resee-indigo) 77.777% 88.888%,var(--color-resee-violet) 88.888% 100%;--colorscale-resee-conic:var(--color-resee-violet) 18deg,var(--color-resee-red) 54deg,var(--color-resee-orange) 90deg,var(--color-resee-yellow) 126deg,var(--color-resee-green) 164deg,var(--color-resee-seaweed) 198deg,var(--color-resee-aqua) 234deg,var(--color-resee-blue) 270deg,var(--color-resee-indigo) 306deg,var(--color-resee-violet) 342deg;--colorscale-resee-conic-step:var(--color-resee-violet) 0deg 20deg,var(--color-resee-red) 20deg 60deg,var(--color-resee-orange) 60deg 100deg,var(--color-resee-yellow) 100deg 140deg,var(--color-resee-green) 140deg 180deg,var(--color-resee-seaweed) 180deg 220deg,var(--color-resee-aqua) 220deg 260deg,var(--color-resee-blue) 260deg 300deg,var(--color-resee-indigo) 300deg 340deg,var(--color-resee-violet) 340deg 360deg;--colorscale-resee-lite-linear:var(--color-resee-lite-red) 0%,var(--color-resee-lite-orange) 16.666%,var(--color-resee-lite-yellow) 27.777%,var(--color-resee-lite-green) 38.888%,var(--color-resee-lite-seaweed) 49.999%,var(--color-resee-lite-aqua) 60.000%,var(--color-resee-lite-blue) 71.111%,var(--color-resee-lite-indigo) 82.222%,var(--color-resee-lite-violet) 100%;--colorscale-resee-lite-linear-step:var(--color-resee-lite-red) 0% 11.111%,var(--color-resee-lite-orange) 11.111% 22.222%,var(--color-resee-lite-yellow) 22.222% 33.333%,var(--color-resee-lite-green) 33.333% 44.444%,var(--color-resee-lite-seaweed) 44.444% 55.555%,var(--color-resee-lite-aqua) 55.555% 66.666%,var(--color-resee-lite-blue) 66.666% 77.777%,var(--color-resee-lite-indigo) 77.777% 88.888%,var(--color-resee-lite-violet) 88.888% 100%;--colorscale-resee-lite-conic:var(--color-resee-lite-violet) 18deg,var(--color-resee-lite-red) 54deg,var(--color-resee-lite-orange) 90deg,var(--color-resee-lite-yellow) 126deg,var(--color-resee-lite-green) 164deg,var(--color-resee-lite-seaweed) 198deg,var(--color-resee-lite-aqua) 234deg,var(--color-resee-lite-blue) 270deg,var(--color-resee-lite-indigo) 306deg,var(--color-resee-lite-violet) 342deg;--colorscale-resee-lite-conic-step:var(--color-resee-lite-violet) 0deg 20deg,var(--color-resee-lite-red) 20deg 60deg,var(--color-resee-lite-orange) 60deg 100deg,var(--color-resee-lite-yellow) 100deg 140deg,var(--color-resee-lite-green) 140deg 180deg,var(--color-resee-lite-seaweed) 180deg 220deg,var(--color-resee-lite-aqua) 220deg 260deg,var(--color-resee-lite-blue) 260deg 300deg,var(--color-resee-lite-indigo) 300deg 340deg,var(--color-resee-lite-violet) 340deg 360deg;--shadow-heavy-lite:0 2px 3px rgba(0,0,0,.2);--shadow-heavy-right-lite:2px 0 3px rgba(0,0,0,.2);--shadow-heavy-left-lite:-2px 0 3px rgba(0,0,0,.2);--shadow-heavy-top-lite:0 -2px 3px rgba(0,0,0,.2);--shadow-heavy-dark:0 2px 3px rgba(0,0,0,.7);--shadow-heavy-right-dark:2px 0 3px rgba(0,0,0,.7);--shadow-heavy-left-dark:-2px 0 3px rgba(0,0,0,.7);--shadow-heavy-top-dark:0 -2px 3px rgba(0,0,0,.7);--shadow-heavy:var(--shadow-heavy-lite);--shadow-heavy-right:var(--shadow-heavy-right-lite);--shadow-heavy-left:var(--shadow-heavy-left-lite);--shadow-heavy-top:var(--shadow-heavy-top-lite)}
1
+ @custom-variant dark (&:where(.dark, .dark *));@variant dark{--color-global-background:var(--color-global-background-dark);--color-global-background-accent:var(--color-global-background-accent-dark);--color-global-foreground:var(--color-global-foreground-dark);--color-global-foreground-accent:var(--color-global-foreground-accent-dark);--color-invert-global-background:var(--color-global-background-lite);--color-invert-global-background-accent:var(--color-global-background-accent-lite);--color-invert-global-foreground:var(--color-global-foreground-lite);--color-invert-global-foreground-accent:var(--color-global-foreground-accent-lite);--color-background-scale-a:var(--color-background-scale-a-dark);--color-background-scale-b:var(--color-background-scale-b-dark);--color-background-scale-c:var(--color-background-scale-c-dark);--color-background-scale-d:var(--color-background-scale-d-dark);--color-background-scale-e:var(--color-background-scale-e-dark);--color-background-scale-f:var(--color-background-scale-f-dark);--color-background-scale-g:var(--color-background-scale-g-dark);--color-foreground-scale-a:var(--color-foreground-scale-a-dark);--color-foreground-scale-b:var(--color-foreground-scale-b-dark);--color-foreground-scale-c:var(--color-foreground-scale-c-dark);--color-foreground-scale-d:var(--color-foreground-scale-d-dark);--color-foreground-scale-e:var(--color-foreground-scale-e-dark);--color-foreground-scale-f:var(--color-foreground-scale-f-dark);--color-foreground-scale-g:var(--color-foreground-scale-g-dark);--color-invert-background-scale-a:var(--color-background-scale-a-lite);--color-invert-background-scale-b:var(--color-background-scale-b-lite);--color-invert-background-scale-c:var(--color-background-scale-c-lite);--color-invert-background-scale-d:var(--color-background-scale-d-lite);--color-invert-background-scale-e:var(--color-background-scale-e-lite);--color-invert-background-scale-f:var(--color-background-scale-f-lite);--color-invert-background-scale-g:var(--color-background-scale-g-lite);--color-invert-foreground-scale-a:var(--color-foreground-scale-a-lite);--color-invert-foreground-scale-b:var(--color-foreground-scale-b-lite);--color-invert-foreground-scale-c:var(--color-foreground-scale-c-lite);--color-invert-foreground-scale-d:var(--color-foreground-scale-d-lite);--color-invert-foreground-scale-e:var(--color-foreground-scale-e-lite);--color-invert-foreground-scale-f:var(--color-foreground-scale-f-lite);--color-invert-foreground-scale-g:var(--color-foreground-scale-g-lite);--color-info:var(--color-info-dark);--color-info-emphasis:var(--color-info-emphasis-dark);--color-info-contrast:var(--color-info-contrast-dark);--color-help:var(--color-help-dark);--color-help-emphasis:var(--color-help-emphasis-dark);--color-help-contrast:var(--color-help-contrast-dark);--color-success:var(--color-success-dark);--color-success-emphasis:var(--color-success-emphasis-dark);--color-success-contrast:var(--color-success-contrast-dark);--color-warning:var(--color-warning-dark);--color-warning-emphasis:var(--color-warning-emphasis-dark);--color-warning-contrast:var(--color-warning-contrast-dark);--color-danger:var(--color-danger-dark);--color-danger-emphasis:var(--color-danger-emphasis-dark);--color-danger-contrast:var(--color-danger-contrast-dark);--shadow-heavy:var(--shadow-heavy-dark);--shadow-heavy-right:var(--shadow-heavy-right-dark);--shadow-heavy-left:var(--shadow-heavy-left-dark);--shadow-heavy-top:var(--shadow-heavy-top-dark)}@theme{--font-sans:"Archivo",ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--zero-width-space:"​";--radius-full:9999px;--custom-accent-color:unset;--icon-size-small:--spacing(3.5);--icon-size-medium:--spacing(4);--icon-size-large:--spacing(6);--icon-size-jumbo:--spacing(12);--aspect-poster:2/3;--aspect-tall:4/5;--color-surface-0:oklch(100.0% 0 0);--color-surface-50:oklch(97.31% 0 0);--color-surface-100:oklch(92.80% 0 0);--color-surface-200:oklch(86.07% 0 0);--color-surface-300:oklch(75.72% 0 0);--color-surface-400:oklch(62.68% 0 0);--color-surface-500:oklch(53.48% 0 0);--color-surface-600:oklch(47.84% 0 0);--color-surface-700:oklch(42.76% 0 0);--color-surface-800:oklch(39.04% 0 0);--color-surface-850:oklch(37.53% 0 0);--color-surface-900:oklch(36.00% 0 0);--color-surface-925:oklch(28.50% 0 0);--color-surface-950:oklch(20.02% 0 0);--color-primary-50:oklch(97.94% 0.0171 103.14);--color-primary-100:oklch(94.93% 0.0459 101.86);--color-primary-200:oklch(89.80% 0.0854 99.1);--color-primary-300:oklch(83.23% 0.1222 96.48);--color-primary-400:oklch(76.65% 0.1387 91.06);--color-primary-500:oklch(71.00% 0.1307 86.56);--color-primary-600:oklch(61.31% 0.1146 77.38);--color-primary-700:oklch(50.50% 0.0943 67.44);--color-primary-800:oklch(44.38% 0.0782 62.58);--color-primary-900:oklch(39.94% 0.0661 58.15);--color-primary-950:oklch(27.10% 0.0457 53.29);--color-resee-red:oklch(57.47% 0.2229 28.19);--color-resee-orange:oklch(67.79% 0.201 41.61);--color-resee-yellow:oklch(84.78% 0.171 89.53);--color-resee-green:oklch(71.41% 0.1907 132.48);--color-resee-seaweed:oklch(59.95% 0.1179 167.71);--color-resee-aqua:oklch(74.55% 0.1224 209.96);--color-resee-blue:oklch(42.42% 0.1982 265.5);--color-resee-indigo:oklch(39.67% 0.1568 293.38);--color-resee-violet:oklch(46.25% 0.1488 353.55);--color-resee-lite-red:oklch(from var(--color-resee-red) calc(l + 0.22) c h);--color-resee-lite-orange:oklch(from var(--color-resee-orange) calc(l + 0.25) c h);--color-resee-lite-yellow:oklch(from var(--color-resee-yellow) calc(l + 0.30) calc(c - 0.03) h);--color-resee-lite-green:oklch(from var(--color-resee-green) calc(l + 0.30) calc(c + 0.02) h);--color-resee-lite-seaweed:oklch(from var(--color-resee-seaweed) calc(l + 0.20) c h);--color-resee-lite-aqua:oklch(from var(--color-resee-aqua) calc(l + 0.25) calc(c - 0.03) h);--color-resee-lite-blue:oklch(from var(--color-resee-blue) calc(l + 0.38) c h);--color-resee-lite-indigo:oklch(from var(--color-resee-indigo) calc(l + 0.45) calc(c + 0.1) h);--color-resee-lite-violet:oklch(from var(--color-resee-violet) calc(l + 0.30) calc(c - 0.05) h);--color-global-background-lite:var(--color-surface-50);--color-global-background-accent-lite:oklch(from var(--color-surface-50) calc(l - 0.15) c h);--color-global-foreground-lite:var(--color-surface-950);--color-global-foreground-accent-lite:var(--color-surface-700);--color-global-background-dark:var(--color-surface-950);--color-global-background-accent-dark:oklch(from var(--color-surface-950) calc(l + 0.15) c h);--color-global-foreground-dark:var(--color-surface-0);--color-global-foreground-accent-dark:var(--color-surface-400);--color-background-scale-a-lite:color-mix(in oklch,var(--color-surface-950) 5%,var(--color-global-background-lite));--color-background-scale-b-lite:color-mix(in oklch,var(--color-surface-950) 8%,var(--color-global-background-lite));--color-background-scale-c-lite:color-mix(in oklch,var(--color-surface-950) 11%,var(--color-global-background-lite));--color-background-scale-d-lite:color-mix(in oklch,var(--color-surface-950) 14%,var(--color-global-background-lite));--color-background-scale-e-lite:color-mix(in oklch,var(--color-surface-950) 17%,var(--color-global-background-lite));--color-background-scale-f-lite:color-mix(in oklch,var(--color-surface-950) 20%,var(--color-global-background-lite));--color-background-scale-g-lite:color-mix(in oklch,var(--color-surface-950) 29%,var(--color-global-background-lite));--color-background-scale-a-dark:color-mix(in oklch,var(--color-surface-0) 5%,var(--color-global-background-dark));--color-background-scale-b-dark:color-mix(in oklch,var(--color-surface-0) 8%,var(--color-global-background-dark));--color-background-scale-c-dark:color-mix(in oklch,var(--color-surface-0) 11%,var(--color-global-background-dark));--color-background-scale-d-dark:color-mix(in oklch,var(--color-surface-0) 14%,var(--color-global-background-dark));--color-background-scale-e-dark:color-mix(in oklch,var(--color-surface-0) 17%,var(--color-global-background-dark));--color-background-scale-f-dark:color-mix(in oklch,var(--color-surface-0) 20%,var(--color-global-background-dark));--color-background-scale-g-dark:color-mix(in oklch,var(--color-surface-0) 29%,var(--color-global-background-dark));--color-foreground-scale-a-lite:var(--color-background-scale-a-dark);--color-foreground-scale-b-lite:var(--color-background-scale-b-dark);--color-foreground-scale-c-lite:var(--color-background-scale-c-dark);--color-foreground-scale-d-lite:var(--color-background-scale-d-dark);--color-foreground-scale-e-lite:var(--color-background-scale-e-dark);--color-foreground-scale-f-lite:var(--color-background-scale-f-dark);--color-foreground-scale-g-lite:var(--color-background-scale-g-dark);--color-foreground-scale-a-dark:var(--color-background-scale-a-lite);--color-foreground-scale-b-dark:var(--color-background-scale-b-lite);--color-foreground-scale-c-dark:var(--color-background-scale-c-lite);--color-foreground-scale-d-dark:var(--color-background-scale-d-lite);--color-foreground-scale-e-dark:var(--color-background-scale-e-lite);--color-foreground-scale-f-dark:var(--color-background-scale-f-lite);--color-foreground-scale-g-dark:var(--color-background-scale-g-lite);--color-info-lite:#3b82f6;--color-info-emphasis-lite:#2563eb;--color-info-contrast-lite:#fff;--color-info-dark:var(--color-resee-aqua);--color-info-emphasis-dark:oklch(from var(--color-resee-aqua) calc(l + 0.1) c h);--color-info-contrast-dark:var(--color-surface-950);--color-help-lite:#8b5cf6;--color-help-emphasis-lite:#7c3aed;--color-help-contrast-lite:var(--color-surface-50);--color-help-dark:#c4b5fd;--color-help-emphasis-dark:#ddd6fe;--color-help-contrast-dark:var(--color-surface-950);--color-success-lite:#15803d;--color-success-emphasis-lite:#166534;--color-success-contrast-lite:var(--color-surface-50);--color-success-dark:var(--color-resee-lite-seaweed);--color-success-emphasis-dark:oklch(from var(--color-resee-lite-seaweed) calc(l + 0.02) c h);--color-success-contrast-dark:var(--color-surface-950);--color-warning-lite:#b45309;--color-warning-emphasis-lite:#92400e;--color-warning-contrast-lite:var(--color-surface-50);--color-warning-dark:#fbbf24;--color-warning-emphasis-dark:#fcd34d;--color-warning-contrast-dark:var(--color-surface-950);--color-danger-lite:#991b1b;--color-danger-emphasis-lite:#7f1d1d;--color-danger-contrast-lite:var(--color-surface-50);--color-danger-dark:#ef4444;--color-danger-emphasis-dark:#f87171;--color-danger-contrast-dark:var(--color-surface-950);--color-global-background:var(--color-global-background-lite);--color-global-background-accent:var(--color-global-background-accent-lite);--color-global-foreground:var(--color-global-foreground-lite);--color-global-foreground-accent:var(--color-global-foreground-accent-lite);--color-background-scale-a:var(--color-background-scale-a-lite);--color-background-scale-b:var(--color-background-scale-b-lite);--color-background-scale-c:var(--color-background-scale-c-lite);--color-background-scale-d:var(--color-background-scale-d-lite);--color-background-scale-e:var(--color-background-scale-e-lite);--color-background-scale-f:var(--color-background-scale-f-lite);--color-background-scale-g:var(--color-background-scale-g-lite);--color-foreground-scale-a:var(--color-foreground-scale-a-lite);--color-foreground-scale-b:var(--color-foreground-scale-b-lite);--color-foreground-scale-c:var(--color-foreground-scale-c-lite);--color-foreground-scale-d:var(--color-foreground-scale-d-lite);--color-foreground-scale-e:var(--color-foreground-scale-e-lite);--color-foreground-scale-f:var(--color-foreground-scale-f-lite);--color-foreground-scale-g:var(--color-foreground-scale-g-lite);--color-invert-global-background:var(--color-global-background-dark);--color-invert-global-background-accent:var(--color-global-background-accent-dark);--color-invert-global-foreground:var(--color-global-foreground-dark);--color-invert-global-foreground-accent:var(--color-global-foreground-accent-dark);--color-invert-background-scale-a:var(--color-background-scale-a-dark);--color-invert-background-scale-b:var(--color-background-scale-b-dark);--color-invert-background-scale-c:var(--color-background-scale-c-dark);--color-invert-background-scale-d:var(--color-background-scale-d-dark);--color-invert-background-scale-e:var(--color-background-scale-e-dark);--color-invert-background-scale-f:var(--color-background-scale-f-dark);--color-invert-background-scale-g:var(--color-background-scale-g-dark);--color-invert-foreground-scale-a:var(--color-foreground-scale-a-dark);--color-invert-foreground-scale-b:var(--color-foreground-scale-b-dark);--color-invert-foreground-scale-c:var(--color-foreground-scale-c-dark);--color-invert-foreground-scale-d:var(--color-foreground-scale-d-dark);--color-invert-foreground-scale-e:var(--color-foreground-scale-e-dark);--color-invert-foreground-scale-f:var(--color-foreground-scale-f-dark);--color-invert-foreground-scale-g:var(--color-foreground-scale-g-dark);--color-info:var(--color-info-lite);--color-info-emphasis:var(--color-info-emphasis-lite);--color-info-contrast:var(--color-info-contrast-lite);--color-help:var(--color-help-lite);--color-help-emphasis:var(--color-help-emphasis-lite);--color-help-contrast:var(--color-help-contrast-lite);--color-success:var(--color-success-lite);--color-success-emphasis:var(--color-success-emphasis-lite);--color-success-contrast:var(--color-success-contrast-lite);--color-warning:var(--color-warning-lite);--color-warning-emphasis:var(--color-warning-emphasis-lite);--color-warning-contrast:var(--color-warning-contrast-lite);--color-danger:var(--color-danger-lite);--color-danger-emphasis:var(--color-danger-emphasis-lite);--color-danger-contrast:var(--color-danger-contrast-lite);--colorscale-resee-linear:var(--color-resee-red) 0%,var(--color-resee-orange) 16.666%,var(--color-resee-yellow) 27.777%,var(--color-resee-green) 38.888%,var(--color-resee-seaweed) 49.999%,var(--color-resee-aqua) 60.000%,var(--color-resee-blue) 71.111%,var(--color-resee-indigo) 82.222%,var(--color-resee-violet) 100%;--colorscale-resee-linear-step:var(--color-resee-red) 0% 11.111%,var(--color-resee-orange) 11.111% 22.222%,var(--color-resee-yellow) 22.222% 33.333%,var(--color-resee-green) 33.333% 44.444%,var(--color-resee-seaweed) 44.444% 55.555%,var(--color-resee-aqua) 55.555% 66.666%,var(--color-resee-blue) 66.666% 77.777%,var(--color-resee-indigo) 77.777% 88.888%,var(--color-resee-violet) 88.888% 100%;--colorscale-resee-conic:var(--color-resee-violet) 18deg,var(--color-resee-red) 54deg,var(--color-resee-orange) 90deg,var(--color-resee-yellow) 126deg,var(--color-resee-green) 164deg,var(--color-resee-seaweed) 198deg,var(--color-resee-aqua) 234deg,var(--color-resee-blue) 270deg,var(--color-resee-indigo) 306deg,var(--color-resee-violet) 342deg;--colorscale-resee-conic-step:var(--color-resee-violet) 0deg 20deg,var(--color-resee-red) 20deg 60deg,var(--color-resee-orange) 60deg 100deg,var(--color-resee-yellow) 100deg 140deg,var(--color-resee-green) 140deg 180deg,var(--color-resee-seaweed) 180deg 220deg,var(--color-resee-aqua) 220deg 260deg,var(--color-resee-blue) 260deg 300deg,var(--color-resee-indigo) 300deg 340deg,var(--color-resee-violet) 340deg 360deg;--colorscale-resee-lite-linear:var(--color-resee-lite-red) 0%,var(--color-resee-lite-orange) 16.666%,var(--color-resee-lite-yellow) 27.777%,var(--color-resee-lite-green) 38.888%,var(--color-resee-lite-seaweed) 49.999%,var(--color-resee-lite-aqua) 60.000%,var(--color-resee-lite-blue) 71.111%,var(--color-resee-lite-indigo) 82.222%,var(--color-resee-lite-violet) 100%;--colorscale-resee-lite-linear-step:var(--color-resee-lite-red) 0% 11.111%,var(--color-resee-lite-orange) 11.111% 22.222%,var(--color-resee-lite-yellow) 22.222% 33.333%,var(--color-resee-lite-green) 33.333% 44.444%,var(--color-resee-lite-seaweed) 44.444% 55.555%,var(--color-resee-lite-aqua) 55.555% 66.666%,var(--color-resee-lite-blue) 66.666% 77.777%,var(--color-resee-lite-indigo) 77.777% 88.888%,var(--color-resee-lite-violet) 88.888% 100%;--colorscale-resee-lite-conic:var(--color-resee-lite-violet) 18deg,var(--color-resee-lite-red) 54deg,var(--color-resee-lite-orange) 90deg,var(--color-resee-lite-yellow) 126deg,var(--color-resee-lite-green) 164deg,var(--color-resee-lite-seaweed) 198deg,var(--color-resee-lite-aqua) 234deg,var(--color-resee-lite-blue) 270deg,var(--color-resee-lite-indigo) 306deg,var(--color-resee-lite-violet) 342deg;--colorscale-resee-lite-conic-step:var(--color-resee-lite-violet) 0deg 20deg,var(--color-resee-lite-red) 20deg 60deg,var(--color-resee-lite-orange) 60deg 100deg,var(--color-resee-lite-yellow) 100deg 140deg,var(--color-resee-lite-green) 140deg 180deg,var(--color-resee-lite-seaweed) 180deg 220deg,var(--color-resee-lite-aqua) 220deg 260deg,var(--color-resee-lite-blue) 260deg 300deg,var(--color-resee-lite-indigo) 300deg 340deg,var(--color-resee-lite-violet) 340deg 360deg;--shadow-heavy-lite:0 2px 3px rgba(0,0,0,.2);--shadow-heavy-right-lite:2px 0 3px rgba(0,0,0,.2);--shadow-heavy-left-lite:-2px 0 3px rgba(0,0,0,.2);--shadow-heavy-top-lite:0 -2px 3px rgba(0,0,0,.2);--shadow-heavy-dark:0 2px 3px rgba(0,0,0,.7);--shadow-heavy-right-dark:2px 0 3px rgba(0,0,0,.7);--shadow-heavy-left-dark:-2px 0 3px rgba(0,0,0,.7);--shadow-heavy-top-dark:0 -2px 3px rgba(0,0,0,.7);--shadow-heavy:var(--shadow-heavy-lite);--shadow-heavy-right:var(--shadow-heavy-right-lite);--shadow-heavy-left:var(--shadow-heavy-left-lite);--shadow-heavy-top:var(--shadow-heavy-top-lite)}
@@ -1 +1 @@
1
- @layer components{.tooltip{animation:show-tooltip calc(var(--default-transition-duration)*2) none var(--default-transition-timing-function);position:absolute}.tooltip .content{background:var(--color-invert-background-scale-c);border-radius:var(--radius-xs);color:var(--color-invert-global-foreground);line-height:0;padding:--spacing(3) --spacing(1.5);white-space:pre-line;word-break:break-word}.tooltip.left,.tooltip.right{padding:0 --spacing(1)}.tooltip.bottom,.tooltip.top{padding:--spacing(1) 0}.tooltip.top{box-shadow:var(--shadow-heavy);transform:translateY(--spacing(-1))}.tooltip.right{box-shadow:var(--shadow-heavy-left);transform:translateX(--spacing(1))}.tooltip.bottom{box-shadow:var(--shadow-heavy-top);transform:translateY(--spacing(1))}.tooltip.left{box-shadow:var(--shadow-heavy-right);transform:translateX(--spacing(-1))}.tooltip .arrow{border:solid transparent;height:0;position:absolute;width:0}.tooltip.left .arrow,.tooltip.right .arrow{border-bottom-width:--spacing(1);border-top-width:--spacing(1);margin-top:--spacing(-1)}.tooltip.bottom .arrow,.tooltip.top .arrow{border-left-width:--spacing(1);border-right-width:--spacing(1);margin-left:--spacing(-1)}.tooltip.top .arrow{border-bottom-width:0;border-top-color:var(--color-invert-background-scale-c);border-top-width:--spacing(1)}.tooltip.right .arrow{border-left-width:0;border-right-color:var(--color-invert-background-scale-c);border-right-width:--spacing(1)}.tooltip.bottom .arrow{border-bottom-color:var(--color-invert-background-scale-c);border-bottom-width:--spacing(1);border-top-width:0}.tooltip.left .arrow{border-left-color:var(--color-invert-background-scale-c);border-left-width:--spacing(1);border-right-width:0}@keyframes show-tooltip{0%{opacity:0}to{opacity:100%}}}
1
+ @layer components{.tooltip{animation:show-tooltip calc(var(--default-transition-duration)*2) none var(--default-transition-timing-function);position:absolute}.tooltip .content{background:var(--color-invert-background-scale-c);border-radius:var(--radius-xs);color:var(--color-invert-global-foreground);line-height:0;padding:--spacing(3) --spacing(1.5);white-space:pre-line;word-break:break-word}.tooltip[data-p-position=left],.tooltip[data-p-position=right]{padding:0 --spacing(1)}.tooltip[data-p-position=bottom],.tooltip[data-p-position=top]{padding:--spacing(1) 0}.tooltip[data-p-position=top]{box-shadow:var(--shadow-heavy);transform:translateY(--spacing(-1))}.tooltip[data-p-position=right]{box-shadow:var(--shadow-heavy-left);transform:translateX(--spacing(1))}.tooltip[data-p-position=bottom]{box-shadow:var(--shadow-heavy-top);transform:translateY(--spacing(1))}.tooltip[data-p-position=left]{box-shadow:var(--shadow-heavy-right);transform:translateX(--spacing(-1))}.tooltip .arrow{border:solid transparent;height:0;position:absolute;width:0}.tooltip[data-p-position=left] .arrow,.tooltip[data-p-position=right] .arrow{border-bottom-width:--spacing(1);border-top-width:--spacing(1);margin-top:--spacing(-1)}.tooltip[data-p-position=bottom] .arrow,.tooltip[data-p-position=top] .arrow{border-left-width:--spacing(1);border-right-width:--spacing(1);margin-left:--spacing(-1)}.tooltip[data-p-position=top] .arrow{border-bottom-width:0;border-top-color:var(--color-invert-background-scale-c);border-top-width:--spacing(1)}.tooltip[data-p-position=right] .arrow{border-left-width:0;border-right-color:var(--color-invert-background-scale-c);border-right-width:--spacing(1)}.tooltip[data-p-position=bottom] .arrow{border-bottom-color:var(--color-invert-background-scale-c);border-bottom-width:--spacing(1);border-top-width:0}.tooltip[data-p-position=left] .arrow{border-left-color:var(--color-invert-background-scale-c);border-left-width:--spacing(1);border-right-width:0}@keyframes show-tooltip{0%{opacity:0}to{opacity:100%}}}
@@ -1 +1 @@
1
- @layer base{.fade-enter-active,.fade-leave-active,.slide-x-enter-active,.slide-x-leave-active,.slide-y-enter-active,.slide-y-leave-active{transition:opacity;transition-duration:calc(var(--default-transition-duration)*2);transition-timing-function:var(--default-transition-timing-function)}.fade-enter-from,.fade-leave-to,.slide-x-enter-from,.slide-x-leave-to,.slide-y-enter-from,.slide-y-leave-to{opacity:0}@supports (interpolate-size:allow-keywords){.slide-y-enter-active,.slide-y-leave-active{interpolate-size:allow-keywords;height:-moz-max-content;height:max-content;overflow-y:clip;transition:opacity,height;transition-duration:calc(var(--default-transition-duration)*2);transition-timing-function:var(--default-transition-timing-function)}.slide-y-enter-from,.slide-y-leave-to{height:0}.slide-x-enter-active,.slide-x-leave-active{interpolate-size:allow-keywords;overflow-x:clip;transition:opacity,width;transition-duration:calc(var(--default-transition-duration)*2);transition-timing-function:var(--default-transition-timing-function);width:auto}.slide-x-enter-from,.slide-x-leave-to{width:0}}}
1
+ @layer base{.fade-enter-active,.fade-leave-active,.grow-x-enter-active,.grow-x-leave-active,.grow-y-enter-active,.grow-y-leave-active{transition:opacity;transition-duration:calc(var(--default-transition-duration)*2);transition-timing-function:var(--default-transition-timing-function)}.fade-enter-from,.fade-leave-to,.grow-x-enter-from,.grow-x-leave-to,.grow-y-enter-from,.grow-y-leave-to{opacity:0}@supports (interpolate-size:allow-keywords){.grow-y-enter-active,.grow-y-leave-active{interpolate-size:allow-keywords;height:-moz-max-content;height:max-content;overflow-y:clip;transition:opacity,height;transition-duration:calc(var(--default-transition-duration)*2);transition-timing-function:var(--default-transition-timing-function)}.grow-y-enter-from,.grow-y-leave-to{height:0}.grow-x-enter-active,.grow-x-leave-active{interpolate-size:allow-keywords;overflow-x:clip;transition:opacity,width;transition-duration:calc(var(--default-transition-duration)*2);transition-timing-function:var(--default-transition-timing-function);width:auto}.grow-x-enter-from,.grow-x-leave-to{width:0}}.slide-in-bottom-enter-active,.slide-in-bottom-leave-active,.slide-in-left-enter-active,.slide-in-left-leave-active,.slide-in-right-enter-active,.slide-in-right-leave-active,.slide-in-top-enter-active,.slide-in-top-leave-active{transition-duration:calc(var(--default-transition-duration)*3);transition-property:transform;transition-timing-function:var(--default-transition-timing-function)}.slide-in-left-enter-from,.slide-in-left-leave-to{transform:translateX(-100%)}.slide-in-right-enter-from,.slide-in-right-leave-to{transform:translateX(100%)}.slide-in-top-enter-from,.slide-in-top-leave-to{transform:translateY(-100%)}.slide-in-bottom-enter-from,.slide-in-bottom-leave-to{transform:translateY(100%)}.scale-enter-active,.scale-leave-active{transition-duration:calc(var(--default-transition-duration)*2);transition-property:opacity,transform;transition-timing-function:var(--default-transition-timing-function)}.scale-enter-from,.scale-leave-to{opacity:0;transform:scale(.85)}}
@@ -1 +1 @@
1
- @utility content-zero-width{content:var(--zero-width-space)}
1
+ @utility content-zero-width{content:var(--zero-width-space)}@utility occlude-background{backdrop-filter:blur(var(--blur-xs));background-color:--alpha(var(--color-black)/60%);transition-duration:calc(var(--default-transition-duration)*3);transition-property:background-color,backdrop-filter;&:has(>[class*=-enter-from],>[class*=-leave-active],>[class*=-leave-to]){backdrop-filter:blur(0);background-color:transparent}&.replace-scrollbar{border-inline-end:solid var(--p-scrollbar-width) var(--color-global-background)}}
@@ -1,11 +1,17 @@
1
1
  export interface ModuleOptions {
2
2
  defaultColorMode?: 'lite' | 'dark';
3
3
  usePreferredColorScheme?: boolean;
4
+ componentPrefix?: string;
4
5
  tailwind?: {
5
6
  plugins?: (string | undefined)[];
6
7
  sources?: (string | undefined)[];
7
8
  imports?: (string | undefined)[];
8
9
  };
10
+ primevue?: {
11
+ passthroughImport?: string;
12
+ componentPrefix?: string;
13
+ includeComponents?: string[];
14
+ };
9
15
  }
10
16
  export interface ModuleHooks {
11
17
  /** Allows extending sources for Tailwind CSS. */