Skip to content

Commit 426f9b3

Browse files
committed
Merge branch 'v2-local' into v2.x
2 parents 39c1a23 + 6fce38b commit 426f9b3

File tree

19 files changed

+445
-79
lines changed

19 files changed

+445
-79
lines changed

docs/core-concepts/settings/types.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -987,6 +987,7 @@ return [
987987
->presets([
988988
'heading' => [
989989
'fontFamily' => 'Inter',
990+
'fontWeight' => '700',
990991
'fontSize' => '2xl',
991992
'lineHeight' => 'tight',
992993
'fontStyle' => 'normal',
@@ -995,6 +996,7 @@ return [
995996
],
996997
'body' => [
997998
'fontFamily' => 'Inter',
999+
'fontWeight' => '400',
9981000
'fontSize' => 'base',
9991001
'lineHeight' => 'normal',
10001002
'fontStyle' => 'normal',
@@ -1035,6 +1037,7 @@ This generates CSS for typography styles:
10351037
[data-typography='heading'] {
10361038
--typography-font-family: 'Inter', sans-serif;
10371039
--typography-font-style: normal;
1040+
--typography-font-weight: 700;
10381041
--typography-font-size: 1.5rem;
10391042
--typography-line-height: 1.25;
10401043
--typography-letter-spacing: 0em;
@@ -1044,6 +1047,7 @@ This generates CSS for typography styles:
10441047
[data-typography='body'] {
10451048
--typography-font-family: 'Inter', sans-serif;
10461049
--typography-font-style: normal;
1050+
--typography-font-weight: 400;
10471051
--typography-font-size: 1rem;
10481052
--typography-line-height: 1.5;
10491053
--typography-letter-spacing: 0em;
@@ -1079,6 +1083,7 @@ h2,
10791083
h3 {
10801084
--typography-font-family: 'Inter', sans-serif;
10811085
--typography-font-style: normal;
1086+
--typography-font-weight: 700;
10821087
--typography-font-size: 1.5rem;
10831088
--typography-line-height: 1.25;
10841089
--typography-letter-spacing: 0em;
@@ -1091,6 +1096,7 @@ li,
10911096
td {
10921097
--typography-font-family: 'Inter', sans-serif;
10931098
--typography-font-style: normal;
1099+
--typography-font-weight: 400;
10941100
--typography-font-size: 1rem;
10951101
--typography-line-height: 1.5;
10961102
--typography-letter-spacing: 0em;
@@ -1106,6 +1112,7 @@ In your theme's CSS, apply the generated CSS variables to elements:
11061112
[data-typography] {
11071113
font-family: var(--typography-font-family);
11081114
font-style: var(--typography-font-style);
1115+
font-weight: var(--typography-font-weight);
11091116
font-size: var(--typography-font-size);
11101117
line-height: var(--typography-line-height);
11111118
letter-spacing: var(--typography-letter-spacing);
@@ -1120,6 +1127,7 @@ Each preset is an array with the following properties:
11201127
| Property | Type | Description | Required | Values |
11211128
| --------------- | ------------- | -------------------------------------- | -------- | -------------------------------------------------------------------------------------- |
11221129
| `fontFamily` | string\|null | Font family name | No | Any font family name |
1130+
| `fontWeight` | string | Font weight | Yes | `100`, `200`, `300`, `400`, `500`, `600`, `700`, `800`, `900` |
11231131
| `fontSize` | string\|array | Font size token or responsive config | Yes | `xs`, `sm`, `base`, `lg`, `xl`, `2xl`, `3xl`, `4xl`, `5xl`, `6xl`, `7xl`, `8xl`, `9xl` |
11241132
| `lineHeight` | string\|array | Line height token or responsive config | Yes | `none`, `tight`, `snug`, `normal`, `relaxed`, `loose` |
11251133
| `fontStyle` | string | Font style | Yes | `normal`, `italic` |
@@ -1175,6 +1183,7 @@ TypographyPresets::make('typography_presets', 'Typography Presets')
11751183
->presets([
11761184
'responsive-heading' => [
11771185
'fontFamily' => 'Inter',
1186+
'fontWeight' => '700',
11781187
'fontSize' => [
11791188
'_default' => '2xl', // Default size
11801189
'mobile' => 'xl', // max-width: 639px

resources/assets/editor/__tests__/craftile/features/updatePersistence.test.ts

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -196,51 +196,61 @@ describe('updatePersistence utilities', () => {
196196

197197
describe('determineBlocksToProcess', () => {
198198
it('should return block IDs that are not children of other updated blocks', () => {
199-
const blockIds = ['block1', 'block2'];
199+
const updatedBlocks = {
200+
block1: { id: 'block1', parentId: null },
201+
block2: { id: 'block2', parentId: 'block1' },
202+
};
200203
const allBlocks = {
201204
block1: { id: 'block1', parentId: null },
202205
block2: { id: 'block2', parentId: 'block1' },
203206
};
204207

205-
const result = determineBlocksToProcess(blockIds, allBlocks);
208+
const result = determineBlocksToProcess(Object.keys(updatedBlocks), allBlocks);
206209

207210
expect(result).toEqual(['block1']);
208211
});
209212

210213
it('should return parent of repeated ancestor', () => {
211-
const blockIds = ['block1'];
214+
const updatedBlocks = {
215+
block1: { id: 'block1', parentId: 'block2' },
216+
};
212217
const allBlocks = {
213218
block1: { id: 'block1', parentId: 'block2' },
214219
block2: { id: 'block2', parentId: 'block3', repeated: true },
215220
block3: { id: 'block3', parentId: null },
216221
};
217222

218-
const result = determineBlocksToProcess(blockIds, allBlocks);
223+
const result = determineBlocksToProcess(Object.keys(updatedBlocks), allBlocks);
219224

220225
expect(result).toEqual(['block3']);
221226
});
222227

223228
it('should return parent of ghost blocks', () => {
224-
const blockIds = ['block1'];
229+
const updatedBlocks = {
230+
block1: { id: 'block1', parentId: 'block2' },
231+
};
225232
const allBlocks = {
226233
block1: { id: 'block1', parentId: 'block2', ghost: true },
227234
block2: { id: 'block2', parentId: null },
228235
};
229236

230-
const result = determineBlocksToProcess(blockIds, allBlocks);
237+
const result = determineBlocksToProcess(Object.keys(updatedBlocks), allBlocks);
231238

232239
expect(result).toEqual(['block2']);
233240
});
234241

235242
it('should remove duplicates from result', () => {
236-
const blockIds = ['block1', 'block2'];
243+
const updatedBlocks = {
244+
block1: { id: 'block1', parentId: 'block3' },
245+
block2: { id: 'block2', parentId: 'block3' },
246+
};
237247
const allBlocks = {
238248
block1: { id: 'block1', parentId: 'block3', ghost: true },
239249
block2: { id: 'block2', parentId: 'block3', ghost: true },
240250
block3: { id: 'block3', parentId: null },
241251
};
242252

243-
const result = determineBlocksToProcess(blockIds, allBlocks);
253+
const result = determineBlocksToProcess(Object.keys(updatedBlocks), allBlocks);
244254

245255
expect(result).toEqual(['block3']);
246256
});

resources/assets/editor/auto-imports.d.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -135,6 +135,7 @@ declare global {
135135
const useBreakpoints: typeof import('@vueuse/core').useBreakpoints
136136
const useBroadcastChannel: typeof import('@vueuse/core').useBroadcastChannel
137137
const useBrowserLocation: typeof import('@vueuse/core').useBrowserLocation
138+
const useBunnyFonts: typeof import('./composables/useBunnyFonts').useBunnyFonts
138139
const useCached: typeof import('@vueuse/core').useCached
139140
const useClipboard: typeof import('@vueuse/core').useClipboard
140141
const useClipboardItems: typeof import('@vueuse/core').useClipboardItems
@@ -444,6 +445,7 @@ declare module 'vue' {
444445
readonly useBreakpoints: UnwrapRef<typeof import('@vueuse/core')['useBreakpoints']>
445446
readonly useBroadcastChannel: UnwrapRef<typeof import('@vueuse/core')['useBroadcastChannel']>
446447
readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
448+
readonly useBunnyFonts: UnwrapRef<typeof import('./composables/useBunnyFonts')['useBunnyFonts']>
447449
readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
448450
readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
449451
readonly useClipboardItems: UnwrapRef<typeof import('@vueuse/core')['useClipboardItems']>

resources/assets/editor/components.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ declare module 'vue' {
4242
IHeroiconsItalic: typeof import('~icons/heroicons/italic')['default']
4343
IHeroiconsLink: typeof import('~icons/heroicons/link')['default']
4444
IHeroiconsMagnifyingGlass: typeof import('~icons/heroicons/magnifying-glass')['default']
45+
IHeroiconsPencil: typeof import('~icons/heroicons/pencil')['default']
4546
IHeroiconsPlus: typeof import('~icons/heroicons/plus')['default']
4647
IHeroiconsQuestionMarkCircle: typeof import('~icons/heroicons/question-mark-circle')['default']
4748
IHeroiconsTrash: typeof import('~icons/heroicons/trash')['default']

resources/assets/editor/components/FontPicker.vue

Lines changed: 10 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,13 @@ import { Button } from '@craftile/editor/ui';
44
import { Dialog } from '@ark-ui/vue/dialog';
55
import { Field } from '@ark-ui/vue/field';
66
import useI18n from '../composables/i18n';
7+
import { useBunnyFonts } from '../composables/useBunnyFonts';
8+
import { toTitleCase } from '../utils/strings';
79
810
interface Font {
911
slug: string;
1012
name: string;
11-
weights: string[];
13+
weights: number[];
1214
styles: string[];
1315
}
1416
@@ -27,7 +29,12 @@ const model = defineModel({
2729
return v;
2830
}
2931
30-
return { slug: v, name: v.replace(/-/g, ' '), weights: [], styles: [] };
32+
return {
33+
slug: v,
34+
name: toTitleCase(v),
35+
weights: [],
36+
styles: []
37+
};
3138
},
3239
});
3340
@@ -37,33 +44,8 @@ const initialValue = ref<Font | null>(null);
3744
const isDirty = ref(false);
3845
const opened = ref(false);
3946
const search = ref('');
40-
const isFetching = ref(false);
41-
const fonts = ref<Font[]>([]);
42-
43-
const fetchFonts = async () => {
44-
isFetching.value = true;
45-
try {
46-
const response = await fetch('https://fonts.bunny.net/list');
47-
const data = await response.json();
48-
49-
const formatted: Font[] = [];
50-
Object.keys(data).forEach((key) => {
51-
formatted.push({
52-
slug: key,
53-
name: key.replace(/-/g, ' '),
54-
...(data as any)[key],
55-
});
56-
});
57-
58-
fonts.value = formatted;
59-
} catch (error) {
60-
console.error('Failed to fetch fonts:', error);
61-
} finally {
62-
isFetching.value = false;
63-
}
64-
};
6547
66-
onMounted(() => fetchFonts());
48+
const { fonts, isFetching } = useBunnyFonts();
6749
6850
const displayedFonts = computed(() => {
6951
if (!fonts.value) {

resources/assets/editor/components/ThemeSettingsPanel.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -112,4 +112,4 @@ const updateSetting = (id: string, value: any) => {
112112
</div>
113113
</div>
114114
</div>
115-
</template>
115+
</template>

resources/assets/editor/components/TypographyPicker.vue

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@ const typographyPresets = computed(() => {
1818
return {};
1919
}
2020
21-
// Find the TypographyPresets group setting
2221
const settingId = theme.value.settingsSchema
2322
.flatMap((obj) => obj.settings)
2423
.find((setting) => setting.type === 'typography_presets')?.id;
@@ -27,7 +26,6 @@ const typographyPresets = computed(() => {
2726
return {};
2827
}
2928
30-
// Return the presets from the group
3129
return theme.value.settings[settingId] || {};
3230
});
3331
@@ -45,11 +43,11 @@ const selectedPreset = computed(() => {
4543
});
4644
4745
const selectedLabel = computed(() => {
48-
if (!model.value) {
46+
if (!model.value || !selectedPreset.value) {
4947
return null;
5048
}
5149
52-
return toTitleCase(model.value);
50+
return selectedPreset.value.name || toTitleCase(model.value);
5351
});
5452
5553
function onSelectPreset(id: string) {

0 commit comments

Comments
 (0)