From 62b8579cebf6c5d981355164d60ace2d2902508f Mon Sep 17 00:00:00 2001 From: Abbas Nazar Date: Wed, 16 Oct 2024 02:20:19 +0500 Subject: [PATCH] chore: synced wab with plasmic GitOrigin-RevId: 8587765b3d87455ea124aaaa3d03ecb8ac439906 --- platform/wab/plasmic.json | 18 +- platform/wab/plasmic.lock | 116 ++++++------- .../PP__plasmickit_design_system.module.css | 156 +++++++++--------- .../src/wab/client/plasmic/PlasmicButton.tsx | 102 ++++++++---- .../wab/client/plasmic/PlasmicIconButton.tsx | 102 ++++++++---- .../plasmic_kit/PlasmicIcon__Playsvg.tsx | 6 +- .../plasmic_kit/PlasmicPanelDivider.tsx | 60 ++++++- .../plasmic/plasmic_kit/PlasmicSearchbox.tsx | 86 +++++++--- .../plasmic/plasmic_kit/PlasmicTextbox.tsx | 104 +++++++----- .../PlasmicActionMenuButton.tsx | 109 +++++++----- .../PlasmicCheckbox.tsx | 105 ++++++++---- .../plasmic_kit_design_system/PlasmicChip.tsx | 80 ++++++--- .../PlasmicDropdownOverlay.tsx | 61 +++++-- .../PlasmicExpandButton.tsx | 88 +++++++--- .../PlasmicFreeTrial.tsx | 88 +++++++--- .../PlasmicIndicator.tsx | 69 ++++++-- .../PlasmicInlineEditable.tsx | 98 +++++++---- .../PlasmicListItem.tsx | 154 ++++++++++------- .../PlasmicListSection.tsx | 95 +++++++---- .../PlasmicListSectionHeader.tsx | 104 ++++++++---- .../PlasmicListSectionSeparator.tsx | 67 ++++++-- .../PlasmicMenuButton.tsx | 85 +++++++--- .../PlasmicModal.tsx | 79 ++++++--- .../PlasmicSelect.tsx | 134 +++++++++------ .../PlasmicSelect__Option.tsx | 84 +++++++--- .../PlasmicSelect__OptionGroup.tsx | 82 ++++++--- .../PlasmicSelect__Overlay.tsx | 82 ++++++--- .../PlasmicSwitch.tsx | 87 +++++++--- .../PlasmicTextWithInfo.tsx | 73 ++++++-- .../PlasmicTextarea.tsx | 60 ++++++- .../PlasmicIcon__DoubleDotsVerticalsvg.tsx | 10 +- .../src/wab/styles/plasmic-tokens.theo.json | 2 +- 32 files changed, 1792 insertions(+), 854 deletions(-) diff --git a/platform/wab/plasmic.json b/platform/wab/plasmic.json index 964550aa5b6..23c916172c3 100644 --- a/platform/wab/plasmic.json +++ b/platform/wab/plasmic.json @@ -2042,8 +2042,8 @@ }, { "id": "j39GoLwZnf7-v", - "name": "PlaysvgIcon", - "moduleFilePath": "wab/client/plasmic/plasmic_kit/PlasmicIcon__Playsvg.tsx" + "name": "PlaySvgIcon", + "moduleFilePath": "wab/client/plasmic/plasmic_kit/PlasmicIcon__PlaySvg.tsx" }, { "id": "BGTwDE0-XM3EQ", @@ -3142,8 +3142,8 @@ }, { "id": "cRhITljQuV", - "name": "DoubleDotsVerticalsvgIcon", - "moduleFilePath": "wab/client/plasmic/plasmic_kit_design_system/icons/PlasmicIcon__DoubleDotsVerticalsvg.tsx" + "name": "DoubleDotsVerticalSvgIcon", + "moduleFilePath": "wab/client/plasmic/plasmic_kit_design_system/icons/PlasmicIcon__DoubleDotsVerticalSvg.tsx" }, { "id": "eayXbyej4Q", @@ -3175,12 +3175,12 @@ { "id": "CnSA9ESJHWP4n", "name": "Alert.svg", - "filePath": "wab/client/plasmic/plasmic_kit_design_system/images/alertsvg.svg" + "filePath": "wab/client/plasmic/plasmic_kit_design_system/images/alertSvg.svg" }, { "id": "Zx-kyHRa6Q6PA", "name": "Eye.svg", - "filePath": "wab/client/plasmic/plasmic_kit_design_system/images/eyesvg.svg" + "filePath": "wab/client/plasmic/plasmic_kit_design_system/images/eyeSvg.svg" }, { "id": "tU5tnPRdetL29", @@ -3226,8 +3226,7 @@ "indirect": false, "globalContextsFilePath": "", "customFunctions": [], - "splitsProviderFilePath": "", - "jsBundleThemes": [] + "splitsProviderFilePath": "" }, { "projectId": "wT5BWZPEc2fYxyqbTLXMt2", @@ -3764,7 +3763,8 @@ "indirect": false, "globalContextsFilePath": "wab/client/plasmic/plasmic_kit_new_design_system_former_style_controls/PlasmicGlobalContextsProvider.tsx", "splitsProviderFilePath": "", - "customFunctions": [] + "customFunctions": [], + "jsBundleThemes": [] }, { "projectId": "dyzP6dbCdycwJpqiR2zkwe", diff --git a/platform/wab/plasmic.lock b/platform/wab/plasmic.lock index bfd8a1a9310..6a15c8fea32 100644 --- a/platform/wab/plasmic.lock +++ b/platform/wab/plasmic.lock @@ -2,7 +2,7 @@ "projects": [ { "projectId": "tXkSR39sgCDWSitZxC5xFV", - "version": "81.0.4", + "version": "82.0.0", "dependencies": { "sDniSX4oPUZFyk2sXXb3nh": "6.1.0", "oT38tGyqov9SPWHpf3Y2Rf": "5.5.1", @@ -13,182 +13,182 @@ { "type": "renderModule", "assetId": "pA22NEzDCsn_", - "checksum": "55842f3624a407fc5a3d45bb3f70bac4" + "checksum": "f6da9af9b96f1439d79c031221d255e5" }, { "type": "cssRules", "assetId": "pA22NEzDCsn_", - "checksum": "55842f3624a407fc5a3d45bb3f70bac4" + "checksum": "f6da9af9b96f1439d79c031221d255e5" }, { "type": "renderModule", "assetId": "SEF-sRmSoqV5c", - "checksum": "7bdfde20c36f6fea3bbd7714237f0648" + "checksum": "bf8cb7c90edeaa1a35957520eeaea183" }, { "type": "cssRules", "assetId": "SEF-sRmSoqV5c", - "checksum": "7bdfde20c36f6fea3bbd7714237f0648" + "checksum": "bf8cb7c90edeaa1a35957520eeaea183" }, { "type": "renderModule", "assetId": "LPry-TF4j22a", - "checksum": "3a9008204957d2d810180e1cb6d0f8ef" + "checksum": "eccf9fb419725579b262dc78839385a8" }, { "type": "cssRules", "assetId": "LPry-TF4j22a", - "checksum": "3a9008204957d2d810180e1cb6d0f8ef" + "checksum": "eccf9fb419725579b262dc78839385a8" }, { "type": "renderModule", "assetId": "po7gr0PX4_gWo", - "checksum": "9968ee29a8f097833014619d3c475473" + "checksum": "6c1de73ffaeded687e3d9748eefe3adc" }, { "type": "cssRules", "assetId": "po7gr0PX4_gWo", - "checksum": "9968ee29a8f097833014619d3c475473" + "checksum": "6c1de73ffaeded687e3d9748eefe3adc" }, { "type": "renderModule", "assetId": "0NaTcyuAGK2dN", - "checksum": "5139b38db84aba312aba4479c2fefbc1" + "checksum": "9c7ac5154ee40d1d273edcf8a167bf1b" }, { "type": "cssRules", "assetId": "0NaTcyuAGK2dN", - "checksum": "5139b38db84aba312aba4479c2fefbc1" + "checksum": "9c7ac5154ee40d1d273edcf8a167bf1b" }, { "type": "renderModule", "assetId": "v31d9_ANqk", - "checksum": "7a048d47d002d5c853ff9e3c4d14aa4a" + "checksum": "9a947ea0b4340fbef5c31d8e5f87f2a9" }, { "type": "cssRules", "assetId": "v31d9_ANqk", - "checksum": "7a048d47d002d5c853ff9e3c4d14aa4a" + "checksum": "9a947ea0b4340fbef5c31d8e5f87f2a9" }, { "type": "renderModule", "assetId": "jW885tExwE", - "checksum": "bf7da1931db6d1553028419e6471c59e" + "checksum": "7e89a99701039509765698fc414c7778" }, { "type": "cssRules", "assetId": "jW885tExwE", - "checksum": "bf7da1931db6d1553028419e6471c59e" + "checksum": "7e89a99701039509765698fc414c7778" }, { "type": "renderModule", "assetId": "wNvxk7eOak", - "checksum": "a79f9e409adaafa40b4a9610a878bdb6" + "checksum": "27bd05118296725970716f8294a4374d" }, { "type": "cssRules", "assetId": "wNvxk7eOak", - "checksum": "a79f9e409adaafa40b4a9610a878bdb6" + "checksum": "27bd05118296725970716f8294a4374d" }, { "type": "renderModule", "assetId": "uG5_fPM0sK", - "checksum": "bda81f563b0e0b701a0684dffec4902f" + "checksum": "9bb4b3b7f514da68ac8744c5741d22e4" }, { "type": "cssRules", "assetId": "uG5_fPM0sK", - "checksum": "bda81f563b0e0b701a0684dffec4902f" + "checksum": "9bb4b3b7f514da68ac8744c5741d22e4" }, { "type": "renderModule", "assetId": "znioE83CPU", - "checksum": "860fe5ca1ff2ac1faf058813a194bbce" + "checksum": "f26f3768830787969f642f7e28c87e02" }, { "type": "cssRules", "assetId": "znioE83CPU", - "checksum": "860fe5ca1ff2ac1faf058813a194bbce" + "checksum": "f26f3768830787969f642f7e28c87e02" }, { "type": "renderModule", "assetId": "pFgBG9DS0D", - "checksum": "b71cbc54a94ba8715d8fcd74e8e5079a" + "checksum": "70c87b4760aca24b6818bcb3c34bfee8" }, { "type": "cssRules", "assetId": "pFgBG9DS0D", - "checksum": "b71cbc54a94ba8715d8fcd74e8e5079a" + "checksum": "70c87b4760aca24b6818bcb3c34bfee8" }, { "type": "renderModule", "assetId": "KRNHR6lpj1", - "checksum": "f70e72e5b348022426d9843571c92a6b" + "checksum": "796e01c79105084059a7e24436898ab1" }, { "type": "cssRules", "assetId": "KRNHR6lpj1", - "checksum": "f70e72e5b348022426d9843571c92a6b" + "checksum": "796e01c79105084059a7e24436898ab1" }, { "type": "renderModule", "assetId": "h69wHrrKtL", - "checksum": "9b1b938abaeab5a0a202183d52cdd78a" + "checksum": "de1eec35bc7ef721cc66d38c3b1e877e" }, { "type": "cssRules", "assetId": "h69wHrrKtL", - "checksum": "9b1b938abaeab5a0a202183d52cdd78a" + "checksum": "de1eec35bc7ef721cc66d38c3b1e877e" }, { "type": "renderModule", "assetId": "JJhv0MV9DH", - "checksum": "678b33891d85fcec08d3db3545111a1e" + "checksum": "2d59551c89847c155efb24bc411cc0c0" }, { "type": "cssRules", "assetId": "JJhv0MV9DH", - "checksum": "678b33891d85fcec08d3db3545111a1e" + "checksum": "2d59551c89847c155efb24bc411cc0c0" }, { "type": "renderModule", "assetId": "VNi6NC2QOI", - "checksum": "578cf7f2e8fc836d4318868a8b76e8f8" + "checksum": "7244c18691bd4b98964418b0b52b2cd0" }, { "type": "cssRules", "assetId": "VNi6NC2QOI", - "checksum": "578cf7f2e8fc836d4318868a8b76e8f8" + "checksum": "7244c18691bd4b98964418b0b52b2cd0" }, { "type": "renderModule", "assetId": "btpz7A3thO", - "checksum": "f76c154c320ec344214d5950d1a57e40" + "checksum": "b13b1b573e1f24406ddec83e6d73ded1" }, { "type": "cssRules", "assetId": "btpz7A3thO", - "checksum": "f76c154c320ec344214d5950d1a57e40" + "checksum": "b13b1b573e1f24406ddec83e6d73ded1" }, { "type": "renderModule", "assetId": "rD0wOVzSnE", - "checksum": "fc8861271b8029fde8b73c51801b1c5d" + "checksum": "50f826e086387a4621e81857cfa7a7eb" }, { "type": "cssRules", "assetId": "rD0wOVzSnE", - "checksum": "fc8861271b8029fde8b73c51801b1c5d" + "checksum": "50f826e086387a4621e81857cfa7a7eb" }, { "type": "image", "assetId": "CnSA9ESJHWP4n", - "checksum": "f5b9a783867933a9f23f8cedb4e26af8" + "checksum": "47bf60ab329ec7d2f41b337886b1f7b1" }, { "type": "image", "assetId": "Zx-kyHRa6Q6PA", - "checksum": "c8f5ed24060b90529431f95f56d8a71a" + "checksum": "98cfe5874f5a8600a566c8a41fdccce3" }, { "type": "image", @@ -218,72 +218,72 @@ { "type": "renderModule", "assetId": "-EsDm7v023", - "checksum": "1114da54946236c7df81ae6ae9d358fd" + "checksum": "b0a03d349b28c114fa709ba530857a10" }, { "type": "cssRules", "assetId": "-EsDm7v023", - "checksum": "1114da54946236c7df81ae6ae9d358fd" + "checksum": "b0a03d349b28c114fa709ba530857a10" }, { "type": "renderModule", "assetId": "j_4IQyOWK2b", - "checksum": "5a7fb550ede0dd1d6aaf7e24d29e3047" + "checksum": "3988caec523c256d9dc6af2aa93bd6bf" }, { "type": "cssRules", "assetId": "j_4IQyOWK2b", - "checksum": "5a7fb550ede0dd1d6aaf7e24d29e3047" + "checksum": "3988caec523c256d9dc6af2aa93bd6bf" }, { "type": "renderModule", "assetId": "rr-LWdMni2G", - "checksum": "f96f9f461ffe8744068be50e37cdaaff" + "checksum": "bec6e327eb30cf4e969d0c27c83daa17" }, { "type": "cssRules", "assetId": "rr-LWdMni2G", - "checksum": "f96f9f461ffe8744068be50e37cdaaff" + "checksum": "bec6e327eb30cf4e969d0c27c83daa17" }, { "type": "renderModule", "assetId": "_qMm1mtrqOi", - "checksum": "6c8030d665c89baa00ea343bf14516c4" + "checksum": "4e65501adce595dc8f47481981688cdd" }, { "type": "cssRules", "assetId": "_qMm1mtrqOi", - "checksum": "6c8030d665c89baa00ea343bf14516c4" + "checksum": "4e65501adce595dc8f47481981688cdd" }, { "type": "renderModule", "assetId": "j2qDLcsq5qB", - "checksum": "cfaaf4bf5e3cd11a9ec0533e772b9081" + "checksum": "b223fc4b48b71645d8f03c114521cc23" }, { "type": "cssRules", "assetId": "j2qDLcsq5qB", - "checksum": "cfaaf4bf5e3cd11a9ec0533e772b9081" + "checksum": "b223fc4b48b71645d8f03c114521cc23" }, { "type": "renderModule", "assetId": "W-rO7NZqPjZ", - "checksum": "c78cfbb8ccb13114ff85ad6f327ee0ce" + "checksum": "54849781c49bbdd23cb27b846a862f93" }, { "type": "cssRules", "assetId": "W-rO7NZqPjZ", - "checksum": "c78cfbb8ccb13114ff85ad6f327ee0ce" + "checksum": "54849781c49bbdd23cb27b846a862f93" }, { "type": "renderModule", "assetId": "b35JDgXpbiF", - "checksum": "5f40fdd7354eb3866c47c87183546eea" + "checksum": "0dcdec101495159bb7a1ec1310badc40" }, { "type": "cssRules", "assetId": "b35JDgXpbiF", - "checksum": "5f40fdd7354eb3866c47c87183546eea" + "checksum": "0dcdec101495159bb7a1ec1310badc40" }, { "type": "icon", @@ -458,7 +458,7 @@ { "type": "icon", "assetId": "j39GoLwZnf7-v", - "checksum": "9df4e947dbfa5d48852229bf364dcc81" + "checksum": "371bc3993bc80b3a12fce2d95ffc6150" }, { "type": "icon", @@ -1553,27 +1553,27 @@ { "type": "icon", "assetId": "cRhITljQuV", - "checksum": "74c3c9baf79750f4617f16f8fc06242d" + "checksum": "ac1e92a8c9efb6310f8813f6fc258ce1" }, { "type": "renderModule", "assetId": "p3GgKAlaQe", - "checksum": "8231e4e1967b1141200ea351a6db0651" + "checksum": "d43045ddef4ec51bf682fcf9a7da881d" }, { "type": "cssRules", "assetId": "p3GgKAlaQe", - "checksum": "8231e4e1967b1141200ea351a6db0651" + "checksum": "d43045ddef4ec51bf682fcf9a7da881d" }, { "type": "renderModule", "assetId": "0PXsxyd1hG", - "checksum": "f484d432dc7499bf721394c765038cae" + "checksum": "7bc0a7a321db408d75bde73d4cbe32eb" }, { "type": "cssRules", "assetId": "0PXsxyd1hG", - "checksum": "f484d432dc7499bf721394c765038cae" + "checksum": "7bc0a7a321db408d75bde73d4cbe32eb" }, { "type": "icon", @@ -1603,7 +1603,7 @@ { "assetId": "tXkSR39sgCDWSitZxC5xFV", "type": "projectCss", - "checksum": "75cc2a5dcef012e9b5c8d39567cb853c" + "checksum": "01799daad8873488fe347a20b5f79fe5" } ], "codegenVersion": "0.0.1" diff --git a/platform/wab/src/wab/client/plasmic/PP__plasmickit_design_system.module.css b/platform/wab/src/wab/client/plasmic/PP__plasmickit_design_system.module.css index 9ed5d6d44b6..2eeb1489099 100644 --- a/platform/wab/src/wab/client/plasmic/PP__plasmickit_design_system.module.css +++ b/platform/wab/src/wab/client/plasmic/PP__plasmickit_design_system.module.css @@ -16,58 +16,58 @@ } .plasmic_default_styles { - --mixin-qP3g6Hd5AdC-tXkSR_text-decoration-line: none; - --mixin-qP3g6Hd5AdC-tXkSR_font-family: "Inter", sans-serif; - --mixin-qP3g6Hd5AdC-tXkSR_color: var(--token-0IloF6TmFvF); - --mixin-qP3g6Hd5AdC-tXkSR_font-size: 12px; - --mixin-qP3g6Hd5AdC-tXkSR_white-space: pre-wrap; - --mixin-qP3g6Hd5AdC-tXkSR_line-height: 1.5; - --mixin-2zEfljePq9P-tXkSR_color: var(--token-VUsIDivgUss); - --mixin-2zEfljePq9P-tXkSR_white-space: pre-wrap; - --mixin-EEKi5Tu2fbK-tXkSR_white-space: pre-wrap; - --mixin-YQD_Uc8Md_-tXkSR_font-family: "Inter", sans-serif; - --mixin-YQD_Uc8Md_-tXkSR_font-size: 72px; - --mixin-YQD_Uc8Md_-tXkSR_font-weight: 500; - --mixin-YQD_Uc8Md_-tXkSR_white-space: pre-wrap; - --mixin-vEOXQLfcbC-tXkSR_font-family: "Inter", sans-serif; - --mixin-vEOXQLfcbC-tXkSR_font-size: 48px; - --mixin-vEOXQLfcbC-tXkSR_font-weight: 500; - --mixin-vEOXQLfcbC-tXkSR_white-space: pre-wrap; - --mixin-EXCWDILscU-tXkSR_font-family: "Inter", sans-serif; - --mixin-EXCWDILscU-tXkSR_font-size: 32px; - --mixin-EXCWDILscU-tXkSR_font-weight: 500; - --mixin-EXCWDILscU-tXkSR_white-space: pre-wrap; - --mixin-N7cG0Ri48QP-tXkSR_font-family: "Inter", sans-serif; - --mixin-N7cG0Ri48QP-tXkSR_font-size: 24px; - --mixin-N7cG0Ri48QP-tXkSR_font-weight: 500; - --mixin-N7cG0Ri48QP-tXkSR_white-space: pre-wrap; - --mixin-__gfw12lSVA-tXkSR_font-family: "Inter", sans-serif; - --mixin-__gfw12lSVA-tXkSR_font-size: 20px; - --mixin-__gfw12lSVA-tXkSR_font-weight: 500; - --mixin-__gfw12lSVA-tXkSR_white-space: pre-wrap; - --mixin-eoQXVRNaCyL-tXkSR_font-family: "Inter", sans-serif; - --mixin-eoQXVRNaCyL-tXkSR_font-size: 16px; - --mixin-eoQXVRNaCyL-tXkSR_font-weight: 500; - --mixin-eoQXVRNaCyL-tXkSR_white-space: pre-wrap; - --mixin-fkU_lzw4PF5-tXkSR_white-space: pre-wrap; - --mixin-v9e0yiTlX_o-tXkSR_white-space: pre-wrap; - --mixin-MMatKfNT024-tXkSR_white-space: pre-wrap; - --mixin-EuhGUWboGh2-tXkSR_position: relative; - --mixin-EuhGUWboGh2-tXkSR_white-space: pre-wrap; - --mixin-_MYD1z_SMDp-tXkSR_position: relative; - --mixin-_MYD1z_SMDp-tXkSR_white-space: pre-wrap; - --mixin-Yot8xJYsc-tXkSR_white-space: pre-wrap; - --mixin-985HZFQW4-tXkSR_white-space: pre-wrap; - --mixin-3i6_2FI7G-tXkSR_white-space: pre-wrap; - --mixin-3HZrBcpB6-tXkSR_white-space: pre-wrap; - --mixin-n1REaG4FH-tXkSR_white-space: pre-wrap; - --mixin-Hk5zzHaLS-tXkSR_white-space: pre-wrap; - --mixin-B4DR1AgPG-tXkSR_white-space: pre-wrap; - --mixin-bhSle9dw7-tXkSR_white-space: pre-wrap; - --mixin-5d8gGYi39-tXkSR_white-space: pre-wrap; - --mixin-sxjZ0YFFF-tXkSR_white-space: pre-wrap; - --mixin-GZm4AQ_Ek-tXkSR_white-space: pre-wrap; - --mixin-qjB654aOL-tXkSR_white-space: pre-wrap; + --mixin-qP3g6Hd5AdC_text-decoration-line: none; + --mixin-qP3g6Hd5AdC_font-family: "Inter", sans-serif; + --mixin-qP3g6Hd5AdC_color: var(--token-0IloF6TmFvF); + --mixin-qP3g6Hd5AdC_font-size: 12px; + --mixin-qP3g6Hd5AdC_white-space: pre-wrap; + --mixin-qP3g6Hd5AdC_line-height: 1.5; + --mixin-2zEfljePq9P_color: var(--token-VUsIDivgUss); + --mixin-2zEfljePq9P_white-space: pre-wrap; + --mixin-EEKi5Tu2fbK_white-space: pre-wrap; + --mixin-YQD_Uc8Md__font-family: "Inter", sans-serif; + --mixin-YQD_Uc8Md__font-size: 72px; + --mixin-YQD_Uc8Md__font-weight: 500; + --mixin-YQD_Uc8Md__white-space: pre-wrap; + --mixin-vEOXQLfcbC_font-family: "Inter", sans-serif; + --mixin-vEOXQLfcbC_font-size: 48px; + --mixin-vEOXQLfcbC_font-weight: 500; + --mixin-vEOXQLfcbC_white-space: pre-wrap; + --mixin-EXCWDILscU_font-family: "Inter", sans-serif; + --mixin-EXCWDILscU_font-size: 32px; + --mixin-EXCWDILscU_font-weight: 500; + --mixin-EXCWDILscU_white-space: pre-wrap; + --mixin-N7cG0Ri48QP_font-family: "Inter", sans-serif; + --mixin-N7cG0Ri48QP_font-size: 24px; + --mixin-N7cG0Ri48QP_font-weight: 500; + --mixin-N7cG0Ri48QP_white-space: pre-wrap; + --mixin-__gfw12lSVA_font-family: "Inter", sans-serif; + --mixin-__gfw12lSVA_font-size: 20px; + --mixin-__gfw12lSVA_font-weight: 500; + --mixin-__gfw12lSVA_white-space: pre-wrap; + --mixin-eoQXVRNaCyL_font-family: "Inter", sans-serif; + --mixin-eoQXVRNaCyL_font-size: 16px; + --mixin-eoQXVRNaCyL_font-weight: 500; + --mixin-eoQXVRNaCyL_white-space: pre-wrap; + --mixin-fkU_lzw4PF5_white-space: pre-wrap; + --mixin-v9e0yiTlX_o_white-space: pre-wrap; + --mixin-MMatKfNT024_white-space: pre-wrap; + --mixin-EuhGUWboGh2_position: relative; + --mixin-EuhGUWboGh2_white-space: pre-wrap; + --mixin-_MYD1z_SMDp_position: relative; + --mixin-_MYD1z_SMDp_white-space: pre-wrap; + --mixin-Yot8xJYsc_white-space: pre-wrap; + --mixin-985HZFQW4_white-space: pre-wrap; + --mixin-3i6_2FI7G_white-space: pre-wrap; + --mixin-3HZrBcpB6_white-space: pre-wrap; + --mixin-n1REaG4FH_white-space: pre-wrap; + --mixin-Hk5zzHaLS_white-space: pre-wrap; + --mixin-B4DR1AgPG_white-space: pre-wrap; + --mixin-bhSle9dw7_white-space: pre-wrap; + --mixin-5d8gGYi39_white-space: pre-wrap; + --mixin-sxjZ0YFFF_white-space: pre-wrap; + --mixin-GZm4AQ_Ek_white-space: pre-wrap; + --mixin-qjB654aOL_white-space: pre-wrap; } .plasmic_mixins { @@ -468,11 +468,11 @@ white-space: normal; } :where(.root_reset) { - font-family: var(--mixin-qP3g6Hd5AdC-tXkSR_font-family); - font-size: var(--mixin-qP3g6Hd5AdC-tXkSR_font-size); - color: var(--mixin-qP3g6Hd5AdC-tXkSR_color); - line-height: var(--mixin-qP3g6Hd5AdC-tXkSR_line-height); - white-space: var(--mixin-qP3g6Hd5AdC-tXkSR_white-space); + font-family: var(--mixin-qP3g6Hd5AdC_font-family); + font-size: var(--mixin-qP3g6Hd5AdC_font-size); + color: var(--mixin-qP3g6Hd5AdC_color); + line-height: var(--mixin-qP3g6Hd5AdC_line-height); + white-space: var(--mixin-qP3g6Hd5AdC_white-space); } :where(.root_reset) a:where(.a), @@ -480,7 +480,7 @@ a:where(.root_reset.a), :where(.root_reset .__wab_expr_html_text) a, :where(.root_reset_tags) a, a:where(.root_reset_tags) { - color: var(--mixin-2zEfljePq9P-tXkSR_color); + color: var(--mixin-2zEfljePq9P_color); } :where(.root_reset) a:where(.a):hover, @@ -495,9 +495,9 @@ h1:where(.root_reset.h1), :where(.root_reset .__wab_expr_html_text) h1, :where(.root_reset_tags) h1, h1:where(.root_reset_tags) { - font-family: var(--mixin-YQD_Uc8Md_-tXkSR_font-family); - font-size: var(--mixin-YQD_Uc8Md_-tXkSR_font-size); - font-weight: var(--mixin-YQD_Uc8Md_-tXkSR_font-weight); + font-family: var(--mixin-YQD_Uc8Md__font-family); + font-size: var(--mixin-YQD_Uc8Md__font-size); + font-weight: var(--mixin-YQD_Uc8Md__font-weight); } :where(.root_reset) h2:where(.h2), @@ -505,9 +505,9 @@ h2:where(.root_reset.h2), :where(.root_reset .__wab_expr_html_text) h2, :where(.root_reset_tags) h2, h2:where(.root_reset_tags) { - font-family: var(--mixin-vEOXQLfcbC-tXkSR_font-family); - font-size: var(--mixin-vEOXQLfcbC-tXkSR_font-size); - font-weight: var(--mixin-vEOXQLfcbC-tXkSR_font-weight); + font-family: var(--mixin-vEOXQLfcbC_font-family); + font-size: var(--mixin-vEOXQLfcbC_font-size); + font-weight: var(--mixin-vEOXQLfcbC_font-weight); } :where(.root_reset) h3:where(.h3), @@ -515,9 +515,9 @@ h3:where(.root_reset.h3), :where(.root_reset .__wab_expr_html_text) h3, :where(.root_reset_tags) h3, h3:where(.root_reset_tags) { - font-family: var(--mixin-EXCWDILscU-tXkSR_font-family); - font-size: var(--mixin-EXCWDILscU-tXkSR_font-size); - font-weight: var(--mixin-EXCWDILscU-tXkSR_font-weight); + font-family: var(--mixin-EXCWDILscU_font-family); + font-size: var(--mixin-EXCWDILscU_font-size); + font-weight: var(--mixin-EXCWDILscU_font-weight); } :where(.root_reset) h4:where(.h4), @@ -525,9 +525,9 @@ h4:where(.root_reset.h4), :where(.root_reset .__wab_expr_html_text) h4, :where(.root_reset_tags) h4, h4:where(.root_reset_tags) { - font-family: var(--mixin-N7cG0Ri48QP-tXkSR_font-family); - font-size: var(--mixin-N7cG0Ri48QP-tXkSR_font-size); - font-weight: var(--mixin-N7cG0Ri48QP-tXkSR_font-weight); + font-family: var(--mixin-N7cG0Ri48QP_font-family); + font-size: var(--mixin-N7cG0Ri48QP_font-size); + font-weight: var(--mixin-N7cG0Ri48QP_font-weight); } :where(.root_reset) h5:where(.h5), @@ -535,9 +535,9 @@ h5:where(.root_reset.h5), :where(.root_reset .__wab_expr_html_text) h5, :where(.root_reset_tags) h5, h5:where(.root_reset_tags) { - font-family: var(--mixin-__gfw12lSVA-tXkSR_font-family); - font-size: var(--mixin-__gfw12lSVA-tXkSR_font-size); - font-weight: var(--mixin-__gfw12lSVA-tXkSR_font-weight); + font-family: var(--mixin-__gfw12lSVA_font-family); + font-size: var(--mixin-__gfw12lSVA_font-size); + font-weight: var(--mixin-__gfw12lSVA_font-weight); } :where(.root_reset) h6:where(.h6), @@ -545,9 +545,9 @@ h6:where(.root_reset.h6), :where(.root_reset .__wab_expr_html_text) h6, :where(.root_reset_tags) h6, h6:where(.root_reset_tags) { - font-family: var(--mixin-eoQXVRNaCyL-tXkSR_font-family); - font-size: var(--mixin-eoQXVRNaCyL-tXkSR_font-size); - font-weight: var(--mixin-eoQXVRNaCyL-tXkSR_font-weight); + font-family: var(--mixin-eoQXVRNaCyL_font-family); + font-size: var(--mixin-eoQXVRNaCyL_font-size); + font-weight: var(--mixin-eoQXVRNaCyL_font-weight); } :where(.root_reset) blockquote:where(.blockquote), @@ -576,7 +576,7 @@ ol:where(.root_reset.ol), :where(.root_reset .__wab_expr_html_text) ol, :where(.root_reset_tags) ol, ol:where(.root_reset_tags) { - position: var(--mixin-EuhGUWboGh2-tXkSR_position); + position: var(--mixin-EuhGUWboGh2_position); } :where(.root_reset) ul:where(.ul), @@ -584,7 +584,7 @@ ul:where(.root_reset.ul), :where(.root_reset .__wab_expr_html_text) ul, :where(.root_reset_tags) ul, ul:where(.root_reset_tags) { - position: var(--mixin-_MYD1z_SMDp-tXkSR_position); + position: var(--mixin-_MYD1z_SMDp_position); } :where(.root_reset) a:where(.a):not(:hover), diff --git a/platform/wab/src/wab/client/plasmic/PlasmicButton.tsx b/platform/wab/src/wab/client/plasmic/PlasmicButton.tsx index cd6cb9ed24c..d118e7463f7 100644 --- a/platform/wab/src/wab/client/plasmic/PlasmicButton.tsx +++ b/platform/wab/src/wab/client/plasmic/PlasmicButton.tsx @@ -16,28 +16,53 @@ import * as React from "react"; import { Flex as Flex__, MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, Stack as Stack__, StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; +import plasmic_plasmic_kit_color_tokens_css from "./plasmic_kit_q_4_color_tokens/plasmic_plasmic_kit_q_4_color_tokens.module.css"; // plasmic-import: 95xp9cYcv7HrNWpFWWhbcv/projectcss import projectcss from "./PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicButton.module.css"; // plasmic-import: SEF-sRmSoqV5c/css -import plasmic_plasmic_kit_color_tokens_css from "./plasmic_kit_q_4_color_tokens/plasmic_plasmic_kit_q_4_color_tokens.module.css"; // plasmic-import: 95xp9cYcv7HrNWpFWWhbcv/projectcss -import ArrowRightsvgIcon from "./q_4_icons/icons/PlasmicIcon__ArrowRightsvg"; // plasmic-import: 9Jv8jb253/icon -import ChevronDownsvgIcon from "./q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon +import ArrowRightSvgIcon from "./q_4_icons/icons/PlasmicIcon__ArrowRightsvg"; // plasmic-import: 9Jv8jb253/icon +import ChevronDownSvgIcon from "./q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon createPlasmicElementProxy; @@ -169,11 +194,20 @@ function PlasmicButton__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -186,44 +220,44 @@ function PlasmicButton__RenderFunc(props: { path: "type", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.type, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.type }, { path: "withIcons", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.withIcons, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.withIcons }, { path: "font", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.font, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.font }, { path: "size", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.size, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.size }, { path: "disabled", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.disabled, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.disabled }, { path: "pointerCursor", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.pointerCursor, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.pointerCursor }, { path: "color", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.color, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.color + } ], [$props, $ctx, $refs] ); @@ -231,12 +265,12 @@ function PlasmicButton__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const [isRootHover, triggerRootHoverProps] = useTrigger("useHover", {}); const triggers = { - hover_root: isRootHover, + hover_root: isRootHover }; return ( @@ -388,7 +422,7 @@ function PlasmicButton__RenderFunc(props: { $state, "withIcons", "startIcon" - ), + ) } )} disabled={hasVariant($state, "disabled", "disabled") ? true : undefined} @@ -448,12 +482,12 @@ function PlasmicButton__RenderFunc(props: { $state, "withIcons", "startIcon" - ), + ) })} > {renderPlasmicSlot({ defaultContents: ( - @@ -637,8 +671,8 @@ function PlasmicButton__RenderFunc(props: { $state, "withIcons", "startIcon" - ), - }), + ) + }) })} ) : null} @@ -663,7 +697,7 @@ function PlasmicButton__RenderFunc(props: { ), [sty.freeBoxwithIcons_endIconOnHover_withIcons_startIcon]: hasVariant($state, "withIcons", "startIcon") && - hasVariant($state, "withIcons", "endIconOnHover"), + hasVariant($state, "withIcons", "endIconOnHover") })} > {renderPlasmicSlot({ @@ -839,8 +873,8 @@ function PlasmicButton__RenderFunc(props: { $state, "withIcons", "startIcon" - ), - }), + ) + }) })} {(hasVariant($state, "type", "hasCaption") ? true : false) ? renderPlasmicSlot({ @@ -1004,8 +1038,8 @@ function PlasmicButton__RenderFunc(props: { $state, "withIcons", "startIcon" - ), - }), + ) + }) }) : null} @@ -1052,12 +1086,12 @@ function PlasmicButton__RenderFunc(props: { $state, "withIcons", "startIcon" - ), + ) })} > {renderPlasmicSlot({ defaultContents: ( - @@ -1211,8 +1245,8 @@ function PlasmicButton__RenderFunc(props: { $state, "withIcons", "startIcon" - ), - }), + ) + }) })} ) : null} @@ -1224,7 +1258,7 @@ const PlasmicDescendants = { root: ["root", "startIconContainer", "freeBox", "endIconContainer"], startIconContainer: ["startIconContainer"], freeBox: ["freeBox"], - endIconContainer: ["endIconContainer"], + endIconContainer: ["endIconContainer"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -1272,7 +1306,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicButton__ArgProps, - internalVariantPropNames: PlasmicButton__VariantProps, + internalVariantPropNames: PlasmicButton__VariantProps }), [props, nodeName] ); @@ -1280,7 +1314,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -1302,7 +1336,7 @@ export const PlasmicButton = Object.assign( // Metadata about props expected for PlasmicButton internalVariantProps: PlasmicButton__VariantProps, - internalArgProps: PlasmicButton__ArgProps, + internalArgProps: PlasmicButton__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/PlasmicIconButton.tsx b/platform/wab/src/wab/client/plasmic/PlasmicIconButton.tsx index 6dd327f462f..834cf29927d 100644 --- a/platform/wab/src/wab/client/plasmic/PlasmicIconButton.tsx +++ b/platform/wab/src/wab/client/plasmic/PlasmicIconButton.tsx @@ -16,29 +16,54 @@ import * as React from "react"; import { Flex as Flex__, MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, Stack as Stack__, StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; +import plasmic_plasmic_kit_color_tokens_css from "./plasmic_kit_q_4_color_tokens/plasmic_plasmic_kit_q_4_color_tokens.module.css"; // plasmic-import: 95xp9cYcv7HrNWpFWWhbcv/projectcss import projectcss from "./PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicIconButton.module.css"; // plasmic-import: LPry-TF4j22a/css -import plasmic_plasmic_kit_color_tokens_css from "./plasmic_kit_q_4_color_tokens/plasmic_plasmic_kit_q_4_color_tokens.module.css"; // plasmic-import: 95xp9cYcv7HrNWpFWWhbcv/projectcss -import ChevronDownsvgIcon from "./q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon -import PlussvgIcon from "./q_4_icons/icons/PlasmicIcon__Plussvg"; // plasmic-import: sQKgd2GNr/icon -import WarningTrianglesvgIcon from "./q_4_icons/icons/PlasmicIcon__WarningTrianglesvg"; // plasmic-import: S0L-xosWD/icon +import PlusSvgIcon from "./q_4_icons/icons/PlasmicIcon__Plussvg"; // plasmic-import: sQKgd2GNr/icon +import ChevronDownSvgIcon from "./q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon +import WarningTriangleSvgIcon from "./q_4_icons/icons/PlasmicIcon__WarningTrianglesvg"; // plasmic-import: S0L-xosWD/icon createPlasmicElementProxy; @@ -164,11 +189,20 @@ function PlasmicIconButton__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -181,59 +215,59 @@ function PlasmicIconButton__RenderFunc(props: { path: "disabled", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.disabled, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.disabled }, { path: "size", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.size, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.size }, { path: "type", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.type, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.type }, { path: "isActive", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isActive, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isActive }, { path: "showAlert", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.showAlert, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.showAlert }, { path: "withBackgroundHover", type: "private", variableType: "variant", initFunc: ({ $props, $state, $queries, $ctx }) => - $props.withBackgroundHover, + $props.withBackgroundHover }, { path: "withRedBackgroundHover", type: "private", variableType: "variant", initFunc: ({ $props, $state, $queries, $ctx }) => - $props.withRedBackgroundHover, + $props.withRedBackgroundHover }, { path: "withGreenBackgroundHover", type: "private", variableType: "variant", initFunc: ({ $props, $state, $queries, $ctx }) => - $props.withGreenBackgroundHover, + $props.withGreenBackgroundHover }, { path: "withDropdown", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.withDropdown, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.withDropdown + } ], [$props, $ctx, $refs] ); @@ -241,18 +275,18 @@ function PlasmicIconButton__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const [isRootFocus, triggerRootFocusProps] = useTrigger("useFocused", {}); const [isRootFocusVisible, triggerRootFocusVisibleProps] = useTrigger( "useFocusVisible", { - isTextInput: false, + isTextInput: false } ); const triggers = { - focusFocusVisible_root: isRootFocus && isRootFocusVisible, + focusFocusVisible_root: isRootFocus && isRootFocusVisible }; return ( @@ -352,19 +386,19 @@ function PlasmicIconButton__RenderFunc(props: { $state, "withRedBackgroundHover", "withRedBackgroundHover" - ), + ) } )} disabled={hasVariant($state, "disabled", "disabled") ? true : undefined} title={args.hoverText} data-plasmic-trigger-props={[ triggerRootFocusProps, - triggerRootFocusVisibleProps, + triggerRootFocusVisibleProps ]} > {renderPlasmicSlot({ defaultContents: ( - @@ -497,8 +531,8 @@ function PlasmicIconButton__RenderFunc(props: { $state, "withRedBackgroundHover", "withRedBackgroundHover" - ), - }), + ) + }) })} {( hasVariant($state, "withDropdown", "withDropdown") @@ -509,7 +543,7 @@ function PlasmicIconButton__RenderFunc(props: { ) ? renderPlasmicSlot({ defaultContents: ( - @@ -596,18 +630,18 @@ function PlasmicIconButton__RenderFunc(props: { $state, "withRedBackgroundHover", "withRedBackgroundHover" - ), - }), + ) + }) }) : null} {(hasVariant($state, "showAlert", "showAlert") ? true : false) ? ( - @@ -618,7 +652,7 @@ function PlasmicIconButton__RenderFunc(props: { const PlasmicDescendants = { root: ["root", "svg"], - svg: ["svg"], + svg: ["svg"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -664,7 +698,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicIconButton__ArgProps, - internalVariantPropNames: PlasmicIconButton__VariantProps, + internalVariantPropNames: PlasmicIconButton__VariantProps }), [props, nodeName] ); @@ -672,7 +706,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -692,7 +726,7 @@ export const PlasmicIconButton = Object.assign( // Metadata about props expected for PlasmicIconButton internalVariantProps: PlasmicIconButton__VariantProps, - internalArgProps: PlasmicIconButton__ArgProps, + internalArgProps: PlasmicIconButton__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicIcon__Playsvg.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicIcon__Playsvg.tsx index 6fbbbffc86b..e3d1bb90767 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicIcon__Playsvg.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicIcon__Playsvg.tsx @@ -5,11 +5,11 @@ import React from "react"; import { classNames } from "@plasmicapp/react-web"; -export type PlaysvgIconProps = React.ComponentProps<"svg"> & { +export type PlaySvgIconProps = React.ComponentProps<"svg"> & { title?: string; }; -export function PlaysvgIcon(props: PlaysvgIconProps) { +export function PlaySvgIcon(props: PlaySvgIconProps) { const { className, style, title, ...restProps } = props; return ( Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -88,7 +130,7 @@ function PlasmicPanelDivider__RenderFunc(props: { } const PlasmicDescendants = { - panelDivider: ["panelDivider"], + panelDivider: ["panelDivider"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -133,7 +175,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicPanelDivider__ArgProps, - internalVariantPropNames: PlasmicPanelDivider__VariantProps, + internalVariantPropNames: PlasmicPanelDivider__VariantProps }), [props, nodeName] ); @@ -141,7 +183,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "panelDivider") { @@ -160,7 +202,7 @@ export const PlasmicPanelDivider = Object.assign( // Metadata about props expected for PlasmicPanelDivider internalVariantProps: PlasmicPanelDivider__VariantProps, - internalArgProps: PlasmicPanelDivider__ArgProps, + internalArgProps: PlasmicPanelDivider__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicSearchbox.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicSearchbox.tsx index e11a5cf7e6d..f0183c3ffeb 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicSearchbox.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicSearchbox.tsx @@ -14,26 +14,57 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, - SingleBooleanChoiceArg, - StrictProps, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import Textbox from "../../components/widgets/Textbox"; // plasmic-import: pA22NEzDCsn_/component import "@plasmicapp/react-web/lib/plasmic.css"; +import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_tokens/plasmic_plasmic_kit_q_4_color_tokens.module.css"; // plasmic-import: 95xp9cYcv7HrNWpFWWhbcv/projectcss import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicSearchbox.module.css"; // plasmic-import: po7gr0PX4_gWo/css -import ClosesvgIcon from "../q_4_icons/icons/PlasmicIcon__Closesvg"; // plasmic-import: DhvEHyCHT/icon -import SearchsvgIcon from "../q_4_icons/icons/PlasmicIcon__Searchsvg"; // plasmic-import: R5DLz11OA/icon +import SearchSvgIcon from "../q_4_icons/icons/PlasmicIcon__Searchsvg"; // plasmic-import: R5DLz11OA/icon +import CloseSvgIcon from "../q_4_icons/icons/PlasmicIcon__Closesvg"; // plasmic-import: DhvEHyCHT/icon createPlasmicElementProxy; @@ -97,16 +128,18 @@ function PlasmicSearchbox__RenderFunc(props: { () => Object.assign( { - placeholder: "Search...", + placeholder: "Search..." }, - props.args + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) ), [props.args] ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -119,39 +152,38 @@ function PlasmicSearchbox__RenderFunc(props: { path: "hasValue", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.hasValue, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.hasValue }, { path: "bordered", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.bordered, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.bordered }, { path: "noOutline", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.noOutline, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.noOutline }, { path: "whiteBackground", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => - $props.whiteBackground, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.whiteBackground }, { path: "extraPadding", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.extraPadding, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.extraPadding }, { path: "medium", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.medium, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.medium + } ], [$props, $ctx, $refs] ); @@ -159,7 +191,7 @@ function PlasmicSearchbox__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -182,7 +214,7 @@ function PlasmicSearchbox__RenderFunc(props: { $state, "whiteBackground", "whiteBackground" - ), + ) })} extraPadding={ hasVariant($state, "extraPadding", "extraPadding") ? true : undefined @@ -192,14 +224,14 @@ function PlasmicSearchbox__RenderFunc(props: { } placeholder={args.placeholder} prefixIcon={ - @@ -213,13 +245,13 @@ function PlasmicSearchbox__RenderFunc(props: { } suffixIcon={ (hasVariant($state, "hasValue", "hasValue") ? true : false) ? ( - @@ -240,7 +272,7 @@ function PlasmicSearchbox__RenderFunc(props: { } const PlasmicDescendants = { - root: ["root"], + root: ["root"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -285,7 +317,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicSearchbox__ArgProps, - internalVariantPropNames: PlasmicSearchbox__VariantProps, + internalVariantPropNames: PlasmicSearchbox__VariantProps }), [props, nodeName] ); @@ -293,7 +325,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -312,7 +344,7 @@ export const PlasmicSearchbox = Object.assign( // Metadata about props expected for PlasmicSearchbox internalVariantProps: PlasmicSearchbox__VariantProps, - internalArgProps: PlasmicSearchbox__ArgProps, + internalArgProps: PlasmicSearchbox__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicTextbox.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicTextbox.tsx index 1179fa1678f..3c1686008a9 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicTextbox.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit/PlasmicTextbox.tsx @@ -14,19 +14,46 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, MultiChoiceArg, - renderPlasmicSlot, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, + Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; @@ -34,8 +61,8 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicTextbox.module.css"; // plasmic-import: pA22NEzDCsn_/css -import ClosesvgIcon from "../q_4_icons/icons/PlasmicIcon__Closesvg"; // plasmic-import: DhvEHyCHT/icon -import SearchsvgIcon from "../q_4_icons/icons/PlasmicIcon__Searchsvg"; // plasmic-import: R5DLz11OA/icon +import SearchSvgIcon from "../q_4_icons/icons/PlasmicIcon__Searchsvg"; // plasmic-import: R5DLz11OA/icon +import CloseSvgIcon from "../q_4_icons/icons/PlasmicIcon__Closesvg"; // plasmic-import: DhvEHyCHT/icon createPlasmicElementProxy; @@ -176,16 +203,18 @@ function PlasmicTextbox__RenderFunc(props: { () => Object.assign( { - placeholder: "", + placeholder: "" }, - props.args + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) ), [props.args] ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -198,57 +227,56 @@ function PlasmicTextbox__RenderFunc(props: { path: "disabled", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.disabled, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.disabled }, { path: "styleType", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.styleType, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.styleType }, { path: "withIcons", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.withIcons, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.withIcons }, { path: "error", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.error, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.error }, { path: "fontSize", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.fontSize, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.fontSize }, { path: "fontStyle", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.fontStyle, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.fontStyle }, { path: "noOutline", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.noOutline, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.noOutline }, { path: "whiteBackground", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => - $props.whiteBackground, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.whiteBackground }, { path: "extraPadding", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.extraPadding, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.extraPadding + } ], [$props, $ctx, $refs] ); @@ -256,7 +284,7 @@ function PlasmicTextbox__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -345,7 +373,7 @@ function PlasmicTextbox__RenderFunc(props: { ), [sty.rootwithIcons_withSuffix_styleType_medium]: hasVariant($state, "withIcons", "withSuffix") && - hasVariant($state, "styleType", "medium"), + hasVariant($state, "styleType", "medium") } )} > @@ -402,12 +430,12 @@ function PlasmicTextbox__RenderFunc(props: { ), [sty.prefixContainerwithIcons_withSuffix_withIcons_withPrefix]: hasVariant($state, "withIcons", "withPrefix") && - hasVariant($state, "withIcons", "withSuffix"), + hasVariant($state, "withIcons", "withSuffix") })} > {renderPlasmicSlot({ defaultContents: ( - @@ -452,8 +480,8 @@ function PlasmicTextbox__RenderFunc(props: { $state, "withIcons", "withPrefix" - ), - }), + ) + }) })} ) : null} @@ -562,10 +590,10 @@ function PlasmicTextbox__RenderFunc(props: { ), [sty.textboxwithIcons_withSuffix_styleType_medium]: hasVariant($state, "withIcons", "withSuffix") && - hasVariant($state, "styleType", "medium"), + hasVariant($state, "styleType", "medium") })} placeholder={args.placeholder} - ref={(ref) => { + ref={ref => { $refs["textbox"] = ref; }} size={1} @@ -646,12 +674,12 @@ function PlasmicTextbox__RenderFunc(props: { $state, "withIcons", "withSuffix" - ), + ) })} > {renderPlasmicSlot({ defaultContents: ( - @@ -694,8 +722,8 @@ function PlasmicTextbox__RenderFunc(props: { hasVariant($state, "styleType", "medium"), [sty.slotTargetSuffixIconwithIcons_withSuffix_withIcons_withPrefix]: hasVariant($state, "withIcons", "withSuffix") && - hasVariant($state, "withIcons", "withPrefix"), - }), + hasVariant($state, "withIcons", "withPrefix") + }) })} ) : null} @@ -707,7 +735,7 @@ const PlasmicDescendants = { root: ["root", "prefixContainer", "textbox", "suffixContainer"], prefixContainer: ["prefixContainer"], textbox: ["textbox"], - suffixContainer: ["suffixContainer"], + suffixContainer: ["suffixContainer"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -755,7 +783,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicTextbox__ArgProps, - internalVariantPropNames: PlasmicTextbox__VariantProps, + internalVariantPropNames: PlasmicTextbox__VariantProps }), [props, nodeName] ); @@ -763,7 +791,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -785,7 +813,7 @@ export const PlasmicTextbox = Object.assign( // Metadata about props expected for PlasmicTextbox internalVariantProps: PlasmicTextbox__VariantProps, - internalArgProps: PlasmicTextbox__ArgProps, + internalArgProps: PlasmicTextbox__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicActionMenuButton.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicActionMenuButton.tsx index e5a7ebfabff..471b6e2a134 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicActionMenuButton.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicActionMenuButton.tsx @@ -14,22 +14,46 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, PlasmicIcon as PlasmicIcon__, - renderPlasmicSlot, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import IconButton from "../../components/widgets/IconButton"; // plasmic-import: LPry-TF4j22a/component @@ -39,9 +63,9 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicActionMenuButton.module.css"; // plasmic-import: VNi6NC2QOI/css -import ChevronDownsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon -import ChevronUpsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronUpsvg"; // plasmic-import: i9D87DzsX/icon -import PlussvgIcon from "../q_4_icons/icons/PlasmicIcon__Plussvg"; // plasmic-import: sQKgd2GNr/icon +import PlusSvgIcon from "../q_4_icons/icons/PlasmicIcon__Plussvg"; // plasmic-import: sQKgd2GNr/icon +import ChevronDownSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon +import ChevronUpSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronUpsvg"; // plasmic-import: i9D87DzsX/icon createPlasmicElementProxy; @@ -102,11 +126,20 @@ function PlasmicActionMenuButton__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -119,26 +152,26 @@ function PlasmicActionMenuButton__RenderFunc(props: { path: "type", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.type, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.type }, { path: "isOpen", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isOpen, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isOpen }, { path: "hasIcon", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.hasIcon, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.hasIcon }, { path: "size", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.size, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.size + } ], [$props, $ctx, $refs] ); @@ -146,15 +179,15 @@ function PlasmicActionMenuButton__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const [isActionButtonFocusVisible, triggerActionButtonFocusVisibleProps] = useTrigger("useFocusVisible", { - isTextInput: false, + isTextInput: false }); const triggers = { - focusVisible_actionButton: isActionButtonFocusVisible, + focusVisible_actionButton: isActionButtonFocusVisible }; return ( @@ -182,7 +215,7 @@ function PlasmicActionMenuButton__RenderFunc(props: { hasVariant($state, "hasIcon", "hasIcon"), [sty.roottype_primary_isOpen]: hasVariant($state, "type", "primary") && - hasVariant($state, "isOpen", "isOpen"), + hasVariant($state, "isOpen", "isOpen") } )} > @@ -220,10 +253,10 @@ function PlasmicActionMenuButton__RenderFunc(props: { hasVariant($state, "hasIcon", "hasIcon"), [sty.actionButtontype_primary_isOpen]: hasVariant($state, "type", "primary") && - hasVariant($state, "isOpen", "isOpen"), + hasVariant($state, "isOpen", "isOpen") } )} - ref={(ref) => { + ref={ref => { $refs["actionButton"] = ref; }} data-plasmic-trigger-props={[triggerActionButtonFocusVisibleProps]} @@ -234,13 +267,13 @@ function PlasmicActionMenuButton__RenderFunc(props: { data-plasmic-override={overrides.freeBox} hasGap={true} className={classNames(projectcss.all, sty.freeBox, { - [sty.freeBoxhasIcon]: hasVariant($state, "hasIcon", "hasIcon"), + [sty.freeBoxhasIcon]: hasVariant($state, "hasIcon", "hasIcon") })} > {(hasVariant($state, "hasIcon", "hasIcon") ? true : false) ? renderPlasmicSlot({ defaultContents: ( - @@ -260,8 +293,8 @@ function PlasmicActionMenuButton__RenderFunc(props: { ), [sty.slotTargetIcontype_primary_hasIcon]: hasVariant($state, "type", "primary") && - hasVariant($state, "hasIcon", "hasIcon"), - }), + hasVariant($state, "hasIcon", "hasIcon") + }) }) : null} {renderPlasmicSlot({ @@ -298,10 +331,10 @@ function PlasmicActionMenuButton__RenderFunc(props: { $state, "type", "secondary" - ), - }), + ) + }) })} - @@ -311,7 +344,7 @@ function PlasmicActionMenuButton__RenderFunc(props: { data-plasmic-name={"menuTrigger"} data-plasmic-override={overrides.menuTrigger} children2={ - @@ -332,7 +365,7 @@ function PlasmicActionMenuButton__RenderFunc(props: { hasVariant($state, "hasIcon", "hasIcon"), [sty.menuTriggertype_primary_isOpen]: hasVariant($state, "type", "primary") && - hasVariant($state, "isOpen", "isOpen"), + hasVariant($state, "isOpen", "isOpen") })} isActive={hasVariant($state, "isOpen", "isOpen") ? true : undefined} size={hasVariant($state, "size", "small") ? "small" : undefined} @@ -352,8 +385,8 @@ function PlasmicActionMenuButton__RenderFunc(props: { @@ -395,7 +428,7 @@ const PlasmicDescendants = { root: ["root", "actionButton", "freeBox", "menuTrigger"], actionButton: ["actionButton", "freeBox"], freeBox: ["freeBox"], - menuTrigger: ["menuTrigger"], + menuTrigger: ["menuTrigger"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -443,7 +476,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicActionMenuButton__ArgProps, - internalVariantPropNames: PlasmicActionMenuButton__VariantProps, + internalVariantPropNames: PlasmicActionMenuButton__VariantProps }), [props, nodeName] ); @@ -451,7 +484,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -473,7 +506,7 @@ export const PlasmicActionMenuButton = Object.assign( // Metadata about props expected for PlasmicActionMenuButton internalVariantProps: PlasmicActionMenuButton__VariantProps, - internalArgProps: PlasmicActionMenuButton__ArgProps, + internalArgProps: PlasmicActionMenuButton__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicCheckbox.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicCheckbox.tsx index a954f57d1ee..d920fa4bfa3 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicCheckbox.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicCheckbox.tsx @@ -14,21 +14,46 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, PlasmicIcon as PlasmicIcon__, - renderPlasmicSlot, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import * as pp from "@plasmicapp/react-web"; @@ -38,9 +63,9 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicCheckbox.module.css"; // plasmic-import: W-rO7NZqPjZ/css +import SquareSvgIcon from "../q_4_icons/icons/PlasmicIcon__Squaresvg"; // plasmic-import: zkj00JjZV/icon import CheckTrueIcon from "../plasmic_kit/PlasmicIcon__CheckTrue"; // plasmic-import: ckLkdbD6DMjvM/icon -import SquareMinussvgIcon from "../q_4_icons/icons/PlasmicIcon__SquareMinussvg"; // plasmic-import: 6a2Ojnos7/icon -import SquaresvgIcon from "../q_4_icons/icons/PlasmicIcon__Squaresvg"; // plasmic-import: zkj00JjZV/icon +import SquareMinusSvgIcon from "../q_4_icons/icons/PlasmicIcon__SquareMinussvg"; // plasmic-import: 6a2Ojnos7/icon createPlasmicElementProxy; @@ -112,11 +137,20 @@ function PlasmicCheckbox__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -129,13 +163,13 @@ function PlasmicCheckbox__RenderFunc(props: { path: "noLabel", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.noLabel, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.noLabel }, { path: "isDisabled", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDisabled, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDisabled }, { path: "isChecked", @@ -143,27 +177,26 @@ function PlasmicCheckbox__RenderFunc(props: { variableType: "boolean", valueProp: "isChecked", - onChangeProp: "onChange", + onChangeProp: "onChange" }, { path: "isIndeterminate", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => - $props.isIndeterminate, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isIndeterminate }, { path: "medium", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.medium, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.medium }, { path: "color", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.color, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.color + } ], [$props, $ctx, $refs] ); @@ -171,7 +204,7 @@ function PlasmicCheckbox__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const [isRootFocusWithin, triggerRootFocusWithinProps] = useTrigger( @@ -180,11 +213,11 @@ function PlasmicCheckbox__RenderFunc(props: { ); const [isRootNotFocusVisibleWithin, triggerRootNotFocusVisibleWithinProps] = useTrigger("useFocusVisibleWithin", { - isTextInput: false, + isTextInput: false }); const triggers = { focusWithinNotFocusVisibleWithin_root: - isRootFocusWithin && !isRootNotFocusVisibleWithin, + isRootFocusWithin && !isRootNotFocusVisibleWithin }; return ( @@ -297,12 +330,12 @@ function PlasmicCheckbox__RenderFunc(props: { hasVariant($state, "color", "red") && hasVariant($state, "medium", "medium") && hasVariant($state, "noLabel", "noLabel"), - [sty.rootnoLabel]: hasVariant($state, "noLabel", "noLabel"), + [sty.rootnoLabel]: hasVariant($state, "noLabel", "noLabel") } )} data-plasmic-trigger-props={[ triggerRootFocusWithinProps, - triggerRootNotFocusVisibleWithinProps, + triggerRootNotFocusVisibleWithinProps ]} > @@ -379,7 +412,7 @@ function PlasmicCheckbox__RenderFunc(props: { $state, "noLabel", "noLabel" - ), + ) })} > {renderPlasmicSlot({ @@ -417,8 +450,8 @@ function PlasmicCheckbox__RenderFunc(props: { $state, "noLabel", "noLabel" - ), - }), + ) + }) })} ) : null} @@ -433,7 +466,7 @@ function useBehavior

( if (!("children" in props)) { props = { ...props, - children: "Enter some text", + children: "Enter some text" }; } @@ -444,12 +477,12 @@ function useBehavior

( isCheckedVariant: { group: "isChecked", variant: "isChecked" }, isIndeterminateVariant: { group: "isIndeterminate", - variant: "isIndeterminate", + variant: "isIndeterminate" }, isDisabledVariant: { group: "isDisabled", variant: "isDisabled" }, noLabelVariant: { group: "noLabel", variant: "noLabel" }, labelSlot: "children", - root: "root", + root: "root" }, ref ); @@ -458,7 +491,7 @@ function useBehavior

( const PlasmicDescendants = { root: ["root", "svg", "labelContainer"], svg: ["svg"], - labelContainer: ["labelContainer"], + labelContainer: ["labelContainer"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -505,7 +538,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicCheckbox__ArgProps, - internalVariantPropNames: PlasmicCheckbox__VariantProps, + internalVariantPropNames: PlasmicCheckbox__VariantProps }), [props, nodeName] ); @@ -513,7 +546,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -536,7 +569,7 @@ export const PlasmicCheckbox = Object.assign( internalVariantProps: PlasmicCheckbox__VariantProps, internalArgProps: PlasmicCheckbox__ArgProps, - useBehavior, + useBehavior } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicChip.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicChip.tsx index b328c7fb847..518e5d13cce 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicChip.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicChip.tsx @@ -14,19 +14,46 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, - renderPlasmicSlot, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; @@ -34,7 +61,7 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicChip.module.css"; // plasmic-import: jW885tExwE/css -import ClosesvgIcon from "../q_4_icons/icons/PlasmicIcon__Closesvg"; // plasmic-import: DhvEHyCHT/icon +import CloseSvgIcon from "../q_4_icons/icons/PlasmicIcon__Closesvg"; // plasmic-import: DhvEHyCHT/icon createPlasmicElementProxy; @@ -80,11 +107,20 @@ function PlasmicChip__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -97,14 +133,14 @@ function PlasmicChip__RenderFunc(props: { path: "deletable", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.deletable, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.deletable }, { path: "size", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.size, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.size + } ], [$props, $ctx, $refs] ); @@ -112,7 +148,7 @@ function PlasmicChip__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -138,7 +174,7 @@ function PlasmicChip__RenderFunc(props: { $state, "size", "normalControl" - ), + ) } )} > @@ -165,11 +201,11 @@ function PlasmicChip__RenderFunc(props: { $state, "size", "normalControl" - ), - }), + ) + }) })} {(hasVariant($state, "deletable", "deletable") ? true : false) ? ( - @@ -188,7 +224,7 @@ function PlasmicChip__RenderFunc(props: { const PlasmicDescendants = { root: ["root", "closeIcon"], - closeIcon: ["closeIcon"], + closeIcon: ["closeIcon"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -234,7 +270,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicChip__ArgProps, - internalVariantPropNames: PlasmicChip__VariantProps, + internalVariantPropNames: PlasmicChip__VariantProps }), [props, nodeName] ); @@ -242,7 +278,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -262,7 +298,7 @@ export const PlasmicChip = Object.assign( // Metadata about props expected for PlasmicChip internalVariantProps: PlasmicChip__VariantProps, - internalArgProps: PlasmicChip__ArgProps, + internalArgProps: PlasmicChip__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicDropdownOverlay.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicDropdownOverlay.tsx index 6f8b2301877..abe044fa71f 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicDropdownOverlay.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicDropdownOverlay.tsx @@ -14,14 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, - StrictProps, + set as $stateSet, + useCurrentUser, + useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; @@ -64,11 +96,20 @@ function PlasmicDropdownOverlay__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -93,14 +134,14 @@ function PlasmicDropdownOverlay__RenderFunc(props: { > {renderPlasmicSlot({ defaultContents: null, - value: args.children, + value: args.children })} ) as React.ReactElement | null; } const PlasmicDescendants = { - root: ["root"], + root: ["root"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -145,7 +186,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicDropdownOverlay__ArgProps, - internalVariantPropNames: PlasmicDropdownOverlay__VariantProps, + internalVariantPropNames: PlasmicDropdownOverlay__VariantProps }), [props, nodeName] ); @@ -153,7 +194,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -172,7 +213,7 @@ export const PlasmicDropdownOverlay = Object.assign( // Metadata about props expected for PlasmicDropdownOverlay internalVariantProps: PlasmicDropdownOverlay__VariantProps, - internalArgProps: PlasmicDropdownOverlay__ArgProps, + internalArgProps: PlasmicDropdownOverlay__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicExpandButton.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicExpandButton.tsx index e66444e652d..6f0daf10459 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicExpandButton.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicExpandButton.tsx @@ -14,29 +14,58 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, + Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import IconButton from "../../components/widgets/IconButton"; // plasmic-import: LPry-TF4j22a/component import "@plasmicapp/react-web/lib/plasmic.css"; +import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_tokens/plasmic_plasmic_kit_q_4_color_tokens.module.css"; // plasmic-import: 95xp9cYcv7HrNWpFWWhbcv/projectcss import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicExpandButton.module.css"; // plasmic-import: JJhv0MV9DH/css -import ChevronDownsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon -import ChevronLeftsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronLeftsvg"; // plasmic-import: 0-_N6JM-u/icon -import ChevronRightsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronRightsvg"; // plasmic-import: HBGx-zeiX/icon +import ChevronLeftSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronLeftsvg"; // plasmic-import: 0-_N6JM-u/icon +import ChevronDownSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon +import ChevronRightSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronRightsvg"; // plasmic-import: HBGx-zeiX/icon createPlasmicElementProxy; @@ -82,11 +111,20 @@ function PlasmicExpandButton__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -99,20 +137,20 @@ function PlasmicExpandButton__RenderFunc(props: { path: "right", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.right, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.right }, { path: "isExpanded", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isExpanded, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isExpanded }, { path: "size", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.size, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.size + } ], [$props, $ctx, $refs] ); @@ -120,7 +158,7 @@ function PlasmicExpandButton__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -130,14 +168,14 @@ function PlasmicExpandButton__RenderFunc(props: { data-plasmic-root={true} data-plasmic-for-node={forNode} children2={ - } className={classNames("__wab_instance", sty.root, { [sty.rootisExpanded]: hasVariant($state, "isExpanded", "isExpanded"), - [sty.rootsize_small]: hasVariant($state, "size", "small"), + [sty.rootsize_small]: hasVariant($state, "size", "small") })} isActive={ hasVariant($state, "isExpanded", "isExpanded") ? true : undefined @@ -148,10 +186,10 @@ function PlasmicExpandButton__RenderFunc(props: { @@ -172,7 +210,7 @@ function PlasmicExpandButton__RenderFunc(props: { } const PlasmicDescendants = { - root: ["root"], + root: ["root"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -217,7 +255,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicExpandButton__ArgProps, - internalVariantPropNames: PlasmicExpandButton__VariantProps, + internalVariantPropNames: PlasmicExpandButton__VariantProps }), [props, nodeName] ); @@ -225,7 +263,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -244,7 +282,7 @@ export const PlasmicExpandButton = Object.assign( // Metadata about props expected for PlasmicExpandButton internalVariantProps: PlasmicExpandButton__VariantProps, - internalArgProps: PlasmicExpandButton__ArgProps, + internalArgProps: PlasmicExpandButton__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicFreeTrial.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicFreeTrial.tsx index f8b7c31c11e..164bc70cfd4 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicFreeTrial.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicFreeTrial.tsx @@ -14,19 +14,46 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, PlasmicLink as PlasmicLink__, - renderPlasmicSlot, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, + SingleChoiceArg, Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; @@ -34,7 +61,7 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicFreeTrial.module.css"; // plasmic-import: p3GgKAlaQe/css -import BookmarksvgIcon from "../q_4_icons/icons/PlasmicIcon__Bookmarksvg"; // plasmic-import: ifTRn8aE8/icon +import BookmarkSvgIcon from "../q_4_icons/icons/PlasmicIcon__Bookmarksvg"; // plasmic-import: ifTRn8aE8/icon createPlasmicElementProxy; @@ -87,11 +114,20 @@ function PlasmicFreeTrial__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -104,20 +140,20 @@ function PlasmicFreeTrial__RenderFunc(props: { path: "topBar", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.topBar, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.topBar }, { path: "accountSection", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.accountSection, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.accountSection }, { path: "trialEnded", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.trialEnded, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.trialEnded + } ], [$props, $ctx, $refs] ); @@ -125,7 +161,7 @@ function PlasmicFreeTrial__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -150,7 +186,7 @@ function PlasmicFreeTrial__RenderFunc(props: { "accountSection" ), [sty.roottopBar]: hasVariant($state, "topBar", "topBar"), - [sty.roottrialEnded]: hasVariant($state, "trialEnded", "trialEnded"), + [sty.roottrialEnded]: hasVariant($state, "trialEnded", "trialEnded") } )} platform={"react"} @@ -173,10 +209,10 @@ function PlasmicFreeTrial__RenderFunc(props: { $state, "trialEnded", "trialEnded" - ), + ) })} > - @@ -209,7 +245,7 @@ function PlasmicFreeTrial__RenderFunc(props: { $state, "trialEnded", "trialEnded" - ), + ) })} >

@@ -256,8 +292,8 @@ function PlasmicFreeTrial__RenderFunc(props: { $state, "trialEnded", "trialEnded" - ), - }), + ) + }) })} @@ -268,7 +304,7 @@ function PlasmicFreeTrial__RenderFunc(props: { const PlasmicDescendants = { root: ["root", "svg", "text"], svg: ["svg"], - text: ["text"], + text: ["text"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -315,7 +351,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicFreeTrial__ArgProps, - internalVariantPropNames: PlasmicFreeTrial__VariantProps, + internalVariantPropNames: PlasmicFreeTrial__VariantProps }), [props, nodeName] ); @@ -323,7 +359,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -344,7 +380,7 @@ export const PlasmicFreeTrial = Object.assign( // Metadata about props expected for PlasmicFreeTrial internalVariantProps: PlasmicFreeTrial__VariantProps, - internalArgProps: PlasmicFreeTrial__ArgProps, + internalArgProps: PlasmicFreeTrial__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicIndicator.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicIndicator.tsx index d3ee4c716f4..5fae4e02798 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicIndicator.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicIndicator.tsx @@ -14,16 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, - SingleChoiceArg, - StrictProps, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; @@ -68,11 +98,20 @@ function PlasmicIndicator__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -85,8 +124,8 @@ function PlasmicIndicator__RenderFunc(props: { path: "color", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.color, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.color + } ], [$props, $ctx, $refs] ); @@ -94,7 +133,7 @@ function PlasmicIndicator__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -113,7 +152,7 @@ function PlasmicIndicator__RenderFunc(props: { sty.root, { [sty.rootcolor_purple]: hasVariant($state, "color", "purple"), - [sty.rootcolor_red]: hasVariant($state, "color", "red"), + [sty.rootcolor_red]: hasVariant($state, "color", "red") } )} > @@ -124,7 +163,7 @@ function PlasmicIndicator__RenderFunc(props: { [sty.dotcolor_gray]: hasVariant($state, "color", "gray"), [sty.dotcolor_green]: hasVariant($state, "color", "green"), [sty.dotcolor_purple]: hasVariant($state, "color", "purple"), - [sty.dotcolor_red]: hasVariant($state, "color", "red"), + [sty.dotcolor_red]: hasVariant($state, "color", "red") })} />
@@ -133,7 +172,7 @@ function PlasmicIndicator__RenderFunc(props: { const PlasmicDescendants = { root: ["root", "dot"], - dot: ["dot"], + dot: ["dot"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -179,7 +218,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicIndicator__ArgProps, - internalVariantPropNames: PlasmicIndicator__VariantProps, + internalVariantPropNames: PlasmicIndicator__VariantProps }), [props, nodeName] ); @@ -187,7 +226,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -207,7 +246,7 @@ export const PlasmicIndicator = Object.assign( // Metadata about props expected for PlasmicIndicator internalVariantProps: PlasmicIndicator__VariantProps, - internalArgProps: PlasmicIndicator__ArgProps, + internalArgProps: PlasmicIndicator__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicInlineEditable.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicInlineEditable.tsx index 51f67bb15f2..9f20f7e82ae 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicInlineEditable.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicInlineEditable.tsx @@ -14,19 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, - SingleBooleanChoiceArg, - Stack as Stack__, - StrictProps, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import Textbox from "../../components/widgets/Textbox"; // plasmic-import: pA22NEzDCsn_/component @@ -36,9 +63,9 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicInlineEditable.module.css"; // plasmic-import: btpz7A3thO/css -import ClosesvgIcon from "../q_4_icons/icons/PlasmicIcon__Closesvg"; // plasmic-import: DhvEHyCHT/icon -import EditsvgIcon from "../q_4_icons/icons/PlasmicIcon__Editsvg"; // plasmic-import: _Qa2gdunG/icon -import SearchsvgIcon from "../q_4_icons/icons/PlasmicIcon__Searchsvg"; // plasmic-import: R5DLz11OA/icon +import SearchSvgIcon from "../q_4_icons/icons/PlasmicIcon__Searchsvg"; // plasmic-import: R5DLz11OA/icon +import CloseSvgIcon from "../q_4_icons/icons/PlasmicIcon__Closesvg"; // plasmic-import: DhvEHyCHT/icon +import EditSvgIcon from "../q_4_icons/icons/PlasmicIcon__Editsvg"; // plasmic-import: _Qa2gdunG/icon createPlasmicElementProxy; @@ -99,11 +126,20 @@ function PlasmicInlineEditable__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -116,20 +152,20 @@ function PlasmicInlineEditable__RenderFunc(props: { path: "editing", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.editing, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.editing }, { path: "disabled", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.disabled, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.disabled }, { path: "medium", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.medium, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.medium + } ], [$props, $ctx, $refs] ); @@ -137,12 +173,12 @@ function PlasmicInlineEditable__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const [isRootHover, triggerRootHoverProps] = useTrigger("useHover", {}); const triggers = { - hover_root: isRootHover, + hover_root: isRootHover }; return ( @@ -164,7 +200,7 @@ function PlasmicInlineEditable__RenderFunc(props: { { [sty.rootdisabled]: hasVariant($state, "disabled", "disabled"), [sty.rootediting]: hasVariant($state, "editing", "editing"), - [sty.rootmedium]: hasVariant($state, "medium", "medium"), + [sty.rootmedium]: hasVariant($state, "medium", "medium") } )} data-plasmic-trigger-props={[triggerRootHoverProps]} @@ -188,8 +224,8 @@ function PlasmicInlineEditable__RenderFunc(props: { $state, "medium", "medium" - ), - }), + ) + }) }) : null} {(hasVariant($state, "editing", "editing") ? true : false) ? ( @@ -198,18 +234,18 @@ function PlasmicInlineEditable__RenderFunc(props: { data-plasmic-override={overrides.textbox} className={classNames("__wab_instance", sty.textbox, { [sty.textboxdisabled]: hasVariant($state, "disabled", "disabled"), - [sty.textboxediting]: hasVariant($state, "editing", "editing"), + [sty.textboxediting]: hasVariant($state, "editing", "editing") })} placeholder={args.placeholder} prefixIcon={ - } styleType={["seamless"]} suffixIcon={ - @@ -220,7 +256,7 @@ function PlasmicInlineEditable__RenderFunc(props: { {(triggers.hover_root ? true : false) ? renderPlasmicSlot({ defaultContents: ( - @@ -238,12 +274,8 @@ function PlasmicInlineEditable__RenderFunc(props: { "editing", "editing" ), - [sty.slotTargetIconmedium]: hasVariant( - $state, - "medium", - "medium" - ), - }), + [sty.slotTargetIconmedium]: hasVariant($state, "medium", "medium") + }) }) : null} @@ -252,7 +284,7 @@ function PlasmicInlineEditable__RenderFunc(props: { const PlasmicDescendants = { root: ["root", "textbox"], - textbox: ["textbox"], + textbox: ["textbox"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -298,7 +330,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicInlineEditable__ArgProps, - internalVariantPropNames: PlasmicInlineEditable__VariantProps, + internalVariantPropNames: PlasmicInlineEditable__VariantProps }), [props, nodeName] ); @@ -306,7 +338,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -326,7 +358,7 @@ export const PlasmicInlineEditable = Object.assign( // Metadata about props expected for PlasmicInlineEditable internalVariantProps: PlasmicInlineEditable__VariantProps, - internalArgProps: PlasmicInlineEditable__ArgProps, + internalArgProps: PlasmicInlineEditable__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListItem.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListItem.tsx index 37e804b24e0..fccbde2a945 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListItem.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListItem.tsx @@ -14,20 +14,46 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, - renderPlasmicSlot, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import IconButton from "../../components/widgets/IconButton"; // plasmic-import: LPry-TF4j22a/component import MenuButton from "../../components/widgets/MenuButton"; // plasmic-import: h69wHrrKtL/component @@ -38,10 +64,10 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicListItem.module.css"; // plasmic-import: v31d9_ANqk/css +import GripSvgIcon from "../plasmic_kit_q_4_icons/icons/PlasmicIcon__Gripsvg"; // plasmic-import: jxIRSIMqs/icon import ComponentIcon from "../plasmic_kit/PlasmicIcon__Component"; // plasmic-import: nNWEF4jI3s5DI/icon import EyeIcon from "../plasmic_kit/PlasmicIcon__Eye"; // plasmic-import: A2FnGYgDh4e3U/icon -import GripsvgIcon from "../plasmic_kit_q_4_icons/icons/PlasmicIcon__Gripsvg"; // plasmic-import: jxIRSIMqs/icon -import ChevronDownsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon +import ChevronDownSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon createPlasmicElementProxy; @@ -158,11 +184,20 @@ function PlasmicListItem__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -175,97 +210,96 @@ function PlasmicListItem__RenderFunc(props: { path: "isSelected", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isSelected, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isSelected }, { path: "isFocused", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isFocused, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isFocused }, { path: "showActions", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.showActions, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.showActions }, { path: "isDragging", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDragging, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDragging }, { path: "isDraggable", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDraggable, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDraggable }, { path: "showAddendums", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.showAddendums, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.showAddendums }, { path: "hideIcon", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.hideIcon, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.hideIcon }, { path: "hasMenu", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.hasMenu, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.hasMenu }, { path: "showAdditionalRow", type: "private", variableType: "variant", initFunc: ({ $props, $state, $queries, $ctx }) => - $props.showAdditionalRow, + $props.showAdditionalRow }, { path: "color", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.color, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.color }, { path: "alwaysShowDragHandle", type: "private", variableType: "variant", initFunc: ({ $props, $state, $queries, $ctx }) => - $props.alwaysShowDragHandle, + $props.alwaysShowDragHandle }, { path: "hasRightContents", type: "private", variableType: "variant", initFunc: ({ $props, $state, $queries, $ctx }) => - $props.hasRightContents, + $props.hasRightContents }, { path: "isHighlighted", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isHighlighted, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isHighlighted + } ], - [$props, $ctx, $refs] ); const $state = useDollarState(stateSpecs, { $props, $ctx, $queries: {}, - $refs, + $refs }); const [isRootHover, triggerRootHoverProps] = useTrigger("useHover", {}); const triggers = { - hover_root: isRootHover, + hover_root: isRootHover }; return ( @@ -357,7 +391,7 @@ function PlasmicListItem__RenderFunc(props: { [sty.rootshowAdditionalRow_color_variant_hasMenu]: hasVariant($state, "color", "variant") && hasVariant($state, "showAdditionalRow", "showAdditionalRow") && - hasVariant($state, "hasMenu", "hasMenu"), + hasVariant($state, "hasMenu", "hasMenu") } )} data-plasmic-trigger-props={[triggerRootHoverProps]} @@ -417,7 +451,7 @@ function PlasmicListItem__RenderFunc(props: { $state, "showAdditionalRow", "showAdditionalRow" - ), + ) })} > {( @@ -450,10 +484,10 @@ function PlasmicListItem__RenderFunc(props: { $state, "isDragging", "isDragging" - ), + ) })} > - @@ -516,7 +550,7 @@ function PlasmicListItem__RenderFunc(props: { $state, "showActions", "showActions" - ), + ) })} > {renderPlasmicSlot({ @@ -549,8 +583,8 @@ function PlasmicListItem__RenderFunc(props: { ), [sty.slotTargetIconshowAddendums_color_variant]: hasVariant($state, "color", "variant") && - hasVariant($state, "showAddendums", "showAddendums"), - }), + hasVariant($state, "showAddendums", "showAddendums") + }) })} ) : null} @@ -615,7 +649,7 @@ function PlasmicListItem__RenderFunc(props: { ), [sty.labelContainershowAddendums_color_variant]: hasVariant($state, "color", "variant") && - hasVariant($state, "showAddendums", "showAddendums"), + hasVariant($state, "showAddendums", "showAddendums") })} >
{renderPlasmicSlot({ @@ -736,8 +770,8 @@ function PlasmicListItem__RenderFunc(props: { "showAdditionalRow", "showAdditionalRow" ) && - hasVariant($state, "hasMenu", "hasMenu"), - }), + hasVariant($state, "hasMenu", "hasMenu") + }) })}
{( @@ -761,7 +795,7 @@ function PlasmicListItem__RenderFunc(props: { $state, "hasRightContents", "hasRightContents" - ), + ) })} > {renderPlasmicSlot({ @@ -803,8 +837,8 @@ function PlasmicListItem__RenderFunc(props: { $state, "showActions", "showActions" - ), - }), + ) + }) })} ) : null} @@ -845,7 +879,7 @@ function PlasmicListItem__RenderFunc(props: { $state, "showAdditionalRow", "showAdditionalRow" - ), + ) })} > {renderPlasmicSlot({ @@ -908,8 +942,8 @@ function PlasmicListItem__RenderFunc(props: { $state, "showAdditionalRow", "showAdditionalRow" - ), - }), + ) + }) })} ) : null} @@ -947,14 +981,14 @@ function PlasmicListItem__RenderFunc(props: { [sty.actionsContainershowAddendums_showActions_color_variant]: hasVariant($state, "color", "variant") && hasVariant($state, "showAddendums", "showAddendums") && - hasVariant($state, "showActions", "showActions"), + hasVariant($state, "showActions", "showActions") })} > {renderPlasmicSlot({ defaultContents: ( @@ -972,7 +1006,6 @@ function PlasmicListItem__RenderFunc(props: { /> ), - value: args.actions, className: classNames(sty.slotTargetActions, { [sty.slotTargetActionscolor_variant]: hasVariant( @@ -1073,8 +1106,8 @@ function PlasmicListItem__RenderFunc(props: { hasVariant($state, "isSelected", "isSelected") && hasVariant($state, "isFocused", "isFocused") && hasVariant($state, "showActions", "showActions") && - hasVariant($state, "showAddendums", "showAddendums"), - }), + hasVariant($state, "showAddendums", "showAddendums") + }) })} ) : null} @@ -1093,7 +1126,7 @@ function PlasmicListItem__RenderFunc(props: { hasVariant($state, "hasMenu", "hasMenu"), [sty.menuButtonisHighlighted_hasMenu]: hasVariant($state, "hasMenu", "hasMenu") && - hasVariant($state, "isHighlighted", "isHighlighted"), + hasVariant($state, "isHighlighted", "isHighlighted") })} /> @@ -1133,12 +1166,12 @@ function PlasmicListItem__RenderFunc(props: { $state, "showAdditionalRow", "showAdditionalRow" - ), + ) })} > {renderPlasmicSlot({ defaultContents: null, - value: args.additional, + value: args.additional })} ) : null} @@ -1159,9 +1192,8 @@ const PlasmicDescendants = { "addendumContainer", "actionsContainer", "menuButton", - "additional", + "additional" ], - main: [ "main", "dragHandle", @@ -1172,9 +1204,8 @@ const PlasmicDescendants = { "rightContentContainer", "addendumContainer", "actionsContainer", - "menuButton", + "menuButton" ], - dragHandle: ["dragHandle", "svg"], svg: ["svg"], iconContainer: ["iconContainer"], @@ -1184,7 +1215,7 @@ const PlasmicDescendants = { addendumContainer: ["addendumContainer"], actionsContainer: ["actionsContainer"], menuButton: ["menuButton"], - additional: ["additional"], + additional: ["additional"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -1209,7 +1240,6 @@ type NodeOverridesType = Pick< PlasmicListItem__OverridesType, DescendantsType >; - type NodeComponentProps = // Explicitly specify variants, args, and overrides as objects { @@ -1241,7 +1271,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicListItem__ArgProps, - internalVariantPropNames: PlasmicListItem__VariantProps, + internalVariantPropNames: PlasmicListItem__VariantProps }), [props, nodeName] ); @@ -1249,7 +1279,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -1279,7 +1309,7 @@ export const PlasmicListItem = Object.assign( // Metadata about props expected for PlasmicListItem internalVariantProps: PlasmicListItem__VariantProps, - internalArgProps: PlasmicListItem__ArgProps, + internalArgProps: PlasmicListItem__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSection.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSection.tsx index 3cce2010764..04f70cd3bdf 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSection.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSection.tsx @@ -14,23 +14,51 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, - SingleBooleanChoiceArg, - SingleChoiceArg, - StrictProps, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; -import ListItem from "../../components/ListItem"; // plasmic-import: v31d9_ANqk/component import ListSectionHeader from "../../components/ListSectionHeader"; // plasmic-import: wNvxk7eOak/component -import ListSectionSeparator from "../../components/ListSectionSeparator"; // plasmic-import: uG5_fPM0sK/component import IconButton from "../../components/widgets/IconButton"; // plasmic-import: LPry-TF4j22a/component +import ListItem from "../../components/ListItem"; // plasmic-import: v31d9_ANqk/component +import ListSectionSeparator from "../../components/ListSectionSeparator"; // plasmic-import: uG5_fPM0sK/component import "@plasmicapp/react-web/lib/plasmic.css"; @@ -38,11 +66,11 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicListSection.module.css"; // plasmic-import: znioE83CPU/css +import PlusCircleSvgIcon from "../q_4_icons/icons/PlasmicIcon__PlusCirclesvg"; // plasmic-import: tPPI666-2/icon +import ChevronDownSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon +import VariantGroupIcon from "../plasmic_kit/PlasmicIcon__VariantGroup"; // plasmic-import: pyS6pK4Spx-QF/icon import ComponentIcon from "../plasmic_kit/PlasmicIcon__Component"; // plasmic-import: nNWEF4jI3s5DI/icon import EyeIcon from "../plasmic_kit/PlasmicIcon__Eye"; // plasmic-import: A2FnGYgDh4e3U/icon -import VariantGroupIcon from "../plasmic_kit/PlasmicIcon__VariantGroup"; // plasmic-import: pyS6pK4Spx-QF/icon -import ChevronDownsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon -import PlusCirclesvgIcon from "../q_4_icons/icons/PlasmicIcon__PlusCirclesvg"; // plasmic-import: tPPI666-2/icon createPlasmicElementProxy; @@ -96,11 +124,20 @@ function PlasmicListSection__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -113,14 +150,14 @@ function PlasmicListSection__RenderFunc(props: { path: "isLast", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isLast, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isLast }, { path: "collapseState", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.collapseState, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.collapseState + } ], [$props, $ctx, $refs] ); @@ -128,7 +165,7 @@ function PlasmicListSection__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -150,7 +187,7 @@ function PlasmicListSection__RenderFunc(props: { $state, "collapseState", "collapsed" - ), + ) } )} > @@ -162,14 +199,14 @@ function PlasmicListSection__RenderFunc(props: { data-plasmic-name={"iconButton"} data-plasmic-override={overrides.iconButton} children2={ - } className={classNames("__wab_instance", sty.iconButton)} > - @@ -185,7 +222,7 @@ function PlasmicListSection__RenderFunc(props: { $state, "collapseState", "expanded" - ), + ) })} collapseState={ hasVariant($state, "collapseState", "expanded") @@ -203,7 +240,7 @@ function PlasmicListSection__RenderFunc(props: { > {renderPlasmicSlot({ defaultContents: "List Item Section", - value: args.title, + value: args.title })} {(hasVariant($state, "collapseState", "collapsed") ? false : true) ? ( @@ -220,7 +257,7 @@ function PlasmicListSection__RenderFunc(props: { $state, "collapseState", "expanded" - ), + ) })} > {renderPlasmicSlot({ @@ -278,7 +315,7 @@ function PlasmicListSection__RenderFunc(props: { ), - value: args.children, + value: args.children })} ) : null} @@ -296,7 +333,7 @@ function PlasmicListSection__RenderFunc(props: { $state, "isLast", "isLast" - ), + ) })} /> ) : null} @@ -310,12 +347,12 @@ const PlasmicDescendants = { "listSectionHeader", "iconButton", "itemsContainer", - "listSectionSeparator", + "listSectionSeparator" ], listSectionHeader: ["listSectionHeader", "iconButton"], iconButton: ["iconButton"], itemsContainer: ["itemsContainer"], - listSectionSeparator: ["listSectionSeparator"], + listSectionSeparator: ["listSectionSeparator"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -364,7 +401,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicListSection__ArgProps, - internalVariantPropNames: PlasmicListSection__VariantProps, + internalVariantPropNames: PlasmicListSection__VariantProps }), [props, nodeName] ); @@ -372,7 +409,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -395,7 +432,7 @@ export const PlasmicListSection = Object.assign( // Metadata about props expected for PlasmicListSection internalVariantProps: PlasmicListSection__VariantProps, - internalArgProps: PlasmicListSection__ArgProps, + internalArgProps: PlasmicListSection__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSectionHeader.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSectionHeader.tsx index 3e1dfbebc67..799e7e075dc 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSectionHeader.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSectionHeader.tsx @@ -14,22 +14,49 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, - renderPlasmicSlot, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; -import ExpandButton from "../../components/widgets/ExpandButton"; // plasmic-import: JJhv0MV9DH/component import IconButton from "../../components/widgets/IconButton"; // plasmic-import: LPry-TF4j22a/component +import ExpandButton from "../../components/widgets/ExpandButton"; // plasmic-import: JJhv0MV9DH/component import "@plasmicapp/react-web/lib/plasmic.css"; @@ -38,8 +65,8 @@ import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic- import sty from "./PlasmicListSectionHeader.module.css"; // plasmic-import: wNvxk7eOak/css import VariantGroupIcon from "../plasmic_kit/PlasmicIcon__VariantGroup"; // plasmic-import: pyS6pK4Spx-QF/icon -import ChevronDownsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon -import PlusCirclesvgIcon from "../q_4_icons/icons/PlasmicIcon__PlusCirclesvg"; // plasmic-import: tPPI666-2/icon +import PlusCircleSvgIcon from "../q_4_icons/icons/PlasmicIcon__PlusCirclesvg"; // plasmic-import: tPPI666-2/icon +import ChevronDownSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon createPlasmicElementProxy; @@ -98,11 +125,20 @@ function PlasmicListSectionHeader__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -115,20 +151,20 @@ function PlasmicListSectionHeader__RenderFunc(props: { path: "collapseState", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.collapseState, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.collapseState }, { path: "showActions", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.showActions, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.showActions }, { path: "showIcon", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.showIcon, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.showIcon + } ], [$props, $ctx, $refs] ); @@ -136,7 +172,7 @@ function PlasmicListSectionHeader__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -171,7 +207,7 @@ function PlasmicListSectionHeader__RenderFunc(props: { "showActions", "showActions" ), - [sty.rootshowIcon]: hasVariant($state, "showIcon", "showIcon"), + [sty.rootshowIcon]: hasVariant($state, "showIcon", "showIcon") } )} > @@ -189,7 +225,7 @@ function PlasmicListSectionHeader__RenderFunc(props: { $state, "showIcon", "showIcon" - ), + ) })} > {renderPlasmicSlot({ @@ -206,8 +242,8 @@ function PlasmicListSectionHeader__RenderFunc(props: { $state, "showIcon", "showIcon" - ), - }), + ) + }) })} ) : null} @@ -224,7 +260,7 @@ function PlasmicListSectionHeader__RenderFunc(props: { $state, "showActions", "showActions" - ), + ) })} > {renderPlasmicSlot({ @@ -240,8 +276,8 @@ function PlasmicListSectionHeader__RenderFunc(props: { $state, "showIcon", "showIcon" - ), - }), + ) + }) })} {(hasVariant($state, "showActions", "showActions") ? true : false) ? ( @@ -253,14 +289,14 @@ function PlasmicListSectionHeader__RenderFunc(props: { $state, "showActions", "showActions" - ), + ) })} > {renderPlasmicSlot({ defaultContents: ( @@ -268,13 +304,13 @@ function PlasmicListSectionHeader__RenderFunc(props: { className={classNames("__wab_instance", sty.iconButton__yhbTg)} size={"small"} > - ), - value: args.actions, + value: args.actions })} ) : null} @@ -298,7 +334,7 @@ function PlasmicListSectionHeader__RenderFunc(props: { $state, "collapseState", "expanded" - ), + ) })} > = @@ -390,7 +426,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicListSectionHeader__ArgProps, - internalVariantPropNames: PlasmicListSectionHeader__VariantProps, + internalVariantPropNames: PlasmicListSectionHeader__VariantProps }), [props, nodeName] ); @@ -398,7 +434,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -422,7 +458,7 @@ export const PlasmicListSectionHeader = Object.assign( // Metadata about props expected for PlasmicListSectionHeader internalVariantProps: PlasmicListSectionHeader__VariantProps, - internalArgProps: PlasmicListSectionHeader__ArgProps, + internalArgProps: PlasmicListSectionHeader__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSectionSeparator.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSectionSeparator.tsx index 6bc594517c8..5be770c6804 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSectionSeparator.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicListSectionSeparator.tsx @@ -14,16 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, - SingleBooleanChoiceArg, - StrictProps, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; @@ -67,11 +97,20 @@ function PlasmicListSectionSeparator__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -84,8 +123,8 @@ function PlasmicListSectionSeparator__RenderFunc(props: { path: "center", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.center, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.center + } ], [$props, $ctx, $refs] ); @@ -93,7 +132,7 @@ function PlasmicListSectionSeparator__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -118,7 +157,7 @@ function PlasmicListSectionSeparator__RenderFunc(props: { data-plasmic-name={"freeBox"} data-plasmic-override={overrides.freeBox} className={classNames(projectcss.all, sty.freeBox, { - [sty.freeBoxcenter]: hasVariant($state, "center", "center"), + [sty.freeBoxcenter]: hasVariant($state, "center", "center") })} /> ) : null} @@ -128,7 +167,7 @@ function PlasmicListSectionSeparator__RenderFunc(props: { const PlasmicDescendants = { root: ["root", "freeBox"], - freeBox: ["freeBox"], + freeBox: ["freeBox"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -174,7 +213,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicListSectionSeparator__ArgProps, - internalVariantPropNames: PlasmicListSectionSeparator__VariantProps, + internalVariantPropNames: PlasmicListSectionSeparator__VariantProps }), [props, nodeName] ); @@ -182,7 +221,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -202,7 +241,7 @@ export const PlasmicListSectionSeparator = Object.assign( // Metadata about props expected for PlasmicListSectionSeparator internalVariantProps: PlasmicListSectionSeparator__VariantProps, - internalArgProps: PlasmicListSectionSeparator__ArgProps, + internalArgProps: PlasmicListSectionSeparator__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicMenuButton.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicMenuButton.tsx index 94efde5d546..61987b8132a 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicMenuButton.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicMenuButton.tsx @@ -14,27 +14,57 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, + Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import IconButton from "../../components/widgets/IconButton"; // plasmic-import: LPry-TF4j22a/component import "@plasmicapp/react-web/lib/plasmic.css"; +import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_tokens/plasmic_plasmic_kit_q_4_color_tokens.module.css"; // plasmic-import: 95xp9cYcv7HrNWpFWWhbcv/projectcss import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicMenuButton.module.css"; // plasmic-import: h69wHrrKtL/css -import ChevronDownsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon -import DotsVerticalsvgIcon from "../q_4_icons/icons/PlasmicIcon__DotsVerticalsvg"; // plasmic-import: joYBQwH-P/icon +import DotsVerticalSvgIcon from "../q_4_icons/icons/PlasmicIcon__DotsVerticalsvg"; // plasmic-import: joYBQwH-P/icon +import ChevronDownSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon createPlasmicElementProxy; @@ -87,11 +117,20 @@ function PlasmicMenuButton__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -104,27 +143,27 @@ function PlasmicMenuButton__RenderFunc(props: { path: "stepUp", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.stepUp, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.stepUp }, { path: "withBackgroundHover", type: "private", variableType: "variant", initFunc: ({ $props, $state, $queries, $ctx }) => - $props.withBackgroundHover, + $props.withBackgroundHover }, { path: "type", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.type, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.type }, { path: "size", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.size, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.size + } ], [$props, $ctx, $refs] ); @@ -132,7 +171,7 @@ function PlasmicMenuButton__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -142,7 +181,7 @@ function PlasmicMenuButton__RenderFunc(props: { data-plasmic-root={true} data-plasmic-for-node={forNode} children2={ - @@ -155,7 +194,7 @@ function PlasmicMenuButton__RenderFunc(props: { $state, "withBackgroundHover", "withBackgroundHover" - ), + ) })} hoverText={args.hoverText} size={hasVariant($state, "size", "small") ? "small" : "vertical"} @@ -172,7 +211,7 @@ function PlasmicMenuButton__RenderFunc(props: { : undefined } > - @@ -192,7 +231,7 @@ function PlasmicMenuButton__RenderFunc(props: { } const PlasmicDescendants = { - root: ["root"], + root: ["root"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -237,7 +276,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicMenuButton__ArgProps, - internalVariantPropNames: PlasmicMenuButton__VariantProps, + internalVariantPropNames: PlasmicMenuButton__VariantProps }), [props, nodeName] ); @@ -245,7 +284,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -264,7 +303,7 @@ export const PlasmicMenuButton = Object.assign( // Metadata about props expected for PlasmicMenuButton internalVariantProps: PlasmicMenuButton__VariantProps, - internalArgProps: PlasmicMenuButton__ArgProps, + internalArgProps: PlasmicMenuButton__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicModal.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicModal.tsx index ab8f0167930..8ec53094bba 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicModal.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicModal.tsx @@ -14,18 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, - SingleBooleanChoiceArg, - Stack as Stack__, - StrictProps, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import Button from "../../components/widgets/Button"; // plasmic-import: SEF-sRmSoqV5c/component @@ -85,11 +113,20 @@ function PlasmicModal__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -102,8 +139,8 @@ function PlasmicModal__RenderFunc(props: { path: "tintBackground", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.tintBackground, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.tintBackground + } ], [$props, $ctx, $refs] ); @@ -111,7 +148,7 @@ function PlasmicModal__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -133,7 +170,7 @@ function PlasmicModal__RenderFunc(props: { $state, "tintBackground", "tintBackground" - ), + ) } )} > @@ -143,7 +180,7 @@ function PlasmicModal__RenderFunc(props: { $state, "tintBackground", "tintBackground" - ), + ) })} > @@ -166,13 +203,13 @@ function PlasmicModal__RenderFunc(props: { $state, "tintBackground", "tintBackground" - ), + ) })} > {renderPlasmicSlot({ defaultContents: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.\n\nSed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?\n\nLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.\n\nSed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?\n\nLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.\n\nSed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?\n\nLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.\n\nSed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?", - value: args.children, + value: args.children })}
), - value: args.footer, + value: args.footer })}
@@ -249,7 +286,7 @@ function PlasmicModal__RenderFunc(props: { } const PlasmicDescendants = { - root: ["root"], + root: ["root"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -294,7 +331,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicModal__ArgProps, - internalVariantPropNames: PlasmicModal__VariantProps, + internalVariantPropNames: PlasmicModal__VariantProps }), [props, nodeName] ); @@ -302,7 +339,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -321,7 +358,7 @@ export const PlasmicModal = Object.assign( // Metadata about props expected for PlasmicModal internalVariantProps: PlasmicModal__VariantProps, - internalArgProps: PlasmicModal__ArgProps, + internalArgProps: PlasmicModal__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect.tsx index 0276d7aa48a..2954adcb2ef 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect.tsx @@ -14,27 +14,51 @@ import * as React from "react"; import { - classNames, - createPlasmicElementProxy, - deriveRenderOpts, Flex as Flex__, - hasVariant, MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, PlasmicIcon as PlasmicIcon__, - renderPlasmicSlot, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, SingleBooleanChoiceArg, SingleChoiceArg, Stack as Stack__, StrictProps, + Trans as Trans__, + classNames, + createPlasmicElementProxy, + deriveRenderOpts, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import * as pp from "@plasmicapp/react-web"; +import Select__Overlay from "../../components/widgets/Select__Overlay"; // plasmic-import: j2qDLcsq5qB/component import Select__Option from "../../components/widgets/Select__Option"; // plasmic-import: rr-LWdMni2G/component import Select__OptionGroup from "../../components/widgets/Select__OptionGroup"; // plasmic-import: _qMm1mtrqOi/component -import Select__Overlay from "../../components/widgets/Select__Overlay"; // plasmic-import: j2qDLcsq5qB/component import "@plasmicapp/react-web/lib/plasmic.css"; @@ -42,9 +66,9 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicSelect.module.css"; // plasmic-import: j_4IQyOWK2b/css -import ChevronDownsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon -import ChevronUpsvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronUpsvg"; // plasmic-import: i9D87DzsX/icon -import PlussvgIcon from "../q_4_icons/icons/PlasmicIcon__Plussvg"; // plasmic-import: sQKgd2GNr/icon +import PlusSvgIcon from "../q_4_icons/icons/PlasmicIcon__Plussvg"; // plasmic-import: sQKgd2GNr/icon +import ChevronDownSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronDownsvg"; // plasmic-import: xZrB9_0ir/icon +import ChevronUpSvgIcon from "../q_4_icons/icons/PlasmicIcon__ChevronUpsvg"; // plasmic-import: i9D87DzsX/icon createPlasmicElementProxy; @@ -142,11 +166,20 @@ function PlasmicSelect__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -159,44 +192,43 @@ function PlasmicSelect__RenderFunc(props: { path: "showPlaceholder", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => - $props.showPlaceholder, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.showPlaceholder }, { path: "isOpen", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isOpen, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isOpen }, { path: "isDisabled", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDisabled, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDisabled }, { path: "type", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.type, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.type }, { path: "hasIcon", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.hasIcon, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.hasIcon }, { path: "size", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.size, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.size }, { path: "font", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.font, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.font }, { path: "value", @@ -204,8 +236,8 @@ function PlasmicSelect__RenderFunc(props: { variableType: "text", valueProp: "value", - onChangeProp: "onChange", - }, + onChangeProp: "onChange" + } ], [$props, $ctx, $refs] ); @@ -213,15 +245,15 @@ function PlasmicSelect__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const [isRootFocusVisibleWithin, triggerRootFocusVisibleWithinProps] = useTrigger("useFocusVisibleWithin", { - isTextInput: false, + isTextInput: false }); const triggers = { - focusVisibleWithin_root: isRootFocusVisibleWithin, + focusVisibleWithin_root: isRootFocusVisibleWithin }; return ( @@ -259,7 +291,7 @@ function PlasmicSelect__RenderFunc(props: { [sty.roottype_bordered]: hasVariant($state, "type", "bordered"), [sty.roottype_hugging]: hasVariant($state, "type", "hugging"), [sty.roottype_seamless]: hasVariant($state, "type", "seamless"), - [sty.roottype_wide]: hasVariant($state, "type", "wide"), + [sty.roottype_wide]: hasVariant($state, "type", "wide") } )} data-plasmic-trigger-props={[triggerRootFocusVisibleWithinProps]} @@ -304,10 +336,10 @@ function PlasmicSelect__RenderFunc(props: { "type", "seamless" ), - [sty.triggertype_wide]: hasVariant($state, "type", "wide"), + [sty.triggertype_wide]: hasVariant($state, "type", "wide") } )} - ref={(ref) => { + ref={ref => { $refs["trigger"] = ref; }} > @@ -331,13 +363,13 @@ function PlasmicSelect__RenderFunc(props: { $state, "showPlaceholder", "showPlaceholder" - ), + ) })} > {(hasVariant($state, "hasIcon", "hasIcon") ? true : false) ? renderPlasmicSlot({ defaultContents: ( - @@ -352,8 +384,8 @@ function PlasmicSelect__RenderFunc(props: { ), [sty.slotTargetIconhasIcon_isOpen]: hasVariant($state, "isOpen", "isOpen") && - hasVariant($state, "hasIcon", "hasIcon"), - }), + hasVariant($state, "hasIcon", "hasIcon") + }) }) : null} {( @@ -394,8 +426,8 @@ function PlasmicSelect__RenderFunc(props: { $state, "type", "seamless" - ), - }), + ) + }) }) : null} {( @@ -416,8 +448,8 @@ function PlasmicSelect__RenderFunc(props: { $state, "showPlaceholder", "showPlaceholder" - ), - }), + ) + }) }) : null} @@ -426,8 +458,8 @@ function PlasmicSelect__RenderFunc(props: { data-plasmic-override={overrides.dropdownIcon} PlasmicIconType={ hasVariant($state, "isOpen", "isOpen") - ? ChevronUpsvgIcon - : ChevronDownsvgIcon + ? ChevronUpSvgIcon + : ChevronDownSvgIcon } className={classNames(projectcss.all, sty.dropdownIcon, { [sty.dropdownIcon___focusVisibleWithin]: @@ -452,7 +484,7 @@ function PlasmicSelect__RenderFunc(props: { $state, "type", "medium" - ), + ) })} role={"img"} /> @@ -462,7 +494,7 @@ function PlasmicSelect__RenderFunc(props: { data-plasmic-name={"overlay"} data-plasmic-override={overrides.overlay} className={classNames("__wab_instance", sty.overlay, { - [sty.overlayisOpen]: hasVariant($state, "isOpen", "isOpen"), + [sty.overlayisOpen]: hasVariant($state, "isOpen", "isOpen") })} relativePlacement={"bottom"} > @@ -474,7 +506,7 @@ function PlasmicSelect__RenderFunc(props: { $state, "isOpen", "isOpen" - ), + ) })} > {renderPlasmicSlot({ @@ -560,7 +592,7 @@ function PlasmicSelect__RenderFunc(props: { ), - value: args.children, + value: args.children })} @@ -632,7 +664,7 @@ function useBehavior

( {"Option 3"} - ), + ) }; } } @@ -644,7 +676,7 @@ function useBehavior

( isOpenVariant: { group: "isOpen", variant: "isOpen" }, placeholderVariant: { group: "showPlaceholder", - variant: "showPlaceholder", + variant: "showPlaceholder" }, isDisabledVariant: { group: "isDisabled", variant: "isDisabled" }, triggerContentSlot: "selectedContent", @@ -653,10 +685,10 @@ function useBehavior

( root: "root", trigger: "trigger", overlay: "overlay", - optionsContainer: "optionsContainer", + optionsContainer: "optionsContainer" }, OptionComponent: Select__Option, - OptionGroupComponent: Select__OptionGroup, + OptionGroupComponent: Select__OptionGroup }, ref ); @@ -669,13 +701,13 @@ const PlasmicDescendants = { "contentContainer", "dropdownIcon", "overlay", - "optionsContainer", + "optionsContainer" ], trigger: ["trigger", "contentContainer", "dropdownIcon"], contentContainer: ["contentContainer"], dropdownIcon: ["dropdownIcon"], overlay: ["overlay", "optionsContainer"], - optionsContainer: ["optionsContainer"], + optionsContainer: ["optionsContainer"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -725,7 +757,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicSelect__ArgProps, - internalVariantPropNames: PlasmicSelect__VariantProps, + internalVariantPropNames: PlasmicSelect__VariantProps }), [props, nodeName] ); @@ -733,7 +765,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -762,7 +794,7 @@ export const PlasmicSelect = Object.assign( // Context for sub components Context: PlasmicSelectContext, - useBehavior, + useBehavior } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__Option.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__Option.tsx index f0bc664c580..20f6e7fc370 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__Option.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__Option.tsx @@ -14,17 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, - SingleBooleanChoiceArg, - StrictProps, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import * as pp from "@plasmicapp/react-web"; @@ -89,11 +118,20 @@ function PlasmicSelect__Option__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -106,26 +144,26 @@ function PlasmicSelect__Option__RenderFunc(props: { path: "isSelected", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isSelected, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isSelected }, { path: "isHighlighted", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isHighlighted, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isHighlighted }, { path: "isDisabled", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDisabled, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDisabled }, { path: "isUnsetOption", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isUnsetOption, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isUnsetOption + } ], [$props, $ctx, $refs] ); @@ -133,11 +171,11 @@ function PlasmicSelect__Option__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const superContexts = { - Select: React.useContext(SUPER__PlasmicSelect.Context), + Select: React.useContext(SUPER__PlasmicSelect.Context) }; return ( @@ -198,7 +236,7 @@ function PlasmicSelect__Option__RenderFunc(props: { $state, "isUnsetOption", "isUnsetOption" - ), + ) } )} > @@ -225,7 +263,7 @@ function PlasmicSelect__Option__RenderFunc(props: { $state, "isUnsetOption", "isUnsetOption" - ), + ) })} > {renderPlasmicSlot({ @@ -251,8 +289,8 @@ function PlasmicSelect__Option__RenderFunc(props: { $state, "isUnsetOption", "isUnsetOption" - ), - }), + ) + }) })} @@ -271,11 +309,11 @@ function useBehavior

( isDisabledVariant: { group: "isDisabled", variant: "isDisabled" }, isHighlightedVariant: { group: "isHighlighted", - variant: "isHighlighted", + variant: "isHighlighted" }, labelSlot: "children", root: "root", - labelContainer: "labelContainer", + labelContainer: "labelContainer" }, ref ); @@ -283,7 +321,7 @@ function useBehavior

( const PlasmicDescendants = { root: ["root", "labelContainer"], - labelContainer: ["labelContainer"], + labelContainer: ["labelContainer"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -329,7 +367,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicSelect__Option__ArgProps, - internalVariantPropNames: PlasmicSelect__Option__VariantProps, + internalVariantPropNames: PlasmicSelect__Option__VariantProps }), [props, nodeName] ); @@ -337,7 +375,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -359,7 +397,7 @@ export const PlasmicSelect__Option = Object.assign( internalVariantProps: PlasmicSelect__Option__VariantProps, internalArgProps: PlasmicSelect__Option__ArgProps, - useBehavior, + useBehavior } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__OptionGroup.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__OptionGroup.tsx index 612e5a011b5..ba11c74304c 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__OptionGroup.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__OptionGroup.tsx @@ -14,17 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, - SingleBooleanChoiceArg, - StrictProps, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import * as pp from "@plasmicapp/react-web"; import Select__Option from "../../components/widgets/Select__Option"; // plasmic-import: rr-LWdMni2G/component @@ -87,11 +116,20 @@ function PlasmicSelect__OptionGroup__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -104,20 +142,20 @@ function PlasmicSelect__OptionGroup__RenderFunc(props: { path: "noTitle", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.noTitle, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.noTitle }, { path: "isFirst", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isFirst, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isFirst }, { path: "isLast", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isLast, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isLast + } ], [$props, $ctx, $refs] ); @@ -125,11 +163,11 @@ function PlasmicSelect__OptionGroup__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const superContexts = { - Select: React.useContext(SUPER__PlasmicSelect.Context), + Select: React.useContext(SUPER__PlasmicSelect.Context) }; return ( @@ -149,7 +187,7 @@ function PlasmicSelect__OptionGroup__RenderFunc(props: { { [sty.rootisFirst]: hasVariant($state, "isFirst", "isFirst"), [sty.rootisLast]: hasVariant($state, "isLast", "isLast"), - [sty.rootnoTitle]: hasVariant($state, "noTitle", "noTitle"), + [sty.rootnoTitle]: hasVariant($state, "noTitle", "noTitle") } )} > @@ -168,13 +206,13 @@ function PlasmicSelect__OptionGroup__RenderFunc(props: { $state, "noTitle", "noTitle" - ), + ) })} > {renderPlasmicSlot({ defaultContents: "Group Name", value: args.title, - className: classNames(sty.slotTargetTitle), + className: classNames(sty.slotTargetTitle) })} ) : null} @@ -198,7 +236,7 @@ function PlasmicSelect__OptionGroup__RenderFunc(props: { ), - value: args.children, + value: args.children })}

@@ -222,7 +260,7 @@ function useBehavior

(props: P) { root: "root", separator: "separator", titleContainer: "titleContainer", - optionsContainer: "optionsContainer", + optionsContainer: "optionsContainer" }); } @@ -230,7 +268,7 @@ const PlasmicDescendants = { root: ["root", "titleContainer", "optionsContainer", "separator2"], titleContainer: ["titleContainer"], optionsContainer: ["optionsContainer"], - separator2: ["separator2"], + separator2: ["separator2"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -278,7 +316,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicSelect__OptionGroup__ArgProps, - internalVariantPropNames: PlasmicSelect__OptionGroup__VariantProps, + internalVariantPropNames: PlasmicSelect__OptionGroup__VariantProps }), [props, nodeName] ); @@ -286,7 +324,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -310,7 +348,7 @@ export const PlasmicSelect__OptionGroup = Object.assign( internalVariantProps: PlasmicSelect__OptionGroup__VariantProps, internalArgProps: PlasmicSelect__OptionGroup__ArgProps, - useBehavior, + useBehavior } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__Overlay.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__Overlay.tsx index 99cb2f9e085..0c5ba629f8b 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__Overlay.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSelect__Overlay.tsx @@ -14,17 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, - SingleChoiceArg, - StrictProps, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import * as pp from "@plasmicapp/react-web"; @@ -82,11 +111,20 @@ function PlasmicSelect__Overlay__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -100,8 +138,8 @@ function PlasmicSelect__Overlay__RenderFunc(props: { type: "private", variableType: "variant", initFunc: ({ $props, $state, $queries, $ctx }) => - $props.relativePlacement, - }, + $props.relativePlacement + } ], [$props, $ctx, $refs] ); @@ -109,11 +147,11 @@ function PlasmicSelect__Overlay__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const superContexts = { - Select: React.useContext(SUPER__PlasmicSelect.Context), + Select: React.useContext(SUPER__PlasmicSelect.Context) }; return ( @@ -151,7 +189,7 @@ function PlasmicSelect__Overlay__RenderFunc(props: { $state, "relativePlacement", "top" - ), + ) })} /> ) : null} @@ -168,7 +206,7 @@ function PlasmicSelect__Overlay__RenderFunc(props: { $state, "relativePlacement", "bottom" - ), + ) })} > {(hasVariant($state, "relativePlacement", "right") ? true : false) ? ( @@ -185,7 +223,7 @@ function PlasmicSelect__Overlay__RenderFunc(props: { $state, "relativePlacement", "right" - ), + ) })} /> ) : null} @@ -197,12 +235,12 @@ function PlasmicSelect__Overlay__RenderFunc(props: { (superContexts.Select && superContexts.Select.variants) || {}, "type", "seamless" - ), + ) })} > {renderPlasmicSlot({ defaultContents: null, - value: args.children, + value: args.children })} {(hasVariant($state, "relativePlacement", "left") ? true : false) ? ( @@ -219,7 +257,7 @@ function PlasmicSelect__Overlay__RenderFunc(props: { $state, "relativePlacement", "right" - ), + ) })} /> ) : null} @@ -248,7 +286,7 @@ function PlasmicSelect__Overlay__RenderFunc(props: { $state, "relativePlacement", "top" - ), + ) })} /> ) : null} @@ -269,7 +307,7 @@ function useBehavior

( isPlacedLeftVariant: { group: "relativePlacement", variant: "left" }, isPlacedRightVariant: { group: "relativePlacement", variant: "right" }, contentSlot: "children", - root: "root", + root: "root" }, ref ); @@ -282,7 +320,7 @@ const PlasmicDescendants = { left: ["left"], main: ["main"], right: ["right"], - bottom: ["bottom"], + bottom: ["bottom"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -333,7 +371,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicSelect__Overlay__ArgProps, - internalVariantPropNames: PlasmicSelect__Overlay__VariantProps, + internalVariantPropNames: PlasmicSelect__Overlay__VariantProps }), [props, nodeName] ); @@ -341,7 +379,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -368,7 +406,7 @@ export const PlasmicSelect__Overlay = Object.assign( internalVariantProps: PlasmicSelect__Overlay__VariantProps, internalArgProps: PlasmicSelect__Overlay__ArgProps, - useBehavior, + useBehavior } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSwitch.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSwitch.tsx index 8298b239fa5..efd2f60d287 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSwitch.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicSwitch.tsx @@ -14,18 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, - SingleBooleanChoiceArg, - StrictProps, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import * as pp from "@plasmicapp/react-web"; @@ -95,11 +123,20 @@ function PlasmicSwitch__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -112,13 +149,13 @@ function PlasmicSwitch__RenderFunc(props: { path: "noLabel", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.noLabel, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.noLabel }, { path: "isDisabled", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDisabled, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.isDisabled }, { path: "isChecked", @@ -126,8 +163,8 @@ function PlasmicSwitch__RenderFunc(props: { variableType: "boolean", valueProp: "isChecked", - onChangeProp: "onChange", - }, + onChangeProp: "onChange" + } ], [$props, $ctx, $refs] ); @@ -135,15 +172,15 @@ function PlasmicSwitch__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); const [isRootFocusVisibleWithin, triggerRootFocusVisibleWithinProps] = useTrigger("useFocusVisibleWithin", { - isTextInput: false, + isTextInput: false }); const triggers = { - focusVisibleWithin_root: isRootFocusVisibleWithin, + focusVisibleWithin_root: isRootFocusVisibleWithin }; return ( @@ -164,7 +201,7 @@ function PlasmicSwitch__RenderFunc(props: { [sty.root___focusVisibleWithin]: triggers.focusVisibleWithin_root, [sty.rootisChecked]: hasVariant($state, "isChecked", "isChecked"), [sty.rootisDisabled]: hasVariant($state, "isDisabled", "isDisabled"), - [sty.rootnoLabel]: hasVariant($state, "noLabel", "noLabel"), + [sty.rootnoLabel]: hasVariant($state, "noLabel", "noLabel") } )} data-plasmic-trigger-props={[triggerRootFocusVisibleWithinProps]} @@ -180,7 +217,7 @@ function PlasmicSwitch__RenderFunc(props: { "isDisabled", "isDisabled" ), - [sty.togglenoLabel]: hasVariant($state, "noLabel", "noLabel"), + [sty.togglenoLabel]: hasVariant($state, "noLabel", "noLabel") })} >

@@ -203,7 +240,7 @@ function PlasmicSwitch__RenderFunc(props: { $state, "noLabel", "noLabel" - ), + ) })} > {renderPlasmicSlot({ @@ -221,8 +258,8 @@ function PlasmicSwitch__RenderFunc(props: { $state, "noLabel", "noLabel" - ), - }), + ) + }) })} ) : null} @@ -234,7 +271,7 @@ function useBehavior

(props: P, ref: pp.SwitchRef) { if (!("children" in props)) { props = { ...props, - children: "Enter some text", + children: "Enter some text" }; } @@ -246,7 +283,7 @@ function useBehavior

(props: P, ref: pp.SwitchRef) { isDisabledVariant: { group: "isDisabled", variant: "isDisabled" }, noLabelVariant: { group: "noLabel", variant: "noLabel" }, labelSlot: "children", - root: "root", + root: "root" }, ref ); @@ -256,7 +293,7 @@ const PlasmicDescendants = { root: ["root", "toggle", "thumb", "labelContainer"], toggle: ["toggle", "thumb"], thumb: ["thumb"], - labelContainer: ["labelContainer"], + labelContainer: ["labelContainer"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -304,7 +341,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicSwitch__ArgProps, - internalVariantPropNames: PlasmicSwitch__VariantProps, + internalVariantPropNames: PlasmicSwitch__VariantProps }), [props, nodeName] ); @@ -312,7 +349,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -336,7 +373,7 @@ export const PlasmicSwitch = Object.assign( internalVariantProps: PlasmicSwitch__VariantProps, internalArgProps: PlasmicSwitch__ArgProps, - useBehavior, + useBehavior } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicTextWithInfo.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicTextWithInfo.tsx index 935a1c2dcac..35825178b38 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicTextWithInfo.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicTextWithInfo.tsx @@ -14,18 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, renderPlasmicSlot, - SingleBooleanChoiceArg, - Stack as Stack__, - StrictProps, + set as $stateSet, + useCurrentUser, useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; @@ -33,7 +61,7 @@ import plasmic_plasmic_kit_color_tokens_css from "../plasmic_kit_q_4_color_token import projectcss from "../PP__plasmickit_design_system.module.css"; // plasmic-import: tXkSR39sgCDWSitZxC5xFV/projectcss import sty from "./PlasmicTextWithInfo.module.css"; // plasmic-import: -EsDm7v023/css -import InformationsvgIcon from "../q_4_icons/icons/PlasmicIcon__Informationsvg"; // plasmic-import: hqBNVBJWB/icon +import InformationSvgIcon from "../q_4_icons/icons/PlasmicIcon__Informationsvg"; // plasmic-import: hqBNVBJWB/icon createPlasmicElementProxy; @@ -75,11 +103,20 @@ function PlasmicTextWithInfo__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -92,8 +129,8 @@ function PlasmicTextWithInfo__RenderFunc(props: { path: "medium", type: "private", variableType: "variant", - initFunc: ({ $props, $state, $queries, $ctx }) => $props.medium, - }, + initFunc: ({ $props, $state, $queries, $ctx }) => $props.medium + } ], [$props, $ctx, $refs] ); @@ -101,7 +138,7 @@ function PlasmicTextWithInfo__RenderFunc(props: { $props, $ctx, $queries: {}, - $refs, + $refs }); return ( @@ -125,13 +162,13 @@ function PlasmicTextWithInfo__RenderFunc(props: { > {renderPlasmicSlot({ defaultContents: "Enter some text", - value: args.children, + value: args.children })} - @@ -141,7 +178,7 @@ function PlasmicTextWithInfo__RenderFunc(props: { const PlasmicDescendants = { root: ["root", "icon"], - icon: ["icon"], + icon: ["icon"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -187,7 +224,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicTextWithInfo__ArgProps, - internalVariantPropNames: PlasmicTextWithInfo__VariantProps, + internalVariantPropNames: PlasmicTextWithInfo__VariantProps }), [props, nodeName] ); @@ -195,7 +232,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -215,7 +252,7 @@ export const PlasmicTextWithInfo = Object.assign( // Metadata about props expected for PlasmicTextWithInfo internalVariantProps: PlasmicTextWithInfo__VariantProps, - internalArgProps: PlasmicTextWithInfo__ArgProps, + internalArgProps: PlasmicTextWithInfo__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicTextarea.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicTextarea.tsx index d1e68b5aa34..2b5ca810e12 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicTextarea.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/PlasmicTextarea.tsx @@ -14,13 +14,46 @@ import * as React from "react"; import { + Flex as Flex__, + MultiChoiceArg, + PlasmicDataSourceContextProvider as PlasmicDataSourceContextProvider__, + PlasmicIcon as PlasmicIcon__, + PlasmicImg as PlasmicImg__, + PlasmicLink as PlasmicLink__, + PlasmicPageGuard as PlasmicPageGuard__, + SingleBooleanChoiceArg, + SingleChoiceArg, + Stack as Stack__, + StrictProps, + Trans as Trans__, classNames, createPlasmicElementProxy, deriveRenderOpts, - Flex as Flex__, - StrictProps, + ensureGlobalVariants, + generateOnMutateForSpec, + generateStateOnChangeProp, + generateStateOnChangePropForCodeComponents, + generateStateValueProp, + get as $stateGet, + hasVariant, + initializeCodeComponentStates, + initializePlasmicStates, + makeFragment, + omit, + pick, + renderPlasmicSlot, + set as $stateSet, + useCurrentUser, + useDollarState, + usePlasmicTranslator, + useTrigger, + wrapWithClassName } from "@plasmicapp/react-web"; -import { useDataEnv } from "@plasmicapp/react-web/lib/host"; +import { + DataCtxReader as DataCtxReader__, + useDataEnv, + useGlobalActions +} from "@plasmicapp/react-web/lib/host"; import "@plasmicapp/react-web/lib/plasmic.css"; @@ -58,11 +91,20 @@ function PlasmicTextarea__RenderFunc(props: { }) { const { variants, overrides, forNode } = props; - const args = React.useMemo(() => Object.assign({}, props.args), [props.args]); + const args = React.useMemo( + () => + Object.assign( + {}, + Object.fromEntries( + Object.entries(props.args).filter(([_, v]) => v !== undefined) + ) + ), + [props.args] + ); const $props = { ...args, - ...variants, + ...variants }; const $ctx = useDataEnv?.() || {}; @@ -101,7 +143,7 @@ function PlasmicTextarea__RenderFunc(props: { const PlasmicDescendants = { root: ["root", "textarea"], - textarea: ["textarea"], + textarea: ["textarea"] } as const; type NodeNameType = keyof typeof PlasmicDescendants; type DescendantsType = @@ -147,7 +189,7 @@ function makeNodeComponent(nodeName: NodeName) { name: nodeName, descendantNames: PlasmicDescendants[nodeName], internalArgPropNames: PlasmicTextarea__ArgProps, - internalVariantPropNames: PlasmicTextarea__VariantProps, + internalVariantPropNames: PlasmicTextarea__VariantProps }), [props, nodeName] ); @@ -155,7 +197,7 @@ function makeNodeComponent(nodeName: NodeName) { variants, args, overrides, - forNode: nodeName, + forNode: nodeName }); }; if (nodeName === "root") { @@ -175,7 +217,7 @@ export const PlasmicTextarea = Object.assign( // Metadata about props expected for PlasmicTextarea internalVariantProps: PlasmicTextarea__VariantProps, - internalArgProps: PlasmicTextarea__ArgProps, + internalArgProps: PlasmicTextarea__ArgProps } ); diff --git a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/icons/PlasmicIcon__DoubleDotsVerticalsvg.tsx b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/icons/PlasmicIcon__DoubleDotsVerticalsvg.tsx index 35a1b6da61c..e668193627e 100644 --- a/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/icons/PlasmicIcon__DoubleDotsVerticalsvg.tsx +++ b/platform/wab/src/wab/client/plasmic/plasmic_kit_design_system/icons/PlasmicIcon__DoubleDotsVerticalsvg.tsx @@ -2,15 +2,15 @@ /* eslint-disable */ /* tslint:disable */ /* prettier-ignore-start */ -import { classNames } from "@plasmicapp/react-web"; import React from "react"; +import { classNames } from "@plasmicapp/react-web"; -export type DoubleDotsVerticalsvgIconProps = React.ComponentProps<"svg"> & { +export type DoubleDotsVerticalSvgIconProps = React.ComponentProps<"svg"> & { title?: string; }; -export function DoubleDotsVerticalsvgIcon( - props: DoubleDotsVerticalsvgIconProps +export function DoubleDotsVerticalSvgIcon( + props: DoubleDotsVerticalSvgIconProps ) { const { className, style, title, ...restProps } = props; return ( @@ -42,5 +42,5 @@ export function DoubleDotsVerticalsvgIcon( ); } -export default DoubleDotsVerticalsvgIcon; +export default DoubleDotsVerticalSvgIcon; /* prettier-ignore-end */ diff --git a/platform/wab/src/wab/styles/plasmic-tokens.theo.json b/platform/wab/src/wab/styles/plasmic-tokens.theo.json index 1f667ef36a4..4673d6598bc 100644 --- a/platform/wab/src/wab/styles/plasmic-tokens.theo.json +++ b/platform/wab/src/wab/styles/plasmic-tokens.theo.json @@ -6006,4 +6006,4 @@ "source": "plasmic.app" } } -} +} \ No newline at end of file