playbook_ui_docs 16.6.0 → 16.7.0.pre.rc.0

data/app/pb_kits/playbook/pb_multi_level_select/docs/_playground.overrides.json

@@ -0,0 +1,126 @@
+{
+  "defaults": {
+    "treeData": [
+      {
+        "label": "Company",
+        "value": "company",
+        "id": "mls_co",
+        "expanded": true,
+        "children": [
+          {
+            "label": "Engineering",
+            "value": "engineering",
+            "id": "mls_eng",
+            "children": [
+              {
+                "label": "Frontend",
+                "value": "frontend",
+                "id": "mls_fe"
+              },
+              {
+                "label": "Backend",
+                "value": "backend",
+                "id": "mls_be"
+              }
+            ]
+          },
+          {
+            "label": "Sales",
+            "value": "sales",
+            "id": "mls_sales"
+          }
+        ]
+      }
+    ]
+  },
+  "groups": [
+    {
+      "name": "Content",
+      "props": ["label", "name", "placeholder", "treeData", "selectedIds"]
+    },
+    {
+      "name": "State",
+      "props": ["disabled", "error", "required", "requiredIndicator"]
+    },
+    {
+      "name": "Appearance",
+      "props": ["inputDisplay", "variant", "wrapped"]
+    },
+    {
+      "name": "Selection behavior",
+      "props": ["returnAllSelected", "showCheckedChildren", "inputName"]
+    },
+    {
+      "name": "Events",
+      "props": ["onChange", "onSelect"]
+    }
+  ],
+  "presets": [
+    {
+      "name": "Multi (default)",
+      "props": {
+        "variant": "multi",
+        "label": "Departments",
+        "placeholder": "Search teams…",
+        "inputDisplay": "pills"
+      }
+    },
+    {
+      "name": "Single select",
+      "props": {
+        "variant": "single",
+        "label": "Pick one team",
+        "placeholder": "Choose…",
+        "inputDisplay": "pills"
+      }
+    },
+    {
+      "name": "Plain input (no pills)",
+      "props": {
+        "variant": "multi",
+        "label": "Teams",
+        "inputDisplay": "none"
+      }
+    },
+    {
+      "name": "Disabled",
+      "props": {
+        "variant": "multi",
+        "label": "Locked",
+        "disabled": true
+      }
+    },
+    {
+      "name": "With error",
+      "props": {
+        "variant": "multi",
+        "label": "Required field",
+        "error": "Choose at least one option."
+      }
+    },
+    {
+      "name": "Return all selected",
+      "props": {
+        "variant": "multi",
+        "label": "Include ancestors",
+        "returnAllSelected": true
+      }
+    },
+    {
+      "name": "Hide checked in tree",
+      "props": {
+        "variant": "multi",
+        "label": "Compact tree",
+        "showCheckedChildren": false
+      }
+    }
+  ],
+  "conditionals": {},
+  "hints": {
+    "tree_data": {
+      "when": {},
+      "message": "treeData is a nested list with id, label, value, and optional children; expand with expanded on nodes you want open by default.",
+      "type": "info"
+    }
+  }
+}

data/app/pb_kits/playbook/pb_multiple_users/docs/_playground.json

@@ -0,0 +1,182 @@
+{
+  "template": "<MultipleUsers{{props}} />",
+  "propTargets": {},
+  "defaults": {
+    "reverse": false,
+    "size": "sm",
+    "withTooltip": false,
+    "maxDisplayedUsers": 4,
+    "users": [
+      {
+        "name": "Anna Black",
+        "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg",
+        "tooltip": "Anna Black · Engineer"
+      },
+      {
+        "name": "Jordan Lee",
+        "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg",
+        "tooltip": "Jordan Lee · Designer"
+      },
+      {
+        "name": "Sam Rivera",
+        "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg",
+        "tooltip": "Sam Rivera · PM"
+      },
+      {
+        "name": "Chris Patel",
+        "imageUrl": "https://randomuser.me/api/portraits/men/75.jpg",
+        "tooltip": "Chris Patel · Engineer"
+      }
+    ]
+  },
+  "groups": [
+    {
+      "name": "Content",
+      "props": [
+        "users",
+        "maxDisplayedUsers",
+        "withTooltip"
+      ]
+    },
+    {
+      "name": "Appearance",
+      "props": [
+        "size",
+        "reverse"
+      ]
+    }
+  ],
+  "presets": [
+    {
+      "name": "Team · sm",
+      "props": {
+        "size": "sm",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          },
+          {
+            "name": "Chris Patel",
+            "imageUrl": "https://randomuser.me/api/portraits/men/75.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Team · lg",
+      "props": {
+        "size": "lg",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Initials only",
+      "props": {
+        "size": "md",
+        "users": [
+          {
+            "name": "Anna Black"
+          },
+          {
+            "name": "Jordan Lee"
+          },
+          {
+            "name": "Sam Rivera"
+          }
+        ]
+      }
+    },
+    {
+      "name": "With tooltips",
+      "props": {
+        "withTooltip": true,
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg",
+            "tooltip": "Anna Black · Engineer"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg",
+            "tooltip": "Jordan Lee · Designer"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Reverse order",
+      "props": {
+        "reverse": true,
+        "size": "xs",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Overflow (+more)",
+      "props": {
+        "maxDisplayedUsers": 3,
+        "size": "sm",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          },
+          {
+            "name": "Chris Patel",
+            "imageUrl": "https://randomuser.me/api/portraits/men/75.jpg"
+          },
+          {
+            "name": "Morgan Quinn",
+            "imageUrl": "https://randomuser.me/api/portraits/women/12.jpg"
+          }
+        ]
+      }
+    }
+  ],
+  "conditionals": {},
+  "hints": {}
+}

data/app/pb_kits/playbook/pb_multiple_users/docs/_playground.overrides.json

@@ -0,0 +1,167 @@
+{
+  "defaults": {
+    "size": "sm",
+    "reverse": false,
+    "maxDisplayedUsers": 4,
+    "withTooltip": false,
+    "users": [
+      {
+        "name": "Anna Black",
+        "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg",
+        "tooltip": "Anna Black · Engineer"
+      },
+      {
+        "name": "Jordan Lee",
+        "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg",
+        "tooltip": "Jordan Lee · Designer"
+      },
+      {
+        "name": "Sam Rivera",
+        "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg",
+        "tooltip": "Sam Rivera · PM"
+      },
+      {
+        "name": "Chris Patel",
+        "imageUrl": "https://randomuser.me/api/portraits/men/75.jpg",
+        "tooltip": "Chris Patel · Engineer"
+      }
+    ]
+  },
+  "groups": [
+    {
+      "name": "Content",
+      "props": ["users", "maxDisplayedUsers", "withTooltip"]
+    },
+    {
+      "name": "Appearance",
+      "props": ["size", "reverse"]
+    }
+  ],
+  "presets": [
+    {
+      "name": "Team · sm",
+      "props": {
+        "size": "sm",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          },
+          {
+            "name": "Chris Patel",
+            "imageUrl": "https://randomuser.me/api/portraits/men/75.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Team · lg",
+      "props": {
+        "size": "lg",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Initials only",
+      "props": {
+        "size": "md",
+        "users": [
+          { "name": "Anna Black" },
+          { "name": "Jordan Lee" },
+          { "name": "Sam Rivera" }
+        ]
+      }
+    },
+    {
+      "name": "With tooltips",
+      "props": {
+        "withTooltip": true,
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg",
+            "tooltip": "Anna Black · Engineer"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg",
+            "tooltip": "Jordan Lee · Designer"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Reverse order",
+      "props": {
+        "reverse": true,
+        "size": "xs",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Overflow (+more)",
+      "props": {
+        "maxDisplayedUsers": 3,
+        "size": "sm",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          },
+          {
+            "name": "Chris Patel",
+            "imageUrl": "https://randomuser.me/api/portraits/men/75.jpg"
+          },
+          {
+            "name": "Morgan Quinn",
+            "imageUrl": "https://randomuser.me/api/portraits/women/12.jpg"
+          }
+        ]
+      }
+    }
+  ],
+  "conditionals": {},
+  "hints": {}
+}

data/app/pb_kits/playbook/pb_multiple_users_stacked/docs/_playground.json

@@ -0,0 +1,145 @@
+{
+  "template": "<MultipleUsersStacked{{props}} />",
+  "propTargets": {},
+  "defaults": {
+    "size": "sm",
+    "variant": "default",
+    "users": [
+      {
+        "name": "Anna Black",
+        "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+      },
+      {
+        "name": "Jordan Lee",
+        "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+      }
+    ]
+  },
+  "groups": [
+    {
+      "name": "Content",
+      "props": [
+        "users"
+      ]
+    },
+    {
+      "name": "Appearance",
+      "props": [
+        "size",
+        "variant"
+      ]
+    }
+  ],
+  "presets": [
+    {
+      "name": "Two · default",
+      "props": {
+        "variant": "default",
+        "size": "sm",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Single",
+      "props": {
+        "variant": "default",
+        "size": "md",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Initials only",
+      "props": {
+        "variant": "default",
+        "size": "sm",
+        "users": [
+          {
+            "name": "Anna Black"
+          },
+          {
+            "name": "Jordan Lee"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Bubble · two",
+      "props": {
+        "variant": "bubble",
+        "size": "md",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Bubble · many",
+      "props": {
+        "variant": "bubble",
+        "size": "lg",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          },
+          {
+            "name": "Chris Patel",
+            "imageUrl": "https://randomuser.me/api/portraits/men/75.jpg"
+          }
+        ]
+      }
+    },
+    {
+      "name": "Default · xl",
+      "props": {
+        "variant": "default",
+        "size": "xl",
+        "users": [
+          {
+            "name": "Anna Black",
+            "imageUrl": "https://randomuser.me/api/portraits/women/44.jpg"
+          },
+          {
+            "name": "Jordan Lee",
+            "imageUrl": "https://randomuser.me/api/portraits/men/32.jpg"
+          },
+          {
+            "name": "Sam Rivera",
+            "imageUrl": "https://randomuser.me/api/portraits/women/68.jpg"
+          }
+        ]
+      }
+    }
+  ],
+  "conditionals": {},
+  "hints": {}
+}