RubyGems - playbook_ui_docs - Versions diffs - 15.7.0.pre.alpha.play270013253 → 15.7.0.pre.rc.0 - Mend

playbook_ui_docs 15.7.0.pre.alpha.play270013253 → 15.7.0.pre.rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (206) hide show

data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_min_max_time.jsx DELETED Viewed

@@ -1,52 +0,0 @@
-import React from 'react'
-import TimePicker from '../../pb_time_picker/_time_picker'
-const TimePickerMinMaxTime = (props) => (
-  <div>
-    <TimePicker
-        id="time-picker-min-only"
-        label="Minimum Time Only"
-        minTime="09:00"
-        {...props}
-    />
-    <TimePicker
-        id="time-picker-max-only"
-        label="Maximum Time Only"
-        maxTime="17:00"
-        timeFormat="24hour"
-        {...props}
-    />
-    <TimePicker
-        id="time-picker-min-max-12hr"
-        label="Min & Max Time Range (12-hour)"
-        maxTime="17:00"
-        minTime="09:00"
-        {...props}
-    />
-    <TimePicker
-        id="time-picker-min-max-24hr"
-        label="Min & Max Time Range (24-hour)"
-        maxTime="17:00"
-        minTime="09:00"
-        timeFormat="24hour"
-        {...props}
-    />
-    <TimePicker
-        id="time-picker-pm-only"
-        label="PM Only Range (AM disabled)"
-        maxTime="17:00"
-        minTime="13:00"
-        {...props}
-    />
-    <TimePicker
-        id="time-picker-am-only"
-        label="AM Only Range (PM disabled)"
-        maxTime="11:30"
-        minTime="06:00"
-        {...props}
-    />
-  </div>
-)
-export default TimePickerMinMaxTime

data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_min_max_time.md DELETED Viewed

	@@ -1 +0,0 @@
1	- Use the `min_time` / `minTime` and `max_time` / `maxTime` props to restrict the selectable time range. This example demonstrates minimum-only, maximum-only, and combined ranges in both 12-hour and 24-hour formats.

data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_on_handler.jsx DELETED Viewed

@@ -1,45 +0,0 @@
-import React, { useState } from 'react'
-import TimePicker from '../../pb_time_picker/_time_picker'
-import Body from '../../pb_body/_body'
-const TimePickerOnHandler = (props) => {
-  const [selectedTime, setSelectedTime] = useState('')
-  const [closedTime, setClosedTime] = useState('')
-  const handleTimeChange = (time) => {
-    setSelectedTime(time)
-  }
-  const handleTimeClose = (time) => {
-    setClosedTime(time)
-  }
-  return (
-    <div>
-      {(selectedTime || closedTime) && (
-        <div style={{ marginBottom: '16px' }}>
-          {selectedTime && (
-            <Body
-                text={`onChange: ${selectedTime}`}
-            />
-          )}
-          {closedTime && (
-            <Body
-                marginTop={selectedTime ? "xs" : "none"}
-                text={`onClose: ${closedTime}`}
-            />
-          )}
-        </div>
-      )}
-      <TimePicker
-          id="time-picker-on-handler"
-          onChange={handleTimeChange}
-          onClose={handleTimeClose}
-          {...props}
-      />
-    </div>
-  )
-}
-export default TimePickerOnHandler

data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_on_handler.md DELETED Viewed

	@@ -1 +0,0 @@
1	- Demonstrates the `onChange` and `onClose` event handlers for the Time Picker.

data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_timezone.html.erb DELETED Viewed

@@ -1,3 +0,0 @@
-<%= pb_rails("time_picker", props: { id: "time-picker-timezone", show_timezone: true }) %>
-<%= pb_rails("time_picker", props: { id: "time-picker-timezone-24hour", show_timezone: true, time_format: "24hour" }) %>

data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_timezone.jsx DELETED Viewed

@@ -1,21 +0,0 @@
-import React from 'react'
-import TimePicker from '../../pb_time_picker/_time_picker'
-const TimePickerTimezone = (props) => (
-  <div>
-    <TimePicker
-        id="time-picker-timezone"
-        showTimezone
-        {...props}
-    />
-    <TimePicker
-        id="time-picker-timezone-24hour"
-        showTimezone
-        timeFormat="24hour"
-        {...props}
-    />
-  </div>
-)
-export default TimePickerTimezone

data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_timezone.md DELETED Viewed

	@@ -1 +0,0 @@
1	- Enable timezone display by passing `show_timezone` / `showTimezone`.

data/app/pb_kits/playbook/pb_time_picker/docs/example.yml DELETED Viewed

@@ -1,24 +0,0 @@
-examples:
-  rails:
-  - time_picker_default: Default
-  - time_picker_24_hour: 24-Hour Format
-  - time_picker_default_time: Default Time
-  - time_picker_label: Custom Label
-  - time_picker_timezone: With Timezone
-  - time_picker_min_max_time: Min & Max Time
-  - time_picker_error: Error
-  - time_picker_disabled: Disabled
-  - time_picker_input_options: Input Options
-  react:
-  - time_picker_default: Default
-  - time_picker_24_hour: 24-Hour Format
-  - time_picker_default_time: Default Time
-  - time_picker_label: Custom Label
-  - time_picker_timezone: With Timezone
-  - time_picker_min_max_time: Min & Max Time
-  - time_picker_error: Error
-  - time_picker_disabled: Disabled
-  - time_picker_on_handler: onChange & onClose Handlers

data/app/pb_kits/playbook/pb_time_picker/docs/index.js DELETED Viewed

@@ -1,9 +0,0 @@
-export { default as TimePickerDefault } from './_time_picker_default.jsx'
-export { default as TimePickerDefaultTime } from './_time_picker_default_time.jsx'
-export { default as TimePicker24Hour } from './_time_picker_24_hour.jsx'
-export { default as TimePickerLabel } from './_time_picker_label.jsx'
-export { default as TimePickerTimezone } from './_time_picker_timezone.jsx'
-export { default as TimePickerOnHandler } from './_time_picker_on_handler.jsx'
-export { default as TimePickerMinMaxTime } from './_time_picker_min_max_time.jsx'
-export { default as TimePickerError } from './_time_picker_error.jsx'
-export { default as TimePickerDisabled } from './_time_picker_disabled.jsx'

data/app/pb_kits/playbook/pb_timeline/docs/_timeline_show_current_year.html.erb DELETED Viewed

@@ -1,60 +0,0 @@
-<%= pb_rails("timeline", props: {orientation: "horizontal", show_date: true}) do %>
-    <%= pb_rails("timeline/item", props: {icon: "user", icon_color: "royal", line_style: "solid", date: Date.today, show_current_year: true }) do %>
-        <%= pb_rails("title_detail", props: {
-            title: "Jackson Heights",
-            detail: "37-27 74th Street"
-        }) %>
-    <% end %>
-    <%= pb_rails("timeline/item", props: {icon: "check", icon_color: "teal", line_style: "dotted" }) do %>
-        <%= pb_rails("title_detail", props: {
-            title: "Greenpoint",
-            detail: "81 Gate St Brooklyn"
-        }) %>
-    <% end %>
-    <%= pb_rails("timeline/item", props: { line_style: "solid"}) do |item| %>
-      <% item.label do %>
-        <%= pb_rails("timeline/label", props: { date: Date.today, show_current_year: true }) %>
-      <% end %>
-      <% item.step do %>
-        <%= pb_rails("timeline/step", props: { icon: 'map-marker-alt', icon_color: 'purple' }) %>
-      <% end %>
-      <% item.detail do %>
-        <%= pb_rails("title_detail", props: {
-          title: "Society Hill",
-          detail: "72 E St Astoria"
-        }) %>
-      <% end %>
-    <% end %>
-<% end %>
-<br /><br /><br />
-<%= pb_rails("timeline", props: {orientation: "vertical", show_date: true}) do %>
-    <%= pb_rails("timeline/item", props: {icon: "user", icon_color: "royal", line_style: "solid", date: Date.today, show_current_year: true }) do %>
-        <%= pb_rails("title_detail", props: {
-            title: "Jackson Heights",
-            detail: "37-27 74th Street"
-        }) %>
-    <% end %>
-    <%= pb_rails("timeline/item", props: {icon: "check", icon_color: "teal", line_style: "dotted" }) do %>
-        <%= pb_rails("title_detail", props: {
-            title: "Greenpoint",
-            detail: "81 Gate St Brooklyn"
-        }) %>
-    <% end %>
-    <%= pb_rails("timeline/item", props: { line_style: "solid"}) do |item| %>
-      <% item.label do %>
-        <%= pb_rails("timeline/label", props: { date: Date.today, show_current_year: true }) %>
-      <% end %>
-      <% item.step do %>
-        <%= pb_rails("timeline/step", props: { icon: 'map-marker-alt', icon_color: 'purple' }) %>
-      <% end %>
-      <% item.detail do %>
-        <%= pb_rails("title_detail", props: {
-          title: "Society Hill",
-          detail: "72 E St Astoria"
-        }) %>
-      <% end %>
-    <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_timeline/docs/_timeline_show_current_year.jsx DELETED Viewed

@@ -1,118 +0,0 @@
-import React from 'react'
-import Timeline from '../_timeline'
-import TitleDetail from '../../pb_title_detail/_title_detail'
-const TimelineShowCurrentYear = (props) => (
-  <div>
-    <Timeline
-        orientation="horizontal"
-        showDate
-        {...props}
-    >
-      <Timeline.Item
-          date={new Date()}
-          icon="user"
-          iconColor="royal"
-          showCurrentYear
-          {...props}
-      >
-        <TitleDetail
-            detail="37-27 74th Street"
-            title="Jackson Heights"
-            {...props}
-        />
-      </Timeline.Item>
-      <Timeline.Item
-          icon="check"
-          iconColor="teal"
-          lineStyle="dotted"
-          {...props}
-      >
-        <TitleDetail
-            detail="81 Gate St Brooklyn"
-            title="Greenpoint"
-            {...props}
-        />
-      </Timeline.Item>
-      <Timeline.Item
-          lineStyle="solid"
-          {...props}
-      >
-        <Timeline.Label
-            date={new Date()}
-            showCurrentYear
-        />
-        <Timeline.Step
-            icon="map-marker-alt"
-            iconColor="purple"
-        />
-        <Timeline.Detail>
-          <TitleDetail
-              detail="72 E St Astoria"
-              title="Society Hill"
-              {...props}
-          />
-        </Timeline.Detail>
-      </Timeline.Item>
-    </Timeline>
-    <br />
-    <br />
-    <br />
-    <Timeline
-        orientation="vertical"
-        showDate
-        {...props}
-    >
-      <Timeline.Item
-          date={new Date()}
-          icon="user"
-          iconColor="royal"
-          showCurrentYear
-          {...props}
-      >
-        <TitleDetail
-            detail="37-27 74th Street"
-            title="Jackson Heights"
-            {...props}
-        />
-      </Timeline.Item>
-      <Timeline.Item
-          icon="check"
-          iconColor="teal"
-          lineStyle="dotted"
-          {...props}
-      >
-        <TitleDetail
-            detail="81 Gate St Brooklyn"
-            title="Greenpoint"
-            {...props}
-        />
-      </Timeline.Item>
-      <Timeline.Item
-          lineStyle="solid"
-          {...props}
-      >
-        <Timeline.Label
-            date={new Date()}
-            showCurrentYear
-        />
-        <Timeline.Step
-            icon="map-marker-alt"
-            iconColor="purple"
-        />
-        <Timeline.Detail>
-          <TitleDetail
-              detail="72 E St Astoria"
-              title="Society Hill"
-              {...props}
-          />
-        </Timeline.Detail>
-      </Timeline.Item>
-    </Timeline>
-  </div>
-)
-export default TimelineShowCurrentYear

data/app/pb_kits/playbook/pb_timeline/docs/_timeline_show_current_year.md DELETED Viewed

	@@ -1 +0,0 @@
1	- By default, the Timeline kit does NOT display the year if it is the current year. If you want to display the current year you can do so by setting `showCurrentYear`/`show_current_year` to true. Pass it to `Timeline.Item`/`timeline/item` when using its `date` prop, or to `Timeline.Label`/`timeline/label` if following the "With Children" pattern.