amotify 0.2.196 → 0.2.198

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.
@@ -1 +1 @@
1
- :root{--cH_comun: 237;--cS_comun: 76%;--cL_comun: 58%;--color_comun-hsl: 237, 76%, 58%;--cH_leaf: 159;--cS_leaf: 78%;--cL_leaf: 38%;--color_leaf-hsl: 159, 78%, 38%;--cH_heart: 2;--cS_heart: 81%;--cL_heart: 63%;--color_heart-hsl: 2, 81%, 63%;--cH_droplet: 215;--cS_droplet: 82%;--cL_droplet: 51%;--color_droplet-hsl: 215, 82%, 51%;--cH_brick: 351;--cS_brick: 80%;--cL_brick: 39%;--color_brick-hsl: 351, 80%, 39%;--cH_flower: 350;--cS_flower: 78%;--cL_flower: 75%;--color_flower-hsl: 350, 78%, 75%;--cH_lip: 340;--cS_lip: 69%;--cL_lip: 49%;--color_lip-hsl: 340, 69%, 49%;--cH_wine: 317;--cS_wine: 41%;--cL_wine: 30%;--color_wine-hsl: 317, 41%, 30%;--cH_theater: 301;--cS_theater: 88%;--cL_theater: 49%;--color_theater-hsl: 301, 88%, 49%;--cH_bat: 272;--cS_bat: 81%;--cL_bat: 21%;--color_bat-hsl: 272, 81%, 21%;--cH_poizon: 268;--cS_poizon: 58%;--cL_poizon: 50%;--color_poizon-hsl: 268, 58%, 50%;--cH_eggplant: 264;--cS_eggplant: 100%;--cL_eggplant: 62%;--color_eggplant-hsl: 264, 100%, 62%;--cH_ufo: 253;--cS_ufo: 81%;--cL_ufo: 58%;--color_ufo-hsl: 253, 81%, 58%;--cH_alien: 252;--cS_alien: 92%;--cL_alien: 57%;--color_alien-hsl: 252, 92%, 57%;--cH_tombstone: 251;--cS_tombstone: 14%;--cL_tombstone: 70%;--color_tombstone-hsl: 251, 14%, 70%;--cH_ninja: 242;--cS_ninja: 100%;--cL_ninja: 68%;--color_ninja-hsl: 242, 100%, 68%;--cH_moon: 240;--cS_moon: 16%;--cL_moon: 24%;--color_moon-hsl: 240, 16%, 24%;--cH_rain: 240;--cS_rain: 32%;--cL_rain: 54%;--color_rain-hsl: 240, 32%, 54%;--cH_unicorn: 238;--cS_unicorn: 70%;--cL_unicorn: 74%;--color_unicorn-hsl: 238, 70%, 74%;--cH_axe: 226;--cS_axe: 22%;--cL_axe: 35%;--color_axe-hsl: 226, 22%, 35%;--cH_gem: 221;--cS_gem: 85%;--cL_gem: 43%;--color_gem-hsl: 221, 85%, 43%;--cH_soap: 217;--cS_soap: 85%;--cL_soap: 32%;--color_soap-hsl: 217, 85%, 32%;--cH_drizzle: 213;--cS_drizzle: 33%;--cL_drizzle: 68%;--color_drizzle-hsl: 213, 33%, 68%;--cH_building: 204;--cS_building: 3%;--cL_building: 72%;--color_building-hsl: 204, 3%, 72%;--cH_fish: 194;--cS_fish: 97%;--cL_fish: 34%;--color_fish-hsl: 194, 97%, 34%;--cH_icicles: 191;--cS_icicles: 61%;--cL_icicles: 58%;--color_icicles-hsl: 191, 61%, 58%;--cH_water: 187;--cS_water: 30%;--cL_water: 54%;--color_water-hsl: 187, 30%, 54%;--cH_tree1: 186;--cS_tree1: 85%;--cL_tree1: 23%;--color_tree1-hsl: 186, 85%, 23%;--cH_tree2: 185;--cS_tree2: 97%;--cL_tree2: 34%;--color_tree2-hsl: 185, 97%, 34%;--cH_tree3: 183;--cS_tree3: 86%;--cL_tree3: 19%;--color_tree3-hsl: 183, 86%, 19%;--cH_battery: 170;--cS_battery: 90%;--cL_battery: 39%;--color_battery-hsl: 170, 90%, 39%;--cH_seedle: 145;--cS_seedle: 94%;--cL_seedle: 40%;--color_seedle-hsl: 145, 94%, 40%;--cH_greenTea: 144;--cS_greenTea: 43%;--cL_greenTea: 41%;--color_greenTea-hsl: 144, 43%, 41%;--cH_oak: 101;--cS_oak: 24%;--cL_oak: 66%;--color_oak-hsl: 101, 24%, 66%;--cH_salad: 68;--cS_salad: 90%;--cL_salad: 43%;--color_salad-hsl: 68, 90%, 43%;--cH_cloudy: 60;--cS_cloudy: 5%;--cL_cloudy: 79%;--color_cloudy-hsl: 60, 5%, 79%;--cH_lemon: 53;--cS_lemon: 78%;--cL_lemon: 70%;--color_lemon-hsl: 53, 78%, 70%;--cH_angel: 47;--cS_angel: 100%;--cL_angel: 50%;--color_angel-hsl: 47, 100%, 50%;--cH_parasol: 42;--cS_parasol: 86%;--cL_parasol: 70%;--color_parasol-hsl: 42, 86%, 70%;--cH_pizza: 40;--cS_pizza: 92%;--cL_pizza: 52%;--color_pizza-hsl: 40, 92%, 52%;--cH_thunder: 40;--cS_thunder: 70%;--cL_thunder: 57%;--color_thunder-hsl: 40, 70%, 57%;--cH_latte: 33;--cS_latte: 51%;--cL_latte: 73%;--color_latte-hsl: 33, 51%, 73%;--cH_island: 27;--cS_island: 91%;--cL_island: 55%;--color_island-hsl: 27, 91%, 55%;--cH_shovel: 19;--cS_shovel: 29%;--cL_shovel: 37%;--color_shovel-hsl: 19, 29%, 37%;--cH_coffee: 18;--cS_coffee: 33%;--cL_coffee: 24%;--color_coffee-hsl: 18, 33%, 24%;--cH_carrot: 14;--cS_carrot: 84%;--cL_carrot: 59%;--color_carrot-hsl: 14, 84%, 59%;--cH_cactus: 8;--cS_cactus: 17%;--cL_cactus: 62%;--color_cactus-hsl: 8, 17%, 62%;--cH_volcano: 6;--cS_volcano: 84%;--cL_volcano: 48%;--color_volcano-hsl: 6, 84%, 48%;--cH_choco: 2;--cS_choco: 55%;--cL_choco: 57%;--color_choco-hsl: 2, 55%, 57%;--cH_industry: 0;--cS_industry: 0%;--cL_industry: 50%;--color_industry-hsl: 0, 0%, 50%;--cH_gun: 0;--cS_gun: 0%;--cL_gun: 37%;--color_gun-hsl: 0, 0%, 37%;--cH_galaxy: 0;--cS_galaxy: 0%;--cL_galaxy: 5%;--color_galaxy-hsl: 0, 0%, 5%;--cH_line: 120;--cS_line: 100%;--cL_line: 37%;--color_line-hsl: 120, 100%, 37%;--cH_twitter: 203;--cS_twitter: 89%;--cL_twitter: 52%;--color_twitter-hsl: 203, 89%, 52%;--cH_amazon: 36;--cS_amazon: 100%;--cL_amazon: 50%;--color_amazon-hsl: 36, 100%, 50%;--cH_facebook: 220;--cS_facebook: 46%;--cL_facebook: 48%;--color_facebook-hsl: 220, 46%, 48%;--cH_android: 101;--cS_android: 47%;--cL_android: 55%;--color_android-hsl: 101, 47%, 55%;--cH_slackBlue: 194;--cS_slackBlue: 86%;--cL_slackBlue: 58%;--color_slackBlue-hsl: 194, 86%, 58%;--cH_slackGreen: 155;--cS_slackGreen: 60%;--cL_slackGreen: 45%;--color_slackGreen-hsl: 155, 60%, 45%;--cH_slackRed: 341;--cS_slackRed: 76%;--cL_slackRed: 50%;--color_slackRed-hsl: 341, 76%, 50%;--cH_slackYellow: 42;--cS_slackYellow: 83%;--cL_slackYellow: 55%;--color_slackYellow-hsl: 42, 83%, 55%;--cH_slackBase: 299;--cS_slackBase: 56%;--cL_slackBase: 19%;--color_slackBase-hsl: 299, 56%, 19%;--cH_googleBlue: 217;--cS_googleBlue: 89%;--cL_googleBlue: 61%;--color_googleBlue-hsl: 217, 89%, 61%;--cH_googleGreen: 151;--cS_googleGreen: 83%;--cL_googleGreen: 34%;--color_googleGreen-hsl: 151, 83%, 34%;--cH_googleYellow: 44;--cS_googleYellow: 100%;--cL_googleYellow: 48%;--color_googleYellow-hsl: 44, 100%, 48%;--cH_googleRed: 5;--cS_googleRed: 69%;--cL_googleRed: 54%;--color_googleRed-hsl: 5, 69%, 54%;--cH: 0;--cS: 0%;--cL: 0%;--color-theme-hsl: 0, 0%, 0%;--color-theme-opacity-high: .5;--color-theme-opacity-middle: .25;--color-theme-opacity-low: .15;--color-theme-opacity-few: .085;--color-positive-rgb: 54, 194, 124;--color-negative-rgb: 246, 70, 93;--color-warning-rgb: 248, 150, 0;--color-dark-rgb: 69, 81, 92;--color-positive: rgba(var(--color-positive-rgb), 1);--color-negative: rgba(var(--color-negative-rgb), 1);--color-warning: rgba(var(--color-warning-rgb), 1);--color-dark: rgba(var(--color-dark-rgb), 1);--color-layer0-hsl: var(--cH), 10%, 99%;--color-layer1-hsl: var(--cH), 6%, 99%;--color-layer2-hsl: var(--cH), 6%, 96%;--color-layer3-hsl: var(--cH), 6%, 92%;--color-layer4-hsl: var(--cH), 5%, 89%;--color-layer5-hsl: var(--cH), 4%, 85%;--color-layer6-hsl: var(--cH), 3%, 75%;--color-base-rgb: 252, 252, 252;--color-gray-rgb: 211, 216, 222;--color-cloud-rgb: 241, 243, 248;--color-mono-positive-rgb: 0, 0, 0;--color-mono-negative-rgb: 255, 255, 255;--font-color-logoTitle: hsl(218, 45%, 22%);--sc: 60, 64, 67;--shadow_style_0: 0px 1px 2px 0px;--shadow_style_1: 0px 2px 4px 0px;--shadow_style_2: 1px 3px 8px 0px;--shadow_style_3: 2px 6px 12px;--shadow_style_4: .4rem 1rem 2rem;--shadow_style_5: 1rem 1.5rem 3rem;--shadow_color_min: rgba(var(--sc), .05);--shadow_color_normal: rgba(var(--sc), .15);--shadow_color_remark: rgba(var(--sc), .28);--shadow_color_max: rgba(var(--sc), .41);--font-color1-rgb: 0, 0, 0;--font-color2-rgb: 51, 51, 51;--font-color3-rgb: 118, 125, 137;--font-color4-rgb: 152, 158, 167;--font-color5-rgb: 189, 194, 200;--font-color6-rgb: 210, 210, 220;--font-size0: 10px;--font-size1: 12px;--font-size2: 14px;--font-size3: 16px;--font-size4: 20px;--font-size5: 24px;--font-size6: 32px;--font-size7: 44px;--font-size8: 60px;--border-color-thin: hsl(220, 9%, 92%);--border-color-normal: hsl(220, 9%, 87%);--border-color-thick: hsl(0, 0%, 40%);--border-radius1: 4px;--border-radius2: 6px;--border-radius3: 8px;--border-radius4: 12px;--border-radius5: 18px;--border-radius6: 24px;--border-radius7: 30px;--animation-time1: .1s;--animation-time2: .15s;--animation-time3: .25s;--animation-time4: .4s;--animation-style1: cubic-bezier(.35, .46, 0, .99);--animation-style2: cubic-bezier(.1, .85, .1, .85);--safe-area-top: env(safe-area-inset-top);--safe-area-bottom: env(safe-area-inset-bottom);--safe-area-left: env(safe-area-inset-left);--safe-area-right: env(safe-area-inset-right);--grid-unit: 12px;--viewHeight: 100vh;--viewWidth: 100vw;--sideNavHeight: 0px;--topNavHeight: 0px;--sideNavWidth: 0px;--contentHeight: 0px;--contnetWidth: 0px;--topBase: 0px}@supports (-webkit-touch-callout: none){:root{--viewHeight: -webkit-fill-available}}.bdsTC_comun{--cH: var(--cH_comun);--cS: var(--cS_comun);--cL: var(--cL_comun);--color-theme-hsl: var(--color_comun-hsl)}.bdsTC_leaf{--cH: var(--cH_leaf);--cS: var(--cS_leaf);--cL: var(--cL_leaf);--color-theme-hsl: var(--color_leaf-hsl)}.bdsTC_heart{--cH: var(--cH_heart);--cS: var(--cS_heart);--cL: var(--cL_heart);--color-theme-hsl: var(--color_heart-hsl)}.bdsTC_droplet{--cH: var(--cH_droplet);--cS: var(--cS_droplet);--cL: var(--cL_droplet);--color-theme-hsl: var(--color_droplet-hsl)}.bdsTC_brick{--cH: var(--cH_brick);--cS: var(--cS_brick);--cL: var(--cL_brick);--color-theme-hsl: var(--color_brick-hsl)}.bdsTC_flower{--cH: var(--cH_flower);--cS: var(--cS_flower);--cL: var(--cL_flower);--color-theme-hsl: var(--color_flower-hsl)}.bdsTC_lip{--cH: var(--cH_lip);--cS: var(--cS_lip);--cL: var(--cL_lip);--color-theme-hsl: var(--color_lip-hsl)}.bdsTC_wine{--cH: var(--cH_wine);--cS: var(--cS_wine);--cL: var(--cL_wine);--color-theme-hsl: var(--color_wine-hsl)}.bdsTC_theater{--cH: var(--cH_theater);--cS: var(--cS_theater);--cL: var(--cL_theater);--color-theme-hsl: var(--color_theater-hsl)}.bdsTC_bat{--cH: var(--cH_bat);--cS: var(--cS_bat);--cL: var(--cL_bat);--color-theme-hsl: var(--color_bat-hsl)}.bdsTC_poizon{--cH: var(--cH_poizon);--cS: var(--cS_poizon);--cL: var(--cL_poizon);--color-theme-hsl: var(--color_poizon-hsl)}.bdsTC_eggplant{--cH: var(--cH_eggplant);--cS: var(--cS_eggplant);--cL: var(--cL_eggplant);--color-theme-hsl: var(--color_eggplant-hsl)}.bdsTC_ufo{--cH: var(--cH_ufo);--cS: var(--cS_ufo);--cL: var(--cL_ufo);--color-theme-hsl: var(--color_ufo-hsl)}.bdsTC_alien{--cH: var(--cH_alien);--cS: var(--cS_alien);--cL: var(--cL_alien);--color-theme-hsl: var(--color_alien-hsl)}.bdsTC_tombstone{--cH: var(--cH_tombstone);--cS: var(--cS_tombstone);--cL: var(--cL_tombstone);--color-theme-hsl: var(--color_tombstone-hsl)}.bdsTC_ninja{--cH: var(--cH_ninja);--cS: var(--cS_ninja);--cL: var(--cL_ninja);--color-theme-hsl: var(--color_ninja-hsl)}.bdsTC_moon{--cH: var(--cH_moon);--cS: var(--cS_moon);--cL: var(--cL_moon);--color-theme-hsl: var(--color_moon-hsl)}.bdsTC_rain{--cH: var(--cH_rain);--cS: var(--cS_rain);--cL: var(--cL_rain);--color-theme-hsl: var(--color_rain-hsl)}.bdsTC_unicorn{--cH: var(--cH_unicorn);--cS: var(--cS_unicorn);--cL: var(--cL_unicorn);--color-theme-hsl: var(--color_unicorn-hsl)}.bdsTC_axe{--cH: var(--cH_axe);--cS: var(--cS_axe);--cL: var(--cL_axe);--color-theme-hsl: var(--color_axe-hsl)}.bdsTC_gem{--cH: var(--cH_gem);--cS: var(--cS_gem);--cL: var(--cL_gem);--color-theme-hsl: var(--color_gem-hsl)}.bdsTC_soap{--cH: var(--cH_soap);--cS: var(--cS_soap);--cL: var(--cL_soap);--color-theme-hsl: var(--color_soap-hsl)}.bdsTC_drizzle{--cH: var(--cH_drizzle);--cS: var(--cS_drizzle);--cL: var(--cL_drizzle);--color-theme-hsl: var(--color_drizzle-hsl)}.bdsTC_building{--cH: var(--cH_building);--cS: var(--cS_building);--cL: var(--cL_building);--color-theme-hsl: var(--color_building-hsl)}.bdsTC_fish{--cH: var(--cH_fish);--cS: var(--cS_fish);--cL: var(--cL_fish);--color-theme-hsl: var(--color_fish-hsl)}.bdsTC_icicles{--cH: var(--cH_icicles);--cS: var(--cS_icicles);--cL: var(--cL_icicles);--color-theme-hsl: var(--color_icicles-hsl)}.bdsTC_water{--cH: var(--cH_water);--cS: var(--cS_water);--cL: var(--cL_water);--color-theme-hsl: var(--color_water-hsl)}.bdsTC_tree1{--cH: var(--cH_tree1);--cS: var(--cS_tree1);--cL: var(--cL_tree1);--color-theme-hsl: var(--color_tree1-hsl)}.bdsTC_tree2{--cH: var(--cH_tree2);--cS: var(--cS_tree2);--cL: var(--cL_tree2);--color-theme-hsl: var(--color_tree2-hsl)}.bdsTC_tree3{--cH: var(--cH_tree3);--cS: var(--cS_tree3);--cL: var(--cL_tree3);--color-theme-hsl: var(--color_tree3-hsl)}.bdsTC_battery{--cH: var(--cH_battery);--cS: var(--cS_battery);--cL: var(--cL_battery);--color-theme-hsl: var(--color_battery-hsl)}.bdsTC_seedle{--cH: var(--cH_seedle);--cS: var(--cS_seedle);--cL: var(--cL_seedle);--color-theme-hsl: var(--color_seedle-hsl)}.bdsTC_greenTea{--cH: var(--cH_greenTea);--cS: var(--cS_greenTea);--cL: var(--cL_greenTea);--color-theme-hsl: var(--color_greenTea-hsl)}.bdsTC_oak{--cH: var(--cH_oak);--cS: var(--cS_oak);--cL: var(--cL_oak);--color-theme-hsl: var(--color_oak-hsl)}.bdsTC_salad{--cH: var(--cH_salad);--cS: var(--cS_salad);--cL: var(--cL_salad);--color-theme-hsl: var(--color_salad-hsl)}.bdsTC_cloudy{--cH: var(--cH_cloudy);--cS: var(--cS_cloudy);--cL: var(--cL_cloudy);--color-theme-hsl: var(--color_cloudy-hsl)}.bdsTC_lemon{--cH: var(--cH_lemon);--cS: var(--cS_lemon);--cL: var(--cL_lemon);--color-theme-hsl: var(--color_lemon-hsl)}.bdsTC_angel{--cH: var(--cH_angel);--cS: var(--cS_angel);--cL: var(--cL_angel);--color-theme-hsl: var(--color_angel-hsl)}.bdsTC_parasol{--cH: var(--cH_parasol);--cS: var(--cS_parasol);--cL: var(--cL_parasol);--color-theme-hsl: var(--color_parasol-hsl)}.bdsTC_pizza{--cH: var(--cH_pizza);--cS: var(--cS_pizza);--cL: var(--cL_pizza);--color-theme-hsl: var(--color_pizza-hsl)}.bdsTC_thunder{--cH: var(--cH_thunder);--cS: var(--cS_thunder);--cL: var(--cL_thunder);--color-theme-hsl: var(--color_thunder-hsl)}.bdsTC_latte{--cH: var(--cH_latte);--cS: var(--cS_latte);--cL: var(--cL_latte);--color-theme-hsl: var(--color_latte-hsl)}.bdsTC_island{--cH: var(--cH_island);--cS: var(--cS_island);--cL: var(--cL_island);--color-theme-hsl: var(--color_island-hsl)}.bdsTC_shovel{--cH: var(--cH_shovel);--cS: var(--cS_shovel);--cL: var(--cL_shovel);--color-theme-hsl: var(--color_shovel-hsl)}.bdsTC_coffee{--cH: var(--cH_coffee);--cS: var(--cS_coffee);--cL: var(--cL_coffee);--color-theme-hsl: var(--color_coffee-hsl)}.bdsTC_carrot{--cH: var(--cH_carrot);--cS: var(--cS_carrot);--cL: var(--cL_carrot);--color-theme-hsl: var(--color_carrot-hsl)}.bdsTC_cactus{--cH: var(--cH_cactus);--cS: var(--cS_cactus);--cL: var(--cL_cactus);--color-theme-hsl: var(--color_cactus-hsl)}.bdsTC_volcano{--cH: var(--cH_volcano);--cS: var(--cS_volcano);--cL: var(--cL_volcano);--color-theme-hsl: var(--color_volcano-hsl)}.bdsTC_choco{--cH: var(--cH_choco);--cS: var(--cS_choco);--cL: var(--cL_choco);--color-theme-hsl: var(--color_choco-hsl)}.bdsTC_industry{--cH: var(--cH_industry);--cS: var(--cS_industry);--cL: var(--cL_industry);--color-theme-hsl: var(--color_industry-hsl)}.bdsTC_gun{--cH: var(--cH_gun);--cS: var(--cS_gun);--cL: var(--cL_gun);--color-theme-hsl: var(--color_gun-hsl)}.bdsTC_galaxy{--cH: var(--cH_galaxy);--cS: var(--cS_galaxy);--cL: var(--cL_galaxy);--color-theme-hsl: var(--color_galaxy-hsl)}.bdsTC_line{--cH: var(--cH_line);--cS: var(--cS_line);--cL: var(--cL_line);--color-theme-hsl: var(--color_line-hsl)}.bdsTC_twitter{--cH: var(--cH_twitter);--cS: var(--cS_twitter);--cL: var(--cL_twitter);--color-theme-hsl: var(--color_twitter-hsl)}.bdsTC_amazon{--cH: var(--cH_amazon);--cS: var(--cS_amazon);--cL: var(--cL_amazon);--color-theme-hsl: var(--color_amazon-hsl)}.bdsTC_facebook{--cH: var(--cH_facebook);--cS: var(--cS_facebook);--cL: var(--cL_facebook);--color-theme-hsl: var(--color_facebook-hsl)}.bdsTC_android{--cH: var(--cH_android);--cS: var(--cS_android);--cL: var(--cL_android);--color-theme-hsl: var(--color_android-hsl)}.bdsTC_slackBlue{--cH: var(--cH_slackBlue);--cS: var(--cS_slackBlue);--cL: var(--cL_slackBlue);--color-theme-hsl: var(--color_slackBlue-hsl)}.bdsTC_slackGreen{--cH: var(--cH_slackGreen);--cS: var(--cS_slackGreen);--cL: var(--cL_slackGreen);--color-theme-hsl: var(--color_slackGreen-hsl)}.bdsTC_slackRed{--cH: var(--cH_slackRed);--cS: var(--cS_slackRed);--cL: var(--cL_slackRed);--color-theme-hsl: var(--color_slackRed-hsl)}.bdsTC_slackYellow{--cH: var(--cH_slackYellow);--cS: var(--cS_slackYellow);--cL: var(--cL_slackYellow);--color-theme-hsl: var(--color_slackYellow-hsl)}.bdsTC_slackBase{--cH: var(--cH_slackBase);--cS: var(--cS_slackBase);--cL: var(--cL_slackBase);--color-theme-hsl: var(--color_slackBase-hsl)}.bdsTC_googleBlue{--cH: var(--cH_googleBlue);--cS: var(--cS_googleBlue);--cL: var(--cL_googleBlue);--color-theme-hsl: var(--color_googleBlue-hsl)}.bdsTC_googleGreen{--cH: var(--cH_googleGreen);--cS: var(--cS_googleGreen);--cL: var(--cL_googleGreen);--color-theme-hsl: var(--color_googleGreen-hsl)}.bdsTC_googleYellow{--cH: var(--cH_googleYellow);--cS: var(--cS_googleYellow);--cL: var(--cL_googleYellow);--color-theme-hsl: var(--color_googleYellow-hsl)}.bdsTC_googleRed{--cH: var(--cH_googleRed);--cS: var(--cS_googleRed);--cL: var(--cL_googleRed);--color-theme-hsl: var(--color_googleRed-hsl)}.bdsTNflat{--border-color-thin: hsl(220, 9%, 94%);--border-color-normal: hsl(220, 9%, 90%)}.bdsDM_dark{--color-theme-opacity-high: .45;--color-theme-opacity-middle: .3;--color-theme-opacity-low: .2;--color-theme-opacity-few: .1;--color-dark-rgb: 46, 51, 54;--color-cloud-rgb: 43, 44, 45;--color-base-rgb: 27, 28, 28;--color-gray-rgb: 34, 39, 45;--color-mono-positive-rgb: 255, 255, 255;--color-mono-negative-rgb: 0, 0, 0;--font-color1-rgb: 250, 251, 252;--font-color2-rgb: 205, 210, 220;--font-color3-rgb: 165, 170, 180;--font-color4-rgb: 135, 140, 150;--font-color5-rgb: 95, 100, 110;--font-color6-rgb: 65, 70, 80;--font-color-logoTitle: rgb(210, 220, 240);--sc: 0, 0, 0;--shadow_color_min: rgba(var(--sc), .2);--shadow_color_normal: rgba(var(--sc), .3);--shadow_color_remark: rgba(var(--sc), .4);--shadow_color_max: rgba(var(--sc), .5);--border-color-thin: hsl(180, 5%, 25%);--border-color-normal: hsl(180, 5%, 38%);--color-layer0-hsl: var(--cH), 5%, 8%;--color-layer1-hsl: var(--cH), 5%, 13%;--color-layer2-hsl: var(--cH), 5%, 16.3%;--color-layer3-hsl: var(--cH), 5%, 19.6%;--color-layer4-hsl: var(--cH), 5%, 23%;--color-layer5-hsl: var(--cH), 5%, 28%;--color-layer6-hsl: var(--cH), 5%, 33%}.bdsDM_dim{--color-theme-opacity-high: .45;--color-theme-opacity-middle: .3;--color-theme-opacity-low: .2;--color-theme-opacity-few: .1;--color-dark-rgb: 46, 51, 54;--color-cloud-rgb: 43, 44, 45;--color-base-rgb: 27, 28, 28;--color-gray-rgb: 34, 39, 45;--color-mono-positive-rgb: 255, 255, 255;--color-mono-negative-rgb: 0, 0, 0;--font-color1-rgb: 250, 251, 252;--font-color2-rgb: 205, 210, 220;--font-color3-rgb: 165, 170, 180;--font-color4-rgb: 135, 140, 150;--font-color5-rgb: 95, 100, 110;--font-color6-rgb: 65, 70, 80;--font-color-logoTitle: rgb(210, 220, 240);--sc: 0, 0, 0;--shadow_color_min: rgba(var(--sc), .2);--shadow_color_normal: rgba(var(--sc), .3);--shadow_color_remark: rgba(var(--sc), .4);--shadow_color_max: rgba(var(--sc), .5);--border-color-thin: hsl(180, 5%, 25%);--border-color-normal: hsl(180, 5%, 38%);--color-layer0-hsl: var(--cH), 8%, 13%;--color-layer1-hsl: var(--cH), 8%, 20%;--color-layer2-hsl: var(--cH), 8%, 23.3%;--color-layer3-hsl: var(--cH), 8%, 26.6%;--color-layer4-hsl: var(--cH), 8%, 30%;--color-layer5-hsl: var(--cH), 8%, 35%;--color-layer6-hsl: var(--cH), 8%, 40%}@media (prefers-color-scheme: dark){.bdsDM_auto{--color-theme-opacity-high: .45;--color-theme-opacity-middle: .3;--color-theme-opacity-low: .2;--color-theme-opacity-few: .1;--color-dark-rgb: 46, 51, 54;--color-cloud-rgb: 43, 44, 45;--color-base-rgb: 27, 28, 28;--color-gray-rgb: 34, 39, 45;--color-mono-positive-rgb: 255, 255, 255;--color-mono-negative-rgb: 0, 0, 0;--font-color1-rgb: 250, 251, 252;--font-color2-rgb: 205, 210, 220;--font-color3-rgb: 165, 170, 180;--font-color4-rgb: 135, 140, 150;--font-color5-rgb: 95, 100, 110;--font-color6-rgb: 65, 70, 80;--font-color-logoTitle: rgb(210, 220, 240);--sc: 0, 0, 0;--shadow_color_min: rgba(var(--sc), .2);--shadow_color_normal: rgba(var(--sc), .3);--shadow_color_remark: rgba(var(--sc), .4);--shadow_color_max: rgba(var(--sc), .5);--border-color-thin: hsl(180, 5%, 25%);--border-color-normal: hsl(180, 5%, 38%);--color-layer0-hsl: var(--cH), 5%, 8%;--color-layer1-hsl: var(--cH), 5%, 13%;--color-layer2-hsl: var(--cH), 5%, 16.3%;--color-layer3-hsl: var(--cH), 5%, 19.6%;--color-layer4-hsl: var(--cH), 5%, 23%;--color-layer5-hsl: var(--cH), 5%, 28%;--color-layer6-hsl: var(--cH), 5%, 33%}}
1
+ :root{--cH_comun: 237;--cS_comun: 76%;--cL_comun: 58%;--color_comun-hsl: 237, 76%, 58%;--cH_leaf: 159;--cS_leaf: 78%;--cL_leaf: 38%;--color_leaf-hsl: 159, 78%, 38%;--cH_heart: 2;--cS_heart: 81%;--cL_heart: 63%;--color_heart-hsl: 2, 81%, 63%;--cH_droplet: 215;--cS_droplet: 82%;--cL_droplet: 51%;--color_droplet-hsl: 215, 82%, 51%;--cH_brick: 351;--cS_brick: 80%;--cL_brick: 39%;--color_brick-hsl: 351, 80%, 39%;--cH_flower: 350;--cS_flower: 78%;--cL_flower: 75%;--color_flower-hsl: 350, 78%, 75%;--cH_lip: 340;--cS_lip: 69%;--cL_lip: 49%;--color_lip-hsl: 340, 69%, 49%;--cH_wine: 317;--cS_wine: 41%;--cL_wine: 30%;--color_wine-hsl: 317, 41%, 30%;--cH_theater: 301;--cS_theater: 88%;--cL_theater: 49%;--color_theater-hsl: 301, 88%, 49%;--cH_bat: 272;--cS_bat: 81%;--cL_bat: 21%;--color_bat-hsl: 272, 81%, 21%;--cH_poizon: 268;--cS_poizon: 58%;--cL_poizon: 50%;--color_poizon-hsl: 268, 58%, 50%;--cH_eggplant: 264;--cS_eggplant: 100%;--cL_eggplant: 62%;--color_eggplant-hsl: 264, 100%, 62%;--cH_ufo: 253;--cS_ufo: 81%;--cL_ufo: 58%;--color_ufo-hsl: 253, 81%, 58%;--cH_alien: 252;--cS_alien: 92%;--cL_alien: 57%;--color_alien-hsl: 252, 92%, 57%;--cH_tombstone: 251;--cS_tombstone: 14%;--cL_tombstone: 70%;--color_tombstone-hsl: 251, 14%, 70%;--cH_ninja: 242;--cS_ninja: 100%;--cL_ninja: 68%;--color_ninja-hsl: 242, 100%, 68%;--cH_moon: 240;--cS_moon: 16%;--cL_moon: 24%;--color_moon-hsl: 240, 16%, 24%;--cH_rain: 240;--cS_rain: 32%;--cL_rain: 54%;--color_rain-hsl: 240, 32%, 54%;--cH_unicorn: 238;--cS_unicorn: 70%;--cL_unicorn: 74%;--color_unicorn-hsl: 238, 70%, 74%;--cH_axe: 226;--cS_axe: 22%;--cL_axe: 35%;--color_axe-hsl: 226, 22%, 35%;--cH_gem: 221;--cS_gem: 85%;--cL_gem: 43%;--color_gem-hsl: 221, 85%, 43%;--cH_soap: 217;--cS_soap: 85%;--cL_soap: 32%;--color_soap-hsl: 217, 85%, 32%;--cH_drizzle: 213;--cS_drizzle: 33%;--cL_drizzle: 68%;--color_drizzle-hsl: 213, 33%, 68%;--cH_building: 204;--cS_building: 3%;--cL_building: 72%;--color_building-hsl: 204, 3%, 72%;--cH_fish: 194;--cS_fish: 97%;--cL_fish: 34%;--color_fish-hsl: 194, 97%, 34%;--cH_icicles: 191;--cS_icicles: 61%;--cL_icicles: 58%;--color_icicles-hsl: 191, 61%, 58%;--cH_water: 187;--cS_water: 30%;--cL_water: 54%;--color_water-hsl: 187, 30%, 54%;--cH_tree1: 186;--cS_tree1: 85%;--cL_tree1: 23%;--color_tree1-hsl: 186, 85%, 23%;--cH_tree2: 185;--cS_tree2: 97%;--cL_tree2: 34%;--color_tree2-hsl: 185, 97%, 34%;--cH_tree3: 183;--cS_tree3: 86%;--cL_tree3: 19%;--color_tree3-hsl: 183, 86%, 19%;--cH_battery: 170;--cS_battery: 90%;--cL_battery: 39%;--color_battery-hsl: 170, 90%, 39%;--cH_seedle: 145;--cS_seedle: 94%;--cL_seedle: 40%;--color_seedle-hsl: 145, 94%, 40%;--cH_greenTea: 144;--cS_greenTea: 43%;--cL_greenTea: 41%;--color_greenTea-hsl: 144, 43%, 41%;--cH_oak: 101;--cS_oak: 24%;--cL_oak: 66%;--color_oak-hsl: 101, 24%, 66%;--cH_salad: 68;--cS_salad: 90%;--cL_salad: 43%;--color_salad-hsl: 68, 90%, 43%;--cH_cloudy: 60;--cS_cloudy: 5%;--cL_cloudy: 79%;--color_cloudy-hsl: 60, 5%, 79%;--cH_lemon: 53;--cS_lemon: 78%;--cL_lemon: 70%;--color_lemon-hsl: 53, 78%, 70%;--cH_angel: 47;--cS_angel: 100%;--cL_angel: 50%;--color_angel-hsl: 47, 100%, 50%;--cH_parasol: 42;--cS_parasol: 86%;--cL_parasol: 70%;--color_parasol-hsl: 42, 86%, 70%;--cH_pizza: 40;--cS_pizza: 92%;--cL_pizza: 52%;--color_pizza-hsl: 40, 92%, 52%;--cH_thunder: 40;--cS_thunder: 70%;--cL_thunder: 57%;--color_thunder-hsl: 40, 70%, 57%;--cH_latte: 33;--cS_latte: 51%;--cL_latte: 73%;--color_latte-hsl: 33, 51%, 73%;--cH_island: 27;--cS_island: 91%;--cL_island: 55%;--color_island-hsl: 27, 91%, 55%;--cH_shovel: 19;--cS_shovel: 29%;--cL_shovel: 37%;--color_shovel-hsl: 19, 29%, 37%;--cH_coffee: 18;--cS_coffee: 33%;--cL_coffee: 24%;--color_coffee-hsl: 18, 33%, 24%;--cH_carrot: 14;--cS_carrot: 84%;--cL_carrot: 59%;--color_carrot-hsl: 14, 84%, 59%;--cH_cactus: 8;--cS_cactus: 17%;--cL_cactus: 62%;--color_cactus-hsl: 8, 17%, 62%;--cH_volcano: 6;--cS_volcano: 84%;--cL_volcano: 48%;--color_volcano-hsl: 6, 84%, 48%;--cH_choco: 2;--cS_choco: 55%;--cL_choco: 57%;--color_choco-hsl: 2, 55%, 57%;--cH_industry: 0;--cS_industry: 0%;--cL_industry: 50%;--color_industry-hsl: 0, 0%, 50%;--cH_gun: 0;--cS_gun: 0%;--cL_gun: 37%;--color_gun-hsl: 0, 0%, 37%;--cH_galaxy: 0;--cS_galaxy: 0%;--cL_galaxy: 5%;--color_galaxy-hsl: 0, 0%, 5%;--cH_line: 120;--cS_line: 100%;--cL_line: 37%;--color_line-hsl: 120, 100%, 37%;--cH_twitter: 203;--cS_twitter: 89%;--cL_twitter: 52%;--color_twitter-hsl: 203, 89%, 52%;--cH_amazon: 36;--cS_amazon: 100%;--cL_amazon: 50%;--color_amazon-hsl: 36, 100%, 50%;--cH_facebook: 220;--cS_facebook: 46%;--cL_facebook: 48%;--color_facebook-hsl: 220, 46%, 48%;--cH_android: 101;--cS_android: 47%;--cL_android: 55%;--color_android-hsl: 101, 47%, 55%;--cH_slackBlue: 194;--cS_slackBlue: 86%;--cL_slackBlue: 58%;--color_slackBlue-hsl: 194, 86%, 58%;--cH_slackGreen: 155;--cS_slackGreen: 60%;--cL_slackGreen: 45%;--color_slackGreen-hsl: 155, 60%, 45%;--cH_slackRed: 341;--cS_slackRed: 76%;--cL_slackRed: 50%;--color_slackRed-hsl: 341, 76%, 50%;--cH_slackYellow: 42;--cS_slackYellow: 83%;--cL_slackYellow: 55%;--color_slackYellow-hsl: 42, 83%, 55%;--cH_slackBase: 299;--cS_slackBase: 56%;--cL_slackBase: 19%;--color_slackBase-hsl: 299, 56%, 19%;--cH_googleBlue: 217;--cS_googleBlue: 89%;--cL_googleBlue: 61%;--color_googleBlue-hsl: 217, 89%, 61%;--cH_googleGreen: 151;--cS_googleGreen: 83%;--cL_googleGreen: 34%;--color_googleGreen-hsl: 151, 83%, 34%;--cH_googleYellow: 44;--cS_googleYellow: 100%;--cL_googleYellow: 48%;--color_googleYellow-hsl: 44, 100%, 48%;--cH_googleRed: 5;--cS_googleRed: 69%;--cL_googleRed: 54%;--color_googleRed-hsl: 5, 69%, 54%;--cH: 0;--cS: 0%;--cL: 0%;--color-theme-hsl: 0, 0%, 0%;--color-theme-opacity-high: .5;--color-theme-opacity-middle: .25;--color-theme-opacity-low: .15;--color-theme-opacity-few: .085;--color-positive-rgb: 68, 204, 170;--color-negative-rgb: 255, 68, 119;--color-warning-rgb: 248, 150, 0;--color-dark-rgb: 69, 81, 92;--color-positive: rgba(var(--color-positive-rgb), 1);--color-negative: rgba(var(--color-negative-rgb), 1);--color-warning: rgba(var(--color-warning-rgb), 1);--color-dark: rgba(var(--color-dark-rgb), 1);--color-layer0-hsl: var(--cH), 10%, 99%;--color-layer1-hsl: var(--cH), 6%, 99%;--color-layer2-hsl: var(--cH), 6%, 96%;--color-layer3-hsl: var(--cH), 6%, 92%;--color-layer4-hsl: var(--cH), 5%, 89%;--color-layer5-hsl: var(--cH), 4%, 85%;--color-layer6-hsl: var(--cH), 3%, 75%;--color-base-rgb: 252, 252, 252;--color-gray-rgb: 211, 216, 222;--color-cloud-rgb: 241, 243, 248;--color-mono-positive-rgb: 0, 0, 0;--color-mono-negative-rgb: 255, 255, 255;--font-color-logoTitle: hsl(218, 45%, 22%);--sc: 60, 64, 67;--shadow_style_0: 0px 1px 2px 0px;--shadow_style_1: 0px 2px 4px 0px;--shadow_style_2: 1px 3px 8px 0px;--shadow_style_3: 2px 6px 12px;--shadow_style_4: .4rem 1rem 2rem;--shadow_style_5: 1rem 1.5rem 3rem;--shadow_color_min: rgba(var(--sc), .05);--shadow_color_normal: rgba(var(--sc), .15);--shadow_color_remark: rgba(var(--sc), .28);--shadow_color_max: rgba(var(--sc), .41);--font-color1-rgb: 0, 0, 0;--font-color2-rgb: 51, 51, 51;--font-color3-rgb: 118, 125, 137;--font-color4-rgb: 152, 158, 167;--font-color5-rgb: 189, 194, 200;--font-color6-rgb: 210, 210, 220;--font-size0: 10px;--font-size1: 12px;--font-size2: 14px;--font-size3: 16px;--font-size4: 20px;--font-size5: 24px;--font-size6: 32px;--font-size7: 44px;--font-size8: 60px;--border-color-thin: hsl(220, 9%, 92%);--border-color-normal: hsl(220, 9%, 87%);--border-color-thick: hsl(0, 0%, 40%);--border-radius1: 4px;--border-radius2: 6px;--border-radius3: 8px;--border-radius4: 12px;--border-radius5: 18px;--border-radius6: 24px;--border-radius7: 30px;--animation-time1: .1s;--animation-time2: .15s;--animation-time3: .25s;--animation-time4: .4s;--animation-style1: cubic-bezier(.35, .46, 0, .99);--animation-style2: cubic-bezier(.1, .85, .1, .85);--safe-area-top: env(safe-area-inset-top);--safe-area-bottom: env(safe-area-inset-bottom);--safe-area-left: env(safe-area-inset-left);--safe-area-right: env(safe-area-inset-right);--grid-unit: 12px;--viewHeight: 100vh;--viewWidth: 100vw;--sideNavHeight: 0px;--topNavHeight: 0px;--sideNavWidth: 0px;--contentHeight: 0px;--contnetWidth: 0px;--topBase: 0px}@supports (-webkit-touch-callout: none){:root{--viewHeight: -webkit-fill-available}}.bdsTC_comun{--cH: var(--cH_comun);--cS: var(--cS_comun);--cL: var(--cL_comun);--color-theme-hsl: var(--color_comun-hsl)}.bdsTC_leaf{--cH: var(--cH_leaf);--cS: var(--cS_leaf);--cL: var(--cL_leaf);--color-theme-hsl: var(--color_leaf-hsl)}.bdsTC_heart{--cH: var(--cH_heart);--cS: var(--cS_heart);--cL: var(--cL_heart);--color-theme-hsl: var(--color_heart-hsl)}.bdsTC_droplet{--cH: var(--cH_droplet);--cS: var(--cS_droplet);--cL: var(--cL_droplet);--color-theme-hsl: var(--color_droplet-hsl)}.bdsTC_brick{--cH: var(--cH_brick);--cS: var(--cS_brick);--cL: var(--cL_brick);--color-theme-hsl: var(--color_brick-hsl)}.bdsTC_flower{--cH: var(--cH_flower);--cS: var(--cS_flower);--cL: var(--cL_flower);--color-theme-hsl: var(--color_flower-hsl)}.bdsTC_lip{--cH: var(--cH_lip);--cS: var(--cS_lip);--cL: var(--cL_lip);--color-theme-hsl: var(--color_lip-hsl)}.bdsTC_wine{--cH: var(--cH_wine);--cS: var(--cS_wine);--cL: var(--cL_wine);--color-theme-hsl: var(--color_wine-hsl)}.bdsTC_theater{--cH: var(--cH_theater);--cS: var(--cS_theater);--cL: var(--cL_theater);--color-theme-hsl: var(--color_theater-hsl)}.bdsTC_bat{--cH: var(--cH_bat);--cS: var(--cS_bat);--cL: var(--cL_bat);--color-theme-hsl: var(--color_bat-hsl)}.bdsTC_poizon{--cH: var(--cH_poizon);--cS: var(--cS_poizon);--cL: var(--cL_poizon);--color-theme-hsl: var(--color_poizon-hsl)}.bdsTC_eggplant{--cH: var(--cH_eggplant);--cS: var(--cS_eggplant);--cL: var(--cL_eggplant);--color-theme-hsl: var(--color_eggplant-hsl)}.bdsTC_ufo{--cH: var(--cH_ufo);--cS: var(--cS_ufo);--cL: var(--cL_ufo);--color-theme-hsl: var(--color_ufo-hsl)}.bdsTC_alien{--cH: var(--cH_alien);--cS: var(--cS_alien);--cL: var(--cL_alien);--color-theme-hsl: var(--color_alien-hsl)}.bdsTC_tombstone{--cH: var(--cH_tombstone);--cS: var(--cS_tombstone);--cL: var(--cL_tombstone);--color-theme-hsl: var(--color_tombstone-hsl)}.bdsTC_ninja{--cH: var(--cH_ninja);--cS: var(--cS_ninja);--cL: var(--cL_ninja);--color-theme-hsl: var(--color_ninja-hsl)}.bdsTC_moon{--cH: var(--cH_moon);--cS: var(--cS_moon);--cL: var(--cL_moon);--color-theme-hsl: var(--color_moon-hsl)}.bdsTC_rain{--cH: var(--cH_rain);--cS: var(--cS_rain);--cL: var(--cL_rain);--color-theme-hsl: var(--color_rain-hsl)}.bdsTC_unicorn{--cH: var(--cH_unicorn);--cS: var(--cS_unicorn);--cL: var(--cL_unicorn);--color-theme-hsl: var(--color_unicorn-hsl)}.bdsTC_axe{--cH: var(--cH_axe);--cS: var(--cS_axe);--cL: var(--cL_axe);--color-theme-hsl: var(--color_axe-hsl)}.bdsTC_gem{--cH: var(--cH_gem);--cS: var(--cS_gem);--cL: var(--cL_gem);--color-theme-hsl: var(--color_gem-hsl)}.bdsTC_soap{--cH: var(--cH_soap);--cS: var(--cS_soap);--cL: var(--cL_soap);--color-theme-hsl: var(--color_soap-hsl)}.bdsTC_drizzle{--cH: var(--cH_drizzle);--cS: var(--cS_drizzle);--cL: var(--cL_drizzle);--color-theme-hsl: var(--color_drizzle-hsl)}.bdsTC_building{--cH: var(--cH_building);--cS: var(--cS_building);--cL: var(--cL_building);--color-theme-hsl: var(--color_building-hsl)}.bdsTC_fish{--cH: var(--cH_fish);--cS: var(--cS_fish);--cL: var(--cL_fish);--color-theme-hsl: var(--color_fish-hsl)}.bdsTC_icicles{--cH: var(--cH_icicles);--cS: var(--cS_icicles);--cL: var(--cL_icicles);--color-theme-hsl: var(--color_icicles-hsl)}.bdsTC_water{--cH: var(--cH_water);--cS: var(--cS_water);--cL: var(--cL_water);--color-theme-hsl: var(--color_water-hsl)}.bdsTC_tree1{--cH: var(--cH_tree1);--cS: var(--cS_tree1);--cL: var(--cL_tree1);--color-theme-hsl: var(--color_tree1-hsl)}.bdsTC_tree2{--cH: var(--cH_tree2);--cS: var(--cS_tree2);--cL: var(--cL_tree2);--color-theme-hsl: var(--color_tree2-hsl)}.bdsTC_tree3{--cH: var(--cH_tree3);--cS: var(--cS_tree3);--cL: var(--cL_tree3);--color-theme-hsl: var(--color_tree3-hsl)}.bdsTC_battery{--cH: var(--cH_battery);--cS: var(--cS_battery);--cL: var(--cL_battery);--color-theme-hsl: var(--color_battery-hsl)}.bdsTC_seedle{--cH: var(--cH_seedle);--cS: var(--cS_seedle);--cL: var(--cL_seedle);--color-theme-hsl: var(--color_seedle-hsl)}.bdsTC_greenTea{--cH: var(--cH_greenTea);--cS: var(--cS_greenTea);--cL: var(--cL_greenTea);--color-theme-hsl: var(--color_greenTea-hsl)}.bdsTC_oak{--cH: var(--cH_oak);--cS: var(--cS_oak);--cL: var(--cL_oak);--color-theme-hsl: var(--color_oak-hsl)}.bdsTC_salad{--cH: var(--cH_salad);--cS: var(--cS_salad);--cL: var(--cL_salad);--color-theme-hsl: var(--color_salad-hsl)}.bdsTC_cloudy{--cH: var(--cH_cloudy);--cS: var(--cS_cloudy);--cL: var(--cL_cloudy);--color-theme-hsl: var(--color_cloudy-hsl)}.bdsTC_lemon{--cH: var(--cH_lemon);--cS: var(--cS_lemon);--cL: var(--cL_lemon);--color-theme-hsl: var(--color_lemon-hsl)}.bdsTC_angel{--cH: var(--cH_angel);--cS: var(--cS_angel);--cL: var(--cL_angel);--color-theme-hsl: var(--color_angel-hsl)}.bdsTC_parasol{--cH: var(--cH_parasol);--cS: var(--cS_parasol);--cL: var(--cL_parasol);--color-theme-hsl: var(--color_parasol-hsl)}.bdsTC_pizza{--cH: var(--cH_pizza);--cS: var(--cS_pizza);--cL: var(--cL_pizza);--color-theme-hsl: var(--color_pizza-hsl)}.bdsTC_thunder{--cH: var(--cH_thunder);--cS: var(--cS_thunder);--cL: var(--cL_thunder);--color-theme-hsl: var(--color_thunder-hsl)}.bdsTC_latte{--cH: var(--cH_latte);--cS: var(--cS_latte);--cL: var(--cL_latte);--color-theme-hsl: var(--color_latte-hsl)}.bdsTC_island{--cH: var(--cH_island);--cS: var(--cS_island);--cL: var(--cL_island);--color-theme-hsl: var(--color_island-hsl)}.bdsTC_shovel{--cH: var(--cH_shovel);--cS: var(--cS_shovel);--cL: var(--cL_shovel);--color-theme-hsl: var(--color_shovel-hsl)}.bdsTC_coffee{--cH: var(--cH_coffee);--cS: var(--cS_coffee);--cL: var(--cL_coffee);--color-theme-hsl: var(--color_coffee-hsl)}.bdsTC_carrot{--cH: var(--cH_carrot);--cS: var(--cS_carrot);--cL: var(--cL_carrot);--color-theme-hsl: var(--color_carrot-hsl)}.bdsTC_cactus{--cH: var(--cH_cactus);--cS: var(--cS_cactus);--cL: var(--cL_cactus);--color-theme-hsl: var(--color_cactus-hsl)}.bdsTC_volcano{--cH: var(--cH_volcano);--cS: var(--cS_volcano);--cL: var(--cL_volcano);--color-theme-hsl: var(--color_volcano-hsl)}.bdsTC_choco{--cH: var(--cH_choco);--cS: var(--cS_choco);--cL: var(--cL_choco);--color-theme-hsl: var(--color_choco-hsl)}.bdsTC_industry{--cH: var(--cH_industry);--cS: var(--cS_industry);--cL: var(--cL_industry);--color-theme-hsl: var(--color_industry-hsl)}.bdsTC_gun{--cH: var(--cH_gun);--cS: var(--cS_gun);--cL: var(--cL_gun);--color-theme-hsl: var(--color_gun-hsl)}.bdsTC_galaxy{--cH: var(--cH_galaxy);--cS: var(--cS_galaxy);--cL: var(--cL_galaxy);--color-theme-hsl: var(--color_galaxy-hsl)}.bdsTC_line{--cH: var(--cH_line);--cS: var(--cS_line);--cL: var(--cL_line);--color-theme-hsl: var(--color_line-hsl)}.bdsTC_twitter{--cH: var(--cH_twitter);--cS: var(--cS_twitter);--cL: var(--cL_twitter);--color-theme-hsl: var(--color_twitter-hsl)}.bdsTC_amazon{--cH: var(--cH_amazon);--cS: var(--cS_amazon);--cL: var(--cL_amazon);--color-theme-hsl: var(--color_amazon-hsl)}.bdsTC_facebook{--cH: var(--cH_facebook);--cS: var(--cS_facebook);--cL: var(--cL_facebook);--color-theme-hsl: var(--color_facebook-hsl)}.bdsTC_android{--cH: var(--cH_android);--cS: var(--cS_android);--cL: var(--cL_android);--color-theme-hsl: var(--color_android-hsl)}.bdsTC_slackBlue{--cH: var(--cH_slackBlue);--cS: var(--cS_slackBlue);--cL: var(--cL_slackBlue);--color-theme-hsl: var(--color_slackBlue-hsl)}.bdsTC_slackGreen{--cH: var(--cH_slackGreen);--cS: var(--cS_slackGreen);--cL: var(--cL_slackGreen);--color-theme-hsl: var(--color_slackGreen-hsl)}.bdsTC_slackRed{--cH: var(--cH_slackRed);--cS: var(--cS_slackRed);--cL: var(--cL_slackRed);--color-theme-hsl: var(--color_slackRed-hsl)}.bdsTC_slackYellow{--cH: var(--cH_slackYellow);--cS: var(--cS_slackYellow);--cL: var(--cL_slackYellow);--color-theme-hsl: var(--color_slackYellow-hsl)}.bdsTC_slackBase{--cH: var(--cH_slackBase);--cS: var(--cS_slackBase);--cL: var(--cL_slackBase);--color-theme-hsl: var(--color_slackBase-hsl)}.bdsTC_googleBlue{--cH: var(--cH_googleBlue);--cS: var(--cS_googleBlue);--cL: var(--cL_googleBlue);--color-theme-hsl: var(--color_googleBlue-hsl)}.bdsTC_googleGreen{--cH: var(--cH_googleGreen);--cS: var(--cS_googleGreen);--cL: var(--cL_googleGreen);--color-theme-hsl: var(--color_googleGreen-hsl)}.bdsTC_googleYellow{--cH: var(--cH_googleYellow);--cS: var(--cS_googleYellow);--cL: var(--cL_googleYellow);--color-theme-hsl: var(--color_googleYellow-hsl)}.bdsTC_googleRed{--cH: var(--cH_googleRed);--cS: var(--cS_googleRed);--cL: var(--cL_googleRed);--color-theme-hsl: var(--color_googleRed-hsl)}.bdsTNflat{--border-color-thin: hsl(220, 9%, 94%);--border-color-normal: hsl(220, 9%, 90%)}.bdsDM_dark{--color-theme-opacity-high: .45;--color-theme-opacity-middle: .3;--color-theme-opacity-low: .2;--color-theme-opacity-few: .1;--color-dark-rgb: 46, 51, 54;--color-cloud-rgb: 43, 44, 45;--color-base-rgb: 27, 28, 28;--color-gray-rgb: 34, 39, 45;--color-mono-positive-rgb: 255, 255, 255;--color-mono-negative-rgb: 0, 0, 0;--font-color1-rgb: 250, 251, 252;--font-color2-rgb: 205, 210, 220;--font-color3-rgb: 165, 170, 180;--font-color4-rgb: 135, 140, 150;--font-color5-rgb: 95, 100, 110;--font-color6-rgb: 65, 70, 80;--font-color-logoTitle: rgb(210, 220, 240);--sc: 0, 0, 0;--shadow_color_min: rgba(var(--sc), .2);--shadow_color_normal: rgba(var(--sc), .3);--shadow_color_remark: rgba(var(--sc), .4);--shadow_color_max: rgba(var(--sc), .5);--border-color-thin: hsl(180, 5%, 25%);--border-color-normal: hsl(180, 5%, 38%);--color-layer0-hsl: var(--cH), 5%, 8%;--color-layer1-hsl: var(--cH), 5%, 13%;--color-layer2-hsl: var(--cH), 5%, 16.3%;--color-layer3-hsl: var(--cH), 5%, 19.6%;--color-layer4-hsl: var(--cH), 5%, 23%;--color-layer5-hsl: var(--cH), 5%, 28%;--color-layer6-hsl: var(--cH), 5%, 33%}.bdsDM_dim{--color-theme-opacity-high: .45;--color-theme-opacity-middle: .3;--color-theme-opacity-low: .2;--color-theme-opacity-few: .1;--color-dark-rgb: 46, 51, 54;--color-cloud-rgb: 43, 44, 45;--color-base-rgb: 27, 28, 28;--color-gray-rgb: 34, 39, 45;--color-mono-positive-rgb: 255, 255, 255;--color-mono-negative-rgb: 0, 0, 0;--font-color1-rgb: 250, 251, 252;--font-color2-rgb: 205, 210, 220;--font-color3-rgb: 165, 170, 180;--font-color4-rgb: 135, 140, 150;--font-color5-rgb: 95, 100, 110;--font-color6-rgb: 65, 70, 80;--font-color-logoTitle: rgb(210, 220, 240);--sc: 0, 0, 0;--shadow_color_min: rgba(var(--sc), .2);--shadow_color_normal: rgba(var(--sc), .3);--shadow_color_remark: rgba(var(--sc), .4);--shadow_color_max: rgba(var(--sc), .5);--border-color-thin: hsl(180, 5%, 25%);--border-color-normal: hsl(180, 5%, 38%);--color-layer0-hsl: var(--cH), 8%, 13%;--color-layer1-hsl: var(--cH), 8%, 20%;--color-layer2-hsl: var(--cH), 8%, 23.3%;--color-layer3-hsl: var(--cH), 8%, 26.6%;--color-layer4-hsl: var(--cH), 8%, 30%;--color-layer5-hsl: var(--cH), 8%, 35%;--color-layer6-hsl: var(--cH), 8%, 40%}@media (prefers-color-scheme: dark){.bdsDM_auto{--color-theme-opacity-high: .45;--color-theme-opacity-middle: .3;--color-theme-opacity-low: .2;--color-theme-opacity-few: .1;--color-dark-rgb: 46, 51, 54;--color-cloud-rgb: 43, 44, 45;--color-base-rgb: 27, 28, 28;--color-gray-rgb: 34, 39, 45;--color-mono-positive-rgb: 255, 255, 255;--color-mono-negative-rgb: 0, 0, 0;--font-color1-rgb: 250, 251, 252;--font-color2-rgb: 205, 210, 220;--font-color3-rgb: 165, 170, 180;--font-color4-rgb: 135, 140, 150;--font-color5-rgb: 95, 100, 110;--font-color6-rgb: 65, 70, 80;--font-color-logoTitle: rgb(210, 220, 240);--sc: 0, 0, 0;--shadow_color_min: rgba(var(--sc), .2);--shadow_color_normal: rgba(var(--sc), .3);--shadow_color_remark: rgba(var(--sc), .4);--shadow_color_max: rgba(var(--sc), .5);--border-color-thin: hsl(180, 5%, 25%);--border-color-normal: hsl(180, 5%, 38%);--color-layer0-hsl: var(--cH), 5%, 8%;--color-layer1-hsl: var(--cH), 5%, 13%;--color-layer2-hsl: var(--cH), 5%, 16.3%;--color-layer3-hsl: var(--cH), 5%, 19.6%;--color-layer4-hsl: var(--cH), 5%, 23%;--color-layer5-hsl: var(--cH), 5%, 28%;--color-layer6-hsl: var(--cH), 5%, 33%}}
@@ -1 +1 @@
1
- import{b as S,c as O,d as Y,e as Z}from"../../chunk-C5N2D3ZX.js";import{Fragment as J,jsx as l,jsxs as A}from"react/jsx-runtime";import{useState as I,useEffect as R,useRef as re}from"react";import u,{UUID as L}from"jmini";import{ExtractStyles as ie}from"../../@utils";import{Box as x,Span as se,FAI as q,Column as ee}from"../../atoms";import{Literal as K,Row as W}from"../../mols";import{Button as te}from"../Button";import{Loader as ce}from"../Loader";import{Sheet as ue}from"../Sheet";import{OptionalInputWrapper as pe,BoxWrapper as de,CoreEffects as z,DefaultBoxishStyles as Se}from"./core";import{InputAutocompleteClasses as N}from"../../@styles/componentClasses";import{InputLabel as me}from"./Label";import{RightIcon as oe}from".";function fe(e){let{value:t,states:c}=e,{required:p,options:n,min:r,max:m}=c;r=r||0,m=m||65535;let o=[],h=t.filter(i=>i!==null).length;return p&&(h||o.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),h<r&&o.push({type:"invalid",label:r+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),h>m&&o.push({type:"invalid",label:m+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!o.filter(({type:i})=>i=="invalid").length,notice:o}}const U={InitOptions:e=>{let t=[];return e.forEach(c=>{if(!c)return;let{type:p,label:n,value:r,searchValue:m}=c,o=m||u.is.string(n)&&n||""||u.is.string(r)&&r||u.Stringify(r||"")||"";u.is.nullish(n)&&(n=String(r)),t.push(O(S({id:L()},c),{searchValue:o,type:p||"selector",label:n,value:r}))}),t},FilterSelectableOptions:(e,t,c)=>{let p=e;return c||(p=e.filter(n=>(n==null?void 0:n.type)!="label")),u.scope(()=>{if(!t)return;let n=t.toLower().replace(/ /g,"");p=p.filter(r=>(r.searchValue||"").toLower().replace(/ /g,"").includes(n))}),p}},B={Shallow:e=>{let{rootStates:t,val_status:c}=e,p=ie(t);return l(x,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:l(K.Description,O(S({className:t.className},p),{position:"absolute",width:1,freeCSS:O(S({},p.freeCSS),{color:"orange"}),"data-id":"shallow_"+c.componentId,children:l(x,{"data-input-value-shallow":c.componentId,children:"A"})}))})},Button:e=>{let{rootStates:t,val_keyword:c,set_keyword:p,val_optionFocused:n,set_optionFocused:r,val_options:m,set_options:o,val_optionsDict:h,set_optionsDict:i,val_preventOpenSelectorOnFocus:s,set_preventOpenSelectorOnFocus:d,val_selectorOpen:a,set_selectorOpen:f,val_status:v,set_status:C,val_validate:g,set_validate:_}=e,G=t,{tone:D,required:w,form:V,className:H,multiSelect:j,enableFormSubmit:P,checkValidationAtFirst:M,onValidate:X,onValidateDelay:F,onUpdateValue:E,onUpdateValidValue:k,value:ve="",options:ye,leftIndicator:he,rightIndicator:ge,leftIcon:_e,rightIcon:be,componentId:Oe,status_id:Ie,wrapStyles:Ce,emptySelect:De,SearchInput:we,SearchInputPlaceholder:Ve,SelectedComponent:ke,SelectorComponent:Te,SelectorStyles:Re,SelectorPosition:xe,DynamicOptionsOnSearch:Ae,DynamicOptionsOnSearchDelay:Fe}=G,b=Y(G,["tone","required","form","className","multiSelect","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","emptySelect","SearchInput","SearchInputPlaceholder","SelectedComponent","SelectorComponent","SelectorStyles","SelectorPosition","DynamicOptionsOnSearch","DynamicOptionsOnSearchDelay"]);return R(()=>{var T;if(t.disabled||!a)return;let y=U.FilterSelectableOptions(e.val_options,c,!1);r(((T=y[0])==null?void 0:T.id)||"")},[c]),R(()=>{v.eventType!="init"&&(t.max==v.dataValue.length?(f(!1),d(!0),setTimeout(()=>{let y=u('[data-input-origin="'+t.componentId+'"]');y&&y.focus()},10)):u("#SearchInput_"+t.componentId).focus())},[v.dataValue]),R(()=>{let y="autocomplete-click-"+t.componentId;if(a){if(!u('[data-input-origin="'+t.componentId+'"]'))return;u("#SearchInput_"+t.componentId).focus(),u(document).addEvent({eventID:y,eventType:"mousedown",callback:$=>{let Q=u($.target),le=!!u(Q).parent("."+N("Core")).length,ne=!!u(Q).parent("."+N("Selector")).length;le||ne||(f(!1),$.preventDefault(),$.stopPropagation())},options:{passive:!1}})}else u(document).removeEvent([y]),p("")},[a]),A(J,{children:[l(x,O(S({tabIndex:0},b),{"data-disabled":t.disabled,"data-show-validation":z.isShowValidation(g,v,!!M),"data-component-id":v.componentId,"data-input-origin":v.componentId,"data-focus":!!a,className:[H,N("Core")].join(" "),onFocus:y=>{if(b!=null&&b.onFocus&&(b==null||b.onFocus(y)),!t.disabled){if(s)return d(!1);f(!0),y.preventDefault()}},onClick:y=>{b!=null&&b.onClick&&(b==null||b.onClick(y)),!t.disabled&&f(!0)},onKeyDown:y=>{let{key:T}=y;P&&z.SubmitForm(y,V),!a&&(T==" "||T=="ArrowDown"||T=="ArrowUp"||T=="Enter")&&f(!0)},children:A(W.Left,{gap:0,children:[l(se,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),A(W.Left,{flexWrap:!0,flexSizing:0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[l(B.Selected,S({},e)),l(B.SearchInput,S({},e))]})]})})),a&&l(B.Selector,S({},e))]})},SearchInput:e=>{let{rootStates:t}=e,[c,p]=I(!1);return t.disabled||!e.val_selectorOpen?null:l(x,{id:"SearchInput_"+t.componentId,placeholder:t.SearchInputPlaceholder||"\u691C\u7D22...",opacity:e.val_selectorOpen?"max":"trans",transition:"middle",flexSizing:0,htmlTag:"input",border:"unset",backgroundColor:"trans",value:e.val_keyword,freeCSS:{outline:"none"},onCompositionStart:n=>{t.onCompositionStart&&t.onCompositionStart(n),p(!0)},onCompositionEnd:n=>{t.onCompositionEnd&&t.onCompositionEnd(n),p(!1)},onKeyDown:n=>{let{key:r,metaKey:m,ctrlKey:o}=n,h=m||o;r=="Escape"?(e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0),setTimeout(()=>{let i=u('[data-input-origin="'+t.componentId+'"]');i&&i.focus()},10)):r=="Tab"?e.set_selectorOpen(!1):r==" "?u.scope(()=>{e.val_selectorOpen||e.val_keyword||(n.preventDefault(),e.set_selectorOpen(!0))}):r=="Backspace"?u.scope(()=>{if(e.val_keyword)return;let i=[...e.val_status.dataValue];i.pop(),e.set_status(s=>O(S({},s),{dataValue:i,eventType:"update",eventID:L()}))}):r=="Enter"&&u.scope(()=>{if(c)return;if(!e.val_selectorOpen)return e.set_selectorOpen(!0);let i=e.val_options.find(d=>(d==null?void 0:d.id)==e.val_optionFocused);if(!i)return;let{value:s}=i;e.set_status(d=>{let a=[...d.dataValue];return u.scope(()=>{if(s===null)return a=[];d.dataValue.includes(s)?a=a.filter(v=>v!==s):t.multiSelect?a.push(s):a=[s]}),O(S({},d),{dataValue:a,eventType:"update",eventID:L()})}),e.set_keyword(""),e.set_preventDynamicSearchOnKeywordChange(!0)}),u.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(r))return;if(n.preventDefault(),!e.val_selectorOpen)return e.set_selectorOpen(!0);let i=r=="ArrowDown"?1:-1,s=U.FilterSelectableOptions(e.val_options),d=s.length-1,a=null;u.scope(()=>{var v,C,g,_,D,w;let f=s.findIndex(V=>(V==null?void 0:V.id)==e.val_optionFocused);if(f==-1&&(f=0),i==1){if(a=(v=s[0])==null?void 0:v.id,h){a=(C=s[d])==null?void 0:C.id;return}if(f==-1||f==d)return;a=(g=s[f+1])==null?void 0:g.id}else{if(a=(_=s[d])==null?void 0:_.id,h){a=(D=s[0])==null?void 0:D.id;return}if(f==-1||f==0)return;a=(w=s[f-1])==null?void 0:w.id}}),e.set_optionFocused(a)}),t.enableFormSubmit&&z.SubmitForm(n,e.rootStates.form)},onChange:n=>{let m=n.target.value;e.set_keyword(m)}},"searchInput")},Selector:e=>{var h;let[t,c]=I("idle"),[p,n]=I("idle");R(()=>{if(!e.val_selectorOpen||!e.rootStates.DynamicOptionsOnSearch)return;if(e.val_preventDynamicSearchOnKeywordChange)return e.set_preventDynamicSearchOnKeywordChange(!1);if(t=="idle")return c("ok");n("fetch");let i="autocomplete-search-"+e.rootStates.componentId;u.interval.once(()=>Z(void 0,null,function*(){var a;let s=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);n("idle");let d=U.InitOptions(s||[]);e.set_options(d),e.set_optionFocused(((a=d[0])==null?void 0:a.id)||"")}),e.rootStates.DynamicOptionsOnSearchDelay||300,i)},[e.val_keyword]),R(()=>{let i=u(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!i)return;let s=u(`[data-autocomplete-input-value="${e.val_optionFocused}"]`)[0];s&&(i.scrollTop=s.offsetTop-24)},[e.val_optionFocused]);let r=[],m=U.FilterSelectableOptions(e.val_options,e.rootStates.DynamicOptionsOnSearch?"":e.val_keyword,!0);m.forEach((i,s)=>{if(!i)return;let{type:d,value:a}=i,f=e.val_optionFocused==i.id,v=e.val_status.dataValue.includes(a),C=e.rootStates.SelectorComponent;r.push(l(ee,{"data-autocomplete-input-value":i.id,children:l(C,{option:i,isFocused:f,isSelected:v,addCallback:()=>{e.set_status(g=>{let _=[...g.dataValue];return u.scope(()=>{if(a===null)return _=[];g.dataValue.includes(a)?_=_.filter(w=>w!==a):e.rootStates.multiSelect?_.push(a):_=[a]}),O(S({},g),{dataValue:_,eventType:"update",eventID:L()})})}})},i.id))}),m.length||(r=[l(K.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]),p=="fetch"&&(r=[A(W.Left,{padding:1,fontColor:"3.blur",children:[l(ce.Theme.R,{showInitial:!0}),l(K.Supplement,{children:"Loading..."})]},"loader")]);let o={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:o.bottom="100%",o.left=0,o.paddingBottom="1/3";break;case 2:o.bottom="100%",o.right=0,o.paddingBottom="1/3";break;case 3:o.top="100%",o.left=0,o.paddingTop="1/3";break;case 4:o.top="100%",o.right=0,o.paddingTop="1/3";break;default:break}return l(x,O(S({},o),{children:l(ue.Body,O(S({className:N("Selector"),borderRadius:"2.tone.secondary",ssCardBox:!0,boxShadow:"1.normal",overflow:"auto","data-selector-id":e.val_status.componentId},e.rootStates.SelectorStyles),{freeCSS:S({maxHeight:12*24},(h=e.rootStates.SelectorStyles)==null?void 0:h.freeCSS),children:l(ee,{gap:"1/12",padding:[1,0],children:r})}))}))},Selected:e=>{let{rootStates:t,val_status:c,set_status:p,val_optionsDict:n}=e,r=[];return c.dataValue.forEach(m=>{let o=n[u.Stringify(m)];if(!o)return;let h=t.SelectedComponent,i=o.label;(o==null?void 0:o.value)===null&&(i=""),r.push(l(x,{className:N("SelectedCell"),children:l(h,{value:o==null?void 0:o.value,label:i,removeCallback:s=>{if(s.stopPropagation(),s.preventDefault(),t.disabled)return;let d=[...c.dataValue];d=d.filter(a=>a!==m),p(a=>O(S({},a),{dataValue:d,eventType:"update",eventID:L()}))}})},u.Stringify(o==null?void 0:o.value)||L()))}),l(J,{children:r})},Core:e=>{var M,X;let{value:t}=e,[c,p]=I(!1),[n,r]=I(!1),[m,o]=I(!1),[h,i]=I(""),[s,d]=I(e.options),[a,f]=I(((M=e.options.find(F=>{var E;return(F==null?void 0:F.value)===((E=e.value)==null?void 0:E[0])}))==null?void 0:M.id)||((X=e.options[0])==null?void 0:X.id)||""),[v,C]=I({}),[g,_]=I(z.DefaultStatus(e.componentId,t)),[D,w]=I({ok:!1,notice:[]}),V=re(!1);R(()=>{V.current?d(e.options):V.current=!0},[e.options]),R(()=>{if(!s.length)return;let F=[...s],E=S({},v);F.forEach(k=>{(k==null?void 0:k.type)!="label"&&(E[u.Stringify(k==null?void 0:k.value)]=k)}),C(E)},[s]);let H={rootStates:e,val_options:s,set_options:d,val_optionFocused:a,set_optionFocused:f,val_optionsDict:v,set_optionsDict:C,val_preventDynamicSearchOnKeywordChange:n,set_preventDynamicSearchOnKeywordChange:r,val_preventOpenSelectorOnFocus:c,set_preventOpenSelectorOnFocus:p,val_selectorOpen:m,set_selectorOpen:o,val_keyword:h,set_keyword:i,val_status:g,set_status:_,val_validate:D,set_validate:w},j=!!e.multiSelect;z.CommonEffects({type:j?"autocomplete.multi":"autocomplete.single",states:e,val_status:g,set_status:_,val_validate:D,set_validate:w,SystemValidation:fe});let P=g.dataValue.length&&g.dataValue[0]!==null;return P=P||m,A(de,{val_status:g,set_status:_,val_validate:D,states:e,children:[l(me,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:P}),l(B.Shallow,S({},H)),l(B.Button,S({},H))]})}},ae=e=>{let t=S({},e);return t=O(S({value:[],min:0,max:65535,multiSelect:!0,SearchInput:!0,emptySelect:!0,SelectorComponent:({option:c,isSelected:p,isFocused:n,addCallback:r})=>c?(c==null?void 0:c.type)=="label"?l(J,{children:c.label}):l(te.Sub.S,{color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1.5],isActive:n,isActiveStyles:{backgroundColor:"cloud"},onClick:m=>{r()},children:A(W.Left,{gap:"1/2",children:[p&&l(q.Check,{fontColor:"theme"}),l(K.Supplement,{transition:"short",children:c.label})]})}):null,SelectedComponent:({value:c,label:p,removeCallback:n})=>A(W.Left,{ssCardBox:"cloud",borderRadius:"2.tone.secondary",fontSize:"1.mini",padding:"1/2",gap:0,children:[l(x,{padding:[0,"1/4"],children:p}),l(te.Sub,{flexSizing:"none",color:"cloud",fontColor:"white",backgroundColor:"layer.5",isRounded:!0,padding:"1/4",onClick:n,freeCSS:{lineHeight:1,aspectRatio:"1/1"},children:l(q.X,{ssSphere:1})})]}),SelectorPosition:3},t),{freeCSS:S({cursor:"pointer"},t.freeCSS)}),t.multiSelect||(t.min=0,t.max=1),t.options=t.options||[],t.emptySelect&&(t.options=[{value:null,label:l(K.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...t.options]),t.value=u.flatArray(t.value),t.options=U.InitOptions(t.options),u.is.nullish(t.rightIcon)&&(t.rightIcon=l(oe,{ssSphere:2,children:l(q.Search,{})}),t.disabled&&(t.rightIcon=l(oe,{ssSphere:2,fontColor:"5.translucent",children:l(q.Ban,{})}))),t.rightIcon&&(t=S({paddingRight:3},t)),t.leftIcon&&(t=S({paddingLeft:3},t)),l(pe,{componentId:t.componentId,children:B.Core,states:Se(t)})};export{ae as Autocomplete,ae as default};
1
+ import{b as d,c as _,d as Y,e as Z}from"../../chunk-C5N2D3ZX.js";import{Fragment as J,jsx as a,jsxs as F}from"react/jsx-runtime";import{useState as D,useEffect as x,useRef as ie}from"react";import p,{UUID as w}from"jmini";import{ExtractStyles as re}from"../../@utils";import{Box as A,Span as se,FAI as q,Column as ee}from"../../atoms";import{Literal as K,Row as W}from"../../mols";import{Button as te}from"../Button";import{Loader as ce}from"../Loader";import{Sheet as ue}from"../Sheet";import{OptionalInputWrapper as pe,BoxWrapper as de,CoreEffects as z,DefaultBoxishStyles as Se}from"./core";import{InputAutocompleteClasses as N}from"../../@styles/componentClasses";import{InputLabel as me}from"./Label";import{RightIcon as oe}from".";function fe(e){let{value:t,states:u}=e,{required:S,options:l,min:i,max:f}=u;i=i||0,f=f||65535;let o=[],b=t.filter(r=>r!==null).length;return S&&(b||o.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),b<i&&o.push({type:"invalid",label:i+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),b>f&&o.push({type:"invalid",label:f+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!o.filter(({type:r})=>r=="invalid").length,notice:o}}const U={InitOptions:e=>{let t=[];return e.forEach(u=>{if(!u)return;let{type:S,label:l,value:i,searchValue:f}=u,o=f||p.is.string(l)&&l||""||p.is.string(i)&&i||p.Stringify(i||"")||"";p.is.nullish(l)&&(l=String(i)),t.push(_(d({id:w()},u),{searchValue:o,type:S||"selector",label:l,value:i}))}),t},FilterSelectableOptions:(e,t,u)=>{let S=e;return u||(S=e.filter(l=>(l==null?void 0:l.type)!="label")),p.scope(()=>{if(!t)return;let l=t.toLower().replace(/ /g,"");S=S.filter(i=>(i.searchValue||"").toLower().replace(/ /g,"").includes(l))}),S}},L={Shallow:e=>{let{rootStates:t,val_status:u}=e,S=re(t);return a(A,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(K.Description,_(d({className:t.className},S),{position:"absolute",width:1,freeCSS:_(d({},S.freeCSS),{color:"orange"}),"data-id":"shallow_"+u.componentId,children:a(A,{"data-input-value-shallow":u.componentId,children:"A"})}))})},Button:e=>{let{rootStates:t,val_keyword:u,set_keyword:S,val_optionFocused:l,set_optionFocused:i,val_options:f,set_options:o,val_optionsDict:b,set_optionsDict:r,val_preventOpenSelectorOnFocus:s,set_preventOpenSelectorOnFocus:m,val_selectorOpen:n,set_selectorOpen:v,val_status:g,set_status:C,val_validate:O,set_validate:I}=e,G=t,{tone:T,required:V,form:k,className:H,multiSelect:j,enableFormSubmit:P,checkValidationAtFirst:M,onValidate:X,onValidateDelay:E,onUpdateValue:B,onUpdateValidValue:R,onUserAction:ve,value:ye="",options:ge,leftIndicator:he,rightIndicator:_e,leftIcon:be,rightIcon:Oe,componentId:Ie,status_id:Ce,wrapStyles:De,emptySelect:we,SearchInput:Te,SearchInputPlaceholder:Ve,SelectedComponent:ke,SelectorComponent:Re,SelectorStyles:xe,SelectorPosition:Ae,DynamicOptionsOnSearch:Fe,DynamicOptionsOnSearchDelay:Ee}=G,c=Y(G,["tone","required","form","className","multiSelect","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","emptySelect","SearchInput","SearchInputPlaceholder","SelectedComponent","SelectorComponent","SelectorStyles","SelectorPosition","DynamicOptionsOnSearch","DynamicOptionsOnSearchDelay"]);return x(()=>{var h;if(t.disabled||!n)return;let y=U.FilterSelectableOptions(e.val_options,u,!1);i(((h=y[0])==null?void 0:h.id)||"")},[u]),x(()=>{g.eventType!="init"&&(t.max==g.dataValue.length?(v(!1),m(!0),setTimeout(()=>{let y=p('[data-input-origin="'+t.componentId+'"]');y&&y.focus()},10)):p("#SearchInput_"+t.componentId).focus())},[g.dataValue]),x(()=>{let y="autocomplete-click-"+t.componentId;if(n){if(!p('[data-input-origin="'+t.componentId+'"]'))return;p("#SearchInput_"+t.componentId).focus(),p(document).addEvent({eventID:y,eventType:"mousedown",callback:$=>{let Q=p($.target),ae=!!p(Q).parent("."+N("Core")).length,le=!!p(Q).parent("."+N("Selector")).length;ae||le||(v(!1),$.preventDefault(),$.stopPropagation())},options:{passive:!1}})}else p(document).removeEvent([y]),S("")},[n]),F(J,{children:[a(A,_(d({tabIndex:0},c),{"data-disabled":t.disabled,"data-show-validation":z.isShowValidation(O,g,!!M),"data-component-id":g.componentId,"data-input-origin":g.componentId,"data-focus":!!n,className:[H,N("Core")].join(" "),onFocus:y=>{if(c!=null&&c.onFocus&&(c==null||c.onFocus(y)),C(h=>_(d({},h),{eventID:w(),eventType:"focus.start",isFocusing:!0})),!t.disabled){if(s)return m(!1);v(!0),y.preventDefault()}},onBlur:y=>{c!=null&&c.onBlur&&(c==null||c.onBlur(y)),C(h=>_(d({},h),{eventID:w(),eventType:"focus.end",isFocusing:!1}))},onCompositionStart:y=>{c!=null&&c.onCompositionStart&&(c==null||c.onCompositionStart(y)),C(h=>_(d({},h),{eventID:w(),eventType:"composing.start",isComposing:!0}))},onCompositionEnd:y=>{c!=null&&c.onCompositionEnd&&(c==null||c.onCompositionEnd(y)),C(h=>_(d({},h),{eventID:w(),eventType:"composing.end",isComposing:!1}))},onClick:y=>{c!=null&&c.onClick&&(c==null||c.onClick(y)),!t.disabled&&v(!0)},onKeyDown:y=>{let{key:h}=y;P&&z.SubmitForm(y,k),!n&&(h==" "||h=="ArrowDown"||h=="ArrowUp"||h=="Enter")&&v(!0)},children:F(W.Left,{gap:0,children:[a(se,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),F(W.Left,{flexWrap:!0,flexSizing:0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(L.Selected,d({},e)),a(L.SearchInput,d({},e))]})]})})),n&&a(L.Selector,d({},e))]})},SearchInput:e=>{let{rootStates:t}=e,[u,S]=D(!1);return t.disabled||!e.val_selectorOpen?null:a(A,{id:"SearchInput_"+t.componentId,placeholder:t.SearchInputPlaceholder||"\u691C\u7D22...",opacity:e.val_selectorOpen?"max":"trans",transition:"middle",flexSizing:0,htmlTag:"input",border:"unset",backgroundColor:"trans",value:e.val_keyword,freeCSS:{outline:"none"},onCompositionStart:l=>{t.onCompositionStart&&t.onCompositionStart(l),S(!0)},onCompositionEnd:l=>{t.onCompositionEnd&&t.onCompositionEnd(l),S(!1)},onKeyDown:l=>{let{key:i,metaKey:f,ctrlKey:o}=l,b=f||o;i=="Escape"?(e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0),setTimeout(()=>{let r=p('[data-input-origin="'+t.componentId+'"]');r&&r.focus()},10)):i=="Tab"?e.set_selectorOpen(!1):i==" "?p.scope(()=>{e.val_selectorOpen||e.val_keyword||(l.preventDefault(),e.set_selectorOpen(!0))}):i=="Backspace"?p.scope(()=>{if(e.val_keyword)return;let r=[...e.val_status.dataValue];r.pop(),e.set_status(s=>_(d({},s),{dataValue:r,eventType:"update",eventID:w()}))}):i=="Enter"&&p.scope(()=>{if(u)return;if(!e.val_selectorOpen)return e.set_selectorOpen(!0);let r=e.val_options.find(m=>(m==null?void 0:m.id)==e.val_optionFocused);if(!r)return;let{value:s}=r;e.set_status(m=>{let n=[...m.dataValue];return p.scope(()=>{if(s===null)return n=[];m.dataValue.includes(s)?n=n.filter(g=>g!==s):t.multiSelect?n.push(s):n=[s]}),_(d({},m),{dataValue:n,eventType:"update",eventID:w()})}),e.set_keyword(""),e.set_preventDynamicSearchOnKeywordChange(!0)}),p.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(i))return;if(l.preventDefault(),!e.val_selectorOpen)return e.set_selectorOpen(!0);let r=i=="ArrowDown"?1:-1,s=U.FilterSelectableOptions(e.val_options),m=s.length-1,n=null;p.scope(()=>{var g,C,O,I,T,V;let v=s.findIndex(k=>(k==null?void 0:k.id)==e.val_optionFocused);if(v==-1&&(v=0),r==1){if(n=(g=s[0])==null?void 0:g.id,b){n=(C=s[m])==null?void 0:C.id;return}if(v==-1||v==m)return;n=(O=s[v+1])==null?void 0:O.id}else{if(n=(I=s[m])==null?void 0:I.id,b){n=(T=s[0])==null?void 0:T.id;return}if(v==-1||v==0)return;n=(V=s[v-1])==null?void 0:V.id}}),e.set_optionFocused(n)}),t.enableFormSubmit&&z.SubmitForm(l,e.rootStates.form)},onChange:l=>{let f=l.target.value;e.set_keyword(f)}},"searchInput")},Selector:e=>{var b;let[t,u]=D("idle"),[S,l]=D("idle");x(()=>{if(!e.val_selectorOpen||!e.rootStates.DynamicOptionsOnSearch)return;if(e.val_preventDynamicSearchOnKeywordChange)return e.set_preventDynamicSearchOnKeywordChange(!1);if(t=="idle")return u("ok");l("fetch");let r="autocomplete-search-"+e.rootStates.componentId;p.interval.once(()=>Z(void 0,null,function*(){var n;let s=yield e.rootStates.DynamicOptionsOnSearch(e.val_keyword);l("idle");let m=U.InitOptions(s||[]);e.set_options(m),e.set_optionFocused(((n=m[0])==null?void 0:n.id)||"")}),e.rootStates.DynamicOptionsOnSearchDelay||300,r)},[e.val_keyword]),x(()=>{let r=p(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!r)return;let s=p(`[data-autocomplete-input-value="${e.val_optionFocused}"]`)[0];s&&(r.scrollTop=s.offsetTop-24)},[e.val_optionFocused]);let i=[],f=U.FilterSelectableOptions(e.val_options,e.rootStates.DynamicOptionsOnSearch?"":e.val_keyword,!0);f.forEach((r,s)=>{if(!r)return;let{type:m,value:n}=r,v=e.val_optionFocused==r.id,g=e.val_status.dataValue.includes(n),C=e.rootStates.SelectorComponent;i.push(a(ee,{"data-autocomplete-input-value":r.id,children:a(C,{option:r,isFocused:v,isSelected:g,addCallback:()=>{e.set_status(O=>{let I=[...O.dataValue];return p.scope(()=>{if(n===null)return I=[];O.dataValue.includes(n)?I=I.filter(V=>V!==n):e.rootStates.multiSelect?I.push(n):I=[n]}),_(d({},O),{dataValue:I,eventType:"update",eventID:w()})})}})},r.id))}),f.length||(i=[a(K.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]),S=="fetch"&&(i=[F(W.Left,{padding:1,fontColor:"3.blur",children:[a(ce.Theme.R,{showInitial:!0}),a(K.Supplement,{children:"Loading..."})]},"loader")]);let o={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:o.bottom="100%",o.left=0,o.paddingBottom="1/3";break;case 2:o.bottom="100%",o.right=0,o.paddingBottom="1/3";break;case 3:o.top="100%",o.left=0,o.paddingTop="1/3";break;case 4:o.top="100%",o.right=0,o.paddingTop="1/3";break;default:break}return a(A,_(d({},o),{children:a(ue.Body,_(d({className:N("Selector"),borderRadius:"2.tone.secondary",ssCardBox:!0,boxShadow:"1.normal",overflow:"auto","data-selector-id":e.val_status.componentId},e.rootStates.SelectorStyles),{freeCSS:d({maxHeight:12*24},(b=e.rootStates.SelectorStyles)==null?void 0:b.freeCSS),children:a(ee,{gap:"1/12",padding:[1,0],children:i})}))}))},Selected:e=>{let{rootStates:t,val_status:u,set_status:S,val_optionsDict:l}=e,i=[];return u.dataValue.forEach(f=>{let o=l[p.Stringify(f)];if(!o)return;let b=t.SelectedComponent,r=o.label;(o==null?void 0:o.value)===null&&(r=""),i.push(a(A,{className:N("SelectedCell"),children:a(b,{value:o==null?void 0:o.value,label:r,removeCallback:s=>{if(s.stopPropagation(),s.preventDefault(),t.disabled)return;let m=[...u.dataValue];m=m.filter(n=>n!==f),S(n=>_(d({},n),{dataValue:m,eventType:"update",eventID:w()}))}})},p.Stringify(o==null?void 0:o.value)||w()))}),a(J,{children:i})},Core:e=>{var M,X;let{value:t}=e,[u,S]=D(!1),[l,i]=D(!1),[f,o]=D(!1),[b,r]=D(""),[s,m]=D(e.options),[n,v]=D(((M=e.options.find(E=>{var B;return(E==null?void 0:E.value)===((B=e.value)==null?void 0:B[0])}))==null?void 0:M.id)||((X=e.options[0])==null?void 0:X.id)||""),[g,C]=D({}),[O,I]=D(z.DefaultStatus(e.componentId,t)),[T,V]=D({ok:!1,notice:[]}),k=ie(!1);x(()=>{k.current?m(e.options):k.current=!0},[e.options]),x(()=>{if(!s.length)return;let E=[...s],B=d({},g);E.forEach(R=>{(R==null?void 0:R.type)!="label"&&(B[p.Stringify(R==null?void 0:R.value)]=R)}),C(B)},[s]);let H={rootStates:e,val_options:s,set_options:m,val_optionFocused:n,set_optionFocused:v,val_optionsDict:g,set_optionsDict:C,val_preventDynamicSearchOnKeywordChange:l,set_preventDynamicSearchOnKeywordChange:i,val_preventOpenSelectorOnFocus:u,set_preventOpenSelectorOnFocus:S,val_selectorOpen:f,set_selectorOpen:o,val_keyword:b,set_keyword:r,val_status:O,set_status:I,val_validate:T,set_validate:V},j=!!e.multiSelect;z.CommonEffects({type:j?"autocomplete.multi":"autocomplete.single",states:e,val_status:O,set_status:I,val_validate:T,set_validate:V,SystemValidation:fe});let P=O.dataValue.length&&O.dataValue[0]!==null;return P=P||f,F(de,{val_status:O,set_status:I,val_validate:T,states:e,children:[a(me,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:P}),a(L.Shallow,d({},H)),a(L.Button,d({},H))]})}},ne=e=>{let t=d({},e);return t=_(d({value:[],min:0,max:65535,multiSelect:!0,SearchInput:!0,emptySelect:!0,SelectorComponent:({option:u,isSelected:S,isFocused:l,addCallback:i})=>u?(u==null?void 0:u.type)=="label"?a(J,{children:u.label}):a(te.Sub.S,{color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1.5],isActive:l,isActiveStyles:{backgroundColor:"cloud"},onClick:f=>{i()},children:F(W.Left,{gap:"1/2",children:[S&&a(q.Check,{fontColor:"theme"}),a(K.Supplement,{transition:"short",children:u.label})]})}):null,SelectedComponent:({value:u,label:S,removeCallback:l})=>F(W.Left,{ssCardBox:"cloud",borderRadius:"2.tone.secondary",fontSize:"1.mini",padding:"1/2",gap:0,children:[a(A,{padding:[0,"1/4"],children:S}),a(te.Sub,{flexSizing:"none",color:"cloud",fontColor:"white",backgroundColor:"layer.5",isRounded:!0,padding:"1/4",onClick:l,freeCSS:{lineHeight:1,aspectRatio:"1/1"},children:a(q.X,{ssSphere:1})})]}),SelectorPosition:3},t),{freeCSS:d({cursor:"pointer"},t.freeCSS)}),t.multiSelect||(t.min=0,t.max=1),t.options=t.options||[],t.emptySelect&&(t.options=[{value:null,label:a(K.Supplement,{fontColor:"4.thin",children:"\u9078\u629E\u3092\u89E3\u9664"})},...t.options]),t.value=p.flatArray(t.value),t.options=U.InitOptions(t.options),p.is.nullish(t.rightIcon)&&(t.rightIcon=a(oe,{ssSphere:2,children:a(q.Search,{})}),t.disabled&&(t.rightIcon=a(oe,{ssSphere:2,fontColor:"5.translucent",children:a(q.Ban,{})}))),t.rightIcon&&(t=d({paddingRight:3},t)),t.leftIcon&&(t=d({paddingLeft:3},t)),a(pe,{componentId:t.componentId,children:L.Core,states:Se(t)})};export{ne as Autocomplete,ne as default};
@@ -1 +1 @@
1
- import{b as e,c as r,d as h}from"../../chunk-C5N2D3ZX.js";import{jsx as m}from"react/jsx-runtime";import{UUID as D}from"jmini";import{useState as v}from"react";import x from"../../atoms/Box";import{OptionalInputWrapper as _,BoxWrapper as k,CoreEffects as p,DefaultBoxishStyles as F}from"./core";import{InputSwitchClasses as R}from"../../@styles/componentClasses";function w(t){let{value:n,states:d}=t,{required:s}=d,o=[];return s&&!n&&o.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!o.filter(({type:c})=>c=="invalid").length,notice:o}}const B=t=>{let y=t,{componentId:n,required:d,form:s,enableFormSubmit:o,checkValidationAtFirst:c,onChange:I,onKeyDown:f,onValidate:E,onValidateDelay:U,onUpdateValue:W,onUpdateValidValue:H,value:g=""}=y,S=h(y,["componentId","required","form","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value"]),[l,i]=v(p.DefaultStatus(t.componentId||"",g)),[u,C]=v({ok:!1,notice:[]});return p.CommonEffects({type:"color",states:t,val_status:l,set_status:i,val_validate:u,set_validate:C,SystemValidation:w}),m(k,{val_status:l,set_status:i,val_validate:u,states:t,children:m(x,e({htmlTag:"input",type:"color","data-component-id":l.componentId,value:l.dataValue,className:R("Input"),onKeyDown:a=>{f&&f(a),o&&p.SubmitForm(a,s)},onChange:a=>{let{value:T}=a.target;u.ok&&C({ok:!1,notice:[]}),i(b=>r(e({},b),{dataValue:T,eventType:"update",eventID:D()})),I&&I(a)}},S))})},V=t=>{let n=r(e(r(e({},F(t)),{backgroundColor:"cloud",unitHeight:3}),t),{freeCSS:e({minWidth:108},t.freeCSS)});return m(_,{componentId:t.componentId,children:B,states:n})};export{V as Color,V as default};
1
+ import{b as a,c as n,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as I}from"react/jsx-runtime";import{UUID as m}from"jmini";import{useState as S}from"react";import h from"../../atoms/Box";import{OptionalInputWrapper as x,BoxWrapper as B,CoreEffects as c,DefaultBoxishStyles as _}from"./core";import{InputSwitchClasses as k}from"../../@styles/componentClasses";function R(e){let{value:i,states:f}=e,{required:p}=f,l=[];return p&&!i&&l.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!l.filter(({type:C})=>C=="invalid").length,notice:l}}const U=e=>{let T=e,{componentId:i,required:f,form:p,enableFormSubmit:l,checkValidationAtFirst:C,onChange:y,onKeyDown:v,onValidate:w,onValidateDelay:E,onUpdateValue:W,onUpdateValidValue:A,onUserAction:H,value:D=""}=T,t=V(T,["componentId","required","form","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value"]),[r,u]=S(c.DefaultStatus(e.componentId||"",D)),[d,g]=S({ok:!1,notice:[]});return c.CommonEffects({type:"color",states:e,val_status:r,set_status:u,val_validate:d,set_validate:g,SystemValidation:R}),I(B,{val_status:r,set_status:u,val_validate:d,states:e,children:I(h,a({htmlTag:"input",type:"color","data-component-id":r.componentId,value:r.dataValue,className:k("Input"),onKeyDown:o=>{v&&v(o),l&&c.SubmitForm(o,p)},onChange:o=>{let{value:s}=o.target;d.ok&&g({ok:!1,notice:[]}),u(F=>n(a({},F),{dataValue:s,eventType:"update",eventID:m()})),y&&y(o)},onFocus:o=>{t!=null&&t.onFocus&&(t==null||t.onFocus(o)),u(s=>n(a({},s),{eventID:m(),eventType:"focus.start",isFocusing:!0}))},onBlur:o=>{t!=null&&t.onBlur&&(t==null||t.onBlur(o)),u(s=>n(a({},s),{eventID:m(),eventType:"focus.end",isFocusing:!1}))}},t))})},b=e=>{let i=n(a(n(a({},_(e)),{backgroundColor:"cloud",unitHeight:3}),e),{freeCSS:a({minWidth:108},e.freeCSS)});return I(x,{componentId:e.componentId,children:U,states:i})};export{b as Color,b as default};
@@ -1 +1 @@
1
- import{b as o,c as r,d as b}from"../../chunk-C5N2D3ZX.js";import{jsx as u}from"react/jsx-runtime";import{UUID as g}from"jmini";import{useState as h}from"react";import{OptionalInputWrapper as w,BoxWrapper as _,CoreEffects as s,DefaultBoxishStyles as B}from"./core";import{Box as k}from"../../atoms";function F(t){let{value:e,states:c}=t,{required:m}=c,n=[];return m&&!e&&n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!n.filter(({type:p})=>p=="invalid").length,notice:n}}const H=t=>{let T=t,{componentId:e,tone:c,required:m,form:n,value:p,enableFormSubmit:S,checkValidationAtFirst:C,onInput:f,onKeyDown:I,onValidate:L,onValidateDelay:M,onUpdateValue:U,onUpdateValidValue:W,children:E="",leftIndicator:q,rightIndicator:A,leftIcon:K,rightIcon:G,freeCSS:N,wrapStyles:O}=T,V=b(T,["componentId","tone","required","form","value","enableFormSubmit","checkValidationAtFirst","onInput","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","children","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[i,d]=h(s.DefaultStatus(e,p)),[l,y]=h({ok:!1,notice:[]});return s.CommonEffects({type:"contenteditable",states:t,val_status:i,set_status:d,val_validate:l,set_validate:y,SystemValidation:F}),u(_,{val_status:i,set_status:d,val_validate:l,states:t,children:u(k,r(o({contentEditable:!0,"data-show-validation":s.isShowValidation(l,i,!!C),"data-component-id":i.componentId,onKeyDown:a=>{I&&I(a),S&&s.SubmitForm(a,n)},onInput:a=>{let R=a.currentTarget,{innerHTML:P,innerText:x}=R;l.ok&&y({ok:!1,notice:[]}),d(D=>r(o({},D),{dataValue:x,eventType:"update",eventID:g()})),f&&f(a)}},V),{children:E}))})},v=t=>{t=r(o({rows:5},t),{freeCSS:o({whiteSpace:"pre-wrap"},t.freeCSS)});let e=B(t);return u(w,{componentId:t.componentId,children:H,states:e})};export{v as Contenteditable,v as default};
1
+ import{b as o,c as r,d as b}from"../../chunk-C5N2D3ZX.js";import{jsx as u}from"react/jsx-runtime";import{UUID as g}from"jmini";import{useState as h}from"react";import{OptionalInputWrapper as w,BoxWrapper as _,CoreEffects as s,DefaultBoxishStyles as B}from"./core";import{Box as k}from"../../atoms";function F(t){let{value:e,states:c}=t,{required:m}=c,n=[];return m&&!e&&n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!n.filter(({type:p})=>p=="invalid").length,notice:n}}const H=t=>{let T=t,{componentId:e,tone:c,required:m,form:n,value:p,enableFormSubmit:S,checkValidationAtFirst:C,onInput:f,onKeyDown:I,onValidate:L,onValidateDelay:M,onUpdateValue:U,onUpdateValidValue:A,onUserAction:W,children:E="",leftIndicator:q,rightIndicator:K,leftIcon:G,rightIcon:N,freeCSS:O,wrapStyles:P}=T,V=b(T,["componentId","tone","required","form","value","enableFormSubmit","checkValidationAtFirst","onInput","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","children","leftIndicator","rightIndicator","leftIcon","rightIcon","freeCSS","wrapStyles"]),[i,d]=h(s.DefaultStatus(e,p)),[l,y]=h({ok:!1,notice:[]});return s.CommonEffects({type:"contenteditable",states:t,val_status:i,set_status:d,val_validate:l,set_validate:y,SystemValidation:F}),u(_,{val_status:i,set_status:d,val_validate:l,states:t,children:u(k,r(o({contentEditable:!0,"data-show-validation":s.isShowValidation(l,i,!!C),"data-component-id":i.componentId,onKeyDown:a=>{I&&I(a),S&&s.SubmitForm(a,n)},onInput:a=>{let R=a.currentTarget,{innerHTML:z,innerText:x}=R;l.ok&&y({ok:!1,notice:[]}),d(D=>r(o({},D),{dataValue:x,eventType:"update",eventID:g()})),f&&f(a)}},V),{children:E}))})},v=t=>{t=r(o({rows:5},t),{freeCSS:o({whiteSpace:"pre-wrap"},t.freeCSS)});let e=B(t);return u(w,{componentId:t.componentId,children:H,states:e})};export{v as Contenteditable,v as default};
@@ -1 +1 @@
1
- import{b as t,c as p,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as I}from"react/jsx-runtime";import{useState as F}from"react";import B,{UUID as S}from"jmini";import{$$fromRoot as K,GenerateHTMLProps as W}from"../../@utils";import{OptionalInputWrapper as U,BoxWrapper as $,CoreEffects as w,DefaultBoxishStyles as P}from"./core";import{Flex as q}from"../../atoms";import{InputClasses as R}from"../../@styles/componentClasses";function j(e){let{value:a,states:l}=e,{required:u,numericOnly:o=!1,digits:c}=l,r=[];return u&&!a&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),a&&(o&&a.match(/\D/)&&r.push({type:"invalid",label:"\u6570\u5B57\u306E\u307F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a.length!=c&&r.push({type:"warn",label:"\u6700\u5F8C\u307E\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"})),{ok:!r.filter(({type:f})=>f=="invalid"||f=="warn").length,notice:r}}const z=(e,a="")=>{let l=String(a),u=[];for(let o=0;o<e;o++)u[o]=l[o]||"";return{formatValue:u,dataValue:l}},A=(e="")=>{let a=e,l=a.join("");return{formatValue:a,dataValue:l}},G=e=>{let v=e,{tone:a,required:l,form:u,name:o,className:c="",digits:r,numericOnly:h=!1,enableFormSubmit:f,checkValidationAtFirst:J,onChange:Q,onKeyDown:X,onValidate:Y,onValidateDelay:Z,onUpdateValue:ee,onUpdateValidValue:te,value:N="",override:ae,freeCSS:ne,wrapStyles:ie,combineInput:re,componentId:le,listStyles:_}=v,oe=V(v,["tone","required","form","name","className","digits","numericOnly","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","override","freeCSS","wrapStyles","combineInput","componentId","listStyles"]),[s,y]=F(p(t({componentId:e.componentId||""},z(r,N)),{eventType:"init",eventID:S()})),[D,k]=F({ok:!1,notice:[]});w.CommonEffects({type:"textfield",states:e,val_status:s,set_status:y,val_validate:D,set_validate:k,SystemValidation:j});let b=[];for(let n=0;n<r;n++){let E=s.formatValue[n],H={},x=c;e.combineInput&&(x=[c,R("DigitCharacterCell"),R("Combined")].join(" ")),b.push(I("input",{type:"text",inputMode:h?"numeric":e.inputMode||"text",value:E,id:"Digit-"+n+"-"+s.componentId,className:x,style:t(t({},e.style),H),onKeyDown:C=>{let{key:g,code:L}=C;if(g=="Tab")return;C.preventDefault();let m=null;if(g=="Backspace"){let i=s.formatValue;i[n]="",y(d=>p(t(t({},d),A(i)),{eventType:"update",eventID:S()})),m=n-1}else if(["ArrowLeft","ArrowRight"].includes(g)){let i=+(g=="ArrowRight")*2-1;m=n+i}else f&&w.SubmitForm(C,u),(()=>{let i=L.match(/^(Key(.)|Digit(\d)|Numpad(\d))/);if(!i)return;let d=i[2]||i[3]||i[4];if(h&&!d.match(/\d/)||!d)return;let T=s.formatValue;T[n]=d,y(O=>p(t(t({},O),A(T)),{eventType:"update",eventID:S()})),m=n+1})();B.is.exist(m)&&K("#Digit-"+m+"-"+s.componentId).focus()},onChange:()=>{}},n))}return I($,{val_status:s,set_status:y,val_validate:D,states:e,children:I(q,p(t({gap:"1/2",flexChilds:"even",flexWrap:!1,flexSizing:"auto"},_),{children:b}))})},M=e=>{e=t({},e),e=t({textAlign:"center",width:0},e),e.combineInput&&(e=p(t({textAlign:"center",width:0},e),{freeCSS:t({minWidth:12*2,marginRight:-1},e.freeCSS),listStyles:t({borderRadius:"2.tone.secondary",border:"unset",gap:0},e.listStyles)}));let a=W(P(e));return I(U,{componentId:e.componentId,children:G,states:a})};export{M as DigitCharacters,M as default};
1
+ import{b as t,c as s,d as V}from"../../chunk-C5N2D3ZX.js";import{jsx as D}from"react/jsx-runtime";import{useState as w}from"react";import K,{UUID as I}from"jmini";import{$$fromRoot as U,GenerateHTMLProps as W}from"../../@utils";import{OptionalInputWrapper as $,BoxWrapper as P,CoreEffects as R,DefaultBoxishStyles as q}from"./core";import{Flex as j}from"../../atoms";import{InputClasses as A}from"../../@styles/componentClasses";function z(e){let{value:a,states:u}=e,{required:d,numericOnly:p=!1,digits:C}=u,l=[];return d&&!a&&l.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),a&&(p&&a.match(/\D/)&&l.push({type:"invalid",label:"\u6570\u5B57\u306E\u307F\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"}),a.length!=C&&l.push({type:"warn",label:"\u6700\u5F8C\u307E\u3067\u5165\u529B\u3057\u3066\u304F\u3060\u3055\u3044"})),{ok:!l.filter(({type:S})=>S=="invalid"||S=="warn").length,notice:l}}const G=(e,a="")=>{let u=String(a),d=[];for(let p=0;p<e;p++)d[p]=u[p]||"";return{formatValue:d,dataValue:u}},B=(e="")=>{let a=e,u=a.join("");return{formatValue:a,dataValue:u}},J=e=>{let b=e,{tone:a,required:u,form:d,name:p,className:C="",digits:l,numericOnly:v=!1,enableFormSubmit:S,checkValidationAtFirst:Q,onChange:X,onKeyDown:Y,onValidate:Z,onValidateDelay:ee,onUpdateValue:te,onUpdateValidValue:ae,onUserAction:ne,value:N="",override:ie,freeCSS:re,wrapStyles:le,combineInput:oe,componentId:se,listStyles:_}=b,n=V(b,["tone","required","form","name","className","digits","numericOnly","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","override","freeCSS","wrapStyles","combineInput","componentId","listStyles"]),[m,f]=w(s(t({componentId:e.componentId||""},G(l,N)),{eventType:"init",eventID:I()})),[h,k]=w({ok:!1,notice:[]});R.CommonEffects({type:"textfield",states:e,val_status:m,set_status:f,val_validate:h,set_validate:k,SystemValidation:z});let T=[];for(let i=0;i<l;i++){let E=m.formatValue[i],H={},x=C;e.combineInput&&(x=[C,A("DigitCharacterCell"),A("Combined")].join(" ")),T.push(D("input",{type:"text",inputMode:v?"numeric":e.inputMode||"text",value:E,id:"Digit-"+i+"-"+m.componentId,className:x,style:t(t({},e.style),H),onKeyDown:c=>{let{key:o,code:L}=c;if(o=="Tab")return;c.preventDefault();let y=null;if(o=="Backspace"){let r=m.formatValue;r[i]="",f(g=>s(t(t({},g),B(r)),{eventType:"update",eventID:I()})),y=i-1}else if(["ArrowLeft","ArrowRight"].includes(o)){let r=+(o=="ArrowRight")*2-1;y=i+r}else S&&R.SubmitForm(c,d),(()=>{let r=L.match(/^(Key(.)|Digit(\d)|Numpad(\d))/);if(!r)return;let g=r[2]||r[3]||r[4];if(v&&!g.match(/\d/)||!g)return;let F=m.formatValue;F[i]=g,f(O=>s(t(t({},O),B(F)),{eventType:"update",eventID:I()})),y=i+1})();K.is.exist(y)&&U("#Digit-"+y+"-"+m.componentId).focus()},onChange:()=>{},onFocus:c=>{n!=null&&n.onFocus&&(n==null||n.onFocus(c)),f(o=>s(t({},o),{eventID:I(),eventType:"focus.start",isFocusing:!0}))},onBlur:c=>{n!=null&&n.onBlur&&(n==null||n.onBlur(c)),f(o=>s(t({},o),{eventID:I(),eventType:"focus.end",isFocusing:!1}))}},i))}return D(P,{val_status:m,set_status:f,val_validate:h,states:e,children:D(j,s(t({gap:"1/2",flexChilds:"even",flexWrap:!1,flexSizing:"auto"},_),{children:T}))})},M=e=>{e=t({},e),e=t({textAlign:"center",width:0},e),e.combineInput&&(e=s(t({textAlign:"center",width:0},e),{freeCSS:t({minWidth:12*2,marginRight:-1},e.freeCSS),listStyles:t({borderRadius:"2.tone.secondary",border:"unset",gap:0},e.listStyles)}));let a=W(q(e));return D($,{componentId:e.componentId,children:J,states:a})};export{M as DigitCharacters,M as default};
@@ -1 +1 @@
1
- import{b as s,c as u,d as G,e as O}from"../../chunk-C5N2D3ZX.js";import{Fragment as le,jsx as l,jsxs as p}from"react/jsx-runtime";import{useState as U,useEffect as Q}from"react";import se,{UUID as T,useStore as Y}from"jmini";import{$$fromRoot as D,ExtractStyles as re}from"../../@utils";import{Box as d,FAI as P,Flex as L,Column as ee}from"../../atoms";import{Row as pe}from"../../mols";import{Button as W}from"../Button";import H from"../Snackbar";import{OptionalInputWrapper as ue,BoxWrapper as me,CoreEffects as te,DefaultBoxishStyles as ce}from"./core";import de from"./TextField";import{InputFilerClasses as f}from"../../@styles/componentClasses";import{faCloudArrowUp as fe}from"@fortawesome/free-solid-svg-icons/faCloudArrowUp";function ge(e){let{value:t,states:n}=e,{required:m}=n,a=[];return m&&!t.length&&a.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!a.filter(({type:c})=>c=="invalid").length,notice:a}}const ae={List:e=>{let{rootStates:t,val_status:n,set_status:m}=e;if(t.useSystemOnly)return null;let a=t.limit-(n.dataValue||[]).length,c=(n.dataValue||[]).map((r,g)=>l(ae.ListCell,u(s({},e),{index:g,val_file:r}),r.name));return a>0&&c.push(l(d,u(s({htmlTag:"label"},t.cellStyles),{className:[t.cellClassName,f("AddButton")].join(" "),"data-component-id":n.componentId,htmlFor:t.id,tabIndex:t.tabIndex,onKeyDown:r=>{let{key:g}=r;t.tabIndex!=-1&&[" ","Enter"].includes(g)&&D("#"+t.id).click()},children:p(pe.Center,{padding:["1/3",0],children:[l(d,{isRounded:!0,className:f("AddIcon"),children:l(P,{icon:fe,className:f("Icon"),fontColor:"theme",fontSize:"4.thirdTitle",backgroundColor:"theme.opa.low",ssSphere:3,padding:"1/2"})}),p(d,{children:[p(d,{fontColor:"theme",fontSize:"2.normal",isSemiBoldFont:!0,children:["\u30D5\u30A1\u30A4\u30EB\u3092\u9078\u629E(",a,")"]}),l(d,{fontColor:"4.thin",fontSize:"0.xs",isSemiBoldFont:!0,children:"\u30D5\u30A1\u30A4\u30EB\u3092\u30C9\u30ED\u30C3\u30D7"})]})]})}),"AddButton")),l(ee,u(s({flexSizing:"auto"},re(t)),{className:t.className,children:c}))},ListCell:e=>{let{index:t,rootStates:n,val_file:m,val_status:a,set_status:c}=e,{name:r,size:g,type:o}=m,[F,B]=U(!1),w=T(),q=g.rank(),[K,_]=r.replace(/\s/,"").replace(/(.*)\.(.*)$/,"$1 $2").split(" "),i="\u30D5\u30A1\u30A4\u30EB";return o.match(/image/)?i=o.replace(/image\//,""):o.match(/pdf/)?i="PDF":o.match(/csv/)?i="CSV":o.match(/spreadsheet/)?i="SpreadSheet":o.match(/presentation/)?i="PowerPoint":o.match(/word/)?i="Word":o.match(/zip/)?i="Zip":o.match(/powerpoint/)?i="PowerPoint":o.match(/html/)?i="HTML":o.match(/js/)?i="JavaScript":o.match(/css/)?i="CSS":o.match(/text\/plain/)&&(i="\u30C6\u30AD\u30B9\u30C8"),Q(()=>{F&&setTimeout(()=>{D("#"+w).focus()},100)},[F]),p(L,u(s({verticalAlign:"center",flexWrap:!1,gap:1,className:n.cellClassName},n.cellStyles),{children:[l(P.File,{fontSize:"4.thirdTitle",fontColor:"4.thin"}),p(d,{flexSizing:0,children:[l(d,{children:l(L,{verticalAlign:"center",gap:"2/3",flexWrap:!1,className:f("FileName"),children:F?l(le,{children:p(ee,{flexSizing:0,gap:"1/2",children:[p(L,{gap:"2/3",verticalAlign:"center",children:[l(de,{tone:"border",wrapStyles:{flexSizing:"auto"},restrict:"fileName",name:"name",required:!0,id:w,form:"form-"+w,enableFormSubmit:!0,value:K,onKeyDown:C=>{let{key:N}=C;N=="Escape"&&B(!1)}}),p(d,{children:[". ",_]})]}),p(L,{gap:"2/3",horizontalAlign:"right",flexWrap:!1,children:[l(W.Sub,{padding:["2/3",1],onClick:()=>{B(!1)},children:"\u9589\u3058\u308B"}),l(W,{padding:["2/3",1],submitOption:{formName:"form-"+w,callback:C=>O(void 0,null,function*(){let{name:N}=C,b=[...a.dataValue],A=b[t],J=A.id;if(!A)return;let{target:M}=yield A.convert();if(!M)return;let E=yield String(M.result).toBlob(m.type);if(!E)return;let y=new File([E],N+"."+_,{type:A.type});y.id=J,b[t]=y,c(x=>u(s({},x),{dataValue:b,eventType:"update",eventID:T()})),B(!1)})},children:"\u6C7A\u5B9A"})]})]})}):p(le,{children:[r,!!n.isNameEditable&&l(W.Clear,{ssSphere:2.5,flexSizing:"none",fontColor:"4.thin",padding:"1/3",ssEffectsOnActive:"expand",color:"cloud",onClick:()=>{B(!0)},children:l(P.Pen,{})})]})})}),!F&&p(d,{fontSize:"1.mini",fontColor:"4.thin",flexSizing:0,children:[i,"\u30D5\u30A1\u30A4\u30EB / ",q,"B"]})]}),l(W.Sub,{color:"cloud",fontColor:"4.thin",ssSphere:3,onClick:()=>{let C=[...a.dataValue];C[t]&&(C.splice(t,1),c(b=>u(s({},b),{dataValue:C,eventType:"update",eventID:T()})))},children:l(P.X,{})})]}))}},ye=e=>{let Z=e,{tone:t,required:n,form:m,isNameEditable:a,useSystemOnly:c,accept:r="*",limit:g=1,checkValidationAtFirst:o,onChange:F,onValidate:B,onValidateDelay:w,onUpdateValue:q,onUpdateValidValue:K,value:_=[],className:i,cellStyles:C,cellClassName:N,componentId:b,status_id:A,enableFormSubmit:J,freeCSS:M,wrapStyles:ne}=Z,E=G(Z,["tone","required","form","isNameEditable","useSystemOnly","accept","limit","checkValidationAtFirst","onChange","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","className","cellStyles","cellClassName","componentId","status_id","enableFormSubmit","freeCSS","wrapStyles"]),[y,x]=U(te.DefaultStatus(e.componentId||"",_)),[X,oe]=U({ok:!1,notice:[]}),ie={rootStates:e,val_status:y,set_status:x};Q(()=>{Y.set({["AddFiles-"+y.componentId]:v=>{x(V=>{let I=V.dataValue,k=[];for(var S=0;S<(v==null?void 0:v.length);S++){let h=v[S],{type:z,name:R}=h;if(S+1+I.length>g){H.add({componentId:R,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u9078\u629E\u4E0A\u9650\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${R}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}if(r&&r=="image"&&!z.match(/image/)){H.add({componentId:R,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u5F62\u5F0F\u304C\u7570\u306A\u308B\u305F\u3081\u3001${R} \u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}k.push(h)}return u(s({},V),{dataValue:[...I,...k],eventType:"update",eventID:T()})})}})},[]),te.CommonEffects({type:"file",states:e,val_status:y,set_status:x,val_validate:X,set_validate:oe,SystemValidation:ge});let $="";return r&&(r=="image"?$="image/png,image/jpeg":$=r),p(me,{val_status:y,set_status:x,val_validate:X,states:e,children:[l(d,u(s({htmlTag:"input",type:"file",className:f("Input"),"data-component-id":y.componentId,accept:$,multiple:g!=1,onChange:v=>O(void 0,null,function*(){F&&F(v);let V=v.target,I=V.files,k=[];for(var S=0;S<(I==null?void 0:I.length);S++){let h=I[S],z=h.name;if(h.id=T(),S+1+y.dataValue.length>g){H.add({componentId:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u767B\u9332\u6570\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${z}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002`,backgroundColor:"nega"});continue}k.push(h)}x(h=>u(s({},h),{dataValue:[...h.dataValue,...k],eventType:"update",eventID:T()})),V.value=""})},E),{opacity:"low",tabIndex:-1,value:""})),l(ae.List,s({},ie))]})},j=e=>(e=u(s({limit:1,isNameEditable:!0,useSystemOnly:!1,tone:"border",value:[]},e),{override:"force",cellStyles:s(s({},ce({tone:e.tone||"border"})),e.cellStyles)}),l(ue,{componentId:e.componentId,children:ye,states:e}));j.fn={openDialog:e=>{let{multiple:t,accept:n}=e;return new Promise(m=>{const a=document.createElement("input");a.type="file",a.multiple=t!=null?t:!0,n&&(n=="image"?a.accept="image/png,image/jpeg,image/webp":a.accept=n),a.onchange=c=>{m(c.target.files)},a.click()})}},typeof window!="undefined"&&window.document&&se(document).addEvent({eventType:"dragover",callback:e=>{e.preventDefault(),D("."+f("AddButton")).addClass(f("Draggable"))},options:{passive:!1}}).addEvent({eventType:"drop",callback:e=>{e.preventDefault(),D("."+f("AddButton")).removeClass(f("Draggable"));let t=e.dataTransfer.files;if(t.length){let n=e.target;if(D(n).hasClass(f("AddButton"))){let{componentId:m}=n.dataset,a=Y.get("AddFiles-"+m);a&&a(t)}}},options:{passive:!1}});export{j as Filer,j as default};
1
+ import{b as s,c as u,d as Q,e as U}from"../../chunk-C5N2D3ZX.js";import{Fragment as ne,jsx as l,jsxs as p}from"react/jsx-runtime";import{useState as H,useEffect as Y}from"react";import re,{UUID as b,useStore as ee}from"jmini";import{$$fromRoot as D,ExtractStyles as pe}from"../../@utils";import{Box as d,FAI as R,Flex as P,Column as te}from"../../atoms";import{Row as ue}from"../../mols";import{Button as L}from"../Button";import j from"../Snackbar";import{OptionalInputWrapper as ce,BoxWrapper as me,CoreEffects as ae,DefaultBoxishStyles as de}from"./core";import fe from"./TextField";import{InputFilerClasses as f}from"../../@styles/componentClasses";import{faCloudArrowUp as ge}from"@fortawesome/free-solid-svg-icons/faCloudArrowUp";function ye(e){let{value:t,states:n}=e,{required:c}=n,a=[];return c&&!t.length&&a.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!a.filter(({type:m})=>m=="invalid").length,notice:a}}const le={List:e=>{let{rootStates:t,val_status:n,set_status:c}=e;if(t.useSystemOnly)return null;let a=t.limit-(n.dataValue||[]).length,m=(n.dataValue||[]).map((r,g)=>l(le.ListCell,u(s({},e),{index:g,val_file:r}),r.name));return a>0&&m.push(l(d,u(s({htmlTag:"label"},t.cellStyles),{className:[t.cellClassName,f("AddButton")].join(" "),"data-component-id":n.componentId,htmlFor:t.id,tabIndex:t.tabIndex,onKeyDown:r=>{let{key:g}=r;t.tabIndex!=-1&&[" ","Enter"].includes(g)&&D("#"+t.id).click()},children:p(ue.Center,{padding:["1/3",0],children:[l(d,{isRounded:!0,className:f("AddIcon"),children:l(R,{icon:ge,className:f("Icon"),fontColor:"theme",fontSize:"4.thirdTitle",backgroundColor:"theme.opa.low",ssSphere:3,padding:"1/2"})}),p(d,{children:[p(d,{fontColor:"theme",fontSize:"2.normal",isSemiBoldFont:!0,children:["\u30D5\u30A1\u30A4\u30EB\u3092\u9078\u629E(",a,")"]}),l(d,{fontColor:"4.thin",fontSize:"0.xs",isSemiBoldFont:!0,children:"\u30D5\u30A1\u30A4\u30EB\u3092\u30C9\u30ED\u30C3\u30D7"})]})]})}),"AddButton")),l(te,u(s({flexSizing:"auto"},pe(t)),{className:t.className,children:m}))},ListCell:e=>{let{index:t,rootStates:n,val_file:c,val_status:a,set_status:m}=e,{name:r,size:g,type:i}=c,[F,T]=H(!1),B=b(),K=g.rank(),[J,W]=r.replace(/\s/,"").replace(/(.*)\.(.*)$/,"$1 $2").split(" "),o="\u30D5\u30A1\u30A4\u30EB";return i.match(/image/)?o=i.replace(/image\//,""):i.match(/pdf/)?o="PDF":i.match(/csv/)?o="CSV":i.match(/spreadsheet/)?o="SpreadSheet":i.match(/presentation/)?o="PowerPoint":i.match(/word/)?o="Word":i.match(/zip/)?o="Zip":i.match(/powerpoint/)?o="PowerPoint":i.match(/html/)?o="HTML":i.match(/js/)?o="JavaScript":i.match(/css/)?o="CSS":i.match(/text\/plain/)&&(o="\u30C6\u30AD\u30B9\u30C8"),Y(()=>{F&&setTimeout(()=>{D("#"+B).focus()},100)},[F]),p(P,u(s({verticalAlign:"center",flexWrap:!1,gap:1,className:n.cellClassName},n.cellStyles),{children:[l(R.File,{fontSize:"4.thirdTitle",fontColor:"4.thin"}),p(d,{flexSizing:0,children:[l(d,{children:l(P,{verticalAlign:"center",gap:"2/3",flexWrap:!1,className:f("FileName"),children:F?l(ne,{children:p(te,{flexSizing:0,gap:"1/2",children:[p(P,{gap:"2/3",verticalAlign:"center",children:[l(fe,{tone:"border",wrapStyles:{flexSizing:"auto"},restrict:"fileName",name:"name",required:!0,id:B,form:"form-"+B,enableFormSubmit:!0,value:J,onKeyDown:h=>{let{key:w}=h;w=="Escape"&&T(!1)}}),p(d,{children:[". ",W]})]}),p(P,{gap:"2/3",horizontalAlign:"right",flexWrap:!1,children:[l(L.Sub,{padding:["2/3",1],onClick:()=>{T(!1)},children:"\u9589\u3058\u308B"}),l(L,{padding:["2/3",1],submitOption:{formName:"form-"+B,callback:h=>U(void 0,null,function*(){let{name:w}=h,I=[...a.dataValue],N=I[t],X=N.id;if(!N)return;let{target:M}=yield N.convert();if(!M)return;let $=yield String(M.result).toBlob(c.type);if(!$)return;let _=new File([$],w+"."+W,{type:N.type});_.id=X,I[t]=_,m(C=>u(s({},C),{dataValue:I,eventType:"update",eventID:b()})),T(!1)})},children:"\u6C7A\u5B9A"})]})]})}):p(ne,{children:[r,!!n.isNameEditable&&l(L.Clear,{ssSphere:2.5,flexSizing:"none",fontColor:"4.thin",padding:"1/3",ssEffectsOnActive:"expand",color:"cloud",onClick:()=>{T(!0)},children:l(R.Pen,{})})]})})}),!F&&p(d,{fontSize:"1.mini",fontColor:"4.thin",flexSizing:0,children:[o,"\u30D5\u30A1\u30A4\u30EB / ",K,"B"]})]}),l(L.Sub,{color:"cloud",fontColor:"4.thin",ssSphere:3,onClick:()=>{let h=[...a.dataValue];h[t]&&(h.splice(t,1),m(I=>u(s({},I),{dataValue:h,eventType:"update",eventID:b()})))},children:l(R.X,{})})]}))}},Se=e=>{let G=e,{tone:t,required:n,form:c,isNameEditable:a,useSystemOnly:m,accept:r="*",limit:g=1,checkValidationAtFirst:i,onChange:F,onValidate:T,onValidateDelay:B,onUpdateValue:K,onUpdateValidValue:J,onUserAction:W,value:o=[],className:h,cellStyles:w,cellClassName:I,componentId:N,status_id:X,enableFormSubmit:M,freeCSS:oe,wrapStyles:$}=G,_=Q(G,["tone","required","form","isNameEditable","useSystemOnly","accept","limit","checkValidationAtFirst","onChange","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","className","cellStyles","cellClassName","componentId","status_id","enableFormSubmit","freeCSS","wrapStyles"]),[C,A]=H(ae.DefaultStatus(e.componentId||"",o)),[Z,ie]=H({ok:!1,notice:[]}),se={rootStates:e,val_status:C,set_status:A};Y(()=>{ee.set({["AddFiles-"+C.componentId]:x=>{A(V=>{let v=V.dataValue,k=[];for(var y=0;y<(x==null?void 0:x.length);y++){let S=x[y],{type:E,name:z}=S;if(y+1+v.length>g){j.add({componentId:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u9078\u629E\u4E0A\u9650\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${z}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}if(r&&r=="image"&&!E.match(/image/)){j.add({componentId:z,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u5F62\u5F0F\u304C\u7570\u306A\u308B\u305F\u3081\u3001${z} \u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002`,backgroundColor:"nega"});continue}k.push(S)}return u(s({},V),{dataValue:[...v,...k],eventType:"update",eventID:b()})})}})},[]),ae.CommonEffects({type:"file",states:e,val_status:C,set_status:A,val_validate:Z,set_validate:ie,SystemValidation:ye});let O="";return r&&(r=="image"?O="image/png,image/jpeg":O=r),p(me,{val_status:C,set_status:A,val_validate:Z,states:e,children:[l(d,u(s({htmlTag:"input",type:"file",className:f("Input"),"data-component-id":C.componentId,accept:O,multiple:g!=1,onChange:x=>U(void 0,null,function*(){F&&F(x);let V=x.target,v=V.files,k=[];for(var y=0;y<(v==null?void 0:v.length);y++){let S=v[y],E=S.name;if(S.id=b(),y+1+C.dataValue.length>g){j.add({componentId:E,secondsToClose:12e3,children:`\u30D5\u30A1\u30A4\u30EB\u767B\u9332\u6570\u3092\u8D85\u3048\u305F\u305F\u3081\u3001${E}}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002`,backgroundColor:"nega"});continue}k.push(S)}A(S=>u(s({},S),{dataValue:[...S.dataValue,...k],eventType:"update",eventID:b()})),V.value=""})},_),{opacity:"low",tabIndex:-1,value:""})),l(le.List,s({},se))]})},q=e=>(e=u(s({limit:1,isNameEditable:!0,useSystemOnly:!1,tone:"border",value:[]},e),{override:"force",cellStyles:s(s({},de({tone:e.tone||"border"})),e.cellStyles)}),l(ce,{componentId:e.componentId,children:Se,states:e}));q.fn={openDialog:e=>{let{multiple:t,accept:n}=e;return new Promise(c=>{const a=document.createElement("input");a.type="file",a.multiple=t!=null?t:!0,n&&(n=="image"?a.accept="image/png,image/jpeg,image/webp":a.accept=n),a.onchange=m=>{c(m.target.files)},a.click()})}},typeof window!="undefined"&&window.document&&re(document).addEvent({eventType:"dragover",callback:e=>{e.preventDefault(),D("."+f("AddButton")).addClass(f("Draggable"))},options:{passive:!1}}).addEvent({eventType:"drop",callback:e=>{e.preventDefault(),D("."+f("AddButton")).removeClass(f("Draggable"));let t=e.dataTransfer.files;if(t.length){let n=e.target;if(D(n).hasClass(f("AddButton"))){let{componentId:c}=n.dataset,a=ee.get("AddFiles-"+c);a&&a(t)}}},options:{passive:!1}});export{q as Filer,q as default};
@@ -1 +1 @@
1
- import{b as o,c as u,d as w}from"../../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import S,{UUID as M}from"jmini";import{useState as ie}from"react";import{$$fromRoot as ne,GenerateHTMLProps as se}from"../../@utils";import{Box as I,Flex as re,FAI as ce,Span as de}from"../../atoms";import{Button as ue}from"../Button";import{OptionalInputWrapper as me,BoxWrapper as pe,CoreEffects as J}from"./core";import{InputListClasses as T}from"../../@styles/componentClasses";function Ce(t){let{value:l,states:i}=t,{type:e,required:s,min:n,max:p}=i;n=n||0,p=p||65535;let r=[],y=l.length;return s&&(y||e=="radio"&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),y<n&&r.push({type:"invalid",label:n+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),y>p&&r.push({type:"invalid",label:p+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!r.filter(({type:V})=>V=="invalid").length,notice:r}}const h={InitOptions:t=>{let l=[];return t.forEach(i=>{if(!i)return;let{label:e,value:s}=i;S.is.nullish(e)&&(e=String(s)),l.push(u(o({},i),{label:e,value:s}))}),l},OptionalListWrapper:t=>{let{value:l,options:i=[]}=t,e=S.is.exist(l)?S.flatArray(l):[],s=[];return e.forEach(n=>{i.findIndex(r=>S.is.equal(r.value,n))!=-1&&s.push(n)}),a(h.Core,u(o({},t),{value:s,options:i}))},Core:t=>{let k=t,{type:l,tone:i,required:e,componentId:s="",form:n,override:p,icon:r,iconType:y,iconSize:V,iconPosition:X,iconColor:v,CustomIcon:A,enableFormSubmit:$,checkValidationAtFirst:W,onValidate:H,onValidateDelay:N,onUpdateValue:U,onUpdateValidValue:K,value:_,options:b,className:q,cellStyles:j,cellClassName:G,cellCheckedStyles:Q,cellCheckedClassName:Y,min:Z,max:E,hideInput:m,freeCSS:O,wrapStyles:x}=k,ee=w(k,["type","tone","required","componentId","form","override","icon","iconType","iconSize","iconPosition","iconColor","CustomIcon","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","options","className","cellStyles","cellClassName","cellCheckedStyles","cellCheckedClassName","min","max","hideInput","freeCSS","wrapStyles"]),[C,L]=ie(J.DefaultStatus(s,_)),[D,z]=ie({ok:!1,notice:[]});return J.CommonEffects({type:"list."+l,states:t,val_status:C,set_status:L,val_validate:D,set_validate:z,SystemValidation:Ce}),a(pe,{val_status:C,set_status:L,val_validate:D,states:t,children:a(h.List,{rootStates:t,val_status:C,set_status:L})})},List:t=>{let{rootStates:l,val_status:i,set_status:e}=t,{componentId:s,type:n,tone:p,icon:r,iconSize:y,iconColor:V,isChecker:X,options:v,name:A,form:$,tabIndex:W,hideInput:H,disabled:N,className:U,cellStyles:K,cellClassName:_="",cellCheckedStyles:b,cellCheckedClassName:q="",enableFormSubmit:j}=l,{dataValue:G}=i,Q=l.CustomIcon,Y=v.map((Z,E)=>{let le=Z,{value:m,label:O,disabled:x,className:ee="",checkedStyles:C,checkedClassName:L="",freeCSS:D}=le,z=w(le,["value","label","disabled","className","checkedStyles","checkedClassName","freeCSS"]),k=M(),R=G.findIndex(c=>c===m)!=-1,f=o(o({},K),z),F=[T("Label"),_,ee];R&&(f=u(o(o(o({},f),b),C),{freeCSS:o(o(o({},f==null?void 0:f.freeCSS),b==null?void 0:b.freeCSS),C==null?void 0:C.freeCSS)}),F=[...F,q,L]);const te=()=>{if(N||x)return;let c=[];if(n=="radio")c=[m];else if(n=="checkbox"||X)if(!R)c=[...i.dataValue,m];else{let d=[...i.dataValue];d.splice(i.dataValue.findIndex(B=>B==m),1),c=d}e(d=>u(o({},d),{dataValue:c,eventType:"update",eventID:M()}))};let oe=[a(de,{position:"relative",freeCSS:{zIndex:2},flexSizing:0,children:S.is.string(O)?a(I,{children:O}):O},"content")];return r&&oe[l.iconPosition=="right"?"push":"unshift"](a(Q,{isChecked:R,iconSize:y,iconColor:V,toggle:te},"icon")),[a(I,{htmlTag:"input",type:n=="radio"?"radio":"checkbox",className:T("Input"),name:"RadioCheckbox-"+A,"data-list-index":s+"-"+E,id:k,value:String(m),disabled:N||x,checked:R,onFocus:c=>{x||n=="radio"&&(i.dataValue.length||e(d=>u(o({},d),{dataValue:[m],eventType:"update",eventID:M()})))},onChange:()=>{te()},onKeyDown:c=>{let{key:d,shiftKey:B}=c;if((n=="checkbox"||t.rootStates.isChecker)&&d!="Tab"){if(d.match(/Arrow/)){c.preventDefault();let ae=["ArrowLeft","ArrowUp"].includes(d)?-1:1,g=E+ae;g<0?g=v.length-1:g>=v.length&&(g=0),ne(`input[data-list-index="${s}-${g}"]`).focus()}}j&&J.SubmitForm(c,$)},tabIndex:W},"List-"+S.Stringify(m)),a(I,u(o({htmlTag:"label","data-disabled":N||x,htmlFor:k,className:F.join(" "),tabIndex:-1,display:"flex",verticalAlign:"center",flexWrap:!1},f),{children:oe}),"ListTrigger-"+S.Stringify(m))]});return a(re,{flexSizing:"auto",style:l.style,freeCSS:o({},l.freeCSS),className:[U,T("CellBase"),T("HideInput_"+H),T("IconIndicator_"+!!r),T("Tone_"+p)].join(" "),children:Y})},_Icon:t=>{let l=1.5;return t.iconSize=="small"?l=1.2:t.iconSize=="large"&&(l=2),a(ue.Normal,{ssPushable:!0,color:"cloud",tabIndex:-1,ssEffectsOnActive:"ripple.cloud",ssSphere:2,freeCSS:{transform:`scale(${l})`},onClick:i=>{i.preventDefault(),i.stopPropagation(),t.toggle()},children:t.children})},RadioIcon:t=>a(h._Icon,u(o({type:"radio"},t),{children:a(I,{flexCenter:!0,isRounded:!0,border:t.isChecked?"0.trans":"3.thick",borderColor:t.isChecked?t.iconColor:"3.thick",position:"relative",transition:"middle",freeCSS:{width:"50%",height:"50%"},children:a(I,{position:"absolute",transition:"middle",isRounded:!0,backgroundColor:t.iconColor,opacity:t.isChecked?"max":"trans",freeCSS:{width:"60%",height:"60%",transform:t.isChecked?"scale(1)":"scale(.4)"}})})})),CheckboxIcon:t=>a(h._Icon,u(o({type:"checkbox"},t),{children:a(I,{flexCenter:!0,boxShadow:t.isChecked?"0.remark":"none",border:t.isChecked?"0.trans":"3.thick",backgroundColor:t.isChecked?t.iconColor:"trans",position:"relative",transition:"middle",fontColor:"white",freeCSS:{borderRadius:"25%",padding:"4%",width:"50%",height:"50%"},children:a(ce.Check,{transition:"middle",opacity:t.isChecked?"max":"trans",freeCSS:{zIndex:8,width:"100%",height:"100%",transform:t.isChecked?"scale(1)":"scale(.5)"}})})}))},P=t=>{t=t||"checkbox";const l=e=>(e=u(o({gap:1,icon:!0,iconSize:"regular",iconType:t=="radio"?"radio":"checkbox",iconPosition:"left",iconColor:"theme"},e),{type:t,cellStyles:o({gap:"1/6",position:"relative",borderRadius:"2.tone.secondary",transition:"middle"},e.cellStyles)}),e.CustomIcon||(e.iconType=="radio"?e.CustomIcon=h.RadioIcon:e.iconType=="checkbox"&&(e.CustomIcon=h.CheckboxIcon)),e.iconSize=="small"?e.cellStyles.gap=0:e.iconSize=="large"&&(e.cellStyles.gap="1/2"),e.tone=="normal"?(e.cellStyles=o({padding:["1/4",1],border:"1.thin",backgroundColor:"layer.1"},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme",boxShadow:"1.normal"},e.cellCheckedStyles)):e.tone=="border"?(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.1",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme"},e.cellCheckedStyles)):e.tone=="cloud"&&(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.2",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({backgroundColor:"cloud",fontColor:"theme"},e.cellCheckedStyles)),e=se(e),e.options=h.InitOptions(e.options),a(me,{componentId:e.componentId,children:h.OptionalListWrapper,states:e})),i=l;return i.Normal=e=>a(l,o({type:t,tone:"normal",icon:!1},e)),i.Border=e=>a(l,o({type:t,tone:"border"},e)),i.Cloud=e=>a(l,o({type:t,tone:"cloud"},e)),i.Vivid=e=>a(l,o({type:t,tone:"normal",icon:!1,cellCheckedStyles:{backgroundColor:"theme",fontColor:"white"}},e)),i.Simple=e=>a(l,o({type:t,tone:"plain",icon:!1,cellCheckedStyles:{fontColor:"theme"}},e)),i},he=P("radio"),Se=P("checkbox"),ye=P();export{Se as Checkbox,ye as List,he as Radio};
1
+ import{b as o,c as u,d as B}from"../../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import S,{UUID as w}from"jmini";import{useState as ie}from"react";import{$$fromRoot as ne,GenerateHTMLProps as se}from"../../@utils";import{Box as T,Flex as re,FAI as ce,Span as de}from"../../atoms";import{Button as ue}from"../Button";import{OptionalInputWrapper as me,BoxWrapper as pe,CoreEffects as M}from"./core";import{InputListClasses as b}from"../../@styles/componentClasses";function Ce(t){let{value:l,states:i}=t,{type:e,required:s,min:n,max:p}=i;n=n||0,p=p||65535;let r=[],y=l.length;return s&&(y||e=="radio"&&r.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"})),y<n&&r.push({type:"invalid",label:n+"\u500B\u4EE5\u4E0A\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044"}),y>p&&r.push({type:"invalid",label:p+"\u500B\u307E\u3067\u9078\u629E\u3067\u304D\u307E\u3059"}),{ok:!r.filter(({type:V})=>V=="invalid").length,notice:r}}const C={InitOptions:t=>{let l=[];return t.forEach(i=>{if(!i)return;let{label:e,value:s}=i;S.is.nullish(e)&&(e=String(s)),l.push(u(o({},i),{label:e,value:s}))}),l},OptionalListWrapper:t=>{let{value:l,options:i=[]}=t,e=S.is.exist(l)?S.flatArray(l):[],s=[];return e.forEach(n=>{i.findIndex(r=>S.is.equal(r.value,n))!=-1&&s.push(n)}),a(C.Core,u(o({},t),{value:s,options:i}))},Core:t=>{let h=t,{type:l,tone:i,required:e,componentId:s="",form:n,override:p,icon:r,iconType:y,iconSize:V,iconPosition:P,iconColor:v,CustomIcon:X,enableFormSubmit:A,checkValidationAtFirst:$,onValidate:U,onValidateDelay:N,onUpdateValue:W,onUpdateValidValue:H,onUserAction:K,value:f,options:q,className:j,cellStyles:G,cellClassName:Q,cellCheckedStyles:Y,cellCheckedClassName:Z,min:D,max:m,hideInput:O,freeCSS:x,wrapStyles:ee}=h,L=B(h,["type","tone","required","componentId","form","override","icon","iconType","iconSize","iconPosition","iconColor","CustomIcon","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","className","cellStyles","cellClassName","cellCheckedStyles","cellCheckedClassName","min","max","hideInput","freeCSS","wrapStyles"]),[k,R]=ie(M.DefaultStatus(s,f)),[_,E]=ie({ok:!1,notice:[]});return M.CommonEffects({type:"list."+l,states:t,val_status:k,set_status:R,val_validate:_,set_validate:E,SystemValidation:Ce}),a(pe,{val_status:k,set_status:R,val_validate:_,states:t,children:a(C.List,{rootStates:t,val_status:k,set_status:R})})},List:t=>{let{rootStates:l,val_status:i,set_status:e}=t,{componentId:s,type:n,tone:p,icon:r,iconSize:y,iconColor:V,isChecker:P,options:v,name:X,form:A,tabIndex:$,hideInput:U,disabled:N,className:W,cellStyles:H,cellClassName:K="",cellCheckedStyles:f,cellCheckedClassName:q="",enableFormSubmit:j}=l,{dataValue:G}=i,Q=l.CustomIcon,Y=v.map((Z,D)=>{let le=Z,{value:m,label:O,disabled:x,className:ee="",checkedStyles:L,checkedClassName:k="",freeCSS:R}=le,_=B(le,["value","label","disabled","className","checkedStyles","checkedClassName","freeCSS"]),E=w(),h=G.findIndex(c=>c===m)!=-1,I=o(o({},H),_),z=[b("Label"),K,ee];h&&(I=u(o(o(o({},I),f),L),{freeCSS:o(o(o({},I==null?void 0:I.freeCSS),f==null?void 0:f.freeCSS),L==null?void 0:L.freeCSS)}),z=[...z,q,k]);const te=()=>{if(N||x)return;let c=[];if(n=="radio")c=[m];else if(n=="checkbox"||P)if(!h)c=[...i.dataValue,m];else{let d=[...i.dataValue];d.splice(i.dataValue.findIndex(F=>F==m),1),c=d}e(d=>u(o({},d),{dataValue:c,eventType:"update",eventID:w()}))};let oe=[a(de,{position:"relative",freeCSS:{zIndex:2},flexSizing:0,children:S.is.string(O)?a(T,{children:O}):O},"content")];return r&&oe[l.iconPosition=="right"?"push":"unshift"](a(Q,{isChecked:h,iconSize:y,iconColor:V,toggle:te},"icon")),[a(T,{htmlTag:"input",type:n=="radio"?"radio":"checkbox",className:b("Input"),name:"RadioCheckbox-"+X,"data-list-index":s+"-"+D,id:E,value:String(m),disabled:N||x,checked:h,onFocus:c=>{x||n=="radio"&&(i.dataValue.length||e(d=>u(o({},d),{dataValue:[m],eventType:"update",eventID:w()})))},onChange:()=>{te()},onKeyDown:c=>{let{key:d,shiftKey:F}=c;if((n=="checkbox"||t.rootStates.isChecker)&&d!="Tab"){if(d.match(/Arrow/)){c.preventDefault();let ae=["ArrowLeft","ArrowUp"].includes(d)?-1:1,g=D+ae;g<0?g=v.length-1:g>=v.length&&(g=0),ne(`input[data-list-index="${s}-${g}"]`).focus()}}j&&M.SubmitForm(c,A)},tabIndex:$},"List-"+S.Stringify(m)),a(T,u(o({htmlTag:"label","data-disabled":N||x,htmlFor:E,className:z.join(" "),tabIndex:-1,display:"flex",verticalAlign:"center",flexWrap:!1},I),{children:oe}),"ListTrigger-"+S.Stringify(m))]});return a(re,{flexSizing:"auto",style:l.style,freeCSS:o({},l.freeCSS),className:[W,b("CellBase"),b("HideInput_"+U),b("IconIndicator_"+!!r),b("Tone_"+p)].join(" "),children:Y})},_Icon:t=>{let l=1.5;return t.iconSize=="small"?l=1.2:t.iconSize=="large"&&(l=2),a(ue.Normal,{ssPushable:!0,color:"cloud",tabIndex:-1,ssEffectsOnActive:"ripple.cloud",ssSphere:2,freeCSS:{transform:`scale(${l})`},onClick:i=>{i.preventDefault(),i.stopPropagation(),t.toggle()},children:t.children})},RadioIcon:t=>a(C._Icon,u(o({type:"radio"},t),{children:a(T,{flexCenter:!0,isRounded:!0,border:t.isChecked?"0.trans":"3.thick",borderColor:t.isChecked?t.iconColor:"3.thick",position:"relative",transition:"middle",freeCSS:{width:"50%",height:"50%"},children:a(T,{position:"absolute",transition:"middle",isRounded:!0,backgroundColor:t.iconColor,opacity:t.isChecked?"max":"trans",freeCSS:{width:"60%",height:"60%",transform:t.isChecked?"scale(1)":"scale(.4)"}})})})),CheckboxIcon:t=>a(C._Icon,u(o({type:"checkbox"},t),{children:a(T,{flexCenter:!0,boxShadow:t.isChecked?"0.remark":"none",border:t.isChecked?"0.trans":"3.thick",backgroundColor:t.isChecked?t.iconColor:"trans",position:"relative",transition:"middle",fontColor:"white",freeCSS:{borderRadius:"25%",padding:"4%",width:"50%",height:"50%"},children:a(ce.Check,{transition:"middle",opacity:t.isChecked?"max":"trans",freeCSS:{zIndex:8,width:"100%",height:"100%",transform:t.isChecked?"scale(1)":"scale(.5)"}})})}))},J=t=>{t=t||"checkbox";const l=e=>(e=u(o({gap:1,icon:!0,iconSize:"regular",iconType:t=="radio"?"radio":"checkbox",iconPosition:"left",iconColor:"theme"},e),{type:t,cellStyles:o({gap:"1/6",position:"relative",borderRadius:"2.tone.secondary",transition:"middle"},e.cellStyles)}),e.CustomIcon||(e.iconType=="radio"?e.CustomIcon=C.RadioIcon:e.iconType=="checkbox"&&(e.CustomIcon=C.CheckboxIcon)),e.iconSize=="small"?e.cellStyles.gap=0:e.iconSize=="large"&&(e.cellStyles.gap="1/2"),e.tone=="normal"?(e.cellStyles=o({padding:["1/4",1],border:"1.thin",backgroundColor:"layer.1"},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme",boxShadow:"1.normal"},e.cellCheckedStyles)):e.tone=="border"?(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.1",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({borderColor:"theme",fontColor:"theme"},e.cellCheckedStyles)):e.tone=="cloud"&&(e.cellStyles=o({border:"1.thin",backgroundColor:"layer.2",padding:["1/2",1,"1/2","1/2"]},e.cellStyles),e.cellCheckedStyles=o({backgroundColor:"cloud",fontColor:"theme"},e.cellCheckedStyles)),e=se(e),e.options=C.InitOptions(e.options),a(me,{componentId:e.componentId,children:C.OptionalListWrapper,states:e})),i=l;return i.Normal=e=>a(l,o({type:t,tone:"normal",icon:!1},e)),i.Border=e=>a(l,o({type:t,tone:"border"},e)),i.Cloud=e=>a(l,o({type:t,tone:"cloud"},e)),i.Vivid=e=>a(l,o({type:t,tone:"normal",icon:!1,cellCheckedStyles:{backgroundColor:"theme",fontColor:"white"}},e)),i.Simple=e=>a(l,o({type:t,tone:"plain",icon:!1,cellCheckedStyles:{fontColor:"theme"}},e)),i},he=J("radio"),Se=J("checkbox"),ye=J();export{Se as Checkbox,ye as List,he as Radio};
@@ -1 +1 @@
1
- import{b as e,c as n,d as C}from"../../chunk-C5N2D3ZX.js";import{jsx as r}from"react/jsx-runtime";import{UUID as x}from"jmini";import{useState as a}from"react";import{Radio as w}from"./List";import{InputSegmentedClasses as u}from"../../@styles/componentClasses";const E=t=>{let i=t,{__sys_segmented_type:o,tone:B,value:d,options:S,onUpdateValue:h,onUpdateValidValue:p,enableFormSubmit:M,checkValidationAtFirst:R,cellStyles:g,cellClassName:_,cellCheckedClassName:b,cellCheckedStyles:f,freeCSS:k,wrapStyles:J}=i,I=C(i,["__sys_segmented_type","tone","value","options","onUpdateValue","onUpdateValidValue","enableFormSubmit","checkValidationAtFirst","cellStyles","cellClassName","cellCheckedClassName","cellCheckedStyles","freeCSS","wrapStyles"]),[T]=a(x()),[c,V]=a(d),[v,m]=a(c);return c!=d&&(V(d),m(d)),r(w,n(e({options:S,value:v,componentId:T,icon:!1,flexWrap:!1,borderRadius:"2.tone.secondary",position:"relative"},I),{freeCSS:e({whiteSpace:"nowrap"},k),cellStyles:e({flexCenter:!0,ssEffectsOnActive:"push"},g),cellCheckedStyles:e({},f),cellClassName:[_,u("Label"),u("Tone_"+o.replace(/\./ig,""))].join(" "),cellCheckedClassName:[b,u("Checked")].join(" "),tone:"custom",onUpdateValue:h,onUpdateValidValue:(...y)=>{p&&p(...y),o=="bottomline"&&m(y[0])}}))},s=t=>{let{__sys_segmented_type:o}=t;return o=o||"plain",o=="plain"&&(t=n(e({padding:"1/3",gap:"1/3",ssCardBox:!0},t),{cellStyles:e({padding:["1/2","3/4"],borderRadius:"inherit",position:"relative"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme",boxShadow:"1.normal",fontColor:"white"},t.cellCheckedStyles)})),r(E,e({__sys_segmented_type:"plain"},t))},l=s;l.Cloud=t=>{let o=n(e({__sys_segmented_type:"cloud",padding:"1/3",gap:"1/3",backgroundColor:"cloud"},t),{cellStyles:e({padding:"3/4",borderRadius:"inherit",position:"relative"},t.cellStyles),cellCheckedStyles:e({boxShadow:"1.normal",backgroundColor:"theme",fontColor:"white"},t.cellCheckedStyles)});return r(s,e({},o))},l.CloudTheme=t=>{let o=e({backgroundColor:"theme.opa.few",fontColor:"theme",__sys_segmented_type:"cloud.theme"},t);return r(l.Cloud,e({},o))},l.CloudMono=t=>{let o=n(e({fontColor:"3.blur",__sys_segmented_type:"cloud.mono"},t),{cellCheckedStyles:e({backgroundColor:"layer.1",fontColor:"1.clear"},t.cellCheckedStyles)});return r(l.Cloud,e({},o))},l.Border=t=>{let o=n(e({backgroundColor:"layer.1",border:"2.normal",overflow:"hidden",gap:0,fontColor:"3.blur",ssLastChildLossBorder:"right",boxShadow:"0.min",__sys_segmented_type:"border"},t),{cellStyles:e({padding:["3/4",1],borderRadius:0,borderRight:"2.normal"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme.opa.few",fontColor:"theme"},t.cellCheckedStyles)});return r(s,e({},o))},l.BorderVivid=t=>{let o=n(e({border:!0,borderColor:"theme",__sys_segmented_type:"border.vivid"},t),{cellStyles:e({borderRight:!0,borderColor:"theme"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme",fontColor:"white"},t.cellCheckedStyles)});return r(l.Border,e({},o))},l.Bottomline=t=>{let o=n(e({__sys_segmented_type:"bottomline",gap:0,fontColor:"3.blur"},t),{cellStyles:e({ssEffectsOnActive:"ripple.theme",borderRadius:0,padding:1},t.cellStyles),cellCheckedStyles:e({fontColor:"theme"},t.cellCheckedStyles)});return r(s,e({},o))};export{l as Segmented,l as default};
1
+ import{b as e,c as n,d as C}from"../../chunk-C5N2D3ZX.js";import{jsx as r}from"react/jsx-runtime";import{UUID as w}from"jmini";import{useState as a}from"react";import{Radio as E}from"./List";import{InputSegmentedClasses as u}from"../../@styles/componentClasses";const B=t=>{let m=t,{__sys_segmented_type:o,tone:M,value:d,options:S,onUpdateValue:h,onUpdateValidValue:c,onUserAction:g,enableFormSubmit:R,checkValidationAtFirst:U,cellStyles:_,cellClassName:b,cellCheckedClassName:f,cellCheckedStyles:k,freeCSS:I,wrapStyles:J}=m,T=C(m,["__sys_segmented_type","tone","value","options","onUpdateValue","onUpdateValidValue","onUserAction","enableFormSubmit","checkValidationAtFirst","cellStyles","cellClassName","cellCheckedClassName","cellCheckedStyles","freeCSS","wrapStyles"]),[V]=a(w()),[p,v]=a(d),[x,i]=a(p);return p!=d&&(v(d),i(d)),r(E,n(e({options:S,value:x,componentId:V,icon:!1,flexWrap:!1,borderRadius:"2.tone.secondary",position:"relative"},T),{freeCSS:e({whiteSpace:"nowrap"},I),cellStyles:e({flexCenter:!0,ssEffectsOnActive:"push"},_),cellCheckedStyles:e({},k),cellClassName:[b,u("Label"),u("Tone_"+o.replace(/\./ig,""))].join(" "),cellCheckedClassName:[f,u("Checked")].join(" "),tone:"custom",onUpdateValue:h,onUpdateValidValue:(...y)=>{c&&c(...y),o=="bottomline"&&i(y[0])},onUserAction:g}))},s=t=>{let{__sys_segmented_type:o}=t;return o=o||"plain",o=="plain"&&(t=n(e({padding:"1/3",gap:"1/3",ssCardBox:!0},t),{cellStyles:e({padding:["1/2","3/4"],borderRadius:"inherit",position:"relative"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme",boxShadow:"1.normal",fontColor:"white"},t.cellCheckedStyles)})),r(B,e({__sys_segmented_type:"plain"},t))},l=s;l.Cloud=t=>{let o=n(e({__sys_segmented_type:"cloud",padding:"1/3",gap:"1/3",backgroundColor:"cloud"},t),{cellStyles:e({padding:"3/4",borderRadius:"inherit",position:"relative"},t.cellStyles),cellCheckedStyles:e({boxShadow:"1.normal",backgroundColor:"theme",fontColor:"white"},t.cellCheckedStyles)});return r(s,e({},o))},l.CloudTheme=t=>{let o=e({backgroundColor:"theme.opa.few",fontColor:"theme",__sys_segmented_type:"cloud.theme"},t);return r(l.Cloud,e({},o))},l.CloudMono=t=>{let o=n(e({fontColor:"3.blur",__sys_segmented_type:"cloud.mono"},t),{cellCheckedStyles:e({backgroundColor:"layer.1",fontColor:"1.clear"},t.cellCheckedStyles)});return r(l.Cloud,e({},o))},l.Border=t=>{let o=n(e({backgroundColor:"layer.1",border:"2.normal",overflow:"hidden",gap:0,fontColor:"3.blur",ssLastChildLossBorder:"right",boxShadow:"0.min",__sys_segmented_type:"border"},t),{cellStyles:e({padding:["3/4",1],borderRadius:0,borderRight:"2.normal"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme.opa.few",fontColor:"theme"},t.cellCheckedStyles)});return r(s,e({},o))},l.BorderVivid=t=>{let o=n(e({border:!0,borderColor:"theme",__sys_segmented_type:"border.vivid"},t),{cellStyles:e({borderRight:!0,borderColor:"theme"},t.cellStyles),cellCheckedStyles:e({backgroundColor:"theme",fontColor:"white"},t.cellCheckedStyles)});return r(l.Border,e({},o))},l.Bottomline=t=>{let o=n(e({__sys_segmented_type:"bottomline",gap:0,fontColor:"3.blur"},t),{cellStyles:e({ssEffectsOnActive:"ripple.theme",borderRadius:0,padding:1},t.cellStyles),cellCheckedStyles:e({fontColor:"theme"},t.cellCheckedStyles)});return r(s,e({},o))};export{l as Segmented,l as default};
@@ -1 +1 @@
1
- import{b as n,c as f,d as H}from"../../chunk-C5N2D3ZX.js";import{Fragment as J,jsx as a,jsxs as V}from"react/jsx-runtime";import u,{UUID as R}from"jmini";import{useState as A,useEffect as $}from"react";import{ExtractStyles as _e}from"../../@utils";import{Box as C,Span as Ve,FAI as le,Column as Oe}from"../../atoms";import{Literal as W,Row as j}from"../../mols";import{Button as Te}from"../Button";import{Sheet as xe}from"../Sheet";import{OptionalInputWrapper as Fe,BoxWrapper as we,CoreEffects as k,DefaultBoxishStyles as De}from"./core";import{InputAutocompleteClasses as B}from"../../@styles/componentClasses";import{InputLabel as Re}from"./Label";import{RightIcon as ke}from".";function Ae(e){let{value:t,states:l}=e,{required:o,options:i}=l,m=[];return o&&t===null&&m.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!m.filter(({type:p})=>p=="invalid").length,notice:m}}const ae={FilterSelectableOptions:(e,t)=>{let l=e.rootStates.options;return t||(l=l.filter(o=>(o==null?void 0:o.type)!="label")),l}},_={Shallow:e=>{let{rootStates:t,val_status:l}=e,o=_e(t);return a(C,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(W.Description,f(n({className:t.className},o),{position:"absolute",width:1,freeCSS:f(n({},o.freeCSS),{color:"orange"}),children:a(C,{"data-input-value-shallow":l.componentId,children:"A"})}))})},Button:e=>V(J,{children:[a(_.LegacySelector,n({},e)),a(_.Original,n({},e))]}),Placeholder:e=>!e.rootStates.placeholder||e.val_status.dataValue!==null?null:a(C,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:e.rootStates.placeholder||""}),Original:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:o,val_optionFocused:i,set_optionFocused:m,val_validate:p,set_validate:b,val_status:d,set_status:I,val_selectorOpen:v,set_selectorOpen:S}=e,U=t,{tone:E,required:L,form:x,className:O,label:ne,isLabelActive:re,placeholder:se,enableFormSubmit:P,emptySelect:X,checkValidationAtFirst:M,onValidate:ie,onValidateDelay:ce,onUpdateValue:ue,onUpdateValidValue:de,value:N="",options:K,leftIndicator:pe,rightIndicator:G,leftIcon:Se,rightIcon:fe,componentId:me,status_id:ye,wrapStyles:ve,SelectedCellStyles:ge,SelectorCellStyles:be,SelectorMode:Ie,SelectorStyles:he,SelectorPosition:Ce}=U,r=H(U,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return $(()=>{if(e.rootStates.SelectorMode!="original"||t.disabled)return;let c="select-click-"+t.componentId;if(v){if(!u('[data-input-origin="'+t.componentId+'"]'))return;u(document).addEvent({eventID:c,eventType:"click",callback:s=>{let F=u(s.target),w=!!u(F).parent("."+B("Core")).length;u(F).parent("."+B("Selector")).length||w||S(!1)}})}else u(document).removeEvent([c])},[v]),$(()=>{if(e.rootStates.SelectorMode!="original"||d.eventType=="init"||!v)return;let c=u('[data-input-origin="'+t.componentId+'"]');c&&c.focus()},[d.dataValue]),e.rootStates.SelectorMode!="original"?null:V(J,{children:[a(C,f(n({tabIndex:0},r),{"data-disabled":t.disabled,"data-show-validation":k.isShowValidation(p,d,!!M),"data-component-id":d.componentId,"data-input-origin":d.componentId,className:[O,B("Core")].join(" "),onFocus:c=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(c)),!t.disabled){if(l)return o(!1);S(!0)}},onClick:c=>{r!=null&&r.onClick&&(r==null||r.onClick(c)),!t.disabled&&S(!0)},onKeyDown:c=>{let{key:g,metaKey:s,ctrlKey:F}=c,w=s||F;if(r!=null&&r.onKeyDown&&(r==null||r.onKeyDown(c)),P&&k.SubmitForm(c,x),!t.disabled){if(u.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(g))return;if(c.preventDefault(),!v)return S(!0);let h=g=="ArrowDown"?1:-1,y=ae.FilterSelectableOptions(e),q=y.length-1,T=null;u.scope(()=>{var Q,Y,Z,ee,te;let D=y.findIndex(z=>(z==null?void 0:z.id)==i);if(h==1){if(T=(Q=y[0])==null?void 0:Q.id,w){T=y[q].id;return}if(D==-1||D==q)return;T=(Y=y[D+1])==null?void 0:Y.id}else{if(T=(Z=y[q])==null?void 0:Z.id,w){T=(ee=y[0])==null?void 0:ee.id;return}if(D==-1||D==0)return;T=(te=y[D-1])==null?void 0:te.id}}),m(T)}),g=="Escape")S(!1);else if(g=="Tab")S(!1);else if(g=="Backspace")I(h=>f(n({},h),{dataValue:null,eventType:"update",eventID:R()}));else if(g==" ")c.preventDefault(),S(!0);else if(g=="Enter"){if(!v)return S(!0);c.preventDefault();let h=t.options.find(y=>(y==null?void 0:y.id)==i);if(!h)return;I(y=>f(n({},y),{dataValue:h==null?void 0:h.value,eventType:"update",eventID:R()})),S(!1)}}},children:V(j.Left,{gap:0,children:[a(Ve,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),V(j.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(_.Placeholder,n({},e)),a(_.Selected,n({},e))]})]})})),v&&a(_.Selector,n({},e))]})},LegacySelector:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:o,val_optionFocused:i,set_optionFocused:m,val_validate:p,set_validate:b,val_status:d,set_status:I,val_selectorOpen:v,set_selectorOpen:S}=e,g=t,{tone:E,required:L,form:x,className:O,label:ne,isLabelActive:re,placeholder:se,enableFormSubmit:P,emptySelect:X,checkValidationAtFirst:M,onValidate:ie,onValidateDelay:ce,onUpdateValue:ue,onUpdateValidValue:de,onKeyDown:N,onChange:K,value:pe="",options:G,leftIndicator:Se,rightIndicator:fe,leftIcon:me,rightIcon:ye,componentId:ve,status_id:ge,wrapStyles:be,SelectedCellStyles:Ie,SelectorCellStyles:he,SelectorMode:Ce,SelectorStyles:r,SelectorPosition:U}=g,c=H(g,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onKeyDown","onChange","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return e.rootStates.SelectorMode!="legacy"?null:V(C,f(n({htmlTag:"select",tabIndex:0},c),{"data-disabled":t.disabled,"data-show-validation":k.isShowValidation(p,d,!!M),"data-component-id":d.componentId,"data-input-origin":d.componentId,className:[O,B("Core")].join(" "),onKeyDown:s=>{N&&N(s),P&&k.SubmitForm(s,x)},onChange:s=>{let{value:F}=s.target;p.ok&&b({ok:!1,notice:[]}),I(w=>f(n({},w),{dataValue:F,eventType:"update",eventID:R()})),K&&K(s)},children:[!!X&&a("option",{value:"null",children:"\u9078\u629E"}),G.map(s=>u.is.nullish(s==null?void 0:s.value)?null:a("option",{value:s==null?void 0:s.value,children:s.label},String(s==null?void 0:s.value)))]}))},Selector:e=>{var o;$(()=>{let i=u(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!i)return;let m=u(`[data-select-input-value="${e.val_optionFocused}"]`)[0];m&&(i.scrollTop=m.offsetTop-24)},[e.val_optionFocused]);let t=ae.FilterSelectableOptions(e,!0),l={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:l.bottom="100%",l.left=0,l.paddingBottom="1/3";break;case 2:l.bottom="100%",l.right=0,l.paddingBottom="1/3";break;case 3:l.top="100%",l.left=0,l.paddingTop="1/3";break;case 4:l.top="100%",l.right=0,l.paddingTop="1/3";break;default:break}return a(C,f(n({},l),{children:a(xe.Body,f(n({className:B("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto","data-selector-id":e.val_status.componentId},e.rootStates.SelectorStyles),{freeCSS:n({minWidth:12*6,maxHeight:12*24},(o=e.rootStates.SelectorStyles)==null?void 0:o.freeCSS),children:V(Oe,{gap:"1/12",padding:[1,0],children:[t.map((i,m)=>{if(!i)return null;let{type:p,value:b}=i,d=e.val_optionFocused==i.id,I=e.val_status.dataValue===b;return p=="label"?a(C,{children:i.label},R()):a(Te.Sub.S,f(n({"data-select-input-value":i.id,color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1],isActive:I||d,isActiveStyles:d?{backgroundColor:"cloud"}:{backgroundColor:"theme.opa.few",fontColor:"theme"}},e.rootStates.SelectorCellStyles),{onClick:v=>{e.set_status(S=>f(n({},S),{dataValue:b,eventType:"update",eventID:R()})),e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0)},children:V(j.Left,{gap:"1/2",children:[I&&a(le.Check,{fontColor:"theme"}),a(W.Supplement,{transition:"short",flexSizing:0,children:i.label})]})}),i.id)}),!t.length&&a(W.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]})}))}))},Selected:e=>{let t=[];return e.val_status.dataValue!==null&&u.scope(()=>{let l=e.rootStates.options.find(o=>u.is.equal(o==null?void 0:o.value,e.val_status.dataValue));l&&t.push(a(C,f(n({},e.rootStates.SelectedCellStyles),{children:l.label}),String(l==null?void 0:l.value)))}),a(J,{children:t})},Core:e=>{var L,x;let{value:t}=e,[l,o]=A(k.DefaultStatus(e.componentId,t)),[i,m]=A(!1),[p,b]=A(!1),[d,I]=A(((L=e.options.find(O=>(O==null?void 0:O.value)===e.value))==null?void 0:L.id)||((x=e.options[0])==null?void 0:x.id)||""),[v,S]=A({ok:!1,notice:[]}),E={rootStates:e,val_preventOpenSelectorOnFocus:i,set_preventOpenSelectorOnFocus:m,val_optionFocused:d,set_optionFocused:I,val_selectorOpen:p,set_selectorOpen:b,val_status:l,set_status:o,val_validate:v,set_validate:S};return k.CommonEffects({type:"select",states:e,val_status:l,set_status:o,val_validate:v,set_validate:S,SystemValidation:Ae}),V(we,{val_status:l,set_status:o,val_validate:v,states:e,children:[a(Re,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||l.dataValue!==null}),a(_.Shallow,n({},E)),a(_.Button,n({},E))]})}},oe=e=>{var l;let t=n({},e);return t=f(n({emptySelect:!0,SelectorMode:"original",SelectorPosition:3},t),{freeCSS:n({cursor:"pointer"},t.freeCSS)}),t.emptySelect&&(t.options=[{value:null,label:a(W.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...t.options]),t.value=(l=t.value)!=null?l:null,t.options.forEach((o,i)=>{if(!o)return;let{type:m,value:p,searchValue:b}=o,d=b||u.is.string(p)&&p||u.Stringify(p||"")||"";t.options[i]=f(n({id:R()},o),{value:p,searchValue:d,type:m||"selector"})}),u.is.nullish(t.rightIcon)&&(t.rightIcon=a(ke,{ssSphere:2,children:a(le.AngleDown,{})})),a(Fe,{componentId:t.componentId,children:_.Core,states:De(t)})};export{oe as Select,oe as default};
1
+ import{b as o,c as u,d as H}from"../../chunk-C5N2D3ZX.js";import{Fragment as J,jsx as a,jsxs as T}from"react/jsx-runtime";import d,{UUID as C}from"jmini";import{useState as A,useEffect as $}from"react";import{ExtractStyles as Ve}from"../../@utils";import{Box as _,Span as Te,FAI as le,Column as Oe}from"../../atoms";import{Literal as W,Row as j}from"../../mols";import{Button as Fe}from"../Button";import{Sheet as xe}from"../Sheet";import{OptionalInputWrapper as De,BoxWrapper as we,CoreEffects as k,DefaultBoxishStyles as Re}from"./core";import{InputAutocompleteClasses as B}from"../../@styles/componentClasses";import{InputLabel as ke}from"./Label";import{RightIcon as Ae}from".";function Be(e){let{value:t,states:l}=e,{required:n,options:c}=l,y=[];return n&&t===null&&y.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!y.filter(({type:S})=>S=="invalid").length,notice:y}}const ae={FilterSelectableOptions:(e,t)=>{let l=e.rootStates.options;return t||(l=l.filter(n=>(n==null?void 0:n.type)!="label")),l}},V={Shallow:e=>{let{rootStates:t,val_status:l}=e,n=Ve(t);return a(_,{position:"absolute",top:0,left:0,right:0,height:0,overflow:"hidden",opacity:"trans",freeCSS:{zIndex:3,pointerEvents:"none"},children:a(W.Description,u(o({className:t.className},n),{position:"absolute",width:1,freeCSS:u(o({},n.freeCSS),{color:"orange"}),children:a(_,{"data-input-value-shallow":l.componentId,children:"A"})}))})},Button:e=>T(J,{children:[a(V.LegacySelector,o({},e)),a(V.Original,o({},e))]}),Placeholder:e=>!e.rootStates.placeholder||e.val_status.dataValue!==null?null:a(_,{position:"absolute",opacity:"middle",fontColor:"3.blur",children:e.rootStates.placeholder||""}),Original:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:n,val_optionFocused:c,set_optionFocused:y,val_validate:S,set_validate:I,val_status:p,set_status:b,val_selectorOpen:g,set_selectorOpen:f}=e,U=t,{tone:E,required:L,form:x,className:O,label:ne,isLabelActive:re,placeholder:se,enableFormSubmit:P,emptySelect:X,checkValidationAtFirst:M,onValidate:ie,onValidateDelay:ce,onUpdateValue:ue,onUpdateValidValue:de,onUserAction:pe,value:N="",options:K,leftIndicator:Se,rightIndicator:G,leftIcon:fe,rightIcon:me,componentId:ye,status_id:ve,wrapStyles:ge,SelectedCellStyles:be,SelectorCellStyles:Ie,SelectorMode:he,SelectorStyles:Ce,SelectorPosition:_e}=U,r=H(U,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return $(()=>{if(e.rootStates.SelectorMode!="original"||t.disabled)return;let s="select-click-"+t.componentId;if(g){if(!d('[data-input-origin="'+t.componentId+'"]'))return;d(document).addEvent({eventID:s,eventType:"click",callback:i=>{let D=d(i.target),w=!!d(D).parent("."+B("Core")).length;d(D).parent("."+B("Selector")).length||w||f(!1)}})}else d(document).removeEvent([s])},[g]),$(()=>{if(e.rootStates.SelectorMode!="original"||p.eventType=="init"||!g)return;let s=d('[data-input-origin="'+t.componentId+'"]');s&&s.focus()},[p.dataValue]),e.rootStates.SelectorMode!="original"?null:T(J,{children:[a(_,u(o({tabIndex:0},r),{"data-disabled":t.disabled,"data-show-validation":k.isShowValidation(S,p,!!M),"data-component-id":p.componentId,"data-input-origin":p.componentId,className:[O,B("Core")].join(" "),onFocus:s=>{if(r!=null&&r.onFocus&&(r==null||r.onFocus(s)),b(m=>u(o({},m),{eventID:C(),eventType:"focus.start",isFocusing:!0})),!t.disabled){if(l)return n(!1);f(!0)}},onBlur:s=>{r!=null&&r.onBlur&&(r==null||r.onBlur(s)),b(m=>u(o({},m),{eventID:C(),eventType:"focus.end",isFocusing:!1}))},onClick:s=>{r!=null&&r.onClick&&(r==null||r.onClick(s)),!t.disabled&&f(!0)},onKeyDown:s=>{let{key:m,metaKey:i,ctrlKey:D}=s,w=i||D;if(r!=null&&r.onKeyDown&&(r==null||r.onKeyDown(s)),P&&k.SubmitForm(s,x),!t.disabled){if(d.scope(()=>{if(!["ArrowDown","ArrowUp"].includes(m))return;if(s.preventDefault(),!g)return f(!0);let h=m=="ArrowDown"?1:-1,v=ae.FilterSelectableOptions(e),q=v.length-1,F=null;d.scope(()=>{var Q,Y,Z,ee,te;let R=v.findIndex(z=>(z==null?void 0:z.id)==c);if(h==1){if(F=(Q=v[0])==null?void 0:Q.id,w){F=v[q].id;return}if(R==-1||R==q)return;F=(Y=v[R+1])==null?void 0:Y.id}else{if(F=(Z=v[q])==null?void 0:Z.id,w){F=(ee=v[0])==null?void 0:ee.id;return}if(R==-1||R==0)return;F=(te=v[R-1])==null?void 0:te.id}}),y(F)}),m=="Escape")f(!1);else if(m=="Tab")f(!1);else if(m=="Backspace")b(h=>u(o({},h),{dataValue:null,eventType:"update",eventID:C()}));else if(m==" ")s.preventDefault(),f(!0);else if(m=="Enter"){if(!g)return f(!0);s.preventDefault();let h=t.options.find(v=>(v==null?void 0:v.id)==c);if(!h)return;b(v=>u(o({},v),{dataValue:h==null?void 0:h.value,eventType:"update",eventID:C()})),f(!1)}}},children:T(j.Left,{gap:0,children:[a(Te,{width:0,overflow:"hidden",opacity:"trans",children:"A"}),T(j.Left,{flexWrap:!0,gap:"1/3",freeCSS:{letterSpacing:".5px"},children:[a(V.Placeholder,o({},e)),a(V.Selected,o({},e))]})]})})),g&&a(V.Selector,o({},e))]})},LegacySelector:e=>{let{rootStates:t,val_preventOpenSelectorOnFocus:l,set_preventOpenSelectorOnFocus:n,val_optionFocused:c,set_optionFocused:y,val_validate:S,set_validate:I,val_status:p,set_status:b,val_selectorOpen:g,set_selectorOpen:f}=e,m=t,{tone:E,required:L,form:x,className:O,label:ne,isLabelActive:re,placeholder:se,enableFormSubmit:P,emptySelect:X,checkValidationAtFirst:M,onValidate:ie,onValidateDelay:ce,onUpdateValue:ue,onUpdateValidValue:de,onUserAction:pe,onKeyDown:N,onChange:K,value:Se="",options:G,leftIndicator:fe,rightIndicator:me,leftIcon:ye,rightIcon:ve,componentId:ge,status_id:be,wrapStyles:Ie,SelectedCellStyles:he,SelectorCellStyles:Ce,SelectorMode:_e,SelectorStyles:r,SelectorPosition:U}=m,s=H(m,["tone","required","form","className","label","isLabelActive","placeholder","enableFormSubmit","emptySelect","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","onKeyDown","onChange","value","options","leftIndicator","rightIndicator","leftIcon","rightIcon","componentId","status_id","wrapStyles","SelectedCellStyles","SelectorCellStyles","SelectorMode","SelectorStyles","SelectorPosition"]);return e.rootStates.SelectorMode!="legacy"?null:T(_,u(o({htmlTag:"select",tabIndex:0},s),{"data-disabled":t.disabled,"data-show-validation":k.isShowValidation(S,p,!!M),"data-component-id":p.componentId,"data-input-origin":p.componentId,className:[O,B("Core")].join(" "),onKeyDown:i=>{N&&N(i),P&&k.SubmitForm(i,x)},onChange:i=>{let{value:D}=i.target;S.ok&&I({ok:!1,notice:[]}),b(w=>u(o({},w),{dataValue:D,eventType:"update",eventID:C()})),K&&K(i)},children:[!!X&&a("option",{value:"null",children:"\u9078\u629E"}),G.map(i=>d.is.nullish(i==null?void 0:i.value)?null:a("option",{value:i==null?void 0:i.value,children:i.label},String(i==null?void 0:i.value)))]}))},Selector:e=>{var n;$(()=>{let c=d(`[data-selector-id="${e.val_status.componentId}"]`)[0];if(!c)return;let y=d(`[data-select-input-value="${e.val_optionFocused}"]`)[0];y&&(c.scrollTop=y.offsetTop-24)},[e.val_optionFocused]);let t=ae.FilterSelectableOptions(e,!0),l={position:"absolute",minWidth:1,freeCSS:{zIndex:1e3}};switch(e.rootStates.SelectorPosition){case 1:l.bottom="100%",l.left=0,l.paddingBottom="1/3";break;case 2:l.bottom="100%",l.right=0,l.paddingBottom="1/3";break;case 3:l.top="100%",l.left=0,l.paddingTop="1/3";break;case 4:l.top="100%",l.right=0,l.paddingTop="1/3";break;default:break}return a(_,u(o({},l),{children:a(xe.Body,u(o({className:B("Selector"),ssCardBox:!0,borderRadius:"2.tone.secondary",boxShadow:"1.normal",overflow:"auto","data-selector-id":e.val_status.componentId},e.rootStates.SelectorStyles),{freeCSS:o({minWidth:12*6,maxHeight:12*24},(n=e.rootStates.SelectorStyles)==null?void 0:n.freeCSS),children:T(Oe,{gap:"1/12",padding:[1,0],children:[t.map((c,y)=>{if(!c)return null;let{type:S,value:I}=c,p=e.val_optionFocused==c.id,b=e.val_status.dataValue===I;return S=="label"?a(_,{children:c.label},C()):a(Fe.Sub.S,u(o({"data-select-input-value":c.id,color:"cloud",backgroundColor:"trans",borderRadius:0,fontColor:"2.normal",textAlign:"left",padding:["1/2",1],isActive:b||p,isActiveStyles:p?{backgroundColor:"cloud"}:{backgroundColor:"theme.opa.few",fontColor:"theme"}},e.rootStates.SelectorCellStyles),{onClick:g=>{e.set_status(f=>u(o({},f),{dataValue:I,eventType:"update",eventID:C()})),e.set_selectorOpen(!1),e.set_preventOpenSelectorOnFocus(!0)},children:T(j.Left,{gap:"1/2",children:[b&&a(le.Check,{fontColor:"theme"}),a(W.Supplement,{transition:"short",flexSizing:0,children:c.label})]})}),c.id)}),!t.length&&a(W.Supplement,{padding:[0,1],fontColor:"4.thin",children:"\u5019\u88DC\u304C\u898B\u3064\u304B\u308A\u307E\u305B\u3093"},"no-selector-notice")]})}))}))},Selected:e=>{let t=[];return e.val_status.dataValue!==null&&d.scope(()=>{let l=e.rootStates.options.find(n=>d.is.equal(n==null?void 0:n.value,e.val_status.dataValue));l&&t.push(a(_,u(o({},e.rootStates.SelectedCellStyles),{children:l.label}),String(l==null?void 0:l.value)))}),a(J,{children:t})},Core:e=>{var L,x;let{value:t}=e,[l,n]=A(k.DefaultStatus(e.componentId,t)),[c,y]=A(!1),[S,I]=A(!1),[p,b]=A(((L=e.options.find(O=>(O==null?void 0:O.value)===e.value))==null?void 0:L.id)||((x=e.options[0])==null?void 0:x.id)||""),[g,f]=A({ok:!1,notice:[]}),E={rootStates:e,val_preventOpenSelectorOnFocus:c,set_preventOpenSelectorOnFocus:y,val_optionFocused:p,set_optionFocused:b,val_selectorOpen:S,set_selectorOpen:I,val_status:l,set_status:n,val_validate:g,set_validate:f};return k.CommonEffects({type:"select",states:e,val_status:l,set_status:n,val_validate:g,set_validate:f,SystemValidation:Be}),T(we,{val_status:l,set_status:n,val_validate:g,states:e,children:[a(ke,{componentId:e.componentId,fontSize:e.fontSize,required:e.required,label:e.label,isActive:e.isLabelActive||l.dataValue!==null}),a(V.Shallow,o({},E)),a(V.Button,o({},E))]})}},oe=e=>{var l;let t=o({},e);return t=u(o({emptySelect:!0,SelectorMode:"original",SelectorPosition:3},t),{freeCSS:o({cursor:"pointer"},t.freeCSS)}),t.emptySelect&&(t.options=[{value:null,label:a(W.Supplement,{fontColor:"4.thin",children:"\u672A\u9078\u629E"})},...t.options]),t.value=(l=t.value)!=null?l:null,t.options.forEach((n,c)=>{if(!n)return;let{type:y,value:S,searchValue:I}=n,p=I||d.is.string(S)&&S||d.Stringify(S||"")||"";t.options[c]=u(o({id:C()},n),{value:S,searchValue:p,type:y||"selector"})}),d.is.nullish(t.rightIcon)&&(t.rightIcon=a(Ae,{ssSphere:2,children:a(le.AngleDown,{})})),a(De,{componentId:t.componentId,children:V.Core,states:Re(t)})};export{oe as Select,oe as default};
@@ -1 +1 @@
1
- import{b as h,c as I,d as k}from"../../chunk-C5N2D3ZX.js";import{jsx as p,jsxs as W}from"react/jsx-runtime";import L,{UUID as E}from"jmini";import{useState as B,useEffect as P}from"react";import{$$fromRoot as D,GenerateHTMLProps as $}from"../../@utils";import{Box as x,Flex as A,Column as q}from"../../atoms";import{Button as O}from"../Button";import{OptionalInputWrapper as G,BoxWrapper as X,CoreEffects as F}from"./core";import{InputSliderClasses as c}from"../../@styles/componentClasses";function j(t){let{value:e,states:n}=t,{required:s}=n,o=[];return s&&!e&&o.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!o.filter(({type:i})=>i=="invalid").length,notice:o}}const z=t=>{let{value:e,val_status:n}=t,{min:s,max:o,step:i}=n;e=Math.max(e,s),e=Math.min(e,o);let a=e/o*o;return a=Math.round(a/i),{stepValue:a*i,stepIndex:a,positionLeft:a*i/o*100+"%"}},N={IndicatorLabels:t=>{let{componentId:e,min:n,max:s,step:o,customLegends:i}=t,r=[],a=Math.round(n/o),d=Math.round(s/o),S=d-a+1;for(var u=a;u<=d;u++){let l=u*o;l=Math.max(l,n),l=Math.min(l,s);let f=l/s*100+"%";r.push(p(x,{className:c("Label"),id:"Legend-"+e+"-"+u,display:u==a||u==d?"flex":"none",position:"absolute",top:0,unitHeight:1,unitWidth:1.5,transition:"middle",fontColor:"1.clear",verticalAlign:"center",horizontalAlign:"center",freeCSS:{left:f,whiteSpace:"nowrap",textAlign:"center"},children:i?i(l):l.rank()},l))}return P(()=>{const l=()=>{let f=D("#Labels-"+e),{width:v}=f.position(),C=Math.round(v/50)-1,g=Math.round(S/C);for(let m=a+1;m<d;m++)D("#Legend-"+e+"-"+m).css({display:m%g==0?"flex":"none"})};return L(window).addEvent({eventID:"SliderResizeCallback-"+e,eventType:"resize",callback:()=>{l()}}),l(),()=>{L(window).removeEvent("SliderResizeCallback-"+e)}},[]),p(A,{className:c("Labels"),verticalAlign:"center",horizontalAlign:"between",fontSize:"0.xs",position:"relative",unitHeight:1,id:"Labels-"+e,children:p(x,{position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:r})})},Rail:t=>{let{val_status:e,set_status:n,DotData:s,form:o,enableFormSubmit:i}=t,{componentId:r}=e;return W(A,{className:c("Rail"),position:"relative",paddingLeft:"1/2",unitHeight:1.5,verticalAlign:"center",freeCSS:{zIndex:1,cursor:"pointer"},onPointerDown:a=>{t.rootStates.disabled||(a.stopPropagation(),y.Effects.Start(a,{val_status:e,set_status:n,DotData:s}))},children:[p(x,{className:c("Bar"),backgroundColor:"layer.4",position:"relative",borderRadius:"1.tone.primary",transition:"middle",flexSizing:"none",unitHeight:"2/3",width:1,id:r+"_Bar",children:p(x,{className:c("BarColor"),position:"relative",height:1,width:0,left:0,transition:"long",borderRadius:"inherit",backgroundColor:t.color,opacity:"middle",overflow:"hidden",freeCSS:{width:s.positionLeft},id:r+"_BarColor"})}),p(x,{className:c("BallWrap"),position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:p(O.Plain,{className:c("Ball"),position:"absolute",boxShadow:"1.remark",backgroundColor:t.color,top:0,left:0,ssSquare:1.5,borderRadius:"1.tone.primary",freeCSS:{zIndex:2,left:s.positionLeft},id:r+"_Ball",onKeyDown:a=>{y.KeyDownEvent({event:a,val_status:e,set_status:n,DotData:s}),i&&F.SubmitForm(a,o)}})})]})}},y={Effects:{Start:(t,e)=>{L(document).addEvent({eventID:"SliderMouseMove",eventType:"mousemove",callback:n=>{y.Effects.Move(n,e)},options:{passive:!1}}).addEvent({eventID:"SliderTouchMove",eventType:"touchmove",callback:n=>{y.Effects.Move(n,e)},options:{passive:!1}}).addEvent({eventID:"SliderMouseUp",eventType:"mouseup",callback:()=>{y.Effects.End()}}).addEvent({eventID:"SliderTouchEnd",eventType:"touchend",callback:()=>{y.Effects.End()}})},Move:(t,e)=>{let n=L.getCursor(t).x,{val_status:s,set_status:o}=e,{componentId:i,min:r,max:a}=s,d=D("#"+i+"_Ball"),S=D("#"+i+"_Bar"),u=D("#"+i+"_BarColor"),{width:l,left:f}=S.position(),v=(n-f)/l;v=Math.max(v,0),v=Math.min(v,1);let C=v*a,g=z({value:C,val_status:s}),m=g.positionLeft,w=g.stepValue;return d.css({left:m}),u.css({width:m}),o(R=>{let T=R.dataValue;return w==T?R:I(h({},R),{dataValue:w,eventType:"update",eventID:E()})}),t.preventDefault(),t.stopPropagation(),!1},End:()=>{L(document).removeEvent(["SliderMouseMove","SliderTouchMove","SliderMouseUp","SliderTouchEnd"])}},KeyDownEvent:t=>{let{event:e,val_status:n,set_status:s}=t,{min:o,max:i,step:r}=n,{key:a,metaKey:d,ctrlKey:S}=e,u=S||d,l=n.dataValue;a.match(/Arrow/)&&(e.preventDefault(),a.match(/Left|Up/)?u?l=o:l-=r:a.match(/Right|Down/)&&(u?l=i:l+=r),l=Math.max(Math.min(l,i),o),s(f=>I(h({},f),{dataValue:l,eventType:"update",eventID:E()})))}},J=t=>{let V=t,{color:e="theme",required:n,form:s="",legends:{enable:o=!0,custom:i,showAlways:r=!1}={},min:a,max:d,step:S,enableFormSubmit:u,checkValidationAtFirst:l,onValidate:f,onValidateDelay:v,onUpdateValue:C,onUpdateValidValue:g,value:m="",className:w,wrapStyles:R}=V,T=k(V,["color","required","form","legends","min","max","step","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","value","className","wrapStyles"]),[b,_]=B({componentId:t.componentId||"",dataValue:m,min:a,max:d,step:S,eventType:"init",eventID:E()}),[M,K]=B({ok:!1,notice:[]});F.CommonEffects({type:"slider",states:t,val_status:b,set_status:_,val_validate:M,set_validate:K,SystemValidation:j});let U=z({value:b.dataValue,val_status:b});return p(X,{val_status:b,set_status:_,val_validate:M,states:t,children:W(q,I(h({gap:"1/2",flexSizing:"auto"},T),{className:[c("Wrap"),w,c("ShowLegendsAlways_"+r)].join(" "),children:[p(N.Rail,{rootStates:t,color:e,val_status:b,set_status:_,DotData:U,form:s,enableFormSubmit:u}),!!o&&p(N.IndicatorLabels,{componentId:b.componentId,min:a,max:d,step:S,customLegends:i})]}))})},H=t=>{let e=I(h({},t),{freeCSS:h({minWidth:120},t.freeCSS)});return p(G,{componentId:t.componentId,children:J,states:$(e)})};export{H as Slider,H as default};
1
+ import{b,c as h,d as B}from"../../chunk-C5N2D3ZX.js";import{jsx as p,jsxs as U}from"react/jsx-runtime";import L,{UUID as x}from"jmini";import{useState as k,useEffect as $}from"react";import{$$fromRoot as C,GenerateHTMLProps as q}from"../../@utils";import{Box as w,Flex as A,Column as O}from"../../atoms";import{Button as G}from"../Button";import{OptionalInputWrapper as X,BoxWrapper as j,CoreEffects as F}from"./core";import{InputSliderClasses as m}from"../../@styles/componentClasses";function J(t){let{value:e,states:o}=t,{required:s}=o,n=[];return s&&!e&&n.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!n.filter(({type:i})=>i=="invalid").length,notice:n}}const z=t=>{let{value:e,val_status:o}=t,{min:s,max:n,step:i}=o;e=Math.max(e,s),e=Math.min(e,n);let a=e/n*n;return a=Math.round(a/i),{stepValue:a*i,stepIndex:a,positionLeft:a*i/n*100+"%"}},N={IndicatorLabels:t=>{let{componentId:e,min:o,max:s,step:n,customLegends:i}=t,u=[],a=Math.round(o/n),r=Math.round(s/n),c=r-a+1;for(var d=a;d<=r;d++){let l=d*n;l=Math.max(l,o),l=Math.min(l,s);let S=l/s*100+"%";u.push(p(w,{className:m("Label"),id:"Legend-"+e+"-"+d,display:d==a||d==r?"flex":"none",position:"absolute",top:0,unitHeight:1,unitWidth:1.5,transition:"middle",fontColor:"1.clear",verticalAlign:"center",horizontalAlign:"center",freeCSS:{left:S,whiteSpace:"nowrap",textAlign:"center"},children:i?i(l):l.rank()},l))}return $(()=>{const l=()=>{let S=C("#Labels-"+e),{width:f}=S.position(),T=Math.round(f/50)-1,I=Math.round(c/T);for(let v=a+1;v<r;v++)C("#Legend-"+e+"-"+v).css({display:v%I==0?"flex":"none"})};return L(window).addEvent({eventID:"SliderResizeCallback-"+e,eventType:"resize",callback:()=>{l()}}),l(),()=>{L(window).removeEvent("SliderResizeCallback-"+e)}},[]),p(A,{className:m("Labels"),verticalAlign:"center",horizontalAlign:"between",fontSize:"0.xs",position:"relative",unitHeight:1,id:"Labels-"+e,children:p(w,{position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:u})})},Rail:t=>{let{val_status:e,set_status:o,DotData:s,form:n,enableFormSubmit:i}=t,{componentId:u}=e;return U(A,{className:m("Rail"),position:"relative",paddingLeft:"1/2",unitHeight:1.5,verticalAlign:"center",freeCSS:{zIndex:1,cursor:"pointer"},onPointerDown:a=>{t.rootStates.disabled||(a.stopPropagation(),g.Effects.Start(a,{val_status:e,set_status:o,DotData:s}))},children:[p(w,{className:m("Bar"),backgroundColor:"layer.4",position:"relative",borderRadius:"1.tone.primary",transition:"middle",flexSizing:"none",unitHeight:"2/3",width:1,id:u+"_Bar",children:p(w,{className:m("BarColor"),position:"relative",height:1,width:0,left:0,transition:"long",borderRadius:"inherit",backgroundColor:t.color,opacity:"middle",overflow:"hidden",freeCSS:{width:s.positionLeft},id:u+"_BarColor"})}),p(w,{className:m("BallWrap"),position:"absolute",top:0,left:0,bottom:0,freeCSS:{right:12*1.5},children:p(G.Plain,{className:m("Ball"),position:"absolute",boxShadow:"1.remark",backgroundColor:t.color,top:0,left:0,ssSquare:1.5,borderRadius:"1.tone.primary",freeCSS:{zIndex:2,left:s.positionLeft},id:u+"_Ball",onKeyDown:a=>{g.KeyDownEvent({event:a,val_status:e,set_status:o,DotData:s}),i&&F.SubmitForm(a,n)},onFocus:a=>{o(r=>h(b({},r),{eventID:x(),eventType:"focus.start",isFocusing:!0}))},onBlur:a=>{o(r=>h(b({},r),{eventID:x(),eventType:"focus.end",isFocusing:!1}))}})})]})}},g={Effects:{Start:(t,e)=>{L(document).addEvent({eventID:"SliderMouseMove",eventType:"mousemove",callback:o=>{g.Effects.Move(o,e)},options:{passive:!1}}).addEvent({eventID:"SliderTouchMove",eventType:"touchmove",callback:o=>{g.Effects.Move(o,e)},options:{passive:!1}}).addEvent({eventID:"SliderMouseUp",eventType:"mouseup",callback:()=>{g.Effects.End()}}).addEvent({eventID:"SliderTouchEnd",eventType:"touchend",callback:()=>{g.Effects.End()}})},Move:(t,e)=>{let o=L.getCursor(t).x,{val_status:s,set_status:n}=e,{componentId:i,min:u,max:a}=s,r=C("#"+i+"_Ball"),c=C("#"+i+"_Bar"),d=C("#"+i+"_BarColor"),{width:l,left:S}=c.position(),f=(o-S)/l;f=Math.max(f,0),f=Math.min(f,1);let T=f*a,I=z({value:T,val_status:s}),v=I.positionLeft,R=I.stepValue;return r.css({left:v}),d.css({width:v}),n(D=>{let E=D.dataValue;return R==E?D:h(b({},D),{dataValue:R,eventType:"update",eventID:x()})}),t.preventDefault(),t.stopPropagation(),!1},End:()=>{L(document).removeEvent(["SliderMouseMove","SliderTouchMove","SliderMouseUp","SliderTouchEnd"])}},KeyDownEvent:t=>{let{event:e,val_status:o,set_status:s}=t,{min:n,max:i,step:u}=o,{key:a,metaKey:r,ctrlKey:c}=e,d=c||r,l=o.dataValue;a.match(/Arrow/)&&(e.preventDefault(),a.match(/Left|Up/)?d?l=n:l-=u:a.match(/Right|Down/)&&(d?l=i:l+=u),l=Math.max(Math.min(l,i),n),s(S=>h(b({},S),{dataValue:l,eventType:"update",eventID:x()})))}},Q=t=>{let V=t,{color:e="theme",required:o,form:s="",legends:{enable:n=!0,custom:i,showAlways:u=!1}={},min:a,max:r,step:c,enableFormSubmit:d,checkValidationAtFirst:l,onValidate:S,onValidateDelay:f,onUpdateValue:T,onUpdateValidValue:I,onUserAction:v,value:R="",className:D,wrapStyles:E}=V,W=B(V,["color","required","form","legends","min","max","step","enableFormSubmit","checkValidationAtFirst","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","value","className","wrapStyles"]),[y,_]=k({componentId:t.componentId||"",dataValue:R,min:a,max:r,step:c,eventType:"init",eventID:x()}),[M,K]=k({ok:!1,notice:[]});F.CommonEffects({type:"slider",states:t,val_status:y,set_status:_,val_validate:M,set_validate:K,SystemValidation:J});let P=z({value:y.dataValue,val_status:y});return p(j,{val_status:y,set_status:_,val_validate:M,states:t,children:U(O,h(b({gap:"1/2",flexSizing:"auto"},W),{className:[m("Wrap"),D,m("ShowLegendsAlways_"+u)].join(" "),children:[p(N.Rail,{rootStates:t,color:e,val_status:y,set_status:_,DotData:P,form:s,enableFormSubmit:d}),!!n&&p(N.IndicatorLabels,{componentId:y.componentId,min:a,max:r,step:c,customLegends:i})]}))})},H=t=>{let e=h(b({},t),{freeCSS:b({minWidth:120},t.freeCSS)});return p(X,{componentId:t.componentId,children:Q,states:q(e)})};export{H as Slider,H as default};
@@ -1 +1 @@
1
- import{b as a,c as i,d as k}from"../../chunk-C5N2D3ZX.js";import{jsx as t,jsxs as N}from"react/jsx-runtime";import{UUID as F}from"jmini";import{useState as M}from"react";import c from"../../atoms/Box";import{Row as U}from"../../mols";import{Label as W}from"../Button";import{OptionalInputWrapper as A,BoxWrapper as P,CoreEffects as D}from"./core";import{InputSwitchClasses as f}from"../../@styles/componentClasses";function H(e){let{value:o,states:n}=e,{required:R}=n,l=[];return R&&!o&&l.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!l.filter(({type:m})=>m=="invalid").length,notice:l}}const O=e=>{let V=e,{componentId:o,color:n="posi",required:R,form:l,id:m,enableFormSubmit:z,checkValidationAtFirst:q,onChange:w,onKeyDown:x,onValidate:K,onValidateDelay:$,onUpdateValue:G,onUpdateValidValue:J,size:C="regular",value:B="",icon:v="",isApply:s=!1}=V,E=k(V,["componentId","color","required","form","id","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","size","value","icon","isApply"]),[r,S]=M({componentId:e.componentId||"",dataValue:B,eventType:"init",eventID:F()}),[b,T]=M({ok:!1,notice:[]}),p=!!r.dataValue;D.CommonEffects({type:"switch",states:e,val_status:r,set_status:S,val_validate:b,set_validate:T,SystemValidation:H});let h="middle",g=5,I=3;return s&&(I=4),N(P,{val_status:r,set_status:S,val_validate:b,states:e,children:[t(c,a({htmlTag:"input",type:"checkbox","data-component-id":r.componentId,checked:r.dataValue,className:f("Input"),id:m,onKeyDown:d=>{x&&x(d),z&&D.SubmitForm(d,l)},onChange:d=>{let{checked:L}=d.target;b.ok&&T({ok:!1,notice:[]}),S(_=>i(a({},_),{dataValue:L,eventType:"update",eventID:F()})),w&&w(d)}},E)),t(W.Plain,{tabIndex:-1,htmlFor:m,padding:"1/4",transition:h,borderRadius:"1.tone.primary",className:f("Label"),children:t(c,i(a({},s?{padding:"1/4",isRounded:!0,backgroundColor:p?n:"layer.3"}:{}),{children:N(U.Center,{unitHeight:C=="small"?2:C=="regular"?2.5:C=="large"?3:0,position:"relative",freeCSS:{aspectRatio:(g+I)/g},children:[!s&&t(c,{position:"absolute",backgroundColor:p?n:"layer.5",isRounded:!0,transition:h,width:1,opacity:"middle",className:f("Bar"),freeCSS:{height:"40%"}}),t(c,{position:"absolute",top:0,backgroundColor:!s&&p?n:"white",transition:h,isRounded:!0,flexCenter:!0,boxShadow:"1.remark",className:f("Dot"),freeCSS:{height:"100%",aspectRatio:"1",left:p?`calc(${I.ratio(g+I)}%)`:0},children:v&&t(c,{transition:h,flexCenter:!0,fontColor:p?s?n:"white":"6.clear",children:v})})]})}))})]})},y=e=>{let o=a({},e);return o.value=!!o.value,o.color=o.color||"theme",t(A,{componentId:o.componentId,children:O,states:o})},u=y;u.S=e=>t(y,i(a({},e),{size:"small"})),u.R=e=>t(y,i(a({},e),{size:"regular"})),u.L=e=>t(y,i(a({},e),{size:"large"}));export{u as Switch,u as default};
1
+ import{b as o,c as l,d as D}from"../../chunk-C5N2D3ZX.js";import{jsx as a,jsxs as z}from"react/jsx-runtime";import{UUID as S}from"jmini";import{useState as M}from"react";import I from"../../atoms/Box";import{Row as U}from"../../mols";import{Label as A}from"../Button";import{OptionalInputWrapper as W,BoxWrapper as P,CoreEffects as N}from"./core";import{InputSwitchClasses as g}from"../../@styles/componentClasses";function H(e){let{value:n,states:s}=e,{required:x}=s,r=[];return x&&!n&&r.push({type:"invalid",label:"ON\u306B\u306A\u3063\u3066\u3044\u307E\u305B\u3093"}),{ok:!r.filter(({type:h})=>h=="invalid").length,notice:r}}const O=e=>{let B=e,{componentId:n,color:s="posi",required:x,form:r,id:h,enableFormSubmit:E,checkValidationAtFirst:q,onChange:F,onKeyDown:T,onValidate:K,onValidateDelay:$,onUpdateValue:G,onUpdateValidValue:J,onUserAction:Q,size:v="regular",value:L="",icon:V="",isApply:p=!1}=B,t=D(B,["componentId","color","required","form","id","enableFormSubmit","checkValidationAtFirst","onChange","onKeyDown","onValidate","onValidateDelay","onUpdateValue","onUpdateValidValue","onUserAction","size","value","icon","isApply"]),[u,c]=M({componentId:e.componentId||"",dataValue:L,eventType:"init",eventID:S()}),[R,k]=M({ok:!1,notice:[]}),d=!!u.dataValue;N.CommonEffects({type:"switch",states:e,val_status:u,set_status:c,val_validate:R,set_validate:k,SystemValidation:H});let y="middle",w=5,C=3;return p&&(C=4),z(P,{val_status:u,set_status:c,val_validate:R,states:e,children:[a(I,l(o({htmlTag:"input",type:"checkbox","data-component-id":u.componentId,checked:u.dataValue,className:g("Input"),id:h,onKeyDown:i=>{T&&T(i),E&&N.SubmitForm(i,r)},onChange:i=>{let{checked:m}=i.target;R.ok&&k({ok:!1,notice:[]}),c(_=>l(o({},_),{dataValue:m,eventType:"update",eventID:S()})),F&&F(i)}},t),{onFocus:i=>{t!=null&&t.onFocus&&(t==null||t.onFocus(i)),c(m=>l(o({},m),{eventID:S(),eventType:"focus.start",isFocusing:!0}))},onBlur:i=>{t!=null&&t.onBlur&&(t==null||t.onBlur(i)),c(m=>l(o({},m),{eventID:S(),eventType:"focus.end",isFocusing:!1}))}})),a(A.Plain,{tabIndex:-1,htmlFor:h,padding:"1/4",transition:y,borderRadius:"1.tone.primary",className:g("Label"),children:a(I,l(o({},p?{padding:"1/4",isRounded:!0,backgroundColor:d?s:"layer.3"}:{}),{children:z(U.Center,{unitHeight:v=="small"?2:v=="regular"?2.5:v=="large"?3:0,position:"relative",freeCSS:{aspectRatio:(w+C)/w},children:[!p&&a(I,{position:"absolute",backgroundColor:d?s:"layer.5",isRounded:!0,transition:y,width:1,opacity:"middle",className:g("Bar"),freeCSS:{height:"40%"}}),a(I,{position:"absolute",top:0,backgroundColor:!p&&d?s:"white",transition:y,isRounded:!0,flexCenter:!0,boxShadow:"1.remark",className:g("Dot"),freeCSS:{height:"100%",aspectRatio:"1",left:d?`calc(${C.ratio(w+C)}%)`:0},children:V&&a(I,{transition:y,flexCenter:!0,fontColor:d?p?s:"white":"6.clear",children:V})})]})}))})]})},b=e=>{let n=o({},e);return n.value=!!n.value,n.color=n.color||"theme",a(W,{componentId:n.componentId,children:O,states:n})},f=b;f.S=e=>a(b,l(o({},e),{size:"small"})),f.R=e=>a(b,l(o({},e),{size:"regular"})),f.L=e=>a(b,l(o({},e),{size:"large"}));export{f as Switch,f as default};
@@ -37,10 +37,6 @@ declare namespace TextField {
37
37
  };
38
38
  type WrapperStates = {
39
39
  rootStates: Input;
40
- val_focus: boolean;
41
- set_focus: React.Dispatch<React.SetStateAction<boolean>>;
42
- val_isComposing: boolean;
43
- set_isComposing: React.Dispatch<React.SetStateAction<boolean>>;
44
40
  val_status: InputTypes.Status.Text;
45
41
  set_status: React.Dispatch<React.SetStateAction<InputTypes.Status.Text>>;
46
42
  val_inputType: React.HTMLInputTypeAttribute;