@sakura-ui/sakura-ui 0.1.4 → 0.1.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sakura-ui/sakura-ui",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "keywords": [],
   "author": "glassonion1",
   "homepage": "https://github.com/glassonion1/sakura-ui",
@@ -13,9 +13,9 @@
     "packages"
   ],
   "dependencies": {
-    "@sakura-ui/core": "0.0.3",
-    "@sakura-ui/config": "0.0.10",
-    "@sakura-ui/forms": "0.0.5"
+    "@sakura-ui/config": "0.0.12",
+    "@sakura-ui/core": "0.0.5",
+    "@sakura-ui/forms": "0.0.7"
   },
   "peerDependencies": {
     "react": "^18.2.0",

package/packages/config/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sakura-ui/config",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "main": "dist/index.cjs.js",
   "types": "dist/index.d.ts",
   "exports": {
@@ -35,16 +35,16 @@
     "tailwindcss": "^3.2.7"
   },
   "devDependencies": {
-    "@types/jest": "^29.4.0",
-    "@types/node": "^18.14.1",
-    "autoprefixer": "^10.4.13",
-    "jest": "^29.4.3",
+    "@types/jest": "^29.5.1",
+    "@types/node": "^18.16.15",
+    "autoprefixer": "^10.4.14",
+    "jest": "^29.5.0",
     "npm-run-all": "^4.1.5",
-    "postcss": "^8.4.21",
-    "tailwindcss": "^3.2.7",
-    "ts-jest": "^29.0.5",
+    "postcss": "^8.4.23",
+    "tailwindcss": "^3.3.2",
+    "ts-jest": "^29.1.0",
     "ts-node": "^10.9.1",
-    "typescript": "^5.0.2",
-    "vite": "^4.2.2"
+    "typescript": "^5.0.4",
+    "vite": "^4.3.9"
   }
 }

package/packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sakura-ui/core",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "type": "module",
   "main": "dist/index.cjs.js",
   "types": "dist/index.d.ts",
@@ -39,22 +39,22 @@
     "tailwindcss": "^3.2.7"
   },
   "devDependencies": {
-    "@types/jest": "^29.4.0",
-    "@types/node": "^18.14.1",
-    "@types/react": "^18.0.27",
-    "@types/react-dom": "^18.0.10",
-    "@vitejs/plugin-react-swc": "^3.0.0",
-    "autoprefixer": "^10.4.13",
-    "jest": "^29.4.3",
+    "@types/jest": "^29.5.1",
+    "@types/node": "^18.16.15",
+    "@types/react": "^18.2.7",
+    "@types/react-dom": "^18.2.4",
+    "@vitejs/plugin-react-swc": "^3.3.1",
+    "autoprefixer": "^10.4.14",
+    "jest": "^29.5.0",
     "npm-run-all": "^4.1.5",
-    "postcss": "^8.4.21",
+    "postcss": "^8.4.23",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "tailwindcss": "^3.2.7",
-    "ts-jest": "^29.0.5",
+    "tailwindcss": "^3.3.2",
+    "ts-jest": "^29.1.0",
     "ts-node": "^10.9.1",
-    "tsc-alias": "^1.8.2",
-    "typescript": "^5.0.2",
-    "vite": "^4.2.2"
+    "tsc-alias": "^1.8.6",
+    "typescript": "^5.0.4",
+    "vite": "^4.3.9"
   }
 }

package/packages/core/src/components/Button.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface ButtonProps extends React.ComponentPropsWithoutRef<'button'> {
   variant?: 'primary' | 'secondary'
@@ -14,51 +14,39 @@ export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
     const align = textAlign ?? 'center'
 
     const style = `
-    inline-block
-    p-4
-    text-base
-    font-bold
-    rounded-lg
-    text-${align}
-    cursor-pointer
-    whitespace-nowrap
-  `
+      inline-block
+      p-4
+      text-base
+      font-bold
+      rounded-lg
+      text-${align}
+      cursor-pointer
+      whitespace-nowrap
+      border
+      border-solid
+      border-sea-600
+      focus:outline
+      focus:outline-2
+      focus:outline-wood-500
+      disabled:border-sumi-500
+      disabled:cursor-not-allowed
+    `
 
     const primary = `
-    text-white-1000
-    border
-    border-solid
-    border-sea-600
-    bg-sea-600
-    hover:bg-sea-800
-    active:bg-sea-800
-    focus:outline
-    focus:outline-2
-    focus:outline-wood-500
-    disabled:bg-sumi-500
-    disabled:text-white-1000
-    disabled:border
-    disabled:border-solid
-    disabled:border-sumi-500
-    disabled:cursor-not-allowed
-  `
+      text-white-1000
+      bg-sea-600
+      hover:enabled:bg-sea-700
+      active:enabled:bg-sea-800
+      disabled:bg-sumi-500
+      disabled:text-white-1000
+    `
     const secondary = `
-    text-sea-600
-    border
-    border-solid
-    border-sea-600
-    hover:bg-sea-100
-    active:bg-sea-100
-    focus:outline
-    focus:outline-2
-    focus:outline-wood-500
-    disabled:hover:bg-white-1000
-    disabled:text-sumi-500
-    disabled:border
-    disabled:border-solid
-    disabled:border-sumi-500
-    disabled:cursor-not-allowed
-  `
+      text-sea-600
+      bg-transparent
+      hover:enabled:bg-sea-100
+      active:enabled:bg-sea-200
+      disabled:text-sumi-500
+    `
 
     const styles = {
       primary: primary,

package/packages/core/src/components/Card.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface CardProps extends React.ComponentProps<'section'> {}
 

package/packages/core/src/components/Code.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface CodeProps extends React.ComponentProps<'code'> {}
 

package/packages/core/src/components/Heading.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface HeadingProps extends React.ComponentProps<'h1'> {}
 

package/packages/core/src/components/Icon.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface IconProps extends React.ComponentProps<'span'> {
   icon: string
@@ -9,14 +9,14 @@ export const Icon = React.forwardRef<HTMLElement, IconProps>((props, ref) => {
   const { className, icon, ...restProps } = props
 
   const style = `
-  inline-block
-  align-middle
-  font-icon
-  text-2xl
-  font-light
-  leading-none
-  antialiased
-  mb-1
+    inline-block
+    align-middle
+    font-icon
+    text-2xl
+    font-light
+    leading-none
+    antialiased
+    mb-1
   `
 
   return (

package/packages/core/src/components/IconButton.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface IconButtonProps extends React.ComponentProps<'button'> {
   variant?: 'primary' | 'secondary'
@@ -17,51 +17,38 @@ export const IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(
     const align = 'center'
 
     const style = `
-    inline-block
-    p-4
-    text-base
-    font-bold
-    rounded-lg
-    text-${align}
-    cursor-pointer
-    whitespace-nowrap
-  `
+      inline-block
+      p-4
+      text-base
+      font-bold
+      rounded-lg
+      text-${align}
+      cursor-pointer
+      whitespace-nowrap
+      border
+      border-solid
+      border-sea-600
+      focus:outline
+      focus:outline-2
+      focus:outline-wood-500
+      disabled:border-sumi-500
+      disabled:cursor-not-allowed
+    `
 
     const primary = `
-    text-white-1000
-    border
-    border-solid
-    border-sea-600
-    bg-sea-600
-    hover:bg-sea-800
-    active:bg-sea-800
-    focus:outline
-    focus:outline-2
-    focus:outline-wood-500
-    disabled:bg-sumi-500
-    disabled:text-white-1000
-    disabled:border
-    disabled:border-solid
-    disabled:border-sumi-500
-    disabled:cursor-not-allowed
-  `
+      text-white-1000
+      bg-sea-600
+      hover:enabled:bg-sea-700
+      active:enabled:bg-sea-800
+      disabled:bg-sumi-500
+      disabled:text-white-1000
+    `
     const secondary = `
-    text-sea-600
-    border
-    border-solid
-    border-sea-600
-    hover:bg-sea-100
-    active:bg-sea-100
-    focus:outline
-    focus:outline-2
-    focus:outline-wood-500
-    disabled:hover:bg-white-1000
-    disabled:text-sumi-500
-    disabled:border
-    disabled:border-solid
-    disabled:border-sumi-500
-    disabled:cursor-not-allowed
-  `
+      text-sea-600
+      hover:enabled:bg-sea-100
+      active:enabled:bg-sea-200
+      disabled:text-sumi-500
+    `
 
     const styles = {
       primary: primary,
@@ -69,14 +56,14 @@ export const IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(
     }
 
     const iconStyle = `
-    inline-block
-    align-middle
-    font-icon
-    text-2xl
-    font-light
-    leading-4
-    antialiased
-    mb-1
+      inline-block
+      align-middle
+      font-icon
+      text-2xl
+      font-light
+      leading-4
+      antialiased
+      mb-1
     `
 
     return (

package/packages/core/src/components/InfoCard.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface InfoCardProps extends React.ComponentProps<'section'> {
   title?: string

package/packages/core/src/components/Link.tsx

@@ -1,7 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
-
-export interface LinkProps extends React.ComponentProps<'a'> {}
+import { cx } from '../utils/class'
 
 const getFileType = (url: string) => {
   const converted = url.toLowerCase()
@@ -30,44 +28,49 @@ const getFileType = (url: string) => {
   return null
 }
 
-export const Link = (props: LinkProps) => {
-  const { className, children, ...restProps } = props
-  const href = props.href ?? ''
-  const fileType = getFileType(href)
+export interface LinkProps extends React.ComponentProps<'a'> {}
 
-  const style = `
-    rounded-sm
-    cursor-pointer
-    text-sea-600
-    underline
-    underline-offset-[0.1em]
-    hover:text-sea-800
-    active:text-sea-800
-    visited:text-sea-900
-    focus:outline
-    focus:outline-2
-    focus:outline-wood-500
-    disabled:border-sumi-500
-  `
+export const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(
+  (props, ref) => {
+    const { className, children, ...restProps } = props
+    const href = props.href ?? ''
+    const fileType = getFileType(href)
 
-  if (href.startsWith('http')) {
+    const style = `
+      rounded-sm
+      cursor-pointer
+      text-sea-600
+      underline
+      underline-offset-[0.1em]
+      hover:text-sea-800
+      active:text-sea-800
+      visited:text-sea-900
+      focus:outline
+      focus:outline-2
+      focus:outline-wood-500
+      disabled:border-sumi-500
+    `
+
+    if (href.startsWith('http')) {
+      return (
+        <a
+          className={cx(style, className)}
+          href={href}
+          target="_blank"
+          rel="noopener noreferrer"
+          {...restProps}
+          ref={ref}
+        >
+          {children}
+          {fileType ? `（${fileType}）` : null}
+        </a>
+      )
+    }
     return (
-      <a
-        className={cx(style, className)}
-        href={href}
-        target="_blank"
-        rel="noopener noreferrer"
-        {...restProps}
-      >
+      <a className={cx(style, className)} href={href} {...restProps} ref={ref}>
         {children}
         {fileType ? `（${fileType}）` : null}
       </a>
     )
   }
-  return (
-    <a className={cx(style, className)} href={href} {...restProps}>
-      {children}
-      {fileType ? `（${fileType}）` : null}
-    </a>
-  )
-}
+)

package/packages/core/src/components/List.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface UlProps extends React.ComponentProps<'ul'> {}
 

package/packages/core/src/components/Pre.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface PreProps extends React.ComponentProps<'pre'> {}
 

package/packages/core/src/components/Table.tsx

@@ -1,12 +1,12 @@
 import React from 'react'
-import { cx } from '../utils'
+import { cx } from '../utils/class'
 
 export interface TableProps extends React.ComponentProps<'table'> {}
 
 const styleBorder = `
-    border
-    border-collapse
-    border-sumi-900
+  border
+  border-collapse
+  border-sumi-900
 `
 
 export const Table = (props: TableProps) => {

package/packages/forms/dist/components/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../src/components/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC;CAAG;AAEvE,eAAO,MAAM,QAAQ,qGA+DpB,CAAA"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../src/components/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC;CAAG;AAEvE,eAAO,MAAM,QAAQ,qGA8DpB,CAAA"}

package/packages/forms/dist/components/Radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/components/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,KAAM,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,CAAC;CAAG;AAEzE,eAAO,MAAM,KAAK,gFAoDhB,CAAA"}
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/components/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,KAAM,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,CAAC;CAAG;AAEzE,eAAO,MAAM,KAAK,gFAsDhB,CAAA"}

package/packages/forms/dist/components/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/components/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC;CAAG;AAEhF,eAAO,MAAM,MAAM,uFAmDlB,CAAA"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/components/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC;CAAG;AAEhF,eAAO,MAAM,MAAM,uFA0DlB,CAAA"}

package/packages/forms/dist/components/Text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../src/components/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,SAAU,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,CAAC;CAAG;AAE7E,eAAO,MAAM,IAAI,oFAsChB,CAAA"}
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../src/components/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,SAAU,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,CAAC;CAAG;AAE7E,eAAO,MAAM,IAAI,oFAoChB,CAAA"}

package/packages/forms/dist/components/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../src/components/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,UAAU,CAAC;CAAG;AAEvD,eAAO,MAAM,QAAQ,2FAwCpB,CAAA"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../src/components/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,UAAU,CAAC;CAAG;AAEvD,eAAO,MAAM,QAAQ,2FAsCpB,CAAA"}