@discourser/design-system 0.6.0 → 0.7.0
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/README.md +43 -13
- package/dist/index.cjs +57 -27
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +21 -11
- package/dist/index.d.ts +21 -11
- package/dist/index.js +56 -27
- package/dist/index.js.map +1 -1
- package/dist/styles.css +115 -58
- package/package.json +2 -1
package/dist/styles.css
CHANGED
|
@@ -4646,6 +4646,64 @@
|
|
|
4646
4646
|
gap: var(--spacing-8);
|
|
4647
4647
|
}
|
|
4648
4648
|
|
|
4649
|
+
.color-palette_primary {
|
|
4650
|
+
--colors-color-palette-0: var(--colors-primary-0);
|
|
4651
|
+
--colors-color-palette-10: var(--colors-primary-10);
|
|
4652
|
+
--colors-color-palette-20: var(--colors-primary-20);
|
|
4653
|
+
--colors-color-palette-30: var(--colors-primary-30);
|
|
4654
|
+
--colors-color-palette-40: var(--colors-primary-40);
|
|
4655
|
+
--colors-color-palette-50: var(--colors-primary-50);
|
|
4656
|
+
--colors-color-palette-60: var(--colors-primary-60);
|
|
4657
|
+
--colors-color-palette-70: var(--colors-primary-70);
|
|
4658
|
+
--colors-color-palette-80: var(--colors-primary-80);
|
|
4659
|
+
--colors-color-palette-90: var(--colors-primary-90);
|
|
4660
|
+
--colors-color-palette-95: var(--colors-primary-95);
|
|
4661
|
+
--colors-color-palette-99: var(--colors-primary-99);
|
|
4662
|
+
--colors-color-palette-100: var(--colors-primary-100);
|
|
4663
|
+
--colors-color-palette-1: var(--colors-primary-1);
|
|
4664
|
+
--colors-color-palette-2: var(--colors-primary-2);
|
|
4665
|
+
--colors-color-palette-3: var(--colors-primary-3);
|
|
4666
|
+
--colors-color-palette-4: var(--colors-primary-4);
|
|
4667
|
+
--colors-color-palette-5: var(--colors-primary-5);
|
|
4668
|
+
--colors-color-palette-6: var(--colors-primary-6);
|
|
4669
|
+
--colors-color-palette-7: var(--colors-primary-7);
|
|
4670
|
+
--colors-color-palette-8: var(--colors-primary-8);
|
|
4671
|
+
--colors-color-palette-9: var(--colors-primary-9);
|
|
4672
|
+
--colors-color-palette-11: var(--colors-primary-11);
|
|
4673
|
+
--colors-color-palette-12: var(--colors-primary-12);
|
|
4674
|
+
--colors-color-palette-a1: var(--colors-primary-a1);
|
|
4675
|
+
--colors-color-palette-a2: var(--colors-primary-a2);
|
|
4676
|
+
--colors-color-palette-a3: var(--colors-primary-a3);
|
|
4677
|
+
--colors-color-palette-a4: var(--colors-primary-a4);
|
|
4678
|
+
--colors-color-palette-a5: var(--colors-primary-a5);
|
|
4679
|
+
--colors-color-palette-a6: var(--colors-primary-a6);
|
|
4680
|
+
--colors-color-palette-a7: var(--colors-primary-a7);
|
|
4681
|
+
--colors-color-palette-a8: var(--colors-primary-a8);
|
|
4682
|
+
--colors-color-palette-a9: var(--colors-primary-a9);
|
|
4683
|
+
--colors-color-palette-a10: var(--colors-primary-a10);
|
|
4684
|
+
--colors-color-palette-a11: var(--colors-primary-a11);
|
|
4685
|
+
--colors-color-palette-a12: var(--colors-primary-a12);
|
|
4686
|
+
--colors-color-palette-solid-bg: var(--colors-primary-solid-bg);
|
|
4687
|
+
--colors-color-palette-solid-bg-hover: var(--colors-primary-solid-bg-hover);
|
|
4688
|
+
--colors-color-palette-solid-fg: var(--colors-primary-solid-fg);
|
|
4689
|
+
--colors-color-palette-subtle-bg: var(--colors-primary-subtle-bg);
|
|
4690
|
+
--colors-color-palette-subtle-bg-hover: var(--colors-primary-subtle-bg-hover);
|
|
4691
|
+
--colors-color-palette-subtle-bg-active: var(--colors-primary-subtle-bg-active);
|
|
4692
|
+
--colors-color-palette-subtle-fg: var(--colors-primary-subtle-fg);
|
|
4693
|
+
--colors-color-palette-surface-bg: var(--colors-primary-surface-bg);
|
|
4694
|
+
--colors-color-palette-surface-bg-active: var(--colors-primary-surface-bg-active);
|
|
4695
|
+
--colors-color-palette-surface-border: var(--colors-primary-surface-border);
|
|
4696
|
+
--colors-color-palette-surface-border-hover: var(--colors-primary-surface-border-hover);
|
|
4697
|
+
--colors-color-palette-surface-fg: var(--colors-primary-surface-fg);
|
|
4698
|
+
--colors-color-palette-outline-bg-hover: var(--colors-primary-outline-bg-hover);
|
|
4699
|
+
--colors-color-palette-outline-bg-active: var(--colors-primary-outline-bg-active);
|
|
4700
|
+
--colors-color-palette-outline-border: var(--colors-primary-outline-border);
|
|
4701
|
+
--colors-color-palette-outline-fg: var(--colors-primary-outline-fg);
|
|
4702
|
+
--colors-color-palette-plain-bg-hover: var(--colors-primary-plain-bg-hover);
|
|
4703
|
+
--colors-color-palette-plain-bg-active: var(--colors-primary-plain-bg-active);
|
|
4704
|
+
--colors-color-palette-plain-fg: var(--colors-primary-plain-fg);
|
|
4705
|
+
}
|
|
4706
|
+
|
|
4649
4707
|
.fill_none {
|
|
4650
4708
|
fill: none;
|
|
4651
4709
|
}
|
|
@@ -4764,64 +4822,6 @@
|
|
|
4764
4822
|
align-items: start;
|
|
4765
4823
|
}
|
|
4766
4824
|
|
|
4767
|
-
.color-palette_primary {
|
|
4768
|
-
--colors-color-palette-0: var(--colors-primary-0);
|
|
4769
|
-
--colors-color-palette-10: var(--colors-primary-10);
|
|
4770
|
-
--colors-color-palette-20: var(--colors-primary-20);
|
|
4771
|
-
--colors-color-palette-30: var(--colors-primary-30);
|
|
4772
|
-
--colors-color-palette-40: var(--colors-primary-40);
|
|
4773
|
-
--colors-color-palette-50: var(--colors-primary-50);
|
|
4774
|
-
--colors-color-palette-60: var(--colors-primary-60);
|
|
4775
|
-
--colors-color-palette-70: var(--colors-primary-70);
|
|
4776
|
-
--colors-color-palette-80: var(--colors-primary-80);
|
|
4777
|
-
--colors-color-palette-90: var(--colors-primary-90);
|
|
4778
|
-
--colors-color-palette-95: var(--colors-primary-95);
|
|
4779
|
-
--colors-color-palette-99: var(--colors-primary-99);
|
|
4780
|
-
--colors-color-palette-100: var(--colors-primary-100);
|
|
4781
|
-
--colors-color-palette-1: var(--colors-primary-1);
|
|
4782
|
-
--colors-color-palette-2: var(--colors-primary-2);
|
|
4783
|
-
--colors-color-palette-3: var(--colors-primary-3);
|
|
4784
|
-
--colors-color-palette-4: var(--colors-primary-4);
|
|
4785
|
-
--colors-color-palette-5: var(--colors-primary-5);
|
|
4786
|
-
--colors-color-palette-6: var(--colors-primary-6);
|
|
4787
|
-
--colors-color-palette-7: var(--colors-primary-7);
|
|
4788
|
-
--colors-color-palette-8: var(--colors-primary-8);
|
|
4789
|
-
--colors-color-palette-9: var(--colors-primary-9);
|
|
4790
|
-
--colors-color-palette-11: var(--colors-primary-11);
|
|
4791
|
-
--colors-color-palette-12: var(--colors-primary-12);
|
|
4792
|
-
--colors-color-palette-a1: var(--colors-primary-a1);
|
|
4793
|
-
--colors-color-palette-a2: var(--colors-primary-a2);
|
|
4794
|
-
--colors-color-palette-a3: var(--colors-primary-a3);
|
|
4795
|
-
--colors-color-palette-a4: var(--colors-primary-a4);
|
|
4796
|
-
--colors-color-palette-a5: var(--colors-primary-a5);
|
|
4797
|
-
--colors-color-palette-a6: var(--colors-primary-a6);
|
|
4798
|
-
--colors-color-palette-a7: var(--colors-primary-a7);
|
|
4799
|
-
--colors-color-palette-a8: var(--colors-primary-a8);
|
|
4800
|
-
--colors-color-palette-a9: var(--colors-primary-a9);
|
|
4801
|
-
--colors-color-palette-a10: var(--colors-primary-a10);
|
|
4802
|
-
--colors-color-palette-a11: var(--colors-primary-a11);
|
|
4803
|
-
--colors-color-palette-a12: var(--colors-primary-a12);
|
|
4804
|
-
--colors-color-palette-solid-bg: var(--colors-primary-solid-bg);
|
|
4805
|
-
--colors-color-palette-solid-bg-hover: var(--colors-primary-solid-bg-hover);
|
|
4806
|
-
--colors-color-palette-solid-fg: var(--colors-primary-solid-fg);
|
|
4807
|
-
--colors-color-palette-subtle-bg: var(--colors-primary-subtle-bg);
|
|
4808
|
-
--colors-color-palette-subtle-bg-hover: var(--colors-primary-subtle-bg-hover);
|
|
4809
|
-
--colors-color-palette-subtle-bg-active: var(--colors-primary-subtle-bg-active);
|
|
4810
|
-
--colors-color-palette-subtle-fg: var(--colors-primary-subtle-fg);
|
|
4811
|
-
--colors-color-palette-surface-bg: var(--colors-primary-surface-bg);
|
|
4812
|
-
--colors-color-palette-surface-bg-active: var(--colors-primary-surface-bg-active);
|
|
4813
|
-
--colors-color-palette-surface-border: var(--colors-primary-surface-border);
|
|
4814
|
-
--colors-color-palette-surface-border-hover: var(--colors-primary-surface-border-hover);
|
|
4815
|
-
--colors-color-palette-surface-fg: var(--colors-primary-surface-fg);
|
|
4816
|
-
--colors-color-palette-outline-bg-hover: var(--colors-primary-outline-bg-hover);
|
|
4817
|
-
--colors-color-palette-outline-bg-active: var(--colors-primary-outline-bg-active);
|
|
4818
|
-
--colors-color-palette-outline-border: var(--colors-primary-outline-border);
|
|
4819
|
-
--colors-color-palette-outline-fg: var(--colors-primary-outline-fg);
|
|
4820
|
-
--colors-color-palette-plain-bg-hover: var(--colors-primary-plain-bg-hover);
|
|
4821
|
-
--colors-color-palette-plain-bg-active: var(--colors-primary-plain-bg-active);
|
|
4822
|
-
--colors-color-palette-plain-fg: var(--colors-primary-plain-fg);
|
|
4823
|
-
}
|
|
4824
|
-
|
|
4825
4825
|
.color-palette_neutral {
|
|
4826
4826
|
--colors-color-palette-0: var(--colors-neutral-0);
|
|
4827
4827
|
--colors-color-palette-10: var(--colors-neutral-10);
|
|
@@ -5016,6 +5016,63 @@
|
|
|
5016
5016
|
content: Opens immediately on hover;
|
|
5017
5017
|
}
|
|
5018
5018
|
|
|
5019
|
+
.color-palette_red {
|
|
5020
|
+
--colors-color-palette-50: var(--colors-red-50);
|
|
5021
|
+
--colors-color-palette-100: var(--colors-red-100);
|
|
5022
|
+
--colors-color-palette-200: var(--colors-red-200);
|
|
5023
|
+
--colors-color-palette-300: var(--colors-red-300);
|
|
5024
|
+
--colors-color-palette-400: var(--colors-red-400);
|
|
5025
|
+
--colors-color-palette-500: var(--colors-red-500);
|
|
5026
|
+
--colors-color-palette-600: var(--colors-red-600);
|
|
5027
|
+
--colors-color-palette-700: var(--colors-red-700);
|
|
5028
|
+
--colors-color-palette-800: var(--colors-red-800);
|
|
5029
|
+
--colors-color-palette-900: var(--colors-red-900);
|
|
5030
|
+
--colors-color-palette-950: var(--colors-red-950);
|
|
5031
|
+
--colors-color-palette-1: var(--colors-red-1);
|
|
5032
|
+
--colors-color-palette-2: var(--colors-red-2);
|
|
5033
|
+
--colors-color-palette-3: var(--colors-red-3);
|
|
5034
|
+
--colors-color-palette-4: var(--colors-red-4);
|
|
5035
|
+
--colors-color-palette-5: var(--colors-red-5);
|
|
5036
|
+
--colors-color-palette-6: var(--colors-red-6);
|
|
5037
|
+
--colors-color-palette-7: var(--colors-red-7);
|
|
5038
|
+
--colors-color-palette-8: var(--colors-red-8);
|
|
5039
|
+
--colors-color-palette-9: var(--colors-red-9);
|
|
5040
|
+
--colors-color-palette-10: var(--colors-red-10);
|
|
5041
|
+
--colors-color-palette-11: var(--colors-red-11);
|
|
5042
|
+
--colors-color-palette-12: var(--colors-red-12);
|
|
5043
|
+
--colors-color-palette-a1: var(--colors-red-a1);
|
|
5044
|
+
--colors-color-palette-a2: var(--colors-red-a2);
|
|
5045
|
+
--colors-color-palette-a3: var(--colors-red-a3);
|
|
5046
|
+
--colors-color-palette-a4: var(--colors-red-a4);
|
|
5047
|
+
--colors-color-palette-a5: var(--colors-red-a5);
|
|
5048
|
+
--colors-color-palette-a6: var(--colors-red-a6);
|
|
5049
|
+
--colors-color-palette-a7: var(--colors-red-a7);
|
|
5050
|
+
--colors-color-palette-a8: var(--colors-red-a8);
|
|
5051
|
+
--colors-color-palette-a9: var(--colors-red-a9);
|
|
5052
|
+
--colors-color-palette-a10: var(--colors-red-a10);
|
|
5053
|
+
--colors-color-palette-a11: var(--colors-red-a11);
|
|
5054
|
+
--colors-color-palette-a12: var(--colors-red-a12);
|
|
5055
|
+
--colors-color-palette-solid-bg: var(--colors-red-solid-bg);
|
|
5056
|
+
--colors-color-palette-solid-bg-hover: var(--colors-red-solid-bg-hover);
|
|
5057
|
+
--colors-color-palette-solid-fg: var(--colors-red-solid-fg);
|
|
5058
|
+
--colors-color-palette-subtle-bg: var(--colors-red-subtle-bg);
|
|
5059
|
+
--colors-color-palette-subtle-bg-hover: var(--colors-red-subtle-bg-hover);
|
|
5060
|
+
--colors-color-palette-subtle-bg-active: var(--colors-red-subtle-bg-active);
|
|
5061
|
+
--colors-color-palette-subtle-fg: var(--colors-red-subtle-fg);
|
|
5062
|
+
--colors-color-palette-surface-bg: var(--colors-red-surface-bg);
|
|
5063
|
+
--colors-color-palette-surface-bg-active: var(--colors-red-surface-bg-active);
|
|
5064
|
+
--colors-color-palette-surface-border: var(--colors-red-surface-border);
|
|
5065
|
+
--colors-color-palette-surface-border-hover: var(--colors-red-surface-border-hover);
|
|
5066
|
+
--colors-color-palette-surface-fg: var(--colors-red-surface-fg);
|
|
5067
|
+
--colors-color-palette-outline-bg-hover: var(--colors-red-outline-bg-hover);
|
|
5068
|
+
--colors-color-palette-outline-bg-active: var(--colors-red-outline-bg-active);
|
|
5069
|
+
--colors-color-palette-outline-border: var(--colors-red-outline-border);
|
|
5070
|
+
--colors-color-palette-outline-fg: var(--colors-red-outline-fg);
|
|
5071
|
+
--colors-color-palette-plain-bg-hover: var(--colors-red-plain-bg-hover);
|
|
5072
|
+
--colors-color-palette-plain-bg-active: var(--colors-red-plain-bg-active);
|
|
5073
|
+
--colors-color-palette-plain-fg: var(--colors-red-plain-fg);
|
|
5074
|
+
}
|
|
5075
|
+
|
|
5019
5076
|
.top_0 {
|
|
5020
5077
|
top: var(--spacing-0);
|
|
5021
5078
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@discourser/design-system",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.7.0",
|
|
4
4
|
"description": "Aesthetic-agnostic design system with Panda CSS and Ark UI",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"publishConfig": {
|
|
@@ -78,6 +78,7 @@
|
|
|
78
78
|
"tokens:full": "pnpm tokens:generate && pnpm build:panda",
|
|
79
79
|
"organize-tokens": "tsx scripts/organize-figma-exports.ts",
|
|
80
80
|
"clean:old-backups": "bash scripts/clean-old-backups.sh",
|
|
81
|
+
"check-branch": "bash scripts/check-branch.sh",
|
|
81
82
|
"transform:dtcg-to-contract": "tsx scripts/dtcg-to-design-language.ts",
|
|
82
83
|
"transform:contract-to-dtcg": "tsx scripts/design-language-to-dtcg.ts",
|
|
83
84
|
"docs:generate": "tsx scripts/generate-storybook-docs.ts",
|