Skip to content

Commit 296c529

Browse files
committed
fix: rearrange configs
1 parent a9cff84 commit 296c529

5 files changed

Lines changed: 113 additions & 88 deletions

File tree

packages/pluggableWidgets/barcode-generator-web/src/BarcodeGenerator.editorConfig.ts

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,14 @@ export function getProperties(values: BarcodeGeneratorPreviewProps, defaultPrope
1616
if (values.codeFormat === "QRCode") {
1717
hidePropertiesIn(defaultProperties, values, ["codeWidth", "codeHeight", "displayValue", "codeMargin"]);
1818
} else {
19-
hidePropertiesIn(defaultProperties, values, ["qrOverlay", "qrSize", "qrMargin", "qrLevel", "qrTitle"]);
19+
hidePropertiesIn(defaultProperties, values, [
20+
"qrOverlay",
21+
"qrSize",
22+
"qrMargin",
23+
"qrLevel",
24+
"qrTitle",
25+
"showTitle"
26+
]);
2027
}
2128

2229
if (values.codeFormat !== "QRCode" || !values.qrOverlay) {

packages/pluggableWidgets/barcode-generator-web/src/BarcodeGenerator.xml

Lines changed: 92 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -119,6 +119,22 @@
119119
<description>Space between main barcode and addon (in pixels)</description>
120120
</property>
121121
</propertyGroup>
122+
<propertyGroup caption="Advanced QR Code Settings">
123+
<property key="qrLevel" type="enumeration" required="true" defaultValue="L">
124+
<caption>Level</caption>
125+
<description>The Error Correction Level to use</description>
126+
<enumerationValues>
127+
<enumerationValue key="L">L</enumerationValue>
128+
<enumerationValue key="M">M</enumerationValue>
129+
<enumerationValue key="Q">Q</enumerationValue>
130+
<enumerationValue key="H">H</enumerationValue>
131+
</enumerationValues>
132+
</property>
133+
<property key="qrSize" type="integer" required="true" defaultValue="128">
134+
<caption>QR Size</caption>
135+
<description>The size of the QR box. Note: In preview, the max height is 200px. The QR code will render at full size in your application.</description>
136+
</property>
137+
</propertyGroup>
122138
<propertyGroup caption="Development">
123139
<property key="logLevel" type="enumeration" required="true" defaultValue="None">
124140
<caption>Log Level</caption>
@@ -132,84 +148,82 @@
132148
</propertyGroup>
133149
</propertyGroup>
134150
<propertyGroup caption="Display">
135-
<property key="displayValue" type="boolean" defaultValue="false">
136-
<caption>Display value</caption>
137-
<description>Display the value below the code</description>
138-
</property>
139-
<property key="showAsCard" type="boolean" defaultValue="false">
140-
<caption>Show as card</caption>
141-
<description>Display the widget with a border, background and padding</description>
142-
</property>
143-
<property key="codeWidth" type="integer" required="true" defaultValue="2">
144-
<caption>Bar width</caption>
145-
<description>Width of a single bar</description>
146-
</property>
147-
<property key="codeHeight" type="integer" required="true" defaultValue="200">
148-
<caption>Code height</caption>
149-
<description>Height of the barcode. Note: In preview, the max height is 200px. The barcode will render at full height in your application.</description>
150-
</property>
151-
<property key="codeMargin" type="integer" required="true" defaultValue="2">
152-
<caption>Margin size</caption>
153-
<description>In pixels</description>
154-
</property>
155-
<property key="qrSize" type="integer" required="true" defaultValue="128">
156-
<caption>QR Size</caption>
157-
<description>The size of the QR box. Note: In preview, the max height is 200px. The QR code will render at full size in your application.</description>
158-
</property>
159-
<property key="qrMargin" type="integer" required="true" defaultValue="2">
160-
<caption>Margin size</caption>
161-
<description>Number of module units (QR grid cells) to use for margin. Increasing compresses the QR pattern within the fixed size. Note: not visible in preview.</description>
162-
</property>
163-
<property key="qrTitle" type="string" required="true">
164-
<caption>Title</caption>
165-
<description>Used for accessibility reasons</description>
166-
</property>
167-
<property key="qrLevel" type="enumeration" required="true" defaultValue="L">
168-
<caption>Level</caption>
169-
<description>The Error Correction Level to use</description>
170-
<enumerationValues>
171-
<enumerationValue key="L">L</enumerationValue>
172-
<enumerationValue key="M">M</enumerationValue>
173-
<enumerationValue key="Q">Q</enumerationValue>
174-
<enumerationValue key="H">H</enumerationValue>
175-
</enumerationValues>
176-
</property>
177-
<property key="qrOverlay" type="boolean" required="true" defaultValue="false">
178-
<caption>Overlay image</caption>
179-
<description>Include an image overlay on the QR code</description>
180-
</property>
181-
<property key="qrOverlaySrc" type="image" required="true">
182-
<caption>Image source</caption>
183-
<description>URL or path to the image to display on the QR code</description>
184-
</property>
185-
<property key="qrOverlayCenter" type="boolean" required="true" defaultValue="true">
186-
<caption>Center image</caption>
187-
<description>Center the image in the QR code</description>
188-
</property>
189-
<property key="qrOverlayX" type="integer" required="true" defaultValue="0">
190-
<caption>Image X position</caption>
191-
<description>Horizontal position of the image</description>
192-
</property>
193-
<property key="qrOverlayY" type="integer" required="true" defaultValue="0">
194-
<caption>Image Y position</caption>
195-
<description>Vertical position of the image</description>
196-
</property>
197-
<property key="qrOverlayHeight" type="integer" required="true" defaultValue="24">
198-
<caption>Image height</caption>
199-
<description>Height of the image in pixels</description>
200-
</property>
201-
<property key="qrOverlayWidth" type="integer" required="true" defaultValue="24">
202-
<caption>Image width</caption>
203-
<description>Width of the image in pixels</description>
204-
</property>
205-
<property key="qrOverlayOpacity" type="decimal" required="true" defaultValue="1">
206-
<caption>Image opacity</caption>
207-
<description>Opacity of the image (0.0 to 1.0)</description>
208-
</property>
209-
<property key="qrOverlayExcavate" type="boolean" required="true" defaultValue="true">
210-
<caption>Excavate background</caption>
211-
<description>Remove QR code dots behind the image</description>
212-
</property>
151+
<propertyGroup caption="Display">
152+
<property key="displayValue" type="boolean" defaultValue="false">
153+
<caption>Display value</caption>
154+
<description>Display the value below the code</description>
155+
</property>
156+
<property key="showAsCard" type="boolean" defaultValue="false">
157+
<caption>Show as card</caption>
158+
<description>Display the widget with a border, background and padding</description>
159+
</property>
160+
<property key="codeWidth" type="integer" required="true" defaultValue="2">
161+
<caption>Bar width</caption>
162+
<description>Width of a single bar</description>
163+
</property>
164+
<property key="codeHeight" type="integer" required="true" defaultValue="200">
165+
<caption>Code height</caption>
166+
<description>Height of the barcode. Note: In preview, the max height is 200px. The barcode will render at full height in your application.</description>
167+
</property>
168+
<property key="codeMargin" type="integer" required="true" defaultValue="2">
169+
<caption>Margin size</caption>
170+
<description>In pixels</description>
171+
</property>
172+
<property key="qrMargin" type="integer" required="true" defaultValue="2">
173+
<caption>Margin size</caption>
174+
<description>Number of module units (QR grid cells) to use for margin. Increasing compresses the QR pattern within the fixed size. Note: not visible in preview.</description>
175+
</property>
176+
<property key="qrTitle" type="textTemplate" required="true">
177+
<caption>Title</caption>
178+
<description>Used for accessibility</description>
179+
<translations>
180+
<translation lang="en_US">QR Code</translation>
181+
<translation lang="nl_NL">QR-Code</translation>
182+
</translations>
183+
</property>
184+
<property key="showTitle" type="boolean" defaultValue="false">
185+
<caption>Show title</caption>
186+
<description>Display title on top of QR Code</description>
187+
</property>
188+
<property key="qrOverlay" type="boolean" required="true" defaultValue="false">
189+
<caption>Overlay image</caption>
190+
<description>Include an image overlay on the QR code</description>
191+
</property>
192+
</propertyGroup>
193+
<propertyGroup caption="QR Overlay Settings">
194+
<property key="qrOverlaySrc" type="image" required="true">
195+
<caption>Image source</caption>
196+
<description>URL or path to the image to display on the QR code</description>
197+
</property>
198+
<property key="qrOverlayCenter" type="boolean" required="true" defaultValue="true">
199+
<caption>Center image</caption>
200+
<description>Center the image in the QR code</description>
201+
</property>
202+
<property key="qrOverlayX" type="integer" required="true" defaultValue="0">
203+
<caption>Image X position</caption>
204+
<description>Horizontal position of the image</description>
205+
</property>
206+
<property key="qrOverlayY" type="integer" required="true" defaultValue="0">
207+
<caption>Image Y position</caption>
208+
<description>Vertical position of the image</description>
209+
</property>
210+
<property key="qrOverlayHeight" type="integer" required="true" defaultValue="24">
211+
<caption>Image height</caption>
212+
<description>Height of the image in pixels</description>
213+
</property>
214+
<property key="qrOverlayWidth" type="integer" required="true" defaultValue="24">
215+
<caption>Image width</caption>
216+
<description>Width of the image in pixels</description>
217+
</property>
218+
<property key="qrOverlayOpacity" type="decimal" required="true" defaultValue="1">
219+
<caption>Image opacity</caption>
220+
<description>Opacity of the image (0.0 to 1.0)</description>
221+
</property>
222+
<property key="qrOverlayExcavate" type="boolean" required="true" defaultValue="true">
223+
<caption>Excavate background</caption>
224+
<description>Remove QR code dots behind the image</description>
225+
</property>
226+
</propertyGroup>
213227
</propertyGroup>
214228
</properties>
215229
</widget>

packages/pluggableWidgets/barcode-generator-web/src/components/QRCode.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export function QRCodeRenderer({ config }: QRCodeRendererProps): ReactElement {
2424

2525
return (
2626
<div className="qrcode-renderer">
27-
{title && <h3 className="qrcode-renderer-title">{title}</h3>}
27+
{config.showTitle && <h3 className="qrcode-renderer-title">{title}</h3>}
2828
{buttonPosition === "top" && button}
2929
<QRCodeSVG
3030
ref={ref}

packages/pluggableWidgets/barcode-generator-web/src/config/Barcode.config.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ export interface BarcodeTypeConfig extends CodeBaseTypeConfig<"barcode"> {
4343
export interface QRCodeTypeConfig extends CodeBaseTypeConfig<"qrcode"> {
4444
size: number;
4545
title: string;
46+
showTitle: boolean;
4647
level: QrLevelEnum;
4748
overlay?: {
4849
src: string;
@@ -83,7 +84,8 @@ export function barcodeConfig(props: BarcodeGeneratorContainerProps): BarcodeCon
8384
...baseConfig,
8485
type: "qrcode",
8586
size: props.qrSize ?? 128,
86-
title: props.qrTitle ?? "",
87+
showTitle: props.showTitle,
88+
title: props.qrTitle.status === "available" ? props.qrTitle.value : "QR Code",
8789
level: props.qrLevel ?? "L",
8890
overlay:
8991
props.qrOverlaySrc?.status === "available"

packages/pluggableWidgets/barcode-generator-web/typings/BarcodeGeneratorProps.d.ts

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,10 @@ export type CustomCodeFormatEnum = "CODE128" | "EAN13" | "EAN8" | "UPC" | "CODE3
1515

1616
export type AddonFormatEnum = "None" | "EAN5" | "EAN2";
1717

18-
export type LogLevelEnum = "None" | "Info" | "Debug";
19-
2018
export type QrLevelEnum = "L" | "M" | "Q" | "H";
2119

20+
export type LogLevelEnum = "None" | "Info" | "Debug";
21+
2222
export interface BarcodeGeneratorContainerProps {
2323
name: string;
2424
class: string;
@@ -40,16 +40,17 @@ export interface BarcodeGeneratorContainerProps {
4040
addonFormat: AddonFormatEnum;
4141
addonValue: DynamicValue<string>;
4242
addonSpacing: number;
43+
qrLevel: QrLevelEnum;
44+
qrSize: number;
4345
logLevel: LogLevelEnum;
4446
displayValue: boolean;
4547
showAsCard: boolean;
4648
codeWidth: number;
4749
codeHeight: number;
4850
codeMargin: number;
49-
qrSize: number;
5051
qrMargin: number;
51-
qrTitle: string;
52-
qrLevel: QrLevelEnum;
52+
qrTitle: DynamicValue<string>;
53+
showTitle: boolean;
5354
qrOverlay: boolean;
5455
qrOverlaySrc: DynamicValue<WebImage>;
5556
qrOverlayCenter: boolean;
@@ -88,16 +89,17 @@ export interface BarcodeGeneratorPreviewProps {
8889
addonFormat: AddonFormatEnum;
8990
addonValue: string;
9091
addonSpacing: number | null;
92+
qrLevel: QrLevelEnum;
93+
qrSize: number | null;
9194
logLevel: LogLevelEnum;
9295
displayValue: boolean;
9396
showAsCard: boolean;
9497
codeWidth: number | null;
9598
codeHeight: number | null;
9699
codeMargin: number | null;
97-
qrSize: number | null;
98100
qrMargin: number | null;
99101
qrTitle: string;
100-
qrLevel: QrLevelEnum;
102+
showTitle: boolean;
101103
qrOverlay: boolean;
102104
qrOverlaySrc: { type: "static"; imageUrl: string; } | { type: "dynamic"; entity: string; } | null;
103105
qrOverlayCenter: boolean;

0 commit comments

Comments
 (0)