nextia 9.0.1 → 9.0.2

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "nextia",
   "description": "Create fast web applications",
-  "version": "9.0.1",
+  "version": "9.0.2",
   "license": "MIT",
   "type": "module",
   "engines": {

package/src/fx.js

@@ -7,7 +7,7 @@
  * https://github.com/sinuhedev/nextia
  */
 
-import { createContext, use, useEffect, useReducer, useState } from 'react'
+import { createContext, use, useReducer } from 'react'
 
 const Pagex = createContext()
 
@@ -158,24 +158,11 @@ const reducerLogger = (state, action) => {
 
 function useCx() {
   const pages = use(Pagex)
-  const [icons, setIcons] = useState()
-
-  useEffect(() => {
-    if (!pages?.icons) return
-
-    fetch(pages?.icons)
-      .then((r) => r.text())
-      .then((text) => {
-        setIcons(
-          new DOMParser().parseFromString(text, 'image/svg+xml').documentElement
-        )
-      })
-  }, [pages?.icons])
 
   return {
     context: pages?.context,
     i18n: pages?.i18n,
-    icons,
+    icons: pages?.icons,
     logger: pages?.logger ?? false
   }
 }

package/src/index.js

@@ -10,10 +10,11 @@
 import { Pagex, useCx, useFx } from './fx.js'
 import { useQueryString, useResize } from './hooks.js'
 import { I18n, Icon, Link, Svg } from './ui.js'
-import { css, startViewTransition, version } from './utils.js'
+import { css, getVersion, startViewTransition } from './utils.js'
 
 export {
   css,
+  getVersion,
   I18n,
   Icon,
   Link,
@@ -23,6 +24,5 @@ export {
   useCx,
   useFx,
   useQueryString,
-  useResize,
-  version
+  useResize
 }

package/src/ui.js

@@ -10,16 +10,6 @@
 import { createElement, useEffect, useRef } from 'react'
 import { useCx } from './fx.js'
 
-function Link({ children, href, value, ...props }) {
-  const base = href ?? window.location.hash.split('?')[0]
-  const query =
-    value && Object.keys(value).length
-      ? `?${new URLSearchParams(value).toString()}`
-      : ''
-
-  return createElement('a', { href: base + query, ...props }, children)
-}
-
 function I18n({ value, args = [] }) {
   const { context, i18n } = useCx()
 
@@ -66,7 +56,10 @@ function Icon({
   useEffect(() => {
     if (!ref.current || !icons) return
 
-    const el = icons.getElementById(id)
+    const el = new DOMParser()
+      .parseFromString(icons, 'image/svg+xml')
+      .documentElement.getElementById(id)
+
     if (el) ref.current.innerHTML = el.innerHTML
   }, [id, icons])
 
@@ -89,6 +82,16 @@ function Icon({
   })
 }
 
+function Link({ children, href, value, ...props }) {
+  const base = href ?? window.location.hash.split('?')[0]
+  const query =
+    value && Object.keys(value).length
+      ? `?${new URLSearchParams(value).toString()}`
+      : ''
+
+  return createElement('a', { href: base + query, ...props }, children)
+}
+
 function Svg({ ref, src, width, height, ...props }) {
   ref ??= useRef()
 

package/src/utils.js

@@ -7,18 +7,6 @@
  * https://github.com/sinuhedev/nextia
  */
 
-/**
- * View Transition
- */
-
-async function startViewTransition(fun = () => {}, ref, animation = 'fade') {
-  if (!document.startViewTransition) return fun()
-
-  ref.style.viewTransitionName = animation
-  await document.startViewTransition(() => fun).finished
-  ref.style.viewTransitionName = ''
-}
-
 /**
  * css
  */
@@ -46,7 +34,7 @@ function css(...classNames) {
  * getVersion
  */
 
-const version = () =>
+const getVersion = () =>
   Object.fromEntries(
     document
       .querySelector('meta[name="version"]')
@@ -58,4 +46,16 @@ const version = () =>
       }) ?? ''
   )
 
-export { css, startViewTransition, version }
+/**
+ * View Transition
+ */
+
+async function startViewTransition(fun = () => {}, ref, animation = 'fade') {
+  if (!document.startViewTransition) return fun()
+
+  ref.style.viewTransitionName = animation
+  await document.startViewTransition(() => fun).finished
+  ref.style.viewTransitionName = ''
+}
+
+export { css, getVersion, startViewTransition }