Skip to content

Commit

Permalink
add default border (#1117)
Browse files Browse the repository at this point in the history
  • Loading branch information
@lukasoppermann
lukasoppermann authored Dec 11, 2024
1 parent 794b116 commit b516379
Show file tree
Hide file tree
Showing 19 changed files with 727 additions and 732 deletions.
5 changes: 5 additions & 0 deletions .changeset/pretty-donkeys-sell.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@primer/primitives': patch
---

Add default border and fix wrong dark color token
12 changes: 5 additions & 7 deletions scripts/buildFigma.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,12 +78,10 @@ const buildFigma = async (buildOptions: ConfigGeneratorOptions): Promise<void> =
* Size tokens
* ----------------------------------- */
const sizeFiles = [
'src/tokens/base/size/size.json',
'src/tokens/functional/size/breakpoints.json',
'src/tokens/functional/size/size.json',
'src/tokens/functional/size/border.json',
// 'src/tokens/functional/size/size-fine.json',
// 'src/tokens/functional/size/size-coarse.json',
'src/tokens/base/size/size.json5',
'src/tokens/functional/size/breakpoints.json5',
'src/tokens/functional/size/size.json5',
'src/tokens/functional/size/border.json5',
]
//
const sizeExtended = await PrimerStyleDictionary.extend({
Expand All @@ -101,7 +99,7 @@ const buildFigma = async (buildOptions: ConfigGeneratorOptions): Promise<void> =
* ----------------------------------- */
//
const typeExtended = await PrimerStyleDictionary.extend({
source: ['src/tokens/base/typography/typography.json', 'src/tokens/functional/typography/typography.json'],
source: ['src/tokens/base/typography/typography.json5', 'src/tokens/functional/typography/typography.json5'],
include: [],
platforms: {
figma: figma(`figma/typography/typography.json`, buildOptions.prefix, buildOptions.buildPath),
Expand Down
24 changes: 12 additions & 12 deletions scripts/buildTokens.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const getStyleDictionaryConfig: StyleDictionaryConfigGenerator = (
include,
log: {
warnings: 'disabled', // 'warn' | 'error' | 'disabled'
verbosity: 'silent', // 'default' | 'silent' | 'verbose'
verbosity: 'verbose', // 'default' | 'silent' | 'verbose'
errors: {
brokenReferences: 'throw', // 'throw' | 'console'
},
Expand Down Expand Up @@ -106,9 +106,9 @@ export const buildDesignTokens = async (buildOptions: ConfigGeneratorOptions): P
for (const file of sizeFiles) {
const extendedSD = await PrimerStyleDictionary.extend(
getStyleDictionaryConfig(
`functional/size/${file.replace('src/tokens/functional/size/', '').replace('.json', '')}`,
`functional/size/${file.replace('src/tokens/functional/size/', '').replace('.json5', '')}`,
[file],
['src/tokens/base/size/size.json', ...sizeFiles],
['src/tokens/base/size/size.json5', ...sizeFiles],
buildOptions,
),
)
Expand All @@ -117,7 +117,7 @@ export const buildDesignTokens = async (buildOptions: ConfigGeneratorOptions): P
// build base scales
const SdBaseSize = await PrimerStyleDictionary.extend(
// using includes as source
getStyleDictionaryConfig(`base/size/size`, ['src/tokens/base/size/size.json'], [], {
getStyleDictionaryConfig(`base/size/size`, ['src/tokens/base/size/size.json5'], [], {
buildPath: buildOptions.buildPath,
prefix: undefined,
}),
Expand All @@ -134,8 +134,8 @@ export const buildDesignTokens = async (buildOptions: ConfigGeneratorOptions): P
const extendedSD = await PrimerStyleDictionary.extend(
getStyleDictionaryConfig(
`functional/typography/typography`,
[`src/tokens/functional/typography/*.json`],
[`src/tokens/base/typography/*.json`],
[`src/tokens/functional/typography/*.json5`],
[`src/tokens/base/typography/*.json5`],
buildOptions,
{
css: css(`css/functional/typography/typography.css`, buildOptions.prefix, buildOptions.buildPath, {
Expand All @@ -149,7 +149,7 @@ export const buildDesignTokens = async (buildOptions: ConfigGeneratorOptions): P
await extendedSD.buildAllPlatforms()

const SdTypo = await PrimerStyleDictionary.extend(
getStyleDictionaryConfig(`base/typography/typography`, [`src/tokens/base/typography/*.json`], [], buildOptions),
getStyleDictionaryConfig(`base/typography/typography`, [`src/tokens/base/typography/*.json5`], [], buildOptions),
)
await SdTypo.buildAllPlatforms()
} catch (e) {
Expand Down Expand Up @@ -202,21 +202,21 @@ export const buildDesignTokens = async (buildOptions: ConfigGeneratorOptions): P
`src/tokens/base/color/light/display-light.json5`,
`src/tokens/functional/color/light/*.json5`,
`src/tokens/functional/shadow/light.json5`,
`src/tokens/functional/border/light.json5`,
`src/tokens/functional/border/*.json5`,
],
include: [`src/tokens/base/color/light/light.json5`],
},
// typography
{
filename: 'typography',
source: [`src/tokens/base/typography/*.json`, `src/tokens/functional/typography/*.json`],
include: [`src/tokens/base/typography/*.json`],
source: [`src/tokens/base/typography/*.json5`, `src/tokens/functional/typography/*.json5`],
include: [`src/tokens/base/typography/*.json5`],
},
// size
{
filename: 'size',
source: [`src/tokens/base/size/*.json`, `src/tokens/functional/size/*.json`],
include: [`src/tokens/base/size/*.json`],
source: [`src/tokens/base/size/*.json5`, `src/tokens/functional/size/*.json5`],
include: [`src/tokens/base/size/*.json5`],
},
// motion
{
Expand Down
18 changes: 9 additions & 9 deletions scripts/themes.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/light/*.json5`,
`src/tokens/functional/shadow/light.json5`,
`src/tokens/functional/border/light.json5`,
`src/tokens/functional/border/*.json5`,
`src/tokens/functional/color/components/*.json5`,
],
include: [`src/tokens/base/color/light/light.json5`, `src/tokens/base/color/light/display-light.json5`],
Expand All @@ -18,7 +18,7 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/light/*.json5`,
`src/tokens/functional/shadow/light.json5`,
`src/tokens/functional/border/light.json5`,
`src/tokens/functional/border/*.json5`,
`src/tokens/functional/color/components/*.json5`,
`src/tokens/functional/color/light/overrides/light.tritanopia.json5`,
],
Expand All @@ -30,7 +30,7 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/light/*.json5`,
`src/tokens/functional/shadow/light.json5`,
`src/tokens/functional/border/light.json5`,
`src/tokens/functional/border/*.json5`,
`src/tokens/functional/color/components/*.json5`,
`src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5`,
],
Expand All @@ -42,7 +42,7 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/light/*.json5`,
`src/tokens/functional/shadow/light.json5`,
`src/tokens/functional/border/light.json5`,
`src/tokens/functional/border/*.json5`,
`src/tokens/functional/color/components/*.json5`,
`src/tokens/functional/color/light/overrides/light.high-contrast.json5`,
],
Expand All @@ -58,7 +58,7 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/dark/*.json5`,
`src/tokens/functional/shadow/dark.json5`,
`src/tokens/functional/border/dark.json5`,
`src/tokens/functional/border/*.json5`,
`src/tokens/functional/color/components/*.json5`,
],
include: [`src/tokens/base/color/dark/dark.json5`, `src/tokens/base/color/dark/display-dark.json5`],
Expand All @@ -70,7 +70,7 @@ export const themes: TokenBuildInput[] = [
`src/tokens/functional/color/dark/*.json5`,
`src/tokens/functional/color/dark/overrides/dark.dimmed.json5`,
`src/tokens/functional/shadow/dark.json5`,
`src/tokens/functional/border/dark.json5`,
`src/tokens/functional/border/*.json5`,
`src/tokens/functional/color/components/*.json5`,
],
include: [
Expand All @@ -86,7 +86,7 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/dark/*.json5`,
`src/tokens/functional/shadow/dark.json5`,
`src/tokens/functional/border/dark.json5`,
`src/tokens/functional/border/*.json5`,
`src/tokens/functional/color/components/*.json5`,
`src/tokens/functional/color/dark/overrides/dark.tritanopia.json5`,
],
Expand All @@ -98,7 +98,7 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/dark/*.json5`,
`src/tokens/functional/shadow/dark.json5`,
`src/tokens/functional/border/dark.json5`,
`src/tokens/functional/border/*.json5`,
`src/tokens/functional/color/components/*.json5`,
`src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5`,
],
Expand All @@ -110,7 +110,7 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/dark/*.json5`,
`src/tokens/functional/shadow/dark.json5`,
`src/tokens/functional/border/dark.json5`,
`src/tokens/functional/border/*.json5`,
`src/tokens/functional/color/components/*.json5`,
`src/tokens/functional/color/dark/overrides/dark.high-contrast.json5`,
],
Expand Down
12 changes: 6 additions & 6 deletions src/platforms/css.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,8 +53,8 @@ export const css: PlatformInitializer = (outputFile, prefix, buildPath, options)
options?.themed === true &&
token.$type !== 'custom-viewportRange' &&
!isFromFile(token, [
'src/tokens/functional/size/size-coarse.json',
'src/tokens/functional/size/size-fine.json',
'src/tokens/functional/size/size-coarse.json5',
'src/tokens/functional/size/size-fine.json5',
]),
options: {
showFileHeader: false,
Expand All @@ -72,8 +72,8 @@ export const css: PlatformInitializer = (outputFile, prefix, buildPath, options)
options?.themed !== true &&
token.$type !== 'custom-viewportRange' &&
!isFromFile(token, [
'src/tokens/functional/size/size-coarse.json',
'src/tokens/functional/size/size-fine.json',
'src/tokens/functional/size/size-coarse.json5',
'src/tokens/functional/size/size-fine.json5',
]),
options: {
showFileHeader: false,
Expand All @@ -95,8 +95,8 @@ export const css: PlatformInitializer = (outputFile, prefix, buildPath, options)
filter: token =>
isSource(token) &&
isFromFile(token, [
'src/tokens/functional/size/size-coarse.json',
'src/tokens/functional/size/size-fine.json',
'src/tokens/functional/size/size-coarse.json5',
'src/tokens/functional/size/size-fine.json5',
]),
options: {
descriptions: false,
Expand Down
0 src/tokens/base/size/size.json → src/tokens/base/size/size.json5
View file
File renamed without changes.
48 changes: 0 additions & 48 deletions src/tokens/base/typography/typography.json
View file

This file was deleted.

48 changes: 48 additions & 0 deletions src/tokens/base/typography/typography.json5
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
{
base: {
text: {
weight: {
light: {
$type: 'fontWeight',
$value: 300,
$extensions: {
'org.primer.figma': {
collection: 'base/typography',
scopes: ['fontWeight'],
},
},
},
normal: {
$value: 400,
$type: 'fontWeight',
$extensions: {
'org.primer.figma': {
collection: 'base/typography',
scopes: ['fontWeight'],
},
},
},
medium: {
$value: 500,
$type: 'fontWeight',
$extensions: {
'org.primer.figma': {
collection: 'base/typography',
scopes: ['fontWeight'],
},
},
},
semibold: {
$value: 600,
$type: 'fontWeight',
$extensions: {
'org.primer.figma': {
collection: 'base/typography',
scopes: ['fontWeight'],
},
},
},
},
},
},
}
0 src/tokens/functional/border/light.json5 → src/tokens/functional/border/border.json5
View file
File renamed without changes.
12 changes: 0 additions & 12 deletions src/tokens/functional/border/dark.json5
View file

This file was deleted.

Loading

0 comments on commit b516379

Please sign in to comment.