@dcl/playground-assets 7.0.6-4153633895.commit-4aad233 → 7.0.6-4177592674.commit-39cdc99

package/dist/playground/sdk/dcl-sdk.package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dcl/sdk",
-  "version": "7.0.6-4153633895.commit-4aad233",
+  "version": "7.0.6-4177592674.commit-39cdc99",
   "description": "",
   "main": "./index.js",
   "typings": "./index.d.ts",
@@ -57,5 +57,5 @@
     "displayName": "SDK",
     "tsconfig": "./tsconfig.json"
   },
-  "commit": "4aad23359bad8cca4eebdf0c1a236a725d82b32d"
+  "commit": "39cdc99ea857c63f707ec9188836116d838fa10e"
 }

package/dist/playground/snippets/ui-backgrounds.tsx

@@ -1,11 +1,6 @@
 import { engine } from '@dcl/sdk/ecs'
 import { Color4 } from '@dcl/sdk/math'
-import ReactEcs, {
-  UiEntity,
-  Label,
-  ReactEcsRenderer,
-  Dropdown
-} from '@dcl/sdk/react-ecs'
+import ReactEcs, { UiEntity, Label, ReactEcsRenderer, Dropdown } from '@dcl/sdk/react-ecs'
 
 type GenesisPlazaContent = string
 const src: GenesisPlazaContent = 'images/rounded_alpha_square.png'
@@ -21,11 +16,7 @@ engine.addSystem((t) => {
 let currentValue = 0
 const options = [
   function StretchAndTint() {
-    const tint2 = Color4.lerp(
-      Color4.Red(),
-      Color4.Blue(),
-      1 + Math.sin(dt + Math.cos(dt * 0.3)) * 0.5
-    )
+    const tint2 = Color4.lerp(Color4.Red(), Color4.Blue(), 1 + Math.sin(dt + Math.cos(dt * 0.3)) * 0.5)
     return (
       <UiEntity
         uiTransform={{
@@ -45,11 +36,7 @@ const options = [
     )
   },
   function NineSlicesAndTint() {
-    const tint = Color4.lerp(
-      Color4.Red(),
-      Color4.Blue(),
-      1 + Math.sin(dt + Math.cos(dt * 0.3)) * 0.5
-    )
+    const tint = Color4.lerp(Color4.Red(), Color4.Blue(), 1 + Math.sin(dt + Math.cos(dt * 0.3)) * 0.5)
     return (
       <UiEntity
         uiTransform={{
@@ -64,11 +51,7 @@ const options = [
           }
         }}
       >
-        <Label
-          value="NINE_SLICES + TINT"
-          color={Color4.Black()}
-          fontSize={29}
-        />
+        <Label value="NINE_SLICES + TINT" color={Color4.Black()} fontSize={29} />
       </UiEntity>
     )
   },
@@ -119,11 +102,7 @@ const options = [
           }
         }}
       >
-        <Label
-          value={`NINE_SLICES (with margins ${margin.toFixed(2)})`}
-          color={Color4.Red()}
-          fontSize={29}
-        />
+        <Label value={`NINE_SLICES (with margins ${margin.toFixed(2)})`} color={Color4.Red()} fontSize={29} />
       </UiEntity>
     )
   },

package/dist/playground/snippets/ui.tsx

@@ -32,11 +32,7 @@ export const uiComponent = () => (
         display: 'flex'
       }}
     >
-      <Label
-        value="SDK 7"
-        fontSize={80}
-        uiBackground={{ color: Color4.fromHexString('#fbf0f0') }}
-      />
+      <Label value="SDK 7" fontSize={80} uiBackground={{ color: Color4.fromHexString('#fbf0f0') }} />
     </UiEntity>
     <UiEntity
       uiTransform={{
@@ -47,11 +43,7 @@ export const uiComponent = () => (
         display: 'flex'
       }}
     >
-      <Label
-        value={`Counter: ${counter}`}
-        fontSize={60}
-        uiBackground={{ color: Color4.fromHexString('#fbf0f0') }}
-      />
+      <Label value={`Counter: ${counter}`} fontSize={60} uiBackground={{ color: Color4.fromHexString('#fbf0f0') }} />
     </UiEntity>
     <UiEntity
       uiTransform={{
@@ -106,10 +98,7 @@ function createCube(x: number, y: number, z: number, spawner = true): Entity {
 
 // Systems
 function circularSystem(dt: number) {
-  const entitiesWithMeshRenderer = engine.getEntitiesWith(
-    MeshRenderer,
-    Transform
-  )
+  const entitiesWithMeshRenderer = engine.getEntitiesWith(MeshRenderer, Transform)
   for (const [entity, _meshRenderer, _transform] of entitiesWithMeshRenderer) {
     const mutableTransform = Transform.getMutable(entity)
 
@@ -123,13 +112,7 @@ function circularSystem(dt: number) {
 function spawnerSystem() {
   const clickedCubes = engine.getEntitiesWith(PointerEvents)
   for (const [entity] of clickedCubes) {
-    if (
-      inputSystem.isTriggered(
-        InputAction.IA_PRIMARY,
-        PointerEventType.PET_DOWN,
-        entity
-      )
-    ) {
+    if (inputSystem.isTriggered(InputAction.IA_PRIMARY, PointerEventType.PET_DOWN, entity)) {
       counter++
     }
   }

package/dist/playground-assets.d.ts

@@ -3767,6 +3767,20 @@ export declare interface Position {
     left: PositionUnit;
 }
 
+/**
+ * The values are in clockwise order, beginning at the top: top, right, bottom, then left
+
+ * When one value is specified, it applies the same margin to all four sides.
+ *
+ * When two values are specified, the first margin applies to the top and bottom, the second to the left and right.
+ *
+ * When three values are specified, the first margin applies to the top, the second to the left and right, the third to the bottom.
+ *
+ When four values are specified, the margins apply to the top, right, bottom, and left in that order (clockwise).
+ * @public
+ */
+export declare type PositionShorthand = PositionUnit | `${PositionUnit} ${PositionUnit}` | `${PositionUnit} ${PositionUnit} ${PositionUnit}` | `${PositionUnit} ${PositionUnit} ${PositionUnit} ${PositionUnit}`;
+
 /**
  * @public
  * The position property specifies the type of positioning method used for an element
@@ -3774,11 +3788,10 @@ export declare interface Position {
 export declare type PositionType = 'absolute' | 'relative';
 
 /**
- * Position unit for the user.
- * i.e. width="100", width="100%", width="100px"
+ * unit value specified. i.e. 1 || '100%' || '1px'
  * @public
  */
-export declare type PositionUnit = `${number}px` | `${number}%` | number;
+export declare type PositionUnit = `${number}px` | `${number}%` | number | `${number}`;
 
 export declare enum ProcessMessageResultType {
     /**
@@ -4725,7 +4738,9 @@ export declare const UiDropdownResult: ComponentDefinition<PBUiDropdownResult>;
  * @public
  * @category Component
  */
-export declare function UiEntity(props: EntityPropTypes): ReactEcs.JSX.Element;
+export declare function UiEntity(props: EntityPropTypes & {
+    uiText?: UiLabelProps;
+}): ReactEcs.JSX.Element;
 
 /**
  * @public
@@ -4808,11 +4823,11 @@ export declare interface UiTransformProps {
     /** The flex-direction property sets how flex items are placed in the flex container defining the main axis and the direction (normal or reversed). */
     flexDirection?: FlexDirectionType;
     /** The position property sets how an element is positioned in a document. The top, right, bottom, and left properties determine the final location of positioned elements. */
-    position?: Partial<Position>;
+    position?: Partial<Position> | PositionShorthand;
     /** The padding shorthand property sets the padding area on all four sides of an element at once. */
-    padding?: Partial<Position>;
+    padding?: Partial<Position> | PositionShorthand;
     /** The margin shorthand property sets the margin area on all four sides of an element. */
-    margin?: Partial<Position>;
+    margin?: Partial<Position> | PositionShorthand;
     /** The width property specifies the width of an element. */
     width?: PositionUnit;
     /** The height property specifies the height of an element. */

package/etc/playground-assets.api.json

@@ -35656,6 +35656,118 @@
           ],
           "extendsTokenRanges": []
         },
+        {
+          "kind": "TypeAlias",
+          "canonicalReference": "@dcl/playground-assets!PositionShorthand:type",
+          "docComment": "/**\n * The values are in clockwise order, beginning at the top: top, right, bottom, then left\n *\n * When one value is specified, it applies the same margin to all four sides.\n *\n * When two values are specified, the first margin applies to the top and bottom, the second to the left and right.\n *\n * When three values are specified, the first margin applies to the top, the second to the left and right, the third to the bottom.\n *\n * When four values are specified, the margins apply to the top, right, bottom, and left in that order (clockwise).\n *\n * @public\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "export type PositionShorthand = "
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": " | `${"
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": "} ${"
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": "}` | `${"
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": "} ${"
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": "} ${"
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": "}` | `${"
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": "} ${"
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": "} ${"
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": "} ${"
+            },
+            {
+              "kind": "Reference",
+              "text": "PositionUnit",
+              "canonicalReference": "@dcl/playground-assets!PositionUnit:type"
+            },
+            {
+              "kind": "Content",
+              "text": "}`"
+            },
+            {
+              "kind": "Content",
+              "text": ";"
+            }
+          ],
+          "fileUrlPath": "../react-ecs/dist/components/uiTransform/types.d.ts",
+          "releaseTag": "Public",
+          "name": "PositionShorthand",
+          "typeTokenRange": {
+            "startIndex": 1,
+            "endIndex": 21
+          }
+        },
         {
           "kind": "TypeAlias",
           "canonicalReference": "@dcl/playground-assets!PositionType:type",
@@ -35685,7 +35797,7 @@
         {
           "kind": "TypeAlias",
           "canonicalReference": "@dcl/playground-assets!PositionUnit:type",
-          "docComment": "/**\n * Position unit for the user. i.e. width=\"100\", width=\"100%\", width=\"100px\"\n *\n * @public\n */\n",
+          "docComment": "/**\n * unit value specified. i.e. 1 || '100%' || '1px'\n *\n * @public\n */\n",
           "excerptTokens": [
             {
               "kind": "Content",
@@ -35693,7 +35805,7 @@
             },
             {
               "kind": "Content",
-              "text": "`${number}px` | `${number}%` | number"
+              "text": "`${number}px` | `${number}%` | number | `${number}`"
             },
             {
               "kind": "Content",
@@ -43126,6 +43238,19 @@
               "text": "EntityPropTypes",
               "canonicalReference": "@dcl/playground-assets!EntityPropTypes:interface"
             },
+            {
+              "kind": "Content",
+              "text": " & {\n    uiText?: "
+            },
+            {
+              "kind": "Reference",
+              "text": "UiLabelProps",
+              "canonicalReference": "@dcl/playground-assets!UiLabelProps:interface"
+            },
+            {
+              "kind": "Content",
+              "text": ";\n}"
+            },
             {
               "kind": "Content",
               "text": "): "
@@ -43142,8 +43267,8 @@
           ],
           "fileUrlPath": "../react-ecs/dist/components/index.d.ts",
           "returnTypeTokenRange": {
-            "startIndex": 3,
-            "endIndex": 4
+            "startIndex": 6,
+            "endIndex": 7
           },
           "releaseTag": "Public",
           "overloadIndex": 1,
@@ -43152,7 +43277,7 @@
               "parameterName": "props",
               "parameterTypeTokenRange": {
                 "startIndex": 1,
-                "endIndex": 2
+                "endIndex": 5
               },
               "isOptional": false
             }
@@ -44089,7 +44214,12 @@
                 },
                 {
                   "kind": "Content",
-                  "text": ">"
+                  "text": "> | "
+                },
+                {
+                  "kind": "Reference",
+                  "text": "PositionShorthand",
+                  "canonicalReference": "@dcl/playground-assets!PositionShorthand:type"
                 },
                 {
                   "kind": "Content",
@@ -44102,7 +44232,7 @@
               "name": "margin",
               "propertyTypeTokenRange": {
                 "startIndex": 1,
-                "endIndex": 5
+                "endIndex": 6
               }
             },
             {
@@ -44270,7 +44400,12 @@
                 },
                 {
                   "kind": "Content",
-                  "text": ">"
+                  "text": "> | "
+                },
+                {
+                  "kind": "Reference",
+                  "text": "PositionShorthand",
+                  "canonicalReference": "@dcl/playground-assets!PositionShorthand:type"
                 },
                 {
                   "kind": "Content",
@@ -44283,7 +44418,7 @@
               "name": "padding",
               "propertyTypeTokenRange": {
                 "startIndex": 1,
-                "endIndex": 5
+                "endIndex": 6
               }
             },
             {
@@ -44311,7 +44446,12 @@
                 },
                 {
                   "kind": "Content",
-                  "text": ">"
+                  "text": "> | "
+                },
+                {
+                  "kind": "Reference",
+                  "text": "PositionShorthand",
+                  "canonicalReference": "@dcl/playground-assets!PositionShorthand:type"
                 },
                 {
                   "kind": "Content",
@@ -44324,7 +44464,7 @@
               "name": "position",
               "propertyTypeTokenRange": {
                 "startIndex": 1,
-                "endIndex": 5
+                "endIndex": 6
               }
             },
             {

package/etc/playground-assets.api.md

@@ -2097,11 +2097,14 @@ export interface Position {
     top: PositionUnit;
 }
 
+// @public
+export type PositionShorthand = PositionUnit | `${PositionUnit} ${PositionUnit}` | `${PositionUnit} ${PositionUnit} ${PositionUnit}` | `${PositionUnit} ${PositionUnit} ${PositionUnit} ${PositionUnit}`;
+
 // @public
 export type PositionType = 'absolute' | 'relative';
 
 // @public
-export type PositionUnit = `${number}px` | `${number}%` | number;
+export type PositionUnit = `${number}px` | `${number}%` | number | `${number}`;
 
 // Warning: (ae-missing-release-tag) "ProcessMessageResultType" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal)
 //
@@ -2595,7 +2598,9 @@ export const UiDropdownResult: ComponentDefinition<PBUiDropdownResult>;
 // Warning: (tsdoc-undefined-tag) The TSDoc tag "@category" is not defined in this configuration
 //
 // @public
-export function UiEntity(props: EntityPropTypes): ReactEcs.JSX.Element;
+export function UiEntity(props: EntityPropTypes & {
+    uiText?: UiLabelProps;
+}): ReactEcs.JSX.Element;
 
 // @public (undocumented)
 export type UiFontType = 'sans-serif' | 'serif' | 'monospace';
@@ -2654,14 +2659,14 @@ export interface UiTransformProps {
     flexWrap?: FlexWrapType;
     height?: PositionUnit;
     justifyContent?: JustifyType;
-    margin?: Partial<Position>;
+    margin?: Partial<Position> | PositionShorthand;
     maxHeight?: PositionUnit;
     maxWidth?: PositionUnit;
     minHeight?: PositionUnit;
     minWidth?: PositionUnit;
     overflow?: OverflowType;
-    padding?: Partial<Position>;
-    position?: Partial<Position>;
+    padding?: Partial<Position> | PositionShorthand;
+    position?: Partial<Position> | PositionShorthand;
     positionType?: PositionType;
     width?: PositionUnit;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dcl/playground-assets",
-  "version": "7.0.6-4153633895.commit-4aad233",
+  "version": "7.0.6-4177592674.commit-39cdc99",
   "description": "",
   "main": "./dist/index.js",
   "typings": "./dist/index.d.ts",
@@ -17,12 +17,12 @@
   "author": "Decentraland",
   "license": "Apache-2.0",
   "dependencies": {
-    "@dcl/sdk": "7.0.6-4153633895.commit-4aad233"
+    "@dcl/sdk": "7.0.6-4177592674.commit-39cdc99"
   },
   "minCliVersion": "3.12.3",
   "files": [
     "dist",
     "etc"
   ],
-  "commit": "4aad23359bad8cca4eebdf0c1a236a725d82b32d"
+  "commit": "39cdc99ea857c63f707ec9188836116d838fa10e"
 }