webcoreui 1.2.0 → 1.3.0

package/components/Progress/progress.module.scss

@@ -58,6 +58,12 @@ body {
         }
     }
 
+    &.indeterminate .progress {
+        @include position(relative);
+
+        animation: load 1s cubic-bezier(0.4, 0.0, 0.2, 1) infinite;
+    }
+
     .progress {
         @include transition(width);
         @include size('h100%');
@@ -68,3 +74,12 @@ body {
         width: var(--w-progress-width);
     }
 }
+
+@keyframes load {
+    from {
+        left: -100%;
+    }
+    to {
+        left: 100%;
+    }
+}

package/components/Progress/progress.ts

@@ -8,5 +8,6 @@ export type ProgressProps = {
     striped?: boolean
     stripeLight?: string
     stripeDark?: string
+    indeterminate?: boolean
     className?: string
 }

package/components/RangeSlider/RangeSlider.astro

@@ -22,6 +22,7 @@ const {
     color,
     background,
     thumb,
+    name,
     label,
     subText,
     minLabel,
@@ -84,6 +85,7 @@ const labelStyle = updateLabels ? `min-width:${minLabelWidth};` : null
             />
             <input
                 type="range"
+                name={name}
                 class:list={[styles.input, styles.min]}
                 min={min}
                 max={max}
@@ -94,6 +96,7 @@ const labelStyle = updateLabels ? `min-width:${minLabelWidth};` : null
             />
             <input
                 type="range"
+                name={name}
                 min={min}
                 max={max}
                 class={styles.input}
@@ -189,6 +192,7 @@ const labelStyle = updateLabels ? `min-width:${minLabelWidth};` : null
                 }
 
                 dispatch('rangeSliderOnChange', {
+                    name: target.name,
                     min: minValue,
                     max: maxValue
                 })
@@ -257,6 +261,7 @@ const labelStyle = updateLabels ? `min-width:${minLabelWidth};` : null
             }
 
             dispatch('rangeSliderOnChange', {
+                name: minInput.name,
                 min: minValue,
                 max: maxValue
             })

package/components/RangeSlider/rangeslider.ts

@@ -16,6 +16,7 @@ export type RangeSliderProps = {
     color?: string
     background?: string
     thumb?: string
+    name?: string
     label?: string
     subText?: string
     minLabel?: string

package/icons/minus.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg">
+  <path d="M6 12h12" />
+</svg>

package/icons.d.ts

@@ -12,6 +12,7 @@ declare module 'webcoreui/icons' {
 	export const github: string
 	export const home: string
 	export const info: string
+	export const minus: string
 	export const moon: string
 	export const order: string
 	export const plus: string

package/icons.js

@@ -11,6 +11,7 @@ export { default as copy } from './icons/copy.svg?raw'
 export { default as github } from './icons/github.svg?raw'
 export { default as home } from './icons/home.svg?raw'
 export { default as info } from './icons/info.svg?raw'
+export { default as minus } from './icons/minus.svg?raw'
 export { default as moon } from './icons/moon.svg?raw'
 export { default as order } from './icons/order.svg?raw'
 export { default as plus } from './icons/plus.svg?raw'

package/package.json

@@ -1,109 +1,111 @@
-{
-    "name": "webcoreui",
-    "type": "module",
-    "version": "1.2.0",
-    "scripts": {
-        "prepare": "husky",
-        "pre-commit": "lint-staged",
-        "dev": "astro dev",
-        "start": "astro preview",
-        "build": "astro check && astro build",
-        "build:package": "node scripts/build.js",
-        "compile": "node scripts/sass.js",
-        "test": "cd .. && vitest run && npm run test:sass",
-        "test:dev": "vitest",
-        "test:run": "vitest run",
-        "test:sass": "vitest run src/tests/unit/scss.test.js --config astro.config.mjs",
-        "test:e2e": "playwright test",
-        "test:e2e:update": "playwright test --update-snapshots",
-        "test:e2e:ui": "playwright test --ui",
-        "create-component": "node scripts/createComponent.js",
-        "lint": "eslint src/**/* --fix"
-    },
-    "devDependencies": {
-        "@astrojs/check": "0.9.4",
-        "@astrojs/node": "9.4.1",
-        "@astrojs/react": "4.3.0",
-        "@astrojs/svelte": "7.1.0",
-        "@eslint/js": "9.23.0",
-        "@playwright/test": "1.55.1",
-        "@types/node": "24.6.2",
-        "@typescript-eslint/parser": "8.39.1",
-        "astro": "5.13.0",
-        "astro-eslint-parser": "1.2.2",
-        "eslint": "9.23.0",
-        "eslint-plugin-astro": "1.3.1",
-        "eslint-plugin-react": "7.37.4",
-        "eslint-plugin-simple-import-sort": "12.1.1",
-        "eslint-plugin-svelte": "3.3.3",
-        "husky": "9.1.7",
-        "jsdom": "26.0.0",
-        "lint-staged": "15.5.0",
-        "react": "19.0.0",
-        "react-dom": "19.0.0",
-        "sass": "1.90.0",
-        "sass-true": "8.1.0",
-        "svelte": "5.38.1",
-        "svelte-eslint-parser": "1.1.0",
-        "typescript": "5.9.2",
-        "typescript-eslint": "8.39.1",
-        "vite-tsconfig-paths": "5.1.4",
-        "vitest": "3.0.4"
-    },
-    "exports": {
-        ".": "./index.js",
-        "./astro": "./astro.js",
-        "./svelte": "./svelte.js",
-        "./react": "./react.js",
-        "./icons": "./icons.js",
-        "./integration": "./integration.js",
-        "./styles": "./scss/index.scss",
-        "./config": "./scss/config.scss"
-    },
-    "files": [
-        "components",
-        "icons",
-        "scss",
-        "utils",
-        "astro.d.ts",
-        "astro.js",
-        "icons.d.ts",
-        "icons.js",
-        "svelte.d.ts",
-        "svelte.js",
-        "react.d.ts",
-        "react.js",
-        "index.js",
-        "index.d.ts",
-        "integration.js",
-        "integration.d.ts",
-        "README.md",
-        "LICENSE"
-    ],
-    "license": "MIT",
-    "description": "UI component and template library for Astro, Svelte, and React apps styled with Sass.",
-    "keywords": [
-        "webcore",
-        "component",
-        "components",
-        "ui components",
-        "component library",
-        "astro components",
-        "svelte components",
-        "react components",
-        "frontend",
-        "library",
-        "sass"
-    ],
-    "homepage": "https://webcoreui.dev",
-    "repository": {
-        "type": "git",
-        "url": "git+https://github.com/Frontendland/webcoreui.git"
-    },
-    "bugs": {
-        "url": "https://github.com/Frontendland/webcoreui/issues"
-    },
-    "lint-staged": {
-        "*.{js,ts,jsx,tsx,svelte,astro}": "eslint src/**/*"
-    }
-}
+{
+    "name": "webcoreui",
+    "type": "module",
+    "version": "1.3.0",
+    "scripts": {
+        "prepare": "husky",
+        "pre-commit": "lint-staged",
+        "dev": "astro dev",
+        "start": "astro preview",
+        "build": "astro check && astro build",
+        "build:package": "node scripts/build.js",
+        "compile": "node scripts/sass.js",
+        "test": "cd .. && vitest run && npm run test:sass",
+        "test:dev": "vitest",
+        "test:run": "vitest run",
+        "test:sass": "vitest run src/tests/unit/scss.test.js --config astro.config.mjs",
+        "test:e2e": "playwright test",
+        "test:e2e:update": "playwright test --update-snapshots",
+        "test:e2e:ui": "playwright test --ui",
+        "create-component": "node scripts/createComponent.js",
+        "lint": "eslint src/**/* --fix"
+    },
+    "devDependencies": {
+        "@astrojs/check": "0.9.6",
+        "@astrojs/node": "9.5.1",
+        "@astrojs/react": "4.4.2",
+        "@astrojs/svelte": "7.2.2",
+        "@eslint/js": "9.39.1",
+        "@playwright/test": "1.57.0",
+        "@types/node": "24.10.1",
+        "@typescript-eslint/parser": "8.48.1",
+        "astro": "5.16.4",
+        "astro-eslint-parser": "1.2.2",
+        "eslint": "9.39.1",
+        "eslint-plugin-astro": "1.5.0",
+        "eslint-plugin-react": "7.37.5",
+        "eslint-plugin-simple-import-sort": "12.1.1",
+        "eslint-plugin-svelte": "3.13.1",
+        "husky": "9.1.7",
+        "jsdom": "27.2.0",
+        "lint-staged": "16.2.7",
+        "react": "19.2.1",
+        "react-dom": "19.2.1",
+        "sass": "1.94.2",
+        "sass-true": "10.0.1",
+        "svelte": "5.45.6",
+        "svelte-eslint-parser": "1.4.1",
+        "typescript": "5.9.3",
+        "typescript-eslint": "8.48.1",
+        "vite-tsconfig-paths": "5.1.4",
+        "vitest": "4.0.15"
+    },
+    "exports": {
+        ".": "./index.js",
+        "./astro": "./astro.js",
+        "./svelte": "./svelte.js",
+        "./react": "./react.js",
+        "./icons": "./icons.js",
+        "./integration": "./integration.js",
+        "./styles": "./scss/index.scss",
+        "./config": "./scss/config.scss"
+    },
+    "files": [
+        "components",
+        "icons",
+        "scss",
+        "utils",
+        "astro.d.ts",
+        "astro.js",
+        "icons.d.ts",
+        "icons.js",
+        "svelte.d.ts",
+        "svelte.js",
+        "react.d.ts",
+        "react.js",
+        "index.js",
+        "index.d.ts",
+        "integration.js",
+        "integration.d.ts",
+        "README.md",
+        "LICENSE"
+    ],
+    "license": "MIT",
+    "description": "UI component and template library for Astro, Svelte, and React apps styled with Sass.",
+    "keywords": [
+        "webcore",
+        "components",
+        "ui components",
+        "ui library",
+        "component library",
+        "withastro",
+        "astro",
+        "astro ui",
+        "astro ui library",
+        "astro-component",
+        "astro components",
+        "svelte components",
+        "react components"
+    ],
+    "homepage": "https://webcoreui.dev",
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/Frontendland/webcoreui.git"
+    },
+    "bugs": {
+        "url": "https://github.com/Frontendland/webcoreui/issues"
+    },
+    "lint-staged": {
+        "*.{js,ts,jsx,tsx,svelte,astro}": "eslint src/**/*"
+    }
+}

package/react.d.ts

@@ -15,6 +15,7 @@ import type { ReactCollapsibleProps as WReactCollapsibleProps } from './componen
 import type { ReactConditionalWrapperProps as WReactConditionalWrapperProps } from './components/ConditionalWrapper/conditionalwrapper'
 import type { ReactContextMenuProps as WReactContextMenuProps } from './components/ContextMenu/contextmenu'
 import type { ReactCopyProps as WReactCopyProps } from './components/Copy/copy'
+import type { ReactCounterProps as WReactCounterProps } from './components/Counter/counter'
 import type { ReactDataTableProps as WReactDataTableProps } from './components/DataTable/datatable'
 import type { ReactFlexProps as WReactFlexProps } from './components/Flex/flex'
 import type { ReactFooterProps as WReactFooterProps } from './components/Footer/footer'
@@ -76,6 +77,7 @@ declare module 'webcoreui/react' {
 	export const ConditionalWrapper: FC<WReactConditionalWrapperProps>
 	export const ContextMenu: FC<WReactContextMenuProps>
 	export const Copy: FC<WReactCopyProps>
+	export const Counter: FC<WReactCounterProps>
 	export const DataTable: FC<WReactDataTableProps>
 	export const Flex: FC<WReactFlexProps>
 	export const Footer: FC<WReactFooterProps>
@@ -130,6 +132,7 @@ declare module 'webcoreui/react' {
 	export type ConditionalWrapperProps = WReactConditionalWrapperProps
 	export type ContextMenuProps = WReactContextMenuProps
 	export type CopyProps = WReactCopyProps
+	export type CounterProps = WReactCounterProps
 	export type DataTableProps = WReactDataTableProps
 	export type FlexProps = WReactFlexProps
 	export type FooterProps = WReactFooterProps

package/react.js

@@ -14,6 +14,7 @@ import CollapsibleComponent from './components/Collapsible/Collapsible.tsx'
 import ConditionalWrapperComponent from './components/ConditionalWrapper/ConditionalWrapper.tsx'
 import ContextMenuComponent from './components/ContextMenu/ContextMenu.tsx'
 import CopyComponent from './components/Copy/Copy.tsx'
+import CounterComponent from './components/Counter/Counter.tsx'
 import DataTableComponent from './components/DataTable/DataTable.tsx'
 import FlexComponent from './components/Flex/Flex.tsx'
 import FooterComponent from './components/Footer/Footer.tsx'
@@ -68,6 +69,7 @@ export const Collapsible = CollapsibleComponent
 export const ConditionalWrapper = ConditionalWrapperComponent
 export const ContextMenu = ContextMenuComponent
 export const Copy = CopyComponent
+export const Counter = CounterComponent
 export const DataTable = DataTableComponent
 export const Flex = FlexComponent
 export const Footer = FooterComponent

package/svelte.d.ts

@@ -15,6 +15,7 @@ import type { SvelteCollapsibleProps as WSvelteCollapsibleProps } from './compon
 import type { SvelteConditionalWrapperProps as WSvelteConditionalWrapperProps } from './components/ConditionalWrapper/conditionalwrapper'
 import type { SvelteContextMenuProps as WSvelteContextMenuProps } from './components/ContextMenu/contextmenu'
 import type { SvelteCopyProps as WSvelteCopyProps } from './components/Copy/copy'
+import type { SvelteCounterProps as WSvelteCounterProps } from './components/Counter/counter'
 import type { SvelteDataTableProps as WSvelteDataTableProps } from './components/DataTable/datatable'
 import type { SvelteFlexProps as WSvelteFlexProps } from './components/Flex/flex'
 import type { SvelteFooterProps as WSvelteFooterProps } from './components/Footer/footer'
@@ -76,6 +77,7 @@ declare module 'webcoreui/svelte' {
 	export const ConditionalWrapper: Component<WSvelteConditionalWrapperProps>
 	export const ContextMenu: Component<WSvelteContextMenuProps>
 	export const Copy: Component<WSvelteCopyProps>
+	export const Counter: Component<WSvelteCounterProps>
 	export const DataTable: Component<WSvelteDataTableProps>
 	export const Flex: Component<WSvelteFlexProps>
 	export const Footer: Component<WSvelteFooterProps>
@@ -130,6 +132,7 @@ declare module 'webcoreui/svelte' {
 	export type ConditionalWrapperProps = WSvelteConditionalWrapperProps
 	export type ContextMenuProps = WSvelteContextMenuProps
 	export type CopyProps = WSvelteCopyProps
+	export type CounterProps = WSvelteCounterProps
 	export type DataTableProps = WSvelteDataTableProps
 	export type FlexProps = WSvelteFlexProps
 	export type FooterProps = WSvelteFooterProps

package/svelte.js

@@ -14,6 +14,7 @@ import CollapsibleComponent from './components/Collapsible/Collapsible.svelte'
 import ConditionalWrapperComponent from './components/ConditionalWrapper/ConditionalWrapper.svelte'
 import ContextMenuComponent from './components/ContextMenu/ContextMenu.svelte'
 import CopyComponent from './components/Copy/Copy.svelte'
+import CounterComponent from './components/Counter/Counter.svelte'
 import DataTableComponent from './components/DataTable/DataTable.svelte'
 import FlexComponent from './components/Flex/Flex.svelte'
 import FooterComponent from './components/Footer/Footer.svelte'
@@ -68,6 +69,7 @@ export const Collapsible = CollapsibleComponent
 export const ConditionalWrapper = ConditionalWrapperComponent
 export const ContextMenu = ContextMenuComponent
 export const Copy = CopyComponent
+export const Counter = CounterComponent
 export const DataTable = DataTableComponent
 export const Flex = FlexComponent
 export const Footer = FooterComponent