chore: move typography constants to the entity/Font layer
This commit is contained in:
@@ -1,2 +1,3 @@
|
|||||||
|
export * from './const/const';
|
||||||
export * from './store';
|
export * from './store';
|
||||||
export * from './types';
|
export * from './types';
|
||||||
|
|||||||
@@ -10,6 +10,7 @@ import { cn } from '$shared/shadcn/utils/shadcn-utils';
|
|||||||
import type { Snippet } from 'svelte';
|
import type { Snippet } from 'svelte';
|
||||||
import { prefersReducedMotion } from 'svelte/motion';
|
import { prefersReducedMotion } from 'svelte/motion';
|
||||||
import {
|
import {
|
||||||
|
DEFAULT_FONT_WEIGHT,
|
||||||
type UnifiedFont,
|
type UnifiedFont,
|
||||||
appliedFontsManager,
|
appliedFontsManager,
|
||||||
} from '../../model';
|
} from '../../model';
|
||||||
@@ -36,7 +37,7 @@ interface Props {
|
|||||||
|
|
||||||
let {
|
let {
|
||||||
font,
|
font,
|
||||||
weight = 400,
|
weight = DEFAULT_FONT_WEIGHT,
|
||||||
className,
|
className,
|
||||||
children,
|
children,
|
||||||
}: Props = $props();
|
}: Props = $props();
|
||||||
|
|||||||
@@ -1,28 +1,6 @@
|
|||||||
export { TypographyMenu } from './ui';
|
|
||||||
|
|
||||||
export {
|
export {
|
||||||
type ControlId,
|
createTypographySettingsManager,
|
||||||
controlManager,
|
type TypographySettingsManager,
|
||||||
DEFAULT_FONT_SIZE,
|
|
||||||
DEFAULT_FONT_WEIGHT,
|
|
||||||
DEFAULT_LETTER_SPACING,
|
|
||||||
DEFAULT_LINE_HEIGHT,
|
|
||||||
DEFAULT_TYPOGRAPHY_CONTROLS_DATA,
|
|
||||||
FONT_SIZE_STEP,
|
|
||||||
FONT_WEIGHT_STEP,
|
|
||||||
LINE_HEIGHT_STEP,
|
|
||||||
MAX_FONT_SIZE,
|
|
||||||
MAX_FONT_WEIGHT,
|
|
||||||
MAX_LINE_HEIGHT,
|
|
||||||
MIN_FONT_SIZE,
|
|
||||||
MIN_FONT_WEIGHT,
|
|
||||||
MIN_LINE_HEIGHT,
|
|
||||||
MULTIPLIER_L,
|
|
||||||
MULTIPLIER_M,
|
|
||||||
MULTIPLIER_S,
|
|
||||||
} from './model';
|
|
||||||
|
|
||||||
export {
|
|
||||||
createTypographyControlManager,
|
|
||||||
type TypographyControlManager,
|
|
||||||
} from './lib';
|
} from './lib';
|
||||||
|
export { typographySettingsStore } from './model';
|
||||||
|
export { TypographyMenu } from './ui';
|
||||||
|
|||||||
@@ -10,6 +10,12 @@
|
|||||||
* when displaying/editing, but the base size is what's stored.
|
* when displaying/editing, but the base size is what's stored.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
import {
|
||||||
|
DEFAULT_FONT_SIZE,
|
||||||
|
DEFAULT_FONT_WEIGHT,
|
||||||
|
DEFAULT_LETTER_SPACING,
|
||||||
|
DEFAULT_LINE_HEIGHT,
|
||||||
|
} from '$entities/Font';
|
||||||
import {
|
import {
|
||||||
type ControlDataModel,
|
type ControlDataModel,
|
||||||
type ControlModel,
|
type ControlModel,
|
||||||
@@ -19,13 +25,7 @@ import {
|
|||||||
createTypographyControl,
|
createTypographyControl,
|
||||||
} from '$shared/lib';
|
} from '$shared/lib';
|
||||||
import { SvelteMap } from 'svelte/reactivity';
|
import { SvelteMap } from 'svelte/reactivity';
|
||||||
import {
|
import { type ControlId } from '../../model';
|
||||||
type ControlId,
|
|
||||||
DEFAULT_FONT_SIZE,
|
|
||||||
DEFAULT_FONT_WEIGHT,
|
|
||||||
DEFAULT_LETTER_SPACING,
|
|
||||||
DEFAULT_LINE_HEIGHT,
|
|
||||||
} from '../../model';
|
|
||||||
|
|
||||||
type ControlOnlyFields<T extends string = string> = Omit<ControlModel<T>, keyof ControlDataModel>;
|
type ControlOnlyFields<T extends string = string> = Omit<ControlModel<T>, keyof ControlDataModel>;
|
||||||
|
|
||||||
|
|||||||
@@ -1,4 +1,11 @@
|
|||||||
/** @vitest-environment jsdom */
|
/** @vitest-environment jsdom */
|
||||||
|
import {
|
||||||
|
DEFAULT_FONT_SIZE,
|
||||||
|
DEFAULT_FONT_WEIGHT,
|
||||||
|
DEFAULT_LETTER_SPACING,
|
||||||
|
DEFAULT_LINE_HEIGHT,
|
||||||
|
DEFAULT_TYPOGRAPHY_CONTROLS_DATA,
|
||||||
|
} from '$entities/Font';
|
||||||
import {
|
import {
|
||||||
afterEach,
|
afterEach,
|
||||||
beforeEach,
|
beforeEach,
|
||||||
@@ -7,13 +14,6 @@ import {
|
|||||||
it,
|
it,
|
||||||
vi,
|
vi,
|
||||||
} from 'vitest';
|
} from 'vitest';
|
||||||
import {
|
|
||||||
DEFAULT_FONT_SIZE,
|
|
||||||
DEFAULT_FONT_WEIGHT,
|
|
||||||
DEFAULT_LETTER_SPACING,
|
|
||||||
DEFAULT_LINE_HEIGHT,
|
|
||||||
DEFAULT_TYPOGRAPHY_CONTROLS_DATA,
|
|
||||||
} from '../../model';
|
|
||||||
import {
|
import {
|
||||||
type TypographySettings,
|
type TypographySettings,
|
||||||
TypographySettingsManager,
|
TypographySettingsManager,
|
||||||
|
|||||||
@@ -1,23 +1,3 @@
|
|||||||
export {
|
|
||||||
DEFAULT_FONT_SIZE,
|
|
||||||
DEFAULT_FONT_WEIGHT,
|
|
||||||
DEFAULT_LETTER_SPACING,
|
|
||||||
DEFAULT_LINE_HEIGHT,
|
|
||||||
DEFAULT_TYPOGRAPHY_CONTROLS_DATA,
|
|
||||||
FONT_SIZE_STEP,
|
|
||||||
FONT_WEIGHT_STEP,
|
|
||||||
LINE_HEIGHT_STEP,
|
|
||||||
MAX_FONT_SIZE,
|
|
||||||
MAX_FONT_WEIGHT,
|
|
||||||
MAX_LINE_HEIGHT,
|
|
||||||
MIN_FONT_SIZE,
|
|
||||||
MIN_FONT_WEIGHT,
|
|
||||||
MIN_LINE_HEIGHT,
|
|
||||||
MULTIPLIER_L,
|
|
||||||
MULTIPLIER_M,
|
|
||||||
MULTIPLIER_S,
|
|
||||||
} from './const/const';
|
|
||||||
|
|
||||||
export {
|
export {
|
||||||
type ControlId,
|
type ControlId,
|
||||||
typographySettingsStore,
|
typographySettingsStore,
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
|
import { DEFAULT_TYPOGRAPHY_CONTROLS_DATA } from '$entities/Font';
|
||||||
import { createTypographySettingsManager } from '../../lib';
|
import { createTypographySettingsManager } from '../../lib';
|
||||||
import { DEFAULT_TYPOGRAPHY_CONTROLS_DATA } from '../const/const';
|
|
||||||
|
|
||||||
export type ControlId = 'font_size' | 'font_weight' | 'line_height' | 'letter_spacing';
|
export type ControlId = 'font_size' | 'font_weight' | 'line_height' | 'letter_spacing';
|
||||||
export const typographySettingsStore = createTypographySettingsManager(
|
export const typographySettingsStore = createTypographySettingsManager(
|
||||||
|
|||||||
@@ -6,6 +6,11 @@
|
|||||||
Desktop: inline bar with combo controls.
|
Desktop: inline bar with combo controls.
|
||||||
-->
|
-->
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
|
import {
|
||||||
|
MULTIPLIER_L,
|
||||||
|
MULTIPLIER_M,
|
||||||
|
MULTIPLIER_S,
|
||||||
|
} from '$entities/Font';
|
||||||
import type { ResponsiveManager } from '$shared/lib';
|
import type { ResponsiveManager } from '$shared/lib';
|
||||||
import { cn } from '$shared/shadcn/utils/shadcn-utils';
|
import { cn } from '$shared/shadcn/utils/shadcn-utils';
|
||||||
import {
|
import {
|
||||||
@@ -19,12 +24,7 @@ import { Popover } from 'bits-ui';
|
|||||||
import { getContext } from 'svelte';
|
import { getContext } from 'svelte';
|
||||||
import { cubicOut } from 'svelte/easing';
|
import { cubicOut } from 'svelte/easing';
|
||||||
import { fly } from 'svelte/transition';
|
import { fly } from 'svelte/transition';
|
||||||
import {
|
import { typographySettingsStore } from '../../model';
|
||||||
MULTIPLIER_L,
|
|
||||||
MULTIPLIER_M,
|
|
||||||
MULTIPLIER_S,
|
|
||||||
typographySettingsStore,
|
|
||||||
} from '../../model';
|
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -4,6 +4,7 @@
|
|||||||
-->
|
-->
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import {
|
import {
|
||||||
|
DEFAULT_FONT_WEIGHT,
|
||||||
FontApplicator,
|
FontApplicator,
|
||||||
FontVirtualList,
|
FontVirtualList,
|
||||||
type UnifiedFont,
|
type UnifiedFont,
|
||||||
@@ -80,7 +81,7 @@ $effect(() => {
|
|||||||
</div>
|
</div>
|
||||||
<FontVirtualList
|
<FontVirtualList
|
||||||
data-font-list
|
data-font-list
|
||||||
weight={typography.weight}
|
weight={DEFAULT_FONT_WEIGHT}
|
||||||
itemHeight={45}
|
itemHeight={45}
|
||||||
class="bg-transparent min-h-0 h-full scroll-stable pr-4"
|
class="bg-transparent min-h-0 h-full scroll-stable pr-4"
|
||||||
>
|
>
|
||||||
|
|||||||
Reference in New Issue
Block a user