From fb652720514e75331638be980c85d3cc5f49614b Mon Sep 17 00:00:00 2001 From: shubham-kaushal Date: Sat, 30 Jul 2022 12:23:39 +0530 Subject: [PATCH] fix: (preset-style) font-family fallback and notf. --- LICENSE | 2 +- README.md | 2 +- packages/tastycss/README.md | 2 +- packages/tastycss/src/styles/preset.ts | 10 +++++++++- packages/tastycss/src/styles/reset.ts | 1 - packages/tastycss/src/tasty.tsx | 8 +++++--- packages/tastycss/src/utils/get-display-name.ts | 11 +++++++++++ packages/tastycss/src/utils/styles.ts | 6 +++--- 8 files changed, 31 insertions(+), 11 deletions(-) create mode 100644 packages/tastycss/src/utils/get-display-name.ts diff --git a/LICENSE b/LICENSE index d5e4338..ab92ed0 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ The MIT License (MIT) -Copyright (c) Breadcrumb Private Limited and its affiliates. +Copyright (c) Outpost Innovations, Inc. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index e3ad3af..0ce1cd9 100644 --- a/README.md +++ b/README.md @@ -89,6 +89,6 @@ Please follow our [contributing guidelines](CONTRIBUTING.md). ## License -TastyCSS is a project by [Forneu](https://forneu.com). +TastyCSS is a project by [Outpost](https://outpost.run). Released under the [MIT License](LICENSE). diff --git a/packages/tastycss/README.md b/packages/tastycss/README.md index e3ad3af..0ce1cd9 100644 --- a/packages/tastycss/README.md +++ b/packages/tastycss/README.md @@ -89,6 +89,6 @@ Please follow our [contributing guidelines](CONTRIBUTING.md). ## License -TastyCSS is a project by [Forneu](https://forneu.com). +TastyCSS is a project by [Outpost](https://outpost.run). Released under the [MIT License](LICENSE). diff --git a/packages/tastycss/src/styles/preset.ts b/packages/tastycss/src/styles/preset.ts index 5abd158..5b3d59a 100644 --- a/packages/tastycss/src/styles/preset.ts +++ b/packages/tastycss/src/styles/preset.ts @@ -3,7 +3,15 @@ import { Styles } from './types'; function setCSSValue(styles: Styles, styleName: string, presetName: string, isPropOnly = false) { styles[`--${styleName}`] = - presetName === 'inherit' ? 'inherit' : `var(--${presetName}-${styleName}, var(--default-${styleName}, inherit))`; + presetName === 'inherit' + ? 'inherit' + : presetName === 'default' + ? `var(--default-${styleName}, ${styleName === 'font-family' ? 'var(--font, sans-serif)' : ''})${ + styleName === 'font-family' ? ', var(--font, sans-serif)' : '' + }` + : `var(--${presetName}-${styleName}, var(--default-${styleName}, ${ + styleName === 'font-family' ? 'var(--font, sans-serif)' : '' + }))${styleName === 'font-family' ? ', var(--font, sans-serif)' : ''}`; if (!isPropOnly) { styles[styleName] = styles[`--${styleName}`]; diff --git a/packages/tastycss/src/styles/reset.ts b/packages/tastycss/src/styles/reset.ts index 9b974f7..1f2ddcc 100644 --- a/packages/tastycss/src/styles/reset.ts +++ b/packages/tastycss/src/styles/reset.ts @@ -5,7 +5,6 @@ const RESET_MAP = { { css: ` -webkit-appearance: none; -font-family: inherit; font-weight: inherit; word-spacing: initial; -webkit-text-fill-color: currentColor; diff --git a/packages/tastycss/src/tasty.tsx b/packages/tastycss/src/tasty.tsx index 3364140..de5b119 100644 --- a/packages/tastycss/src/tasty.tsx +++ b/packages/tastycss/src/tasty.tsx @@ -10,6 +10,7 @@ import { Styles, StylesInterface } from './styles/types'; import { BASE_STYLES } from './styles/list'; import { ResponsiveStyleValue } from './utils/styles'; import { mergeStyles } from './utils/mergeStyles'; +import { getDisplayName } from './utils/get-display-name'; type StyleList = readonly (keyof { [key in keyof StylesInterface]: StylesInterface[key]; @@ -110,9 +111,10 @@ function tasty>(Component, opti ); }); - _WrappedComponent.displayName = `TastyWrappedComponent(${ - Component.displayName ?? Component.name ?? defaultProps.qa ?? extendTag ?? 'Anonymous' - })`; + _WrappedComponent.displayName = `TastyWrappedComponent(${getDisplayName( + Component, + defaultProps.qa ?? extendTag ?? 'Anonymous', + )})`; return _WrappedComponent; } diff --git a/packages/tastycss/src/utils/get-display-name.ts b/packages/tastycss/src/utils/get-display-name.ts new file mode 100644 index 0000000..be08f57 --- /dev/null +++ b/packages/tastycss/src/utils/get-display-name.ts @@ -0,0 +1,11 @@ +import { ElementType } from 'react'; + +const DEFAULT_NAME = 'Anonymous'; + +export function getDisplayName(Component: ElementType, fallbackName = DEFAULT_NAME): string { + if (typeof Component === 'function') { + return Component.displayName ?? Component.name ?? fallbackName; + } + + return fallbackName; +} diff --git a/packages/tastycss/src/utils/styles.ts b/packages/tastycss/src/utils/styles.ts index 913b5d6..7ee962f 100644 --- a/packages/tastycss/src/utils/styles.ts +++ b/packages/tastycss/src/utils/styles.ts @@ -73,7 +73,7 @@ export const CUSTOM_UNITS = { gp: 'var(--column-gap)', // global setting wh: function wh(num) { - return `calc(var(--cube-visual-viewport-height) / 100 * ${num})`; + return `calc(var(--jenga-visual-viewport-height) / 100 * ${num})`; }, // span unit for GridProvider sp: function spanWidth(num) { @@ -418,7 +418,7 @@ export function parseColor(val, ignoreError = false) { if (!name) { if (!ignoreError && devMode) { - console.warn('CubeUIKit: incorrect color value:', val); + console.warn('JengaUIKit: incorrect color value:', val); } return {}; @@ -979,7 +979,7 @@ export function computeState( const func = COMPUTE_FUNC_MAP[computeModel[0]]; if (!func) { - console.warn('CubeUIKit: unexpected compute method in the model', computeModel); + console.warn('JengaUIKit: unexpected compute method in the model', computeModel); // return false; }