@gitlab/ui 72.11.1 → 72.12.0

package/dist/components/utilities/friendly_wrap/friendly_wrap.js

@@ -1,75 +0,0 @@
-import { intersperse } from '../../../utils/data_utils';
-import { splitAfterSymbols } from '../../../utils/string_utils';
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-var script = {
-  name: 'GlFriendlyWrap',
-  functional: true,
-  props: {
-    /**
-     * Text to be wrapped.
-     */
-    text: {
-      type: String,
-      required: true
-    },
-    /**
-     * A list of strings representing the break-words.
-     */
-    symbols: {
-      type: Array,
-      required: false,
-      default: () => ['/']
-    }
-  },
-  render(createElement, _ref) {
-    let {
-      props
-    } = _ref;
-    const {
-      symbols,
-      text
-    } = props;
-    const textParts = splitAfterSymbols(symbols, text !== null && text !== void 0 ? text : '');
-    const content = intersperse(() => createElement('wbr'), textParts);
-    return createElement('span', {
-      class: 'text-break'
-    }, content);
-  }
-};
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-
-  /* style */
-  const __vue_inject_styles__ = undefined;
-  /* scoped */
-  const __vue_scope_id__ = undefined;
-  /* module identifier */
-  const __vue_module_identifier__ = undefined;
-  /* functional template */
-  const __vue_is_functional_template__ = undefined;
-  /* style inject */
-  
-  /* style inject SSR */
-  
-  /* style inject shadow dom */
-  
-
-  
-  const __vue_component__ = __vue_normalize__(
-    {},
-    __vue_inject_styles__,
-    __vue_script__,
-    __vue_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/dist/components/utilities/intersection_observer/intersection_observer.js

@@ -1,88 +0,0 @@
-import memoize from 'lodash/memoize';
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-const getObserver = memoize(options => new IntersectionObserver(entries => {
-  entries.forEach(entry => {
-    entry.target.$_gl_intersectionHandler(entry);
-  });
-}, options || {}));
-var script = {
-  name: 'GlIntersectionObserver',
-  props: {
-    /**
-     * Extra options to pass directly to the intersection observer API.
-     */
-    options: {
-      type: Object,
-      required: false,
-      default: null
-    }
-  },
-  mounted() {
-    const observer = getObserver(this.options);
-    this.$el.$_gl_intersectionHandler = entry => {
-      /**
-       * Emitted when the element's visibility changes
-       */
-      this.$emit('update', entry);
-      if (entry.isIntersecting) {
-        /**
-         * Emitted when the element appears on the page
-         */
-        this.$emit('appear');
-      } else {
-        /**
-         * Emitted when the element disappears from the page
-         */
-        this.$emit('disappear');
-      }
-    };
-    this.$el.$_gl_intersectionObserver = observer;
-    observer.observe(this.$el);
-  },
-  destroyed() {
-    this.$el.$_gl_intersectionObserver.unobserve(this.$el);
-    delete this.$el.$_gl_intersectionHandler;
-    delete this.$el.$_gl_intersectionObserver;
-  },
-  // Expose getObserver method for tests
-  getObserver
-};
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_vm._t("default")],2)};
-var __vue_staticRenderFns__ = [];
-
-  /* style */
-  const __vue_inject_styles__ = undefined;
-  /* scoped */
-  const __vue_scope_id__ = undefined;
-  /* module identifier */
-  const __vue_module_identifier__ = undefined;
-  /* functional template */
-  const __vue_is_functional_template__ = false;
-  /* style inject */
-  
-  /* style inject SSR */
-  
-  /* style inject shadow dom */
-  
-
-  
-  const __vue_component__ = __vue_normalize__(
-    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
-    __vue_inject_styles__,
-    __vue_script__,
-    __vue_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/dist/components/utilities/intersperse/intersperse.js

@@ -1,86 +0,0 @@
-import compose from 'lodash/fp/compose';
-import fill from 'lodash/fp/fill';
-import filter from 'lodash/fp/filter';
-import { insert, intersperse } from '../../../utils/data_utils';
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-//
-const containsWhitespaceOnly = vNode => vNode.text.trim() === '';
-const isTag = vNode => typeof vNode.tag === 'string';
-const filterWhitespaceNodes = filter(vNode => isTag(vNode) || !containsWhitespaceOnly(vNode));
-const insertAfterSecondLastItem = insert(-1);
-const replaceSecondLastItem = fill(-2, -1);
-
-// handles the addition of the lastSeparator in these two cases:
-// item1, item2, item3 => item1, item2, and item3
-// item1, item2 => item1 and item2
-const addLastSeparator = lastSeparator => items => {
-  if (!lastSeparator) {
-    return items;
-  }
-  return items.length > 3 ? insertAfterSecondLastItem(lastSeparator, items) : replaceSecondLastItem(lastSeparator, items);
-};
-var script = {
-  name: 'GlIntersperse',
-  functional: true,
-  props: {
-    separator: {
-      type: String,
-      default: ', ',
-      required: false
-    },
-    lastSeparator: {
-      type: String,
-      default: '',
-      required: false
-    }
-  },
-  render(createElement, context) {
-    const {
-      props: {
-        separator,
-        lastSeparator
-      },
-      slots,
-      data
-    } = context;
-    const filterAndSeparate = compose(addLastSeparator(lastSeparator), intersperse(separator), filterWhitespaceNodes);
-    return createElement('span', data, filterAndSeparate(slots().default));
-  }
-};
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-
-  /* style */
-  const __vue_inject_styles__ = undefined;
-  /* scoped */
-  const __vue_scope_id__ = undefined;
-  /* module identifier */
-  const __vue_module_identifier__ = undefined;
-  /* functional template */
-  const __vue_is_functional_template__ = undefined;
-  /* style inject */
-  
-  /* style inject SSR */
-  
-  /* style inject shadow dom */
-  
-
-  
-  const __vue_component__ = __vue_normalize__(
-    {},
-    __vue_inject_styles__,
-    __vue_script__,
-    __vue_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/dist/components/utilities/sprintf/sprintf.js

@@ -1,172 +0,0 @@
-import has from 'lodash/has';
-import isString from 'lodash/isString';
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-//
-const PREFIX = '%{';
-const SUFFIX = '}';
-const START_SUFFIX = 'Start';
-const END_SUFFIX = 'End';
-const PLACE_HOLDER_REGEX = new RegExp(`(${PREFIX}[a-z]+[\\w-]*[a-z0-9]+${SUFFIX})`, 'gi');
-function groupPlaceholdersByStartTag() {
-  let placeholders = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return Object.entries(placeholders).reduce((acc, _ref) => {
-    let [slotName, [startTag, endTag]] = _ref;
-    acc[startTag] = {
-      slotName,
-      endTag
-    };
-    return acc;
-  }, {});
-}
-function getPlaceholderDefinition(chunk, placeholdersByStartTag) {
-  const tagName = chunk.slice(PREFIX.length, -SUFFIX.length);
-  if (has(placeholdersByStartTag, tagName)) {
-    // Use provided custom placeholder definition
-    return {
-      ...placeholdersByStartTag[tagName],
-      tagName
-    };
-  }
-  if (tagName.endsWith(START_SUFFIX)) {
-    // Tag conforms to default start/end tag naming convention
-    const slotName = tagName.slice(0, -START_SUFFIX.length);
-    return {
-      slotName,
-      endTag: `${slotName}${END_SUFFIX}`,
-      tagName
-    };
-  }
-  return {
-    slotName: tagName,
-    endTag: undefined,
-    tagName
-  };
-}
-var script = {
-  name: 'GlSprintf',
-  functional: true,
-  props: {
-    /**
-     * A translated string with named placeholders, e.g., "Written by %{author}".
-     */
-    message: {
-      type: String,
-      required: true
-    },
-    /**
-     * An object mapping slot names to custom start/end placeholders. Use this
-     * to avoid changing an existing message, and in turn invalidating existing
-     * translations, in the case it uses non-default placeholders.
-     */
-    placeholders: {
-      type: Object,
-      required: false,
-      default: undefined,
-      validator: value => Object.values(value).every(
-      // eslint-disable-next-line unicorn/no-array-callback-reference
-      tagPair => Array.isArray(tagPair) && tagPair.length === 2 && tagPair.every(isString))
-    }
-  },
-  /**
-   * Available slots are determined by the placeholders in the provided
-   * message prop. For example, a message of "Written by %{author}" has
-   * a slot called "author", and its content is used to replace "%{author}"
-   * in the rendered output. When two placeholders indicate a start and an
-   * end region in the message, e.g., "%{linkStart}foo%{linkEnd}", the common
-   * base name can be used as a scoped slot, where the content between the
-   * placeholders is passed via the `content` scoped slot prop.
-   * @slot * (arbitrary)
-   * @binding {string} content The content to place between start and end placeholders.
-   */
-  render(createElement, context) {
-    // While a functional style is generally preferred, an imperative style is
-    // used here, as it lends itself better to the message parsing algorithm.
-    // This approach is also more performant, as it minimizes (relatively) object
-    // creation/garbage collection, which is important given how frequently this
-    // code may run on a given page.
-
-    let i = 0;
-    const vnodes = [];
-    const slots = context.scopedSlots;
-    const chunks = context.props.message.split(PLACE_HOLDER_REGEX);
-    const placeholdersByStartTag = groupPlaceholdersByStartTag(context.props.placeholders);
-    while (i < chunks.length) {
-      const chunk = chunks[i];
-      // Skip past this chunk now we have it
-      i += 1;
-      if (!PLACE_HOLDER_REGEX.test(chunk)) {
-        // Not a placeholder, so pass through as-is
-        vnodes.push(chunk);
-        continue;
-      }
-      const {
-        slotName,
-        endTag,
-        tagName
-      } = getPlaceholderDefinition(chunk, placeholdersByStartTag);
-      if (endTag) {
-        // Peek ahead to find end placeholder, if any
-        const indexOfEnd = chunks.indexOf(`${PREFIX}${endTag}${SUFFIX}`, i);
-        if (indexOfEnd > -1) {
-          // We have a valid start/end placeholder pair! Extract the content
-          // between them and skip past the end placeholder
-          const content = chunks.slice(i, indexOfEnd);
-          i = indexOfEnd + 1;
-          if (!has(slots, slotName)) {
-            // Slot hasn't been provided; return placeholders and content as-is
-            vnodes.push(chunk, ...content, chunks[indexOfEnd]);
-            continue;
-          }
-
-          // Provide content to provided scoped slot
-          vnodes.push(slots[slotName]({
-            content: content.join('')
-          }));
-          continue;
-        }
-      }
-
-      // By process of elimination, chunk must be a plain placeholder
-      vnodes.push(has(slots, tagName) ? slots[tagName]() : chunk);
-      continue;
-    }
-    return vnodes;
-  }
-};
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-
-  /* style */
-  const __vue_inject_styles__ = undefined;
-  /* scoped */
-  const __vue_scope_id__ = undefined;
-  /* module identifier */
-  const __vue_module_identifier__ = undefined;
-  /* functional template */
-  const __vue_is_functional_template__ = undefined;
-  /* style inject */
-  
-  /* style inject SSR */
-  
-  /* style inject shadow dom */
-  
-
-  
-  const __vue_component__ = __vue_normalize__(
-    {},
-    __vue_inject_styles__,
-    __vue_script__,
-    __vue_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/dist/components/utilities/truncate/constants.js

@@ -1,7 +0,0 @@
-const POSITION = {
-  START: 'start',
-  MIDDLE: 'middle',
-  END: 'end'
-};
-
-export { POSITION };

package/dist/components/utilities/truncate/truncate.js

@@ -1,111 +0,0 @@
-import { GlTooltipDirective } from '../../../directives/tooltip';
-import { GlResizeObserverDirective } from '../../../directives/resize_observer/resize_observer';
-import { POSITION } from './constants';
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-//
-var script = {
-  name: 'GlTruncate',
-  POSITION,
-  directives: {
-    GlTooltip: GlTooltipDirective,
-    GlResizeObserver: GlResizeObserverDirective
-  },
-  props: {
-    /**
-     * Text to be ellipsized
-     */
-    text: {
-      type: String,
-      required: true
-    },
-    /**
-     * Ellipsis position
-     */
-    position: {
-      type: String,
-      required: false,
-      default: POSITION.END,
-      validator: value => Object.values(POSITION).includes(value)
-    },
-    /**
-     * Display the full text in a tooltip only if it is being truncated
-     */
-    withTooltip: {
-      type: Boolean,
-      required: false,
-      default: false
-    }
-  },
-  data() {
-    return {
-      isTruncated: false
-    };
-  },
-  computed: {
-    middleIndex() {
-      return Math.floor(this.text.length / 2);
-    },
-    first() {
-      return this.text.slice(0, this.middleIndex);
-    },
-    last() {
-      return this.text.slice(this.middleIndex);
-    },
-    isTooltipDisabled() {
-      return !this.withTooltip || !this.isTruncated;
-    }
-  },
-  watch: {
-    withTooltip(withTooltip) {
-      if (withTooltip) {
-        this.checkTruncationState();
-      }
-    }
-  },
-  methods: {
-    checkTruncationState() {
-      if (this.withTooltip) {
-        this.isTruncated = this.$refs.text.scrollWidth > this.$refs.text.offsetWidth;
-      }
-    }
-  }
-};
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.position === _vm.$options.POSITION.START)?_c('span',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip",value:({ disabled: _vm.isTooltipDisabled }),expression:"{ disabled: isTooltipDisabled }"},{name:"gl-resize-observer",rawName:"v-gl-resize-observer:[withTooltip]",value:(_vm.checkTruncationState),expression:"checkTruncationState",arg:_vm.withTooltip}],staticClass:"gl-truncate",attrs:{"title":_vm.text}},[_c('span',{ref:"text",staticClass:"gl-truncate-start gl-text-overflow-ellipsis!"},[_vm._v("‎"+_vm._s(_vm.text)+"‎")])]):(_vm.position === _vm.$options.POSITION.MIDDLE)?_c('span',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip",value:({ disabled: _vm.isTooltipDisabled }),expression:"{ disabled: isTooltipDisabled }"},{name:"gl-resize-observer",rawName:"v-gl-resize-observer:[withTooltip]",value:(_vm.checkTruncationState),expression:"checkTruncationState",arg:_vm.withTooltip}],staticClass:"gl-truncate",attrs:{"title":_vm.text}},[_c('span',{ref:"text",staticClass:"gl-truncate-end"},[_vm._v(_vm._s(_vm.first))]),_c('span',{staticClass:"gl-truncate-start"},[_vm._v("‎"+_vm._s(_vm.last)+"‎")])]):_c('span',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip",value:({ disabled: _vm.isTooltipDisabled }),expression:"{ disabled: isTooltipDisabled }"},{name:"gl-resize-observer",rawName:"v-gl-resize-observer:[withTooltip]",value:(_vm.checkTruncationState),expression:"checkTruncationState",arg:_vm.withTooltip}],staticClass:"gl-truncate",attrs:{"data-testid":"truncate-end-container","title":_vm.text}},[_c('span',{ref:"text",staticClass:"gl-truncate-end"},[_vm._v(_vm._s(_vm.text))])])};
-var __vue_staticRenderFns__ = [];
-
-  /* style */
-  const __vue_inject_styles__ = undefined;
-  /* scoped */
-  const __vue_scope_id__ = undefined;
-  /* module identifier */
-  const __vue_module_identifier__ = undefined;
-  /* functional template */
-  const __vue_is_functional_template__ = false;
-  /* style inject */
-  
-  /* style inject SSR */
-  
-  /* style inject shadow dom */
-  
-
-  
-  const __vue_component__ = __vue_normalize__(
-    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
-    __vue_inject_styles__,
-    __vue_script__,
-    __vue_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;

package/dist/components/utilities/truncate_text/constants.js

@@ -1,7 +0,0 @@
-const STATES = {
-  INITIAL: 'initial',
-  TRUNCATED: 'truncated',
-  EXTENDED: 'extended'
-};
-
-export { STATES };

package/dist/components/utilities/truncate_text/truncate_text.js

@@ -1,146 +0,0 @@
-import { GlResizeObserverDirective } from '../../../directives/resize_observer/resize_observer';
-import GlButton from '../../base/button/button';
-import { STATES } from './constants';
-import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
-
-var script = {
-  name: 'GlTruncateText',
-  components: {
-    GlButton
-  },
-  directives: {
-    GlResizeObserver: GlResizeObserverDirective
-  },
-  props: {
-    /**
-     * The text for the 'Show more' button
-     */
-    showMoreText: {
-      type: String,
-      required: false,
-      default: 'Show more'
-    },
-    /**
-     * The text for the 'Show less' button
-     */
-    showLessText: {
-      type: String,
-      required: false,
-      default: 'Show less'
-    },
-    /**
-     * The number of lines that are initially visible on larger screens
-     */
-    lines: {
-      type: Number,
-      required: false,
-      default: 3
-    },
-    /**
-     * The number of lines that are initially visible on smaller screens
-     */
-    mobileLines: {
-      type: Number,
-      required: false,
-      default: 10
-    },
-    /**
-     * Props that are passed to the toggle button
-     */
-    toggleButtonProps: {
-      type: Object,
-      required: false,
-      default() {
-        return {};
-      }
-    }
-  },
-  data() {
-    return {
-      state: STATES.INITIAL
-    };
-  },
-  computed: {
-    showTruncationToggle() {
-      return this.isTruncated || this.isExtended;
-    },
-    truncationToggleText() {
-      return this.isTruncated ? this.showMoreText : this.showLessText;
-    },
-    cssVariables() {
-      return {
-        '--lines': this.lines,
-        '--mobile-lines': this.mobileLines
-      };
-    },
-    truncationClasses() {
-      return this.isExtended ? null : 'gl-truncate-text gl-overflow-hidden';
-    },
-    ariaExpanded() {
-      return (!this.isTruncated).toString();
-    },
-    isTruncated() {
-      return this.state === STATES.TRUNCATED;
-    },
-    isExtended() {
-      return this.state === STATES.EXTENDED;
-    }
-  },
-  methods: {
-    onResize(_ref) {
-      let {
-        target
-      } = _ref;
-      if (target.scrollHeight > target.offsetHeight) {
-        this.state = STATES.TRUNCATED;
-      } else if (this.isTruncated) {
-        this.state = STATES.INITIAL;
-      }
-    },
-    toggleTruncation() {
-      if (this.isTruncated) {
-        this.state = STATES.EXTENDED;
-      } else if (this.isExtended) {
-        this.state = STATES.TRUNCATED;
-      }
-    }
-  }
-};
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('section',[_c('article',{directives:[{name:"gl-resize-observer",rawName:"v-gl-resize-observer",value:(_vm.onResize),expression:"onResize"}],class:_vm.truncationClasses,style:(_vm.cssVariables),attrs:{"aria-expanded":_vm.ariaExpanded}},[_vm._t("default")],2),_vm._v(" "),(_vm.showTruncationToggle)?_c('gl-button',_vm._b({attrs:{"variant":"link"},on:{"click":_vm.toggleTruncation}},'gl-button',_vm.toggleButtonProps,false),[_vm._v(_vm._s(_vm.truncationToggleText))]):_vm._e()],1)};
-var __vue_staticRenderFns__ = [];
-
-  /* style */
-  const __vue_inject_styles__ = undefined;
-  /* scoped */
-  const __vue_scope_id__ = undefined;
-  /* module identifier */
-  const __vue_module_identifier__ = undefined;
-  /* functional template */
-  const __vue_is_functional_template__ = false;
-  /* style inject */
-  
-  /* style inject SSR */
-  
-  /* style inject shadow dom */
-  
-
-  
-  const __vue_component__ = __vue_normalize__(
-    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
-    __vue_inject_styles__,
-    __vue_script__,
-    __vue_scope_id__,
-    __vue_is_functional_template__,
-    __vue_module_identifier__,
-    false,
-    undefined,
-    undefined,
-    undefined
-  );
-
-export default __vue_component__;