playbook_ui_docs 16.0.0.pre.alpha.PLAY272313713 → 16.0.0.pre.alpha.fixiconsvgdataattrspropagation13513

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: dad5c18432aca37eb801820ffa3a738113131dbaf85f88cfc99d873474771ff5
-  data.tar.gz: 7fb5efbbf2ff6dbade1d036c5d62bb964f1d0a42b01d72c4f23d083cebd4b7b0
+  metadata.gz: 8bbf557f52e4d4578fdbf8302eaacd37df4e14e819bf2a704ceb1adba8c5b580
+  data.tar.gz: 37ac9fd11f5e28aef15f7d37605f0a88fc3db7742a4edde7ddb66f90e7b350c2
 SHA512:
-  metadata.gz: 3ed82496f7c664e86219efc7ba77803deffae8693e84258977a9326fe2a22a9757da6b243f0c6ced6e0a0fe28144e279cafae8b102d52e738879a0471e18d0c4
-  data.tar.gz: 485396a110a0742aab958d266089ac3075bec812c88943cb4c3392c9e8bf6b056bbb63bf462c43c7d5ca86e9b30fbae70f77503223211b52d56eb21105c5758c
+  metadata.gz: 9281f9b6106bbc8d58ef97c060fc96c453f816bae1143647b327c8e81ad534729af9f62eb12110ec3acc13c44b0a2188644a5d28530fe19d4b14355dfec83f9d
+  data.tar.gz: 8435b416dc226929bbd1febe7dce3f312b701e79ffc9f3aa7caea9e00745d6146e3296742cb4c9bb93fd1e56c917802185347cbcc85613cdc95c40846f800651

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

@@ -6,9 +6,9 @@ In the first Advanced Table in this code example, 2021 has an empty children arr
 This prop is set to `false` by default. 
 
 
-### persistToggleExpansionButton
+### persistToggleExpansion
 The `persistToggleExpansionButton` is a boolean prop that renders the toggle-all icon in the top left header cell for complex datasets with empty `children` arrays and advanced querying logic explained in the preceeding doc example. Your logic may require an additional query helper file to update data specifically from requerying via toggle all buttons.
 
 In the second and third Advanced Tables in this code example, all 3 rows have empty children arrays. The second Advanced Table demonstrates that the toggle all button does not render (prior to an initial row expansion) without `persistToggleExpansionButton` in place. The third Advanced Table shows the toggle all button due to `persistToggleExpansionButton`. 
 
-This prop is set to `false` by default and should only be used in conjunction with `inlineRowLoading`.
+This prop is set to false by default and should only be used in conjunction with `inlineRowLoading`.

data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml

@@ -29,7 +29,6 @@ examples:
   - advanced_table_background_control_rails: Column Styling Background Color
   - advanced_table_background_colors_rails: Column Styling Individual Cell Background Color
   - advanced_table_column_border_color_rails: Column Group Border Color
-  - advanced_table_inline_row_loading_rails: Inline Row Loading
 
 
   react:

data/app/pb_kits/playbook/pb_form/docs/_form_with_required_indicator.html.erb

@@ -1,8 +1,6 @@
 <%= pb_form_with(scope: :example, url: "", method: :get, validate: true) do |form| %>
   <%= form.text_field :example_text_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.text_field :example_text_field_2, props: { label: "Text Field Custom Label", required: true, required_indicator: true } %>
-  <%= form.text_area :example_text_area, props: { label: true, required: true, required_indicator: true } %>
-  <%= form.text_area :example_text_area_2, props: { label: "Textarea Custom Label", required: true, required_indicator: true } %>
   <%= form.email_field :example_email_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.number_field :example_number_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.search_field :example_search_field, props: { label: true, required: true, required_indicator: true } %>
@@ -13,4 +11,4 @@
     <%= action.submit %>
     <%= action.button props: { type: "reset", text: "Cancel", variant: "secondary" } %>
   <% end %>
-<% end %>
+<% end %>

data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.jsx

@@ -38,5 +38,5 @@ const MultipleUsersWithTooltip = (props) => {
         </div>
     )
 }
-
+``
 export default MultipleUsersWithTooltip

data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.md

@@ -1 +1 @@
-Use the `withTooltip` / `with_tooltip` boolean prop to enable setting user-specific tooltip content via the `tooltip` property in the users array.
+Use the `withTooltip` boolean prop to enable setting user-specific tooltip content via the `tooltip` property in the users array.

data/app/pb_kits/playbook/pb_multiple_users/docs/example.yml

@@ -4,7 +4,6 @@ examples:
   - multiple_users_default: Default
   - multiple_users_reverse: Reverse
   - multiple_users_size: Size
-  - multiple_users_with_tooltip: With Tooltip
 
 
   react:

data/app/pb_kits/playbook/pb_rich_text_editor/docs/example.yml

@@ -9,7 +9,6 @@ examples:
   - rich_text_editor_templates: Templates
   # - rich_text_editor_toolbar_bottom: Toolbar Bottom
   - rich_text_editor_inline: Inline
-  - rich_text_editor_required_indicator: Required Indicator
   - rich_text_editor_preview: Preview
 
   react:
@@ -32,7 +31,5 @@ examples:
   - rich_text_editor_advanced_inline: Advanced (Inline)
   - rich_text_editor_advanced_height: Advanced Height
   - rich_text_editor_advanced_min_height: Advanced Min Height
-  - rich_text_editor_required_indicator: Required Indicator
-  - rich_text_editor_advanced_required_indicator: Advanced Required Indicator
   - rich_text_editor_preview: Preview
   - rich_text_editor_advanced_preview: Advanced Preview

data/app/pb_kits/playbook/pb_rich_text_editor/docs/index.js

@@ -19,5 +19,3 @@ export { default as RichTextEditorAdvancedSticky } from './_rich_text_editor_adv
 export { default as RichTextEditorAdvancedInline } from './_rich_text_editor_advanced_inline.jsx'
 export { default as RichTextEditorAdvancedHeight } from './_rich_text_editor_advanced_height.jsx'
 export { default as RichTextEditorAdvancedMinHeight } from './_rich_text_editor_advanced_min_height.jsx'
-export { default as RichTextEditorRequiredIndicator } from './_rich_text_editor_required_indicator.jsx'
-export { default as RichTextEditorAdvancedRequiredIndicator } from './_rich_text_editor_advanced_required_indicator.jsx'

data/app/pb_kits/playbook/pb_textarea/docs/example.yml

@@ -8,8 +8,6 @@ examples:
   - textarea_character_counter: Character Counter
   - textarea_inline: Inline
   - textarea_emoji_mask: Emoji Mask
-  - textarea_required_indicator: Required Indicator
-  - textarea_input_options: Input Options
 
   react:
   - textarea_default: Default
@@ -19,9 +17,8 @@ examples:
   - textarea_character_counter: Character Counter
   - textarea_inline: Inline
   - textarea_emoji_mask: Emoji Mask
-  - textarea_required_indicator: Required Indicator
 
   swift:
   - textarea_default_swift: Default
   - textarea_error_swift: Textarea w/ Error
-  - textarea_props_swift: ""
+  - textarea_props_swift: ""

data/app/pb_kits/playbook/pb_textarea/docs/index.js

@@ -5,4 +5,3 @@ export { default as TextareaError } from './_textarea_error.jsx'
 export { default as TextareaCharacterCounter } from './_textarea_character_counter.jsx'
 export { default as TextareaInline } from './_textarea_inline.jsx'
 export { default as TextareaEmojiMask } from './_textarea_emoji_mask.jsx'
-export { default as TextareaRequiredIndicator } from './_textarea_required_indicator.jsx'

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui_docs
 version: !ruby/object:Gem::Version
-  version: 16.0.0.pre.alpha.PLAY272313713
+  version: 16.0.0.pre.alpha.fixiconsvgdataattrspropagation13513
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-01-22 00:00:00.000000000 Z
+date: 2026-01-13 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: playbook_ui
@@ -100,8 +100,6 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_editing.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading.md
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading_rails.html.erb
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading_rails.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.html.erb
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading_rails.md
@@ -1453,7 +1451,6 @@ files:
 - app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size.jsx
 - app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size.md
 - app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size_swift.md
-- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.html.erb
 - app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.jsx
 - app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.md
 - app/pb_kits/playbook/pb_multiple_users/docs/example.yml
@@ -1909,8 +1906,6 @@ files:
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_min_height.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_min_height.md
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_preview.jsx
-- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_required_indicator.jsx
-- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_required_indicator.md
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_simple.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_sticky.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_sticky.md
@@ -1928,9 +1923,6 @@ files:
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_more_extensions.md
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_preview.html.erb
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_preview.jsx
-- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.html.erb
-- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.jsx
-- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.md
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_simple.html.erb
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_simple.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_sticky.html.erb
@@ -2131,7 +2123,6 @@ files:
 - app/pb_kits/playbook/pb_stat_value/docs/example.yml
 - app/pb_kits/playbook/pb_stat_value/docs/index.js
 - app/pb_kits/playbook/pb_table/docs/_description.md
-- app/pb_kits/playbook/pb_table/docs/_sections.yml
 - app/pb_kits/playbook/pb_table/docs/_table_action_middle.html.erb
 - app/pb_kits/playbook/pb_table/docs/_table_action_middle.jsx
 - app/pb_kits/playbook/pb_table/docs/_table_action_middle.md
@@ -2330,12 +2321,7 @@ files:
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_error_swift.md
 - 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.md
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_props_swift.md
-- app/pb_kits/playbook/pb_textarea/docs/_textarea_required_indicator.html.erb
-- app/pb_kits/playbook/pb_textarea/docs/_textarea_required_indicator.jsx
-- app/pb_kits/playbook/pb_textarea/docs/_textarea_required_indicator.md
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_resize.html.erb
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_resize.jsx
 - app/pb_kits/playbook/pb_textarea/docs/example.yml

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading_rails.html.erb

@@ -1,64 +0,0 @@
-<% column_definitions = [
-    {
-      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",
-    }
-] %>
-
-<%= pb_rails("caption", props: { text: "Inline Row Loading - Demonstrated in Row 1 (Rows 2 and 3 have data)" }) %>
-
-<%= pb_rails("advanced_table", props: {
-  id: "inline-loading-table-1",
-  table_data: @table_data_inline_loading,
-  column_definitions: column_definitions,
-  enable_toggle_expansion: "all",
-  inline_row_loading: true,
-  margin_bottom: "md"
-}) %>
-
-<%= pb_rails("caption", props: { text: "Inline Row Loading with No Subrow Data - All Rows Display Inline Row Loading and the Toggle All Button is not rendered" }) %>
-
-<%= pb_rails("advanced_table", props: {
-  id: "inline-loading-table-2",
-  table_data: @table_data_inline_loading_empty_children,
-  column_definitions: column_definitions,
-  enable_toggle_expansion: "all",
-  inline_row_loading: true,
-  margin_bottom: "md"
-}) %>
-
-<%= pb_rails("caption", props: { text: "Inline Row Loading and Persist Toggle Expansion Button with No Subrow Data - All Rows Display Inline Row Loading and the Toggle All Button is rendered" }) %>
-
-<%= pb_rails("advanced_table", props: {
-  id: "inline-loading-table-3",
-  table_data: @table_data_inline_loading_empty_children,
-  column_definitions: column_definitions,
-  enable_toggle_expansion: "all",
-  inline_row_loading: true,
-  persist_toggle_expansion_button: true
-}) %>

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

@@ -1,18 +0,0 @@
-### inline_row_loading
-By default, the kit assumes that the initial dataset is complete, rendering expansion controls only when children are present. If, however, you want to implement lazy-loading patterns where children are fetched only when a parent is expanded, use the `inline_row_loading` prop.
-
-When `inline_row_loading` is set to `true`:
-- Expansion controls are rendered for rows with empty `children` arrays (you must pass `children: []` to any row that will have children loaded later)
-- When such a row is expanded, an inline loading indicator appears until the child data is loaded
-- This enables lazy-loading patterns without one-off hacks
-
-In the first table above, row "2021" has an empty `children` array. Click to expand it and see the inline loading state. Rows 2 and 3 have actual child data.
-
-This prop is set to `false` by default.
-
-### persist_toggle_expansion_button
-The `persist_toggle_expansion_button` is a boolean prop that renders the toggle-all icon in the top left header cell for complex datasets with empty `children` arrays and advanced querying logic explained in the preceding doc example. Your logic may require an additional query helper file to update data specifically from requerying via toggle all buttons.
-
-In the second and third Advanced Tables in this code example, all 3 rows have empty children arrays. The second Advanced Table demonstrates that the toggle all button does not render (prior to an initial row expansion) without `persist_toggle_expansion_button` in place. The third Advanced Table shows the toggle all button due to `persist_toggle_expansion_button`.
-
-This prop is set to `false` by default and should only be used in conjunction with `inline_row_loading`.

data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.html.erb

@@ -1,30 +0,0 @@
-<%= pb_rails("multiple_users", props: {
-  with_tooltip: true,
-  users: [
-    {
-      name: "Patrick Welch",
-      image_url: "https://randomuser.me/api/portraits/men/9.jpg",
-      tooltip: "Patrick Welch - Online"
-    },
-    {
-      name: "Lucille Sanchez",
-      image_url: "https://randomuser.me/api/portraits/women/6.jpg",
-      tooltip: "Lucille Sanchez - Offline"
-    },
-    {
-      name: "Beverly Reyes",
-      image_url: "https://randomuser.me/api/portraits/women/74.jpg",
-      tooltip: "Beverly Reyes - Online"
-    },
-    {
-      name: "Keith Craig",
-      image_url: "https://randomuser.me/api/portraits/men/40.jpg",
-      tooltip: "Keith Craig - Away"
-    },
-    {
-      name: "Alicia Cooper",
-      image_url: "https://randomuser.me/api/portraits/women/46.jpg",
-      tooltip: "Alicia Cooper - Busy"
-    }
-  ]
-}) %>

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_required_indicator.jsx

@@ -1,35 +0,0 @@
-import React from 'react'
-import RichTextEditor from '../../pb_rich_text_editor/_rich_text_editor'
-import { useEditor, EditorContent } from "@tiptap/react"
-import StarterKit from "@tiptap/starter-kit"
-import Link from '@tiptap/extension-link'
-
-
-const RichTextEditorAdvancedRequiredIndicator = (props) => {
-
-    const editor = useEditor({
-        extensions: [
-            StarterKit,
-            Link
-        ],
-        content:"Add your text here. You can format your text, add links, quotes, and bullets."
-    })
-      if (!editor) {
-        return null
-      }
-
-  return (
-    <div>
-      <RichTextEditor
-          advancedEditor={editor}
-          label="Label"
-          requiredIndicator
-          {...props}
-      >
-        <EditorContent editor={editor}/>
-      </RichTextEditor>
-    </div>
-  )
-}
-
-export default RichTextEditorAdvancedRequiredIndicator

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_required_indicator.md

@@ -1,3 +0,0 @@
-The `requiredIndicator`/`required_indicator` prop displays a red asterisk (*) next to the label, visually indicating that the field is required. This is purely visual and does not enforce validation.
-
-You can use `requiredIndicator`/`required_indicator` with any validation approach: HTML5 validation via the `required` prop, client-side validation, or backend validation. For this reason, it works independently and doesn't need to be paired with the `required` prop.

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.html.erb

@@ -1,10 +0,0 @@
-<%= pb_rails("rich_text_editor", props: {
-  id: "required-indicator",
-  input_options: {
-    id: 'hidden_input_id',
-    name: "hidden_input_name"
-  },
-  label: "Label",
-  required_indicator: true,
-  value: "Add your text here. You can format your text, add links, quotes, and bullets."
-}) %>

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.jsx

@@ -1,21 +0,0 @@
-import React, { useState } from 'react'
-import RichTextEditor from '../../pb_rich_text_editor/_rich_text_editor'
-
-const RichTextEditorRequiredIndicator = (props) => {
-  const [value, setValue] = useState('Add your text here. You can format your text, add links, quotes, and bullets.'),
-  handleOnChange = (html) => setValue(html)
-
-  return (
-    <div>
-      <RichTextEditor
-          label="Label"
-          onChange={handleOnChange}
-          requiredIndicator
-          value={value}
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default RichTextEditorRequiredIndicator

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.md

@@ -1,3 +0,0 @@
-The `requiredIndicator`/`required_indicator` prop displays a red asterisk (*) next to the label, visually indicating that the field is required. This is purely visual and does not enforce validation.
-
-You can use `requiredIndicator`/`required_indicator` with any validation approach: HTML5 validation via the `required` prop, client-side validation, or backend validation. For this reason, it works independently and doesn't need to be paired with the `required` prop.

data/app/pb_kits/playbook/pb_table/docs/_sections.yml

@@ -1,68 +0,0 @@
-sections:
-  - title: "Size & Density"
-    examples:
-      - table_sm
-      - table_md
-      - table_lg
-      - table_multiline
-      - table_single_line
-      - table_outer_padding
-
-  - title: "Layout & Structure"
-    examples:
-      - table_responsive_table
-      - table_with_subcomponents
-      - table_with_subcomponents_as_divs
-      - table_with_background_kit
-
-
-  - title: "Sticky & Positional Behaviors"
-    examples:
-      - table_sticky
-      - table_sticky_left_columns
-      - table_sticky_right_columns
-      - table_sticky_columns
-      - table_alignment_row
-      - table_alignment_column
-      - table_alignment_shift_row
-      - table_alignment_shift_data
-      - table_side_highlight
-      - table_container
-
-  - title: "Collapsible & Nested Behaviors"
-    examples:
-      - table_with_collapsible
-      - table_with_dynamic_collapsible
-      - table_with_collapsible_with_custom_click
-      - table_with_collapsible_with_custom_content
-      - table_with_collapsible_with_nested_rows
-      - table_with_collapsible_with_nested_table
-
-  - title: "Data Presentation"
-    examples:
-      - table_data_table
-      - table_vertical_border
-      - table_striped
-
-  - title: "Header Variants"
-    examples:
-      - table_header
-      - table_with_header_style_borderless
-      - table_with_header_style_floating
-
-  - title: "Interactive Tables"
-    examples:
-      - table_with_clickable_rows
-      - table_with_selectable_rows
-      - table_with_filter_variant
-      - table_with_filter_variant_with_pagination
-      - table_disable_hover
-
-  - title: "Table Actions"
-    examples:
-      - table_one_action
-      - table_two_actions
-      - table_two_plus_actions
-      - table_action_middle
-      - table_icon_buttons
-      

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_input_options.html.erb

@@ -1,39 +0,0 @@
-<%= pb_rails("textarea", props: { 
-  label: "ID on Container", 
-  id: "container-id",
-  name: "comment",
-  rows: 4
-}) %>
-
-<br/>
-
-<%= pb_rails("textarea", props: { 
-  label: "ID on Textarea via input_options", 
-  input_options: { id: "textarea-id" },
-  name: "comment",
-  rows: 4
-}) %>
-
-<br/>
-
-<%= pb_rails("textarea", props: { 
-  label: "Both Container and Textarea IDs", 
-  id: "container-id-2",
-  input_options: { id: "textarea-id-2" },
-  name: "comment",
-  rows: 4
-}) %>
-
-<br/>
-
-<%= pb_rails("textarea", props: { 
-  label: "Data and ARIA Attributes", 
-  name: "description",
-  rows: 4,
-  input_options: {
-    'aria-label': "Enter description",
-    'aria-describedby': "help-text",
-    data: { controller: "textarea", action: "focus->handleFocus" },
-    id: "description-textarea"
-  }
-}) %>

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

@@ -1,3 +0,0 @@
-Use the `input_options` / `inputOptions` prop to pass additional attributes directly to the underlying `<textarea>` element instead of the outer wrapper. This is useful for applying data attributes, custom IDs, ARIA attributes, or other HTML attributes that need to be on the textarea element itself.
-
-Additional HTML attributes (e.g. data or ARIA attributes) can also be passed directly to the `<textarea>` via `input_options`.

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_required_indicator.html.erb

@@ -1,5 +0,0 @@
-<%= pb_rails("textarea", props: {
-  label: "Label",
-  placeholder: "Placeholder text",
-  required_indicator: true
-}) %>

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

@@ -1,25 +0,0 @@
-import React, {useState} from 'react'
-
-import Textarea from '../_textarea'
-
-const TextareaRequiredIndicator = (props) => {
-  const [value, setValue] = useState('Default value text')
-  const handleChange = (event) => {
-    setValue(event.target.value)
-  }
-  return (
-    <div>
-      <Textarea
-          label="Label"
-          name="comment"
-          onChange={(e) => handleChange(e)}
-          placeholder="Placeholder text"
-          requiredIndicator
-          value={value}
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default TextareaRequiredIndicator

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_required_indicator.md

@@ -1,3 +0,0 @@
-The `requiredIndicator`/`required_indicator` prop displays a red asterisk (*) next to the label, visually indicating that the field is required. This is purely visual and does not enforce validation.
-
-You can use `requiredIndicator`/`required_indicator` with any validation approach: HTML5 validation via the `required` prop, client-side validation, or backend validation. For this reason, it works independently and doesn't need to be paired with the `required` prop.