@maccesar/titools 2.2.11 → 2.3.0

package/skills/alloy-guides/references/VIEWS_STYLES.md

@@ -18,9 +18,8 @@ You can use the following values and operators in your TSS file:
 * Bitwise operators: `>>`, `<<`, `>>>`, `&`, `|`, `^` (since Alloy 1.3.0)
 * Single (`//comment`) and multiline comments (`/* comment */`)
 
-::: warning ⚠️ Warning
-Alloy does not support the CSS concept of child or descendent selectors.
-:::
+> **⚠️ ⚠️ Warning**
+> Alloy does not support the CSS concept of child or descendent selectors.
 
 **app/styles/index.tss**
 
@@ -120,39 +119,38 @@ Style priority (lowest to highest): Global Style File → Global Style File in T
 
 ## Platform-Specific Styles
 
-:::danger CRITICAL: Platform-Specific Properties Require Modifiers
-**Using `Ti.UI.iOS.*` or `Ti.UI.Android.*` properties in TSS WITHOUT platform modifiers will:**
-
-1. **Add iOS code to Android builds** → compilation failures
-2. **Add Android code to iOS builds** → compilation failures
-
-**Example of the damage:**
-```tss
-// ❌ WRONG - Adds Ti.UI.iOS to Android project
-"#mainWindow": {
-  statusBarStyle: Ti.UI.iOS.StatusBar.LIGHT_CONTENT  // FAILS on Android!
-}
-```
-
-**CORRECT - Always use platform modifiers:**
-```tss
-// ✅ CORRECT - Only adds to iOS
-"#mainWindow[platform=ios]": {
-  statusBarStyle: Ti.UI.iOS.StatusBar.LIGHT_CONTENT
-}
-
-// ✅ CORRECT - Only adds to Android
-"#mainWindow[platform=android]": {
-  actionBar: {
-    displayHomeAsUp: true
-  }
-}
-```
-
-**Common platform-specific properties that REQUIRE `[platform=...]` modifiers:**
-- iOS: `statusBarStyle`, `modalStyle`, `modalTransitionStyle`, any `Ti.UI.iOS.*`
-- Android: `actionBar` config, any `Ti.Android.*` constant
-:::
+> **🚨 CRITICAL: Platform-Specific Properties Require Modifiers**
+> **Using `Ti.UI.iOS.*` or `Ti.UI.Android.*` properties in TSS WITHOUT platform modifiers will:**
+>
+> 1. **Add iOS code to Android builds** → compilation failures
+> 2. **Add Android code to iOS builds** → compilation failures
+>
+> **Example of the damage:**
+> ```tss
+> // ❌ WRONG - Adds Ti.UI.iOS to Android project
+> "#mainWindow": {
+>   statusBarStyle: Ti.UI.iOS.StatusBar.LIGHT_CONTENT  // FAILS on Android!
+> }
+> ```
+>
+> **CORRECT - Always use platform modifiers:**
+> ```tss
+> // ✅ CORRECT - Only adds to iOS
+> "#mainWindow[platform=ios]": {
+>   statusBarStyle: Ti.UI.iOS.StatusBar.LIGHT_CONTENT
+> }
+>
+> // ✅ CORRECT - Only adds to Android
+> "#mainWindow[platform=android]": {
+>   actionBar: {
+>     displayHomeAsUp: true
+>   }
+> }
+> ```
+>
+> **Common platform-specific properties that REQUIRE `[platform=...]` modifiers:**
+> - iOS: `statusBarStyle`, `modalStyle`, `modalTransitionStyle`, any `Ti.UI.iOS.*`
+> - Android: `actionBar` config, any `Ti.Android.*` constant
 
 As with views, separate styles may be defined based on the platform and device size.
 
@@ -331,16 +329,16 @@ Themes provide a way to overwrite or modify files for a specific brand of your a
 
 To create a theme, create a folder called `themes` in your Alloy `app` directory. In the `themes` folder, create a folder for your theme.
 
-| Folder or Filename | Merges or Overwrites             | Supported Since         |
-| ------------------ | -------------------------------- | ----------------------- |
-| config.json        | merges                           | Alloy 1.4.0             |
-| i18n               | merges folders and files         | Alloy 1.4.0             |
-| assets             | merges folders, overwrites files | Alloy 1.4.0             |
-| lib                | merges folders, overwrites files | Alloy 1.7.6 / CLI 5.0.0 |
-| platform           | merges folders, overwrites files | Alloy 1.7.6 / CLI 5.0.0 |
-| styles             | merges folders and files         | Alloy 1.4.0             |
-| widgets/\*/assets  | merges folders, overwrites files | Alloy 1.4.0             |
-| widgets/\*/styles  | merges folders and files         | Alloy 1.4.0             |
+| Folder or Filename | Supported Since         | Merges or Overwrites             |
+| ------------------ | ----------------------- | -------------------------------- |
+| config.json        | Alloy 1.4.0             | merges                           |
+| i18n               | Alloy 1.7.6 / CLI 5.0.0 | merges folders and files         |
+| assets             |                         | merges folders, overwrites files |
+| lib                | Alloy 1.7.6 / CLI 5.0.0 | merges folders, overwrites files |
+| platform           | Alloy 1.7.6 / CLI 5.0.0 | merges folders, overwrites files |
+| styles             |                         | merges folders and files         |
+| widgets/\*/assets  | Alloy 1.4.0             | merges folders, overwrites files |
+| widgets/\*/styles  | Alloy 1.4.0             | merges folders and files         |
 
 To use a theme, add it to your `config.json`:
 

package/skills/alloy-guides/references/VIEWS_WITHOUT_CONTROLLERS.md

@@ -45,11 +45,10 @@ Then, the controller can use `$.button1`, `$.button2` and `$.button3` to access
 3. Use the `getView()` method to retrieve the view.
 4. Use the `add()` method to add the view to a parent component.
 
-::: warning ⚠️ Warning
-Unlike other style dictionaries in Alloy, when using the `updateViews()` method, you can only apply styles using IDs. Class and view component styles do not work with this method.
-
-Using the `Require` or `Widget` elements to include external views in the controller-less view does not work with this procedure — you can include the external views, but the styles cannot be updated with the `updateViews` method.
-:::
+> **⚠️ ⚠️ Warning**
+> Unlike other style dictionaries in Alloy, when using the `updateViews()` method, you can only apply styles using IDs. Class and view component styles do not work with this method.
+>
+> Using the `Require` or `Widget` elements to include external views in the controller-less view does not work with this procedure — you can include the external views, but the styles cannot be updated with the `updateViews` method.
 
 For example:
 

package/skills/alloy-guides/references/VIEWS_XML.md

@@ -24,18 +24,18 @@ If the top-level UI component does not have an ID defined, it can be referenced
 
 The following table lists the attributes for the UI components:
 
-| Attribute      | Description                                                                                        |
-| -------------- | -------------------------------------------------------------------------------------------------- |
+| Attribute      | Description                                                                                                                                                                                                  |
+| -------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
 | `id`           | Identifies UI elements in the controller (prefixed with `$.`) and style sheet (prefixed with `#`). IDs should be unique per view but are not global, so multiple views can have components with the same ID. |
-| `class`        | Applies additional styles (prefixed with `.` in the TSS file). Overwrites the element style but not the id style. |
-| `autoStyle`    | Enables the autostyle feature for dynamic styling.                                                 |
-| `formFactor`   | Acts as a compiler directive for size-specific view components (`handheld` or `tablet`).           |
-| `if`           | Use a custom query to apply additional styles to the element.                                      |
-| `module`       | Requires in a CommonJS module.                                                                     |
-| `ns`           | Overrides the default `Titanium.UI` namespace.                                                     |
-| `platform`     | Switches the namespace based on the platform.                                                      |
-| `<properties>` | Assigns values to UI object properties.                                                            |
-| `<events>`     | Assigns callbacks to UI object events.                                                             |
+| `class`        | Applies additional styles (prefixed with `.` in the TSS file). Overwrites the element style but not the id style.                                                                                            |
+| `autoStyle`    | Enables the autostyle feature for dynamic styling.                                                                                                                                                           |
+| `formFactor`   | Acts as a compiler directive for size-specific view components (`handheld` or `tablet`).                                                                                                                     |
+| `if`           | Use a custom query to apply additional styles to the element.                                                                                                                                                |
+| `module`       | Requires in a CommonJS module.                                                                                                                                                                               |
+| `ns`           | Overrides the default `Titanium.UI` namespace.                                                                                                                                                               |
+| `platform`     | Switches the namespace based on the platform.                                                                                                                                                                |
+| `<properties>` | Assigns values to UI object properties.                                                                                                                                                                      |
+| `<events>`     | Assigns callbacks to UI object events.                                                                                                                                                                       |
 
 The following table lists the special XML elements besides the Titanium UI components:
 
@@ -55,9 +55,10 @@ The following table lists the special XML elements besides the Titanium UI compo
 * `Ti.UI.NavigationWindow` or `<NavigationWindow>`
 * `Ti.UI.iOS.SplitWindow` or `<SplitWindow>`
 
-::: warning
-With the release of CLI 7.1.0, you can use platform as a prefix in the XML. For example: `<Label ios:text="Hello iOS!" android:text="Hello Android!" />`
-:::
+Other views do not have any format restrictions.
+
+> **⚠️ WARNING**
+> With the release of CLI 7.1.0, you can use platform as a prefix in the XML. For example: `<Label ios:text="Hello iOS!" android:text="Hello Android!" />`
 
 ## Collection Element
 
@@ -228,9 +229,33 @@ Within a view in the regular Alloy project space (`app/views`), use the `<Widget
 
 **To import a widget:**
 
-1. Copy the widget to the `app/widgets` folder.
-2. Add the `<Widget>` tag in the XML and specify its `src` attribute as the folder name of the widget. Use the `name` attribute to import a specific view-controller instead of the default `widget.xml`/`widget.js`.
-3. Update the `dependencies` object in the `config.json` file.
+1. Copy the widget to the `app/widgets` folder. The widget must be contained within its own folder.
+2. Add the `<Widget>` tag in the XML and specify its `src` attribute as the folder name of the widget.
+3. Update the `dependencies` object in the `config.json` file by adding a key/value pair with the name of the widget as the key and the version number as the value.
+
+You can optionally add the `id` and `name` attributes to the `Widget` element:
+- The `id` attribute allows you to reference the widget in the controller code.
+- The `name` attribute allows you to import a specific view-controller in the widget rather than the default one (`widget.xml`/`widget.js`). Specify the name of the view-controller minus the extension.
+
+For example, to import the `mywidget` widget, copy it to `app/widgets`:
+
+```
+app
+├── config.json
+├── controllers
+│   └── index.js
+├── views
+│   └── index.xml
+└── widgets
+    └── mywidget
+        ├── controllers
+        │   ├── foo.js
+        │   └── widget.js
+        ├── views
+        │   ├── foo.xml
+        │   └── widget.xml
+        └── widget.json
+```
 
 **app/views/index.xml**
 
@@ -249,6 +274,15 @@ $.index.open();
 $.foo.myMethod();
 ```
 
+Update the `dependencies` object in `config.json`:
+
+```
+...
+    "dependencies": {
+        "mywidget":"1.0"
+    }
+```
+
 ### Passing Arguments
 
 You can add any custom attributes to the markup to initialize a widget or controller.

package/skills/alloy-guides/references/WIDGETS.md

@@ -141,7 +141,7 @@ Specifying the `id` attribute in the XML markup components will make it easier t
 Ti.API.info("button state: " + $.foo.button.enabled);
 ```
 
-For widgets that have multiple view-controllers, to include a widget's view-controller in another widget's view, use the `Widget` tag and assign the `name` attribute with the name of the view-controller minus the file extension. Since Alloy 1.5.0, if you omit the `src` attribute, Alloy assumes you are referencing the current widget.
+For widgets that have multiple view-controllers, to include a widget's view-controller in another widget's view, use the `Widget` tag and assign the `name` attribute with the name of the view-controller minus the file extension. Since Alloy 1.5.0, if you omit the `src` attribute, Alloy assumes you are referencing the current widget. For Alloy 1.4.x and prior, you need to assign the `src` attribute to the widget's name.
 
 **app/widgets/foo/views/widget.xml**
 

package/skills/alloy-howtos/SKILL.md

@@ -11,19 +11,18 @@ Practical guide for Alloy MVC projects in the Titanium SDK.
 
 ## Project detection
 
-:::info Auto-detects Alloy projects
-This skill checks for Alloy projects when invoked and provides CLI and configuration guidance.
-
-Detection is automatic. No manual command is needed.
-
-Alloy project indicators:
-- `app/` folder with Alloy structure
-- `alloy.jmk` or `config.json` files
-
-Behavior based on detection:
-- Alloy detected -> Provide Alloy CLI command guidance, configuration file help, Alloy-specific troubleshooting
-- Not detected -> Explain this skill is for Alloy projects only and suggest Alloy guides if the user wants to migrate
-:::
+> **️ℹ️ Auto-detects Alloy projects**
+> This skill checks for Alloy projects when invoked and provides CLI and configuration guidance.
+>
+> Detection is automatic. No manual command is needed.
+>
+> Alloy project indicators:
+> - `app/` folder with Alloy structure
+> - `alloy.jmk` or `config.json` files
+>
+> Behavior based on detection:
+> - Alloy detected -> Provide Alloy CLI command guidance, configuration file help, Alloy-specific troubleshooting
+> - Not detected -> Explain this skill is for Alloy projects only and suggest Alloy guides if the user wants to migrate
 
 ## Quick reference
 

package/skills/alloy-howtos/references/cli_reference.md

@@ -125,47 +125,46 @@ Compiler options reference the `event.alloyConfig` object in [Build Configuratio
 
 Use `titanium build` command to run Alloy projects. See [Titanium Command-Line Interface Reference](https://titaniumsdk.com/guide/Titanium_SDK/Titanium_SDK_Guide/Titanium_Command-Line_Interface_Reference/).
 
-:::tip Common ti build pitfalls
-
-Using `-C` flag without UDID:
-```bash
-# Prompts for simulator selection interactively
-ti build -p ios -T simulator -C
-```
-
-Correct approach for simulator:
-```bash
-# Runs on default simulator
-ti build -p ios -T simulator
-```
-
-Using `--no-prompt` incorrectly:
-```bash
-# Still may prompt for device selection if not specific
-ti build -p ios --no-prompt
-```
-
-Always specify target:
-```bash
-# Clear target specification
-ti build -p ios -T simulator --no-prompt
-```
-
-**Common patterns:**
-```bash
-# iOS Simulator (most common during development)
-ti build -p ios -T simulator
-
-# iOS Device (requires UDID)
-ti build -p ios -T device -V <udid>
-
-# Android Emulator
-ti build -p android -T emulator
-
-# Build only (don't run)
-ti build -p ios -T simulator --build-only
-```
-:::
+> **💡 Common ti build pitfalls**
+>
+> Using `-C` flag without UDID:
+> ```bash
+> # Prompts for simulator selection interactively
+> ti build -p ios -T simulator -C
+> ```
+>
+> Correct approach for simulator:
+> ```bash
+> # Runs on default simulator
+> ti build -p ios -T simulator
+> ```
+>
+> Using `--no-prompt` incorrectly:
+> ```bash
+> # Still may prompt for device selection if not specific
+> ti build -p ios --no-prompt
+> ```
+>
+> Always specify target:
+> ```bash
+> # Clear target specification
+> ti build -p ios -T simulator --no-prompt
+> ```
+>
+> **Common patterns:**
+> ```bash
+> # iOS Simulator (most common during development)
+> ti build -p ios -T simulator
+>
+> # iOS Device (requires UDID)
+> ti build -p ios -T device -V <udid>
+>
+> # Android Emulator
+> ti build -p android -T emulator
+>
+> # Build only (don't run)
+> ti build -p ios -T simulator --build-only
+> ```
 
 ### i18n-extract
 

package/skills/alloy-howtos/references/samples.md

@@ -56,9 +56,8 @@ if (!ENV_PROD) {
 
 Alloy separates business logic (controllers) from UI definition (XML/TSS). A common challenge is showing or hiding content based on app state (for example, login status).
 
-:::tip TSS defaults
-The samples below assume some additional TSS: views and windows use a vertical layout, and the `View` tag has a default height and width of `Ti.UI.SIZE`.
-:::
+> **💡 TSS defaults**
+> The samples below assume some additional TSS: views and windows use a vertical layout, and the `View` tag has a default height and width of `Ti.UI.SIZE`.
 
 ### Problems with traditional approaches
 
@@ -154,4 +153,4 @@ Define custom methods in models and render based on those methods:
 </Alloy>
 ```
 
-See [Custom Query Styles](/guide/Alloy_Framework/Alloy_Guide/Alloy_Views/Alloy_Styles_and_Themes/#custom-query-styles) for more details.
+See `VIEWS_STYLES.md` in the `alloy-guides` skill (Custom Query Styles section) for more details.