fix: format & use show for conditional checking

apps/docs/src/examples/file-upload.module.css

@@ -1,114 +1,114 @@
 .fileUpload {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  width: 100%;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	width: 100%;
 	min-height: 300px;
-  row-gap: 5px;
+	row-gap: 5px;
 }
 
 .fileUpload__label {
-  color: white;
-  font-size: 14px;
-  font-weight: 500;
-  user-select: none;
+	color: white;
+	font-size: 14px;
+	font-weight: 500;
+	user-select: none;
 }
 
 .fileUpload__dropzone {
 	padding: 20px;
-  display: flex;
-  flex-direction: column;
-  row-gap: 10px;
-  align-items: center;
-  justify-content: center;
-  border: 1px dashed rgb(42, 42, 40);
-  width: 100%;
-  min-height: 200px;
-  color: #ccc;
-  border-radius: 6px;
+	display: flex;
+	flex-direction: column;
+	row-gap: 10px;
+	align-items: center;
+	justify-content: center;
+	border: 1px dashed rgb(42, 42, 40);
+	width: 100%;
+	min-height: 200px;
+	color: #ccc;
+	border-radius: 6px;
 }
 
 .fileUpload__trigger {
-  background-color: hsl(201 96% 32%);
-  color: white;
-  padding: 5px 10px;
-  border-radius: 4px;
+	background-color: hsl(201 96% 32%);
+	color: white;
+	padding: 5px 10px;
+	border-radius: 4px;
 }
 
 .fileUpload__itemGroup {
-  display: flex;
-  flex-direction: column;
-  gap: 3px;
-  width: 100%;
+	display: flex;
+	flex-direction: column;
+	gap: 3px;
+	width: 100%;
 }
 
 .fileUpload__item {
-  width: 100%;
-  display: grid;
-  padding: 16px;
-  column-gap: 10px;
-  border-radius: 6px;
-  grid-template-columns: auto 1fr auto;
-  grid-template-areas:
-    "preview name delete"
-    "preview size delete";
-  column-gap: 5px;
-  border: 1px solid rgb(42, 42, 40);
-  padding: 10px;
+	width: 100%;
+	display: grid;
+	padding: 16px;
+	column-gap: 10px;
+	border-radius: 6px;
+	grid-template-columns: auto 1fr auto;
+	grid-template-areas:
+		"preview name delete"
+		"preview size delete";
+	column-gap: 5px;
+	border: 1px solid rgb(42, 42, 40);
+	padding: 10px;
 }
 
 .fileUpload__itemPreview {
-  grid-area: preview;
+	grid-area: preview;
 }
 
 .fileUpload__itemPreviewImage {
-  width: 50px;
-  object-fit: scale-down;
-  height: auto;
-  aspect-ratio: 1;
+	width: 50px;
+	object-fit: scale-down;
+	height: auto;
+	aspect-ratio: 1;
 }
 
 .fileUpload__itemName {
-  grid-area: name;
-  font-size: 14px;
-  color: #fff;
+	grid-area: name;
+	font-size: 14px;
+	color: #fff;
 }
 
 .fileUpload__itemSize {
-  grid-area: size;
-  font-size: 14px;
-  color: rgb(181, 179, 173);
+	grid-area: size;
+	font-size: 14px;
+	color: rgb(181, 179, 173);
 }
 
 .fileUpload__itemDeleteTrigger {
-  grid-area: delete;
-  cursor: pointer;
-  background-color: #a23434;
-  color: white;
-  padding: 2px 8px;
-  border-radius: 4px;
-  height: max-content;
-  align-self: center;
+	grid-area: delete;
+	cursor: pointer;
+	background-color: #a23434;
+	color: white;
+	padding: 2px 8px;
+	border-radius: 4px;
+	height: max-content;
+	align-self: center;
 }
 
 .formContainer {
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  row-gap: 5px;
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	row-gap: 5px;
 }
 
 .formContainer > .fileUpload__dropzone {
-  min-height: 200px;
+	min-height: 200px;
 }
 
 .submit-btn {
-  background-color: hsl(201 96% 32%);
-  color: white;
-  padding: 5px 10px;
-  border-radius: 4px;
-  align-self: flex-end;
+	background-color: hsl(201 96% 32%);
+	color: white;
+	padding: 5px 10px;
+	border-radius: 4px;
+	align-self: flex-end;
 }