@gluhar/app 5.0.8 → 5.0.9
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.
- package/CHANGELOG.md +761 -752
- package/README.md +64 -64
- package/package.json +5 -5
- package/dist/module.cjs +0 -5
- package/dist/module.d.mts +0 -21
- package/dist/module.d.ts +0 -21
- package/dist/module.json +0 -9
- package/dist/module.mjs +0 -59
- package/dist/runtime/components/GContactLink.vue +0 -49
- package/dist/runtime/components/GLenisScroller.vue +0 -40
- package/dist/runtime/components/GluharLogo.vue +0 -46
- package/dist/runtime/components/SanityImg.vue +0 -68
- package/dist/runtime/composables/useLenis.d.ts +0 -370
- package/dist/runtime/composables/useLenis.js +0 -101
- package/dist/runtime/composables/useSanityPage.d.ts +0 -23
- package/dist/runtime/composables/useSanityPage.js +0 -60
- package/dist/runtime/composables/useSeo.d.ts +0 -2
- package/dist/runtime/composables/useSeo.js +0 -34
- package/dist/runtime/stores/useGStore.d.ts +0 -122
- package/dist/runtime/stores/useGStore.js +0 -21
- package/dist/runtime/types/index.d.ts +0 -1
- package/dist/runtime/types/index.js +0 -0
- package/dist/runtime/utils/seo.d.ts +0 -3
- package/dist/runtime/utils/seo.js +0 -22
- package/dist/types.d.mts +0 -7
- package/dist/types.d.ts +0 -7
package/README.md
CHANGED
|
@@ -1,64 +1,64 @@
|
|
|
1
|
-
# `@gluhar/app`
|
|
2
|
-
|
|
3
|
-
[![npm version][npm-version-src]][npm-version-href]
|
|
4
|
-
[![npm downloads][npm-downloads-src]][npm-downloads-href]
|
|
5
|
-
[![License][license-src]][license-href]
|
|
6
|
-
[![Nuxt][nuxt-src]][nuxt-href]
|
|
7
|
-
|
|
8
|
-
Gluhar main package. This combines and configures @gluhar/theme, @gluhar/i18n, @gluhar/sanity and @gluhar/core into one main package. Provides numerous components, composables, utils and types.
|
|
9
|
-
|
|
10
|
-
[✨ Release Notes](/CHANGELOG.md)
|
|
11
|
-
|
|
12
|
-
## Installation
|
|
13
|
-
|
|
14
|
-
Install the module to your Nuxt application with one command:
|
|
15
|
-
|
|
16
|
-
```bash
|
|
17
|
-
npx nuxi module add @gluhar/app
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
## Usage
|
|
21
|
-
|
|
22
|
-
## Config
|
|
23
|
-
|
|
24
|
-
## Contribution
|
|
25
|
-
|
|
26
|
-
<details>
|
|
27
|
-
<summary>Local development</summary>
|
|
28
|
-
|
|
29
|
-
```bash
|
|
30
|
-
# Install dependencies
|
|
31
|
-
npm install
|
|
32
|
-
|
|
33
|
-
# Generate type stubs
|
|
34
|
-
npm run dev:prepare
|
|
35
|
-
|
|
36
|
-
# Develop with the playground
|
|
37
|
-
npm run dev
|
|
38
|
-
|
|
39
|
-
# Build the playground
|
|
40
|
-
npm run dev:build
|
|
41
|
-
|
|
42
|
-
# Run ESLint
|
|
43
|
-
npm run lint
|
|
44
|
-
|
|
45
|
-
# Run Vitest
|
|
46
|
-
npm run test
|
|
47
|
-
npm run test:watch
|
|
48
|
-
|
|
49
|
-
# Release new version
|
|
50
|
-
npm run release
|
|
51
|
-
```
|
|
52
|
-
|
|
53
|
-
</details>
|
|
54
|
-
|
|
55
|
-
<!-- Badges -->
|
|
56
|
-
|
|
57
|
-
[npm-version-src]: https://img.shields.io/npm/v/my-module/latest.svg?style=flat&colorA=020420&colorB=00DC82
|
|
58
|
-
[npm-version-href]: https://npmjs.com/package/my-module
|
|
59
|
-
[npm-downloads-src]: https://img.shields.io/npm/dm/my-module.svg?style=flat&colorA=020420&colorB=00DC82
|
|
60
|
-
[npm-downloads-href]: https://npmjs.com/package/my-module
|
|
61
|
-
[license-src]: https://img.shields.io/npm/l/my-module.svg?style=flat&colorA=020420&colorB=00DC82
|
|
62
|
-
[license-href]: https://npmjs.com/package/my-module
|
|
63
|
-
[nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
|
|
64
|
-
[nuxt-href]: https://nuxt.com
|
|
1
|
+
# `@gluhar/app`
|
|
2
|
+
|
|
3
|
+
[![npm version][npm-version-src]][npm-version-href]
|
|
4
|
+
[![npm downloads][npm-downloads-src]][npm-downloads-href]
|
|
5
|
+
[![License][license-src]][license-href]
|
|
6
|
+
[![Nuxt][nuxt-src]][nuxt-href]
|
|
7
|
+
|
|
8
|
+
Gluhar main package. This combines and configures @gluhar/theme, @gluhar/i18n, @gluhar/sanity and @gluhar/core into one main package. Provides numerous components, composables, utils and types.
|
|
9
|
+
|
|
10
|
+
[✨ Release Notes](/CHANGELOG.md)
|
|
11
|
+
|
|
12
|
+
## Installation
|
|
13
|
+
|
|
14
|
+
Install the module to your Nuxt application with one command:
|
|
15
|
+
|
|
16
|
+
```bash
|
|
17
|
+
npx nuxi module add @gluhar/app
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
## Usage
|
|
21
|
+
|
|
22
|
+
## Config
|
|
23
|
+
|
|
24
|
+
## Contribution
|
|
25
|
+
|
|
26
|
+
<details>
|
|
27
|
+
<summary>Local development</summary>
|
|
28
|
+
|
|
29
|
+
```bash
|
|
30
|
+
# Install dependencies
|
|
31
|
+
npm install
|
|
32
|
+
|
|
33
|
+
# Generate type stubs
|
|
34
|
+
npm run dev:prepare
|
|
35
|
+
|
|
36
|
+
# Develop with the playground
|
|
37
|
+
npm run dev
|
|
38
|
+
|
|
39
|
+
# Build the playground
|
|
40
|
+
npm run dev:build
|
|
41
|
+
|
|
42
|
+
# Run ESLint
|
|
43
|
+
npm run lint
|
|
44
|
+
|
|
45
|
+
# Run Vitest
|
|
46
|
+
npm run test
|
|
47
|
+
npm run test:watch
|
|
48
|
+
|
|
49
|
+
# Release new version
|
|
50
|
+
npm run release
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
</details>
|
|
54
|
+
|
|
55
|
+
<!-- Badges -->
|
|
56
|
+
|
|
57
|
+
[npm-version-src]: https://img.shields.io/npm/v/my-module/latest.svg?style=flat&colorA=020420&colorB=00DC82
|
|
58
|
+
[npm-version-href]: https://npmjs.com/package/my-module
|
|
59
|
+
[npm-downloads-src]: https://img.shields.io/npm/dm/my-module.svg?style=flat&colorA=020420&colorB=00DC82
|
|
60
|
+
[npm-downloads-href]: https://npmjs.com/package/my-module
|
|
61
|
+
[license-src]: https://img.shields.io/npm/l/my-module.svg?style=flat&colorA=020420&colorB=00DC82
|
|
62
|
+
[license-href]: https://npmjs.com/package/my-module
|
|
63
|
+
[nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
|
|
64
|
+
[nuxt-href]: https://nuxt.com
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gluhar/app",
|
|
3
|
-
"version": "5.0.
|
|
3
|
+
"version": "5.0.9",
|
|
4
4
|
"description": "Gluhar main package. This combines and configures @gluhar/theme, @gluhar/i18n, @gluhar/sanity and @gluhar/core into one main package. Provides numerous components, composables, utils and types.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -37,9 +37,9 @@
|
|
|
37
37
|
"test:watch": "vitest watch"
|
|
38
38
|
},
|
|
39
39
|
"dependencies": {
|
|
40
|
-
"@gluhar/core": "^
|
|
41
|
-
"@gluhar/i18n": "^4.0.
|
|
42
|
-
"@gluhar/sanity": "^5.0.
|
|
40
|
+
"@gluhar/core": "^4.0.0",
|
|
41
|
+
"@gluhar/i18n": "^4.0.3",
|
|
42
|
+
"@gluhar/sanity": "^5.0.3",
|
|
43
43
|
"@gluhar/theme": "^4.0.4",
|
|
44
44
|
"@gluhar/v-gsap-nuxt": "^1.5.1",
|
|
45
45
|
"@nuxt/image": "^1.10.0",
|
|
@@ -64,5 +64,5 @@
|
|
|
64
64
|
"nuxt": "^3.13.1",
|
|
65
65
|
"vitest": "^2.0.5"
|
|
66
66
|
},
|
|
67
|
-
"gitHead": "
|
|
67
|
+
"gitHead": "37c79c38049ee2d91e649523539808c2fdbffd88"
|
|
68
68
|
}
|
package/dist/module.cjs
DELETED
package/dist/module.d.mts
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import * as _nuxt_schema from '@nuxt/schema';
|
|
2
|
-
import { GluharI18nOptions } from '@gluhar/i18n';
|
|
3
|
-
import { GluharThemeOptions } from '@gluhar/theme';
|
|
4
|
-
import { GluharSanityOptions } from '@gluhar/sanity';
|
|
5
|
-
import { ModuleOptions } from 'v-gsap-nuxt';
|
|
6
|
-
import { ModuleOptions as ModuleOptions$1 } from '@nuxt/image';
|
|
7
|
-
import { ModuleOptions as ModuleOptions$2 } from 'dayjs-nuxt';
|
|
8
|
-
|
|
9
|
-
interface GluharAppOptions {
|
|
10
|
-
theme?: GluharThemeOptions | false;
|
|
11
|
-
i18n?: GluharI18nOptions | false;
|
|
12
|
-
sanity?: GluharSanityOptions | false;
|
|
13
|
-
vgsap?: (ModuleOptions & {
|
|
14
|
-
dev?: boolean;
|
|
15
|
-
}) | false;
|
|
16
|
-
image?: ModuleOptions$1 | false;
|
|
17
|
-
dayjs?: ModuleOptions$2 | false;
|
|
18
|
-
}
|
|
19
|
-
declare const _default: _nuxt_schema.NuxtModule<GluharAppOptions, GluharAppOptions, false>;
|
|
20
|
-
|
|
21
|
-
export { type GluharAppOptions, _default as default };
|
package/dist/module.d.ts
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import * as _nuxt_schema from '@nuxt/schema';
|
|
2
|
-
import { GluharI18nOptions } from '@gluhar/i18n';
|
|
3
|
-
import { GluharThemeOptions } from '@gluhar/theme';
|
|
4
|
-
import { GluharSanityOptions } from '@gluhar/sanity';
|
|
5
|
-
import { ModuleOptions } from 'v-gsap-nuxt';
|
|
6
|
-
import { ModuleOptions as ModuleOptions$1 } from '@nuxt/image';
|
|
7
|
-
import { ModuleOptions as ModuleOptions$2 } from 'dayjs-nuxt';
|
|
8
|
-
|
|
9
|
-
interface GluharAppOptions {
|
|
10
|
-
theme?: GluharThemeOptions | false;
|
|
11
|
-
i18n?: GluharI18nOptions | false;
|
|
12
|
-
sanity?: GluharSanityOptions | false;
|
|
13
|
-
vgsap?: (ModuleOptions & {
|
|
14
|
-
dev?: boolean;
|
|
15
|
-
}) | false;
|
|
16
|
-
image?: ModuleOptions$1 | false;
|
|
17
|
-
dayjs?: ModuleOptions$2 | false;
|
|
18
|
-
}
|
|
19
|
-
declare const _default: _nuxt_schema.NuxtModule<GluharAppOptions, GluharAppOptions, false>;
|
|
20
|
-
|
|
21
|
-
export { type GluharAppOptions, _default as default };
|
package/dist/module.json
DELETED
package/dist/module.mjs
DELETED
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
import { defineNuxtModule, createResolver, installModule, addImportsDir, addComponentsDir } from '@nuxt/kit';
|
|
2
|
-
import defu from 'defu';
|
|
3
|
-
|
|
4
|
-
const module = defineNuxtModule({
|
|
5
|
-
meta: {
|
|
6
|
-
name: "@gluhar/app",
|
|
7
|
-
configKey: "gluhar"
|
|
8
|
-
},
|
|
9
|
-
// Default configuration options of the Nuxt module
|
|
10
|
-
defaults: {},
|
|
11
|
-
async setup(options, nuxt) {
|
|
12
|
-
const { resolve } = createResolver(import.meta.url);
|
|
13
|
-
const { theme, i18n, sanity, vgsap, image, dayjs } = options;
|
|
14
|
-
await installModule("@gluhar/core");
|
|
15
|
-
await installModule("@pinia/nuxt");
|
|
16
|
-
if (theme !== false) {
|
|
17
|
-
await installModule("@gluhar/theme", theme);
|
|
18
|
-
}
|
|
19
|
-
if (i18n !== false) {
|
|
20
|
-
await installModule("@gluhar/i18n", i18n);
|
|
21
|
-
}
|
|
22
|
-
if (sanity !== false && i18n !== false) {
|
|
23
|
-
await installModule("@gluhar/sanity", sanity);
|
|
24
|
-
}
|
|
25
|
-
if (vgsap !== false) {
|
|
26
|
-
if (vgsap?.dev) {
|
|
27
|
-
await installModule("@gluhar/v-gsap-nuxt", vgsap);
|
|
28
|
-
} else {
|
|
29
|
-
await installModule("v-gsap-nuxt", vgsap);
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
if (image !== false) {
|
|
33
|
-
await installModule("@nuxt/image", image);
|
|
34
|
-
}
|
|
35
|
-
if (dayjs !== false) {
|
|
36
|
-
await installModule("dayjs-nuxt", dayjs);
|
|
37
|
-
}
|
|
38
|
-
addImportsDir(resolve("runtime/composables"));
|
|
39
|
-
addComponentsDir({ path: resolve("runtime/components") });
|
|
40
|
-
addImportsDir(resolve("runtime/stores"));
|
|
41
|
-
addImportsDir(resolve("runtime/utils"));
|
|
42
|
-
nuxt.options.vite = defu(nuxt.options.vite, {
|
|
43
|
-
esbuild: {
|
|
44
|
-
legalComments: "none"
|
|
45
|
-
},
|
|
46
|
-
build: {
|
|
47
|
-
terserOptions: {
|
|
48
|
-
format: {
|
|
49
|
-
comments: false
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
});
|
|
54
|
-
nuxt.options.experimental.watcher = "parcel";
|
|
55
|
-
nuxt.options.devtools.enabled = false;
|
|
56
|
-
}
|
|
57
|
-
});
|
|
58
|
-
|
|
59
|
-
export { module as default };
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
<script setup lang="ts">
|
|
2
|
-
import { useResponsive, computed, ref } from "#imports";
|
|
3
|
-
|
|
4
|
-
const props = defineProps<{
|
|
5
|
-
phone?: string;
|
|
6
|
-
email?: string;
|
|
7
|
-
onCopy?: () => void;
|
|
8
|
-
}>();
|
|
9
|
-
|
|
10
|
-
const defaultCursorText = "Copy to clipboard";
|
|
11
|
-
const cursorText = ref(defaultCursorText);
|
|
12
|
-
|
|
13
|
-
const { isMobile } = useResponsive();
|
|
14
|
-
|
|
15
|
-
const href = computed(() => {
|
|
16
|
-
if (!isMobile.value) return undefined;
|
|
17
|
-
return props.phone ? `tel:${props.phone}` : `mailto:${props.email}`;
|
|
18
|
-
});
|
|
19
|
-
|
|
20
|
-
const handleClick = async (isPhone: boolean) => {
|
|
21
|
-
const value = isPhone ? props.phone : props.email;
|
|
22
|
-
|
|
23
|
-
if (isMobile.value) return;
|
|
24
|
-
cursorText.value = "Copied!";
|
|
25
|
-
|
|
26
|
-
await navigator.clipboard.writeText(value!);
|
|
27
|
-
|
|
28
|
-
props.onCopy?.();
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
const onMouseLeave = () => {
|
|
32
|
-
cursorText.value = defaultCursorText;
|
|
33
|
-
};
|
|
34
|
-
</script>
|
|
35
|
-
|
|
36
|
-
<template>
|
|
37
|
-
<a :href v-bind="$attrs" v-if="isMobile">
|
|
38
|
-
<slot> {{ phone || email }} </slot>
|
|
39
|
-
</a>
|
|
40
|
-
<div
|
|
41
|
-
:data-cursor-text="cursorText"
|
|
42
|
-
@mousedown="handleClick(!!phone)"
|
|
43
|
-
@mouseleave="onMouseLeave"
|
|
44
|
-
v-bind="$attrs"
|
|
45
|
-
v-else
|
|
46
|
-
>
|
|
47
|
-
<slot> {{ phone || email }} </slot>
|
|
48
|
-
</div>
|
|
49
|
-
</template>
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
<script setup lang="ts">
|
|
2
|
-
import { useResizeObserver } from "@vueuse/core";
|
|
3
|
-
import { ref, type CSSProperties } from "vue";
|
|
4
|
-
import { useLenis } from "#imports";
|
|
5
|
-
|
|
6
|
-
defineProps<{
|
|
7
|
-
contentClass?: string;
|
|
8
|
-
contentStyle?: CSSProperties;
|
|
9
|
-
}>();
|
|
10
|
-
|
|
11
|
-
const scrollerRef = ref<HTMLDivElement>();
|
|
12
|
-
const contentRef = ref<HTMLDivElement>();
|
|
13
|
-
|
|
14
|
-
const { lenis } = useLenis(scrollerRef);
|
|
15
|
-
|
|
16
|
-
const prevHeight = ref(0);
|
|
17
|
-
|
|
18
|
-
useResizeObserver(contentRef, (entries) => {
|
|
19
|
-
const entry = entries[0];
|
|
20
|
-
const { height } = entry.contentRect;
|
|
21
|
-
|
|
22
|
-
if (height === prevHeight.value) return;
|
|
23
|
-
|
|
24
|
-
prevHeight.value = height;
|
|
25
|
-
lenis.value?.resize();
|
|
26
|
-
});
|
|
27
|
-
|
|
28
|
-
defineExpose({
|
|
29
|
-
lenis,
|
|
30
|
-
scrollerRef,
|
|
31
|
-
});
|
|
32
|
-
</script>
|
|
33
|
-
|
|
34
|
-
<template>
|
|
35
|
-
<div class="lenis-scroller overflow-y-auto" ref="scrollerRef">
|
|
36
|
-
<div :class="contentClass" :style="contentStyle" ref="contentRef">
|
|
37
|
-
<slot />
|
|
38
|
-
</div>
|
|
39
|
-
</div>
|
|
40
|
-
</template>
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
<script setup lang="ts"></script>
|
|
2
|
-
|
|
3
|
-
<template>
|
|
4
|
-
<svg viewBox="0 0 262.1 89" class="fill-secondary-base">
|
|
5
|
-
<path
|
|
6
|
-
d="M229.5,28l-15.8-14.6l4.7-4.7l12.2,13.2L229.8,0h6.6l-0.9,21.9L249,6.8l4.7,4.7l-17,16.5l13.9,12.8l-4.7,4.7
|
|
7
|
-
l-12.8-13.9c-6.4,6.6-10.6,12.6-13.3,18.1c-2.9,6-4.2,12.8-4.2,23.3H209c0-11.1,1.3-19,4.9-26.2C217,40.3,222.9,34.7,229.5,28z
|
|
8
|
-
M262.1,31.3l-14.9-0.9v-4.8l14.9-0.9V31.3z"
|
|
9
|
-
/>
|
|
10
|
-
<path
|
|
11
|
-
d="M181.4,72.6V38.4h6.2l0.6,5c0.9-1.9,2.4-3.3,4.4-4.2c2-1,4.1-1.4,6.2-1.4c3.7,0,6.9,1.1,9.6,3.2l-2.9,5.6
|
|
12
|
-
c-1.9-1.6-4.1-2.4-6.7-2.4c-1.7,0-3.4,0.4-4.9,1.2s-2.7,1.9-3.7,3.4s-1.5,3.2-1.5,5.2v18.7L181.4,72.6L181.4,72.6z"
|
|
13
|
-
/>
|
|
14
|
-
<path
|
|
15
|
-
d="M153.5,73.5c-4,0-7.4-0.9-10.3-2.7c-2.8-1.9-4.2-4.7-4.2-8.4s1.3-6.4,4-8c2.7-1.7,6.1-2.5,10.1-2.5h13.5
|
|
16
|
-
c-0.2-2.3-1.3-4.2-3.3-5.7c-2-1.4-4.4-2.2-7.2-2.2c-2.1,0-4,0.4-6,1.2c-1.9,0.8-3.4,2-4.4,3.4l-5.3-2.9c1.6-2.7,3.8-4.7,6.5-6.1
|
|
17
|
-
c2.8-1.4,5.9-2.2,9.1-2.2c3.1,0,6,0.6,8.7,1.7c2.8,1.1,5,2.8,6.7,5s2.6,4.8,2.6,7.8v14l0.3,6.5h-6.9l-0.6-5.2
|
|
18
|
-
c-1.1,2-2.9,3.5-5.2,4.6C159.4,73,156.7,73.5,153.5,73.5z M154.2,67c3.3,0,6.3-0.6,8.8-1.8c2.5-1.2,3.8-3.4,3.8-6.5v-1.1h-13.5
|
|
19
|
-
c-1.9,0-3.5,0.4-4.9,1.1c-1.3,0.8-2,1.9-2,3.5c0,1.7,0.8,2.9,2.4,3.7C150.4,66.7,152.2,67,154.2,67z"
|
|
20
|
-
/>
|
|
21
|
-
<path
|
|
22
|
-
d="M98.8,72.6V22.3h7.4v21.1c1-1.9,2.5-3.3,4.4-4.2c1.9-1,4.1-1.4,6.5-1.4c4.7,0,8.8,1.4,12.1,4.2s5,7.2,5,13.2v17.4h-7.5V55
|
|
23
|
-
c0-3.8-0.9-6.7-2.7-8.5c-1.9-1.8-4.2-2.8-7-2.8c-1.8,0-3.5,0.4-5.2,1.3c-1.6,0.9-3,2.2-4,3.9s-1.5,3.9-1.5,6.4v17.2L98.8,72.6
|
|
24
|
-
L98.8,72.6z"
|
|
25
|
-
/>
|
|
26
|
-
<path
|
|
27
|
-
d="M73.1,73.2c-4.7,0-8.8-1.4-12.1-4.2c-3.3-2.8-5-7.2-5-13.2V38.4h7.5v17.5c0,3.8,0.9,6.7,2.7,8.5c1.9,1.8,4.2,2.8,7,2.8
|
|
28
|
-
c1.8,0,3.5-0.4,5.2-1.3c1.6-0.9,2.9-2.2,3.9-3.9c1.1-1.8,1.6-3.9,1.6-6.5V38.4h7.4v34.2h-6.6l-0.6-5c-1,1.9-2.5,3.3-4.5,4.2
|
|
29
|
-
S75.5,73.2,73.1,73.2z"
|
|
30
|
-
/>
|
|
31
|
-
<path d="M50,72.6h-7.4V22.3H50V72.6z" />
|
|
32
|
-
<path
|
|
33
|
-
d="M19.8,89c-4.1,0-7.7-0.4-10.6-1.3c-3-0.9-5.3-2.6-6.9-5.2c-1-1.6-1.5-3.4-1.5-5.3c0-1.5,0.3-2.8,0.9-4.1
|
|
34
|
-
c0.6-1.2,1.5-2.2,2.7-2.9c-1.4-0.5-2.5-1.3-3.3-2.4C0.4,66.7,0,65.4,0,63.9c0-1.6,0.5-3,1.4-4.2c1-1.2,2.3-2,3.9-2.4
|
|
35
|
-
c-1-0.9-1.7-1.9-2.2-3.2c-0.5-1.2-0.8-2.5-0.8-3.7c0-2.8,0.8-5.2,2.5-7.2c1.6-1.9,3.8-3.3,6.5-4.1c2.7-0.9,5.6-1.2,8.5-1.1L37,38.3
|
|
36
|
-
v0.8v3.7v0.9l-3.4-0.1l-1.9-0.1c1.3,0.8,2.3,1.8,3.1,3S36,49,36,50.4c0,2.8-0.8,5.1-2.4,7c-1.6,1.9-3.7,3.3-6.2,4.3
|
|
37
|
-
c-2.5,0.9-5.2,1.4-8,1.4c-2.4,0-4.8-0.3-7.2-1C11,61.8,9.9,61.6,9,61.6c-0.5,0-1,0.1-1.4,0.2c-0.5,0.2-0.8,0.5-1.1,0.9
|
|
38
|
-
c-0.2,0.3-0.4,0.7-0.4,1.1c0,0.6,0.3,1.2,0.9,1.7c0.7,0.5,1.6,0.7,2.8,0.7H19c5.5,0,10,0.7,13.6,2.1c3.7,1.3,5.5,4.1,5.5,8.3
|
|
39
|
-
c0,3-0.9,5.4-2.8,7.2c-1.9,1.9-4.2,3.2-7,4C25.6,88.6,22.7,89,19.8,89z M19.3,57.2c2.3,0,4.5-0.6,6.5-1.7c2-1.1,2.9-2.8,2.9-5
|
|
40
|
-
c0-2.1-0.9-3.7-2.8-4.9c-1.9-1.1-4.1-1.7-6.7-1.7s-4.9,0.6-6.7,1.7c-1.9,1.1-2.8,2.8-2.8,4.9c0,2.3,1,4,2.9,5.1
|
|
41
|
-
C14.6,56.6,16.9,57.2,19.3,57.2z M19.7,82.7c3.1,0,5.7-0.6,7.8-1.7c2.2-1.1,3.2-2.7,3.2-4.8c0-1.3-0.5-2.3-1.6-2.8s-2.4-0.9-4.1-1.1
|
|
42
|
-
c-0.8-0.1-2-0.1-3.5-0.1h-2.4h-9c-0.9,0.4-1.5,1-2,1.7s-0.7,1.5-0.7,2.3c0,1.1,0.4,2.1,1.1,3c0.9,1.1,2.4,2,4.5,2.6
|
|
43
|
-
C15.1,82.4,17.3,82.7,19.7,82.7z"
|
|
44
|
-
/>
|
|
45
|
-
</svg>
|
|
46
|
-
</template>
|
|
@@ -1,68 +0,0 @@
|
|
|
1
|
-
<script setup lang="ts">
|
|
2
|
-
import { computed, ref, useMessages } from "#imports";
|
|
3
|
-
import type { LocaleString } from "@gluhar/i18n/types";
|
|
4
|
-
import type { SanityImage } from "@gluhar/sanity/types";
|
|
5
|
-
// @ts-ignore
|
|
6
|
-
import imageUrlBuilder from "@sanity/image-url/lib/browser/image-url.esm"; // INFO this is a strange fix
|
|
7
|
-
// import imageUrlBuilder from "@sanity/image-url";
|
|
8
|
-
import type { CropMode, ImageFormat } from "@sanity/image-url/lib/types/types";
|
|
9
|
-
import sanityConfig from "~/config/sanity.config";
|
|
10
|
-
|
|
11
|
-
const props = defineProps<{
|
|
12
|
-
image?: SanityImage;
|
|
13
|
-
by?: "width" | "height" | "both";
|
|
14
|
-
alt?: LocaleString;
|
|
15
|
-
width?: number;
|
|
16
|
-
height?: number;
|
|
17
|
-
format?: ImageFormat | null;
|
|
18
|
-
crop?: CropMode;
|
|
19
|
-
dpr?: number;
|
|
20
|
-
}>();
|
|
21
|
-
|
|
22
|
-
const { l } = useMessages();
|
|
23
|
-
|
|
24
|
-
const builder = imageUrlBuilder(sanityConfig);
|
|
25
|
-
const urlFor = (source: SanityImage) => builder.image(source);
|
|
26
|
-
|
|
27
|
-
const imgRef = ref<HTMLImageElement | null>(null);
|
|
28
|
-
const src = computed(() => {
|
|
29
|
-
const { width, height } = imgRef.value?.getBoundingClientRect() || {
|
|
30
|
-
width: undefined,
|
|
31
|
-
height: undefined,
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
if (!props.image?.asset || (!width && !height)) return undefined;
|
|
35
|
-
|
|
36
|
-
let url = urlFor(props.image);
|
|
37
|
-
|
|
38
|
-
if (props.width) url = url.width(props.width);
|
|
39
|
-
else if (width && (props.by === "width" || !props.by))
|
|
40
|
-
url = url.width(Math.ceil(width));
|
|
41
|
-
|
|
42
|
-
if (props.height) url = url.height(props.height);
|
|
43
|
-
else if (height && (props.by === "height" || !props.by))
|
|
44
|
-
url = url.height(Math.ceil(height));
|
|
45
|
-
|
|
46
|
-
if (props.crop) url = url.fit("crop").crop(props.crop);
|
|
47
|
-
|
|
48
|
-
url = url.format(props.format ?? "webp");
|
|
49
|
-
url = url.quality(100);
|
|
50
|
-
|
|
51
|
-
url = url.dpr(
|
|
52
|
-
props.dpr || typeof window !== "undefined" ? window.devicePixelRatio : 1,
|
|
53
|
-
);
|
|
54
|
-
|
|
55
|
-
return url.url();
|
|
56
|
-
});
|
|
57
|
-
</script>
|
|
58
|
-
|
|
59
|
-
<template>
|
|
60
|
-
<img
|
|
61
|
-
class="object-cover"
|
|
62
|
-
:style="{ aspectRatio: image?.asset?.metadata?.dimensions?.aspectRatio }"
|
|
63
|
-
:src
|
|
64
|
-
:alt="l(alt) || l(image.caption) || l(image.alt)"
|
|
65
|
-
ref="imgRef"
|
|
66
|
-
v-if="image"
|
|
67
|
-
/>
|
|
68
|
-
</template>
|