@pairbo/ui-kit 0.3.32 → 0.4.0

package/dist/src/components/type-canvas/type-canvas.component.d.ts

@@ -8,6 +8,14 @@ type Position = {
     left: number;
     top: number;
 };
+type DisplayType = "default" | "fullSize";
+type FontConfig = {
+    family: string;
+    label: string;
+    fontSizePt: number;
+    lineHeight: number;
+    maxLines: Record<DisplayType, number>;
+};
 /**
  * @summary Short summary of the component's intended use.
  * @status experimental
@@ -30,6 +38,7 @@ export default class PboTypeCanvas extends PairboElement {
     font: string;
     color: string;
     alignment: "left" | "center" | "right";
+    displayType: DisplayType;
     canvas: HTMLCanvasElement;
     canvasContainer: HTMLDivElement;
     scale: number;
@@ -39,12 +48,29 @@ export default class PboTypeCanvas extends PairboElement {
     imgLoading: boolean;
     backgroundImage: HTMLImageElement | undefined;
     resizeObserver: ResizeObserver | undefined;
+    dpi: number;
+    fontConfig: FontConfig;
+    processedMessage: string;
     handleBackgroundImageUrlChange(): Promise<void>;
     handleBackgroundImageChange(): void;
+    handleProcessedMessageChange(): void;
+    private debounceTimer;
+    protected inchToPixel(inch: number, dpi: number): number;
+    protected ptToInch(pt: number): number;
     protected firstUpdated(): void;
     protected updated(props: PropertyValues): void;
     getMaxStringLength(ctx: CanvasRenderingContext2D, text: string, width: number): number;
-    wrapText(ctx: CanvasRenderingContext2D, message: string, areaPosition: Position, areaSize: Size, maxLineSize: number, alignment: "center" | "left" | "right"): void;
+    wrapText({ ctx, message, areaPosition, areaSize, maxLineSize, alignment, lineHeight, fontSizePt, verticalAlignment, }: {
+        ctx: CanvasRenderingContext2D;
+        message: string;
+        areaPosition: Position;
+        areaSize: Size;
+        maxLineSize: number;
+        alignment: "center" | "left" | "right";
+        fontSizePt: number;
+        lineHeight?: number;
+        verticalAlignment?: "top" | "middle" | "bottom";
+    }): void;
     /**
      * Updates the position and size of the text area based on the canvas dimensions.
      */

package/dist/src/components/type-form/type-form.component.d.ts

@@ -60,10 +60,14 @@ export default class PboTypeForm extends PairboElement {
         message: string;
     };
     wrappedSubmitTypeForm: SubmitTypeForm;
+    processedMessage: string;
+    maxChars: 223 | 600;
+    handleCardChange(): void;
     updateWrappedSubmitTypeForm(): void;
     protected firstUpdated(): void;
     get formData(): TypeFormData;
     private handleFormChange;
+    private handleTypeCanvasProcessed;
     hostConnected(): void;
     hostDisconnected(): void;
     submitFormHandler(e: SubmitEvent): void;

package/dist/src/events/pbo-type-canvas-processed.d.ts

@@ -0,0 +1,8 @@
+export type PboTypeCanvasProcessedEvent = CustomEvent<{
+    message: string;
+}>;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        "pbo-type-canvas-processed": PboTypeCanvasProcessedEvent;
+    }
+}