@plasmicpkgs/antd5 0.0.38 → 0.0.39

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/dist/antd.esm.js CHANGED
@@ -357,10 +357,9 @@ function themeToAntdConfig(opts) {
357
357
  controlHeight,
358
358
  sizeUnit,
359
359
  sizeStep,
360
- wireframe,
361
- spacing
360
+ wireframe
362
361
  } = opts;
363
- return __spreadProps$6(__spreadValues$8({}, spacing && { size: spacing }), {
362
+ return {
364
363
  theme: {
365
364
  token: Object.fromEntries(Object.entries({
366
365
  colorTextBase,
@@ -378,7 +377,7 @@ function themeToAntdConfig(opts) {
378
377
  wireframe
379
378
  }).filter(([_key, val]) => !!val))
380
379
  }
381
- });
380
+ };
382
381
  }
383
382
  function AntdConfigProvider(props) {
384
383
  const _a = props, { children, themeStyles } = _a, rest = __objRest$6(_a, ["children", "themeStyles"]);
@@ -391,13 +390,22 @@ function AntdConfigProvider(props) {
391
390
  colorTextBase: themeStyles.color
392
391
  }))), /* @__PURE__ */ React.createElement(ForkedApp, null, /* @__PURE__ */ React.createElement(InnerConfigProvider, null, children)));
393
392
  }
393
+ function normTokenValue(val) {
394
+ if (typeof val === "string") {
395
+ return val.trim();
396
+ } else if (typeof val === "number") {
397
+ return `${val}px`;
398
+ } else {
399
+ return val;
400
+ }
401
+ }
394
402
  function InnerConfigProvider(props) {
395
403
  const { children } = props;
396
404
  const { token } = theme.useToken();
397
405
  const makeVarName = (name) => `--antd-${name}`;
398
406
  const cssStyles = React.useMemo(() => `
399
407
  :root {
400
- ${Object.entries(token).map(([key, val]) => `${makeVarName(key)}:${typeof val === "string" ? val.trim() : val};`).join("\n")}
408
+ ${Object.entries(token).map(([key, val]) => `${makeVarName(key)}:${normTokenValue(val)};`).join("\n")}
401
409
  }
402
410
  `, [token]);
403
411
  const app = useAppContext();
@@ -472,20 +480,27 @@ function ForkedApp(props) {
472
480
  }
473
481
  function registerTokens(loader) {
474
482
  const regs = [];
475
- const makeColorToken = (name) => {
476
- const colorIndex = name.indexOf("color");
477
- const humanName = makeNiceName(colorIndex >= 0 ? name.substring(name.indexOf("color") + "color".length) : name);
478
- return {
479
- name,
480
- displayName: `System: ${humanName}`,
481
- value: `var(--antd-${name})`,
482
- type: "color"
483
- };
483
+ const withoutPrefix = (name, prefix) => {
484
+ if (!prefix) {
485
+ return name;
486
+ }
487
+ const index = name.indexOf(prefix);
488
+ return index === 0 ? name.substring(prefix.length) : name;
484
489
  };
485
490
  function makeNiceName(name) {
486
491
  name = name[0].toUpperCase() + name.substring(1);
487
492
  return name.replace(/([a-z])([A-Z])/g, "$1 $2");
488
493
  }
494
+ const makeGenericToken = (name, type, removePrefix) => {
495
+ const tokenName = Array.isArray(name) ? name[0] : name;
496
+ const displayName = Array.isArray(name) ? name[1] : makeNiceName(withoutPrefix(name, removePrefix));
497
+ return {
498
+ name: tokenName,
499
+ displayName: `System: ${displayName}`,
500
+ value: `var(--antd-${tokenName})`,
501
+ type
502
+ };
503
+ };
489
504
  const colorTokens = [
490
505
  "colorPrimary",
491
506
  "colorSuccess",
@@ -553,91 +568,32 @@ function registerTokens(loader) {
553
568
  "colorErrorTextActive",
554
569
  "colorWhite",
555
570
  "colorBgMask",
556
- "colorFillContentHover",
557
- "colorFillAlter",
558
- "colorFillContent",
559
- "colorBgContainerDisabled",
560
- "colorBgTextHover",
561
- "colorBgTextActive",
562
- "colorBorderBg",
563
- "colorSplit",
564
- "colorTextPlaceholder",
565
- "colorTextDisabled",
566
- "colorTextHeading",
567
- "colorTextLabel",
568
- "colorTextDescription",
569
- "colorTextLightSolid",
570
571
  "colorIcon",
571
572
  "colorIconHover",
572
573
  "colorLink",
573
- "colorLinkHover",
574
- "colorLinkActive",
575
- "colorLinkHighlight",
576
- "controlOutline",
577
- "controlWarningOutline",
578
- "controlErrorOutline",
579
- "controlItemBgHover",
580
- "controlItemBgActive",
581
- "controlItemBgActiveHover",
582
- "controlItemBgActiveDisabled"
574
+ "colorLinkHover"
583
575
  ];
584
- colorTokens.forEach((name) => regs.push(makeColorToken(name)));
585
- const makeGenericToken = (name, type) => {
586
- return {
587
- name: `Sys: ${makeNiceName(name)}`,
588
- value: `var(--antd-${name})`,
589
- type
590
- };
591
- };
576
+ colorTokens.forEach((name) => regs.push(makeGenericToken(name, "color", "color")));
592
577
  const spacingTokens = [
593
- "lineWidth",
594
- "borderRadius",
595
- "controlHeight",
596
- "sizeXXL",
597
- "sizeXL",
598
- "sizeLG",
599
- "sizeMD",
600
- "sizeMS",
601
- "size",
602
- "sizeSM",
603
- "sizeXS",
604
- "sizeXXS",
605
- "controlHeightXS",
606
- "controlHeightSM",
607
- "controlHeightLG",
608
- "lineWidthBold",
609
- "borderRadiusXS",
610
- "borderRadiusSM",
611
- "borderRadiusLG",
612
- "borderRadiusOuter",
613
- "controlOutlineWidth",
614
- "controlInteractiveSize",
615
578
  "paddingXXS",
616
579
  "paddingXS",
617
580
  "paddingSM",
618
- "padding",
581
+ ["padding", "Padding M"],
619
582
  "paddingMD",
620
583
  "paddingLG",
621
584
  "paddingXL",
622
- "paddingContentHorizontalLG",
623
- "paddingContentHorizontal",
624
- "paddingContentHorizontalSM",
625
- "paddingContentVerticalLG",
626
- "paddingContentVertical",
627
- "paddingContentVerticalSM",
628
585
  "marginXXS",
629
586
  "marginXS",
630
587
  "marginSM",
631
- "margin",
588
+ ["margin", "Margin M"],
632
589
  "marginMD",
633
590
  "marginLG",
634
591
  "marginXL",
635
- "marginXXL",
636
- "controlPaddingHorizontal",
637
- "controlPaddingHorizontalSM"
592
+ "marginXXL"
638
593
  ];
639
594
  spacingTokens.forEach((token) => regs.push(makeGenericToken(token, "spacing")));
640
595
  const fontSizeTokens = [
596
+ ["fontSize", "M"],
641
597
  "fontSizeSM",
642
598
  "fontSizeLG",
643
599
  "fontSizeXL",
@@ -647,8 +603,9 @@ function registerTokens(loader) {
647
603
  "fontSizeHeading4",
648
604
  "fontSizeHeading5"
649
605
  ];
650
- fontSizeTokens.forEach((token) => regs.push(makeGenericToken(token, "font-size")));
606
+ fontSizeTokens.forEach((token) => regs.push(makeGenericToken(token, "font-size", "fontSize")));
651
607
  const lineHeightTokens = [
608
+ ["lineHeight", "M"],
652
609
  "lineHeightLG",
653
610
  "lineHeightSM",
654
611
  "lineHeightHeading1",
@@ -657,7 +614,7 @@ function registerTokens(loader) {
657
614
  "lineHeightHeading4",
658
615
  "lineHeightHeading5"
659
616
  ];
660
- lineHeightTokens.forEach((token) => regs.push(makeGenericToken(token, "line-height")));
617
+ lineHeightTokens.forEach((token) => regs.push(makeGenericToken(token, "line-height", "lineHeight")));
661
618
  if (loader) {
662
619
  regs.forEach((t) => loader.registerToken(t));
663
620
  } else {
@@ -716,10 +673,6 @@ const registerConfigProvider = makeRegisterGlobalContext(AntdConfigProvider, __s
716
673
  type: "boolean",
717
674
  defaultValue: false
718
675
  },
719
- spacing: {
720
- type: "choice",
721
- options: ["small", "middle", "large"]
722
- },
723
676
  themeStyles: {
724
677
  type: "themeStyles"
725
678
  }