tiptapify 0.3.3 → 0.3.5

package/src/types/editor.ts

@@ -11,6 +11,105 @@ export type variantFieldTypes = 'outlined' | 'plain' | 'filled' | 'solo' | 'solo
 
 export type TiptapifyFooterAlignment = 'start' | 'center' | 'end'
 
+// The skin of the editor chrome: 'default' is the classic look, 'pastel' is the quiet 0.3.3 look
+export type TiptapifySkin = 'default' | 'pastel'
+
+// Structural variants a token cannot express (component markup, vuetify prop bindings).
+// The shape decides which skin rule sets apply; the tokens paint them.
+export type TiptapifyShape = {
+  // VToolbar elevation 1 + no inner hairline vs flat + tinted bar
+  toolbar?: 'raised' | 'flat'
+  // toolbar sections as raised boxes vs plain flex runs
+  groups?: 'box' | 'flat'
+  // native vuetify buttons vs ghost buttons with a neutral pressed state
+  buttons?: 'vuetify' | 'quiet'
+  // bubble menu: VCard + divided VBtnGroup vs flat row of quiet buttons
+  bubble?: 'card' | 'flat'
+  // divider under the title, elevated close, field defaults vs soft card, text close, outlined defaults
+  dialog?: 'classic' | 'soft'
+  // dropdown menus: vuetify list vs the light padded card
+  menu?: 'vuetify' | 'soft'
+}
+
+// The shape after resolution: every key set (missing keys fall back to classic)
+export type ResolvedShape = Required<TiptapifyShape>
+
+export type TiptapifySkinColors = {
+  toolbarBg: string
+  toolbarBorderBottom: string
+  toolbarFg: string
+  groupBg: string
+  groupShadow: string
+  dividerColor: string
+  buttonFg: string
+  buttonHoverBg: string
+  buttonHoverFg: string
+  buttonActiveBg: string
+  buttonActiveHoverBg: string
+  bubbleBg: string
+  bubbleBorder: string
+  bubbleShadow: string
+  menuBorder: string
+  menuShadow: string
+  menuItemActiveBg: string
+  dialogShadow: string
+  frameBg: string
+  frameShadow: string
+  frameBorder: string
+  imageBg: string
+  imageOutline: string
+  imageOutlineHover: string
+  handleBg: string
+  handleBgHover: string
+  handleBorder: string
+  handleShadow: string
+}
+
+export type TiptapifySkinMetrics = {
+  itemsPadding: string
+  itemsGap: string
+  itemsRowGap: string
+  groupGap: string
+  groupHeight: string
+  groupRadius: string
+  dividerWidth: string
+  dividerHeight: string
+  buttonRadius: string
+  bubbleRadius: string
+  bubblePadding: string
+  bubbleGap: string
+  menuListPadding: string
+  menuRadius: string
+  menuItemRadius: string
+  menuItemPadding: string
+  menuItemMinHeight: string
+  dialogRadius: string
+  dialogHeaderPadding: string
+  dialogContentPadding: string
+  dialogActionsPadding: string
+  dialogTitleSize: string
+  dialogTitleWeight: string
+  dialogFieldRadius: string
+  dialogActionBtnMinHeight: string
+  dialogActionBtnRadius: string
+  dialogGridGap: string
+  imageRadius: string
+  handleRadius: string
+}
+
+// A skin as data: token overrides + shape flags, inheriting from a registered skin
+export type TiptapifySkinConfig = TiptapifyShape & {
+  name?: string
+  // registered skin name; implicit 'default'
+  extends?: string
+  colors?: Partial<TiptapifySkinColors>
+  metrics?: Partial<TiptapifySkinMetrics>
+}
+
+// The `skin` prop: a registered name (string) or an inline object; inline objects
+// resolve through the same chain and never enter the global registry
+export type TiptapifySkinInput = string | TiptapifySkinConfig
+
 export type TiptapifyAiMode = 'insert' | 'replace' | 'append'
 
 export type TiptapifyAiPromptExample = {

package/src/utils/validateHref.test.ts

@@ -30,6 +30,23 @@ describe('isValidHref', () => {
     expect(isValidHref('https://example.com/a/b?q=1-2_3%40&r=99')).toBe(true)
   })
 
+  it('accepts facebook post, photo and permalink URLs', () => {
+    expect(isValidHref('https://www.facebook.com/user.name/posts/pfbid02abcXYZ123')).toBe(true)
+    expect(isValidHref('https://www.facebook.com/photo/?fbid=123456&set=a.789')).toBe(true)
+    expect(isValidHref('https://m.facebook.com/permalink.php?story_fbid=pfbid0abc&id=100064')).toBe(true)
+    expect(isValidHref('https://fb.watch/abc_DEF12/')).toBe(true)
+  })
+
+  it('accepts dots, underscores and other URL characters in the path', () => {
+    expect(isValidHref('https://example.com/docs/file_v2.pdf')).toBe(true)
+    expect(isValidHref('https://example.com/~user/a+b,c:d')).toBe(true)
+  })
+
+  it('accepts a hyphenated or non-latin domain', () => {
+    expect(isValidHref('https://my-site.com')).toBe(true)
+    expect(isValidHref('https://ліга.укр/новини')).toBe(true)
+  })
+
   it('accepts mailto links', () => {
     expect(isValidHref('mailto:test@example.com')).toBe(true)
   })
@@ -62,6 +79,14 @@ describe('isValidHref', () => {
     expect(isValidHref('https://exa mple.com')).toBe(false)
   })
 
+  it('rejects an http URL without slashes after the protocol', () => {
+    expect(isValidHref('https:example.com')).toBe(false)
+  })
+
+  it('rejects a domain with an empty label', () => {
+    expect(isValidHref('https://example..com')).toBe(false)
+  })
+
   it('rejects plain text', () => {
     expect(isValidHref('not a url')).toBe(false)
   })

package/src/utils/validateHref.ts

@@ -1,21 +1,25 @@
 const azAZ09 = 'a-zA-Z0-9'
 
-const regexHrefProto = 'https?:\\/\\/'
-const regexHrefAuth = `([${azAZ09}]+(:[${azAZ09}]+)?@)?`
-const regexHrefDomain = `[${azAZ09}]+(\\.[${azAZ09}]+(-?[${azAZ09}]+)?)+`
-const regexHrefPath = `(\\/[${azAZ09}\\-]+)*\\/?`
-const regexHrefFragment = '(#[^\\s]*)?'
-const regexHrefQueryParam = `(\\?[${azAZ09}\\-_]+((\\[[${azAZ09}]+\\])?=[${azAZ09}\\-_%]+)?)?`
-const regexHrefQueryParamExtra = `(&[${azAZ09}\\-_]+((\\[[${azAZ09}]+\\])?=[${azAZ09}\\-_%]+)?)*`
-const regexHref = `${regexHrefProto}${regexHrefAuth}${regexHrefDomain}${regexHrefPath}${regexHrefFragment}${regexHrefQueryParam}${regexHrefQueryParamExtra}`
-
 const regexMailto = `mailto:\\w+@[${azAZ09}]+(\\.[${azAZ09}]+)*`
 const regexTel = 'tel:\\+?[0-9]+'
 
-const regexAll = [regexHref, regexMailto, regexTel].join('|')
+const hrefRegex = new RegExp(`^(${regexMailto}|${regexTel})$`, 'i')
+
+const httpPrefixRegex = /^https?:\/\//i
+const hostnameRegex = /^[^.]+(\.[^.]+)+$/
+
+function isValidHttpUrl(href: string): boolean {
+  if (!httpPrefixRegex.test(href) || /\s/.test(href)) {
+    return false
+  }
 
-const hrefRegex = new RegExp(`^(${regexAll})$`, 'i')
+  try {
+    return hostnameRegex.test(new URL(href).hostname)
+  } catch {
+    return false
+  }
+}
 
 export function isValidHref(href: string): boolean {
-  return hrefRegex.test(href || '')
-}
+  return isValidHttpUrl(href || '') || hrefRegex.test(href || '')
+}