added a bit padding on the inputs

Author: marcus-wishes

library/src/components/styleHelper.ts

@@ -4,7 +4,7 @@ export const overlayBaseStyle =
 	"bg-surface-overlay relative shadow-overlay border-border border-solid border z-50 rounded overflow-auto max-h-full" /* only-x-auto to allow for horizontal scrolling but do not cut off the outline */
 
 export const inputBaseStyle = twJoin(
-	"min-h-9 rounded box-border w-full relative border-[0.88px] border-input-border bg-input focus-within:bg-input-active border-solid focus-within:border-transparent data-[active=true]:border-transparent data-[invalid=true]:border-transparent ease-in-out transition duration-200 p-0  ",
+	"px-0.5 min-h-9 rounded box-border w-full relative border-[0.88px] border-input-border bg-input focus-within:bg-input-active border-solid focus-within:border-transparent data-[active=true]:border-transparent data-[invalid=true]:border-transparent ease-in-out transition duration-200 p-0  ",
 	"before:pointer-events-none before:z-10 before:content-[''] before:absolute before:-inset-[0.5px] before:box-border before:rounded before:border-2 before:border-solid before:border-transparent",
 	"focus-within:before:border-input-border-focused",
 	"data-[active=true]:before:border-input-border-focused",

showcase/src/components/showcase/wrapper/LayeringShowcase.tsx

@@ -1,6 +1,6 @@
 import React from "react"
 import ShowcaseWrapperItem, {
-	ShowcaseProps,
+	type ShowcaseProps,
 } from "../../ShowCaseWrapperItem/ShowcaseWrapperItem"
 import {
 	Button,
@@ -19,6 +19,7 @@ function Example() {
 			<div className="flex p-4">
 				<Input placeholder="Test Input" />
 				<Input disabled placeholder="Test Input Disabled" />
+				<Input placeholder="Test Input 2" />
 				<Select
 					options={[
 						{ label: "Test", value: "test" },