playbook_ui 14.6.2.pre.alpha.PLAY15814384 → 14.6.2

data/lib/playbook/kit_base.rb

@@ -73,15 +73,15 @@ module Playbook
     prop :aria, type: Playbook::Props::HashProp, default: {}
     prop :html_options, type: Playbook::Props::HashProp, default: {}
     prop :children, type: Playbook::Props::Proc
-    prop :style, type: Playbook::Props::HashProp, default: {}
-    prop :height
-    prop :min_height
-    prop :max_height
 
     def object
       self
     end
 
+    def combined_html_options
+      default_html_options.merge(html_options.deep_merge(data_attributes))
+    end
+
     # rubocop:disable Layout/CommentIndentation
     # pb_content_tag information (potentially to be abstracted into its own dev doc in the future)
     # The pb_content_tag generates HTML content tags for rails kits with flexible options.
@@ -110,48 +110,15 @@ module Playbook
     end
     # rubocop:enable Style/OptionalBooleanParameter
 
-    def combined_html_options
-      merged = default_html_options.dup
-
-      html_options.each do |key, value|
-        if key == :style && value.is_a?(Hash)
-          # Convert style hash to CSS string
-          merged[:style] = value.map { |k, v| "#{k.to_s.gsub('_', '-')}: #{v}" }.join("; ")
-        else
-          merged[key] = value
-        end
-      end
-
-      inline_styles = dynamic_inline_props
-      merged[:style] = if inline_styles.present?
-                         merged[:style].present? ? "#{merged[:style]}; #{inline_styles}" : inline_styles
-                       end
-
-      merged.deep_merge(data_attributes)
-    end
-
-    def global_inline_props
-      {
-        height: height,
-        min_height: min_height,
-        max_height: max_height,
-      }.compact
-    end
-
   private
 
     def default_options
-      options = {
+      {
         id: id,
         data: data,
         class: classname,
         aria: aria,
       }
-
-      inline_styles = dynamic_inline_props
-      options[:style] = inline_styles if inline_styles.present? && !html_options.key?(:style)
-
-      options
     end
 
     def default_html_options
@@ -164,10 +131,5 @@ module Playbook
         aria: aria,
       }.transform_keys { |key| key.to_s.tr("_", "-").to_sym }
     end
-
-    def dynamic_inline_props
-      styles = global_inline_props.map { |key, value| "#{key.to_s.gsub('_', '-')}: #{value}" if value.present? }.compact
-      styles.join("; ").presence
-    end
   end
 end

data/lib/playbook/version.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
 module Playbook
-  PREVIOUS_VERSION = "14.6.2"
-  VERSION = "14.6.2.pre.alpha.PLAY15814384"
+  PREVIOUS_VERSION = "14.6.1"
+  VERSION = "14.6.2"
 end

metadata

@@ -1,15 +1,15 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 14.6.2.pre.alpha.PLAY15814384
+  version: 14.6.2
 platform: ruby
 authors:
 - Power UX
 - Power Devs
-autorequire: 
+autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-11-05 00:00:00.000000000 Z
+date: 2024-10-24 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -762,9 +762,6 @@ files:
 - app/pb_kits/playbook/pb_currency/docs/_currency_alignment.html.erb
 - app/pb_kits/playbook/pb_currency/docs/_currency_alignment.jsx
 - app/pb_kits/playbook/pb_currency/docs/_currency_alignment_swift.md
-- app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.html.erb
-- app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.jsx
-- app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.md
 - app/pb_kits/playbook/pb_currency/docs/_currency_matching_decimals.html.erb
 - app/pb_kits/playbook/pb_currency/docs/_currency_matching_decimals.jsx
 - app/pb_kits/playbook/pb_currency/docs/_currency_no_symbol.html.erb
@@ -1385,8 +1382,7 @@ files:
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_tag.jsx
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.html.erb
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.jsx
-- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_rails.md
-- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_react.md
+- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.md
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_user.html.erb
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_user.jsx
 - app/pb_kits/playbook/pb_form_pill/docs/example.yml
@@ -1736,23 +1732,6 @@ files:
 - app/pb_kits/playbook/pb_line_graph/lineGraphSettings.js
 - app/pb_kits/playbook/pb_line_graph/line_graph.html.erb
 - app/pb_kits/playbook/pb_line_graph/line_graph.rb
-- app/pb_kits/playbook/pb_link/_link.scss
-- app/pb_kits/playbook/pb_link/_link.tsx
-- app/pb_kits/playbook/pb_link/docs/_link_color.html.erb
-- app/pb_kits/playbook/pb_link/docs/_link_color.jsx
-- app/pb_kits/playbook/pb_link/docs/_link_disabled.html.erb
-- app/pb_kits/playbook/pb_link/docs/_link_disabled.jsx
-- app/pb_kits/playbook/pb_link/docs/_link_icon.html.erb
-- app/pb_kits/playbook/pb_link/docs/_link_icon.jsx
-- app/pb_kits/playbook/pb_link/docs/_link_tag.html.erb
-- app/pb_kits/playbook/pb_link/docs/_link_tag.jsx
-- app/pb_kits/playbook/pb_link/docs/_link_underline.html.erb
-- app/pb_kits/playbook/pb_link/docs/_link_underline.jsx
-- app/pb_kits/playbook/pb_link/docs/example.yml
-- app/pb_kits/playbook/pb_link/docs/index.js
-- app/pb_kits/playbook/pb_link/link.html.erb
-- app/pb_kits/playbook/pb_link/link.rb
-- app/pb_kits/playbook/pb_link/link.test.jsx
 - app/pb_kits/playbook/pb_list/_list.scss
 - app/pb_kits/playbook/pb_list/_list.tsx
 - app/pb_kits/playbook/pb_list/_list_item.tsx
@@ -2739,16 +2718,11 @@ files:
 - app/pb_kits/playbook/pb_timeline/_item.tsx
 - app/pb_kits/playbook/pb_timeline/_timeline.scss
 - app/pb_kits/playbook/pb_timeline/_timeline.tsx
-- app/pb_kits/playbook/pb_timeline/detail.html.erb
-- app/pb_kits/playbook/pb_timeline/detail.rb
 - app/pb_kits/playbook/pb_timeline/docs/_description.md
 - app/pb_kits/playbook/pb_timeline/docs/_timeline_default.html.erb
 - app/pb_kits/playbook/pb_timeline/docs/_timeline_default.jsx
 - app/pb_kits/playbook/pb_timeline/docs/_timeline_vertical.html.erb
 - app/pb_kits/playbook/pb_timeline/docs/_timeline_vertical.jsx
-- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.html.erb
-- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.jsx
-- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.md
 - app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.html.erb
 - app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.jsx
 - app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.md
@@ -2756,14 +2730,6 @@ files:
 - app/pb_kits/playbook/pb_timeline/docs/index.js
 - app/pb_kits/playbook/pb_timeline/item.html.erb
 - app/pb_kits/playbook/pb_timeline/item.rb
-- app/pb_kits/playbook/pb_timeline/label.html.erb
-- app/pb_kits/playbook/pb_timeline/label.rb
-- app/pb_kits/playbook/pb_timeline/step.html.erb
-- app/pb_kits/playbook/pb_timeline/step.rb
-- app/pb_kits/playbook/pb_timeline/subcomponents/Detail.tsx
-- app/pb_kits/playbook/pb_timeline/subcomponents/Label.tsx
-- app/pb_kits/playbook/pb_timeline/subcomponents/Step.tsx
-- app/pb_kits/playbook/pb_timeline/subcomponents/index.tsx
 - app/pb_kits/playbook/pb_timeline/timeline.html.erb
 - app/pb_kits/playbook/pb_timeline/timeline.rb
 - app/pb_kits/playbook/pb_timeline/timeline.test.js
@@ -3133,9 +3099,9 @@ files:
 - app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
 - app/pb_kits/playbook/utilities/text.ts
 - app/pb_kits/playbook/utilities/validEmojiChecker.ts
-- dist/chunks/_typeahead-C-6MLSyC.js
-- dist/chunks/_weekday_stacked-CFhGhr9V.js
-- dist/chunks/lazysizes-B7xYodB-.js
+- dist/chunks/_typeahead-BV_n6U5W.js
+- dist/chunks/_weekday_stacked-Cy__g00H.js
+- dist/chunks/lazysizes-DHz07jlL.js
 - dist/chunks/lib-D-mTv-kp.js
 - dist/chunks/pb_form_validation-BkWGwJsl.js
 - dist/chunks/vendor.js
@@ -3219,7 +3185,7 @@ homepage: https://playbook.powerapp.cloud/
 licenses:
 - ISC
 metadata: {}
-post_install_message: 
+post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -3235,7 +3201,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubygems_version: 3.5.3
-signing_key: 
+signing_key:
 specification_version: 4
 summary: Playbook Design System
 test_files: []

data/app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.html.erb

@@ -1,7 +0,0 @@
-<%= pb_rails("currency", props: {
-  amount: '1234567.89',
-  comma_separator: true,
-  size: 'lg',
-  emphasized: false,
-  decimals: 'matching',
-}) %>

data/app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.jsx

@@ -1,18 +0,0 @@
-import React from "react"
-
-import Currency from "../_currency"
-
-const CurrencyCommaSeparator = (props) => {
-  return (
-    <Currency
-        amount='1234567.89'
-        commaSeparator
-        decimals="matching"
-        emphasized={false}
-        size="lg"
-        {...props}
-    />
-  )
-}
-
-export default CurrencyCommaSeparator

data/app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.md

@@ -1,3 +0,0 @@
-The optional `commaSeparator` can be used to auto-format the use of commas as a thousands separator. 
-
-**NOTE:** If the value passed into the `amount` prop is already comma-dilineated, it will not add additional commas.

data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_rails.md

@@ -1,3 +0,0 @@
-For Form Pills with longer text, the truncate global prop can be used to truncate the label within each Form Pill. See [here](https://playbook.powerapp.cloud/visual_guidelines/truncate) for more information on the truncate global prop.
-
-__NOTE__: For Rails Form Pills (not ones embedded within a React-rendered Typeahead or MultiLevelSelect), a unique `id` is required to enable the Tooltip functionality displaying the text or tag section of the Form Pill.

data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_react.md

@@ -1 +0,0 @@
-For Form Pills with longer text, the `truncate` global prop can be used to truncate the label within each Form Pill. Hover over the truncated Form Pill and a Tooltip containing the text or tag section of the Form Pill will appear. See [here](https://playbook.powerapp.cloud/visual_guidelines/truncate) for more information on the truncate global prop.

data/app/pb_kits/playbook/pb_link/_link.scss

@@ -1,66 +0,0 @@
-@import "../tokens/colors";
-@import "../tokens/line_height";
-@import "../tokens/typography";
-@import "../tokens/border_radius";
-
-[class^=pb_link_kit]{
-  @include pb_link($primary);
-  &:hover {
-    color: $text_lt_default;
-  }
-  &:focus {
-    outline: none;
-  }
-  &:focus-visible {
-    border-radius: $border_rad_light;
-    outline: 1px solid $primary;
-    outline-offset: 2px;
-  }
-  &:visited {
-    color: $data_3;
-  }
-  &.dark  {
-    @include pb_link($active_dark);
-    &:hover {
-      color: $text_dk_default;
-    }
-  }
-  @each $color_name, $color_value in $pb_link_colors {
-    &[class*=_#{"" + $color_name}] {
-      @include pb_link($color_value);
-
-      &:hover {
-        color: map-get($pb_link_hover_colors, $color_name);
-      }
-
-      &:visited {
-        color: $data_3;
-      }
-    }
-  }
-
-  @each $dark_color_name, $dark_color_value in $pb_dark_link_colors{
-    &[class*=_#{$dark_color_name}][class*=dark]{
-      @include pb_link($dark_color_value);
-      
-      &:hover {
-        color: map-get($pb_dark_link_hover_colors, $dark_color_name);
-      }
-
-      &:visited {
-        color: $data_3;
-      }
-    }
-  }
-
-  &[class*=_underline] {
-    text-decoration: underline;
-  }
-
-  &[class*=_disabled] {
-    pointer-events: none;
-    cursor: default;
-    color: $text_lt_lighter;
-  }
-
-}

data/app/pb_kits/playbook/pb_link/_link.tsx

@@ -1,107 +0,0 @@
-import React from 'react'
-import classnames from 'classnames'
-
-import { buildAriaProps, buildCss, buildDataProps, buildHtmlProps } from '../utilities/props'
-import { globalProps, GlobalProps } from '../utilities/globalProps'
-
-import Icon from '../pb_icon/_icon'
-
-type LinkProps = {
-  aria?: {[key: string]: string},
-  className?: string,
-  children?: React.ReactChild[] | React.ReactChild,
-  color?: 'default' | 'body' | 'muted' | 'destructive',
-  dark?: boolean,
-  data?: {[key: string]: string},
-  disabled?: boolean,
-  href?: string,
-  htmlOptions?: {[key: string]: string | number | boolean | (() => void) | ((arg?: Event) => void)},
-  icon?: string,
-  iconRight?: string,
-  id?: string,
-  tag?: 'a' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'div',
-  text?: string,
-  underline?: boolean,
-} & GlobalProps
-
-const Link = (props: LinkProps): React.ReactElement => {
-  const {
-    aria = {},
-    children,
-    className,
-    color = '',
-    data = {},
-    disabled = false,
-    href= '',
-    htmlOptions = {},
-    icon = '',
-    iconRight = '',
-    id = '',
-    tag = 'a',
-    text = '',
-    underline = false,
-  } = props
-
-  const ariaProps: {[key: string]: string} = buildAriaProps(aria)
-  const dataProps: {[key: string]: string} = buildDataProps(data)
-  const htmlProps = buildHtmlProps(htmlOptions);
-  const classes = classnames(
-    buildCss('pb_link_kit', color, underline ? 'underline' : '', disabled ? 'disabled' : ''),
-    globalProps(props),
-    className
-  )
-  const Tag = tag as keyof JSX.IntrinsicElements
-
-  const renderContent = () => (
-    <>
-      {icon && (
-        <Icon
-            fixedWidth
-            icon={icon}
-            marginRight="xxs"
-            size="xs"
-        />
-      )}
-      {text || children}
-      {iconRight && (
-        <Icon
-            fixedWidth
-            icon={iconRight}
-            marginLeft="xxs"
-            size="xs"
-        />
-      )}
-    </>
-  )
-
-  const commonProps = {
-    ...ariaProps,
-    ...dataProps,
-    ...htmlProps,
-    className: classes,
-    id,
-  }
-
-  if (tag === 'a') {
-    return (
-      <a
-          {...commonProps}
-          href={href}
-      >
-        {renderContent()}
-      </a>
-    )
-  } else {
-    return (
-      <a
-          {...commonProps}
-          href={href}
-      >
-        <Tag>{renderContent()}</Tag>
-      </a>
-    )
-  }
-
-}
-
-export default Link

data/app/pb_kits/playbook/pb_link/docs/_link_color.html.erb

@@ -1,30 +0,0 @@
-<div>
-  <%= pb_rails("link", props: {
-    text: "link example",
-    href: "https://www.google.com/search?q=playbook+design+system",
-  }) %>
-</div>
-
-<div>
-  <%= pb_rails("link", props: {
-    text: "link example",
-    href: "https://www.youtube.com/@PowerHRG",
-    color: "body",
-  }) %>
-</div>
-
-<div>
-  <%= pb_rails("link", props: {
-    text: "link example",
-    href: "https://github.com/powerhome/.github/blob/main/profile/README.md",
-    color: "muted",
-  }) %>
-</div>
-
-<div>
-  <%= pb_rails("link", props: {
-    text: "link example",
-    href: "https://rubygems.org/gems/playbook_ui/",
-    color: "destructive",
-  }) %>
-</div>

data/app/pb_kits/playbook/pb_link/docs/_link_color.jsx

@@ -1,40 +0,0 @@
-import React from 'react'
-import { Link } from 'playbook-ui'
-
-const LinkColor = (props) => (
-  <div>
-    <div>
-      <Link
-          href="https://www.google.com/search?q=playbook+design+system"
-          text="link example"
-          {...props}
-      />
-    </div>
-    <div>
-      <Link
-          color="body"
-          href="https://www.youtube.com/@PowerHRG"
-          text="link example"
-          {...props}
-      />
-    </div>
-    <div>
-      <Link
-          color="muted"
-          href="https://github.com/powerhome/.github/blob/main/profile/README.md"
-          text="link example"
-          {...props}
-      />
-    </div>
-    <div>
-      <Link
-          color="destructive"
-          href="https://rubygems.org/gems/playbook_ui/"
-          text="link example"
-          {...props}
-      />
-    </div>
-  </div>
-)
-
-export default LinkColor

data/app/pb_kits/playbook/pb_link/docs/_link_disabled.html.erb

@@ -1,5 +0,0 @@
-<%= pb_rails("link", props: {
-  text: "link example",
-  href: "#disabled",
-  disabled: true,
-}) %>

data/app/pb_kits/playbook/pb_link/docs/_link_disabled.jsx

@@ -1,15 +0,0 @@
-import React from 'react'
-import { Link } from 'playbook-ui'
-
-const LinkDisabled = (props) => (
-  <div>
-    <Link
-        disabled
-        href="#disabled"
-        text="link example"
-        {...props}
-    />
-  </div>
-)
-
-export default LinkDisabled

data/app/pb_kits/playbook/pb_link/docs/_link_icon.html.erb

@@ -1,15 +0,0 @@
-<div>
-  <%= pb_rails("link", props: {
-    text: "link example",
-    href: "#icon",
-    icon: "arrow-up-right-from-square",
-  }) %>
-</div>
-
-<div>
-  <%= pb_rails("link", props: {
-    text: "link example",
-    href: "#icon2",
-    icon_right: "chevron-right",
-  }) %>
-</div>

data/app/pb_kits/playbook/pb_link/docs/_link_icon.jsx

@@ -1,25 +0,0 @@
-import React from 'react'
-import { Link } from 'playbook-ui'
-
-const LinkIcon = (props) => (
-  <div>
-    <div>
-      <Link
-          href="#icon"
-          icon="arrow-up-right-from-square"
-          text="link example"
-          {...props}
-      />
-    </div>
-    <div>
-      <Link
-          href="#icon2"
-          iconRight="chevron-right"
-          text="link example"
-          {...props}
-      />
-    </div>
-  </div>
-)
-
-export default LinkIcon

data/app/pb_kits/playbook/pb_link/docs/_link_tag.html.erb

@@ -1,35 +0,0 @@
-<%= pb_rails("link", props: {
-  text: "h1 link example",
-  href: "#tag",
-  icon: "arrow-up-right-from-square",
-  tag: "h1",
-}) %>
-
-<%= pb_rails("link", props: {
-  text: "h3 link example",
-  href: "#tag2",
-  tag: "h3",
-  underline: true,
-}) %>
-
-<%= pb_rails("link", props: {
-  color: "destructive",
-  text: "h6 link example",
-  href: "#tag3",
-  tag: "h6",
-}) %>
-
-<%= pb_rails("link", props: {
-  text: "p link example",
-  href: "#tag4",
-  icon_right: "chevron-right",
-  tag: "p",
-}) %>
-
-<div>
-  This is a <%= pb_rails("link", props: {
-    text: "span link example",
-    href: "#tag5",
-    tag: "span",
-  }) %>
-</div>

data/app/pb_kits/playbook/pb_link/docs/_link_tag.jsx

@@ -1,45 +0,0 @@
-import React from 'react'
-import { Link } from 'playbook-ui'
-
-const LinkTag = (props) => (
-  <div>
-    <Link
-        href="#tag"
-        icon="arrow-up-right-from-square"
-        tag="h1"
-        text="h1 link example"
-        {...props}
-    />
-    <Link
-        href="#tag2"
-        tag="h3"
-        text="h3 link example"
-        underline
-        {...props}
-    />
-    <Link
-        color="destructive"
-        href="#tag3"
-        tag="h6"
-        text="h6 link example"
-        {...props}
-    />
-    <Link
-        href="#tag4"
-        iconRight="chevron-right"
-        tag="p"
-        text="p link example"
-        {...props}
-    />
-    <div>
-      This is a <Link
-          href="#tag5"
-          tag="span"
-          text="span link example"
-          {...props}
-    />
-    </div>
-  </div>
-)
-
-export default LinkTag

data/app/pb_kits/playbook/pb_link/docs/_link_underline.html.erb

@@ -1,5 +0,0 @@
-<%= pb_rails("link", props: {
-  text: "link example",
-  href: "#underline",
-  underline: true,
-}) %>

data/app/pb_kits/playbook/pb_link/docs/_link_underline.jsx

@@ -1,15 +0,0 @@
-import React from 'react'
-import { Link } from 'playbook-ui'
-
-const LinkUnderline = (props) => (
-  <div>
-    <Link
-        href="#underline"
-        text="link example"
-        underline
-        {...props}
-    />
-  </div>
-)
-
-export default LinkUnderline