playbook_ui 16.2.0.pre.alpha.advancedtablecascadingcollapsereact14676 → 16.2.0.pre.alpha.faiconbuttonfix14520

data/lib/playbook/forms/builder/checkbox_field.rb

@@ -17,7 +17,7 @@ module Playbook
         input = super(name, options, checked_value, unchecked_value)
 
         if props[:label]
-          @template.pb_rails("caption", props: { color: "lighter", text: label_text, margin_bottom: "xs" }) +
+          @template.pb_rails("caption", props: { text: label_text, margin_bottom: "xs" }) +
             @template.pb_rails("checkbox", props: props) do
               input
             end

data/lib/playbook/version.rb

@@ -2,5 +2,5 @@
 
 module Playbook
   PREVIOUS_VERSION = "16.2.0"
-  VERSION = "16.2.0.pre.alpha.advancedtablecascadingcollapsereact14676"
+  VERSION = "16.2.0.pre.alpha.faiconbuttonfix14520"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 16.2.0.pre.alpha.advancedtablecascadingcollapsereact14676
+  version: 16.2.0.pre.alpha.faiconbuttonfix14520
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-02-25 00:00:00.000000000 Z
+date: 2026-02-18 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -283,8 +283,6 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_beta_sort.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_beta_subrow_headers.html.erb
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_beta_subrow_headers.md
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_cascade_collapse.jsx
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_cascade_collapse.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail_rails.html.erb
@@ -1880,7 +1878,6 @@ files:
 - app/pb_kits/playbook/pb_image/image.test.js
 - app/pb_kits/playbook/pb_kit/dateTime.ts
 - app/pb_kits/playbook/pb_kit/pb_date_time.rb
-- app/pb_kits/playbook/pb_kit_registry/index.ts
 - app/pb_kits/playbook/pb_label_pill/_label_pill.scss
 - app/pb_kits/playbook/pb_label_pill/_label_pill.tsx
 - app/pb_kits/playbook/pb_label_pill/docs/_description.md
@@ -2137,8 +2134,6 @@ files:
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_label.md
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_hook.jsx
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_hook.md
-- app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_reset_key.jsx
-- app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_reset_key.md
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_required_indicator.html.erb
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_required_indicator.jsx
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_required_indicator.md
@@ -3358,7 +3353,6 @@ files:
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_inline.html.erb
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_inline.jsx
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_input_options.html.erb
-- app/pb_kits/playbook/pb_textarea/docs/_textarea_input_options.jsx
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_input_options.md
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_props_swift.md
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_required_indicator.html.erb
@@ -3924,12 +3918,12 @@ files:
 - app/pb_kits/playbook/utilities/test/globalProps/zIndex.test.js
 - app/pb_kits/playbook/utilities/text.ts
 - app/pb_kits/playbook/utilities/validEmojiChecker.ts
-- dist/chunks/_pb_line_graph-BGY7jEks.js
-- dist/chunks/_typeahead-QhswHQnq.js
+- dist/chunks/_pb_line_graph-BSLb5VXP.js
+- dist/chunks/_typeahead-DXIBDeMj.js
 - dist/chunks/componentRegistry-DzmmLR2x.js
-- dist/chunks/globalProps-CK2YuA9O.js
+- dist/chunks/globalProps-DyTB8IdV.js
 - dist/chunks/lazysizes-B7xYodB-.js
-- dist/chunks/lib-DspaUdlc.js
+- dist/chunks/lib-9wz3x5jl.js
 - dist/chunks/vendor.js
 - dist/menu.yml
 - dist/playbook-rails-react-bindings.js

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_cascade_collapse.jsx

@@ -1,50 +0,0 @@
-import React from "react"
-import AdvancedTable from '../../pb_advanced_table/_advanced_table'
-import MOCK_DATA from "./advanced_table_mock_data.json"
-
-const AdvancedTableCascadeCollapse = (props) => {
-  const columnDefinitions = [
-    {
-      accessor: "year",
-      label: "Year",
-      cellAccessors: ["quarter", "month", "day"],
-    },
-    {
-      accessor: "newEnrollments",
-      label: "New Enrollments",
-    },
-    {
-      accessor: "scheduledMeetings",
-      label: "Scheduled Meetings",
-    },
-    {
-      accessor: "attendanceRate",
-      label: "Attendance Rate",
-    },
-    {
-      accessor: "completedClasses",
-      label: "Completed Classes",
-    },
-    {
-      accessor: "classCompletionRate",
-      label: "Class Completion Rate",
-    },
-    {
-      accessor: "graduatedStudents",
-      label: "Graduated Students",
-    },
-  ]
-
-  return (
-    <div>
-      <AdvancedTable
-          cascadeCollapse
-          columnDefinitions={columnDefinitions}
-          tableData={MOCK_DATA}
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default AdvancedTableCascadeCollapse

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_cascade_collapse.md

@@ -1 +0,0 @@
-`cascadeCollapse` is an optional prop that is set to 'false' by default. If set to 'true', collapsing any parent row itself or by using the toggle exapansion buttons in any header or subheader row also collapses all descendants and clears their expansion state. Re-expanding then shows only direct children until the user expands deeper levels again.

data/app/pb_kits/playbook/pb_kit_registry/index.ts

@@ -1,180 +0,0 @@
-// eslint-disable-next-line
-// @ts-nocheck
-import PbEnhancedElement from "../pb_enhanced_element";
-
-type KitClass = typeof PbEnhancedElement;
-
-class PbKitRegistry {
-  private static instance: PbKitRegistry;
-
-  // array to avoid overwriting if multiple kits share a selector
-  private kits: Map<string, KitClass[]> = new Map();
-
-  private mutationObserver: MutationObserver | null = null;
-  private initialized = false;
-
-  // rAF batching to reduce jank during heavy DOM churn
-  private queued = false;
-  private pendingMutations: MutationRecord[] = [];
-
-  static getInstance(): PbKitRegistry {
-    if (!PbKitRegistry.instance) {
-      PbKitRegistry.instance = new PbKitRegistry();
-    }
-    return PbKitRegistry.instance;
-  }
-
-  register(kit: KitClass): void {
-    const selector = kit.selector;
-    if (!selector) {
-      console.warn("[PbKitRegistry] Kit missing selector:", kit.name);
-      return;
-    }
-
-    const list = this.kits.get(selector) || [];
-    list.push(kit);
-    this.kits.set(selector, list);
-  }
-
-  start(): void {
-    if (this.initialized) return;
-    this.initialized = true;
-
-    const target = document.documentElement || document;
-
-    // Single MutationObserver for ALL kits
-    // attributes OFF
-    this.mutationObserver = new MutationObserver((muts) => this.onMutations(muts));
-
-    this.mutationObserver.observe(target, {
-      childList: true,
-      subtree: true,
-      // attributes: false by omission
-    });
-
-    // Initial scan of document
-    this.scan(document);
-  }
-
-  stop(): void {
-    if (!this.initialized) return;
-
-    this.mutationObserver?.disconnect();
-    this.mutationObserver = null;
-
-    // Disconnect all kit instances safely (snapshot keys first)
-    this.kits.forEach((kitsForSelector) => {
-      kitsForSelector.forEach((kit) => {
-        if (!kit.elements) return;
-        const els = Array.from(kit.elements.keys());
-        els.forEach((el) => kit.removeMatch(el));
-      });
-    });
-
-    this.pendingMutations = [];
-    this.queued = false;
-    this.initialized = false;
-  }
-
-  // ---- Mutation batching ----
-
-  private onMutations(muts: MutationRecord[]): void {
-    this.pendingMutations.push(...muts);
-
-    if (this.queued) return;
-    this.queued = true;
-
-    requestAnimationFrame(() => {
-      this.queued = false;
-      const batch = this.pendingMutations;
-      this.pendingMutations = [];
-      this.processMutations(batch);
-    });
-  }
-
-  private processMutations(mutations: MutationRecord[]): void {
-    // We only care about added nodes here.
-    // Removals handled by cleanupDisconnected() (no selector queries on removed subtrees)
-    const addedRoots: Element[] = [];
-
-    for (const mutation of mutations) {
-      if (mutation.type !== "childList") continue;
-
-      mutation.addedNodes.forEach((node) => {
-        if (node.nodeType === Node.ELEMENT_NODE) {
-          addedRoots.push(node as Element);
-        }
-      });
-    }
-
-    // Enhance anything newly inserted
-    if (addedRoots.length) {
-      for (const root of addedRoots) {
-        this.scan(root);
-      }
-    }
-
-    // Handle removals cheaply: only look at already-enhanced elements
-    this.cleanupDisconnected();
-  }
-
-  // ---- Scanning / enhancing ----
-
-  private scan(root: ParentNode): void {
-    // For each selector, query within root once and attach all kits registered to it
-    this.kits.forEach((kitsForSelector, selector) => {
-      let matches: NodeListOf<Element>;
-      try {
-        // querySelectorAll doesn’t include root itself, so we handle that below too
-        matches = (root as any).querySelectorAll
-          ? (root as any).querySelectorAll(selector)
-          : document.querySelectorAll(selector);
-      } catch (error) {
-        console.debug(`[PbKitRegistry] Invalid selector "${selector}"`, error);
-        return;
-      }
-
-      if (matches && matches.length) {
-        matches.forEach((el) => {
-          kitsForSelector.forEach((kit) => kit.addMatch(el));
-        });
-      }
-
-      // Include root itself if it matches
-      if ((root as any).matches?.(selector)) {
-        kitsForSelector.forEach((kit) => kit.addMatch(root as any));
-      }
-    });
-  }
-
-  // No selector queries on removals
-  // We just remove instances whose elements are no longer in the DOM
-  private cleanupDisconnected(): void {
-    this.kits.forEach((kitsForSelector) => {
-      kitsForSelector.forEach((kit) => {
-        if (!kit.elements) return;
-
-        // Snapshot keys to avoid mutate-while-iterating
-        const els = Array.from(kit.elements.keys());
-        for (const el of els) {
-          if (!el.isConnected) {
-            kit.removeMatch(el);
-          }
-        }
-      });
-    });
-  }
-
-  // Debug helpers
-  getRegisteredSelectors(): string[] {
-    return Array.from(this.kits.keys());
-  }
-
-  // Optional: manually rescan a subtree (useful if some page toggles data-* after insertion)
-  rescan(root: ParentNode = document): void {
-    if (!this.initialized) return;
-    this.scan(root);
-  }
-}
-
-export default PbKitRegistry.getInstance();

data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_reset_key.jsx

@@ -1,100 +0,0 @@
-import React, { useState } from "react";
-import MultiLevelSelect from "../_multi_level_select";
-import { Button } from "playbook-ui";
-
-const treeData = [
-  {
-    label: "Power Home Remodeling",
-    value: "powerHomeRemodeling",
-    id: "100",
-    expanded: true,
-    children: [
-      {
-        label: "People",
-        value: "people",
-        id: "101",
-        expanded: true,
-        children: [
-          {
-            label: "Talent Acquisition",
-            value: "talentAcquisition",
-            id: "102",
-          },
-          {
-            label: "Business Affairs",
-            value: "businessAffairs",
-            id: "103",
-            children: [
-              {
-                label: "Initiatives",
-                value: "initiatives",
-                id: "104",
-              },
-              {
-                label: "Learning & Development",
-                value: "learningAndDevelopment",
-                id: "105",
-              },
-            ],
-          },
-          {
-            label: "People Experience",
-            value: "peopleExperience",
-            id: "106",
-          },
-        ],
-      },
-      {
-        label: "Contact Center",
-        value: "contactCenter",
-        id: "107",
-        children: [
-          {
-            label: "Appointment Management",
-            value: "appointmentManagement",
-            id: "108",
-          },
-          {
-            label: "Customer Service",
-            value: "customerService",
-            id: "109",
-          },
-          {
-            label: "Energy",
-            value: "energy",
-            id: "110",
-          },
-        ],
-      },
-    ],
-  },
-];
-
-const MultiLevelSelectReactResetKey = (props) => {
-  const [resetKey, setResetKey] = useState(0);
-
-  const handleReset = () => {
-    setResetKey((k) => k + 1);
-  };
-
-  return (
-    <>
-      <MultiLevelSelect
-          {...props}
-          id="multi-level-select-reset-example"
-          key={`multi-level-select-reset-${resetKey}`}
-          name="my_array"
-          returnAllSelected
-          treeData={treeData}
-      />
-      <Button
-          id="multilevelselect-reset-button"
-          marginTop="lg"
-          onClick={handleReset}
-          text="Reset"
-      />
-    </>
-  );
-};
-
-export default MultiLevelSelectReactResetKey;

data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_reset_key.md

@@ -1 +0,0 @@
-When a parent resets a Multi Level Select (e.g., “Default” or “Clear”), the kit needs a `key` that changes with the selection because React uses the `key` to determine component identity and whether to preserve internal state. If the `key` doesn’t change, React reuses the existing instance and may keep showing the old selection instead of resetting to the new one.

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_input_options.jsx

@@ -1,68 +0,0 @@
-import React, { useState } from "react"
-
-import Textarea from "../_textarea"
-
-const TextareaInputOptions = (props) => {
-  const [value1, setValue1] = useState("")
-  const [value2, setValue2] = useState("")
-  const [value3, setValue3] = useState("")
-  const [value4, setValue4] = useState("")
-
-  return (
-    <div>
-      <Textarea
-          id="container-id"
-          label="ID on Container"
-          name="comment"
-          onChange={(e) => setValue1(e.target.value)}
-          rows={4}
-          value={value1}
-          {...props}
-      />
-
-      <br />
-
-      <Textarea
-          inputOptions={{ id: "textarea-id" }}
-          label="ID on Textarea via inputOptions"
-          name="comment"
-          onChange={(e) => setValue2(e.target.value)}
-          rows={4}
-          value={value2}
-          {...props}
-      />
-
-      <br />
-
-      <Textarea
-          id="container-id-2"
-          inputOptions={{ id: "textarea-id-2" }}
-          label="Both Container and Textarea IDs"
-          name="comment"
-          onChange={(e) => setValue3(e.target.value)}
-          rows={4}
-          value={value3}
-          {...props}
-      />
-
-      <br />
-
-      <Textarea
-          inputOptions={{
-          "aria-label": "Enter description",
-          "aria-describedby": "help-text",
-          data: { controller: "textarea", action: "focus->handleFocus" },
-          id: "description-textarea"
-        }}
-          label="Data and ARIA Attributes"
-          name="description"
-          onChange={(e) => setValue4(e.target.value)}
-          rows={4}
-          value={value4}
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default TextareaInputOptions