ar-design 0.1.49 → 0.1.50

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -36,6 +36,27 @@
36
36
  transform-origin: bottom;
37
37
  }
38
38
 
39
+ .ar-date-picker > label {
40
+ visibility: hidden;
41
+ opacity: 0;
42
+ position: absolute;
43
+ top: 0.5rem;
44
+ left: 0.55rem;
45
+ color: var(--gray-600);
46
+ letter-spacing: 1px;
47
+ transition: top 250ms ease-in-out;
48
+ z-index: 1;
49
+ }
50
+ .ar-date-picker > label.visible {
51
+ visibility: visible;
52
+ opacity: 1;
53
+ top: -0.5rem;
54
+ left: 0.55rem;
55
+ background-color: var(--white);
56
+ padding: 0 0.5rem;
57
+ font-size: 0.75rem;
58
+ }
59
+
39
60
  @import url("./calendar/header.css");
40
61
  @import url("./calendar/content.css");
41
62
  @import url("./calendar/footer.css");
@@ -265,6 +265,7 @@ const DatePicker = ({ onChange, isClock, ...attributes }) => {
265
265
  }
266
266
  }, [timeTrigger, calendarOpen, isClock]);
267
267
  return (React.createElement("div", { className: "ar-date-picker" },
268
+ attributes.placeholder && (React.createElement("label", { className: attributes.value ? "visible" : "hidden" }, attributes.placeholder)),
268
269
  React.createElement(Input, { ref: _beginDate, type: isClock ? "datetime-local" : "date", onKeyDown: (event) => event.code == "Space" && event.preventDefault(), onChange: (event) => {
269
270
  // Disabled gelmesi durumunda işlem yapmasına izin verme...
270
271
  if (attributes.disabled)
@@ -288,7 +289,7 @@ const DatePicker = ({ onChange, isClock, ...attributes }) => {
288
289
  }, onClick: (event) => {
289
290
  event.preventDefault();
290
291
  setCalendarOpen(true);
291
- }, autoComplete: "off", placeholder: attributes.placeholder }),
292
+ }, autoComplete: "off" }),
292
293
  React.createElement("div", { ref: _arCalendar, className: calendarClassName.map((className) => className).join(" ") },
293
294
  React.createElement("div", { className: "header" },
294
295
  React.createElement("div", { className: "select-field" },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ar-design",
3
- "version": "0.1.49",
3
+ "version": "0.1.50",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",