@citizenplane/pimp 8.26.1 → 8.27.0

package/src/helpers/object.ts

@@ -0,0 +1,9 @@
+export const isObject = (value: unknown): value is Record<string, unknown> => {
+  return value !== null && typeof value === 'object'
+}
+
+export const isEmpty = (obj: unknown): boolean => {
+  if (!isObject(obj)) return true
+
+  return Reflect.ownKeys(obj).length === 0 && (obj as { constructor: unknown }).constructor === Object
+}

package/src/helpers/string/src/camelize.ts

@@ -0,0 +1,6 @@
+export default function camelize(input: string): string {
+  return input.replace(/^[\w]|[A-Z]|\b\w|\s+/g, (match, index: number) => {
+    if (+match === 0) return ''
+    return index === 0 ? match.toLowerCase() : match.toUpperCase()
+  })
+}

package/src/helpers/string/src/{decamelize.js → decamelize.ts}

@@ -1,4 +1,4 @@
-export default function decamelize(camelCasedString, separator = ' ') {
+export default function decamelize(camelCasedString: string, separator = ' '): string {
   return camelCasedString
     .replace(/([a-z\d])([A-Z])/g, `$1${separator}$2`)
     .replace(/([A-Z]+)([A-Z][a-z\d]+)/g, `$1${separator}$2`)

package/src/libs/CoreDatepicker.vue

@@ -126,14 +126,14 @@
   </transition>
 </template>
 
-<script>
+<script lang="ts">
 import { DateTime, Info } from 'luxon'
 
-import { randomString } from '@/helpers'
-import ResizeSelect from '@/directives/ResizeSelect'
-
 import CpIcon from '@/components/visual/CpIcon.vue'
 
+import ResizeSelect from '@/directives/ResizeSelect'
+import { randomString } from '@/helpers'
+
 export default {
   name: 'CoreDatepicker',
   components: {

package/src/plugins/toaster.ts

@@ -0,0 +1,71 @@
+import { App, h, render, VNode } from 'vue'
+
+import CpToaster from '@/components/feedback-indicators/CpToaster.vue'
+
+import { Intent } from '@/constants'
+
+type MountOptions = {
+  app?: App | null
+  children?: unknown
+  element?: HTMLElement | null
+  props?: Record<string, unknown>
+}
+
+const createElement = () => (typeof document !== 'undefined' ? document.createElement('div') : null)
+
+const mount = (component: unknown, { props, children, element, app }: MountOptions = {}) => {
+  let el: HTMLElement | null = element ? element : createElement()
+
+  // @ts-expect-error <comment on type error>
+  let vNode: VNode = h(component, props, children)
+  if (app && app._context) {
+    vNode.appContext = app._context
+  }
+
+  render(vNode, el as HTMLElement)
+
+  const destroy = () => {
+    if (el) {
+      render(null, el)
+    }
+    el = null
+    // @ts-expect-error explicit nulling for GC
+    vNode = null
+  }
+
+  return { vNode, destroy, el }
+}
+
+const createToaster = (globalOptions: Record<string, unknown> = {}) => {
+  return {
+    show(options: Record<string, unknown> = {}) {
+      const localOptions = { ...options }
+
+      mount(CpToaster, {
+        props: { ...globalOptions, ...localOptions },
+      })
+    },
+    unique(options: Record<string, unknown> = {}) {
+      options.isUnique = true
+      return this.show(options)
+    },
+    success(options: Record<string, unknown> = {}) {
+      options.type = Intent.SUCCESS.value
+      return this.show(options)
+    },
+    critical(options: Record<string, unknown> = {}) {
+      options.type = Intent.CRITICAL.value
+      return this.show(options)
+    },
+    info(options: Record<string, unknown> = {}) {
+      options.type = Intent.INFO.value
+      return this.show(options)
+    },
+    warning(options: Record<string, unknown> = {}) {
+      options.type = Intent.WARNING.value
+      return this.show(options)
+    },
+  }
+}
+
+export default createToaster

package/src/stories/BaseInputLabel.stories.ts

@@ -1,4 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
+
 import BaseInputLabel from '@/components/core/BaseInputLabel.vue'
 
 const meta = {

package/src/stories/CpAlert.stories.ts

@@ -1,4 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpAlert from '@/components/feedback-indicators/CpAlert.vue'
 
 const meta = {

package/src/stories/CpCheckbox.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpCheckbox from '@/components/toggles/CpCheckbox.vue'
 
 const meta = {

package/src/stories/CpDate.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpDate from '@/components/date-pickers/CpDate.vue'
 
 const meta = {

package/src/stories/CpDatepicker.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpDatepicker from '@/components/date-pickers/CpDatepicker.vue'
 
 const meta = {

package/src/stories/CpDialog.stories.ts

@@ -1,6 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
 
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpDialog from '@/components/atomic-elements/CpDialog.vue'
 
 const meta = {

package/src/stories/CpHeading.stories.ts

@@ -1,4 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpHeading from '@/components/typography/CpHeading.vue'
 
 const meta = {

package/src/stories/CpIcon.stories.ts

@@ -1,5 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpIcon from '@/components/visual/CpIcon.vue'
+
 import { CustomCpIcons } from '@/constants'
 
 const iconsOptions = [

package/src/stories/CpInput.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpInput from '@/components/inputs/CpInput.vue'
 
 const meta = {

package/src/stories/CpLoader.stories.ts

@@ -1,4 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpLoader from '@/components/feedback-indicators/CpLoader.vue'
 
 const meta = {

package/src/stories/CpMultiselect.stories.ts

@@ -1,6 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
 
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpMultiselect from '@/components/selects/CpMultiselect.vue'
 
 const meta = {

package/src/stories/CpPartnerBadge.stories.ts

@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/vue3'
 
 import CpPartnerBadge from '@/components/atomic-elements/CpPartnerBadge.vue'
 
-import { PartnerTypes, Sizes } from '@/utils/constants'
+import { PartnerTypes, Sizes } from '@/constants'
 
 const meta = {
   title: 'CpPartnerBadge',

package/src/stories/CpRadio.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpRadio from '@/components/toggles/CpRadio.vue'
 
 const meta = {

package/src/stories/CpSelect.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpSelect from '@/components/selects/CpSelect.vue'
 
 const meta = {

package/src/stories/CpSelectMenu.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpSelectMenu from '@/components/selects/CpSelectMenu.vue'
 
 const meta = {

package/src/stories/CpSwitch.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpSwitch from '@/components/toggles/CpSwitch.vue'
 
 const meta = {

package/src/stories/CpTable.stories.ts

@@ -1,6 +1,9 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpTable from '@/components/lists-and-table/CpTable.vue'
 
+import { PAGINATION_FORMATS } from '@/constants'
+
 const meta = {
   title: 'CpTable',
   component: CpTable,
@@ -111,7 +114,7 @@ export const WithPagination: Story = {
     pagination: {
       enabled: true,
       limit: 3,
-      format: 'pages',
+      format: PAGINATION_FORMATS.PAGES,
     },
   },
 }
@@ -190,22 +193,26 @@ export const WithCustomRowOptions: Story = {
     enableRowOptions: true,
     rowOptions: [
       {
+        id: 'see',
         label: 'see',
         icon: 'eye',
         action: () => console.log('See'),
       },
       {
+        id: 'edit',
         label: 'edit',
         icon: 'edit-2',
         action: () => console.log('Edit'),
       },
       {
+        id: 'disable',
         label: 'disable',
         icon: 'history',
         disabled: true,
         action: () => console.log('History'),
       },
       {
+        id: 'delete',
         label: 'delete',
         icon: 'trash',
         isCritical: true,

package/src/stories/CpTableEmptyState.stories.ts

@@ -1,4 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpTableEmptyState from '@/components/lists-and-table/CpTableEmptyState.vue'
 
 const meta = {

package/src/stories/CpTextarea.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpTextarea from '@/components/inputs/CpTextarea.vue'
 
 const meta = {

package/src/stories/CpToaster.stories.ts

@@ -1,4 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpToaster from '@/components/feedback-indicators/CpToaster.vue'
 
 const meta = {

package/src/stories/CpTooltip.stories.ts

@@ -1,4 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
+
 import CpTooltip from '@/components/atomic-elements/CpTooltip.vue'
 
 const meta = {

package/src/stories/TransitionExpand.stories.ts

@@ -1,5 +1,7 @@
-import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
+
+import type { Meta, StoryObj } from '@storybook/vue3'
+
 import TransitionExpand from '@/components/helpers-utilities/TransitionExpand.vue'
 
 const meta = {

package/src/types/luxon.d.ts

@@ -0,0 +1 @@
+declare module 'luxon'

package/src/vendors/ff-polyfill.ts

@@ -0,0 +1,38 @@
+// Copy paste from https://gist.github.com/nuxodin/9250e56a3ce6c0446efa
+export default function ffPolyfill(): void {
+  const w = window
+  const d = w.document
+
+  if (w.onfocus === undefined) {
+    d.addEventListener('focus', addPolyfill as EventListener, true)
+    d.addEventListener('blur', addPolyfill as EventListener, true)
+    d.addEventListener('focusin', removePolyfill as EventListener, true)
+    d.addEventListener('focusout', removePolyfill as EventListener, true)
+  }
+
+  function addPolyfill(e: FocusEvent) {
+    const type = e.type === 'focus' ? 'focusin' : 'focusout'
+    const event = new CustomEvent(type, {
+      bubbles: true,
+      cancelable: false,
+    })
+    // @ts-expect-error <comment on type error>
+    event.c1Generated = true
+    ;(e.target as HTMLElement).dispatchEvent(event)
+  }
+
+  function removePolyfill(e: FocusEvent) {
+    // @ts-expect-error <comment on type error>
+    if (!e.c1Generated) {
+      // focus after focusin, so chrome will the first time trigger tow times focusin
+      d.removeEventListener('focus', addPolyfill as EventListener, true)
+      d.removeEventListener('blur', addPolyfill as EventListener, true)
+      d.removeEventListener('focusin', removePolyfill as EventListener, true)
+      d.removeEventListener('focusout', removePolyfill as EventListener, true)
+    }
+    setTimeout(function () {
+      d.removeEventListener('focusin', removePolyfill as EventListener, true)
+      d.removeEventListener('focusout', removePolyfill as EventListener, true)
+    })
+  }
+}

package/vitest.workspace.js

@@ -1,10 +1,8 @@
+import { storybookTest } from '@storybook/experimental-addon-test/vitest-plugin'
 import path from 'node:path'
 import { fileURLToPath } from 'node:url'
-
 import { defineWorkspace } from 'vitest/config'
 
-import { storybookTest } from '@storybook/experimental-addon-test/vitest-plugin'
-
 const dirname = typeof __dirname !== 'undefined' ? __dirname : path.dirname(fileURLToPath(import.meta.url))
 
 // More info at: https://storybook.js.org/docs/writing-tests/test-addon

package/src/constants/src/CpTableConfig.ts

@@ -1,14 +0,0 @@
-const VISIBLE_ROWS_MAX = 100
-
-const RESERVED_KEYS = {
-  GROUP_BY: 'groupBy',
-  FULL_WIDTH: 'fullWidth',
-  IS_SELECTED: 'isSelected',
-}
-
-const PAGINATION_FORMATS = {
-  RESULTS: 'results',
-  PAGES: 'pages',
-}
-
-export default { VISIBLE_ROWS_MAX, RESERVED_KEYS, PAGINATION_FORMATS }

package/src/constants/src/Position.ts

@@ -1,10 +0,0 @@
-export default {
-  TOP: 'top',
-  TOP_LEFT: 'top-left',
-  TOP_RIGHT: 'top-right',
-  BOTTOM: 'bottom',
-  BOTTOM_LEFT: 'bottom-left',
-  BOTTOM_RIGHT: 'bottom-right',
-  LEFT: 'left',
-  RIGHT: 'right',
-}

package/src/constants/src/colors/Colors.ts

@@ -1,10 +0,0 @@
-export default {
-  BLUE: 'blue',
-  GRAY: 'gray',
-  GREEN: 'green',
-  ORANGE: 'orange',
-  PINK: 'pink',
-  PURPLE: 'purple',
-  RED: 'red',
-  YELLOW: 'yellow',
-}

package/src/constants/src/colors/ToggleColors.ts

@@ -1,6 +0,0 @@
-import Colors from './Colors'
-
-export default {
-  BLUE: Colors.BLUE,
-  PURPLE: Colors.PURPLE,
-}

package/src/directives/ClickOutside.js

@@ -1,13 +0,0 @@
-export default {
-  beforeMount(el, binding) {
-    el.clickOutsideEvent = function (event) {
-      if (!(el === event.target || el.contains(event.target))) {
-        binding.value(event, el)
-      }
-    }
-    document.body.addEventListener('click', el.clickOutsideEvent)
-  },
-  unmounted(el) {
-    document.body.removeEventListener('click', el.clickOutsideEvent)
-  },
-}

package/src/helpers/object.js

@@ -1,9 +0,0 @@
-export const isObject = (object) => {
-  return object != null && typeof object === 'object'
-}
-
-export const isEmpty = (obj) => {
-  if (!isObject(obj)) return true
-
-  return Reflect.ownKeys(obj).length === 0 && obj.constructor === Object
-}

package/src/helpers/string/src/camelize.js

@@ -1,6 +0,0 @@
-export default function camelize(string) {
-  return string.replace(/^\w|[A-Z]|\b\w|\s+/g, (match, index) => {
-    if (+match === 0) return '' // or if (/\s+/.test(match)) for white spaces
-    return index === 0 ? match.toLowerCase() : match.toUpperCase()
-  })
-}

package/src/plugins/toaster.js

@@ -1,61 +0,0 @@
-import CpToaster from '@/components/feedback-indicators/CpToaster.vue'
-import { Intent } from '@/utils/constants'
-
-import { h, render } from 'vue'
-
-const createElement = () => typeof document !== 'undefined' && document.createElement('div')
-
-const mount = (component, { props, children, element, app } = {}) => {
-  let el = element ? element : createElement()
-
-  let vNode = h(component, props, children)
-  if (app && app._context) {
-    vNode.appContext = app._context
-  }
-
-  render(vNode, el)
-
-  const destroy = () => {
-    if (el) {
-      render(null, el)
-    }
-    el = null
-    vNode = null
-  }
-
-  return { vNode, destroy, el }
-}
-
-const createToaster = (globalOptions = {}) => {
-  return {
-    show(options = {}) {
-      let localOptions = { ...options }
-
-      mount(CpToaster, {
-        props: { ...globalOptions, ...localOptions },
-      })
-    },
-    unique(options = {}) {
-      options.isUnique = true
-      return this.show(options)
-    },
-    success(options = {}) {
-      options.type = Intent.SUCCESS.value
-      return this.show(options)
-    },
-    critical(options = {}) {
-      options.type = Intent.CRITICAL.value
-      return this.show(options)
-    },
-    info(options = {}) {
-      options.type = Intent.INFO.value
-      return this.show(options)
-    },
-    warning(options = {}) {
-      options.type = Intent.WARNING.value
-      return this.show(options)
-    },
-  }
-}
-
-export default createToaster

package/src/utils/constants/index.js

@@ -1,3 +0,0 @@
-export { default as Intent } from './src/Intent'
-export { default as Sizes } from './src/Sizes'
-export { default as PartnerTypes } from './src/PartnerTypes'

package/src/utils/constants/src/PartnerTypes.js

@@ -1,6 +0,0 @@
-export default {
-  OTA: 'ota',
-  AIRLINE: 'airline',
-  SUPPLIER: 'supplier',
-  THIRDPARTY: 'thirdParty',
-}

package/src/utils/constants/src/Sizes.js

@@ -1,5 +0,0 @@
-export default {
-  XS: 'xs',
-  SM: 'sm',
-  MD: 'md',
-}

package/src/vendors/ff-polyfill.js

@@ -1,36 +0,0 @@
-// Copy paste from https://gist.github.com/nuxodin/9250e56a3ce6c0446efa
-export default function () {
-  var w = window,
-    d = w.document
-
-  if (w.onfocusin === undefined) {
-    d.addEventListener('focus', addPolyfill, true)
-    d.addEventListener('blur', addPolyfill, true)
-    d.addEventListener('focusin', removePolyfill, true)
-    d.addEventListener('focusout', removePolyfill, true)
-  }
-
-  function addPolyfill(e) {
-    var type = e.type === 'focus' ? 'focusin' : 'focusout'
-    var event = new CustomEvent(type, {
-      bubbles: true,
-      cancelable: false,
-    })
-    event.c1Generated = true
-    e.target.dispatchEvent(event)
-  }
-
-  function removePolyfill(e) {
-    if (!e.c1Generated) {
-      // focus after focusin, so chrome will the first time trigger tow times focusin
-      d.removeEventListener('focus', addPolyfill, true)
-      d.removeEventListener('blur', addPolyfill, true)
-      d.removeEventListener('focusin', removePolyfill, true)
-      d.removeEventListener('focusout', removePolyfill, true)
-    }
-    setTimeout(function () {
-      d.removeEventListener('focusin', removePolyfill, true)
-      d.removeEventListener('focusout', removePolyfill, true)
-    })
-  }
-}