Skip to content

Commit

Permalink
Update PropertySupport component and some examples
Browse files Browse the repository at this point in the history
  • Loading branch information
DervexDev committed Aug 8, 2024
1 parent 0928f79 commit efc6226
Show file tree
Hide file tree
Showing 7 changed files with 182 additions and 91 deletions.
5 changes: 3 additions & 2 deletions api/file-types.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ sidebar_position: 2
title: File Types
---

import TypeSupport from "@site/src/components/TypeSupport"
import PropertySupport from "@site/src/components/PropertySupport"

Argon supports various file types, here is how they are transformed into Roblox instances!

Expand All @@ -20,6 +20,7 @@ Argon supports various file types, here is how they are transformed into Roblox
| [JSON Model](#json-model) | `*.model.json` |
| [JSON Module](#json-module) | `*.json` |
| [TOML Module](#toml-module) | `*.toml` |
| [YAML Module](#yaml-module) | `*.yaml` / `*.yml` |
| [MessagePack Module](#messagepack-module) | `*.msgpack` |
| [Plain Text](#plain-text) | `*.txt` |
| [Localization Table](#localization-table) | `*.csv` |
Expand Down Expand Up @@ -181,7 +182,7 @@ Both binary (`rbxm`) and XML (`rbxmx`) models generated by Roblox Studio and oth
<details>
<summary>Property type support chart</summary>
<TypeSupport />
<PropertySupport />
</details>
## JSON Model
Expand Down
82 changes: 20 additions & 62 deletions api/properties.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -3,50 +3,13 @@ title: Properties
sidebar_position: 3
---

import PropertySupport from "@site/src/components/PropertySupport"

Argon supports most Roblox properties, here you can learn their syntax when written in project and data files!

## Property Type Support Chart

| Property Type | Example Property | Build | Live Sync | Properties |
| --------------------------------------------------- | ------------------------------- | ----- | --------- | ---------- |
| [Attributes](#attributes) | `Instance.Attributes` ||||
| [Axes](#axes) | `ArcHandles.Axes` ||||
| [BinaryString](#binarystring) | `BinaryStringValue.Value` ||||
| [Bool](#bool) | `Part.Anchored` ||||
| [BrickColor](#brickcolor) | `Part.BrickColor` ||||
| [CFrame](#cframe) | `Part.CFrame` ||||
| [Color3](#color3) | `Lighting.Ambient` ||||
| [Color3uint8](#color3uint8) | `Part.BrickColor` ||||
| [ColorSequence](#colorsequence) | `Beam.Color` ||||
| [Content](#content) | `Decal.Texture` ||||
| [Enum](#enum) | `Part.Shape` ||||
| [Faces](#faces) | `Handles.Faces` ||||
| [Float32](#float32) | `Players.RespawnTime` ||||
| [Float64](#float64) | `Sound.PlaybackLoudness` ||||
| [Font](#font) | `TextLabel.FontFace` ||||
| [Int32](#int32) | `Frame.ZIndex` ||||
| [Int64](#int64) | `Player.UserId` ||||
| [NumberRange](#numberrange) | `ParticleEmitter.Lifetime` ||||
| [NumberSequence](#numbersequence) | `Beam.Transparency` ||||
| [OptionalCoordinateFrame](#optionalcoordinateframe) | `Model.WorldPivotData` ||||
| [PhysicalProperties](#physicalproperties) | `Part.CustomPhysicalProperties` ||||
| [ProtectedString](#protectedstring) | `ModuleScript.Source` ||||
| [Ray](#ray) | `RayValue.Value` ||||
| [Rect](#rect) | `ImageButton.SliceCenter` ||||
| [Ref](#ref) | `Model.PrimaryPart` ||||
| [Region3](#region3) | `N/A` ||||
| [Region3int16](#region3int16) | `Terrain.MaxExtents` ||||
| [SharedString](#sharedstring) | `N/A` ||||
| [String](#string) | `Instance.Name` ||||
| [Tags](#tags) | `Instance.Tags` ||||
| [UDim](#udim) | `UIListLayout.Padding` ||||
| [UDim2](#udim2) | `Frame.Size` ||||
| [Vector2](#vector2) | `ImageLabel.ImageRectSize` ||||
| [Vector2int16](#vector2int16) | `N/A` ||||
| [Vector3](#vector3) | `Part.Size` ||||
| [Vector3int16](#vector3int16) | `TerrainRegion.ExtentsMax` ||||
| QDir | `Studio.Auto-Save Path` ||||
| QFont | `Studio.Font` ||||
<PropertySupport withLinks={true} />

## Implicit vs Explicit Format

Expand Down Expand Up @@ -135,12 +98,13 @@ For both implicit and explicit values, the format is a **boolean** value.

## BrickColor

For both implicit and explicit values, the format is a **string** respresting the [Name](https://developer.roblox.com/en-us/articles/BrickColor-Codes) or an **integer** representing the [Number](https://developer.roblox.com/en-us/articles/BrickColor-Codes) of a BrickColor.
For both implicit and explicit values, the format is an **integer** representing the [Number](https://developer.roblox.com/en-us/articles/BrickColor-Codes) of a BrickColor. Aditionally for implicit values, the format is a **string** respresting the [Name](https://developer.roblox.com/en-us/articles/BrickColor-Codes) of a BrickColor.

```json
{
"$properties": {
"Implicit": "Electric blue",
"Implicit1": "Electric blue",
"Implicit2": 1032,
"Explicit": { "BrickColor": 1032 }
}
}
Expand Down Expand Up @@ -373,7 +337,7 @@ For implicit values, the format is a flat list of NumberSequenceKeypoints. For e
}
```

## OptionalCoordinateFrame
## OptionalCFrame

For implicit values, the format is a flat list of components. For explicit values, the format is an object with `position` and `orientation` fields. The `position` field is a [Vector3](#vector3).

Expand Down Expand Up @@ -439,41 +403,35 @@ For both implicit and explicit values, the format is a **string**.

## Ray

For both implicit and explicit values, the format is an object with `origin` and `direction` fields. Each field is a [Vector3](#vector3).
For both implicit and explicit values, the format is a list of `origin` and `direction` components. Each component is a [Vector3](#vector3).

```json
{
"$properties": {
"Implicit": {
"origin": [1, 2, 3],
"direction": [4, 5, 6]
},
"Implicit": [
[1, 2, 3],
[4, 5, 6]
],
"Explicit": {
"Ray": {
"origin": [1.0, 2.0, 3.0],
"direction": [4.0, 5.0, 6.0]
}
"Ray": [
[1.0, 2.0, 3.0],
[4.0, 5.0, 6.0]
]
}
}
}
```

## Rect

For both implicit and explicit values, the format is a list of `Min` and `Max` components, respectively. Each component is a [Vector2](#vector2).
For both implicit and explicit values, the format is a list of all components. Each component is a **float**.

```json
{
"$properties": {
"Explicit": [
[0.0, 5.0],
[10.0, 15.0]
],
"Explicit": [0.0, 5.0, 10.0, 15.0],
"Explicit": {
"Rect": [
[0, 5],
[10, 15]
]
"Rect": [0, 5, 10, 15]
}
}
}
Expand Down Expand Up @@ -613,7 +571,7 @@ For both implicit and explicit values, the format is a list of `X` and `Y` compo

## Vector2int16

For both implicit and explicit values, the format is a list of X and Y components, respectively. Each component is an **integer**.
For both implicit and explicit values, the format is a list of `X` and `Y` components, respectively. Each component is an **integer**.

```json
{
Expand Down
75 changes: 75 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@
"@docusaurus/tsconfig": "^3.4.0",
"@docusaurus/types": "^3.4.0",
"prettier": "^3.3.3",
"raw-loader": "^4.0.2",
"typescript": "~5.5.4"
},
"browserslist": {
Expand Down
44 changes: 44 additions & 0 deletions src/components/PropertyCoverage.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
| Property Type | Example Property | CLI | Plugin | XML | Binary |
| ----------------------------------------- | ------------------------------- | --- | ------ | --- | ------ |
| [Attributes](#attributes) | `Instance.Attributes` |||||
| [Axes](#axes) | `ArcHandles.Axes` |||||
| [BinaryString](#binarystring) | `Terrain.MaterialColors` || ⏺️ |||
| [Bool](#bool) | `Part.Anchored` |||||
| [BrickColor](#brickcolor) | `Part.BrickColor` |||||
| Bytecode | `N/A` |||||
| [CFrame](#cframe) | `Camera.CFrame` |||||
| [Color3](#color3) | `Lighting.Ambient` |||||
| [Color3uint8](#color3uint8) | `Part.BrickColor` |||||
| [ColorSequence](#colorsequence) | `Beam.Color` |||||
| [Content](#content) | `Decal.Texture` |||||
| [Enum](#enum) | `Part.Shape` |||||
| [Faces](#faces) | `Handles.Faces` |||||
| [Float32](#float32) | `Players.RespawnTime` |||||
| [Float64](#float64) | `Sound.PlaybackLoudness` |||||
| [Font](#font) | `TextLabel.Font` |||||
| [Int32](#int32) | `Frame.ZIndex` |||||
| [Int64](#int64) | `Player.UserId` |||||
| [NumberRange](#numberrange) | `ParticleEmitter.Lifetime` |||||
| [NumberSequence](#numbersequence) | `Beam.Transparency` |||||
| [OptionalCFrame](#optionalcframe) | `Model.WorldPivotData` |||||
| [PhysicalProperties](#physicalproperties) | `Part.CustomPhysicalProperties` |||||
| [ProtectedString](#protectedstring) | `ModuleScript.Source` |||||
| [Ray](#ray) | `RayValue.Value` |||||
| [Rect](#rect) | `ImageButton.SliceCenter` |||||
| [Ref](#ref) | `Model.PrimaryPart` |||||
| [Region3](#region3) | `N/A` |||||
| [Region3int16](#region3int16) | `Terrain.MaxExtents` |||||
| SecurityCapabilities | `Folder.SecurityCapabilities` |||||
| [SharedString](#sharedstring) | `N/A` |||||
| [String](#string) | `Instance.Name` |||||
| [Tags](#tags) | `UIListLayout.Padding` |||||
| [UDim](#udim) | `Frame.Size` |||||
| [UDim2](#udim2) | `Instance.UniqueId` |||||
| [Vector2](#vector2) | `ImageLabel.ImageRectSize` |||||
| [Vector2int16](#vector2int16) | `N/A` |||||
| [Vector3](#vector3) | `Part.Size` |||||
| [Vector3int16](#vector3int16) | `TerrainRegion.ExtentsMax` |||||
| QDir | `Studio.Auto-Save Path` |||||
| QFont | `Studio.Font` |||||

✅ Implemented | ❌ Unimplemented | ⏺️ Partially Implemented | ⛔ Never
39 changes: 39 additions & 0 deletions src/components/PropertySupport.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import { useState } from "react"
import Markdown from "react-markdown"
import remarkGfm from "remark-gfm"

const coverage: string = require("!!raw-loader!./PropertyCoverage.md")?.default

export default function PropertySupport({ withLinks }: { withLinks: boolean }) {
const [state, setState] = useState(coverage)

fetch("https://raw.githubusercontent.com/argon-rbx/rbx-dom/master/README.md")
.then((response) => response.text())
.then((text) => {
text = text.substring(text.indexOf("Coverage") + 10)
text = text.substring(0, text.indexOf("##") - 2)

text = text.replace("rbx_types", "CLI")
text = text.replace("rbx_dom_lua", "Plugin")
text = text.replace("rbx_xml", "XML")
text = text.replace("rbx_binary", "Binary")

if (withLinks) {
for (const line of text.split("\n")) {
let property = line.substring(line.indexOf("| ") + 2)
property = property.substring(0, property.indexOf(" |"))
property = property.trimEnd()

let link = `| [${property}](#${property.toLocaleLowerCase()})`

if (coverage.includes(link)) {
text = text.replace("| " + property, link)
}
}
}

setState(text)
})

return <Markdown remarkPlugins={[remarkGfm]}>{state}</Markdown>
}
27 changes: 0 additions & 27 deletions src/components/TypeSupport.tsx

This file was deleted.

0 comments on commit efc6226

Please sign in to comment.