playbook_ui 14.15.0.pre.alpha.play1917lodashremoval2of36615 → 14.15.0.pre.rc.0

data/app/pb_kits/playbook/pb_tooltip/floating_ui.js

@@ -1,282 +0,0 @@
-import PbEnhancedElement from '../pb_enhanced_element'
-import { computePosition, offset, flip, shift, arrow, autoUpdate } from '@floating-ui/dom'
-
-const TOOLTIP_OFFSET = 20
-const TOOLTIP_TIMEOUT = 250
-const SAFE_ZONE_MARGIN = 1
-
-export default class PbTooltipFloatingUi extends PbEnhancedElement {
-  static get selector() {
-    return '[data-pb-tooltip-kit="true"][data-pb-tooltip-delay-open], [data-pb-tooltip-kit="true"][data-pb-tooltip-delay-close], [data-pb-tooltip-kit="true"][data-pb-tooltip-interaction="true"]'
-  }
-
-  connect() {
-    if (this.tooltipInteraction) {
-      document.addEventListener('mousemove', (e) => {
-        this.lastMouseX = e.clientX
-        this.lastMouseY = e.clientY
-      })
-    }
-    
-    this.triggerElements.forEach((trigger) => {
-      const method = this.triggerMethod
-      const interactionEnabled = this.tooltipInteraction
-
-      if (method === 'click') {
-        trigger.addEventListener('click', () => {
-          this.showTooltip(trigger)
-        })
-      } else {
-        trigger.addEventListener('mouseenter', () => {
-          clearSafeZoneListener(this)
-          clearTimeout(this.mouseleaveTimeout)
-          this.currentTrigger = trigger
-          const delayOpen = this.delayOpen ? parseInt(this.delayOpen) : TOOLTIP_TIMEOUT
-          this.mouseenterTimeout = setTimeout(() => {
-            this.showTooltip(trigger)
-            if (interactionEnabled) {
-              this.checkCloseTooltip(trigger)
-            }
-          }, delayOpen)
-        })
-
-        trigger.addEventListener('mouseleave', () => {
-          clearTimeout(this.mouseenterTimeout)
-          if (this.delayClose) {
-            const delayClose = parseInt(this.delayClose)
-            this.mouseleaveTimeout = setTimeout(() => {
-              if (interactionEnabled) {
-                this.attachSafeZoneListener()
-              } else {
-                this.hideTooltip()
-              }
-            }, delayClose)
-          } else {
-            if (interactionEnabled) {
-              this.attachSafeZoneListener()
-            } else {
-              this.hideTooltip()
-            }
-          }
-        })
-
-        if (interactionEnabled) {
-          this.tooltip.addEventListener('mouseenter', () => {
-            clearSafeZoneListener(this)
-          })
-
-          this.tooltip.addEventListener('mouseleave', () => {
-            this.attachSafeZoneListener()
-          })
-        }
-      }
-    })
-  }
-
-  attachSafeZoneListener() {
-    clearSafeZoneListener(this)
-    this.safeZoneHandler = (e) => {
-      if (!this.currentTrigger) return
-      const triggerRect = this.currentTrigger.getBoundingClientRect()
-      const tooltipRect = this.tooltip.getBoundingClientRect()
-      const safeRect = getSafeZone(triggerRect, tooltipRect, this.position, SAFE_ZONE_MARGIN)
-      if (!isPointInsideRect(e.clientX, e.clientY, safeRect)) {
-        this.hideTooltip()
-        clearSafeZoneListener(this)
-      }
-    }
-    document.addEventListener('mousemove', this.safeZoneHandler)
-  }
-
-  checkCloseTooltip(trigger) {
-    document.querySelector('body').addEventListener('click', ({ target }) => {
-      const isTooltip = target.closest(`#${this.tooltipId}`) === this.tooltip
-      const isTrigger = target.closest(this.triggerElementSelector) === trigger
-      if (isTrigger || isTooltip) {
-        this.checkCloseTooltip(trigger)
-      } else {
-        this.hideTooltip()
-      }
-    }, { once: true })
-  }
-
-  showTooltip(trigger) {
-    if (this.shouldShowTooltip === 'false') return
-
-    clearSafeZoneListener(this)
-
-    this.tooltip.style.opacity = '1'
-    this.tooltip.style.visibility = 'visible'
-    this.tooltip.style.pointerEvents = 'auto'
-
-    if (this.cleanup) {
-      this.cleanup()
-    }
-
-    const arrowElement = document.querySelector(`#${this.tooltipId}-arrow`)
-
-    this.cleanup = autoUpdate(trigger, this.tooltip, () => {
-      computePosition(trigger, this.tooltip, {
-        placement: this.position,
-        strategy: 'fixed',
-        middleware: [
-          offset({ mainAxis: TOOLTIP_OFFSET, crossAxis: 0 }),
-          flip(),
-          shift(),
-          arrow({ element: arrowElement })
-        ],
-      }).then(({ x, y, placement, middlewareData }) => {
-        Object.assign(this.tooltip.style, {
-          left: `${x}px`,
-          top: `${y}px`,
-          position: 'fixed'
-        })
-        this.tooltip.setAttribute('data-popper-placement', placement)
-        if (arrowElement && middlewareData.arrow) {
-          const { x: arrowX, y: arrowY } = middlewareData.arrow
-          Object.assign(arrowElement.style, {
-            left: arrowX != null ? `${arrowX}px` : '',
-            top: arrowY != null ? `${arrowY}px` : '',
-            position: 'absolute'
-          })
-        }
-      })
-    })
-
-    this.tooltip.classList.add('show')
-
-    if (this.triggerMethod === 'click') {
-      clearTimeout(this.autoHideTimeout)
-      this.autoHideTimeout = setTimeout(() => {
-        this.hideTooltip()
-      }, 1000)
-    }
-  }
-
-  hideTooltip() {
-    if (!this.tooltip) return
-
-    this.tooltip.classList.add('fade_out')
-    setTimeout(() => {
-      if (this.cleanup) {
-        this.cleanup()
-        this.cleanup = null
-      }
-      this.tooltip.classList.remove('show')
-      this.tooltip.classList.remove('fade_out')
-      this.tooltip.style.opacity = '0'
-      this.tooltip.style.visibility = 'hidden'
-      this.tooltip.style.pointerEvents = 'none'
-      this.tooltip.style.position = ''
-      this.tooltip.style.top = ''
-      this.tooltip.style.left = ''
-      this.tooltip.style.transform = ''
-    }, TOOLTIP_TIMEOUT)
-  }
-
-  get triggerElements() {
-    let triggerEl
-    if (this.triggerElementId) {
-      triggerEl = document.querySelector(`#${this.triggerElementId}`)
-    } else if (this.triggerElementSelector) {
-      const selectorIsId = this.triggerElementSelector.indexOf('#') > -1
-      triggerEl = selectorIsId
-        ? document.querySelector(this.triggerElementSelector)
-        : document.querySelectorAll(this.triggerElementSelector)
-    } else {
-      triggerEl = this.element
-    }
-    if (!triggerEl) {
-      console.error('Tooltip Kit: No valid trigger element found!')
-      return []
-    }
-    if (triggerEl.length === undefined) {
-      triggerEl = [triggerEl]
-    }
-    return triggerEl
-  }
-
-  get tooltip() {
-    return (this._tooltip = this._tooltip || this.element.querySelector(`#${this.tooltipId}`))
-  }
-
-  get position() {
-    return this.element.dataset.pbTooltipPosition
-  }
-
-  get triggerElementId() {
-    return this.element.dataset.pbTooltipTriggerElementId
-  }
-
-  get tooltipId() {
-    return this.element.dataset.pbTooltipTooltipId
-  }
-
-  get triggerElementSelector() {
-    return this.element.dataset.pbTooltipTriggerElementSelector
-  }
-
-  get shouldShowTooltip() {
-    return this.element.dataset.pbTooltipShowTooltip
-  }
-
-  get triggerMethod() {
-    return this.element.dataset.pbTooltipTriggerMethod || 'hover'
-  }
-
-  get tooltipInteraction() {
-    return this.element.dataset.pbTooltipInteraction === 'true'
-  }
-  
-  get delayOpen() {
-    return this.element.dataset.pbTooltipDelayOpen
-  }
-  
-  get delayClose() {
-    return this.element.dataset.pbTooltipDelayClose
-  }
-}
-
-function clearSafeZoneListener(context) {
-  if (context.safeZoneHandler) {
-    document.removeEventListener('mousemove', context.safeZoneHandler)
-    context.safeZoneHandler = null
-  }
-}
-
-function getSafeZone(triggerRect, tooltipRect, placement, margin) {
-  let safeRect = {}
-  if (placement.startsWith('top')) {
-    safeRect.left = triggerRect.left - margin
-    safeRect.right = triggerRect.right + margin
-    safeRect.top = tooltipRect.bottom - margin
-    safeRect.bottom = triggerRect.top + margin
-  } else if (placement.startsWith('bottom')) {
-    safeRect.left = triggerRect.left - margin
-    safeRect.right = triggerRect.right + margin
-    safeRect.top = triggerRect.bottom - margin
-    safeRect.bottom = tooltipRect.top + margin
-  } else if (placement.startsWith('left')) {
-    safeRect.top = triggerRect.top - margin
-    safeRect.bottom = triggerRect.bottom + margin
-    safeRect.left = tooltipRect.right - margin
-    safeRect.right = triggerRect.left + margin
-  } else if (placement.startsWith('right')) {
-    safeRect.top = triggerRect.top - margin
-    safeRect.bottom = triggerRect.bottom + margin
-    safeRect.left = triggerRect.right - margin
-    safeRect.right = tooltipRect.left + margin
-  } else {
-    safeRect = {
-      left: triggerRect.left - margin,
-      right: triggerRect.right + margin,
-      top: triggerRect.top - margin,
-      bottom: triggerRect.bottom + margin,
-    }
-  }
-  return safeRect
-}
-
-function isPointInsideRect(x, y, rect) {
-  return x >= rect.left && x <= rect.right && y >= rect.top && y <= rect.bottom
-}

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_dynamic_options.html.erb

@@ -1,45 +0,0 @@
-<%= pb_rails("select", props: {
-  id:"color_context_2",
-  label: "Choose a Color",
-  name: "color_name",
-  options: [
-    { value: "red", value_text: "Red" },
-    { value: "blue", value_text: "Blue" },
-    { value: "green", value_text: "Green" }
-  ],
-}) %>
-
-<%= pb_rails("typeahead", props: {
-  label: "Pick a Shade",
-  is_multi: false,
-  search_context_selector: "color_context_2",
-  options_by_context: {
-    "red":  [
-      { label: "Scarlet", value: "scarlet" },
-      { label: "Mahogany", value: "mahogany" },
-      { label: "Crimson", value: "crimson" }
-    ],
-    "blue": [
-      { label: "Sky Blue", value: "sky" },
-      { label: "Cerulean", value: "cerulean" },
-      { label: "Navy", value: "navy" }
-    ],
-    "green": [
-      { label: "Emerald", value: "emerald" },
-      { label: "Mint", value: "mint" },
-      { label: "Olive", value: "olive" }
-    ]
-  },
-  id: "typeahead-dynamic-options",
-}) %>
-
-
-<%= javascript_tag defer: "defer" do %>
-  document.addEventListener("pb-typeahead-kit-typeahead-dynamic-options-result-option-select", function(event) {
-    console.log('Single Option selected')
-    console.dir(event.detail)
-  })
-  document.addEventListener("pb-typeahead-kit-typeahead-dynamic-options-result-clear", function() {
-    console.log('All options cleared')
-  })
-<% end %>

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_dynamic_options.md

@@ -1,5 +0,0 @@
-You can also set up a typeahead to render options dynamically based on input from a select. To achieve this:
-- The typeahead must have a unique `id`
-- Use the `search_context_selector` prop on the typeahead. The value here must match the id of the select so the Typeahead knows where to read the current "context" from.
-- Use `options_by_context` to pass in a hash whose keys match the possible values of your “context” select. Each key maps to an array of { label, value } objects. The typeahead automatically displays only the subset of options matching the current context.
-- Additionally, the optional `clear_on_context_change` prop controls whether the typeahead clears or not when a change happens in the linked select. This prop is set to true by default so that whenever a selection is made in the select, the Typeahead automatically clears its current input/selection.

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_dynamic_options_pure_rails.html.erb

@@ -1,33 +0,0 @@
-<%= pb_rails("select", props: {
-  id:"color_context",
-  label: "Choose a Color",
-  name: "color_name_2",
-  options: [
-    { value: "red", value_text: "Red" },
-    { value: "blue", value_text: "Blue" },
-    { value: "green", value_text: "Green" }
-  ],
-}) %>
-
-<%= pb_rails("typeahead", props: {
-  label: "Pick a Shade",
-  search_context_selector: "color_context",
-  options_by_context: {
-    "red":  [
-      { label: "Scarlet", value: "scarlet" },
-      { label: "Mahogany", value: "mahogany" },
-      { label: "Crimson", value: "crimson" }
-    ],
-    "blue": [
-      { label: "Sky Blue", value: "sky" },
-      { label: "Cerulean", value: "cerulean" },
-      { label: "Navy", value: "navy" }
-    ],
-    "green": [
-      { label: "Emerald", value: "emerald" },
-      { label: "Mint", value: "mint" },
-      { label: "Olive", value: "olive" }
-    ]
-  },
-  search_term_minimum_length: 0,
-}) %>

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_dynamic_options_pure_rails.md

@@ -1,3 +0,0 @@
-The dynamic rendering of options for the typeahead can also be achieved with a pure Rails implementation (not react rendered). For this implementation, use all the props as above with the following additions:
-
-- `search_term_minimum_length`: this sets the minimum input in the typeahead needed to display the dropdown. This is set to 3 by default. Set it to 0 for the dropdown to always display when the typeahead is interacted with. 

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.jsx

@@ -1,66 +0,0 @@
-import React from 'react'
-
-import { Typeahead, Title } from 'playbook-ui'
-import { useForm } from 'react-hook-form'
-
-const languages = [
-  { label: 'JavaScript', value: '1995', category: 'Web Development' },
-  { label: 'Python', value: '1991', category: 'General Purpose' },
-  { label: 'Java', value: '1995', category: 'Enterprise' },
-  { label: 'C++', value: '1985', category: 'Systems Programming' },
-  { label: 'Go', value: '2009', category: 'Systems Programming' },
-  { label: 'Rust', value: '2010', category: 'Systems Programming' },
-  { label: 'Swift', value: '2014', category: 'Mobile Development' },
-  { label: 'Kotlin', value: '2011', category: 'Mobile Development' },
-  { label: 'Ruby', value: '1995', category: 'General Purpose' },
-  { label: 'PHP', value: '1995', category: 'Web Development' },
-]
-
-const colors = [
-  { label: 'Orange', value: '#FFA500' },
-  { label: 'Red', value: '#FF0000' },
-  { label: 'Green', value: '#00FF00' },
-  { label: 'Blue', value: '#0000FF' },
-]
-
-const TypeaheadReactHook = (props) => {
-  const { register, watch } = useForm()
-
-  const selectedLanguages = watch('languages')
-  const selectedColor = watch('color')
-
-  return (
-    <>
-      <Typeahead
-          isMulti
-          label="Multi Select Languages"
-          multiKit="language"
-          options={languages}
-          {...props}
-          {...register('languages')}
-      />
-      <Title 
-          size={4} 
-          text='Selected Languages' 
-      />
-      {selectedLanguages && selectedLanguages.map(language => (
-        <p key={language.label}>{`${language.label} - ${language.value} - ${language.category}`}</p>
-      ))}
-
-      <Typeahead
-          label="Colors"
-          marginTop="lg"
-          options={colors}
-          {...props}
-          {...register('color')}
-      />
-      <Title 
-          size={4} 
-          text='Selected Color' 
-      />
-      <p>{ selectedColor && `${selectedColor.label} - ${selectedColor.value}`}</p>
-    </>
-  )
-}
-
-export default TypeaheadReactHook

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.md

@@ -1 +0,0 @@
-You can pass `react-hook-form` props to the Typeahead kit.

data/app/pb_kits/playbook/utilities/object.test.js

@@ -1,237 +0,0 @@
-import { isEmpty, get, isString, uniqueId, omitBy, noop, merge, filter, find, partial } from './object';
-
-describe('Lodash functions', () => {
-  describe('isEmpty', () => {
-    test('returns true for empty objects', () => {
-      expect(isEmpty({})).toBe(true);
-    });
-    test('returns true for empty arrays', () => {
-      expect(isEmpty([])).toBe(true);
-    });
-    test('returns false for non-empty objects', () => {
-      expect(isEmpty({ a: 1 })).toBe(false);
-    });
-    test('returns false for non-empty arrays', () => {
-      expect(isEmpty([1])).toBe(false);
-    });
-    test('returns true for null and undefined', () => {
-      expect(isEmpty(null)).toBe(true);
-      expect(isEmpty(undefined)).toBe(true);
-    });
-    test('returns false for non-object, non-array values', () => {
-      expect(isEmpty("hello")).toBe(false);
-      expect(isEmpty(123)).toBe(false);
-    });
-  });
-
-  describe('get', () => {
-    const obj = { a: { b: { c: 42 } }, arr: [{ x: 1 }, { y: 2 }] };
-
-    test('retrieves nested properties by dot path', () => {
-      expect(get(obj, 'a.b.c')).toBe(42);
-    });
-    test('returns default value if path does not exist', () => {
-      expect(get(obj, 'a.b.d', 'default')).toBe('default');
-    });
-    test('retrieves array values using bracket notation', () => {
-      expect(get(obj, 'arr[1].y')).toBe(2);
-    });
-    test('returns default for non-existent paths', () => {
-      expect(get(obj, 'non.existent.path', null)).toBe(null);
-    });
-  });
-
-  describe('isString', () => {
-    test('returns true for string literal', () => {
-      expect(isString('test')).toBe(true);
-    });
-    test('returns true for String object', () => {
-      expect(isString(new String('test'))).toBe(true);
-    });
-    test('returns false for non-string values', () => {
-      expect(isString(123)).toBe(false);
-      expect(isString(null)).toBe(false);
-      expect(isString({ a: 1 })).toBe(false);
-      expect(isString([ 'a','b','c' ])).toBe(false);
-    });
-  });
-
-  describe('uniqueId', () => {
-    test('generates unique ids without prefix', () => {
-      const id1 = uniqueId();
-      const id2 = uniqueId();
-      expect(id1).not.toBe(id2);
-      expect(Number(id1)).toBeLessThan(Number(id2));
-    });
-    test('generates unique ids with prefix', () => {
-      const id1 = uniqueId('id_');
-      const id2 = uniqueId('id_');
-      const id3 = uniqueId('id_');
-      expect(id1).not.toBe(id2);
-      expect(id1).not.toBe(id3);
-      expect(id2).not.toBe(id3);
-      expect(id1.startsWith('id_')).toBe(true);
-      expect(id2.startsWith('id_')).toBe(true);
-      expect(id3.startsWith('id_')).toBe(true);
-    });
-  });
-
-  describe('omitBy', () => {
-    test('omits keys for which predicate returns true', () => {
-      const obj = { a: 1, b: 2, c: 3 };
-      const isEven = value => value % 2 === 0;
-      const noEvenValues = omitBy(obj, isEven);
-      expect(noEvenValues).toEqual({ a: 1, c: 3 });
-    });
-    test('returns empty object for null input', () => {
-      expect(omitBy(null, () => true)).toEqual({});
-    });
-    test('returns empty object for non-object input', () => {
-      expect(omitBy("string", () => true)).toEqual({});
-    });
-    test('returns original object if predicate returns false for all keys', () => {
-      const obj = { a: 1, b: 2 };
-      const isBiggerThanFive = value => value >= 4;
-      const objWithSmallValues = omitBy(obj, isBiggerThanFive);
-      expect(objWithSmallValues).toEqual(obj);
-    });
-  });
-
-  describe('noop', () => {
-    test('should do nothing and return undefined', () => {
-      expect(noop()).toBeUndefined();
-    });
-  });
-
-  describe('merge', () => {
-    test('merges two objects correctly', () => {
-      const obj1 = { a: 1, b: { x: 10 } };
-      const obj2 = { b: { y: 20 }, c: 3 };
-      expect(merge(obj1, obj2)).toEqual({ a: 1, b: { x: 10, y: 20 }, c: 3 });
-    });
-
-    test('when keys repeat use last occurrence value', () => {
-      const obj1 = { a: 1 };
-      const obj2 = { b: 2 };
-      const obj3 = { a: 3, c: 4 };
-      expect(merge(obj1, obj2, obj3)).toEqual({ a: 3, b: 2, c: 4 });
-    });
-
-    test('ignores non-object arguments', () => {
-      expect(merge(null, { a: 1 })).toEqual({ a: 1 });
-      expect(merge(undefined, { a: 1 })).toEqual({ a: 1 });
-    });
-  });
-
-  describe('filter', () => {
-    test('filters an array using a function predicate', () => {
-      const arr = [1, 2, 3, 4, 5];
-      const isEven = (n) => n % 2 === 0;
-      expect(filter(arr, isEven)).toEqual([2, 4]);
-    });
-
-    test('filters an array using a string predicate', () => {
-      const arr = [
-        { active: true, name: 'John' },
-        { active: false, name: 'Jane' },
-        { active: true, name: 'Doe' }
-      ];
-      expect(filter(arr, 'active')).toEqual([
-        { active: true, name: 'John' },
-        { active: true, name: 'Doe' }
-      ]);
-    });
-
-    test('filters an array using an array predicate', () => {
-      const arr = [
-        { type: 'fruit', name: 'apple' },
-        { type: 'vegetable', name: 'carrot' },
-        { type: 'fruit', name: 'banana' }
-      ];
-      expect(filter(arr, ['type', 'fruit'])).toEqual([
-        { type: 'fruit', name: 'apple' },
-        { type: 'fruit', name: 'banana' }
-      ]);
-    });
-
-    test('filters an array using an object predicate', () => {
-      const arr = [
-        { type: 'fruit', name: 'apple', color: 'red' },
-        { type: 'fruit', name: 'banana', color: 'yellow' },
-        { type: 'vegetable', name: 'carrot', color: 'orange' }
-      ];
-      expect(filter(arr, { type: 'fruit', color: 'red' })).toEqual([
-        { type: 'fruit', name: 'apple', color: 'red' }
-      ]);
-    });
-  });
-
-  describe('find', () => {
-    test('finds an element using a function predicate', () => {
-      const arr = [1, 2, 3, 4, 5];
-      const greaterThanThree = (n) => n > 3;
-      expect(find(arr, greaterThanThree)).toBe(4);
-    });
-
-    test('finds an element using a string predicate', () => {
-      const arr = [
-        { active: false, name: 'John' },
-        { active: true, name: 'Jane' },
-        { active: true, name: 'Doe' }
-      ];
-      expect(find(arr, 'active')).toEqual({ active: true, name: 'Jane' });
-    });
-
-    test('finds an element using an array predicate', () => {
-      const arr = [
-        { type: 'fruit', name: 'apple' },
-        { type: 'vegetable', name: 'carrot' },
-        { type: 'fruit', name: 'banana' }
-      ];
-      expect(find(arr, ['type', 'vegetable'])).toEqual({ type: 'vegetable', name: 'carrot' });
-    });
-
-    test('finds an element using an object predicate', () => {
-      const arr = [
-        { type: 'fruit', name: 'apple', color: 'red' },
-        { type: 'fruit', name: 'banana', color: 'yellow' },
-        { type: 'vegetable', name: 'carrot', color: 'orange' }
-      ];
-      expect(find(arr, { name: 'banana', color: 'yellow' })).toEqual({ type: 'fruit', name: 'banana', color: 'yellow' });
-    });
-
-    test('returns undefined if no element matches', () => {
-      const arr = [{ id: 1 }, { id: 2 }];
-      expect(find(arr, { id: 3 })).toBeUndefined();
-    });
-  });
-
-  describe('partial', () => {
-    function add(a, b, c) {
-      return a + b + c;
-    }
-
-    test('partials arguments without placeholders', () => {
-      const add5 = partial(add, 2, 3);
-      expect(add5(4)).toBe(9);
-    });
-
-    test('partials arguments with placeholders', () => {
-      const addWithPlaceholder = partial(add, partial.placeholder, 3, partial.placeholder);
-      expect(addWithPlaceholder(2, 4)).toBe(9);
-    });
-
-    test('returns correct result when all arguments are pre-filled', () => {
-      const addAll = partial(add, 1, 2, 3);
-      expect(addAll()).toBe(6);
-    });
-
-    test('appends extra arguments when provided', () => {
-      function join(...args) {
-        return args.join('_');
-      }
-      const joinPartial = partial(join, 'a');
-      expect(joinPartial('b', 'c')).toBe('a_b_c');
-    });
-  });
-});