Merge pull request #754 from privy-open-source/release/0.19.0

adenvt · web-flow · commit 6205941a48db · 2023-08-15T09:02:12.000Z
release: `0.19.0`
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@privyid/design-system",
-  "version": "0.18.0",
+  "version": "0.19.0",
   "packageManager": "yarn@3.6.1",
   "private": true,
   "scripts": {
diff --git a/packages/browserslist-config/package.json b/packages/browserslist-config/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@privyid/browserslist-config",
   "description": "Browserslist shareable config for Persona project",
-  "version": "0.18.0",
+  "version": "0.19.0",
   "packageManager": "yarn@3.6.1",
   "license": "MIT",
   "repository": {
diff --git a/packages/eslint-config-persona/package.json b/packages/eslint-config-persona/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@privyid/eslint-config-persona",
   "description": "Eslint shareable config for Persona project",
-  "version": "0.18.0",
+  "version": "0.19.0",
   "packageManager": "yarn@3.6.1",
   "license": "MIT",
   "repository": {
diff --git a/packages/persona-icon/package.json b/packages/persona-icon/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@privyid/persona-icon",
   "description": "Persona icon package",
-  "version": "0.18.0",
+  "version": "0.19.0",
   "packageManager": "yarn@3.6.1",
   "type": "module",
   "main": "./dist/module.cjs",
diff --git a/packages/persona/package.json b/packages/persona/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@privyid/persona",
   "description": "Persona core package",
-  "version": "0.18.0",
+  "version": "0.19.0",
   "license": "MIT",
   "repository": {
     "url": "https://github.com/privy-open-source/design-system.git",
diff --git a/packages/tailwind-animation/package.json b/packages/tailwind-animation/package.json
@@ -1,6 +1,7 @@
 {
   "name": "@privyid/tailwind-animation",
-  "version": "0.18.0",
+  "description": "Collection animation class for vue `<transition>`",
+  "version": "0.19.0",
   "packageManager": "yarn@3.6.1",
   "license": "MIT",
   "repository": {
diff --git a/packages/tailwind-extended/package.json b/packages/tailwind-extended/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@privyid/tailwind-extended",
   "description": "Add missing tailwind utilities",
-  "version": "0.18.0",
+  "version": "0.19.0",
   "packageManager": "yarn@3.6.1",
   "license": "MIT",
   "repository": {
diff --git a/packages/tailwind-preset/package.json b/packages/tailwind-preset/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@privyid/tailwind-preset",
   "description": "Tailwind preset for Persona project",
-  "version": "0.18.0",
+  "version": "0.19.0",
   "packageManager": "yarn@3.6.1",
   "license": "MIT",
   "repository": {
diff --git a/src/components/breadcrumbs/Breadcrumb.spec.ts b/src/components/breadcrumbs/Breadcrumb.spec.ts
@@ -52,3 +52,25 @@ it('should be able to render navigation', () => {
   expect(breadcrumbs).toContainElement(dropdown)
   expect(text).toHaveLength(1)
 })
+
+it('should be able to custom divider via slot `divider`', () => {
+  const screen = render({
+    components: { Breadcrumb },
+    template  : `
+    <Breadcrumb :items="items">
+      <template #divider>Custom divider</template>
+    </Breadcrumb>
+    `,
+    setup () {
+      return { items }
+    },
+  })
+
+  const breadcrumbs = screen.queryByTestId('breadcrumbs')
+
+  const dividers = screen.queryAllByTestId('breadcrumbs-divider')
+
+  expect(breadcrumbs).toBeInTheDocument()
+  expect(dividers.length).toBe(2)
+  expect(dividers.at(0).textContent).toEqual('Custom divider')
+})
diff --git a/src/components/breadcrumbs/Breadcrumb.vue b/src/components/breadcrumbs/Breadcrumb.vue
@@ -33,7 +33,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue-demi'
+import { defineComponent, provide } from 'vue-demi'
 import { BreadcrumbItems } from '.'
 import BreadcrumbItem from './BreadcrumbItem.vue'
 import BreadcrumbItemDropdown from './BreadcrumbItemDropdown.vue'
@@ -49,6 +49,10 @@ export default defineComponent({
       default: () => {},
     },
   },
+  setup (_, { slots }) {
+    if (slots.divider)
+      provide('divider', slots.divider)
+  },
 })
 </script>
 
diff --git a/src/components/breadcrumbs/BreadcrumbItem.spec.ts b/src/components/breadcrumbs/BreadcrumbItem.spec.ts
@@ -9,12 +9,12 @@ it('should rendered properly without any props', () => {
     `,
   })
 
-  const breadcrumbItem = screen.getByTestId('breadcrumbs-item')
-  const breadcrumbIcon = screen.queryByTestId('breadcrumbs-icon')
+  const breadcrumbItem    = screen.getByTestId('breadcrumbs-item')
+  const breadcrumbDivider = screen.queryByTestId('breadcrumbs-divider')
 
   expect(breadcrumbItem).toBeInTheDocument()
   expect(breadcrumbItem).toHaveClass('breadcrumbs__item')
-  expect(breadcrumbIcon).toBeInTheDocument()
+  expect(breadcrumbDivider).toBeInTheDocument()
 })
 
 it('should be able to set active via prop `active`', () => {
@@ -25,13 +25,13 @@ it('should be able to set active via prop `active`', () => {
     `,
   })
 
-  const breadcrumbItem = screen.getByTestId('breadcrumbs-item')
-  const dropdownIcon   = screen.queryByTestId('dropdown-icon')
+  const breadcrumbItem  = screen.getByTestId('breadcrumbs-item')
+  const dropdownDivider = screen.queryByTestId('dropdown-divider')
 
   expect(breadcrumbItem).toHaveClass('breadcrumbs__item--active')
   expect(breadcrumbItem).toContainHTML('<span />')
   expect(breadcrumbItem).not.toContainHTML('<a />')
-  expect(dropdownIcon).not.toBeInTheDocument()
+  expect(dropdownDivider).not.toBeInTheDocument()
 })
 
 it('should be able to set url permalink via prop `href`', () => {
diff --git a/src/components/breadcrumbs/BreadcrumbItem.vue b/src/components/breadcrumbs/BreadcrumbItem.vue
@@ -8,21 +8,27 @@
       :href="permalink">
       <slot />
     </component>
-    <IconChevron
+    <div
       v-if="!active"
-      data-testid="breadcrumbs-icon"
-      class="breadcrumbs__item__icon" />
+      data-testid="breadcrumbs-divider"
+      class="breadcrumbs__item__divider">
+      <component :is="divider" />
+    </div>
   </li>
 </template>
 
 <script lang="ts">
-import { defineComponent, computed } from 'vue-demi'
+import {
+  defineComponent,
+  computed,
+  inject,
+  h,
+} from 'vue-demi'
 import IconChevron from '@privyid/persona-icon/vue/chevron-right/20.vue'
 import { TagVariant } from '.'
 
 export default defineComponent({
-  components: { IconChevron },
-  props     : {
+  props: {
     href: {
       type   : String,
       default: '#',
@@ -59,8 +65,13 @@ export default defineComponent({
       return props.href
     })
 
+    const divider = inject('divider', () => h(IconChevron))
+
     return {
-      classNames, tagName, permalink,
+      classNames,
+      tagName,
+      permalink,
+      divider,
     }
   },
 })
@@ -72,13 +83,13 @@ export default defineComponent({
     @apply inline-flex text-sm items-center capitalize;
 
     &:last-child {
-      & > .breadcrumbs__item__icon {
+      & > .breadcrumbs__item__divider {
         @apply hidden;
       }
     }
 
     &:not(:last-child) {
-      & > .breadcrumbs__item__icon {
+      & > .breadcrumbs__item__divider {
         @apply inline-flex ml-3;
       }
     }
diff --git a/src/components/breadcrumbs/BreadcrumbItemDropdown.spec.ts b/src/components/breadcrumbs/BreadcrumbItemDropdown.spec.ts
@@ -10,11 +10,11 @@ it('should rendered properly without any props', () => {
   })
 
   const breadcrumbDropdown = screen.queryByTestId('breadcrumbs-dropdown')
-  const breadcrumbIcon     = screen.queryByTestId('breadcrumbs-icon')
+  const breadcrumbDivider  = screen.queryByTestId('breadcrumbs-divider')
 
   expect(breadcrumbDropdown).toBeInTheDocument()
   expect(breadcrumbDropdown).toHaveClass('breadcrumbs__item--dropdown')
-  expect(breadcrumbIcon).toBeInTheDocument()
+  expect(breadcrumbDivider).toBeInTheDocument()
 })
 
 it('should be able to set active via prop `active`', () => {
diff --git a/src/components/breadcrumbs/BreadcrumbItemDropdown.vue b/src/components/breadcrumbs/BreadcrumbItemDropdown.vue
@@ -9,20 +9,27 @@
       size="xs">
       <slot />
     </Dropdown>
-    <IconChevron
+    <div
       v-if="!active"
-      data-testid="breadcrumbs-icon"
-      class="breadcrumbs__item__icon" />
+      data-testid="breadcrumbs-divider"
+      class="breadcrumbs__item__divider">
+      <component :is="divider" />
+    </div>
   </li>
 </template>
 
 <script lang="ts">
-import { defineComponent, computed } from 'vue-demi'
+import {
+  defineComponent,
+  computed,
+  inject,
+  h,
+} from 'vue-demi'
 import Dropdown from '../dropdown/Dropdown.vue'
 import IconChevron from '@privyid/persona-icon/vue/chevron-right/20.vue'
 
 export default defineComponent({
-  components: { Dropdown, IconChevron },
+  components: { Dropdown },
   props     : {
     text: {
       type   : String,
@@ -44,7 +51,9 @@ export default defineComponent({
       return result
     })
 
-    return { classNames }
+    const divider = inject('divider', () => h(IconChevron))
+
+    return { classNames, divider }
   },
 })
 </script>
diff --git a/src/components/breadcrumbs/index.md b/src/components/breadcrumbs/index.md
diff --git a/src/components/select/Select.spec.ts b/src/components/select/Select.spec.ts
diff --git a/src/components/select/Select.vue b/src/components/select/Select.vue
diff --git a/src/components/select/index.md b/src/components/select/index.md
diff --git a/src/components/sidebar-menu/index.md b/src/components/sidebar-menu/index.md
diff --git a/src/icons/changelog.md b/src/icons/changelog.md

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "@privyid/design-system",`
`3`		`- "version": "0.18.0",`
	`3`	`+ "version": "0.19.0",`
`4`	`4`	`"packageManager": "yarn@3.6.1",`
`5`	`5`	`"private": true,`
`6`	`6`	`"scripts": {`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "@privyid/browserslist-config",`
`3`	`3`	`"description": "Browserslist shareable config for Persona project",`
`4`		`- "version": "0.18.0",`
	`4`	`+ "version": "0.19.0",`
`5`	`5`	`"packageManager": "yarn@3.6.1",`
`6`	`6`	`"license": "MIT",`
`7`	`7`	`"repository": {`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "@privyid/eslint-config-persona",`
`3`	`3`	`"description": "Eslint shareable config for Persona project",`
`4`		`- "version": "0.18.0",`
	`4`	`+ "version": "0.19.0",`
`5`	`5`	`"packageManager": "yarn@3.6.1",`
`6`	`6`	`"license": "MIT",`
`7`	`7`	`"repository": {`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "@privyid/persona-icon",`
`3`	`3`	`"description": "Persona icon package",`
`4`		`- "version": "0.18.0",`
	`4`	`+ "version": "0.19.0",`
`5`	`5`	`"packageManager": "yarn@3.6.1",`
`6`	`6`	`"type": "module",`
`7`	`7`	`"main": "./dist/module.cjs",`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "@privyid/persona",`
`3`	`3`	`"description": "Persona core package",`
`4`		`- "version": "0.18.0",`
	`4`	`+ "version": "0.19.0",`
`5`	`5`	`"license": "MIT",`
`6`	`6`	`"repository": {`
`7`	`7`	`"url": "https://github.com/privy-open-source/design-system.git",`
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "@privyid/tailwind-animation",`
`3`		`- "version": "0.18.0",`
	`3`	+ "description": "Collection animation class for vue `<transition>`",
	`4`	`+ "version": "0.19.0",`
`4`	`5`	`"packageManager": "yarn@3.6.1",`
`5`	`6`	`"license": "MIT",`
`6`	`7`	`"repository": {`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "@privyid/tailwind-extended",`
`3`	`3`	`"description": "Add missing tailwind utilities",`
`4`		`- "version": "0.18.0",`
	`4`	`+ "version": "0.19.0",`
`5`	`5`	`"packageManager": "yarn@3.6.1",`
`6`	`6`	`"license": "MIT",`
`7`	`7`	`"repository": {`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "@privyid/tailwind-preset",`
`3`	`3`	`"description": "Tailwind preset for Persona project",`
`4`		`- "version": "0.18.0",`
	`4`	`+ "version": "0.19.0",`
`5`	`5`	`"packageManager": "yarn@3.6.1",`
`6`	`6`	`"license": "MIT",`
`7`	`7`	`"repository": {`