@pandacss/preset-base 1.0.0 → 1.1.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.
Files changed (3) hide show
  1. package/dist/index.js +30 -9
  2. package/dist/index.mjs +30 -9
  3. package/package.json +2 -2
package/dist/index.js CHANGED
@@ -1514,9 +1514,6 @@ var flexGrid = {
1514
1514
 
1515
1515
  // src/utilities/gradient.ts
1516
1516
  var gradientVia = createColorMixTransform("--gradient-via");
1517
- var union = (values) => {
1518
- return Array.from(values).map((value) => `'${value}'`).join(" | ");
1519
- };
1520
1517
  var linearGradientDirectionMap = /* @__PURE__ */ new Map([
1521
1518
  ["to-t", "to top"],
1522
1519
  ["to-tr", "to top right"],
@@ -1527,8 +1524,11 @@ var linearGradientDirectionMap = /* @__PURE__ */ new Map([
1527
1524
  ["to-l", "to left"],
1528
1525
  ["to-tl", "to top left"]
1529
1526
  ]);
1530
- var linearGradientValues = {
1531
- type: union(linearGradientDirectionMap.keys())
1527
+ var linearGradientValues = (theme) => {
1528
+ return {
1529
+ ...theme("gradients"),
1530
+ ...Object.fromEntries(linearGradientDirectionMap.entries())
1531
+ };
1532
1532
  };
1533
1533
  var gradientStops = "var(--gradient-via-stops, var(--gradient-position), var(--gradient-from) var(--gradient-from-position), var(--gradient-to) var(--gradient-to-position))";
1534
1534
  var gradientViaStops = "var(--gradient-position), var(--gradient-from) var(--gradient-from-position), var(--gradient-via) var(--gradient-via-position), var(--gradient-to) var(--gradient-to-position)";
@@ -1538,7 +1538,11 @@ var backgroundGradients = {
1538
1538
  className: "bg-grad",
1539
1539
  group: "Background Gradient",
1540
1540
  values: linearGradientValues,
1541
- transform(value) {
1541
+ transform(_value, { raw: value, token }) {
1542
+ const tokenValue = token(`gradients.${value}`);
1543
+ if (tokenValue) {
1544
+ return { backgroundImage: tokenValue };
1545
+ }
1542
1546
  return {
1543
1547
  "--gradient-stops": gradientStops,
1544
1548
  "--gradient-position": linearGradientDirectionMap.get(value) || value,
@@ -1551,7 +1555,11 @@ var backgroundGradients = {
1551
1555
  className: "bg-linear",
1552
1556
  group: "Background Gradient",
1553
1557
  values: linearGradientValues,
1554
- transform(value) {
1558
+ transform(_value, { raw: value, token }) {
1559
+ const tokenValue = token(`gradients.${value}`);
1560
+ if (tokenValue) {
1561
+ return { backgroundImage: tokenValue };
1562
+ }
1555
1563
  return {
1556
1564
  "--gradient-stops": gradientStops,
1557
1565
  "--gradient-position": linearGradientDirectionMap.get(value) || value,
@@ -1563,7 +1571,12 @@ var backgroundGradients = {
1563
1571
  shorthand: "bgRadial",
1564
1572
  className: "bg-radial",
1565
1573
  group: "Background Gradient",
1566
- transform(value) {
1574
+ values: "gradients",
1575
+ transform(_value, { raw: value, token }) {
1576
+ const tokenValue = token(`gradients.${value}`);
1577
+ if (tokenValue) {
1578
+ return { backgroundImage: tokenValue };
1579
+ }
1567
1580
  return {
1568
1581
  "--gradient-stops": gradientStops,
1569
1582
  "--gradient-position": value,
@@ -1587,7 +1600,15 @@ var backgroundGradients = {
1587
1600
  className: "txt-grad",
1588
1601
  group: "Background Gradient",
1589
1602
  values: linearGradientValues,
1590
- transform(value) {
1603
+ transform(_value, { raw: value, token }) {
1604
+ const tokenValue = token(`gradients.${value}`);
1605
+ if (tokenValue) {
1606
+ return {
1607
+ backgroundImage: tokenValue,
1608
+ WebkitBackgroundClip: "text",
1609
+ color: "transparent"
1610
+ };
1611
+ }
1591
1612
  return {
1592
1613
  "--gradient-stops": gradientStops,
1593
1614
  "--gradient-position": linearGradientDirectionMap.get(value) || value,
package/dist/index.mjs CHANGED
@@ -1487,9 +1487,6 @@ var flexGrid = {
1487
1487
 
1488
1488
  // src/utilities/gradient.ts
1489
1489
  var gradientVia = createColorMixTransform("--gradient-via");
1490
- var union = (values) => {
1491
- return Array.from(values).map((value) => `'${value}'`).join(" | ");
1492
- };
1493
1490
  var linearGradientDirectionMap = /* @__PURE__ */ new Map([
1494
1491
  ["to-t", "to top"],
1495
1492
  ["to-tr", "to top right"],
@@ -1500,8 +1497,11 @@ var linearGradientDirectionMap = /* @__PURE__ */ new Map([
1500
1497
  ["to-l", "to left"],
1501
1498
  ["to-tl", "to top left"]
1502
1499
  ]);
1503
- var linearGradientValues = {
1504
- type: union(linearGradientDirectionMap.keys())
1500
+ var linearGradientValues = (theme) => {
1501
+ return {
1502
+ ...theme("gradients"),
1503
+ ...Object.fromEntries(linearGradientDirectionMap.entries())
1504
+ };
1505
1505
  };
1506
1506
  var gradientStops = "var(--gradient-via-stops, var(--gradient-position), var(--gradient-from) var(--gradient-from-position), var(--gradient-to) var(--gradient-to-position))";
1507
1507
  var gradientViaStops = "var(--gradient-position), var(--gradient-from) var(--gradient-from-position), var(--gradient-via) var(--gradient-via-position), var(--gradient-to) var(--gradient-to-position)";
@@ -1511,7 +1511,11 @@ var backgroundGradients = {
1511
1511
  className: "bg-grad",
1512
1512
  group: "Background Gradient",
1513
1513
  values: linearGradientValues,
1514
- transform(value) {
1514
+ transform(_value, { raw: value, token }) {
1515
+ const tokenValue = token(`gradients.${value}`);
1516
+ if (tokenValue) {
1517
+ return { backgroundImage: tokenValue };
1518
+ }
1515
1519
  return {
1516
1520
  "--gradient-stops": gradientStops,
1517
1521
  "--gradient-position": linearGradientDirectionMap.get(value) || value,
@@ -1524,7 +1528,11 @@ var backgroundGradients = {
1524
1528
  className: "bg-linear",
1525
1529
  group: "Background Gradient",
1526
1530
  values: linearGradientValues,
1527
- transform(value) {
1531
+ transform(_value, { raw: value, token }) {
1532
+ const tokenValue = token(`gradients.${value}`);
1533
+ if (tokenValue) {
1534
+ return { backgroundImage: tokenValue };
1535
+ }
1528
1536
  return {
1529
1537
  "--gradient-stops": gradientStops,
1530
1538
  "--gradient-position": linearGradientDirectionMap.get(value) || value,
@@ -1536,7 +1544,12 @@ var backgroundGradients = {
1536
1544
  shorthand: "bgRadial",
1537
1545
  className: "bg-radial",
1538
1546
  group: "Background Gradient",
1539
- transform(value) {
1547
+ values: "gradients",
1548
+ transform(_value, { raw: value, token }) {
1549
+ const tokenValue = token(`gradients.${value}`);
1550
+ if (tokenValue) {
1551
+ return { backgroundImage: tokenValue };
1552
+ }
1540
1553
  return {
1541
1554
  "--gradient-stops": gradientStops,
1542
1555
  "--gradient-position": value,
@@ -1560,7 +1573,15 @@ var backgroundGradients = {
1560
1573
  className: "txt-grad",
1561
1574
  group: "Background Gradient",
1562
1575
  values: linearGradientValues,
1563
- transform(value) {
1576
+ transform(_value, { raw: value, token }) {
1577
+ const tokenValue = token(`gradients.${value}`);
1578
+ if (tokenValue) {
1579
+ return {
1580
+ backgroundImage: tokenValue,
1581
+ WebkitBackgroundClip: "text",
1582
+ color: "transparent"
1583
+ };
1584
+ }
1564
1585
  return {
1565
1586
  "--gradient-stops": gradientStops,
1566
1587
  "--gradient-position": linearGradientDirectionMap.get(value) || value,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pandacss/preset-base",
3
- "version": "1.0.0",
3
+ "version": "1.1.0",
4
4
  "description": "The base preset for Panda CSS that contains the conditions and utilities",
5
5
  "author": "Segun Adebayo <joseshegs@gmail.com>",
6
6
  "main": "dist/index.js",
@@ -32,7 +32,7 @@
32
32
  "dist"
33
33
  ],
34
34
  "dependencies": {
35
- "@pandacss/types": "1.0.0"
35
+ "@pandacss/types": "1.1.0"
36
36
  },
37
37
  "scripts": {
38
38
  "build": "tsup src/index.ts --format=esm,cjs --dts",