tera-system-ui 0.0.65 → 0.0.67

package/dist/components/input/Input.js

@@ -3,9 +3,9 @@ export const styles = tv({
     base: 'relative w-full inline-flex items-center justify-center rounded outline-none transition-all duration-element-react ring-primary-token-5/50',
     variants: {
         variant: {
-            outlined: 'border border-neutral-token-5 bg-transparent focus:border-primary-token-6 hover:border-primary-token-5 focus-visible:ring-2',
-            filled: 'bg-neutral-token-3 border border-neutral-token-3 focus:bg-transparent focus:border-primary-token-6 hover:bg-neutral-token-4 focus-visible:ring-2',
-            borderless: 'bg-transparent border-0',
+            outlined: 'border border-neutral-token-5 bg-neutral-token-1 focus:border-primary-token-6 hover:border-primary-token-5 focus-visible:ring-2',
+            filled: 'bg-neutral-token-3 border border-neutral-token-4 focus:bg-neutral-token-1 focus:border-primary-token-6 hover:bg-neutral-token-4 focus-visible:ring-2',
+            borderless: 'bg-neutral-token-1 border-0',
         },
         disabled: {
             true: 'cursor-not-allowed opacity-70 text-neutral-token-10',

package/dist/components/select/Select.d.ts

@@ -0,0 +1,115 @@
+import { type VariantProps } from "tailwind-variants";
+export declare const styles: import("tailwind-variants").TVReturnType<{
+    variant: {
+        outlined: string;
+        filled: string;
+        borderless: string;
+    };
+    disabled: {
+        true: string;
+        false: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}, undefined, "relative w-full inline-flex items-center justify-center rounded outline-none transition-all duration-element-react ring-primary-token-5/50", import("tailwind-variants/dist/config").TVConfig<{
+    variant: {
+        outlined: string;
+        filled: string;
+        borderless: string;
+    };
+    disabled: {
+        true: string;
+        false: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}, {
+    variant: {
+        outlined: string;
+        filled: string;
+        borderless: string;
+    };
+    disabled: {
+        true: string;
+        false: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}>, {
+    variant: {
+        outlined: string;
+        filled: string;
+        borderless: string;
+    };
+    disabled: {
+        true: string;
+        false: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        outlined: string;
+        filled: string;
+        borderless: string;
+    };
+    disabled: {
+        true: string;
+        false: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}, undefined, "relative w-full inline-flex items-center justify-center rounded outline-none transition-all duration-element-react ring-primary-token-5/50", import("tailwind-variants/dist/config").TVConfig<{
+    variant: {
+        outlined: string;
+        filled: string;
+        borderless: string;
+    };
+    disabled: {
+        true: string;
+        false: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}, {
+    variant: {
+        outlined: string;
+        filled: string;
+        borderless: string;
+    };
+    disabled: {
+        true: string;
+        false: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}>, unknown, unknown, undefined>>;
+type SelectVariants = VariantProps<typeof styles>;
+export interface SelectProps extends SelectVariants {
+    children?: any;
+    class?: string;
+    value?: string;
+    ref?: HTMLInputElement;
+}
+export {};

package/dist/components/select/Select.js

@@ -0,0 +1,36 @@
+import { tv } from "tailwind-variants";
+export const styles = tv({
+    base: 'relative w-full inline-flex items-center justify-center rounded outline-none transition-all duration-element-react ring-primary-token-5/50',
+    variants: {
+        variant: {
+            outlined: 'border border-neutral-token-5 bg-neutral-token-1 focus:border-primary-token-6 hover:border-primary-token-5 focus-visible:ring-2',
+            filled: 'bg-neutral-token-3 border border-neutral-token-4 focus:bg-neutral-token-1 focus:border-primary-token-6 hover:bg-neutral-token-4 focus-visible:ring-2',
+            borderless: 'bg-neutral-token-1 border-0',
+        },
+        disabled: {
+            true: 'cursor-not-allowed opacity-70 text-neutral-token-10',
+            false: 'cursor-text',
+        },
+        size: {
+            sm: 'h-6 px-2 text-sm',
+            md: 'h-8 px-3 text-base',
+            lg: 'h-10 px-3 text-lg',
+        },
+    },
+    compoundVariants: [
+        {
+            variant: 'outlined',
+            disabled: true,
+            class: 'hover:border-neutral-token-5'
+        },
+        {
+            variant: 'filled',
+            disabled: true,
+            class: 'hover:bg-neutral-token-3'
+        }
+    ],
+    defaultVariants: {
+        variant: 'outlined',
+        size: 'md'
+    },
+});

package/dist/components/select/Select.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+    import './select.scss'
+
+    import {type SelectProps, styles} from "./Select";
+
+    let {children, variant, disabled, size, class: className, ...props}: SelectProps = $props();
+
+</script>
+
+<select {...props}
+        class={"tera-select pr-3" + styles({ variant, disabled , size, className: className})}
+>
+    {@render children?.()}
+</select>

package/dist/components/select/Select.svelte.d.ts

@@ -0,0 +1,4 @@
+import './select.scss';
+import { type SelectProps } from "./Select";
+declare const Select: import("svelte").Component<SelectProps, {}, "">;
+export default Select;

package/dist/components/select/index.d.ts

@@ -0,0 +1 @@
+export { default as Select } from './Select.svelte';

package/dist/components/select/index.js

@@ -0,0 +1 @@
+export { default as Select } from './Select.svelte';

package/dist/components/select/select.scss

@@ -0,0 +1,5 @@
+.tera-select {
+    option {
+        @apply bg-neutral-token-2 text-neutral-token-13 ;
+    }
+}

package/dist/components/side-navigation/SideNavigation.svelte

@@ -123,9 +123,5 @@
             </SideNavItem>
         {/each}
     </ul>
-    <div>
-        <div class="w-[3rem] mb-[var(--ads-padding-bottom,2rem)] flex justify-center">
-            <LightDarkToggle/>
-        </div>
-    </div>
+
 </nav>

package/dist/index.d.ts

@@ -14,6 +14,7 @@ export { LanguagePickerButton } from './components/language-picker-button';
 export { LightDarkToggle } from './components/light-dark-toggle';
 export { Popover } from './components/popover';
 export { PopoverResponsive } from './components/popover-responsive';
+export { Select } from './components/select';
 export { SideNavigation, SideNavigationLayout, toggleSideNavigation } from './components/side-navigation';
 export { Slider } from './components/slider';
 export { StarRating } from './components/star-rating';

package/dist/index.js

@@ -14,6 +14,7 @@ export { LanguagePickerButton } from './components/language-picker-button';
 export { LightDarkToggle } from './components/light-dark-toggle';
 export { Popover } from './components/popover';
 export { PopoverResponsive } from './components/popover-responsive';
+export { Select } from './components/select';
 export { SideNavigation, SideNavigationLayout, toggleSideNavigation } from './components/side-navigation';
 export { Slider } from './components/slider';
 export { StarRating } from './components/star-rating';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "tera-system-ui",
-	"version": "0.0.65",
+	"version": "0.0.67",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "npm run customPrepublish && npm run generate-index && vite build && npm run package && npm run postpublish",