@planningcenter/tapestry-migration-cli 2.8.0 → 2.9.0-rc.10
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/tapestry-react-shim.cjs +16 -16
- package/package.json +3 -3
- package/src/components/button/transforms/tooltipToWrapper.test.ts +5 -3
- package/src/components/checkbox/transforms/sizeMapping.ts +7 -40
- package/src/components/link/transforms/tooltipToWrapper.test.ts +5 -3
- package/src/components/radio/transforms/setDefaultSize.ts +3 -2
- package/src/components/radio/transforms/sizeMapping.ts +7 -41
- package/src/components/shared/actions/getAttributeValueAsProps.ts +15 -0
- package/src/components/shared/conditions/notCondition.test.ts +35 -0
- package/src/components/shared/conditions/notCondition.ts +12 -0
- package/src/components/shared/helpers/unsupportedPropsHelpers.ts +1 -0
- package/src/components/shared/transformFactories/sizeMappingFactory.ts +56 -0
- package/src/components/toggle-switch/index.ts +40 -0
- package/src/components/toggle-switch/transforms/ariaLabelToLabel.test.ts +236 -0
- package/src/components/toggle-switch/transforms/ariaLabelToLabel.ts +35 -0
- package/src/components/toggle-switch/transforms/auditSpreadProps.test.ts +352 -0
- package/src/components/toggle-switch/transforms/auditSpreadProps.ts +10 -0
- package/src/components/toggle-switch/transforms/convertStyleProps.test.ts +161 -0
- package/src/components/toggle-switch/transforms/convertStyleProps.ts +10 -0
- package/src/components/toggle-switch/transforms/isCheckedToChecked.test.ts +175 -0
- package/src/components/toggle-switch/transforms/isCheckedToChecked.ts +18 -0
- package/src/components/toggle-switch/transforms/moveToggleSwitchImport.test.ts +192 -0
- package/src/components/toggle-switch/transforms/moveToggleSwitchImport.ts +13 -0
- package/src/components/toggle-switch/transforms/sizeMapping.test.ts +188 -0
- package/src/components/toggle-switch/transforms/sizeMapping.ts +13 -0
- package/src/components/toggle-switch/transforms/unsupportedProps.test.ts +241 -0
- package/src/components/toggle-switch/transforms/unsupportedProps.ts +42 -0
- package/src/index.ts +6 -5
- package/src/reportGenerator.ts +2 -0
- package/src/utils/componentNameNormalizer.test.ts +91 -0
- package/src/utils/componentNameNormalizer.ts +39 -0
|
@@ -154,7 +154,7 @@ const viewCardStack = "M15.333,0c0.36837,0 0.667,0.29863 0.667,0.667v1.333c0,0.3
|
|
|
154
154
|
const viewTable = "M14,0c1.10457,0 2,0.89543 2,2v2h-16v-2c0,-1.10457 0.89543,-2 2,-2zM16,10h-7v-4h7zM9,12h7v2c0,1.10457 -0.89543,2 -2,2h-5zM7,16h-5c-1.10457,0 -2,-0.89543 -2,-2v-2h7zM7,10h-7v-4h7z";
|
|
155
155
|
const xCircle = "M11.395,10.262l-2.262,-2.262l2.262,-2.262l-1.132,-1.132l-2.262,2.262l-2.263,-2.262l-1.131,1.132l2.262,2.262l-2.262,2.262l1.131,1.132l2.263,-2.262l2.262,2.262zM13.659,2.343c3.12218,3.12514 3.12218,8.18886 0,11.314c-2.28834,2.28863 -5.73017,2.97305 -8.72,1.734c-2.99134,-1.23749 -4.94222,-4.15558 -4.94244,-7.39278c-0.00022,-3.2372 1.95027,-6.15555 4.94143,-7.39345c2.99117,-1.2379 6.43353,-0.55139 8.72101,1.73923";
|
|
156
156
|
const x$1 = "M9.88,8.035l5.7,5.7l-1.9,1.9l-5.7,-5.7l-5.7,5.7l-1.9,-1.9l5.7,-5.7l-5.7,-5.7l1.9,-1.9l5.7,5.7l5.7,-5.7l1.9,1.9z";
|
|
157
|
-
const
|
|
157
|
+
const o$5 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
158
158
|
__proto__: null,
|
|
159
159
|
bell,
|
|
160
160
|
bellMuted,
|
|
@@ -320,7 +320,7 @@ const radio0 = "M8,1c3.864,0 7,3.136 7,7c0,3.864 -3.136,7 -7,7c-3.864,0 -7,-3.13
|
|
|
320
320
|
const radio1 = "M8,5c1.62669,0.042 2.92353,1.37277 2.92353,3c0,1.62723 -1.29685,2.958 -2.92353,3c-1.62669,-0.042 -2.92353,-1.37277 -2.92353,-3c0,-1.62723 1.29685,-2.958 2.92353,-3";
|
|
321
321
|
const rightChevron = "M11.175,8l-5,5l-1.175,-1.175l3.817,-3.825l-3.817,-3.825l1.175,-1.175z";
|
|
322
322
|
const upChevron = "M13,10l-1.175,1.175l-3.825,-3.817l-3.825,3.817l-1.175,-1.175l5,-5z";
|
|
323
|
-
const
|
|
323
|
+
const r$5 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
324
324
|
__proto__: null,
|
|
325
325
|
checkbox0,
|
|
326
326
|
checkbox1,
|
|
@@ -3309,7 +3309,7 @@ function computedToken(varName) {
|
|
|
3309
3309
|
return tokens[varName];
|
|
3310
3310
|
}
|
|
3311
3311
|
var i$2 = { lg: { boxSize: 5, fontSize: 3, lineHeight: 4, paddingHorizontal: 1.75, paddingHorizontalDense: 1, paddingVertical: 0.5, radius: 5 }, md: { boxSize: 4, fontSize: 4, lineHeight: 3, paddingHorizontal: 1.375, paddingHorizontalDense: 1, paddingVertical: 0.5, radius: 4 }, sm: { boxSize: 3, fontSize: 5, lineHeight: 2.5, paddingHorizontal: 1, paddingHorizontalDense: 0.5, paddingVertical: 0.25, radius: 3 }, xl: { boxSize: 8, fontSize: 1, lineHeight: 5, paddingHorizontal: 2.25, paddingHorizontalDense: 2, paddingVertical: 1.5, radius: 6 }, xs: { boxSize: 2.5, fontSize: 5, lineHeight: 2.5, paddingHorizontal: 0.75, paddingHorizontalDense: 0.5, paddingVertical: 0, radius: 2.5 }, xxl: { boxSize: 14 } };
|
|
3312
|
-
var l$1 = { fill: { backgroundColor: token("--t-fill-color-button-interaction-solid-disabled"), color: token("--t-text-color-
|
|
3312
|
+
var l$1 = { fill: { backgroundColor: token("--t-fill-color-button-interaction-solid-disabled"), color: token("--t-text-color-disabled"), opacity: 1 }, naked: { color: token("--t-text-color-disabled"), opacity: 1 }, outline: { backgroundColor: token("--t-fill-color-button-interaction-outline-disabled"), color: token("--t-text-color-disabled"), opacity: 1, stroke: token("--t-border-color-button-neutral") } }, r$4 = { color: token("--t-text-color-status-neutral"), backgroundColor: token("--t-fill-color-button-neutral-responsive-header"), stroke: "transparent", hover: { backgroundColor: token("--t-fill-color-button-neutral-responsive-header-hover") }, active: { backgroundColor: token("--t-fill-color-button-neutral-responsive-header-active") }, disabled: { color: token("--t-text-color-disabled"), backgroundColor: token("--t-fill-color-button-neutral-responsive-header-disabled"), borderColor: token("--t-fill-color-button-neutral-responsive-header-disabled"), opacity: 1 }, mediaQueries: { "@media (min-width: 600px)": { color: token("--t-text-color-status-neutral"), backgroundColor: "var(--local-page-header-button-background-color, transparent)", boxShadow: "inset 0px 0px 0px 1px var(--t-border-color-button-neutral)", hover: { backgroundColor: token("--t-fill-color-button-neutral-outline-hover") }, active: { backgroundColor: token("--t-fill-color-button-neutral-outline-active") }, disabled: l$1.outline } } }, e$6 = { dark: { fill: { active: { backgroundColor: "dark-2" }, backgroundColor: "dark-0", color: "dark-9", hover: { backgroundColor: "dark-1" }, disabled: l$1.fill }, naked: { active: { backgroundColor: "dark-1" }, color: "dark-9", hover: { backgroundColor: "dark-0" }, disabled: l$1.naked }, outline: { active: { backgroundColor: "dark-1" }, color: "dark-9", hover: { backgroundColor: "dark-0" }, stroke: "dark-3", disabled: l$1.outline } }, default: { fill: { backgroundColor: token("--t-fill-color-button-neutral-solid"), color: token("--t-text-color-status-neutral"), hover: { backgroundColor: token("--t-fill-color-button-neutral-solid-hover") }, active: { backgroundColor: token("--t-fill-color-button-neutral-solid-active") }, disabled: l$1.fill }, naked: { color: token("--t-text-color-status-neutral"), hover: { backgroundColor: token("--t-fill-color-button-neutral-outline-hover") }, active: { backgroundColor: token("--t-fill-color-button-neutral-outline-active") }, disabled: l$1.naked }, outline: { color: token("--t-text-color-status-neutral"), stroke: token("--t-border-color-button-neutral"), hover: { backgroundColor: token("--t-fill-color-button-neutral-outline-hover") }, active: { backgroundColor: token("--t-fill-color-button-neutral-outline-active") }, disabled: l$1.outline } }, secondaryPageHeader: { fill: r$4, naked: r$4, outline: r$4 }, error: { fill: { backgroundColor: token("--t-fill-color-button-delete-solid"), color: token("--t-text-color-inverted"), hover: { backgroundColor: token("--t-fill-color-button-delete-solid-hover") }, active: { backgroundColor: token("--t-fill-color-button-delete-solid-active") }, disabled: l$1.fill }, naked: { color: token("--t-text-color-status-error"), hover: { backgroundColor: token("--t-fill-color-button-delete-outline-hover") }, active: { backgroundColor: token("--t-fill-color-button-delete-outline-active") }, disabled: l$1.naked }, outline: { color: token("--t-text-color-status-error"), stroke: token("--t-border-color-button-delete"), hover: { backgroundColor: token("--t-fill-color-button-delete-outline-hover") }, active: { backgroundColor: token("--t-fill-color-button-delete-outline-active") }, disabled: l$1.outline } }, info: { fill: { active: { backgroundColor: "blue-3" }, backgroundColor: "blue-5", color: "light-9", hover: { backgroundColor: "blue-4" }, disabled: l$1.fill }, naked: { active: { backgroundColor: "blue-1" }, color: "blue-5", hover: { backgroundColor: "blue-0" }, disabled: l$1.naked }, outline: { active: { backgroundColor: "blue-1" }, color: "blue-5", hover: { backgroundColor: "blue-0" }, stroke: "blue-5", disabled: l$1.outline } }, light: { fill: { active: { backgroundColor: "light-3" }, backgroundColor: "light-1", color: "white", hover: { backgroundColor: "light-2" }, disabled: l$1.fill }, naked: { active: { backgroundColor: "light-1" }, color: "light-9", hover: { backgroundColor: "light-0" }, disabled: l$1.naked }, outline: { active: { backgroundColor: "light-1" }, color: "white", hover: { backgroundColor: "light-0" }, stroke: "light-3", disabled: l$1.outline } }, primary: { fill: { backgroundColor: token("--t-fill-color-button-interaction-solid"), color: token("--t-text-color-inverted"), hover: { backgroundColor: token("--t-fill-color-button-interaction-solid-hover") }, active: { backgroundColor: token("--t-fill-color-button-interaction-solid-active") }, disabled: l$1.fill }, naked: { color: token("--t-text-color-interaction"), hover: { backgroundColor: token("--t-fill-color-button-interaction-outline-hover") }, active: { backgroundColor: token("--t-fill-color-button-interaction-outline-active") }, disabled: l$1.naked }, outline: { color: token("--t-text-color-interaction"), stroke: token("--t-border-color-button-info"), hover: { backgroundColor: token("--t-fill-color-button-interaction-outline-hover") }, active: { backgroundColor: token("--t-fill-color-button-interaction-outline-active") }, disabled: l$1.outline } }, success: { fill: { active: { backgroundColor: "success-darker" }, backgroundColor: "success", color: "white", hover: { backgroundColor: "success-dark" }, disabled: l$1.fill }, naked: { active: { backgroundColor: "success-lighter" }, color: "success", hover: { backgroundColor: "success-lightest" }, disabled: l$1.naked }, outline: { active: { backgroundColor: "success-lighter" }, color: "success", hover: { backgroundColor: "success-lightest" }, stroke: "success", disabled: l$1.outline } }, warning: { fill: { active: { backgroundColor: "yellow-3" }, backgroundColor: "yellow-5", color: "dark-9", hover: { backgroundColor: "yellow-4" }, disabled: l$1.fill }, naked: { active: { backgroundColor: "yellow-1" }, color: "yellow-9", hover: { backgroundColor: "yellow-0" }, disabled: l$1.naked }, outline: { active: { backgroundColor: "yellow-1" }, color: "yellow-9", hover: { backgroundColor: "yellow-0" }, stroke: "yellow-5", disabled: l$1.outline } }, white: { fill: { active: { backgroundColor: "grey-1" }, backgroundColor: "white", color: "primary", hover: { backgroundColor: "grey-0" }, disabled: l$1.fill }, naked: { active: { backgroundColor: "light-1" }, color: "white", hover: { backgroundColor: "light-0" }, disabled: l$1.naked }, outline: { active: { backgroundColor: "light-1" }, color: "white", hover: { backgroundColor: "light-0" }, stroke: "white", disabled: l$1.outline } } };
|
|
3313
3313
|
var o$4 = function() {
|
|
3314
3314
|
return o$4 = Object.assign || function(t2) {
|
|
3315
3315
|
for (var r2, o2 = 1, n2 = arguments.length; o2 < n2; o2++) for (var e2 in r2 = arguments[o2]) Object.prototype.hasOwnProperty.call(r2, e2) && (t2[e2] = r2[e2]);
|
|
@@ -3325,7 +3325,7 @@ function n$3(t2, r2) {
|
|
|
3325
3325
|
}
|
|
3326
3326
|
return o2;
|
|
3327
3327
|
}
|
|
3328
|
-
function e$
|
|
3328
|
+
function e$5(t2, r2, o2) {
|
|
3329
3329
|
for (var n2, e2 = 0, c2 = r2.length; e2 < c2; e2++) !n2 && e2 in r2 || (n2 || (n2 = Array.prototype.slice.call(r2, 0, e2)), n2[e2] = r2[e2]);
|
|
3330
3330
|
return t2.concat(n2 || Array.prototype.slice.call(r2));
|
|
3331
3331
|
}
|
|
@@ -4584,10 +4584,10 @@ var kebabCaseExports = requireKebabCase();
|
|
|
4584
4584
|
const n$2 = /* @__PURE__ */ getDefaultExportFromCjs(kebabCaseExports);
|
|
4585
4585
|
var f = false;
|
|
4586
4586
|
if ("undefined" != typeof window) try {
|
|
4587
|
-
var s$
|
|
4587
|
+
var s$2 = { get passive() {
|
|
4588
4588
|
return f = true, true;
|
|
4589
4589
|
} };
|
|
4590
|
-
window.addEventListener("test", null, s$
|
|
4590
|
+
window.addEventListener("test", null, s$2), window.removeEventListener("test", null, s$2);
|
|
4591
4591
|
} catch (e2) {
|
|
4592
4592
|
f = false;
|
|
4593
4593
|
}
|
|
@@ -4623,11 +4623,11 @@ function m(t2) {
|
|
|
4623
4623
|
return o$4(o$4({}, t3), ((c2 = {})[e2] = a2 ? te("colors", o2) : o2, c2));
|
|
4624
4624
|
}), {});
|
|
4625
4625
|
}
|
|
4626
|
-
var o$3 = { create: { create35: token("--t-fill-color-control-secondary") }, interaction66: token("--t-fill-color-control
|
|
4627
|
-
function
|
|
4628
|
-
return l2 ? s$
|
|
4626
|
+
var o$3 = { create: { create35: token("--t-fill-color-control-secondary") }, interaction66: token("--t-fill-color-control") }, a$1 = { apps: { calendar: token("--t-fill-color-product-calendar-050"), "check-ins": token("--t-fill-color-product-checkins-050"), giving: token("--t-fill-color-product-giving-050"), groups: token("--t-fill-color-product-groups-050"), home: token("--t-fill-color-product-home-050"), "music-stand": "#4984c4", pco: "#3565cf", people: token("--t-fill-color-product-people-050"), "planning-center": "#2266f7", projector: "#f19900", registrations: token("--t-fill-color-product-registrations-050"), services: token("--t-fill-color-product-services-050") }, background: { background: token("--t-surface-color-card"), backgroundSecondary: token("--t-surface-color-canvas"), backgroundTertiary: token("--t-fill-color-neutral-070") }, static: { staticDark: computedToken("--t-text-color"), staticLight: computedToken("--t-text-color-inverted") }, blue: ["hsl(197, 56%, 92%)", "hsl(197, 56%, 88%)", "hsl(197, 56%, 72%)", "hsl(197, 56%, 64%)", "hsl(197, 56%, 52%)", "hsl(197, 56%, 44%)", "hsl(197, 56%, 40%)", "hsl(197, 56%, 32%)", "hsl(197, 56%, 24%)", "hsl(197, 56%, 20%)"], dark: ["hsla(0,0%,0%,0.04)", "hsla(0,0%,0%,0.08)", token("--t-fill-color-transparency-dark-010"), token("--t-fill-color-transparency-dark-020"), token("--t-fill-color-transparency-dark-020"), token("--t-fill-color-transparency-dark-030"), token("--t-fill-color-transparency-dark-040"), token("--t-fill-color-transparency-dark-050"), token("--t-fill-color-transparency-dark-060"), token("--t-fill-color-transparency-dark-070")], days: { friday: "#F69688", monday: "#789FF8", saturday: "#66BEEB", sunday: "#7DC156", thursday: "#FA7EA4", tuesday: "#A193FD", wednesday: "#D18CF6" }, error: { base: token("--t-fill-color-button-delete-solid"), dark: token("--t-fill-color-button-delete-solid-hover"), darker: token("--t-fill-color-button-delete-solid-active"), light: "hsl(8, 60%, 85%)", lighter: token("--t-fill-color-status-error-ghost"), lightest: token("--t-fill-color-status-error-dim") }, foreground: { foreground: token("--t-text-color"), foregroundSecondary: token("--t-text-color-secondary"), foregroundTertiary: "hsl(0, 0%, 58%)" }, green: ["hsl(96, 24%, 92%)", "hsl(96, 30%, 84%)", "hsl(96, 32%, 76%)", "hsl(96, 34%, 72%)", "hsl(96, 36%, 64%)", "hsl(96, 40%, 58%)", "hsl(96, 44%, 50%)", "hsl(96, 48%, 40%)", "hsl(96, 52%, 30%)", "hsl(96, 60%, 20%)"], grey: [token("--t-fill-color-neutral-090"), token("--t-fill-color-neutral-080"), token("--t-fill-color-neutral-070"), token("--t-fill-color-neutral-060"), token("--t-fill-color-neutral-050"), token("--t-fill-color-neutral-040"), token("--t-fill-color-neutral-030"), token("--t-fill-color-neutral-025"), token("--t-fill-color-neutral-020"), token("--t-fill-color-neutral-010")], highlight: { highlight: token("--t-fill-color-neutral-070"), highlightSecondary: token("--t-fill-color-neutral-060") }, interaction: { base: token("--t-fill-color-interaction"), dark: token("--t-fill-color-interaction-hover"), darker: token("--t-fill-color-interaction-active"), darkest: "hsl(221, 90%, 31%)", light: "hsl(221, 91%, 70%)", lighter: "hsl(0, 0%, 81%);", lightest: token("--t-fill-color-interaction-disabled") }, light: [token("--t-fill-color-transparency-light-010"), token("--t-fill-color-transparency-light-020"), token("--t-fill-color-transparency-light-030"), token("--t-fill-color-transparency-light-040"), token("--t-fill-color-transparency-light-050"), token("--t-fill-color-transparency-light-060"), token("--t-fill-color-transparency-light-070"), token("--t-fill-color-transparency-light-080"), token("--t-fill-color-transparency-light-090"), "hsla(0,0%,100%,0.96)"], link: { linkBackground: token("--t-fill-color-neutral-090"), linkForeground: token("--t-text-color-interaction") }, primary: { base: "hsl(88, 44%, 40%)", dark: "hsl(88, 46%, 36%)", darker: "hsl(88, 52%, 32%)", darkest: "hsl(88, 72%, 20%)", light: "hsl(88, 40%, 54%)", lighter: "hsl(88, 32%, 86%)", lightest: "hsl(88, 24%, 92%)" }, red: ["hsl(8, 73%, 96%)", "hsl(8, 74%, 92%)", "hsl(8, 75%, 88%)", "hsl(8, 76%, 68%)", "hsl(8, 77%, 60%)", "hsl(8, 78%, 56%)", "hsl(8, 79%, 52%)", "hsl(8, 80%, 48%)", "hsl(8, 81%, 40%)", "hsl(8, 82%, 30%)"], separator: { separator: token("--t-fill-color-neutral-040"), separatorFocus: token("--t-form-border-color-focus"), separatorFocusSecondary: token("--t-fill-color-neutral-050"), separatorHover: token("--t-form-border-color-hover"), separatorSecondary: token("--t-fill-color-neutral-050"), separatorTertiary: token("--t-fill-color-neutral-050") }, success: { base: token("--t-fill-color-status-success"), dark: token("--t-text-color-status-success"), darker: "hsl(86, 91%, 23%)", light: token("--t-border-color-control-success"), lighter: token("--t-fill-color-status-success-ghost"), lightest: token("--t-fill-color-status-success-dim") }, surface: { surface: token("--t-surface-color-card"), surfaceSecondary: token("--t-surface-color-canvas"), surfaceTertiary: token("--t-fill-color-neutral-070") }, tapestry: o$3, warning: { base: token("--t-fill-color-status-warning"), dark: token("--t-fill-color-status-warning"), darker: token("--t-icon-color-status-warning"), light: "hsl(42, 87%, 90%)", lighter: token("--t-fill-color-status-warning-ghost"), lightest: token("--t-fill-color-status-warning-dim") }, yellow: ["hsl(50, 89%, 90%)", "hsl(50, 90%, 86%)", "hsl(50, 91%, 74%)", "hsl(50, 92%, 68%)", "hsl(50, 93%, 62%)", "hsl(50, 94%, 56%)", "hsl(50, 95%, 48%)", "hsl(50, 96%, 40%)", "hsl(50, 97%, 32%)", "hsl(50, 98%, 26%)"] }, s$1 = m(a$1);
|
|
4627
|
+
function c$2(l2) {
|
|
4628
|
+
return l2 ? s$1[l2] : s$1;
|
|
4629
4629
|
}
|
|
4630
|
-
var
|
|
4630
|
+
var c$1 = { boxSizes: i$2, breakpoints: { lg: 960, md: 720, sm: 600, xl: 1200, xs: 480 }, button: { themes: e$6 }, calendar: { weekStartsOn: 0 }, checkbox: { checkedFill: token("--t-fill-color-control"), checkedStroke: token("--t-fill-color-control"), disabled: { checkedFill: token("--t-fill-color-control-disabled"), checkedStroke: token("--t-border-color-control-disabled"), fill: token("--t-fill-color-neutral-070"), stroke: token("--t-border-color-control-disabled") }, fill: token("--t-surface-color-card"), focusStroke: token("--t-fill-color-control"), stroke: token("--t-border-color-control-neutral") }, colors: s$1, elevations: ["0 2px 5px rgba(0,0,0,0.043)", "0 4px 12px rgba(0,0,0,0.12)", "0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)", "0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23)", "0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22)", "0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22)"], fontSizes: [30, 21, 18, 16, 14, 12, 10], group: { radius: 3 }, icons: { general: o$5, tapestry: r$5 }, pageBody: { backgroundColor: token("--t-surface-color-card") }, id: "default", lineHeights: [40, 32, 24, 24, 20, 16, 16], spinner: { color: token("--t-fill-color-neutral-010"), sizes: { lg: 3, md: 2.5, sm: 2, xl: 5, xs: 1.75, xxl: 8, xxs: 1.5 }, thickness: { lg: 5, md: 4, sm: 3, xl: 7, xs: 3, xxl: 9, xxs: 3 }, trackColor: token("--t-fill-color-transparency-dark-020") }, toggleSwitch: { backgroundColor: token("--t-fill-color-control") } };
|
|
4631
4631
|
var _baseFindIndex;
|
|
4632
4632
|
var hasRequired_baseFindIndex;
|
|
4633
4633
|
function require_baseFindIndex() {
|
|
@@ -5794,7 +5794,7 @@ function k() {
|
|
|
5794
5794
|
}
|
|
5795
5795
|
function O(t2) {
|
|
5796
5796
|
if ("object" == typeof t2) {
|
|
5797
|
-
var r2 =
|
|
5797
|
+
var r2 = c$2(t2.base) || t2.base;
|
|
5798
5798
|
if ("transparent" === r2) return r2;
|
|
5799
5799
|
if (t2.darken && (r2 = curriedDarken$1(t2.darken, r2)), t2.lighten && (r2 = curriedLighten$1(t2.lighten, r2)), void 0 !== t2.alpha) {
|
|
5800
5800
|
var e2 = parseToRgb(r2), n2 = e2.red, u2 = e2.green, c2 = e2.blue;
|
|
@@ -5802,7 +5802,7 @@ function O(t2) {
|
|
|
5802
5802
|
}
|
|
5803
5803
|
return r2;
|
|
5804
5804
|
}
|
|
5805
|
-
return
|
|
5805
|
+
return c$2(t2) || t2;
|
|
5806
5806
|
}
|
|
5807
5807
|
function e$4(e2, t2) {
|
|
5808
5808
|
var b2 = e2.backgroundColor, d2 = e2.borderColor, C = e2.borderBottomColor, i2 = e2.borderLeftColor, s2 = e2.borderRightColor, c2 = e2.borderTopColor, f2 = e2.color, u2 = e2.fill, n2 = e2.outlineColor, m2 = e2.stroke, a2 = n$3(e2, ["backgroundColor", "borderColor", "borderBottomColor", "borderLeftColor", "borderRightColor", "borderTopColor", "color", "fill", "outlineColor", "stroke"]), k2 = { backgroundColor: b2, borderBottomColor: C, borderColor: d2, borderLeftColor: i2, borderRightColor: s2, borderTopColor: c2, color: f2, fill: u2, outlineColor: n2, stroke: m2 };
|
|
@@ -5878,14 +5878,14 @@ function e$1(e2, t2) {
|
|
|
5878
5878
|
return e2;
|
|
5879
5879
|
}
|
|
5880
5880
|
var c = [r$1, l, e$3, h, o$1, t$2, e$2, e$1, e$4, o$2, a, t$1];
|
|
5881
|
-
var o = ["alignContent", "alignItems", "alignSelf", "alignmentBaseline", "animation", "animationDelay", "animationDirection", "animationDuration", "animationFillMode", "animationIterationCount", "animationName", "animationPlayState", "animationTimingFunction", "aspectRatio", "backfaceVisibility", "background", "backgroundAttachment", "backgroundBlendMode", "backgroundClip", "backgroundImage", "backgroundOrigin", "backgroundPosition", "backgroundPositionX", "backgroundPositionY", "backgroundRepeat", "backgroundSize", "baselineShift", "border", "borderBottom", "borderBottomLeftRadius", "borderBottomRightRadius", "borderBottomStyle", "borderBottomWidth", "borderCollapse", "borderImage", "borderImageOutset", "borderImageRepeat", "borderImageSlice", "borderImageSource", "borderImageWidth", "borderLeft", "borderLeftStyle", "borderLeftWidth", "borderRadius", "borderRight", "borderRightStyle", "borderRightWidth", "borderSpacing", "borderStyle", "borderTop", "borderTopLeftRadius", "borderTopRightRadius", "borderTopStyle", "borderTopWidth", "borderWidth", "bottom", "boxShadow", "boxSizing", "breakAfter", "breakBefore", "breakInside", "clear", "clip", "clipPath", "clipRule", "columnCount", "columnFill", "columnGap", "columnRule", "columnRuleColor", "columnRuleStyle", "columnRuleWidth", "columnSpan", "columnWidth", "columns", "contain", "content", "counterIncrement", "counterReset", "cursor", "direction", "display", "fillOpacity", "fillRule", "filter", "flex", "flexBasis", "flexDirection", "flexFlow", "flexGrow", "flexShrink", "flexWrap", "font", "fontFamily", "fontFeatureSettings", "fontKerning", "fontSize", "fontStretch", "fontStyle", "fontVariant", "fontVariantCaps", "fontVariantLigatures", "fontVariantNumeric", "fontWeight", "gap", "gridArea", "gridAutoColumns", "gridAutoFlow", "gridAutoRows", "gridColumn", "gridColumnEnd", "gridColumnGap", "gridColumnStart", "gridGap", "gridRow", "gridRowEnd", "gridRowGap", "gridRowStart", "gridTemplate", "gridTemplateAreas", "gridTemplateColumns", "gridTemplateRows", "height", "hyphens", "imageRendering", "isolation", "justifyContent", "justifyItems", "justifySelf", "left", "letterSpacing", "lightingColor", "lineHeight", "listStyle", "listStyleImage", "listStylePosition", "listStyleType", "margin", "marginBottom", "marginLeft", "marginRight", "marginTop", "mask", "maskType", "maxHeight", "maxWidth", "minHeight", "minWidth", "mixBlendMode", "motion", "objectFit", "objectPosition", "opacity", "order", "outline", "outlineColor", "outlineOffset", "outlineStyle", "outlineWidth", "overflow", "overflowWrap", "overflowX", "overflowY", "padding", "paddingBottom", "paddingLeft", "paddingRight", "paddingTop", "pageBreakAfter", "pageBreakBefore", "pageBreakInside", "perspective", "perspectiveOrigin", "placeItems", "placeSelf", "pointerEvents", "position", "resize", "right", "strokeDasharray", "strokeDashoffset", "strokeLinecap", "strokeLinejoin", "strokeMiterlimit", "strokeOpacity", "strokeWidth", "tabSize", "tableLayout", "textAlign", "textDecoration", "textIndent", "textOrientation", "textOverflow", "textRendering", "textShadow", "textTransform", "top", "touchAction", "transform", "transformOrigin", "transformStyle", "transition", "transitionDelay", "transitionDuration", "transitionProperty", "transitionTimingFunction", "verticalAlign", "visibility", "clipPath", "filter", "userSelect", "WebkitOverflowScrolling", "writingMode", "whiteSpace", "width", "willChange", "wordBreak", "wordSpacing", "wordWrap", "zIndex"], e = ["backgroundColor", "borderColor", "borderBottomColor", "borderLeftColor", "borderRightColor", "borderTopColor", "color", "fill", "outlineColor", "stroke"], i$1 = ["css", "column", "columnStart", "columnEnd", "row", "rowStart", "rowEnd", "basis", "elevation", "grow", "marginHorizontal", "marginVertical", "paddingHorizontal", "paddingVertical", "radius", "radiusTop", "radiusRight", "radiusBottom", "radiusLeft", "x", "y", "rotate", "scale", "uppercase", "shrink", "wrap", "strokeAlign", "strokeWeight"], r = e$
|
|
5881
|
+
var o = ["alignContent", "alignItems", "alignSelf", "alignmentBaseline", "animation", "animationDelay", "animationDirection", "animationDuration", "animationFillMode", "animationIterationCount", "animationName", "animationPlayState", "animationTimingFunction", "aspectRatio", "backfaceVisibility", "background", "backgroundAttachment", "backgroundBlendMode", "backgroundClip", "backgroundImage", "backgroundOrigin", "backgroundPosition", "backgroundPositionX", "backgroundPositionY", "backgroundRepeat", "backgroundSize", "baselineShift", "border", "borderBottom", "borderBottomLeftRadius", "borderBottomRightRadius", "borderBottomStyle", "borderBottomWidth", "borderCollapse", "borderImage", "borderImageOutset", "borderImageRepeat", "borderImageSlice", "borderImageSource", "borderImageWidth", "borderLeft", "borderLeftStyle", "borderLeftWidth", "borderRadius", "borderRight", "borderRightStyle", "borderRightWidth", "borderSpacing", "borderStyle", "borderTop", "borderTopLeftRadius", "borderTopRightRadius", "borderTopStyle", "borderTopWidth", "borderWidth", "bottom", "boxShadow", "boxSizing", "breakAfter", "breakBefore", "breakInside", "clear", "clip", "clipPath", "clipRule", "columnCount", "columnFill", "columnGap", "columnRule", "columnRuleColor", "columnRuleStyle", "columnRuleWidth", "columnSpan", "columnWidth", "columns", "contain", "content", "counterIncrement", "counterReset", "cursor", "direction", "display", "fillOpacity", "fillRule", "filter", "flex", "flexBasis", "flexDirection", "flexFlow", "flexGrow", "flexShrink", "flexWrap", "font", "fontFamily", "fontFeatureSettings", "fontKerning", "fontSize", "fontStretch", "fontStyle", "fontVariant", "fontVariantCaps", "fontVariantLigatures", "fontVariantNumeric", "fontWeight", "gap", "gridArea", "gridAutoColumns", "gridAutoFlow", "gridAutoRows", "gridColumn", "gridColumnEnd", "gridColumnGap", "gridColumnStart", "gridGap", "gridRow", "gridRowEnd", "gridRowGap", "gridRowStart", "gridTemplate", "gridTemplateAreas", "gridTemplateColumns", "gridTemplateRows", "height", "hyphens", "imageRendering", "isolation", "justifyContent", "justifyItems", "justifySelf", "left", "letterSpacing", "lightingColor", "lineHeight", "listStyle", "listStyleImage", "listStylePosition", "listStyleType", "margin", "marginBottom", "marginLeft", "marginRight", "marginTop", "mask", "maskType", "maxHeight", "maxWidth", "minHeight", "minWidth", "mixBlendMode", "motion", "objectFit", "objectPosition", "opacity", "order", "outline", "outlineColor", "outlineOffset", "outlineStyle", "outlineWidth", "overflow", "overflowWrap", "overflowX", "overflowY", "padding", "paddingBottom", "paddingLeft", "paddingRight", "paddingTop", "pageBreakAfter", "pageBreakBefore", "pageBreakInside", "perspective", "perspectiveOrigin", "placeItems", "placeSelf", "pointerEvents", "position", "resize", "right", "strokeDasharray", "strokeDashoffset", "strokeLinecap", "strokeLinejoin", "strokeMiterlimit", "strokeOpacity", "strokeWidth", "tabSize", "tableLayout", "textAlign", "textDecoration", "textIndent", "textOrientation", "textOverflow", "textRendering", "textShadow", "textTransform", "top", "touchAction", "transform", "transformOrigin", "transformStyle", "transition", "transitionDelay", "transitionDuration", "transitionProperty", "transitionTimingFunction", "verticalAlign", "visibility", "clipPath", "filter", "userSelect", "WebkitOverflowScrolling", "writingMode", "whiteSpace", "width", "willChange", "wordBreak", "wordSpacing", "wordWrap", "zIndex"], e = ["backgroundColor", "borderColor", "borderBottomColor", "borderLeftColor", "borderRightColor", "borderTopColor", "color", "fill", "outlineColor", "stroke"], i$1 = ["css", "column", "columnStart", "columnEnd", "row", "rowStart", "rowEnd", "basis", "elevation", "grow", "marginHorizontal", "marginVertical", "paddingHorizontal", "paddingVertical", "radius", "radiusTop", "radiusRight", "radiusBottom", "radiusLeft", "x", "y", "rotate", "scale", "uppercase", "shrink", "wrap", "strokeAlign", "strokeWeight"], r = e$5(e$5(e$5([], o, true), e, true), i$1), n$1 = ["active", "focus", "hover"];
|
|
5882
5882
|
var n = c.length;
|
|
5883
5883
|
function s(t2, e2, s2) {
|
|
5884
5884
|
void 0 === t2 && (t2 = {});
|
|
5885
5885
|
var i2 = o$4({}, t2);
|
|
5886
5886
|
e2 && (i2 = e2.getStyles(i2, s2));
|
|
5887
|
-
for (var c$
|
|
5888
|
-
i2 = (0, c[c$
|
|
5887
|
+
for (var c$12 = 0; c$12 < n; c$12++) {
|
|
5888
|
+
i2 = (0, c[c$12])(i2, s2);
|
|
5889
5889
|
}
|
|
5890
5890
|
return i2.css && delete (i2 = o$4(o$4({}, i2), u(i2.css, e2, s2))).css, i2;
|
|
5891
5891
|
}
|
|
@@ -5931,6 +5931,6 @@ function t(t2) {
|
|
|
5931
5931
|
return false === b2 && (c3.display = "none"), [c3, f3, O3];
|
|
5932
5932
|
} });
|
|
5933
5933
|
}
|
|
5934
|
-
exports.defaultTheme =
|
|
5934
|
+
exports.defaultTheme = c$1;
|
|
5935
5935
|
exports.splitStyles = t;
|
|
5936
5936
|
exports.stylePropNames = r;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@planningcenter/tapestry-migration-cli",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.9.0-rc.10",
|
|
4
4
|
"description": "CLI tool for Tapestry migrations",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
34
34
|
"@emotion/react": "^11.14.0",
|
|
35
|
-
"@planningcenter/tapestry": "^2.
|
|
35
|
+
"@planningcenter/tapestry": "^2.9.0-rc.10",
|
|
36
36
|
"@planningcenter/tapestry-react": "^4.11.5",
|
|
37
37
|
"@types/jscodeshift": "^17.3.0",
|
|
38
38
|
"@types/node": "^20.0.0",
|
|
@@ -52,5 +52,5 @@
|
|
|
52
52
|
"publishConfig": {
|
|
53
53
|
"access": "public"
|
|
54
54
|
},
|
|
55
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "95027063c4c7bc3d1d05343b66a6b588a32aacf7"
|
|
56
56
|
}
|
|
@@ -311,10 +311,12 @@ export default function Test({ items }) {
|
|
|
311
311
|
}
|
|
312
312
|
`.trim()
|
|
313
313
|
|
|
314
|
-
const result = applyTransform(input)
|
|
314
|
+
const result = applyTransform(input)!
|
|
315
315
|
|
|
316
|
-
expect(result).toContain(
|
|
317
|
-
|
|
316
|
+
expect(result).toContain("<Tooltip")
|
|
317
|
+
expect(result).toContain("key={item.id}")
|
|
318
|
+
expect(result.replace(/\s+/g, " ")).toContain(
|
|
319
|
+
"{...{ title: `Save ${item.name}` }}"
|
|
318
320
|
)
|
|
319
321
|
expect(result).toContain("refAsInnerRef={false}")
|
|
320
322
|
expect(result).toContain("<Button onClick={() => save(item)}>")
|
|
@@ -1,48 +1,15 @@
|
|
|
1
1
|
import { Transform } from "jscodeshift"
|
|
2
2
|
|
|
3
|
-
import {
|
|
4
|
-
import { getAttributeValue } from "../../shared/actions/getAttributeValue"
|
|
5
|
-
import { hasAttribute } from "../../shared/conditions/hasAttribute"
|
|
6
|
-
import { attributeTransformFactory } from "../../shared/transformFactories/attributeTransformFactory"
|
|
3
|
+
import { sizeMappingFactory } from "../../shared/transformFactories/sizeMappingFactory"
|
|
7
4
|
|
|
8
|
-
const
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
const transform: Transform = attributeTransformFactory({
|
|
15
|
-
condition: hasAttribute("size"),
|
|
5
|
+
const transform: Transform = sizeMappingFactory({
|
|
6
|
+
sizeMapping: {
|
|
7
|
+
lg: "md",
|
|
8
|
+
xl: "md",
|
|
9
|
+
xs: "sm",
|
|
10
|
+
},
|
|
16
11
|
targetComponent: "Checkbox",
|
|
17
12
|
targetPackage: "@planningcenter/tapestry-react",
|
|
18
|
-
transform: (element, { j }) => {
|
|
19
|
-
let hasChanges = false
|
|
20
|
-
|
|
21
|
-
const sizeAttr = element.openingElement.attributes?.find(
|
|
22
|
-
(attr) => attr.type === "JSXAttribute" && attr.name.name === "size"
|
|
23
|
-
)
|
|
24
|
-
|
|
25
|
-
if (sizeAttr && sizeAttr.type === "JSXAttribute") {
|
|
26
|
-
const sizeValue = getAttributeValue({ attribute: sizeAttr, j })
|
|
27
|
-
|
|
28
|
-
if (sizeValue) {
|
|
29
|
-
const mappedSize = SIZE_MAPPING[sizeValue as keyof typeof SIZE_MAPPING]
|
|
30
|
-
|
|
31
|
-
if (mappedSize && mappedSize !== sizeValue) {
|
|
32
|
-
sizeAttr.value = j.stringLiteral(mappedSize)
|
|
33
|
-
hasChanges = true
|
|
34
|
-
|
|
35
|
-
addCommentToAttribute({
|
|
36
|
-
attribute: sizeAttr,
|
|
37
|
-
j,
|
|
38
|
-
text: `Size "${sizeValue}" was mapped to "${mappedSize}". Verify visual appearance as sizes may differ slightly.`,
|
|
39
|
-
})
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
return hasChanges
|
|
45
|
-
},
|
|
46
13
|
})
|
|
47
14
|
|
|
48
15
|
export default transform
|
|
@@ -302,10 +302,12 @@ export default function Test({ items }) {
|
|
|
302
302
|
}
|
|
303
303
|
`.trim()
|
|
304
304
|
|
|
305
|
-
const result = applyTransform(input)
|
|
305
|
+
const result = applyTransform(input)!
|
|
306
306
|
|
|
307
|
-
expect(result).toContain(
|
|
308
|
-
|
|
307
|
+
expect(result).toContain("<Tooltip")
|
|
308
|
+
expect(result).toContain("key={item.id}")
|
|
309
|
+
expect(result.replace(/\s+/g, " ")).toContain(
|
|
310
|
+
"{...{ title: `Save ${item.name}` }}"
|
|
309
311
|
)
|
|
310
312
|
expect(result).toContain(
|
|
311
313
|
"<Link href={item.url} onClick={() => save(item)}>"
|
|
@@ -4,12 +4,13 @@ import { addAttribute } from "../../shared/actions/addAttribute"
|
|
|
4
4
|
import { hasSpreadProps } from "../../shared/actions/hasSpreadProps"
|
|
5
5
|
import { andConditions } from "../../shared/conditions/andConditions"
|
|
6
6
|
import { hasAttribute } from "../../shared/conditions/hasAttribute"
|
|
7
|
+
import { notCondition } from "../../shared/conditions/notCondition"
|
|
7
8
|
import { attributeTransformFactory } from "../../shared/transformFactories/attributeTransformFactory"
|
|
8
9
|
|
|
9
10
|
const transform: Transform = attributeTransformFactory({
|
|
10
11
|
condition: andConditions(
|
|
11
|
-
(
|
|
12
|
-
(
|
|
12
|
+
notCondition(hasAttribute("size")),
|
|
13
|
+
notCondition(hasSpreadProps)
|
|
13
14
|
),
|
|
14
15
|
targetComponent: "Radio",
|
|
15
16
|
targetPackage: "@planningcenter/tapestry-react",
|
|
@@ -1,49 +1,15 @@
|
|
|
1
1
|
import { Transform } from "jscodeshift"
|
|
2
2
|
|
|
3
|
-
import {
|
|
4
|
-
import { getAttributeValue } from "../../shared/actions/getAttributeValue"
|
|
5
|
-
import { hasAttribute } from "../../shared/conditions/hasAttribute"
|
|
6
|
-
import { attributeTransformFactory } from "../../shared/transformFactories/attributeTransformFactory"
|
|
3
|
+
import { sizeMappingFactory } from "../../shared/transformFactories/sizeMappingFactory"
|
|
7
4
|
|
|
8
|
-
const
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
const transform: Transform = attributeTransformFactory({
|
|
15
|
-
condition: hasAttribute("size"),
|
|
5
|
+
const transform: Transform = sizeMappingFactory({
|
|
6
|
+
sizeMapping: {
|
|
7
|
+
lg: "md",
|
|
8
|
+
xl: "md",
|
|
9
|
+
xs: "sm",
|
|
10
|
+
},
|
|
16
11
|
targetComponent: "Radio",
|
|
17
12
|
targetPackage: "@planningcenter/tapestry-react",
|
|
18
|
-
transform: (element, { j }) => {
|
|
19
|
-
let hasChanges = false
|
|
20
|
-
|
|
21
|
-
const sizeAttr = element.openingElement.attributes?.find(
|
|
22
|
-
(attr) => attr.type === "JSXAttribute" && attr.name.name === "size"
|
|
23
|
-
)
|
|
24
|
-
|
|
25
|
-
if (sizeAttr && sizeAttr.type === "JSXAttribute") {
|
|
26
|
-
const sizeValue = getAttributeValue({ attribute: sizeAttr, j })
|
|
27
|
-
|
|
28
|
-
if (sizeValue) {
|
|
29
|
-
const mappedSize = SIZE_MAPPING[sizeValue as keyof typeof SIZE_MAPPING]
|
|
30
|
-
|
|
31
|
-
if (mappedSize && mappedSize !== sizeValue) {
|
|
32
|
-
// Normalize to a plain string attribute value (size="md")
|
|
33
|
-
sizeAttr.value = j.stringLiteral(mappedSize)
|
|
34
|
-
hasChanges = true
|
|
35
|
-
|
|
36
|
-
addCommentToAttribute({
|
|
37
|
-
attribute: sizeAttr,
|
|
38
|
-
j,
|
|
39
|
-
text: `Size "${sizeValue}" was mapped to "${mappedSize}". Verify visual appearance as sizes may differ slightly.`,
|
|
40
|
-
})
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
return hasChanges
|
|
46
|
-
},
|
|
47
13
|
})
|
|
48
14
|
|
|
49
15
|
export default transform
|
|
@@ -25,6 +25,21 @@ export function getAttributeValueAsProps({
|
|
|
25
25
|
}
|
|
26
26
|
if (attribute.value.type === "JSXExpressionContainer") {
|
|
27
27
|
if (attribute.value.expression.type !== "JSXEmptyExpression") {
|
|
28
|
+
if (attribute.value.expression.type === "ObjectExpression") {
|
|
29
|
+
return [j.jsxSpreadAttribute(attribute.value.expression)]
|
|
30
|
+
}
|
|
31
|
+
if (stringValueKey !== undefined) {
|
|
32
|
+
return [
|
|
33
|
+
j.jsxSpreadAttribute(
|
|
34
|
+
j.objectExpression([
|
|
35
|
+
j.objectProperty(
|
|
36
|
+
j.identifier(stringValueKey),
|
|
37
|
+
attribute.value.expression
|
|
38
|
+
),
|
|
39
|
+
])
|
|
40
|
+
),
|
|
41
|
+
]
|
|
42
|
+
}
|
|
28
43
|
return [j.jsxSpreadAttribute(attribute.value.expression)]
|
|
29
44
|
}
|
|
30
45
|
} else {
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { describe, expect, it } from "vitest"
|
|
2
|
+
|
|
3
|
+
import { hasAttribute } from "./hasAttribute"
|
|
4
|
+
import { createJSXElement } from "./helpers/createJSXElement"
|
|
5
|
+
import { notCondition } from "./notCondition"
|
|
6
|
+
|
|
7
|
+
describe("notCondition", () => {
|
|
8
|
+
it("should return true when condition is false", () => {
|
|
9
|
+
const condition = notCondition(hasAttribute("href"))
|
|
10
|
+
const element = createJSXElement(' className="test"')
|
|
11
|
+
|
|
12
|
+
expect(condition(element)).toBe(true)
|
|
13
|
+
})
|
|
14
|
+
|
|
15
|
+
it("should return false when condition is true", () => {
|
|
16
|
+
const condition = notCondition(hasAttribute("href"))
|
|
17
|
+
const element = createJSXElement(' href="/test"')
|
|
18
|
+
|
|
19
|
+
expect(condition(element)).toBe(false)
|
|
20
|
+
})
|
|
21
|
+
|
|
22
|
+
it("should handle nested conditions", () => {
|
|
23
|
+
const condition = notCondition(hasAttribute("disabled"))
|
|
24
|
+
const element = createJSXElement(" disabled")
|
|
25
|
+
|
|
26
|
+
expect(condition(element)).toBe(false)
|
|
27
|
+
})
|
|
28
|
+
|
|
29
|
+
it("should work with empty element", () => {
|
|
30
|
+
const condition = notCondition(hasAttribute("href"))
|
|
31
|
+
const element = createJSXElement("")
|
|
32
|
+
|
|
33
|
+
expect(condition(element)).toBe(true)
|
|
34
|
+
})
|
|
35
|
+
})
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { JSXElement } from "jscodeshift"
|
|
2
|
+
|
|
3
|
+
import { TransformCondition } from "../types"
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Helper function to negate a condition
|
|
7
|
+
*/
|
|
8
|
+
export function notCondition(
|
|
9
|
+
condition: TransformCondition
|
|
10
|
+
): TransformCondition {
|
|
11
|
+
return (element: JSXElement) => !condition(element)
|
|
12
|
+
}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import { Transform } from "jscodeshift"
|
|
2
|
+
|
|
3
|
+
import { addCommentToAttribute } from "../actions/addCommentToAttribute"
|
|
4
|
+
import { getAttributeValue } from "../actions/getAttributeValue"
|
|
5
|
+
import { hasAttribute } from "../conditions/hasAttribute"
|
|
6
|
+
import { attributeTransformFactory } from "./attributeTransformFactory"
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Factory function to create a size mapping transform.
|
|
10
|
+
* Maps size attribute values from old sizes to new sizes and adds comments.
|
|
11
|
+
*
|
|
12
|
+
* @param options - Configuration options for the size mapping transform
|
|
13
|
+
* @param options.targetComponent - The component name to target (e.g., "ToggleSwitch", "Radio")
|
|
14
|
+
* @param options.targetPackage - The package the component is imported from
|
|
15
|
+
* @param options.sizeMapping - Object mapping old size values to new size values (e.g., { xs: "sm", lg: "md" })
|
|
16
|
+
* @returns A Transform function that maps size attributes
|
|
17
|
+
*/
|
|
18
|
+
export function sizeMappingFactory(options: {
|
|
19
|
+
sizeMapping: Record<string, string>
|
|
20
|
+
targetComponent: string
|
|
21
|
+
targetPackage: string
|
|
22
|
+
}): Transform {
|
|
23
|
+
const { sizeMapping, ...restOptions } = options
|
|
24
|
+
return attributeTransformFactory({
|
|
25
|
+
condition: hasAttribute("size"),
|
|
26
|
+
...restOptions,
|
|
27
|
+
transform: (element, { j }) => {
|
|
28
|
+
let hasChanges = false
|
|
29
|
+
|
|
30
|
+
const sizeAttr = element.openingElement.attributes?.find(
|
|
31
|
+
(attr) => attr.type === "JSXAttribute" && attr.name.name === "size"
|
|
32
|
+
)
|
|
33
|
+
|
|
34
|
+
if (sizeAttr && sizeAttr.type === "JSXAttribute") {
|
|
35
|
+
const sizeValue = getAttributeValue({ attribute: sizeAttr, j })
|
|
36
|
+
|
|
37
|
+
if (sizeValue) {
|
|
38
|
+
const mappedSize = sizeMapping[sizeValue as keyof typeof sizeMapping]
|
|
39
|
+
|
|
40
|
+
if (mappedSize && mappedSize !== sizeValue) {
|
|
41
|
+
sizeAttr.value = j.stringLiteral(mappedSize)
|
|
42
|
+
hasChanges = true
|
|
43
|
+
|
|
44
|
+
addCommentToAttribute({
|
|
45
|
+
attribute: sizeAttr,
|
|
46
|
+
j,
|
|
47
|
+
text: `Size "${sizeValue}" was mapped to "${mappedSize}". Verify visual appearance as sizes may differ slightly.`,
|
|
48
|
+
})
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
return hasChanges
|
|
54
|
+
},
|
|
55
|
+
})
|
|
56
|
+
}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { Transform } from "jscodeshift"
|
|
2
|
+
|
|
3
|
+
import ariaLabelToLabel from "./transforms/ariaLabelToLabel"
|
|
4
|
+
import auditSpreadProps from "./transforms/auditSpreadProps"
|
|
5
|
+
import convertStyleProps from "./transforms/convertStyleProps"
|
|
6
|
+
import isCheckedToChecked from "./transforms/isCheckedToChecked"
|
|
7
|
+
import moveToggleSwitchImport from "./transforms/moveToggleSwitchImport"
|
|
8
|
+
import sizeMapping from "./transforms/sizeMapping"
|
|
9
|
+
import unsupportedProps from "./transforms/unsupportedProps"
|
|
10
|
+
|
|
11
|
+
const transform: Transform = (fileInfo, api, options) => {
|
|
12
|
+
let currentSource = fileInfo.source
|
|
13
|
+
let hasAnyChanges = false
|
|
14
|
+
|
|
15
|
+
const transforms = [
|
|
16
|
+
auditSpreadProps,
|
|
17
|
+
sizeMapping,
|
|
18
|
+
ariaLabelToLabel,
|
|
19
|
+
isCheckedToChecked,
|
|
20
|
+
convertStyleProps,
|
|
21
|
+
unsupportedProps,
|
|
22
|
+
moveToggleSwitchImport,
|
|
23
|
+
]
|
|
24
|
+
|
|
25
|
+
for (const individualTransform of transforms) {
|
|
26
|
+
const result = individualTransform(
|
|
27
|
+
{ ...fileInfo, source: currentSource },
|
|
28
|
+
api,
|
|
29
|
+
options
|
|
30
|
+
)
|
|
31
|
+
if (result && result !== currentSource) {
|
|
32
|
+
currentSource = result as string
|
|
33
|
+
hasAnyChanges = true
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
return hasAnyChanges ? currentSource : null
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
export default transform
|